完成初步的权限控制

pull/6/head
yzw 2022-07-19 21:35:47 +08:00
parent 6570d27a3d
commit 9bb2391a14
18 changed files with 673 additions and 233 deletions

View File

@ -46,4 +46,5 @@ export function modifyJobDetail(data) {
method: 'post',
data
})
}
}

View File

@ -30,4 +30,13 @@ export function deleteUser(data) {
method: 'post',
data
})
}
}
export function verifyJobPriority(params) {
return request({
url: '/priority/verify',
method: 'get',
params
})
}

View File

@ -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

View File

@ -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

View File

@ -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: {

View File

@ -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(() => {

View File

@ -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 }
]

View File

@ -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)
// })
})
},

View File

@ -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();
}

View File

@ -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") {

View File

@ -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%;

View File

@ -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%;

View File

@ -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>

View File

@ -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>

View File

@ -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>

View File

@ -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>

View File

@ -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>