[新增功能](el-admin v2.5): v2.5 beta

详情 https://www.ydyno.com/archives/1225.html
This commit is contained in:
ZhengJie
2020-05-05 21:20:36 +08:00
parent a07ac18235
commit 3975e782e7
31 changed files with 687 additions and 482 deletions

View File

@@ -21,8 +21,8 @@
<el-form-item label="字典值" prop="value">
<el-input v-model="form.value" style="width: 370px;" />
</el-form-item>
<el-form-item label="排序" prop="sort">
<el-input-number v-model.number="form.sort" :min="0" :max="999" controls-position="right" style="width: 370px;" />
<el-form-item label="排序" prop="dictSort">
<el-input-number v-model.number="form.dictSort" :min="0" :max="999" controls-position="right" style="width: 370px;" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
@@ -37,7 +37,7 @@
</el-table-column>
<el-table-column prop="label" label="字典标签" />
<el-table-column prop="value" label="字典值" />
<el-table-column prop="sort" label="排序" />
<el-table-column prop="dictSort" label="排序" />
<el-table-column v-permission="['admin','dict:edit','dict:del']" label="操作" width="130px" align="center" fixed="right">
<template slot-scope="scope">
<udOperation
@@ -61,13 +61,13 @@ import pagination from '@crud/Pagination'
import rrOperation from '@crud/RR.operation'
import udOperation from '@crud/UD.operation'
const defaultForm = { id: null, label: null, value: null, sort: 999 }
const defaultForm = { id: null, label: null, value: null, dictSort: 999 }
export default {
components: { pagination, rrOperation, udOperation },
cruds() {
return [
CRUD({ title: '字典详情', url: 'api/dictDetail', query: { dictName: '' }, sort: ['sort,asc', 'id,desc'],
CRUD({ title: '字典详情', url: 'api/dictDetail', query: { dictName: '' }, sort: ['dictSort,asc', 'id,desc'],
crudMethod: { ...crudDictDetail },
optShow: { add: true,
edit: true,
@@ -94,7 +94,7 @@ export default {
value: [
{ required: true, message: '请输入字典值', trigger: 'blur' }
],
sort: [
dictSort: [
{ required: true, message: '请输入序号', trigger: 'blur', type: 'number' }
]
},

View File

@@ -7,7 +7,7 @@
<el-input v-model="form.name" style="width: 370px;" />
</el-form-item>
<el-form-item label="描述">
<el-input v-model="form.remark" style="width: 370px;" />
<el-input v-model="form.description" style="width: 370px;" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
@@ -32,7 +32,7 @@
<el-table ref="table" v-loading="crud.loading" :data="crud.data" highlight-current-row style="width: 100%;" @selection-change="crud.selectionChangeHandler" @current-change="handleCurrentChange">
<el-table-column type="selection" width="55" />
<el-table-column :show-overflow-tooltip="true" prop="name" label="名称" />
<el-table-column :show-overflow-tooltip="true" prop="remark" label="描述" />
<el-table-column :show-overflow-tooltip="true" prop="description" label="描述" />
<el-table-column v-permission="['admin','dict:edit','dict:del']" label="操作" width="130px" align="center" fixed="right">
<template slot-scope="scope">
<udOperation
@@ -79,7 +79,7 @@ import pagination from '@crud/Pagination'
import rrOperation from '@crud/RR.operation'
import udOperation from '@crud/UD.operation'
const defaultForm = { id: null, name: null, remark: null }
const defaultForm = { id: null, name: null, description: null }
export default {
name: 'Dict',
@@ -94,7 +94,7 @@ export default {
return {
queryTypeOptions: [
{ key: 'name', display_name: '字典名称' },
{ key: 'remark', display_name: '描述' }
{ key: 'description', display_name: '描述' }
],
rules: {
name: [

View File

@@ -9,14 +9,9 @@
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
<el-table-column type="selection" width="55" />
<el-table-column prop="name" label="名称" />
<el-table-column prop="dept" label="所属部门">
<el-table-column prop="jobSort" label="排序">
<template slot-scope="scope">
<div>{{ scope.row.deptSuperiorName ? scope.row.deptSuperiorName + ' / ' : '' }}{{ scope.row.dept.name }}</div>
</template>
</el-table-column>
<el-table-column prop="sort" label="排序">
<template slot-scope="scope">
{{ scope.row.sort }}
{{ scope.row.jobSort }}
</template>
</el-table-column>
<el-table-column prop="status" label="状态" align="center">
@@ -73,7 +68,7 @@ export default {
return CRUD({
title: '岗位',
url: 'api/job',
sort: ['sort,asc', 'id,desc'],
sort: ['jobSort,asc', 'id,desc'],
crudMethod: { ...crudJob }
})
},
@@ -98,9 +93,9 @@ export default {
type: 'warning'
}).then(() => {
// eslint-disable-next-line no-undef
crud.crudMethod.edit(data).then(() => {
crudJob.edit(data).then(() => {
// eslint-disable-next-line no-undef
crud.notify(this.dict.label.job_status[val] + '成功', 'success')
this.crud.notify(this.dict.label.job_status[val] + '成功', 'success')
}).catch(err => {
data.enabled = !data.enabled
console.log(err.data.message)

View File

@@ -25,10 +25,10 @@
</el-form-item>
<el-form-item
label="排序"
prop="sort"
prop="jobSort"
>
<el-input-number
v-model.number="form.sort"
v-model.number="form.jobSort"
:min="0"
:max="999"
controls-position="right"
@@ -49,18 +49,6 @@
{{ item.label }}
</el-radio>
</el-form-item>
<el-form-item
label="所属部门"
prop="dept.id"
:rules="rules.dept"
>
<treeselect
v-model="form.dept.id"
:options="depts"
style="width: 370px"
placeholder="选择部门"
/>
</el-form-item>
</el-form>
<div
slot="footer"
@@ -84,22 +72,15 @@
</template>
<script>
import CRUD, { form } from '@crud/crud'
import { getDepts } from '@/api/system/dept'
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import { form } from '@crud/crud'
const defaultForm = {
id: null,
name: '',
sort: 999,
enabled: true,
dept: {
id: 1
}
jobSort: 999,
enabled: true
}
export default {
components: { Treeselect },
mixins: [form(defaultForm)],
props: {
jobStatus: {
@@ -109,35 +90,15 @@ export default {
},
data() {
return {
depts: [],
rules: {
name: [
{ required: true, message: '请输入名称', trigger: 'blur' }
],
sort: [
jobSort: [
{ required: true, message: '请输入序号', trigger: 'blur', type: 'number' }
],
dept: { required: true, message: '所属部门不能为空', trigger: 'select' }
]
}
}
},
methods: {
[CRUD.HOOK.beforeToCU]() {
getDepts({ enabled: true }).then(res => {
this.depts = res.content
})
},
// 提交前的验证
[CRUD.HOOK.afterValidateCU]() {
if (!this.form.dept.id) {
this.$notify({
title: '所属部门不能为空',
type: 'warning'
})
return false
}
return true
}
}
}
</script>

View File

@@ -63,7 +63,7 @@
</el-radio-group>
</el-form-item>
<el-form-item v-show="form.type.toString() !== '2'" label="菜单标题" prop="name">
<el-input v-model="form.name" :style=" form.type.toString() === '0' ? 'width: 450px' : 'width: 178px'" placeholder="菜单标题" />
<el-input v-model="form.title" :style=" form.type.toString() === '0' ? 'width: 450px' : 'width: 178px'" placeholder="菜单标题" />
</el-form-item>
<el-form-item v-show="form.type.toString() === '2'" label="按钮名称" prop="name">
<el-input v-model="form.name" placeholder="按钮名称" style="width: 178px;" />
@@ -71,11 +71,11 @@
<el-form-item v-show="form.type.toString() !== '0'" label="权限标识" prop="permission">
<el-input v-model="form.permission" :disabled="form.iframe" placeholder="权限标识" style="width: 178px;" />
</el-form-item>
<el-form-item v-if="form.type.toString() !== '2'" label="路由地址" prop="path">
<el-input v-model="form.path" placeholder="路由地址" style="width: 178px;" />
<el-form-item v-if="form.type.toString() !== '2'" label="链接地址" prop="path">
<el-input v-model="form.path" placeholder="链接地址" style="width: 178px;" />
</el-form-item>
<el-form-item label="菜单排序" prop="sort">
<el-input-number v-model.number="form.sort" :min="0" :max="999" controls-position="right" style="width: 178px;" />
<el-form-item label="菜单排序" prop="menuSort">
<el-input-number v-model.number="form.menuSort" :min="0" :max="999" controls-position="right" style="width: 178px;" />
</el-form-item>
<el-form-item v-show="!form.iframe && form.type.toString() === '1'" label="组件名称" prop="componentName">
<el-input v-model="form.componentName" style="width: 178px;" placeholder="匹配组件内Name字段" />
@@ -95,15 +95,15 @@
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" :tree-props="{children: 'children', hasChildren: 'hasChildren'}" row-key="id" @select="crud.selectChange" @select-all="crud.selectAllChange" @selection-change="crud.selectionChangeHandler">
<el-table-column type="selection" width="55" />
<el-table-column :show-overflow-tooltip="true" label="菜单名称" width="125px" prop="name" />
<el-table-column :show-overflow-tooltip="true" label="菜单标题" width="125px" prop="title" />
<el-table-column prop="icon" label="图标" align="center" width="60px">
<template slot-scope="scope">
<svg-icon :icon-class="scope.row.icon ? scope.row.icon : ''" />
</template>
</el-table-column>
<el-table-column prop="sort" align="center" label="排序">
<el-table-column prop="menuSort" align="center" label="排序">
<template slot-scope="scope">
{{ scope.row.sort }}
{{ scope.row.menuSort }}
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" prop="path" label="路由地址" />
@@ -156,7 +156,7 @@ import crudOperation from '@crud/CRUD.operation'
import udOperation from '@crud/UD.operation'
// crud交由presenter持有
const defaultForm = { id: null, name: null, sort: 999, path: null, component: null, componentName: null, iframe: false, roles: [], pid: 0, icon: null, cache: false, hidden: false, type: 0, permission: null }
const defaultForm = { id: null, title: null, menuSort: 999, path: null, component: null, componentName: null, iframe: false, roles: [], pid: 0, icon: null, cache: false, hidden: false, type: 0, permission: null }
export default {
name: 'Menu',
components: { Treeselect, IconSelect, crudOperation, rrOperation, udOperation },
@@ -173,8 +173,8 @@ export default {
del: ['admin', 'menu:del']
},
rules: {
name: [
{ required: true, message: '请输入名称', trigger: 'blur' }
title: [
{ required: true, message: '请输入标题', trigger: 'blur' }
],
path: [
{ required: true, message: '请输入地址', trigger: 'blur' }

View File

@@ -24,13 +24,13 @@
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="520px">
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="角色名称" prop="name">
<el-input v-model="form.name" style="width: 145px;" />
<el-input v-model="form.name" style="width: 380px;" />
</el-form-item>
<el-form-item label="角色权限" prop="permission">
<el-input v-model="form.permission" style="width: 145px;" />
<el-form-item label="角色级别" prop="level">
<el-input-number v-model.number="form.level" :min="1" controls-position="right" style="width: 145px;" />
</el-form-item>
<el-form-item label="数据范围" prop="dataScope">
<el-select v-model="form.dataScope" style="width: 145px" placeholder="请选择数据范围" @change="changeScope">
<el-select v-model="form.dataScope" style="width: 140px" placeholder="请选择数据范围" @change="changeScope">
<el-option
v-for="item in dateScopes"
:key="item"
@@ -39,14 +39,11 @@
/>
</el-select>
</el-form-item>
<el-form-item label="角色级别" prop="level">
<el-input-number v-model.number="form.level" :min="1" controls-position="right" style="width: 145px;" />
</el-form-item>
<el-form-item v-if="form.dataScope === '自定义'" label="数据权限" prop="depts">
<treeselect v-model="form.depts" :options="depts" multiple style="width: 380px" placeholder="请选择" />
</el-form-item>
<el-form-item label="描述信息" prop="remark">
<el-input v-model="form.remark" style="width: 380px;" rows="5" type="textarea" />
<el-form-item label="描述信息" prop="description">
<el-input v-model="form.description" style="width: 380px;" rows="5" type="textarea" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
@@ -65,9 +62,8 @@
<el-table-column :selectable="checkboxT" type="selection" width="55" />
<el-table-column prop="name" label="名称" />
<el-table-column prop="dataScope" label="数据权限" />
<el-table-column prop="permission" label="角色权限" />
<el-table-column prop="level" label="角色级别" />
<el-table-column :show-overflow-tooltip="true" prop="remark" label="描述" />
<el-table-column :show-overflow-tooltip="true" prop="description" label="描述" />
<el-table-column :show-overflow-tooltip="true" width="135px" prop="createTime" label="创建日期">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
@@ -133,7 +129,7 @@ import pagination from '@crud/Pagination'
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
const defaultForm = { id: null, name: null, depts: [], remark: null, dataScope: '全部', level: 3, permission: null }
const defaultForm = { id: null, name: null, depts: [], description: null, dataScope: '全部', level: 3 }
export default {
name: 'Role',
components: { Treeselect, pagination, crudOperation, rrOperation, udOperation },
@@ -167,9 +163,6 @@ export default {
crudRoles.getLevel().then(data => {
this.level = data.level
})
this.$nextTick(() => {
this.crud.toQuery()
})
},
methods: {
[CRUD.HOOK.afterRefresh]() {

View File

@@ -32,29 +32,46 @@
<Log ref="log" />
</div>
<!--Form表单-->
<el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" append-to-body width="600px">
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="100px">
<el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" append-to-body width="730px">
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="100px">
<el-form-item label="任务名称" prop="jobName">
<el-input v-model="form.jobName" style="width: 460px;" />
<el-input v-model="form.jobName" style="width: 220px;" />
</el-form-item>
<el-form-item label="任务描述" prop="description">
<el-input v-model="form.description" style="width: 220px;" />
</el-form-item>
<el-form-item label="Bean名称" prop="beanName">
<el-input v-model="form.beanName" style="width: 460px;" />
<el-input v-model="form.beanName" style="width: 220px;" />
</el-form-item>
<el-form-item label="执行方法" prop="methodName">
<el-input v-model="form.methodName" style="width: 460px;" />
</el-form-item>
<el-form-item label="参数内容">
<el-input v-model="form.params" style="width: 460px;" />
<el-input v-model="form.methodName" style="width: 220px;" />
</el-form-item>
<el-form-item label="Cron表达式" prop="cronExpression">
<el-input v-model="form.cronExpression" style="width: 460px;" />
<el-input v-model="form.cronExpression" style="width: 220px;" />
</el-form-item>
<el-form-item label="子任务ID">
<el-input v-model="form.subTask" placeholder="多个用逗号隔开按顺序执行" style="width: 220px;" />
</el-form-item>
<el-form-item label="任务负责人" prop="personInCharge">
<el-input v-model="form.personInCharge" style="width: 220px;" />
</el-form-item>
<el-form-item label="告警邮箱" prop="email">
<el-input v-model="form.email" placeholder="多个邮箱用逗号隔开" style="width: 220px;" />
</el-form-item>
<el-form-item label="失败后暂停">
<el-radio-group v-model="form.pauseAfterFailure" style="width: 220px">
<el-radio :label="true">是</el-radio>
<el-radio :label="false">否</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="任务状态">
<el-radio v-model="form.isPause" :label="false">启用</el-radio>
<el-radio v-model="form.isPause" :label="true">暂停</el-radio>
<el-radio-group v-model="form.isPause" style="width: 220px">
<el-radio :label="false">启用</el-radio>
<el-radio :label="true">暂停</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="任务描述">
<el-input v-model="form.remark" style="width: 460px;" rows="2" type="textarea" />
<el-form-item label="参数内容">
<el-input v-model="form.params" style="width: 556px;" rows="4" type="textarea" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
@@ -65,23 +82,24 @@
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
<el-table-column :selectable="checkboxT" type="selection" width="55" />
<el-table-column :show-overflow-tooltip="true" prop="jobName" width="100px" label="任务名称" />
<el-table-column :show-overflow-tooltip="true" prop="id" label="任务ID" />
<el-table-column :show-overflow-tooltip="true" prop="jobName" label="任务名称" />
<el-table-column :show-overflow-tooltip="true" prop="beanName" label="Bean名称" />
<el-table-column :show-overflow-tooltip="true" prop="methodName" width="90px" label="执行方法" />
<el-table-column :show-overflow-tooltip="true" prop="params" width="80px" label="参数" />
<el-table-column :show-overflow-tooltip="true" prop="cronExpression" width="100px" label="cron表达式" />
<el-table-column :show-overflow-tooltip="true" prop="methodName" label="执行方法" />
<el-table-column :show-overflow-tooltip="true" prop="params" label="参数" />
<el-table-column :show-overflow-tooltip="true" prop="cronExpression" label="cron表达式" />
<el-table-column :show-overflow-tooltip="true" prop="isPause" width="90px" label="状态">
<template slot-scope="scope">
<el-tag :type="scope.row.isPause ? 'warning' : 'success'">{{ scope.row.isPause ? '已暂停' : '运行中' }}</el-tag>
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" prop="remark" label="描述" />
<el-table-column :show-overflow-tooltip="true" prop="createTime" label="创建日期">
<el-table-column :show-overflow-tooltip="true" prop="description" width="150px" label="描述" />
<el-table-column :show-overflow-tooltip="true" prop="createTime" width="136px" label="创建日期">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>
</el-table-column>
<el-table-column v-permission="['admin','timing:edit','timing:del']" label="操作" width="180px" align="center" fixed="right">
<el-table-column v-permission="['admin','timing:edit','timing:del']" label="操作" width="170px" align="center" fixed="right">
<template slot-scope="scope">
<el-button v-permission="['admin','timing:edit']" size="mini" style="margin-right: 3px;" type="text" @click="crud.toEdit(scope.row)">编辑</el-button>
<el-button v-permission="['admin','timing:edit']" style="margin-left: -2px" type="text" size="mini" @click="execute(scope.row.id)">执行</el-button>
@@ -117,7 +135,7 @@ import rrOperation from '@crud/RR.operation'
import crudOperation from '@crud/CRUD.operation'
import pagination from '@crud/Pagination'
const defaultForm = { id: null, jobName: null, beanName: null, methodName: null, params: null, cronExpression: null, isPause: false, remark: null }
const defaultForm = { id: null, jobName: null, subTask: null, beanName: null, methodName: null, params: null, cronExpression: null, pauseAfterFailure: true, isPause: false, personInCharge: null, email: null, description: null }
export default {
name: 'Timing',
components: { Log, pagination, crudOperation, rrOperation },
@@ -137,6 +155,9 @@ export default {
jobName: [
{ required: true, message: '请输入任务名称', trigger: 'blur' }
],
description: [
{ required: true, message: '请输入任务描述', trigger: 'blur' }
],
beanName: [
{ required: true, message: '请输入Bean名称', trigger: 'blur' }
],
@@ -145,6 +166,9 @@ export default {
],
cronExpression: [
{ required: true, message: '请输入Cron表达式', trigger: 'blur' }
],
personInCharge: [
{ required: true, message: '请输入负责人名称', trigger: 'blur' }
]
}
}
@@ -160,6 +184,9 @@ export default {
},
// 改变状态
updateStatus(id, status) {
if (status === '恢复') {
this.updateParams(id)
}
crudJob.updateIsPause(id).then(res => {
this.crud.toQuery()
this.crud.notify(status + '成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
@@ -167,6 +194,9 @@ export default {
console.log(err.response.data.message)
})
},
updateParams(id) {
console.log(id)
},
delMethod(id) {
this.delLoading = true
crudJob.del([id]).then(() => {

View File

@@ -16,15 +16,15 @@
:action="updateAvatarApi"
class="avatar-uploader"
>
<img :src="user.avatar ? baseApi + '/avatar/' + user.avatar : Avatar" title="点击上传头像" class="avatar">
<img :src="user.avatarName ? baseApi + '/avatar/' + user.avatarName : Avatar" title="点击上传头像" class="avatar">
</el-upload>
</div>
<ul class="user-info">
<li><div style="height: 100%"><svg-icon icon-class="login" /> 登录账号<div class="user-right">{{ user.username }}</div></div></li>
<li><svg-icon icon-class="user1" /> 用户昵称 <div class="user-right">{{ user.nickName }}</div></li>
<li><svg-icon icon-class="dept" /> 所属部门 <div class="user-right"> {{ user.dept.name }}</div></li>
<li><svg-icon icon-class="phone" /> 手机号码 <div class="user-right">{{ user.phone }}</div></li>
<li><svg-icon icon-class="email" /> 用户邮箱 <div class="user-right">{{ user.email }}</div></li>
<li><svg-icon icon-class="dept" /> 所属部门 <div class="user-right"> {{ user.dept.name }} / {{ user.job.name }}</div></li>
<li>
<svg-icon icon-class="anq" /> 安全设置
<div class="user-right">
@@ -51,7 +51,7 @@
<span style="color: #C0C0C0;margin-left: 10px;">手机号码不能重复</span>
</el-form-item>
<el-form-item label="性别">
<el-radio-group v-model="form.sex" style="width: 178px">
<el-radio-group v-model="form.gender" style="width: 178px">
<el-radio label="男"></el-radio>
<el-radio label="女"></el-radio>
</el-radio-group>
@@ -158,7 +158,7 @@ export default {
])
},
created() {
this.form = { id: this.user.id, nickName: this.user.nickName, sex: this.user.sex, phone: this.user.phone }
this.form = { id: this.user.id, nickName: this.user.nickName, gender: this.user.gender, phone: this.user.phone }
store.dispatch('GetInfo').then(() => {})
},
methods: {

View File

@@ -48,7 +48,6 @@ export default {
return {
loading: false, dialog: false, title: '修改邮箱', form: { pass: '', email: '', code: '' },
user: { email: '', password: '' }, codeLoading: false,
codeData: { type: 'email', value: '' },
buttonName: '获取验证码', isDisabled: false, time: 60,
rules: {
pass: [
@@ -71,9 +70,8 @@ export default {
if (this.form.email && this.form.email !== this.email) {
this.codeLoading = true
this.buttonName = '验证码发送中'
this.codeData.value = this.form.email
const _this = this
resetEmail(this.codeData).then(res => {
resetEmail(this.form.email).then(res => {
this.$message({
showClose: true,
message: '发送成功验证码有效期5分钟',

View File

@@ -89,21 +89,27 @@
:options="depts"
style="width: 178px"
placeholder="选择部门"
@select="selectFun"
/>
</el-form-item>
<el-form-item label="岗位" prop="job.id">
<el-select v-model="form.job.id" style="width: 178px" placeholder="请先选择部门">
<el-form-item label="岗位" prop="jobs">
<el-select
v-model="form.jobs"
style="width: 178px"
multiple
placeholder="请选择"
@remove-tag="deleteTag"
@change="changeJob"
>
<el-option
v-for="(item, index) in jobs"
:key="item.name + index"
v-for="item in jobs"
:key="item.name"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item label="性别">
<el-radio-group v-model="form.sex" style="width: 178px">
<el-radio-group v-model="form.gender" style="width: 178px">
<el-radio label="">男</el-radio>
<el-radio label="">女</el-radio>
</el-radio-group>
@@ -146,12 +152,12 @@
<el-table-column :selectable="checkboxT" type="selection" width="55" />
<el-table-column :show-overflow-tooltip="true" prop="username" label="用户名" />
<el-table-column :show-overflow-tooltip="true" prop="nickName" label="昵称" />
<el-table-column prop="sex" label="性别" />
<el-table-column prop="gender" label="性别" />
<el-table-column :show-overflow-tooltip="true" prop="phone" width="100" label="电话" />
<el-table-column :show-overflow-tooltip="true" width="125" prop="email" label="邮箱" />
<el-table-column :show-overflow-tooltip="true" width="110" prop="dept" label="部门 / 岗位">
<el-table-column :show-overflow-tooltip="true" width="135" prop="email" label="邮箱" />
<el-table-column :show-overflow-tooltip="true" prop="dept" label="部门">
<template slot-scope="scope">
<div>{{ scope.row.dept.name }} / {{ scope.row.job.name }}</div>
<div>{{ scope.row.dept.name }}</div>
</template>
</el-table-column>
<el-table-column label="状态" align="center" prop="enabled">
@@ -209,7 +215,8 @@ import { mapGetters } from 'vuex'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
let userRoles = []
const defaultForm = { id: null, username: null, nickName: null, sex: '男', email: null, enabled: 'false', roles: [], job: { id: null }, dept: { id: null }, phone: null }
let userJobs = []
const defaultForm = { id: null, username: null, nickName: null, gender: '男', email: null, enabled: 'false', roles: [], jobs: [], dept: { id: null }, phone: null }
export default {
name: 'User',
components: { Treeselect, crudOperation, rrOperation, udOperation, pagination },
@@ -270,7 +277,6 @@ export default {
created() {
this.$nextTick(() => {
this.getDeptDatas()
this.crud.toQuery()
this.crud.msg.add = '新增成功默认密码123456'
})
},
@@ -288,6 +294,13 @@ export default {
userRoles.push(role)
})
},
changeJob(value) {
userJobs = []
value.forEach(function(data, index) {
const job = { id: data }
userJobs.push(job)
})
},
[CRUD.HOOK.afterAddError](crud) {
this.afterErrorMethod(crud)
},
@@ -297,10 +310,15 @@ export default {
afterErrorMethod(crud) {
// 恢复select
const initRoles = []
const initJobs = []
userRoles.forEach(function(role, index) {
initRoles.push(role.id)
})
userJobs.forEach(function(job, index) {
initJobs.push(job.id)
})
crud.form.roles = initRoles
crud.form.jobs = initJobs
},
deleteTag(value) {
userRoles.forEach(function(data, index) {
@@ -314,20 +332,30 @@ export default {
this.getDepts()
this.getRoles()
this.getRoleLevel()
this.getJobs()
form.enabled = form.enabled.toString()
},
// 打开编辑弹窗前做的操作
[CRUD.HOOK.beforeToEdit](crud, form) {
this.getJobs(this.form.dept.id)
userRoles = []
userJobs = []
const roles = []
const jobs = []
form.roles.forEach(function(role, index) {
roles.push(role.id)
// 初始化编辑时候的角色
const rol = { id: role.id }
userRoles.push(rol)
})
form.jobs.forEach(function(job, index) {
jobs.push(job.id)
// 初始化编辑时候的岗位
const data = { id: job.id }
userJobs.push(data)
})
form.roles = roles
form.jobs = jobs
},
// 提交前做的操作
[CRUD.HOOK.afterValidateCU](crud) {
@@ -337,13 +365,13 @@ export default {
type: 'warning'
})
return false
} else if (!crud.form.job.id) {
} else if (crud.form.jobs.length === 0) {
this.$message({
message: '岗位不能为空',
type: 'warning'
})
return false
} else if (this.roles.length === 0) {
} else if (crud.form.roles.length === 0) {
this.$message({
message: '角色不能为空',
type: 'warning'
@@ -351,6 +379,7 @@ export default {
return false
}
crud.form.roles = userRoles
crud.form.jobs = userJobs
return true
},
// 获取左侧部门数据
@@ -400,16 +429,11 @@ export default {
}).catch(() => { })
},
// 获取弹窗内岗位数据
getJobs(id) {
getAllJob(id).then(res => {
getJobs() {
getAllJob().then(res => {
this.jobs = res.content
}).catch(() => { })
},
// 点击部门搜索对应的岗位
selectFun(node, instanceId) {
this.getJobs(node.id)
this.form.job.id = null
},
// 获取权限级别
getRoleLevel() {
getLevel().then(res => {