完成初步的权限控制
parent
6570d27a3d
commit
9bb2391a14
|
@ -46,4 +46,5 @@ export function modifyJobDetail(data) {
|
|||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -30,4 +30,13 @@ export function deleteUser(data) {
|
|||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
export function verifyJobPriority(params) {
|
||||
return request({
|
||||
url: '/priority/verify',
|
||||
method: 'get',
|
||||
params
|
||||
})
|
||||
}
|
||||
|
||||
|
|
|
@ -22,3 +22,11 @@ export function logout() {
|
|||
method: 'post'
|
||||
})
|
||||
}
|
||||
|
||||
export function changePassword(data) {
|
||||
return request({
|
||||
url: '/user/change-password',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
Binary file not shown.
After Width: | Height: | Size: 6.2 KiB |
|
@ -0,0 +1,2 @@
|
|||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1658195300643" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2408" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
|
||||
</style></defs><path d="M512 563.2c-127.9744 0-230.4-115.2512-230.4-256s102.4256-256 230.4-256 230.4 115.2512 230.4 256-102.4256 256-230.4 256z m0-51.2c98.2528 0 179.2-91.0592 179.2-204.8s-80.9472-204.8-179.2-204.8-179.2 91.0592-179.2 204.8 80.9472 204.8 179.2 204.8zM128 793.6a179.2 179.2 0 0 1 179.3792-179.2h409.2416C815.6416 614.4 896 694.7328 896 793.6a179.2 179.2 0 0 1-179.3792 179.2H307.3792C208.3584 972.8 128 892.4672 128 793.6z m51.2 0c0 70.5792 57.4464 128 128.1792 128h409.2416A128 128 0 0 0 844.8 793.6c0-70.5792-57.4464-128-128.1792-128H307.3792A128 128 0 0 0 179.2 793.6z" p-id="2409"></path></svg>
|
After Width: | Height: | Size: 1.3 KiB |
|
@ -7,23 +7,17 @@
|
|||
<div class="right-menu">
|
||||
<el-dropdown class="avatar-container" trigger="click">
|
||||
<div class="avatar-wrapper">
|
||||
<img :src="avatar+'?imageView2/1/w/80/h/80'" class="user-avatar">
|
||||
<img src="@/assets/images/default.png" class="user-avatar">
|
||||
<i class="el-icon-caret-bottom" />
|
||||
</div>
|
||||
<el-dropdown-menu slot="dropdown" class="user-dropdown">
|
||||
<router-link to="/">
|
||||
<el-dropdown-item>
|
||||
Home
|
||||
首页
|
||||
</el-dropdown-item>
|
||||
</router-link>
|
||||
<a target="_blank" href="https://github.com/PanJiaChen/vue-admin-template/">
|
||||
<el-dropdown-item>Github</el-dropdown-item>
|
||||
</a>
|
||||
<a target="_blank" href="https://panjiachen.github.io/vue-element-admin-site/#/">
|
||||
<el-dropdown-item>Docs</el-dropdown-item>
|
||||
</a>
|
||||
<el-dropdown-item divided @click.native="logout">
|
||||
<span style="display:block;">Log Out</span>
|
||||
<span style="display:block;">退出登录</span>
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
|
@ -43,8 +37,7 @@ export default {
|
|||
},
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'sidebar',
|
||||
'avatar'
|
||||
'sidebar'
|
||||
])
|
||||
},
|
||||
methods: {
|
||||
|
|
|
@ -3,14 +3,14 @@ import store from './store'
|
|||
import { Message } from 'element-ui'
|
||||
import NProgress from 'nprogress' // progress bar
|
||||
import 'nprogress/nprogress.css' // progress bar style
|
||||
import { getToken } from '@/utils/auth' // get token from cookie
|
||||
// import { getToken } from '@/utils/auth' // get token from cookie
|
||||
import getPageTitle from '@/utils/get-page-title'
|
||||
|
||||
NProgress.configure({ showSpinner: false }) // NProgress Configuration
|
||||
|
||||
const whiteList = ['/login'] // no redirect whitelist
|
||||
|
||||
router.beforeEach(async(to, from, next) => {
|
||||
router.beforeEach(async (to, from, next) => {
|
||||
// start progress bar
|
||||
NProgress.start()
|
||||
|
||||
|
@ -18,44 +18,98 @@ router.beforeEach(async(to, from, next) => {
|
|||
document.title = getPageTitle(to.meta.title)
|
||||
|
||||
// determine whether the user has logged in
|
||||
const hasToken = getToken()
|
||||
|
||||
if (hasToken) {
|
||||
if (to.path === '/login') {
|
||||
// if is logged in, redirect to the home page
|
||||
next({ path: '/' })
|
||||
NProgress.done()
|
||||
if (to.path != '/login' && !store.state.user.id_card) {
|
||||
// 没有登录,跳转到登录页面
|
||||
next({ path: '/login' });
|
||||
NProgress.done();
|
||||
} else {
|
||||
let getPriorityName = function (path) {
|
||||
let pos = path.indexOf('/', 1);
|
||||
pos = pos == -1 ? path.length : pos;
|
||||
return path.substring(1, pos);
|
||||
}
|
||||
let allow = false;
|
||||
if (store.state.user.is_admin) {
|
||||
allow = true;
|
||||
} else {
|
||||
const hasGetUserInfo = store.getters.name
|
||||
if (hasGetUserInfo) {
|
||||
next()
|
||||
} else {
|
||||
try {
|
||||
// get user info
|
||||
await store.dispatch('user/getInfo')
|
||||
|
||||
next()
|
||||
} catch (error) {
|
||||
// remove token and go to login page to re-login
|
||||
await store.dispatch('user/resetToken')
|
||||
Message.error(error || 'Has Error')
|
||||
next(`/login?redirect=${to.path}`)
|
||||
NProgress.done()
|
||||
}
|
||||
switch (getPriorityName(to.path)) {
|
||||
case 'priority':
|
||||
break;
|
||||
case 'job':
|
||||
// 判断岗位读权限
|
||||
allow = true;
|
||||
break;
|
||||
case 'person':
|
||||
// 判断人员读权限
|
||||
allow = true;
|
||||
break;
|
||||
case 'event':
|
||||
// 判断人员读权限
|
||||
allow = true;
|
||||
break;
|
||||
default:
|
||||
allow = true;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
/* has no token*/
|
||||
|
||||
if (whiteList.indexOf(to.path) !== -1) {
|
||||
// in the free login whitelist, go directly
|
||||
next()
|
||||
|
||||
if (allow) {
|
||||
next();
|
||||
} else {
|
||||
// other pages that do not have permission to access are redirected to the login page.
|
||||
next(`/login?redirect=${to.path}`)
|
||||
NProgress.done()
|
||||
Message({
|
||||
message: '权限不足',
|
||||
type: 'error',
|
||||
duration: 2000
|
||||
})
|
||||
next(false);
|
||||
NProgress.done();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// next()
|
||||
// NProgress.done()
|
||||
|
||||
// next(`/login?redirect=${to.path}`)
|
||||
// NProgress.done()
|
||||
|
||||
// const hasToken = getToken()
|
||||
// if (hasToken) {
|
||||
// if (to.path === '/login') {
|
||||
// // if is logged in, redirect to the home page
|
||||
// next({ path: '/' })
|
||||
// NProgress.done()
|
||||
// } else {
|
||||
// const hasGetUserInfo = store.getters.name
|
||||
// if (hasGetUserInfo) {
|
||||
// next()
|
||||
// } else {
|
||||
// try {
|
||||
// // get user info
|
||||
// await store.dispatch('user/getInfo')
|
||||
|
||||
// next()
|
||||
// } catch (error) {
|
||||
// // remove token and go to login page to re-login
|
||||
// await store.dispatch('user/resetToken')
|
||||
// Message.error(error || 'Has Error')
|
||||
// next(`/login?redirect=${to.path}`)
|
||||
// NProgress.done()
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// } else {
|
||||
// /* has no token*/
|
||||
|
||||
// if (whiteList.indexOf(to.path) !== -1) {
|
||||
// // in the free login whitelist, go directly
|
||||
// next()
|
||||
// } else {
|
||||
// // other pages that do not have permission to access are redirected to the login page.
|
||||
// next(`/login?redirect=${to.path}`)
|
||||
// NProgress.done()
|
||||
// }
|
||||
// }
|
||||
})
|
||||
|
||||
router.afterEach(() => {
|
||||
|
|
|
@ -158,7 +158,7 @@ export const constantRoutes = [
|
|||
name: 'priority',
|
||||
component: () => import('@/views/priority/priority'),
|
||||
meta: {
|
||||
title: '权限管理',
|
||||
title: '管理员专用',
|
||||
icon: '权限'
|
||||
}
|
||||
}]
|
||||
|
@ -217,6 +217,20 @@ export const constantRoutes = [
|
|||
}]
|
||||
},
|
||||
|
||||
{
|
||||
path: '/user',
|
||||
component: Layout,
|
||||
children: [{
|
||||
path: 'user',
|
||||
name: 'user',
|
||||
component: () => import('@/views/user/user'),
|
||||
meta: {
|
||||
title: '我的',
|
||||
icon: '我的'
|
||||
}
|
||||
}]
|
||||
},
|
||||
|
||||
// 404 page must be placed at the end !!!
|
||||
{ path: '*', redirect: '/404', hidden: true }
|
||||
]
|
||||
|
|
|
@ -1,12 +1,11 @@
|
|||
import { login, logout, getInfo } from '@/api/user'
|
||||
import { getToken, setToken, removeToken } from '@/utils/auth'
|
||||
import { setSessionItem, getSessionItem, clearSession } from '@/utils/auth'
|
||||
import { resetRouter } from '@/router'
|
||||
|
||||
const getDefaultState = () => {
|
||||
return {
|
||||
token: getToken(),
|
||||
name: '',
|
||||
avatar: ''
|
||||
id_card: '',
|
||||
is_admin: 0
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -16,14 +15,11 @@ const mutations = {
|
|||
RESET_STATE: (state) => {
|
||||
Object.assign(state, getDefaultState())
|
||||
},
|
||||
SET_TOKEN: (state, token) => {
|
||||
state.token = token
|
||||
SET_ID_CARD: (state, id_card) => {
|
||||
state.id_card = id_card;
|
||||
},
|
||||
SET_NAME: (state, name) => {
|
||||
state.name = name
|
||||
},
|
||||
SET_AVATAR: (state, avatar) => {
|
||||
state.avatar = avatar
|
||||
SET_IS_ADMIN: (state, is_admin) => {
|
||||
state.is_admin = is_admin;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -32,10 +28,13 @@ const actions = {
|
|||
login({ commit }, userInfo) {
|
||||
const { username, password } = userInfo
|
||||
return new Promise((resolve, reject) => {
|
||||
login({ username: username.trim(), password: password }).then(response => {
|
||||
login({ id_card: username.trim(), password: password }).then(response => {
|
||||
const { data } = response
|
||||
commit('SET_TOKEN', data.token)
|
||||
setToken(data.token)
|
||||
commit('SET_ID_CARD', data.id_card)
|
||||
commit('SET_IS_ADMIN', data.is_admin)
|
||||
// 存储到本地
|
||||
setSessionItem('id_card', data.id_card);
|
||||
setSessionItem('is_admin', data.is_admin);
|
||||
resolve()
|
||||
}).catch(error => {
|
||||
reject(error)
|
||||
|
@ -44,37 +43,43 @@ const actions = {
|
|||
},
|
||||
|
||||
// get user info
|
||||
getInfo({ commit, state }) {
|
||||
return new Promise((resolve, reject) => {
|
||||
getInfo(state.token).then(response => {
|
||||
const { data } = response
|
||||
// getInfo({ commit, state }) {
|
||||
// return new Promise((resolve, reject) => {
|
||||
// getInfo(state.token).then(response => {
|
||||
// const { data } = response
|
||||
|
||||
if (!data) {
|
||||
return reject('Verification failed, please Login again.')
|
||||
}
|
||||
// if (!data) {
|
||||
// return reject('Verification failed, please Login again.')
|
||||
// }
|
||||
|
||||
const { name, avatar } = data
|
||||
// const { name, avatar } = data
|
||||
|
||||
commit('SET_NAME', name)
|
||||
commit('SET_AVATAR', avatar)
|
||||
resolve(data)
|
||||
}).catch(error => {
|
||||
reject(error)
|
||||
})
|
||||
})
|
||||
},
|
||||
// commit('SET_NAME', name)
|
||||
// commit('SET_AVATAR', avatar)
|
||||
// resolve(data)
|
||||
// }).catch(error => {
|
||||
// reject(error)
|
||||
// })
|
||||
// })
|
||||
// },
|
||||
|
||||
// user logout
|
||||
logout({ commit, state }) {
|
||||
return new Promise((resolve, reject) => {
|
||||
logout(state.token).then(() => {
|
||||
removeToken() // must remove token first
|
||||
resetRouter()
|
||||
commit('RESET_STATE')
|
||||
resolve()
|
||||
}).catch(error => {
|
||||
reject(error)
|
||||
})
|
||||
// 没有token不必再发请求
|
||||
clearSession();
|
||||
resetRouter();
|
||||
commit('RESET_STATE');
|
||||
resolve();
|
||||
|
||||
// logout(state.token).then(() => {
|
||||
// removeToken() // must remove token first
|
||||
// resetRouter()
|
||||
// commit('RESET_STATE')
|
||||
// resolve()
|
||||
// }).catch(error => {
|
||||
// reject(error)
|
||||
// })
|
||||
})
|
||||
},
|
||||
|
||||
|
|
|
@ -1,15 +1,27 @@
|
|||
import Cookies from 'js-cookie'
|
||||
// import Cookies from 'js-cookie'
|
||||
|
||||
const TokenKey = 'vue_admin_template_token'
|
||||
// const TokenKey = 'vue_admin_template_token'
|
||||
|
||||
export function getToken() {
|
||||
return Cookies.get(TokenKey)
|
||||
// export function getToken() {
|
||||
// return Cookies.get(TokenKey)
|
||||
// }
|
||||
|
||||
// export function setToken(token) {
|
||||
// return Cookies.set(TokenKey, token)
|
||||
// }
|
||||
|
||||
// export function removeToken() {
|
||||
// return Cookies.remove(TokenKey)
|
||||
// }
|
||||
|
||||
export function setSessionItem(key, value) {
|
||||
sessionStorage[key] = value;
|
||||
}
|
||||
|
||||
export function setToken(token) {
|
||||
return Cookies.set(TokenKey, token)
|
||||
export function getSessionItem(key) {
|
||||
return sessionStorage[key];
|
||||
}
|
||||
|
||||
export function removeToken() {
|
||||
return Cookies.remove(TokenKey)
|
||||
}
|
||||
export function clearSession() {
|
||||
sessionStorage.clear();
|
||||
}
|
|
@ -113,6 +113,7 @@ import DepDescription from "./components/DepDescription.vue";
|
|||
import NoData from "./components/NoData.vue";
|
||||
|
||||
import * as jobApi from "@/api/job";
|
||||
import { verifyJobPriority } from "@/api/priotity";
|
||||
|
||||
import { MessageBox, Message } from "element-ui";
|
||||
|
||||
|
@ -162,52 +163,51 @@ export default {
|
|||
curNewNode: null,
|
||||
intervalId: null,
|
||||
comTitleEdit: null,
|
||||
writePriority: null,
|
||||
};
|
||||
},
|
||||
created() {},
|
||||
mounted() {
|
||||
// 请求组织架构
|
||||
jobApi
|
||||
.getFramework()
|
||||
.then(
|
||||
(res) => {
|
||||
let originalMindData = res.data;
|
||||
// 添加 id 和 expanded
|
||||
// let i = 1;
|
||||
originalMindData["expanded"] = true;
|
||||
let addId = function (data) {
|
||||
// if (!data.hasOwnProperty("id")) {
|
||||
// data["id"] = i;
|
||||
// i += 1;
|
||||
// }
|
||||
if (!data.hasOwnProperty("expanded")) {
|
||||
data["expanded"] = false;
|
||||
}
|
||||
if (data.hasOwnProperty("children")) {
|
||||
for (let j = 0; j < data["children"].length; j++) {
|
||||
addId(data["children"][j]);
|
||||
}
|
||||
}
|
||||
};
|
||||
addId(originalMindData);
|
||||
|
||||
// 修改方向
|
||||
for (let j = 0; j < originalMindData["children"].length; j++) {
|
||||
if (j % 2 == 0) {
|
||||
originalMindData["children"][j]["direction"] = "right";
|
||||
} else {
|
||||
originalMindData["children"][j]["direction"] = "left";
|
||||
jobApi.getFramework().then(
|
||||
(res) => {
|
||||
let originalMindData = res.data;
|
||||
// 添加 id 和 expanded
|
||||
// let i = 1;
|
||||
originalMindData["expanded"] = true;
|
||||
let addId = function (data) {
|
||||
// if (!data.hasOwnProperty("id")) {
|
||||
// data["id"] = i;
|
||||
// i += 1;
|
||||
// }
|
||||
if (!data.hasOwnProperty("expanded")) {
|
||||
data["expanded"] = false;
|
||||
}
|
||||
if (data.hasOwnProperty("children")) {
|
||||
for (let j = 0; j < data["children"].length; j++) {
|
||||
addId(data["children"][j]);
|
||||
}
|
||||
}
|
||||
this.mindData = originalMindData;
|
||||
};
|
||||
addId(originalMindData);
|
||||
|
||||
// 展示思维导图
|
||||
this.showChart();
|
||||
},
|
||||
(err) => {
|
||||
console.log("err: ", err);
|
||||
// 修改方向
|
||||
for (let j = 0; j < originalMindData["children"].length; j++) {
|
||||
if (j % 2 == 0) {
|
||||
originalMindData["children"][j]["direction"] = "right";
|
||||
} else {
|
||||
originalMindData["children"][j]["direction"] = "left";
|
||||
}
|
||||
}
|
||||
);
|
||||
this.mindData = originalMindData;
|
||||
|
||||
// 展示思维导图
|
||||
this.showChart();
|
||||
},
|
||||
(err) => {
|
||||
console.log("err: ", err);
|
||||
}
|
||||
);
|
||||
|
||||
// this.intervalId = setInterval(() => {
|
||||
// if (this.jm) {
|
||||
|
@ -525,13 +525,65 @@ export default {
|
|||
set_theme(theme_name) {
|
||||
this.jm.set_theme(theme_name);
|
||||
},
|
||||
clickModify() {
|
||||
this.$message({
|
||||
message: "修改数据",
|
||||
type: "warning",
|
||||
});
|
||||
this.allowSave = true;
|
||||
this.jm.enable_edit();
|
||||
verifyWritePriority() {
|
||||
if (this.writePriority === null) {
|
||||
return new Promise((resolve, reject) => {
|
||||
verifyJobPriority({
|
||||
id_card: this.$store.state.user.id_card,
|
||||
priority_type: "job_write",
|
||||
}).then(
|
||||
(res) => {
|
||||
this.writePriority = res.data.result;
|
||||
resolve();
|
||||
},
|
||||
(err) => {
|
||||
this.writePriority = 0;
|
||||
console.log("err:", err);
|
||||
reject();
|
||||
}
|
||||
);
|
||||
});
|
||||
} else {
|
||||
return new Promise((resolve, reject) => {
|
||||
resolve();
|
||||
})
|
||||
}
|
||||
},
|
||||
async clickModify() {
|
||||
await this.verifyWritePriority();
|
||||
if (this.writePriority) {
|
||||
this.allowSave = true;
|
||||
this.jm.enable_edit();
|
||||
} else {
|
||||
// 没有权限
|
||||
this.$message({
|
||||
message: "没有修改权限",
|
||||
type: "error",
|
||||
duration: 2000,
|
||||
});
|
||||
}
|
||||
// 判断是否有修改权限
|
||||
// verifyJobPriority({
|
||||
// id_card: this.$store.state.user.id_card,
|
||||
// priority_type: "job_write",
|
||||
// }).then(
|
||||
// (res) => {
|
||||
// if (!res.data.result) {
|
||||
// // 没有权限
|
||||
// this.$message({
|
||||
// message: "没有修改权限",
|
||||
// type: "warning",
|
||||
// duration: 2000,
|
||||
// });
|
||||
// } else {
|
||||
// this.allowSave = true;
|
||||
// this.jm.enable_edit();
|
||||
// }
|
||||
// },
|
||||
// (err) => {
|
||||
// console.log("err:", err);
|
||||
// }
|
||||
// );
|
||||
},
|
||||
cleanTreeData() {
|
||||
// 深复制对象
|
||||
|
@ -636,7 +688,20 @@ export default {
|
|||
}
|
||||
return "合法名称";
|
||||
},
|
||||
clickSaveDoc() {
|
||||
async clickSaveDoc() {
|
||||
// 判断权限
|
||||
await this.verifyWritePriority();
|
||||
|
||||
if (!this.writePriority) {
|
||||
// 没有权限
|
||||
this.$message({
|
||||
message: "没有修改权限",
|
||||
type: "error",
|
||||
duration: 2000,
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
// 增加节点,判断是否可添加
|
||||
if (this.curNewNode) {
|
||||
if (this.comName == "DepDescription") {
|
||||
|
|
|
@ -1,7 +1,13 @@
|
|||
<template>
|
||||
<div class="login-container">
|
||||
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form" auto-complete="on" label-position="left">
|
||||
|
||||
<el-form
|
||||
ref="loginForm"
|
||||
:model="loginForm"
|
||||
:rules="loginRules"
|
||||
class="login-form"
|
||||
auto-complete="on"
|
||||
label-position="left"
|
||||
>
|
||||
<div class="title-container">
|
||||
<h3 class="title">Login Form</h3>
|
||||
</div>
|
||||
|
@ -37,73 +43,84 @@
|
|||
@keyup.enter.native="handleLogin"
|
||||
/>
|
||||
<span class="show-pwd" @click="showPwd">
|
||||
<svg-icon :icon-class="passwordType === 'password' ? 'eye' : 'eye-open'" />
|
||||
<svg-icon
|
||||
:icon-class="passwordType === 'password' ? 'eye' : 'eye-open'"
|
||||
/>
|
||||
</span>
|
||||
</el-form-item>
|
||||
|
||||
<el-button :loading="loading" type="primary" style="width:100%;margin-bottom:30px;" @click.native.prevent="handleLogin">Login</el-button>
|
||||
<el-button
|
||||
:loading="loading"
|
||||
type="primary"
|
||||
style="width: 100%; margin-bottom: 30px"
|
||||
@click.native.prevent="handleLogin"
|
||||
>Login</el-button
|
||||
>
|
||||
|
||||
<div class="tips">
|
||||
<span style="margin-right:20px;">username: admin</span>
|
||||
<span style="margin-right: 20px">username: admin</span>
|
||||
<span> password: any</span>
|
||||
</div>
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { validUsername } from '@/utils/validate'
|
||||
import { validUsername } from "@/utils/validate";
|
||||
|
||||
export default {
|
||||
name: 'Login',
|
||||
name: "Login",
|
||||
data() {
|
||||
const validateUsername = (rule, value, callback) => {
|
||||
if (!validUsername(value)) {
|
||||
callback(new Error('Please enter the correct user name'))
|
||||
callback(new Error("Please enter the correct user name"));
|
||||
} else {
|
||||
callback()
|
||||
callback();
|
||||
}
|
||||
}
|
||||
};
|
||||
const validatePassword = (rule, value, callback) => {
|
||||
if (value.length < 6) {
|
||||
callback(new Error('The password can not be less than 6 digits'))
|
||||
callback(new Error("The password can not be less than 6 digits"));
|
||||
} else {
|
||||
callback()
|
||||
callback();
|
||||
}
|
||||
}
|
||||
};
|
||||
return {
|
||||
loginForm: {
|
||||
username: 'admin',
|
||||
password: '111111'
|
||||
username: "admin",
|
||||
password: "admin",
|
||||
},
|
||||
loginRules: {
|
||||
username: [{ required: true, trigger: 'blur', validator: validateUsername }],
|
||||
password: [{ required: true, trigger: 'blur', validator: validatePassword }]
|
||||
username: [
|
||||
{ required: true, trigger: "blur", validator: validateUsername },
|
||||
],
|
||||
password: [
|
||||
{ required: true, trigger: "blur", validator: validatePassword },
|
||||
],
|
||||
},
|
||||
loading: false,
|
||||
passwordType: 'password',
|
||||
redirect: undefined
|
||||
}
|
||||
passwordType: "password",
|
||||
redirect: undefined,
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
$route: {
|
||||
handler: function(route) {
|
||||
this.redirect = route.query && route.query.redirect
|
||||
handler: function (route) {
|
||||
this.redirect = route.query && route.query.redirect;
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
immediate: true,
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
showPwd() {
|
||||
if (this.passwordType === 'password') {
|
||||
this.passwordType = ''
|
||||
if (this.passwordType === "password") {
|
||||
this.passwordType = "";
|
||||
} else {
|
||||
this.passwordType = 'password'
|
||||
this.passwordType = "password";
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
this.$refs.password.focus()
|
||||
})
|
||||
this.$refs.password.focus();
|
||||
});
|
||||
},
|
||||
handleLogin() {
|
||||
// this.$refs.loginForm.validate(valid => {
|
||||
|
@ -120,26 +137,28 @@ export default {
|
|||
// return false
|
||||
// }
|
||||
// })
|
||||
|
||||
|
||||
this.loading = true
|
||||
this.$store.dispatch('user/login', this.loginForm).then(() => {
|
||||
this.$router.push({ path: this.redirect || '/' })
|
||||
this.loading = false
|
||||
}).catch(() => {
|
||||
this.loading = false
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
this.loading = true;
|
||||
this.$store
|
||||
.dispatch("user/login", this.loginForm)
|
||||
.then(() => {
|
||||
this.$router.push({ path: this.redirect || "/" });
|
||||
this.loading = false;
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err);
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
/* 修复input 背景不协调 和光标变色 */
|
||||
/* Detail see https://github.com/PanJiaChen/vue-element-admin/pull/927 */
|
||||
|
||||
$bg:#283443;
|
||||
$light_gray:#fff;
|
||||
$bg: #283443;
|
||||
$light_gray: #fff;
|
||||
$cursor: #fff;
|
||||
|
||||
@supports (-webkit-mask: none) and (not (cater-color: $cursor)) {
|
||||
|
@ -182,9 +201,9 @@ $cursor: #fff;
|
|||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
$bg:#2d3a4b;
|
||||
$dark_gray:#889aa4;
|
||||
$light_gray:#eee;
|
||||
$bg: #2d3a4b;
|
||||
$dark_gray: #889aa4;
|
||||
$light_gray: #eee;
|
||||
|
||||
.login-container {
|
||||
min-height: 100%;
|
||||
|
|
|
@ -1,28 +1,44 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="button-div">
|
||||
<el-button type="primary" size="small" @click="onSubmit">添加</el-button>
|
||||
<el-button type="primary" size="small" @click="onSubmit"
|
||||
>提交增加</el-button
|
||||
>
|
||||
</div>
|
||||
<table class="priority-table">
|
||||
<tr>
|
||||
<th>用户名</th>
|
||||
<!-- <td><input type="text" v-model="priorityData.username" class="input-box"></td> -->
|
||||
<td>
|
||||
<input
|
||||
type="text"
|
||||
v-model="priorityData.username"
|
||||
class="input-bar"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</td>
|
||||
<!-- <td>
|
||||
<div
|
||||
contenteditable="true"
|
||||
class="input-box"
|
||||
placeholder="请输入"
|
||||
></div>
|
||||
</td>
|
||||
</td> -->
|
||||
<th>身份证号</th>
|
||||
<!-- <td colspan="2"><input type="text" v-model="priorityData.id_card" class="input-box"></td> -->
|
||||
<td colspan="2">
|
||||
<input
|
||||
type="text"
|
||||
v-model="priorityData.id_card"
|
||||
class="input-bar"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</td>
|
||||
<!-- <td colspan="2">
|
||||
<div
|
||||
contenteditable="true"
|
||||
class="input-box"
|
||||
placeholder="请输入"
|
||||
></div>
|
||||
</td>
|
||||
</td> -->
|
||||
</tr>
|
||||
<tr>
|
||||
<th rowspan="2">岗位</th>
|
||||
|
@ -117,13 +133,16 @@ export default {
|
|||
},
|
||||
methods: {
|
||||
onSubmit() {
|
||||
console.log(this.priorityData);
|
||||
addUser({ data: this.priorityData }).then(
|
||||
(res) => {
|
||||
this.$message({
|
||||
message: "添加成功",
|
||||
type: "success",
|
||||
duration: 2000,
|
||||
});
|
||||
if (res == 0) {
|
||||
this.$message({
|
||||
message: "添加成功",
|
||||
type: "success",
|
||||
duration: 2000,
|
||||
});
|
||||
}
|
||||
},
|
||||
(err) => {
|
||||
console.log("err:", err);
|
||||
|
@ -141,6 +160,11 @@ export default {
|
|||
text-align: right;
|
||||
}
|
||||
|
||||
.input-bar {
|
||||
width: 90%;
|
||||
border-width: 0;
|
||||
}
|
||||
|
||||
.priority-table {
|
||||
border-collapse: collapse;
|
||||
width: 80%;
|
||||
|
|
|
@ -99,8 +99,8 @@ export default {
|
|||
created() {
|
||||
if (!this.priorityData) {
|
||||
this.priorityData = {
|
||||
id_card: "",
|
||||
username: "",
|
||||
id_card: "无数据",
|
||||
username: "无数据",
|
||||
job_read: 1,
|
||||
job_write: 0,
|
||||
person_read: 1,
|
||||
|
@ -108,19 +108,14 @@ export default {
|
|||
event_read: 1,
|
||||
event_write: 0,
|
||||
};
|
||||
Message({
|
||||
message: "暂无数据, 请先在查看页面选择要修改的用户",
|
||||
type: "warning",
|
||||
duration: 2000,
|
||||
});
|
||||
}
|
||||
console.log(this.priorityData);
|
||||
if (this.priorityData.job_read > 50) {
|
||||
this.priorityData.job_read = 1;
|
||||
} else {
|
||||
this.priorityData.job_read = 0;
|
||||
}
|
||||
console.log(this.priorityData);
|
||||
|
||||
// to delete
|
||||
// if (this.priorityData.job_read > 50) {
|
||||
// this.priorityData.job_read = 1;
|
||||
// } else {
|
||||
// this.priorityData.job_read = 0;
|
||||
// }
|
||||
},
|
||||
methods: {
|
||||
onSubmit() {
|
||||
|
@ -141,6 +136,17 @@ export default {
|
|||
);
|
||||
},
|
||||
},
|
||||
activated() {
|
||||
if (!this.data) {
|
||||
Message({
|
||||
message: "暂无数据, 请先在查看页面选择要修改的用户",
|
||||
type: "warning",
|
||||
duration: 2000,
|
||||
});
|
||||
} else {
|
||||
this.priorityData = this.data;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
|
|
|
@ -0,0 +1,121 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="button-div">
|
||||
<el-button type="primary" size="small" @click="onSubmit"
|
||||
>提交重置</el-button
|
||||
>
|
||||
</div>
|
||||
<table class="priority-table">
|
||||
<tr>
|
||||
<th>普通用户身份证</th>
|
||||
<td>
|
||||
<input
|
||||
type="text"
|
||||
v-model="id_card"
|
||||
class="input-bar"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>新密码</th>
|
||||
<td>
|
||||
<input
|
||||
type="text"
|
||||
v-model="newPassword"
|
||||
class="input-bar"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>确认密码</th>
|
||||
<td>
|
||||
<input
|
||||
type="text"
|
||||
v-model="newPassword2"
|
||||
class="input-bar"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { changePassword } from "@/api/user";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
id_card: "",
|
||||
newPassword: "",
|
||||
newPassword2: "",
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
onSubmit() {
|
||||
if (this.newPassword !== this.newPassword2) {
|
||||
this.$message({
|
||||
message: "两次密码不一致",
|
||||
type: "error",
|
||||
duration: 2000,
|
||||
});
|
||||
return;
|
||||
}
|
||||
changePassword({
|
||||
id_card: this.id_card,
|
||||
password: this.newPassword,
|
||||
}).then(
|
||||
(res) => {
|
||||
if (res.code == 0) {
|
||||
this.$message({
|
||||
message: "重置成功",
|
||||
type: "success",
|
||||
duration: 2000,
|
||||
});
|
||||
}
|
||||
},
|
||||
(err) => {
|
||||
console.log("err:", err);
|
||||
}
|
||||
);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.button-div {
|
||||
margin: 0px auto;
|
||||
width: 80%;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.input-bar {
|
||||
width: 90%;
|
||||
border-width: 0;
|
||||
}
|
||||
|
||||
.priority-table {
|
||||
border-collapse: collapse;
|
||||
width: 80%;
|
||||
margin: 10px auto 0px;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.priority-table table,
|
||||
th,
|
||||
td {
|
||||
border: 1px solid #ebebeb;
|
||||
}
|
||||
|
||||
.priority-table tr {
|
||||
height: 3em;
|
||||
}
|
||||
|
||||
.priority-table td {
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
|
@ -1,22 +1,5 @@
|
|||
<template>
|
||||
<div>
|
||||
<!-- <el-row :gutter="20">
|
||||
<el-col :span="20" :offset="0">
|
||||
<el-input
|
||||
placeholder="输入姓名或身份证号进行搜索"
|
||||
clearable
|
||||
v-model="searchText"
|
||||
@change="searchPriority"
|
||||
></el-input>
|
||||
</el-col>
|
||||
<el-col :span="4" :offset="0">
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="searchPriority"
|
||||
></el-button>
|
||||
</el-col>
|
||||
</el-row> -->
|
||||
<el-row type="flex" justify="center" class="search-box">
|
||||
<el-col :span="18">
|
||||
<el-input
|
||||
|
@ -87,7 +70,9 @@ export default {
|
|||
},
|
||||
components: {},
|
||||
mounted() {
|
||||
this.searchPriority();
|
||||
if (!this.searchData) {
|
||||
this.searchPriority();
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
searchPriority() {
|
||||
|
@ -155,7 +140,7 @@ export default {
|
|||
this.pageNum = curPageNum;
|
||||
this.searchPriority();
|
||||
},
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
|
|
|
@ -5,11 +5,14 @@
|
|||
<el-tab-pane label="查看权限" name="PriorityFind"></el-tab-pane>
|
||||
<el-tab-pane label="修改权限" name="PriorityModify"></el-tab-pane>
|
||||
<el-tab-pane label="增加用户" name="PriorityAdd"></el-tab-pane>
|
||||
<el-tab-pane label="重置密码" name="PriorityPassword"></el-tab-pane>
|
||||
</el-tabs>
|
||||
</el-header>
|
||||
|
||||
<component :is="comName" @changeCom="changeComponent" :data="comData">
|
||||
</component>
|
||||
<keep-alive>
|
||||
<component :is="comName" @changeCom="changeComponent" :data="comData">
|
||||
</component>
|
||||
</keep-alive>
|
||||
</el-container>
|
||||
</template>
|
||||
|
||||
|
@ -17,18 +20,20 @@
|
|||
import PriorityFind from "./components/select.vue";
|
||||
import PriorityModify from "./components/modify.vue";
|
||||
import PriorityAdd from "./components/add.vue";
|
||||
import PriorityPassword from "./components/password.vue"
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
comName: "PriorityFind",
|
||||
comData: null,
|
||||
comData: null
|
||||
};
|
||||
},
|
||||
components: {
|
||||
PriorityFind,
|
||||
PriorityModify,
|
||||
PriorityAdd,
|
||||
PriorityPassword
|
||||
},
|
||||
methods: {
|
||||
handleClick(tab, event) {
|
||||
|
@ -47,5 +52,4 @@ export default {
|
|||
padding-left: 5%;
|
||||
padding-right: 5%;
|
||||
}
|
||||
|
||||
</style>
|
|
@ -0,0 +1,118 @@
|
|||
<template>
|
||||
<div class="main-body">
|
||||
<p>我的身份证号:{{ id_card }}</p>
|
||||
<el-divider></el-divider>
|
||||
<p>修改密码</p>
|
||||
<div class="button-div">
|
||||
<el-button type="primary" size="small" @click="onSubmit"
|
||||
>提交修改</el-button
|
||||
>
|
||||
</div>
|
||||
<table class="priority-table">
|
||||
<tr>
|
||||
<th>新密码</th>
|
||||
<td>
|
||||
<input
|
||||
type="text"
|
||||
v-model="newPassword"
|
||||
class="input-bar"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>确认密码</th>
|
||||
<td>
|
||||
<input
|
||||
type="text"
|
||||
v-model="newPassword2"
|
||||
class="input-bar"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { changePassword } from "@/api/user";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
id_card: this.$store.state.user.id_card,
|
||||
newPassword: "",
|
||||
newPassword2: "",
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
onSubmit() {
|
||||
if (this.newPassword !== this.newPassword2) {
|
||||
this.$message({
|
||||
message: "两次密码不一致",
|
||||
type: "error",
|
||||
duration: 2000,
|
||||
});
|
||||
return;
|
||||
}
|
||||
changePassword({
|
||||
id_card: this.id_card,
|
||||
password: this.newPassword,
|
||||
}).then(
|
||||
(res) => {
|
||||
if (res.code == 0) {
|
||||
this.$message({
|
||||
message: "重置成功",
|
||||
type: "success",
|
||||
duration: 2000,
|
||||
});
|
||||
}
|
||||
},
|
||||
(err) => {
|
||||
console.log("err:", err);
|
||||
}
|
||||
);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.main-body {
|
||||
padding-left: 5%;
|
||||
padding-right: 5%;
|
||||
}
|
||||
|
||||
|
||||
.button-div {
|
||||
margin: 0px auto;
|
||||
width: 80%;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.input-bar {
|
||||
width: 90%;
|
||||
border-width: 0;
|
||||
}
|
||||
|
||||
.priority-table {
|
||||
border-collapse: collapse;
|
||||
width: 80%;
|
||||
margin: 10px auto 0px;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.priority-table table,
|
||||
th,
|
||||
td {
|
||||
border: 1px solid #ebebeb;
|
||||
}
|
||||
|
||||
.priority-table tr {
|
||||
height: 3em;
|
||||
}
|
||||
|
||||
.priority-table td {
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
Loading…
Reference in New Issue