微信扫码绑定机构运营人员短信验证

src/main/resources/static/js/account/bind.js

@@ -19,7 +19,7 @@ var bindPage = new Vue({
         codeImageToken:'',
         imageCode:'',
         activeNum:0,
-        loginTabs:0,
+        loginTabs:1,
         isDisabled:true,
         isSubDisabled:true,
         mobilCount1:0,
@@ -136,22 +136,7 @@ var bindPage = new Vue({
                 UserApi.userOperateCode(_self.smsCodeParams,function (response) {
                     if(response.code === 0){
                         CAIMEI.dialog('获取验证码成功~',false,function () {});
-                        const TIME_COUNT = 60;
-                        if (!_self.mobilTime1) {
-                            _self.mobilCount1 = TIME_COUNT;
-                            _self.isMobileDisabled1 = true;
-                            _self.mobilTime1 = setInterval(function(){
-                                if (_self.mobilCount1 > 1 && _self.mobilCount1 <= TIME_COUNT) {
-                                    _self.mobilCount1--;
-                                    _self.mobileCodeText1 = _self.mobilCount1 +'s';
-                                } else {
-                                    _self.isMobileDisabled1 = false;
-                                    clearInterval(_self.mobilTime1);
-                                    _self.mobilTime1 = null;
-                                    _self.mobileCodeText1 = '获取验证码';
-                                }
-                            },1000)
-                        }
+                        _self.genereateMobileCodeText()
                     }else{
                         CAIMEI.Alert(response.msg,'确定',false);
                         _self.isMobileDisabled1 = false;
@@ -222,7 +207,11 @@ var bindPage = new Vue({
             }else{
                 this.bindCodeParams.bindMobile = this.codeParams.mobile
             }
-            this.bindCodeParams.mobile = this.userParams.mobile
+            if(this.activeNum === 0){
+                this.bindCodeParams.mobile = this.codeParams.mobile
+            }else{
+                this.bindCodeParams.mobile = this.userParams.mobile
+            }
             if( this.isMobileDisabled){ return }
             this.$nextTick(function() {
                 if (!verifyCheack('.codeMsgButton')) {return false; }
@@ -230,22 +219,7 @@ var bindPage = new Vue({
                     if(response.code === 0){
                         _self.isCodeModel = false;
                         CAIMEI.dialog('验证短信已发送',false,function () {});
-                        var TIME_COUNT = 60;
-                        if (!_self.mobilTime) {
-                            _self.mobilCount = TIME_COUNT;
-                            _self.isMobileDisabled = true;
-                            _self.mobilTime = setInterval(function(){
-                                if (_self.mobilCount > 1 && _self.mobilCount <= TIME_COUNT) {
-                                    _self.mobilCount--;
-                                    _self.mobileCodeText = _self.mobilCount +'s重新发送';
-                                } else {
-                                    _self.isMobileDisabled = false;
-                                    clearInterval(_self.mobilTime);
-                                    _self.mobilTime = null;
-                                    _self.mobileCodeText = '获取验证码';
-                                }
-                            },1000)
-                        }
+                        _self.genereateMobileCodeText()
                     }else{
                         _self.handleShowImage();
                         _self.isMobileDisabled = false;
@@ -254,6 +228,39 @@ var bindPage = new Vue({
                 })
             })
         },
+        genereateMobileCodeText: function(){
+            const TIME_COUNT = 60;
+            const _self = this
+            if(this.activeNum === 0 && !_self.mobilTime1){
+                _self.mobilCount1 = TIME_COUNT;
+                _self.isMobileDisabled1 = true;
+                _self.mobilTime1 = setInterval(function(){
+                    if (_self.mobilCount1 > 1 && _self.mobilCount1 <= TIME_COUNT) {
+                        _self.mobilCount1--;
+                        _self.mobileCodeText1 = _self.mobilCount1 +'s';
+                    } else {
+                        _self.isMobileDisabled1 = false;
+                        clearInterval(this.mobilTime1);
+                        _self.mobilTime1 = null;
+                        _self.mobileCodeText1 = '获取验证码';
+                    }
+                },1000)
+            }else if(this.activeNum === 1 && !_self.mobilTime){
+                _self.mobilCount = TIME_COUNT;
+                _self.isMobileDisabled = true;
+                _self.mobilTime = setInterval(function(){
+                    if (_self.mobilCount > 1 && _self.mobilCount <= TIME_COUNT) {
+                        _self.mobilCount--;
+                        _self.mobileCodeText = _self.mobilCount +'s重新发送';
+                    } else {
+                        _self.isMobileDisabled = false;
+                        clearInterval(_self.mobilTime);
+                        _self.mobilTime = null;
+                        _self.mobileCodeText = '获取验证码';
+                    }
+                },1000)
+            }
+        },
         setStorages:function(data){//存储本地数据
             localStorage.setItem('userInfo',JSON.stringify(data));
         },

src/main/resources/templates/account/bind.html

@@ -28,26 +28,9 @@
                 <template v-if="activeNum === 0">
                     <div class="title">确认公司账号</div>
                     <div class="formLine-tabs">
-                        <a class="tabs-item" :class="{ current: loginTabs === 0 }" href="javascript:void(0);" @click="handleTabsClick(0)">账号密码确认</a>
                         <a class="tabs-item" :class="{ current: loginTabs === 1 }" href="javascript:void(0);" @click="handleTabsClick(1)">验证码确认</a>
+                        <a class="tabs-item" :class="{ current: loginTabs === 0 }" href="javascript:void(0);" @click="handleTabsClick(0)">账号密码确认</a>
                     </div>
-                    <template v-if="loginTabs === 0">
-                        <div class="formLine">
-                            <p><em>*</em>账号：</p>
-                            <input class="mobileOrEmail" type="text" autocomplete="off" v-model.trim="userParams.mobileOrEmail" placeholder="请输入邮箱/手机号" @input="handleInputMobileOrEmail" :rule="rule.mobileOrEmail" maxlength="50" @blur="blurHandle($event)" needverify>
-                            <i class="checked icon mIcon"></i>
-                            <span class="errTips icon mIcon" tips="请输入邮箱/手机号"></span>
-                        </div>
-                        <div class="formLine">
-                            <p><em>*</em>登录密码：</p>
-                            <input type="password" v-model.trim="userParams.password" autocomplete="new-password" placeholder="请输入8-16位数字和字母组合" @input="handleInputPassword" :rule="rule.password" maxlength="32" @blur="blurHandle($event)" needverify>
-                            <i class="checked icon mIcon"></i>
-                            <span class="errTips icon mIcon" tips="8-16位数字或字母或字符"></span>
-                        </div>
-                        <div class="subLine">
-                            <button class="btn" type="button" :class="isDisabled ? 'disabled' : ''"  @click="handleStepNext">下一步</button>
-                        </div>
-                    </template>
                     <template v-if="loginTabs === 1">
                         <div class="formLine" >
                             <p><em>*</em>手机号：</p>
@@ -60,7 +43,24 @@
                             <input type="text" class="smscode" v-model.trim="codeParams.code" autocomplete="off" placeholder="请输入短信验证码" @input="handleInputSmsCode" :rule="rule.code"  maxlength="6" @blur="blurHandle($event)" needverify>
                             <i class="checked icon mIcon"></i>
                             <span class="errTips icon mIcon" tips="请输入短信验证码"></span>
-                            <a class="code-btn" href="javascript:void(0);" @click="handleMobileCode" :class="[isMobileDisabled1  ? 'disabled' : '']">{{ mobileCodeText1 }}</a>
+                            <a class="code-btn" href="javascript:void(0);" @click="handleShowImage" :class="[isMobileDisabled1  ? 'disabled' : '']">{{ mobileCodeText1 }}</a>
+                        </div>
+                        <div class="subLine">
+                            <button class="btn" type="button" :class="isDisabled ? 'disabled' : ''"  @click="handleStepNext">下一步</button>
+                        </div>
+                    </template>
+                    <template v-if="loginTabs === 0">
+                        <div class="formLine">
+                            <p><em>*</em>账号：</p>
+                            <input class="mobileOrEmail" type="text" autocomplete="off" v-model.trim="userParams.mobileOrEmail" placeholder="请输入邮箱/手机号" @input="handleInputMobileOrEmail" :rule="rule.mobileOrEmail" maxlength="50" @blur="blurHandle($event)" needverify>
+                            <i class="checked icon mIcon"></i>
+                            <span class="errTips icon mIcon" tips="请输入邮箱/手机号"></span>
+                        </div>
+                        <div class="formLine">
+                            <p><em>*</em>登录密码：</p>
+                            <input type="password" v-model.trim="userParams.password" autocomplete="new-password" placeholder="请输入8-16位数字和字母组合" @input="handleInputPassword" :rule="rule.password" maxlength="32" @blur="blurHandle($event)" needverify>
+                            <i class="checked icon mIcon"></i>
+                            <span class="errTips icon mIcon" tips="8-16位数字或字母或字符"></span>
                         </div>
                         <div class="subLine">
                             <button class="btn" type="button" :class="isDisabled ? 'disabled' : ''"  @click="handleStepNext">下一步</button>