申请方案弹窗参数修改

pages/courseResource/index.vue

@@ -102,24 +102,24 @@
       <p>{{footerText}}</p>
     </el-dialog>
 
-    <!--  申请方案弹窗 -->
+    <!-- 申请方案弹窗-->
     <el-dialog
       :close-on-click-modal="false"
-      :visible.sync="telDl"
-      @close="delDlClose"
+      :visible.sync="sqfaDl"
+      @close="sqfaDlClose"
       class="application-scheme-dialog"
       center>
       <i></i>
       <p>免费获得课程开发解决方案</p>
-      <el-form :model="telChangeDate" status-icon :rules="telRules" ref="ruleTelForm" class="application-scheme-form">
+      <el-form :model="sqfaDialogDate" status-icon :rules="sqfaTelRules" ref="ruleTelForm" class="application-scheme-form">
         <el-form-item  prop="tel">
-          <el-input v-model="telChangeDate.tel" placeholder="请输入手机号" class="dialog-input-tel"></el-input>
+          <el-input v-model="sqfaDialogDate.tel" placeholder="请输入手机号" class="dialog-input-tel"></el-input>
         </el-form-item>
         <div id="your-dom-id" class="nc-container"></div>
         <el-form-item prop="verification">
           <div class="verification">
-            <el-input v-model="telChangeDate.verification" placeholder="请输入验证码" class="dialog-input-code"></el-input>
-            <el-button  @click="checkVerification" :disabled="btnTextDisabled" class="dialog-code-btn">{{btnText}}</el-button>
+            <el-input v-model="sqfaDialogDate.verification" placeholder="请输入验证码" class="dialog-input-code"></el-input>
+            <el-button  @click="checkVerification" :disabled="sqfaBtnDisabled" class="dialog-code-btn">{{sqfaBtnText}}</el-button>
           </div>
         </el-form-item>
       </el-form>
@@ -324,14 +324,15 @@
 
 
         ],
-        btnTextDisabled: false,
-        telDl: false,
-        btnText:         '获取验证码',
-        countdown:       60, // 60秒倒计时
-        sliderData:      {},
-        appKey:          'FFFF0N00000000007EC0',
-        telChangeDate:   {},
-        telRules:        {
+        sqfaDl:false,// 申请方案弹窗
+        sqfaDialogDate:   {},
+
+        sqfaBtnDisabled: false,
+        sqfaBtnText:         '获取验证码',
+        sqfaCountdown:       60, // 60秒倒计时
+        sqfaSliderData:      {},
+        sqfaAppKey:          'FFFF0N00000000007EC0',
+        sqfaTelRules:        {
           tel:          [
             { trigger: 'blur', required: true, message: '请输入手机号' },
           ],
@@ -339,7 +340,6 @@
             { trigger: 'blur', required: true, message: '请输入验证码' },
           ],
         },
-        divType:'kckf',
 
       };
     },
@@ -378,7 +378,7 @@
 
       },
       applyFun() {
-          this.telDl = true;
+          this.sqfaDl = true;
           this.sliderFun();
       },
 
@@ -387,13 +387,13 @@
           if (valid) {
             // 请求后台
             const options = {
-              phone:  this.telChangeDate.tel,
-              code: this.telChangeDate.verification,
+              phone:  this.sqfaDialogDate.tel,
+              code: this.sqfaDialogDate.verification,
             };
 
             this.$axios.$post('/develop/add',options).then(res=>{
               if (res.code === 0 && res.data) {
-                this.telDl = false;
+                this.sqfaDl = false;
                 this.$message.success('申请成功');
               } else {
                 this.$message.error('申请失败');
@@ -405,12 +405,12 @@
       },
 
 
-      delDlClose(){
-        this.telDl  =false
+      sqfaDlClose(){
+        this.sqfaCountdown = -1;
+        this.sqfaSliderData.sqfaAppKey=undefined;
+        this.sqfaDl = false;
         this.$refs.ruleTelForm.resetFields();
         __nc.reset();
-
-
       },
 
       /**
@@ -448,13 +448,13 @@
       },
       // 滑块
       sliderFun() {
-        const nc_token = [this.appKey, (new Date()).getTime(), Math.random()].join(':');
+        const nc_token = [this.sqfaAppKey, (new Date()).getTime(), Math.random()].join(':');
         console.log(nc_token);
         const NC_Opt = {
           //声明滑动验证需要渲染的目标元素ID。
           renderTo:    '#your-dom-id',
           //应用类型标识。它和使用场景标识（scene字段）一起决定了滑动验证的业务场景与后端对应使用的策略模型。您可以在人机验证控制台的配置管理页签找到对应的appkey字段值，请务必正确填写。
-          appkey:      this.appKey,
+          appkey:      this.sqfaAppKey,
           //使用场景标识。它和应用类型标识（appkey字段）一起决定了滑动验证的业务场景与后端对应使用的策略模型。您可以在人机验证控制台的配置管理页签找到对应的scene值，请务必正确填写。
           scene:       'nc_message',
           //滑动验证码的主键，请勿将该字段定义为固定值。确保每个用户每次打开页面时，其token值都是不同的。系统默认的格式为：”您的appkey”+”时间戳”+”随机数”。
@@ -488,11 +488,11 @@
           },
           //前端滑动验证通过时会触发该回调参数。您可以在该回调参数中将请求标识（token）、会话ID（sessionid）、签名串（sig）字段记录下来，随业务请求一同发送至您的服务端调用验签。
           callback:    (data) => {
-            this.sliderData = Object.assign({}, data, {
-              appkey: NC_Opt.appkey,
+            this.sqfaSliderData = Object.assign({}, data, {
+              sqfaAppKey: NC_Opt.appkey,
               scene:  NC_Opt.scene,
             });
-            console.log( this.sliderData);
+            console.log( this.sqfaSliderData);
           },
         };
         let date11 = () => {
@@ -525,14 +525,18 @@
 
       // 倒计时60秒
       setTime() {
-        if (this.countdown === 0) {
-          this.btnTextDisabled = false;
-          this.btnText = '免费获取验证码';
-          this.countdown = 60;
-        } else {
-          this.btnTextDisabled = true;
-          this.btnText = '重新发送(' + this.countdown + 's)';
-          this.countdown--;
+        if (this.sqfaCountdown === 0) {
+          this.sqfaBtnDisabled = false;
+          this.sqfaBtnText = '获取验证码';
+          this.sqfaCountdown = 60;
+        } else if(this.sqfaCountdown === -1){
+          this.sqfaBtnDisabled = false;
+          this.sqfaBtnText = '获取验证码';
+          this.sqfaCountdown = 60;
+        }else {
+          this.sqfaBtnDisabled = true;
+          this.sqfaBtnText = '重新发送(' + this.sqfaCountdown + 's)';
+          this.sqfaCountdown--;
           setTimeout(() => {
             this.setTime();
           }, 1000);
@@ -540,21 +544,25 @@
       },
       // 验证码
       checkVerification() {
-        if (this.sliderData.appkey === undefined) {
+        if (this.sqfaDialogDate.tel === undefined) {
+          this.$message.error('请输入手机号');
+          return;
+        }
+        if (this.sqfaSliderData.sqfaAppKey === undefined) {
           this.$message.error('请先进行滑块校验');
           return;
         }
-        this.$axios.$post(`/develop/exists`,{  phone: this.telChangeDate.tel}).then(res=>{
+        this.$axios.$post(`/develop/exists`,{  phone: this.sqfaDialogDate.tel}).then(res=>{
 
           if (res.code === 0 && res.data) {
 
             let req = {
-              'appkey':    this.sliderData.appkey,
-              'phone':     this.telChangeDate.tel,
-              'scene':     this.sliderData.scene,
-              'sessionid': this.sliderData.csessionid,
-              'sig':       this.sliderData.sig,
-              'token':     this.sliderData.token,
+              'appkey':    this.sqfaSliderData.sqfaAppKey,
+              'phone':     this.sqfaDialogDate.tel,
+              'scene':     this.sqfaSliderData.scene,
+              'sessionid': this.sqfaSliderData.csessionid,
+              'sig':       this.sqfaSliderData.sig,
+              'token':     this.sqfaSliderData.token,
               'type':      0,
             }
             this.$axios.$post('/sendCode',req).then(res=>{
@@ -565,18 +573,13 @@
               }
             })
           } else {
-            this.$message.error(res.msg||'手机号已存在');
+            this.$message.error('手机号已存在');
             return false;
           }
 
         })
       },
 
-
-
-
-
-
       playVideo(index){
         this.videoDialogFlag = true
         this.source = this.videoArray[index].url