update:
1. 同步适配登录验证码 2. 增加定时用户在线心跳 3. 用户列表锁定状态,禁用状态显示
正在显示
5 个修改的文件
包含
82 行增加
和
32 行删除
1 | import http from './http.js' | 1 | import http from './http.js' |
2 | import jsutil from "@/common/js/util"; | 2 | import jsutil from "@/common/js/util"; |
3 | let baseUrl = '/cloud-user-center/user' | 3 | let baseUrl = '/cloud-user-center/user' |
4 | +const serviceName = '/cloud-user-center' | ||
4 | // let baseUrl = '/cloud-kako-user-center/user' | 5 | // let baseUrl = '/cloud-kako-user-center/user' |
5 | // let baseCode = '/cloud-kako-user-center/randCode' | 6 | // let baseCode = '/cloud-kako-user-center/randCode' |
6 | export const getUserList = params => { return http.get(`${baseUrl}/list`, params); }; | 7 | export const getUserList = params => { return http.get(`${baseUrl}/list`, params); }; |
7 | 8 | ||
8 | -export const getRandCode = params => { return http.get(`${baseCode}`, params); }; | 9 | +export const getRandCode = params => { return http.get(`/cloud-user-center/anonymous/randCode`, params); }; |
9 | 10 | ||
10 | export const getUserListPage = params => { return http.get(`/user/list`,params) }; | 11 | export const getUserListPage = params => { return http.get(`/user/list`,params) }; |
11 | 12 | ||
@@ -19,10 +20,13 @@ export const editUser = params => { return http.put(`${baseUrl}/edit`,params)}; | @@ -19,10 +20,13 @@ export const editUser = params => { return http.put(`${baseUrl}/edit`,params)}; | ||
19 | 20 | ||
20 | export const addUser = params => { return http.post(`${baseUrl}/add`,params)}; | 21 | export const addUser = params => { return http.post(`${baseUrl}/add`,params)}; |
21 | 22 | ||
23 | +export const heartBeat = params => { return http.post(`${serviceName}/heartbeat`,params)}; | ||
24 | + | ||
22 | export const setUserRole = params => { return http.put(`${baseUrl}/roleset`,params)}; | 25 | export const setUserRole = params => { return http.put(`${baseUrl}/roleset`,params)}; |
23 | 26 | ||
24 | export const resetToken = params => { return http.put(`${baseUrl}/resetToken`,params)}; | 27 | export const resetToken = params => { return http.put(`${baseUrl}/resetToken`,params)}; |
25 | 28 | ||
29 | + | ||
26 | export const loginedUserInfo = () => { | 30 | export const loginedUserInfo = () => { |
27 | let session_user_info = sessionStorage.getItem('user'); | 31 | let session_user_info = sessionStorage.getItem('user'); |
28 | if (session_user_info && jsutil.checkNull(session_user_info)){ | 32 | if (session_user_info && jsutil.checkNull(session_user_info)){ |
@@ -19,6 +19,11 @@ var axois_init = { | @@ -19,6 +19,11 @@ var axois_init = { | ||
19 | return res; | 19 | return res; |
20 | }, | 20 | }, |
21 | error => { | 21 | error => { |
22 | + // 抓取报错信息 | ||
23 | + let errmsg = ''; | ||
24 | + if (error.response.data.message){ | ||
25 | + errmsg += error.response.data.message | ||
26 | + } | ||
22 | // 用户登录的时候会拿到一个基础信息,比如用户名,token,过期时间戳 | 27 | // 用户登录的时候会拿到一个基础信息,比如用户名,token,过期时间戳 |
23 | // 直接丢sessionStorage | 28 | // 直接丢sessionStorage |
24 | if (!sessionStorage.getItem("token")) { | 29 | if (!sessionStorage.getItem("token")) { |
@@ -33,7 +38,7 @@ var axois_init = { | @@ -33,7 +38,7 @@ var axois_init = { | ||
33 | if (error.response.status === 401) { | 38 | if (error.response.status === 401) { |
34 | message({ | 39 | message({ |
35 | // 饿了么的消息弹窗组件 | 40 | // 饿了么的消息弹窗组件 |
36 | - message: '授权超时,或访问未授权,请重新登录', | 41 | + message: errmsg + '授权超时,或访问未授权,请重新登录;', |
37 | type: "error" | 42 | type: "error" |
38 | }); | 43 | }); |
39 | } | 44 | } |
@@ -80,7 +85,7 @@ var axois_init = { | @@ -80,7 +85,7 @@ var axois_init = { | ||
80 | } | 85 | } |
81 | // 返回 response 里的错误信息 | 86 | // 返回 response 里的错误信息 |
82 | 87 | ||
83 | - return Promise.reject(errorInfo); | 88 | + return Promise.reject(errorInfo + errmsg); |
84 | } | 89 | } |
85 | ); | 90 | ); |
86 | }, | 91 | }, |
@@ -62,7 +62,7 @@ | @@ -62,7 +62,7 @@ | ||
62 | 62 | ||
63 | <script> | 63 | <script> |
64 | import rt from '../routes' | 64 | import rt from '../routes' |
65 | - import { editPass,resetToken,loginedUserInfo} from '../api/user'; | 65 | + import { editPass,resetToken,loginedUserInfo,heartBeat} from '../api/user'; |
66 | import ElFormItem from "element-ui/packages/form/src/form-item"; | 66 | import ElFormItem from "element-ui/packages/form/src/form-item"; |
67 | import TabMenu from "@/components/TabMenu" | 67 | import TabMenu from "@/components/TabMenu" |
68 | import NavMenu from "@/components/NavMenu" | 68 | import NavMenu from "@/components/NavMenu" |
@@ -283,6 +283,11 @@ | @@ -283,6 +283,11 @@ | ||
283 | } | 283 | } |
284 | }) | 284 | }) |
285 | }, | 285 | }, |
286 | + heartBeatAPI:function () { | ||
287 | + heartBeat().then(response => { | ||
288 | + | ||
289 | + }); | ||
290 | + } | ||
286 | }, | 291 | }, |
287 | 292 | ||
288 | computed: { | 293 | computed: { |
@@ -304,6 +309,9 @@ | @@ -304,6 +309,9 @@ | ||
304 | setInterval(() => { | 309 | setInterval(() => { |
305 | this.checkUpdate(); | 310 | this.checkUpdate(); |
306 | }, 30000); | 311 | }, 30000); |
312 | + setInterval(() => { | ||
313 | + this.heartBeatAPI(); | ||
314 | + }, 60000); | ||
307 | this.$nextTick(function(){ | 315 | this.$nextTick(function(){ |
308 | this.initUserInfo(); | 316 | this.initUserInfo(); |
309 | // this.rowDrop(); //行拖拽效果 | 317 | // this.rowDrop(); //行拖拽效果 |
@@ -8,9 +8,16 @@ | @@ -8,9 +8,16 @@ | ||
8 | <el-form-item prop="checkPass"> | 8 | <el-form-item prop="checkPass"> |
9 | <el-input type="password" v-model="ruleForm2.checkPass" placeholder="密码" @keydown.enter.native="keyDown" show-password></el-input> | 9 | <el-input type="password" v-model="ruleForm2.checkPass" placeholder="密码" @keydown.enter.native="keyDown" show-password></el-input> |
10 | </el-form-item> | 10 | </el-form-item> |
11 | -<!-- <el-form-item prop="checkPass">--> | ||
12 | -<!-- <el-input type="password" v-model="ruleForm2.checkPass" placeholder="密码" @keyup.enter.native="handleSubmit2"></el-input>--> | ||
13 | -<!-- </el-form-item>--> | 11 | + <el-form-item prop="verify"> |
12 | + <el-input type="text" v-model="ruleForm2.verify" placeholder="请在2分钟内输入下方图片中的答案" @keyup.enter.native="handleSubmit2"></el-input> | ||
13 | + </el-form-item> | ||
14 | + <el-form-item> | ||
15 | + <img | ||
16 | + style="width: 125px; height: 60px" | ||
17 | + :src="verifyImg" | ||
18 | + @click="getVerifyCode" | ||
19 | + > | ||
20 | + </el-form-item> | ||
14 | <el-checkbox v-model="checked" checked class="remeberme">记住密码</el-checkbox> | 21 | <el-checkbox v-model="checked" checked class="remeberme">记住密码</el-checkbox> |
15 | <el-form-item style="width:100%;"> | 22 | <el-form-item style="width:100%;"> |
16 | <el-button type="primary" style="width:100%;" @click.native.prevent="handleSubmit2" :loading="logining" :plain="true">登录</el-button> | 23 | <el-button type="primary" style="width:100%;" @click.native.prevent="handleSubmit2" :loading="logining" :plain="true">登录</el-button> |
@@ -43,13 +50,16 @@ | @@ -43,13 +50,16 @@ | ||
43 | export default { | 50 | export default { |
44 | data() { | 51 | data() { |
45 | return { | 52 | return { |
53 | + verifyImg: "", | ||
46 | vedioCanPlay: true, | 54 | vedioCanPlay: true, |
47 | fixStyle: '', | 55 | fixStyle: '', |
48 | logining: false, | 56 | logining: false, |
49 | ruleForm2: { | 57 | ruleForm2: { |
50 | account: '', | 58 | account: '', |
51 | // checkPass: 'zzairport@kako2020' | 59 | // checkPass: 'zzairport@kako2020' |
52 | - checkPass: '' | 60 | + checkPass: '', |
61 | + verify: '', | ||
62 | + verifyToken: '' | ||
53 | }, | 63 | }, |
54 | rules2: { | 64 | rules2: { |
55 | account: [ | 65 | account: [ |
@@ -59,6 +69,9 @@ | @@ -59,6 +69,9 @@ | ||
59 | checkPass: [ | 69 | checkPass: [ |
60 | { required: true, message: '请输入密码', trigger: 'blur' }, | 70 | { required: true, message: '请输入密码', trigger: 'blur' }, |
61 | //{ validator: validaePass2 } | 71 | //{ validator: validaePass2 } |
72 | + ], | ||
73 | + checkVerify: [ | ||
74 | + { required: false, message: '请输入验证码', trigger: 'blur' } | ||
62 | ] | 75 | ] |
63 | }, | 76 | }, |
64 | checked: true, | 77 | checked: true, |
@@ -105,18 +118,20 @@ | @@ -105,18 +118,20 @@ | ||
105 | // 本地存储用户目录 ,防刷新目录丢失用 | 118 | // 本地存储用户目录 ,防刷新目录丢失用 |
106 | sessionStorage.setItem('menu', JSON.stringify(_this.$router.options.routes)); | 119 | sessionStorage.setItem('menu', JSON.stringify(_this.$router.options.routes)); |
107 | }, | 120 | }, |
108 | - randCode: function(){ | ||
109 | - getRandCode().then((res) =>{ | ||
110 | - | ||
111 | - }).catch({ | ||
112 | - | ||
113 | - }); | ||
114 | - }, | ||
115 | keyDown(e) { | 121 | keyDown(e) { |
116 | if(e.keyCode===13) { //用户点击了ctrl+enter触发 | 122 | if(e.keyCode===13) { //用户点击了ctrl+enter触发 |
117 | this.handleSubmit2() | 123 | this.handleSubmit2() |
118 | } | 124 | } |
119 | }, | 125 | }, |
126 | + getVerifyCode: function(){ | ||
127 | + getRandCode().then((res) =>{ | ||
128 | + let status = res.status; | ||
129 | + this.ruleForm2.verifyToken = res.data.jwtToken; | ||
130 | + this.verifyImg = res.data.data.verifyImg; | ||
131 | + }).catch({ | ||
132 | + | ||
133 | + }); | ||
134 | + }, | ||
120 | handleSubmit2: function (ev) { | 135 | handleSubmit2: function (ev) { |
121 | var _this = this; | 136 | var _this = this; |
122 | this.$refs.ruleForm2.validate((valid) => { | 137 | this.$refs.ruleForm2.validate((valid) => { |
@@ -124,7 +139,12 @@ | @@ -124,7 +139,12 @@ | ||
124 | //_this.$router.replace('/table'); | 139 | //_this.$router.replace('/table'); |
125 | this.logining = true; | 140 | this.logining = true; |
126 | //NProgress.start(); | 141 | //NProgress.start(); |
127 | - var loginParams = {username: this.ruleForm2.account, password: this.ruleForm2.checkPass}; | 142 | + var loginParams = { |
143 | + username: this.ruleForm2.account, | ||
144 | + password: this.ruleForm2.checkPass, | ||
145 | + verify: this.ruleForm2.verify, | ||
146 | + verifyToken:this.ruleForm2.verifyToken | ||
147 | + }; | ||
128 | http.login(loginParams).then(res => { | 148 | http.login(loginParams).then(res => { |
129 | this.logining = false; | 149 | this.logining = false; |
130 | //NProgress.done(); | 150 | //NProgress.done(); |
@@ -133,6 +153,7 @@ | @@ -133,6 +153,7 @@ | ||
133 | let token = authentication.token; | 153 | let token = authentication.token; |
134 | let loginUserMenus = res.data.loginUserMenus; | 154 | let loginUserMenus = res.data.loginUserMenus; |
135 | if (status !== 200) { | 155 | if (status !== 200) { |
156 | + this.getVerifyCode(); | ||
136 | let msg = "登录错误"; | 157 | let msg = "登录错误"; |
137 | this.$message({ | 158 | this.$message({ |
138 | message: msg, | 159 | message: msg, |
@@ -147,19 +168,16 @@ | @@ -147,19 +168,16 @@ | ||
147 | //处理用户menu | 168 | //处理用户menu |
148 | _this.userMenus = loginUserMenus.list; | 169 | _this.userMenus = loginUserMenus.list; |
149 | let sysMenus = _this.$router.options.routes; | 170 | let sysMenus = _this.$router.options.routes; |
150 | - | ||
151 | - | ||
152 | _this.handleMenuList(_this.$router.options.routes,_this.userMenus); | 171 | _this.handleMenuList(_this.$router.options.routes,_this.userMenus); |
153 | - | ||
154 | - // console.log("user:"); | ||
155 | - // console.log(_this.$router.options.routes); | ||
156 | _this.$router.push({path: '/main'}); | 172 | _this.$router.push({path: '/main'}); |
157 | } | 173 | } |
158 | }).catch(error => { | 174 | }).catch(error => { |
159 | this.$message({ | 175 | this.$message({ |
160 | - message: error.toString()+"-登录验证失败", | 176 | + message: error.toString()+"-登录验证失败;", |
161 | type: "error" | 177 | type: "error" |
162 | }); | 178 | }); |
179 | + this.getVerifyCode(); | ||
180 | + }).finally(()=>{ | ||
163 | this.logining = false; | 181 | this.logining = false; |
164 | }); | 182 | }); |
165 | } else { | 183 | } else { |
@@ -213,8 +231,10 @@ | @@ -213,8 +231,10 @@ | ||
213 | _this.handleSubmit2(); | 231 | _this.handleSubmit2(); |
214 | } | 232 | } |
215 | }; | 233 | }; |
216 | - // this.randCode(); | ||
217 | - } | 234 | + }, |
235 | + created(){ | ||
236 | + this.getVerifyCode() | ||
237 | + }, | ||
218 | } | 238 | } |
219 | 239 | ||
220 | </script> | 240 | </script> |
@@ -38,19 +38,32 @@ | @@ -38,19 +38,32 @@ | ||
38 | </el-table-column> | 38 | </el-table-column> |
39 | <el-table-column prop="realname" label="姓名" width="120" sortable> | 39 | <el-table-column prop="realname" label="姓名" width="120" sortable> |
40 | </el-table-column> | 40 | </el-table-column> |
41 | - <el-table-column prop="sex" label="性别" width="100" :formatter="formatSex" sortable> | ||
42 | - </el-table-column> | ||
43 | - <el-table-column prop="mobilephone" label="电话" width="150"> | ||
44 | - </el-table-column> | ||
45 | - <el-table-column prop="creattime" label="创建时间" width="220" sortable> | ||
46 | - </el-table-column> | ||
47 | - <el-table-column prop="updatetime" label="更新时间" width="220" sortable> | ||
48 | - </el-table-column> | 41 | +<!-- <el-table-column prop="sex" label="性别" width="100" :formatter="formatSex" sortable>--> |
42 | +<!-- </el-table-column>--> | ||
43 | +<!-- <el-table-column prop="mobilephone" label="电话" width="150">--> | ||
44 | +<!-- </el-table-column>--> | ||
49 | <!-- <el-table-column prop="address" label="地址" min-width="180">--> | 45 | <!-- <el-table-column prop="address" label="地址" min-width="180">--> |
50 | <!-- </el-table-column>--> | 46 | <!-- </el-table-column>--> |
51 | <!-- <el-table-column prop="email" label="Email" min-width="180">--> | 47 | <!-- <el-table-column prop="email" label="Email" min-width="180">--> |
52 | <!-- </el-table-column>--> | 48 | <!-- </el-table-column>--> |
53 | <el-table-column prop="state" label="启用" width="100" :formatter="formatState" sortable> | 49 | <el-table-column prop="state" label="启用" width="100" :formatter="formatState" sortable> |
50 | + <template slot-scope="scope"> | ||
51 | + <el-tag type="success" v-if="scope.row.state">启用</el-tag> | ||
52 | + <el-tag type="danger" v-else>禁用</el-tag> | ||
53 | + </template> | ||
54 | + </el-table-column> | ||
55 | + <el-table-column prop="userStatus" label="状态" width="100"> | ||
56 | + <template slot-scope="scope"> | ||
57 | + <el-tag type="danger" v-if="scope.row.userStatus ===0">锁定</el-tag> | ||
58 | + <el-tag type="success" v-else-if="scope.row.userStatus ===1">在线</el-tag> | ||
59 | + <el-tag type="info" v-else-if="scope.row.userStatus ===2">离线</el-tag> | ||
60 | + <el-tag type="warning" v-else-if="scope.row.userStatus ===3">过期</el-tag> | ||
61 | + <el-tag type="warning" v-else>未知</el-tag> | ||
62 | + </template> | ||
63 | + </el-table-column> | ||
64 | + <el-table-column prop="creattime" label="创建时间" width="220" sortable> | ||
65 | + </el-table-column> | ||
66 | + <el-table-column prop="updatetime" label="更新时间" width="220" sortable> | ||
54 | </el-table-column> | 67 | </el-table-column> |
55 | <el-table-column label="操作" align="center" width="250" fixed="right"> | 68 | <el-table-column label="操作" align="center" width="250" fixed="right"> |
56 | <template slot-scope="scope"> | 69 | <template slot-scope="scope"> |
-
请 注册 或 登录 后发表评论