update:

1. 同步适配登录验证码 2. 增加定时用户在线心跳 3. 用户列表锁定状态,禁用状态显示

update:
1. 同步适配登录验证码 2. 增加定时用户在线心跳 3. 用户列表锁定状态,禁用状态显示
朱兆平
src/api/user.js
src/common/init/sys_init.js
src/views/HomeNew.vue
src/views/Login.vue
src/views/nav1/user.vue
--- a/src/api/user.js
查看文件 @decbf65
+++ b/src/api/user.js
查看文件 @decbf65
 import http from './http.js'
 import jsutil from "@/common/js/util";
 let baseUrl = '/cloud-user-center/user'
+const serviceName = '/cloud-user-center'
 // 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 getRandCode = params => { return http.get(`/cloud-user-center/anonymous/randCode`,  params); };
 export const getUserListPage = params => { return http.get(`/user/list`,params) };
@@ -19,10 +20,13 @@ export const editUser = params => { return http.put(`${baseUrl}/edit`,params)};
 export const addUser = params => { return http.post(`${baseUrl}/add`,params)};
+export const heartBeat = params => { return http.post(`${serviceName}/heartbeat`,params)};
+
 export const setUserRole = params => { return http.put(`${baseUrl}/roleset`,params)};
 export const resetToken = params => { return http.put(`${baseUrl}/resetToken`,params)};
+
 export const loginedUserInfo = () => {
     let session_user_info = sessionStorage.getItem('user');
     if (session_user_info && jsutil.checkNull(session_user_info)){
--- a/src/common/init/sys_init.js
查看文件 @decbf65
+++ b/src/common/init/sys_init.js
查看文件 @decbf65
@@ -19,6 +19,11 @@ var axois_init = {
                 return res;
             },
             error => {
+                // 抓取报错信息
+                let errmsg = '';
+                if (error.response.data.message){
+                    errmsg  += error.response.data.message
+                }
                 // 用户登录的时候会拿到一个基础信息,比如用户名,token,过期时间戳
                 // 直接丢sessionStorage
                 if (!sessionStorage.getItem("token")) {
@@ -33,7 +38,7 @@ var axois_init = {
                 if (error.response.status === 401) {
                     message({
                         //  饿了么的消息弹窗组件
-                        message: '授权超时，或访问未授权，请重新登录',
+                        message: errmsg + '授权超时，或访问未授权，请重新登录;',
                         type: "error"
                     });
                 }
@@ -80,7 +85,7 @@ var axois_init = {
                 }
                 // 返回 response 里的错误信息
-                return Promise.reject(errorInfo);
+                return Promise.reject(errorInfo + errmsg);
             }
         );
     },
--- a/src/views/HomeNew.vue
查看文件 @decbf65
+++ b/src/views/HomeNew.vue
查看文件 @decbf65
@@ -62,7 +62,7 @@
 <script>
     import rt from '../routes'
-    import { editPass,resetToken,loginedUserInfo} from '../api/user';
+    import { editPass,resetToken,loginedUserInfo,heartBeat} from '../api/user';
     import ElFormItem from "element-ui/packages/form/src/form-item";
     import TabMenu from "@/components/TabMenu"
     import NavMenu from "@/components/NavMenu"
@@ -283,6 +283,11 @@
                     }
                 })
             },
+            heartBeatAPI:function () {
+                heartBeat().then(response => {
+
+                });
+            }
         },
         computed: {
@@ -304,6 +309,9 @@
             setInterval(() => {
                 this.checkUpdate();
             }, 30000);
+            setInterval(() => {
+                this.heartBeatAPI();
+            }, 60000);
             this.$nextTick(function(){
                 this.initUserInfo();
                 // this.rowDrop();   //行拖拽效果
--- a/src/views/Login.vue
查看文件 @decbf65
+++ b/src/views/Login.vue
查看文件 @decbf65
@@ -8,9 +8,16 @@
       <el-form-item prop="checkPass">
         <el-input type="password" v-model="ruleForm2.checkPass"  placeholder="密码" @keydown.enter.native="keyDown" show-password></el-input>
       </el-form-item>
-<!--      <el-form-item prop="checkPass">-->
-<!--        <el-input type="password" v-model="ruleForm2.checkPass"  placeholder="密码" @keyup.enter.native="handleSubmit2"></el-input>-->
-<!--      </el-form-item>-->
+      <el-form-item prop="verify">
+        <el-input type="text" v-model="ruleForm2.verify"  placeholder="请在2分钟内输入下方图片中的答案" @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-checkbox v-model="checked" checked class="remeberme">记住密码</el-checkbox>
       <el-form-item style="width:100%;">
         <el-button type="primary" style="width:100%;" @click.native.prevent="handleSubmit2" :loading="logining" :plain="true">登录</el-button>
@@ -43,15 +50,18 @@
   export default {
     data() {
       return {
-          vedioCanPlay: true,
-          fixStyle: '',
-          logining: false,
-          ruleForm2: {
+        verifyImg: "",
+        vedioCanPlay: true,
+        fixStyle: '',
+        logining: false,
+        ruleForm2: {
           account: '',
           // checkPass: 'zzairport@kako2020'
-          checkPass: ''
-          },
-          rules2: {
+          checkPass: '',
+          verify: '',
+          verifyToken: ''
+        },
+        rules2: {
           account: [
             { required: true, message: '请输入账号', trigger: 'blur' },
             //{ validator: validaePass }
@@ -59,10 +69,13 @@
           checkPass: [
             { required: true, message: '请输入密码', trigger: 'blur' },
             //{ validator: validaePass2 }
+          ],
+          checkVerify: [
+            { required: false, message: '请输入验证码', trigger: 'blur' }
           ]
-          },
-          checked: true,
-          userMenus: []
+        },
+        checked: true,
+        userMenus: []
       };
     },
     methods: {
@@ -105,18 +118,20 @@
 //            本地存储用户目录 ，防刷新目录丢失用
             sessionStorage.setItem('menu', JSON.stringify(_this.$router.options.routes));
         },
-        randCode: function(){
-          getRandCode().then((res) =>{
-
-          }).catch({
-
-          });
-        },
         keyDown(e) {
           if(e.keyCode===13) {   //用户点击了ctrl+enter触发
             this.handleSubmit2()
           }
         },
+        getVerifyCode: function(){
+          getRandCode().then((res) =>{
+            let status = res.status;
+            this.ruleForm2.verifyToken  = res.data.jwtToken;
+            this.verifyImg =   res.data.data.verifyImg;
+          }).catch({
+
+          });
+        },
         handleSubmit2: function (ev) {
             var _this = this;
             this.$refs.ruleForm2.validate((valid) => {
@@ -124,7 +139,12 @@
                     //_this.$router.replace('/table');
                     this.logining = true;
                     //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 => {
                         this.logining = false;
                         //NProgress.done();
@@ -133,11 +153,12 @@
                         let token = authentication.token;
                         let loginUserMenus = res.data.loginUserMenus;
                         if (status !== 200) {
-                            let msg = "登录错误";
-                            this.$message({
-                                message: msg,
-                                type: "error"
-                            });
+                          this.getVerifyCode();
+                          let msg = "登录错误";
+                          this.$message({
+                              message: msg,
+                              type: "error"
+                          });
                         } else if (token) {
                             sessionStorage.setItem('user', JSON.stringify(authentication));
                             sessionStorage.setItem('token','Bearer '+ token);
@@ -147,20 +168,17 @@
                             //处理用户menu
                             _this.userMenus =  loginUserMenus.list;
                             let sysMenus = _this.$router.options.routes;
-
-
                             _this.handleMenuList(_this.$router.options.routes,_this.userMenus);
-
-                            // console.log("user:");
-                            // console.log(_this.$router.options.routes);
                             _this.$router.push({path: '/main'});
                         }
                     }).catch(error => {
-                        this.$message({
-                            message: error.toString()+"-登录验证失败",
-                            type: "error"
-                        });
-                        this.logining = false;
+                      this.$message({
+                          message: error.toString()+"-登录验证失败;",
+                          type: "error"
+                      });
+                      this.getVerifyCode();
+                    }).finally(()=>{
+                      this.logining = false;
                     });
                 } else {
                     return false;
@@ -168,7 +186,7 @@
             });
         }
     },
-      mounted:function () {
+    mounted:function () {
           this.$store.commit('set_user_menu', []);
           this.$store.commit('set_user_info', {
             userId: 0,
@@ -213,8 +231,10 @@
               _this.handleSubmit2();
             }
           };
-          // this.randCode();
-      }
+      },
+    created(){
+      this.getVerifyCode()
+    },
   }
 </script>
--- a/src/views/nav1/user.vue
查看文件 @decbf65
+++ b/src/views/nav1/user.vue
查看文件 @decbf65
@@ -38,19 +38,32 @@
 			</el-table-column>
 			<el-table-column prop="realname" label="姓名" width="120" sortable>
 			</el-table-column>
-			<el-table-column prop="sex" label="性别" width="100" :formatter="formatSex" sortable>
-			</el-table-column>
-			<el-table-column prop="mobilephone" label="电话" width="150">
-			</el-table-column>
-			<el-table-column prop="creattime" label="创建时间" width="220" sortable>
-			</el-table-column>
-			<el-table-column prop="updatetime" label="更新时间" width="220" sortable>
-			</el-table-column>
+<!--			<el-table-column prop="sex" label="性别" width="100" :formatter="formatSex" sortable>-->
+<!--			</el-table-column>-->
+<!--			<el-table-column prop="mobilephone" label="电话" width="150">-->
+<!--			</el-table-column>-->
 <!--			<el-table-column prop="address" label="地址" min-width="180">-->
 <!--			</el-table-column>-->
 <!--			<el-table-column prop="email" label="Email" min-width="180">-->
 <!--			</el-table-column>-->
 			<el-table-column prop="state" label="启用" width="100" :formatter="formatState" sortable>
+				<template slot-scope="scope">
+					<el-tag type="success" v-if="scope.row.state">启用</el-tag>
+					<el-tag type="danger" v-else>禁用</el-tag>
+				</template>
+			</el-table-column>
+			<el-table-column prop="userStatus" label="状态" width="100">
+				<template slot-scope="scope">
+					<el-tag type="danger" v-if="scope.row.userStatus ===0">锁定</el-tag>
+					<el-tag type="success" v-else-if="scope.row.userStatus ===1">在线</el-tag>
+					<el-tag type="info" v-else-if="scope.row.userStatus ===2">离线</el-tag>
+					<el-tag type="warning" v-else-if="scope.row.userStatus ===3">过期</el-tag>
+					<el-tag type="warning" v-else>未知</el-tag>
+				</template>
+			</el-table-column>
+			<el-table-column prop="creattime" label="创建时间" width="220" sortable>
+			</el-table-column>
+			<el-table-column prop="updatetime" label="更新时间" width="220" sortable>
 			</el-table-column>
 			<el-table-column label="操作" align="center" width="250" fixed="right">
 				<template slot-scope="scope">