open-source/eladmin-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

代码改造完成，加入多字典查询方式

Browse Source
This commit is contained in:
zhengjie
2019-06-29 12:32:52 +08:00
parent 1b757d6972
commit 9ca7d4b05f
56 changed files with 771 additions and 1467 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
src/views/system/user/center.vue
View File

@@ -42,7 +42,32 @@
<span>操作日志</span>
<div style="display:inline-block;float: right;cursor: pointer" @click="refresh"><i :class="ico"/></div>
</div>
<log ref="log"/>
<div>
<el-table v-loading="loading" :data="data" size="small" style="width: 100%;">
<el-table-column prop="description" label="行为"/>
<el-table-column prop="requestIp" label="IP"/>
<el-table-column prop="time" label="请求耗时" align="center">
<template slot-scope="scope">
<el-tag v-if="scope.row.time <= 300">{{ scope.row.time }}ms</el-tag>
<el-tag v-else-if="scope.row.time <= 1000" type="warning">{{ scope.row.time }}ms</el-tag>
<el-tag v-else type="danger">{{ scope.row.time }}ms</el-tag>
</template>
</el-table-column>
<el-table-column prop="createTime" label="创建日期" width="180px">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>
</el-table-column>
</el-table>
<!--分页组件-->
<el-pagination
:total="total"
:current-page="page + 1"
style="margin-top: 8px;"
layout="total, prev, pager, next, sizes"
@size-change="sizeChange"
@current-change="pageChange"/>
</div>
</el-card>
</el-col>
</el-row>
@@ -56,13 +81,14 @@ import { mapGetters } from 'vuex'
import { regEmail } from '@/utils/index'
import updatePass from './center/updatePass'
import updateEmail from './center/updateEmail'
import log from './center/log'
import { getToken } from '@/utils/auth'
import store from '@/store'
import { parseTime } from '@/utils/index'
import initData from '@/mixins/initData'
export default {
name: 'Center',
components: { updatePass, updateEmail, log },
components: { updatePass, updateEmail },
mixins: [initData],
data() {
return {
ico: 'el-icon-refresh',
@@ -78,6 +104,9 @@ export default {
])
},
created() {
this.$nextTick(() => {
this.init()
})
store.dispatch('GetInfo').then(() => {})
},
methods: {
@@ -85,6 +114,12 @@ export default {
formatEmail(mail) {
return regEmail(mail)
},
beforeInit() {
this.url = 'api/logs/user'
const sort = 'id,desc'
this.params = { page: this.page, size: this.size, sort: sort }
return true
},
handleSuccess(response, file, fileList) {
this.$notify({
title: '头像修改成功',

55
src/views/system/user/center/log.vue
View File

@@ -1,55 +0,0 @@
<template>
<div>
<!--表格渲染-->
<el-table v-loading="loading" :data="data" size="small" style="width: 100%;">
<el-table-column prop="description" label="行为"/>
<el-table-column prop="requestIp" label="IP"/>
<el-table-column prop="time" label="请求耗时" align="center">
<template slot-scope="scope">
<el-tag v-if="scope.row.time <= 300">{{ scope.row.time }}ms</el-tag>
<el-tag v-else-if="scope.row.time <= 1000" type="warning">{{ scope.row.time }}ms</el-tag>
<el-tag v-else type="danger">{{ scope.row.time }}ms</el-tag>
</template>
</el-table-column>
<el-table-column prop="createTime" label="创建日期" width="180px">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>
</el-table-column>
</el-table>
<!--分页组件-->
<el-pagination
:total="total"
:current-page="page + 1"
style="margin-top: 8px;"
layout="total, prev, pager, next, sizes"
@size-change="sizeChange"
@current-change="pageChange"/>
</div>
</template>
<script>
import initData from '@/mixins/initData'
import { parseTime } from '@/utils/index'
export default {
mixins: [initData],
created() {
this.$nextTick(() => {
this.init()
})
},
methods: {
parseTime,
beforeInit() {
this.url = 'api/logs/user'
const sort = 'id,desc'
this.params = { page: this.page, size: this.size, sort: sort }
return true
}
}
}
</script>
<style scoped>
</style>

19
src/views/system/user/center/updateEmail.vue
View File

@@ -1,6 +1,6 @@
<template>
<div style="display: inline-block;">
<el-dialog :visible.sync="dialog" :title="title" append-to-body width="475px" @close="cancel">
<el-dialog :visible.sync="dialog" :close-on-click-modal="false" :title="title" append-to-body width="475px" @close="cancel">
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="88px">
<el-form-item label="新邮箱" prop="email">
<el-input v-model="form.email" auto-complete="on" style="width: 200px;"/>
@@ -24,7 +24,7 @@
<script>
import store from '@/store'
import { validatEmail } from '@/utils/validate'
import { validPass, updateEmail } from '@/api/user'
import { updateEmail } from '@/api/user'
import { resetEmail } from '@/api/code'
export default {
props: {
@@ -34,19 +34,6 @@ export default {
}
},
data() {
const validatePass = (rule, value, callback) => {
if (value === '' || value === null) {
callback(new Error('密码不能为空'))
} else {
validPass(value).then(res => {
if (res.status === 200) {
callback()
} else {
callback(new Error('密码错误，请重新输入'))
}
})
}
}
const validMail = (rule, value, callback) => {
if (value === '' || value === null) {
callback(new Error('新邮箱不能为空'))
@@ -65,7 +52,7 @@ export default {
buttonName: '获取验证码', isDisabled: false, time: 60,
rules: {
pass: [
{ required: true, validator: validatePass, trigger: 'blur' }
{ required: true, message: '当前密码不能为空', trigger: 'blur' }
],
email: [
{ required: true, validator: validMail, trigger: 'blur' }

29
src/views/system/user/center/updatePass.vue
View File

@@ -1,6 +1,6 @@
<template>
<div style="display: inline-block">
<el-dialog :visible.sync="dialog" :title="title" append-to-body width="500px" @close="cancel">
<el-dialog :visible.sync="dialog" :close-on-click-modal="false" :title="title" append-to-body width="500px" @close="cancel">
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="88px">
<el-form-item label="旧密码" prop="oldPass">
<el-input v-model="form.oldPass" type="password" auto-complete="on" style="width: 370px;"/>
@@ -22,34 +22,25 @@
<script>
import store from '@/store'
import { validPass, updatePass } from '@/api/user'
import { updatePass } from '@/api/user'
export default {
data() {
const validatePass = (rule, value, callback) => {
if (value) {
validPass(value).then(res => {
if (res.status === 200) {
callback()
} else {
callback(new Error('旧密码错误，请检查'))
}
})
} else {
callback(new Error('请输入旧密码'))
}
}
const confirmPass = (rule, value, callback) => {
if (this.form.newPass !== value) {
callback(new Error('两次输入的密码不一致'))
if (value) {
if (this.form.newPass !== value) {
callback(new Error('两次输入的密码不一致'))
} else {
callback()
}
} else {
callback()
callback(new Error('请再次输入密码'))
}
}
return {
loading: false, dialog: false, title: '修改密码', form: { oldPass: '', newPass: '', confirmPass: '' },
rules: {
oldPass: [
{ required: true, validator: validatePass, trigger: 'blur' }
{ required: true, message: '请输入旧密码', trigger: 'blur' }
],
newPass: [
{ required: true, message: '请输入新密码', trigger: 'blur' },

10
src/views/system/user/module/form.vue → src/views/system/user/form.vue
View File

@@ -58,10 +58,6 @@ export default {
type: Boolean,
required: true
},
sup_this: {
type: Object,
default: null
},
dicts: {
type: Array,
required: true
@@ -157,7 +153,7 @@ export default {
duration: 2500
})
this.loading = false
this.sup_this.init()
this.$parent.init()
}).catch(err => {
this.loading = false
console.log(err.response.data.message)
@@ -172,7 +168,7 @@ export default {
duration: 2500
})
this.loading = false
this.sup_this.init()
this.$parent.init()
}).catch(err => {
this.loading = false
console.log(err.response.data.message)
@@ -194,7 +190,6 @@ export default {
})
},
getJobs(id) {
this.jobId = null
getAllJob(id).then(res => {
this.jobs = res.content
}).catch(err => {
@@ -215,7 +210,6 @@ export default {
},
getRoleLevel() {
getLevel().then(res => {
console.log(res)
this.level = res.level
}).catch(err => {
console.log(err.response.data.message)

109
src/views/system/user/index.vue
View File

@@ -1,14 +1,49 @@
<template>
<div class="app-container">
<!--form 组件-->
<eForm ref="form" :is-add="isAdd" :dicts="dicts"/>
<el-row :gutter="20">
<!--部门数据-->
<el-col :xs="7" :sm="6" :md="4" :lg="4" :xl="4">
<div class="head-container">
<el-input v-model="deptName" clearable placeholder="输入部门名称搜索" prefix-icon="el-icon-search" style="width: 100%;" class="filter-item" @input="getDeptDatas"/>
</div>
<el-tree :data="depts" :props="defaultProps" :expand-on-click-node="false" default-expand-all @node-click="handleNodeClick"/>
</el-col>
<!--用户数据-->
<el-col :xs="17" :sm="18" :md="20" :lg="20" :xl="20">
<eHeader :query="query" :sup_this="sup_this" :dicts="dicts"/>
<!--工具栏-->
<div class="head-container">
<!-- 搜索 -->
<el-input v-model="query.value" clearable placeholder="输入关键字搜索" style="width: 200px;" class="filter-item" @keyup.enter.native="toQuery"/>
<el-select v-model="query.type" clearable placeholder="类型" class="filter-item" style="width: 130px">
<el-option v-for="item in queryTypeOptions" :key="item.key" :label="item.display_name" :value="item.key"/>
</el-select>
<el-select v-model="query.enabled" clearable placeholder="状态" class="filter-item" style="width: 90px" @change="toQuery">
<el-option v-for="item in enabledTypeOptions" :key="item.key" :label="item.display_name" :value="item.key"/>
</el-select>
<el-button class="filter-item" size="mini" type="success" icon="el-icon-search" @click="toQuery">搜索</el-button>
<!-- 新增 -->
<div v-permission="['ADMIN','USER_ALL','USER_CREATE']" style="display: inline-block;margin: 0px 2px;">
<el-button
class="filter-item"
size="mini"
type="primary"
icon="el-icon-plus"
@click="add">新增</el-button>
</div>
<!-- 导出 -->
<div style="display: inline-block;">
<el-button
v-permission="['ADMIN']"
:loading="downloadLoading"
size="mini"
class="filter-item"
type="warning"
icon="el-icon-download"
@click="download">导出</el-button>
</div>
</div>
<!--表格渲染-->
<el-table v-loading="loading" :data="data" size="small" style="width: 100%;">
<el-table-column prop="username" label="用户名"/>
@@ -33,7 +68,7 @@
</el-table-column>
<el-table-column v-if="checkPermission(['ADMIN','USER_ALL','USER_EDIT','USER_DELETE'])" label="操作" width="125" align="center">
<template slot-scope="scope">
<edit v-permission="['ADMIN','USER_ALL','USER_EDIT']" :dicts="dicts" :data="scope.row" :sup_this="sup_this"/>
<el-button v-permission="['ADMIN','USER_ALL','USER_EDIT']" size="mini" type="primary" icon="el-icon-edit" @click="edit(scope.row)"/>
<el-popover
v-permission="['ADMIN','USER_ALL','USER_DELETE']"
:ref="scope.row.id"
@@ -69,19 +104,27 @@ import initDict from '@/mixins/initDict'
import { del } from '@/api/user'
import { getDepts } from '@/api/dept'
import { parseTime } from '@/utils/index'
import eHeader from './module/header'
import edit from './module/edit'
import eForm from './form'
export default {
components: { eHeader, edit },
components: { eForm },
mixins: [initData, initDict],
data() {
return {
height: document.documentElement.clientHeight - 180 + 'px;',
delLoading: false, sup_this: this, deptName: '', depts: [], deptId: null,
height: document.documentElement.clientHeight - 180 + 'px;', isAdd: false,
delLoading: false, deptName: '', depts: [], deptId: null,
defaultProps: {
children: 'children',
label: 'name'
}
},
downloadLoading: false,
queryTypeOptions: [
{ key: 'username', display_name: '用户名' },
{ key: 'email', display_name: '邮箱' }
],
enabledTypeOptions: [
{ key: 'true', display_name: '激活' },
{ key: 'false', display_name: '锁定' }
]
}
},
created() {
@@ -146,6 +189,56 @@ export default {
this.deptId = data.id
}
this.init()
},
add() {
this.isAdd = true
this.$refs.form.getDepts()
this.$refs.form.getRoles()
this.$refs.form.getRoleLevel()
this.$refs.form.dialog = true
},
// 导出
download() {
this.downloadLoading = true
import('@/utils/export2Excel').then(excel => {
const tHeader = ['ID', '用户名', '邮箱', '头像地址', '状态', '注册日期', '最后修改密码日期']
const filterVal = ['id', 'username', 'email', 'avatar', 'enabled', 'createTime', 'lastPasswordResetTime']
const data = this.formatJson(filterVal, this.data)
excel.export_json_to_excel({
header: tHeader,
data,
filename: 'table-list'
})
this.downloadLoading = false
})
},
// 数据转换
formatJson(filterVal, jsonData) {
return jsonData.map(v => filterVal.map(j => {
if (j === 'createTime' || j === 'lastPasswordResetTime') {
return parseTime(v[j])
} else if (j === 'enabled') {
return parseTime(v[j]) ? '启用' : '禁用'
} else {
return v[j]
}
}))
},
edit(data) {
this.isAdd = false
const _this = this.$refs.form
_this.getRoles()
_this.getDepts()
_this.getRoleLevel()
_this.roleIds = []
_this.form = { id: data.id, username: data.username, phone: data.phone, email: data.email, enabled: data.enabled.toString(), roles: [], dept: { id: data.dept.id }, job: { id: data.job.id }}
data.roles.forEach(function(data, index) {
_this.roleIds.push(data.id)
})
_this.deptId = data.dept.id
_this.jobId = data.job.id
_this.getJobs(_this.deptId)
_this.dialog = true
}
}
}

48
src/views/system/user/module/edit.vue
View File

@@ -1,48 +0,0 @@
<template>
<div>
<el-button size="mini" type="primary" icon="el-icon-edit" @click="to"/>
<eForm ref="form" :sup_this="sup_this" :is-add="false" :dicts="dicts"/>
</div>
</template>
<script>
import eForm from './form'
export default {
components: { eForm },
props: {
data: {
type: Object,
required: true
},
// index.vue 的this 可用于刷新数据
sup_this: {
type: Object,
required: true
},
dicts: {
type: Array,
required: true
}
},
methods: {
to() {
const _this = this.$refs.form
_this.getRoles()
_this.getDepts()
_this.getRoleLevel()
_this.roleIds = []
_this.form = { id: this.data.id, username: this.data.username, phone: this.data.phone, email: this.data.email, enabled: this.data.enabled.toString(), roles: [], dept: { id: this.data.dept.id }, job: { id: this.data.job.id }}
this.data.roles.forEach(function(data, index) {
_this.roleIds.push(data.id)
})
_this.deptId = this.data.dept.id
_this.jobId = this.data.job.id
_this.getJobs(_this.deptId)
_this.dialog = true
}
}
}
</script>
<style scoped>
div{display: inline-block;margin-right: 3px;}
</style>

110
src/views/system/user/module/header.vue
View File

@@ -1,110 +0,0 @@
<template>
<div class="head-container">
<!-- 搜索 -->
<el-input v-model="query.value" clearable placeholder="输入关键字搜索" style="width: 200px;" class="filter-item" @keyup.enter.native="toQuery"/>
<el-select v-model="query.type" clearable placeholder="类型" class="filter-item" style="width: 130px">
<el-option v-for="item in queryTypeOptions" :key="item.key" :label="item.display_name" :value="item.key"/>
</el-select>
<el-select v-model="query.enabled" clearable placeholder="状态" class="filter-item" style="width: 90px" @change="toQuery">
<el-option v-for="item in enabledTypeOptions" :key="item.key" :label="item.display_name" :value="item.key"/>
</el-select>
<el-button class="filter-item" size="mini" type="success" icon="el-icon-search" @click="toQuery">搜索</el-button>
<!-- 新增 -->
<div v-permission="['ADMIN','USER_ALL','USER_CREATE']" style="display: inline-block;margin: 0px 2px;">
<el-button
class="filter-item"
size="mini"
type="primary"
icon="el-icon-plus"
@click="add">新增</el-button>
<eForm ref="form" :sup_this="sup_this" :is-add="true" :dicts="dicts"/>
</div>
<!-- 导出 -->
<div style="display: inline-block;">
<el-button
v-permission="['ADMIN']"
:loading="downloadLoading"
size="mini"
class="filter-item"
type="warning"
icon="el-icon-download"
@click="download">导出</el-button>
</div>
</div>
</template>
<script>
import { parseTime } from '@/utils/index'
import eForm from './form'
// 查询条件
export default {
components: { eForm },
props: {
query: {
type: Object,
required: true
},
sup_this: {
type: Object,
required: true
},
dicts: {
type: Array,
required: true
}
},
data() {
return {
downloadLoading: false,
queryTypeOptions: [
{ key: 'username', display_name: '用户名' },
{ key: 'email', display_name: '邮箱' }
],
enabledTypeOptions: [
{ key: 'true', display_name: '激活' },
{ key: 'false', display_name: '锁定' }
]
}
},
methods: {
add() {
this.$refs.form.getDepts()
this.$refs.form.getRoles()
this.$refs.form.getRoleLevel()
this.$refs.form.dialog = true
},
// 去查询
toQuery() {
this.sup_this.page = 0
this.sup_this.init()
},
// 导出
download() {
this.downloadLoading = true
import('@/utils/export2Excel').then(excel => {
const tHeader = ['ID', '用户名', '邮箱', '头像地址', '状态', '注册日期', '最后修改密码日期']
const filterVal = ['id', 'username', 'email', 'avatar', 'enabled', 'createTime', 'lastPasswordResetTime']
const data = this.formatJson(filterVal, this.sup_this.data)
excel.export_json_to_excel({
header: tHeader,
data,
filename: 'table-list'
})
this.downloadLoading = false
})
},
// 数据转换
formatJson(filterVal, jsonData) {
return jsonData.map(v => filterVal.map(j => {
if (j === 'createTime' || j === 'lastPasswordResetTime') {
return parseTime(v[j])
} else if (j === 'enabled') {
return parseTime(v[j]) ? '启用' : '禁用'
} else {
return v[j]
}
}))
}
}
}
</script>