登录增加验证码验证

 import http from './http.js'
 import http from './http.js'
 // let baseUrl = '/cloud-user-center/user'
 // let baseUrl = '/cloud-user-center/user'
 let baseUrl = '/cloud-kako-user-center/user'
 let baseUrl = '/cloud-kako-user-center/user'
-let baseCode = '/cloud-kako-user-center/randCode'
-export const getUserList = params => { return http.get(`${baseUrl}/list`,  params); };
 
 
-export const getRandCode = params => { return http.get(`${baseCode}`,  params); };
+export const getUserList = params => { return http.get(`${baseUrl}/list`,  params); };
 
 
 export const getUserListPage = params => { return http.get(`/user/list`,params) };
 export const getUserListPage = params => { return http.get(`/user/list`,params) };
 
 
@@ -21,3 +19,6 @@ export const addUser = params => { return http.post(`${baseUrl}/add`,params)};
 export const setUserRole = params => { return http.put(`${baseUrl}/roleset`,params)};
 export const setUserRole = params => { return http.put(`${baseUrl}/roleset`,params)};
 
 
 export const resetToken = params => { return http.put(`${baseUrl}/resetToken`,params)};
 export const resetToken = params => { return http.put(`${baseUrl}/resetToken`,params)};
+
+export const getRandCode = params => { return http.post('/cloud-kako-user-center/anonymous/randCode',  params); };
+

@@ -6,7 +6,17 @@
         <el-input type="text" v-model="ruleForm2.account" autofocus placeholder="账号"></el-input>
         <el-input type="text" v-model="ruleForm2.account" autofocus placeholder="账号"></el-input>
       </el-form-item>
       </el-form-item>
       <el-form-item prop="checkPass">
       <el-form-item prop="checkPass">
-        <el-input type="password" v-model="ruleForm2.checkPass"  placeholder="密码" @keyup.enter.native="handleSubmit2"></el-input>
+        <el-input type="password" v-model="ruleForm2.checkPass"  placeholder="密码"></el-input>
+      </el-form-item>
+      <el-form-item prop="verify">
+        <el-input type="text" v-model="ruleForm2.verify"  placeholder="请输入下方图片显示的验证码" @keyup.enter.native="handleSubmit2"></el-input>
+      </el-form-item>
+      <el-form-item>
+        <img
+                style="width: 125px; height: 60px"
+                :src="verifyImg"
+                @click="getVerifyCode"
+        >
       </el-form-item>
       </el-form-item>
 <!--      <el-form-item prop="checkPass">-->
 <!--      <el-form-item prop="checkPass">-->
 <!--        <el-input type="password" v-model="ruleForm2.checkPass"  placeholder="密码" @keyup.enter.native="handleSubmit2"></el-input>-->
 <!--        <el-input type="password" v-model="ruleForm2.checkPass"  placeholder="密码" @keyup.enter.native="handleSubmit2"></el-input>-->
@@ -42,13 +52,15 @@
   export default {
   export default {
     data() {
     data() {
       return {
       return {
+        verifyImg: "",
         vedioCanPlay: true,
         vedioCanPlay: true,
         fixStyle: '',
         fixStyle: '',
         logining: false,
         logining: false,
         ruleForm2: {
         ruleForm2: {
           account: '',
           account: '',
-          checkPass: ''
-          // checkPass: 'vmvnv1v2VV'
+          checkPass: '',
+          verify: '',
+          verifyToken: ''
         },
         },
         rules2: {
         rules2: {
             account: [
             account: [
@@ -58,6 +70,9 @@
             checkPass: [
             checkPass: [
               { required: true, message: '请输入密码', trigger: 'blur' },
               { required: true, message: '请输入密码', trigger: 'blur' },
               //{ validator: validaePass2 }
               //{ validator: validaePass2 }
+            ],
+            checkVerify: [
+              { required: true, message: '请输入验证码', trigger: 'blur' }
             ]
             ]
           },
           },
         checked: true,
         checked: true,
@@ -101,9 +116,12 @@
 //            本地存储用户目录 ，防刷新目录丢失用
 //            本地存储用户目录 ，防刷新目录丢失用
             sessionStorage.setItem('menu', JSON.stringify(_this.$router.options.routes));
             sessionStorage.setItem('menu', JSON.stringify(_this.$router.options.routes));
         },
         },
-        randCode: function(){
-          getRandCode().then((res) =>{
 
 
+      getVerifyCode: function(){
+        getRandCode().then((res) =>{
+          let status = res.status;
+          this.ruleForm2.verifyToken  = res.data.jwtToken;
+          this.verifyImg =   res.data.data.verifyImg;
         }).catch({
         }).catch({
 
 
         });
         });
@@ -115,7 +133,7 @@
                     //_this.$router.replace('/table');
                     //_this.$router.replace('/table');
                     this.logining = true;
                     this.logining = true;
                     //NProgress.start();
                     //NProgress.start();
-                    var loginParams = {username: this.ruleForm2.account, password: this.ruleForm2.checkPass};
+                    var loginParams = {username: this.ruleForm2.account, password: this.ruleForm2.checkPass, verify: this.ruleForm2.verify,verifyToken:this.ruleForm2.verifyToken};
                     http.login(loginParams).then(res => {
                     http.login(loginParams).then(res => {
                         this.logining = false;
                         this.logining = false;
                         //NProgress.done();
                         //NProgress.done();
@@ -189,9 +207,12 @@
                       'margin-bottom': 'initial'
                       'margin-bottom': 'initial'
                   }
                   }
               }
               }
-          }
+          },
         window.onresize();
         window.onresize();
         // this.randCode();
         // this.randCode();
+    },
+    created(){
+      this.getVerifyCode()
     }
     }
   }
   }