Merge branch 'develop' of https://gitee.com/siwa-team/dawa-vue into develop

This commit is contained in:
qinjie 2021-09-01 08:58:39 +08:00
commit 385a56f457
39 changed files with 2342 additions and 1377 deletions

36
README.en.md Normal file
View File

@ -0,0 +1,36 @@
# 大娃-VUE
#### Description
大娃前端
#### Software Architecture
Software architecture description
#### Installation
1. xxxx
2. xxxx
3. xxxx
#### Instructions
1. xxxx
2. xxxx
3. xxxx
#### Contribution
1. Fork the repository
2. Create Feat_xxx branch
3. Commit your code
4. Create Pull Request
#### Gitee Feature
1. You can use Readme\_XXX.md to support different languages, such as Readme\_en.md, Readme\_zh.md
2. Gitee blog [blog.gitee.com](https://blog.gitee.com)
3. Explore open source project [https://gitee.com/explore](https://gitee.com/explore)
4. The most valuable open source project [GVP](https://gitee.com/gvp)
5. The manual of Gitee [https://gitee.com/help](https://gitee.com/help)
6. The most popular members [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/)

View File

@ -2,11 +2,11 @@ import request from '@/utils/request'
const menuApi = {
add: 'sys/menu/add',
get: 'sys/menu/get',
update: 'sys/menu/update',
del: 'sys/menu/delete',
updateStatus: 'sys/menu/updateStatus',
list: 'sys/menu/listByParentId'
edit: 'sys/menu/edit',
del: 'sys/menu/del',
list: 'sys/menu/list',
tree: 'sys/menu/tree',
treeForGrant: 'sys/menu/treeForGrant'
}
export function menuAdd (params) {
@ -16,38 +16,38 @@ export function menuAdd (params) {
data: params
})
}
export function menuGet (params) {
export function menuEdit (params) {
return request({
url: menuApi.get,
url: menuApi.edit,
method: 'post',
data: params
})
}
export function menuUpdate (params) {
return request({
url: menuApi.update,
method: 'post',
data: params
})
}
export function menuDelete (params) {
export function menuDel (params) {
return request({
url: menuApi.del,
method: 'post',
data: params
params: params
})
}
export function menuList (params) {
return request({
url: menuApi.list,
method: 'post',
data: params
method: 'get',
params: params
})
}
export function menuUpdateStatus (params) {
export function menuTree (params) {
return request({
url: menuApi.updateStatus,
method: 'post',
data: params
url: menuApi.tree,
method: 'get',
params: params
})
}
export function menuTreeForGrant (params) {
return request({
url: menuApi.treeForGrant,
method: 'get',
params: params
})
}

View File

@ -2,11 +2,12 @@ import request from '@/utils/request'
const roleApi = {
add: '/sys/role/add',
get: '/sys/role/getById',
update: '/sys/role/update',
del: '/sys/role/delete',
page: '/sys/role/page',
updateStatus: '/sys/role/updateStatus'
edit: '/sys/role/edit',
del: '/sys/role/del',
page: '/sys/role/pageList',
list: '/sys/role/list',
ownMenu: '/sys/role/ownMenu',
grantMenu: '/sys/role/grantMenu'
}
export function roleAdd (params) {
@ -16,37 +17,44 @@ export function roleAdd (params) {
data: params
})
}
export function roleGet (params) {
export function roleEdit (params) {
return request({
url: roleApi.get,
url: roleApi.edit,
method: 'post',
data: params
})
}
export function roleUpdate (params) {
return request({
url: roleApi.update,
method: 'post',
data: params
})
}
export function roleDelete (params) {
export function roleDel (params) {
return request({
url: roleApi.del,
method: 'post',
data: params
params: params
})
}
export function rolePage (params) {
return request({
url: roleApi.page,
method: 'post',
data: params
method: 'get',
params: params
})
}
export function roleUpdateStatus (params) {
export function roleList (params) {
return request({
url: roleApi.updateStatus,
url: roleApi.list,
method: 'get',
params: params
})
}
export function roleOwnMenu (params) {
return request({
url: roleApi.ownMenu,
method: 'post',
params: params
})
}
export function roleGrantMenu (params) {
return request({
url: roleApi.grantMenu,
method: 'post',
data: params
})

View File

@ -4,16 +4,17 @@ const userApi = {
login: '/login',
logout: '/logout',
add: '/sys/user/add',
get: '/sys/user/get',
update: '/sys/user/update',
del: '/sys/user/delete',
page: '/sys/user/page',
updateEnabled: '/sys/user/updateEnabled',
getInfo: '/sys/user/getInfo'
edit: '/sys/user/edit',
del: '/sys/user/del',
page: '/sys/user/pageList',
getInfo: '/sys/user/getInfo',
ownRole: '/sys/user/ownRole',
grantRole: '/sys/user/grantRole'
}
const userPasswordApi = {
update: '/sys/user/passwordUpdate',
reset: '/sys/user/passwordReset'
}
export function userLogin (params) {
@ -24,48 +25,35 @@ export function userLogin (params) {
})
}
export function userAdd (params) {
export function userAdd (params,password) {
return request({
url: userApi.add,
method: 'post',
data: params
data: params,
params: password
})
}
export function userGet (params) {
export function userEdit (params) {
return request({
url: userApi.get,
url: userApi.edit,
method: 'post',
data: params
})
}
export function userUpdate (params) {
return request({
url: userApi.update,
method: 'post',
data: params
})
}
export function userDelete (params) {
export function userDel (params) {
return request({
url: userApi.del,
method: 'post',
data: params
params: params
})
}
export function userPage (params) {
return request({
url: userApi.page,
method: 'post',
data: params
method: 'get',
params: params
})
}
export function userLogout (params) {
// return request({
// url: userApi.logout,
// method: 'post',
// data: params
// })
}
export function getInfo (params) {
return request({
url: userApi.getInfo,
@ -73,9 +61,16 @@ export function getInfo (params) {
data: params
})
}
export function userUpdateEnabled (params) {
export function userOwnRole (params) {
return request({
url: userApi.updateEnabled,
url: userApi.ownRole,
method: 'post',
params: params
})
}
export function userGrantRole (params) {
return request({
url: userApi.grantRole,
method: 'post',
data: params
})
@ -87,3 +82,10 @@ export function passwordUpdate (params) {
data: params
})
}
export function passwordReset (params) {
return request({
url: userPasswordApi.reset,
method: 'post',
data: params
})
}

View File

@ -162,6 +162,10 @@ export default {
pageSize: (pagination && pagination.pageSize) ||
this.localPagination.pageSize
}) || false
// 后端数据rows为null保存修复
if (r.rows == null) {
r.rows = []
}
// 为防止删除数据后导致页面当前页面数据长度为 0 ,自动翻页到上一页
if (r.rows.length === 0 && this.showPagination && this.localPagination.current > 1) {
this.localPagination.current--
@ -178,7 +182,13 @@ export default {
// } catch (e) {
// this.localPagination = false
// }
this.localDataSource = r.rows // 返回结果中的数组数据
// 返回结果中的数组数据
if (this.showPagination === false) {
// 不分页的直接是在data中我们在界面中直接就是返回了data
this.localDataSource = r
} else {
this.localDataSource = r.rows
}
this.localLoading = false
})
}

View File

@ -52,9 +52,9 @@ export const asyncRouterMap = [
meta: { title: '角色管理', keepAlive: true }
},
{
path: '/security/resource',
name: 'SecurityResource',
component: () => import('@/views/security/resource/ResourceTree'),
path: '/security/menu',
name: 'SecurityMenu',
component: () => import('@/views/security/menu/MenuList'),
meta: { title: '菜单管理', keepAlive: true }
},
{
@ -84,24 +84,24 @@ export const asyncRouterMap = [
component: () => import('@/views/project/ProjectList'),
meta: { title: '自主项目', keepAlive: true, permission: ['form'] },
},
// {
// path: '/project/add',
// name: 'ProjectForm',
// component: () => import('@/views/project/ProjectForm'),
// meta: { title: '新增项目', keepAlive: true, permission: ['form'], show: false }
// },
{
path: '/project/add',
name: 'ProjectForm',
component: () => import('@/views/project/ProjectForm'),
meta: { title: '新增项目', keepAlive: true, permission: ['form'], show: false }
},
{
path: '/project/addClass',
name: 'addClass',
component: () => import('@/views/project/AddClass'),
meta: { title: '新增种类', keepAlive: true, permission: ['form'] }
},
{
path: '/project/unitSelect',
name: 'unitSelect',
component: () => import('@/views/project/ProjectUnitSelect'),
meta: { title: '选择单位', keepAlive: true, permission: ['form'] }
path: '/project/projectStepForm',
name: 'projectStepForm',
component: () => import('@/views/project/form/ProjectStepForm'),
meta: { title: '新增项目-分布', keepAlive: true, permission: ['form'] }
},
// {
// path: '/project/unitSelect',
// name: 'unitSelect',
// component: () => import('@/views/project/ProjectUnitSelect'),
// meta: { title: '选择单位', keepAlive: true, permission: ['form'] }
// },
{
path: '/form/step-form',
name: 'StepForm',

View File

@ -48,7 +48,8 @@ import {
space,
Transfer,
Tree,
Empty
Empty,
TreeSelect
} from 'ant-design-vue'
import Viser from 'viser-vue'
@ -105,6 +106,7 @@ Vue.use(space)
Vue.use(Tree)
Vue.use(Transfer)
Vue.use(Empty)
Vue.use(TreeSelect)
Vue.prototype.$confirm = Modal.confirm
Vue.prototype.$message = message

View File

@ -49,7 +49,7 @@ const errorHandler = (error) => {
request.interceptors.request.use(config => {
// const token = storage.get(ACCESS_TOKEN)
// 由于登录接口待联调token使用默认值
const token = 'eyJhbGciOiJIUzUxMiJ9.eyJsb2dpbl91c2VyX2tleSI6ImU1MmNhNTQ4LThmYmMtNGUyNC1iZjZjLWEzZjgwNDAwMDNiMCJ9._j_AHCd4I_PTWk4mt9euUzlABBoiqsNAIjVGrFJPWv8ZyoqgH9JPs2QFHtoj1Vly8cgtOri8X0ylbttglCcUQQ'
const token = 'eyJhbGciOiJIUzUxMiJ9.eyJsb2dpbl91c2VyX2tleSI6IjIwMzU2Nzg5LWYyOGEtNDYxYi1iNTRhLTM2MWYzZjdhZjg2NSJ9.4vGoaj9KK8aYp9gEz2cnRM8MBWPrqIo8O5wNgbYK4-JUE3naeEuejjr3JfZ57TLbMYWqG1MkJ0kAT-2GMgreGQ'
// 如果 token 存在,让每个请求携带自定义 token 请根据实际情况自行修改
if (token) {
config.headers[ACCESS_TOKEN] = token

View File

@ -65,3 +65,23 @@ export function removeLoadingAnimate (id = '', timeout = 1500) {
document.body.removeChild(document.getElementById(id))
}, timeout)
}
export function listToTree (list, tree, parentId) {
list.forEach(item => {
if (item.pid === parentId) {
const child = {
...item,
scopedSlots: {
icon: 'icon'
},
children: []
}
listToTree(list, child.children, item.id)
if (child.children.length <= 0) {
delete child.children
}
tree.push(child)
}
})
return tree
}

View File

@ -0,0 +1,5 @@
export const menuTypeMap = {
0: '目录',
1: '菜单',
2: '按钮'
}

View File

@ -0,0 +1,5 @@
export const sexMap = {
0: '未知',
1: '男',
2: '女'
}

View File

@ -303,6 +303,7 @@ export default {
},
onSelectChange (selectedRowKeys, selectedRows) {
this.selectedRowKeys = selectedRowKeys
console.log(this.selectedRowKeys.length)
this.selectedRows = selectedRows
},
toggleAdvanced () {

View File

@ -1,131 +0,0 @@
<template>
<page-header-wrapper :title="新增项目">
<a-form-model :model="form" :label-col="labelCol" :wrapper-col="wrapperCol" :layout="vertical">
<a-form-model-item label="项目名称">
<a-input v-model="form.projectName" v-decorator="[
'projectName',
{
rules: [{ required: true, message: '项目名称为必填' }],
},
]"/>
</a-form-model-item>
<a-form-model-item label="培训种类">
<a-select v-model="form.trainClass" placeholder="--请选择--">
<a-select-option value="shanghai"> Zone one </a-select-option>
<a-select-option value="beijing"> Zone two </a-select-option>
</a-select>
</a-form-model-item>
<a-form-model-item label="培训类型">
<a-select v-model="form.trainType" placeholder="--请选择--">
<a-select-option value="1"> 必修课 </a-select-option>
<a-select-option value="2"> 选修课 </a-select-option>
</a-select>
</a-form-model-item>
<a-form-model-item label="培训方式">
<a-select v-model="form.trainWay" placeholder="--请选择--">
<a-select-option value="1"> 培训 </a-select-option>
<a-select-option value="2"> 考试 </a-select-option>
<a-select-option value="3"> 培训-练习 </a-select-option>
<a-select-option value="4"> 培训-练习-考试 </a-select-option>
</a-select>
</a-form-model-item>
<a-form-model-item label="人员类型">
<a-select v-model="form.personType" placeholder="--请选择--">
<a-select-option v-for="item in personType" :key="item.id"> {{ item.name }} </a-select-option>
</a-select>
</a-form-model-item>
<!-- 时间选择器呢 -->
<a-form-item label="培训时间" style="margin-bottom: 0">
<a-form-item :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }">
<a-date-picker v-model="form.trainSdate" style="width: 100%" valueFormat="YYYY-MM-DD HH:mm:ss" />
</a-form-item>
<span :style="{ display: 'inline-block', width: '24px', textAlign: 'center' }"> - </span>
<a-form-item :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }">
<a-date-picker v-model="form.trainEdate" style="width: 100%" valueFormat="YYYY-MM-DD HH:mm:ss" />
</a-form-item>
</a-form-item>
<!-- 时间选择器 -->
<a-form-item v-if="['2', '3', '4'].includes(form.trainWay)" label="练习时间" style="margin-bottom: 0">
<a-form-item :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }">
<a-date-picker v-model="form.practiceSdate" style="width: 100%" valueFormat="YYYY-MM-DD HH:mm:ss" />
</a-form-item>
<span :style="{ display: 'inline-block', width: '24px', textAlign: 'center' }"> - </span>
<a-form-item :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }">
<a-date-picker v-model="form.practiceEdate" style="width: 100%" valueFormat="YYYY-MM-DD HH:mm:ss" />
</a-form-item>
</a-form-item>
<!-- 时间选择器 -->
<a-form-item v-if="['2', '3', '4'].includes(form.trainWay)" label="考试时间" style="margin-bottom: 0">
<a-form-item :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }">
<a-date-picker v-model="form.examSdate" style="width: 100%" valueFormat="YYYY-MM-DD HH:mm:ss" />
</a-form-item>
<span :style="{ display: 'inline-block', width: '24px', textAlign: 'center' }"> - </span>
<a-form-item :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }">
<a-date-picker v-model="form.examEdate" style="width: 100%" valueFormat="YYYY-MM-DD HH:mm:ss" />
</a-form-item>
</a-form-item>
<!-- 考试次数 -->
<a-form-item v-if="['2', '3', '4'].includes(form.trainWay)" label="考试次数" style="margin-bottom: 0">
<a-form-item :style="{ display: 'inline-block', width: 'calc(30% - 1px)' }">
<a-input-number v-model="form.examNumber" :min="0" style="width: 100%" />
</a-form-item>
<span> 补考次数: </span>
<a-form-item :style="{ display: 'inline-block', width: 'calc(30% - 1px)' }">
<a-input-number v-model="form.resitNumber" :min="0" style="width: 100%" />
</a-form-item>
<a-form-item :style="{ display: 'inline-block', width: 'calc(30% - 1px)' }">
<a-button type="primary" @click="javascript;"> 随机补考 </a-button>
</a-form-item>
</a-form-item>
<a-form-model-item label="模拟考试" v-if="['2', '3', '4'].includes(form.trainWay)">
<a-radio-group v-model="form.mockExam">
<a-radio value="1"> 允许 </a-radio>
<a-radio value="0"> 不允许 </a-radio>
</a-radio-group>
</a-form-model-item>
<a-form-model-item label="备注">
<a-input v-model="form.remark" type="textarea" />
</a-form-model-item>
<a-form-model-item :wrapper-col="{ span: 14, offset: 4 }">
<a-button type="primary" @click="toNext"> 下一步 </a-button>
<a-button style="margin-left: 10px"> 取消 </a-button>
</a-form-model-item>
</a-form-model>
</page-header-wrapper>
</template>
<script>
import {getPersonType} from '@/api/project/project'
export default {
data() {
return {
labelCol: { span: 4 },
wrapperCol: { span: 14 },
form: {
projectName: '',
},
}
},
components: {
getPersonType,
},
created: {
},
methods: {
//
getPersonType() {
return getPersonType(Object.assign(parameter)).then((res) => {
return res
})
},
//from
toNext() {
console.log('toNext', this.form)
},
},
}
</script>

View File

@ -75,7 +75,7 @@
import moment from 'moment'
import { STable } from '@/components'
import { getProjectList } from '@/api/project/project'
import ProjectForm from '@/views/project/ProjectForm'
import ProjectForm from '@/views/project/form/ProjectForm'
import router from '@/router/index.js'
export default {
@ -107,7 +107,6 @@ export default {
{
title: '项目状态',
dataIndex: 'status',
key: 'status',
customRender: (text, record, index) => {
// 1- 2- 3- 4- 5-
if (text == 1) {
@ -132,7 +131,6 @@ export default {
{
title: '操作',
width: 200,
key: 'status',
align: 'center',
scopedSlots: { customRender: 'action' },
},

View File

@ -0,0 +1,38 @@
<template>
<div>
<h1>课程选择</h1>
</div>
</template>
<script>
//jsjsjson
//import from ''
export default {
//import使
components: {},
props: {},
data() {
//
return {};
},
// data
computed: {},
//data
watch: {},
//
methods: {},
created() {}, // - 访this
mounted() {}, // - 访DOM
beforeCreate() {}, // -
beforeMount() {}, // -
beforeUpdate() {}, // -
updated() {}, // -
beforeDestroy() {}, // -
destroyed() {}, // -
activated() {} //keep-alive
};
</script>
<style scoped>
</style>

View File

@ -0,0 +1,188 @@
<template>
<!-- <page-header-wrapper :title="新增项目"> -->
<a-form-model :model="form" :label-col="labelCol" :wrapper-col="wrapperCol" :layout="vertical">
<a-row :gutter="24">
<a-col :md="24" :sm="24">
<a-form-model-item label="项目名称">
<a-input
v-model="form.projectName"
v-decorator="[
'projectName',
{
rules: [{ required: true, message: '项目名称为必填' }],
},
]"
/>
</a-form-model-item>
</a-col>
</a-row>
<a-row>
<a-col :span="12">
<a-form-model-item label="培训种类">
<a-select v-model="form.trainClass" placeholder="--请选择--">
<a-select-option value="shanghai"> Zone one </a-select-option>
</a-select>
<a-button type="primary" @click="createClass"> 新增种类 </a-button>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item label="培训类型">
<a-select v-model="form.trainType" placeholder="--请选择--">
<a-select-option value="1"> 必修课 </a-select-option>
<a-select-option value="2"> 选修课 </a-select-option>
</a-select>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item label="培训方式">
<a-select v-model="form.trainWay" placeholder="--请选择--">
<a-select-option value="1"> 培训 </a-select-option>
<a-select-option value="2"> 考试 </a-select-option>
<a-select-option value="3"> 培训-练习 </a-select-option>
<a-select-option value="4"> 培训-练习-考试 </a-select-option>
</a-select>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item label="人员类型">
<a-select v-model="form.personType" placeholder="--请选择--">
<a-select-option v-for="item in personType" :key="item.value"> {{ item.name }} </a-select-option>
</a-select>
</a-form-model-item>
</a-col>
<!-- 时间选择器呢 -->
<a-col :span="24">
<a-form-item label="培训时间" style="margin-bottom: 0">
<a-form-item :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }">
<a-date-picker v-model="form.trainSdate" style="width: 100%" valueFormat="YYYY-MM-DD HH:mm:ss" />
</a-form-item>
<span :style="{ display: 'inline-block', width: '24px', textAlign: 'center' }"> - </span>
<a-form-item :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }">
<a-date-picker v-model="form.trainEdate" style="width: 100%" valueFormat="YYYY-MM-DD HH:mm:ss" />
</a-form-item>
</a-form-item>
</a-col>
<!-- 时间选择器 -->
<a-col :span="24">
<a-form-item v-if="['2', '3', '4'].includes(form.trainWay)" label="练习时间" style="margin-bottom: 0">
<a-form-item :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }">
<a-date-picker v-model="form.practiceSdate" style="width: 100%" valueFormat="YYYY-MM-DD HH:mm:ss" />
</a-form-item>
<span :style="{ display: 'inline-block', width: '24px', textAlign: 'center' }"> - </span>
<a-form-item :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }">
<a-date-picker v-model="form.practiceEdate" style="width: 100%" valueFormat="YYYY-MM-DD HH:mm:ss" />
</a-form-item>
</a-form-item>
</a-col>
<!-- 时间选择器 -->
<a-col :span="24">
<a-form-item v-if="['2', '3', '4'].includes(form.trainWay)" label="考试时间" style="margin-bottom: 0">
<a-form-item :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }">
<a-date-picker v-model="form.examSdate" style="width: 100%" valueFormat="YYYY-MM-DD HH:mm:ss" />
</a-form-item>
<span :style="{ display: 'inline-block', width: '24px', textAlign: 'center' }"> - </span>
<a-form-item :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }">
<a-date-picker v-model="form.examEdate" style="width: 100%" valueFormat="YYYY-MM-DD HH:mm:ss" />
</a-form-item>
</a-form-item>
</a-col>
<!-- 考试次数 -->
<a-col :span="24">
<a-form-item v-if="['2', '3', '4'].includes(form.trainWay)" label="考试次数" style="margin-bottom: 0">
<a-form-item :style="{ display: 'inline-block', width: 'calc(30% - 1px)' }">
<a-input-number v-model="form.examNumber" :min="0" style="width: 100%" />
</a-form-item>
<span> 补考次数: </span>
<a-form-item :style="{ display: 'inline-block', width: 'calc(30% - 1px)' }">
<a-input-number v-model="form.resitNumber" :min="0" style="width: 100%" />
</a-form-item>
<a-form-item :style="{ display: 'inline-block', width: 'calc(30% - 1px)' }">
<a-button type="primary" @click="javascript;"> 随机补考 </a-button>
</a-form-item>
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-model-item label="模拟考试" v-if="['2', '3', '4'].includes(form.trainWay)">
<a-radio-group v-model="form.mockExam">
<a-radio value="1"> 允许 </a-radio>
<a-radio value="0"> 不允许 </a-radio>
</a-radio-group>
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-model-item label="备注">
<a-input v-model="form.remark" type="textarea" />
</a-form-model-item>
</a-col>
<a-col :span="24">
<a-form-model-item :wrapper-col="{ span: 14, offset: 4 }">
<a-button type="primary" @click="toNext"> 下一步 </a-button>
<a-button style="margin-left: 10px"> 取消 </a-button>
</a-form-model-item>
</a-col>
</a-row>
</a-form-model>
<!-- </page-header-wrapper> -->
</template>
<script>
import { dictGet } from '@/api/project/project'
export default {
data() {
return {
labelCol: { span: 4 },
wrapperCol: { span: 14 },
form: this.$form.createForm(this),
personType: [],
}
},
components: {
dictGet,
},
created() {
this.fetchTemplateData()
},
methods: {
//
fetchTemplateData() {
console.log('fetchTemplateData')
let formData = { type: 1 }
//
dictGet(formData).then((res) => {
console.log(res)
//
if (res.code == 200) {
const result = res.data
result.forEach((r) => {
this.personType.push({
value: r.value,
name: r.name,
})
})
console.log("----------------",this.personType)
}
})
},
//
//from
toNext() {
console.log('toNext', this.form)
const {
form: { validateFields },
} = this
//
validateFields((err, values) => {
if (!err) {
this.$emit('nextStep')
}
})
},
createClass(){
console.log("-------createClass--------")
}
},
}
</script>

View File

@ -0,0 +1,70 @@
<template>
<page-header-wrapper>
<!-- PageHeader 第二种使用方式 (v-slot) -->
<template v-slot:content>
将一个冗长或用户不熟悉的表单任务分成多个步骤指导用户完成
</template>
<a-card :bordered="false">
<a-steps class="steps" :current="currentTab">
<a-step title="基本信息" />
<a-step title="选择单位" />
<a-step title="选择课程" />
<a-step title="选择人员" />
<a-step title="完成" />
</a-steps>
<div class="content">
<step1 v-if="currentTab === 0" @nextStep="nextStep"/>
<step2 v-if="currentTab === 1" @nextStep="nextStep" @prevStep="prevStep"/>
<step2 v-if="currentTab === 2" @nextStep="nextStep" @prevStep="prevStep"/>
<step2 v-if="currentTab === 3" @nextStep="nextStep" @prevStep="prevStep"/>
<step3 v-if="currentTab === 4" @prevStep="prevStep" @finish="finish"/>
</div>
</a-card>
</page-header-wrapper>
</template>
<script>
import Step1 from './ProjectForm'
import Step2 from './ProjectUnitSelect.vue'
import Step3 from './ProjectCourseSelect.vue'
export default {
name: 'StepForm',
components: {
Step1,
Step2,
Step3,
},
data () {
return {
currentTab: 0,
// form
form: null,
}
},
methods: {
// handler
nextStep () {
if (this.currentTab < 2) {
this.currentTab += 1
}
},
prevStep () {
if (this.currentTab > 0) {
this.currentTab -= 1
}
},
finish () {
this.currentTab = 0
}
}
}
</script>
<style lang="less" scoped>
.steps {
max-width: 750px;
margin: 16px auto;
}
</style>

View File

@ -1,7 +1,7 @@
<template>
<page-header-wrapper title="请选择受训单位">
<a-form-model :model="form">
<a-form-model-item :wrapper-col="{ span: 14, offset: 4,}" >
<a-form-model-item :wrapper-col="{ span: 14, offset: 4 }">
<a-button type="primary" @click="toNext"> 下一步 </a-button>
<a-button style="margin-left: 10px"> 取消 </a-button>
</a-form-model-item>
@ -111,7 +111,7 @@ function handleTreeData(data, targetKeys = []) {
export default {
data() {
return {
form: {},
form: this.$form.createForm(this),
targetKeys: [],
dataSource: transferDataSource,
@ -131,6 +131,18 @@ export default {
},
},
methods: {
toNext() {
console.log('toNext', this.form)
const {
form: { validateFields },
} = this
//
validateFields((err, values) => {
if (!err) {
this.$emit('nextStep')
}
})
},
onChange(targetKeys) {
console.log('Target Keys:', targetKeys)
this.targetKeys = targetKeys

View File

@ -1,5 +0,0 @@
export const typeMap = {
'CORPORATION': '公司',
'MALL': '门店',
'STORE': '店铺'
}

View File

@ -0,0 +1,388 @@
<template>
<a-modal
:title="modalTitle"
:width="1000"
:visible="visible"
:confirmLoading="confirmLoading"
@ok="handleSubmit"
@cancel="handleCancel"
:destroyOnClose="true"
>
<a-spin :spinning="formLoading">
<a-form :form="form" >
<a-form-item v-show="false" >
<a-input v-decorator="['id']" />
</a-form-item>
<a-row :gutter="24">
<a-col :md="12" :sm="24">
<a-form-item
label="菜单名称"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
hasFeedback
>
<a-input placeholder="请输入菜单名称" v-decorator="['name',{rules: [{required: true, min: 1, message: '请输入菜单名称'}]}]" />
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item
style="width: 100%"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="菜单编号"
hasFeedback
>
<a-input placeholder="请输入菜单编号" v-decorator="['code', {rules: [{required: true, min: 1, message: '请输入菜单编号'}]}]" />
</a-form-item>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :md="12" :sm="24">
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="菜单层级"
>
<a-radio-group v-decorator="['type',{rules: [{ required: true, message: '请选择菜单层级' }]}]" >
<a-radio value="0" @click="meneTypeFunc(0)">目录</a-radio>
<a-radio value="1" @click="meneTypeFunc(1)">菜单</a-radio>
<a-radio value="2" @click="meneTypeFunc(2)">按钮</a-radio>
</a-radio-group>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<div v-show="pidShow">
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="父级菜单"
has-feedback
>
<a-tree-select
v-decorator="['pid', {rules: [{ required: true, message: '请选择父级菜单!' }]}]"
style="width: 100%"
:dropdownStyle="{ maxHeight: '300px', overflow: 'auto' }"
:treeData="menuTreeData"
placeholder="请选择父级菜单"
treeDefaultExpandAll
:replaceFields="{
children:'children',
title:'name',
key:'id',
value:'id'
}"
>
<span slot="title" slot-scope="{ id }">{{ id }}
</span>
</a-tree-select>
</a-form-item>
</div>
</a-col>
</a-row>
<a-row :gutter="24" >
<a-col :md="12" :sm="24">
<div v-show="componentShow">
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
hasFeedback
>
<span slot="label">
<a-tooltip title="前端vue组件 views文件夹下路径system/menu/index。注目录级填写RouteView(不带面包屑)PageView(带面包屑)菜单级内链打开http链接填写Iframe">
<a-icon type="question-circle-o" />
</a-tooltip>&nbsp;
前端组件
</span>
<a-input placeholder="请输入前端组件" :disabled="componentDisabled" prop="component" v-decorator="['component',{rules: [{required: componentRequired, message: '请输入前端组件'}]}]"/><!-- ,{rules: [{required: componentRequired, min: 1, message: '请输入前端组件!'}]} -->
</a-form-item>
</div>
</a-col>
<a-col :md="12" :sm="24">
<div v-show="routerShow">
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
hasFeedback
>
<span slot="label">
<a-tooltip title="浏览器显示的URL/menu对应打开页面为菜单页面">
<a-icon type="question-circle-o" />
</a-tooltip>&nbsp;
路由地址
</span>
<a-input placeholder="请输入路由" v-decorator="['router', {rules: [{required: routerRequired, message: '请输入路由'}]}]" />
</a-form-item>
</div>
<div v-show="permissionShow">
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="权限标识"
hasFeedback
>
<a-input placeholder="请输入权限标识" v-decorator="['permission', {rules: [{required: permissionRequired, message: '请输入权限标识'}]}]" />
</a-form-item>
</div>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :md="12" :sm="24">
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="是否可见"
>
<a-switch id="visible" checkedChildren="是" unCheckedChildren="否" v-decorator="['visible', { valuePropName: 'checked' }]"/><!-- defaultChecked -->
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="排序"
>
<a-input-number style="width: 100%" v-decorator="['intCode', { initialValue: 100 }]" :min="1" :max="1000" />
</a-form-item>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :md="12" :sm="24">
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="备注"
hasFeedback
>
<a-input placeholder="请输入备注" v-decorator="['remark']"></a-input>
</a-form-item>
</a-col>
</a-row>
</a-form>
</a-spin>
</a-modal>
</template>
<script>
import { menuTree, menuAdd, menuEdit } from '@/api/security/menu'
export default {
data () {
return {
labelCol: {
xs: { span: 24 },
sm: { span: 6 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 }
},
modalTitle: "新增菜单",
visible: false,
confirmLoading: false,
menuTreeData: [],
componentShow: true,
componentDisabled: false,
componentRequired: true,
routerRequired: true,
routerShow: true,
pidShow: true,
permissionShow: true,
permissionRequired: true,
formLoading: true,
type: '',
form: this.$form.createForm(this)
}
},
methods: {
//
add (type) {
this.modalTitle = "新增菜单"
this.visible = true
//
this.form.getFieldDecorator('type', { valuePropName: 'checked', initialValue: '1' })
this.meneTypeFunc('1')
//
this.form.getFieldDecorator('visible', { initialValue: true })
//
this.getMenuTree()
this.formLoading = false
},
//
edit (record) {
this.modalTitle = "编辑菜单"
this.visible = true
//
this.form.getFieldDecorator('type', { valuePropName: 'checked', initialValue: record.type.toString() })
this.meneTypeFunc(record.type.toString())
//
// eslint-disable-next-line no-unused-vars
const visibleDef = false
// eslint-disable-next-line eqeqeq
if (record.visible == 1) {
this.visibleDef = true
}
this.form.getFieldDecorator('visible', { valuePropName: 'checked', initialValue: this.visibleDef })
setTimeout(() => {
this.setMenuItem(record)
//
this.getMenuTree()
}, 100)
this.formLoading = false
},
getMenuTree () {
menuTree().then((res) => {
if (res.code == 200) {
this.form.resetFields(`pid`, [])
this.menuTreeData = [{
'id': '-1',
'parentId': '0',
'name': '顶级',
'value': '0',
'pid': '0',
'children': res.data
}]
console.log(this.menuTreeData)
} else {
this.$message.warning(res.msg)
}
})
},
/**
* 选择菜单类型执行初始化表单变量
*/
meneTypeFunc (type) {
this.type = type
// eslint-disable-next-line eqeqeq
if (type == '0' || type == '1') {
//
this.routerRequired = true
this.form.getFieldDecorator('router', { initialValue: '' })
this.routerShow = true
//
this.permissionShow = false
this.permissionRequired = false
this.form.getFieldDecorator('permission', { initialValue: '' })
}
// eslint-disable-next-line eqeqeq
if (type == '0') {
// PageView
this.componentShow = true
this.componentDisabled = false
this.form.getFieldDecorator('component', { initialValue: 'PageView' })
this.componentRequired = true
//
this.form.getFieldDecorator('pid', { initialValue: '0' })
this.pidShow = false
} else {
// eslint-disable-next-line eqeqeq
if (type == '1') {
//
this.componentDisabled = false
this.form.getFieldDecorator('component', { initialValue: '' })
}
//
this.pidShow = true
}
// eslint-disable-next-line eqeqeq
if (type == '2') {
//
this.componentRequired = false
this.componentDisabled = true
this.form.resetFields(`component`, [])
this.form.getFieldDecorator('component', { initialValue: '' })
//
this.routerRequired = false
this.form.getFieldDecorator('router', { initialValue: '' })
this.routerShow = false
//
this.permissionShow = true
this.permissionRequired = true
this.form.getFieldDecorator('permission', { initialValue: '' })
}
},
handleSubmit () {
const { form: { validateFields } } = this
this.confirmLoading = true
validateFields((errors, values) => {
if (!errors) {
if (values.visible) {
values.visible = 1
} else {
values.visible = 0
}
console.log(values)
if (values.id) {
menuEdit(values).then((res) => {
this.confirmLoading = false
if (res.code == 200) {
this.$message.success('编辑成功')
this.$emit('ok', values)
this.handleCancel()
} else {
this.$message.error('编辑失败:' + res.msg)
}
}).finally((res) => {
this.confirmLoading = false
})
} else {
menuAdd(values).then((res) => {
this.confirmLoading = false
if (res.code == 200) {
this.$message.success('新增成功')
this.$emit('ok', values)
this.handleCancel()
} else {
this.$message.error('新增失败:' + res.msg)
}
}).finally((res) => {
this.confirmLoading = false
})
}
} else {
this.confirmLoading = false
}
})
},
handleCancel () {
this.form.resetFields()
this.confirmLoading = false
this.visible = false
},
setMenuItem (record) {
console.log(record)
this.form.setFieldsValue(
{
id: record.id,
name: record.name,
code: record.code,
component: record.component,
permission: record.permission,
router: record.router,
intCode: record.intCode,
remark: record.remark
}
)
this.form.getFieldDecorator('pid', { initialValue: record.pid })
this.pid = record.pid
}
}
}
</script>

View File

@ -0,0 +1,372 @@
<template>
<a-modal
title="新增菜单"
:width="1000"
:visible="visible"
:confirmLoading="confirmLoading"
@ok="handleSubmit"
@cancel="handleCancel"
:destroyOnClose="true"
>
<a-spin :spinning="formLoading">
<a-form-model ref="ruleForm" :model="form" :rules="rules" >
<a-row :gutter="24">
<a-col :md="12" :sm="24">
<a-form-model-item
label="菜单名称"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
hasFeedback
prop="name"
>
<a-input v-model="form.name" />
</a-form-model-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-model-item
style="width: 100%"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="菜单编号"
hasFeedback
prop="code"
>
<a-input v-model="form.code" />
</a-form-model-item>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :md="12" :sm="24">
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="菜单层级"
prop="type"
>
<a-radio-group v-model="form.type" >
<a-radio :value="0" @click="meneTypeFunc(0)">目录</a-radio>
<a-radio :value="1" @click="meneTypeFunc(1)">菜单</a-radio>
<a-radio :value="2" @click="meneTypeFunc(2)">按钮</a-radio>
</a-radio-group>
</a-form-model-item>
</a-col>
<a-col :md="12" :sm="24">
<div v-show="pidShow">
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="父级菜单"
has-feedback
prop="pid"
>
<a-tree-select
v-model="form.pid"
style="width: 100%"
:dropdownStyle="{ maxHeight: '300px', overflow: 'auto' }"
:treeData="menuTreeData"
placeholder="请选择父级菜单"
treeDefaultExpandAll
:replaceFields="{
children:'children',
title:'name',
key:'id',
value:'id'
}"
>
<span slot="title" slot-scope="{ id }">{{ id }}
</span>
</a-tree-select>
</a-form-model-item>
</div>
</a-col>
</a-row>
<a-row :gutter="24" >
<a-col :md="12" :sm="24">
<div v-show="componentShow">
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
hasFeedback
prop="component"
>
<span slot="label">
<a-tooltip title="前端vue组件 views文件夹下路径system/menu/index。注目录级填写RouteView(不带面包屑)PageView(带面包屑)菜单级内链打开http链接填写Iframe">
<a-icon type="question-circle-o" />
</a-tooltip>&nbsp;
前端组件
</span>
<a-input placeholder="请输入前端组件" :disabled="componentDisabled" v-model="form.component"/><!-- ,{rules: [{required: componentRequired, min: 1, message: '请输入前端组件!'}]} -->
</a-form-model-item>
</div>
</a-col>
<a-col :md="12" :sm="24">
<div v-show="routerShow">
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
hasFeedback
prop="router"
>
<span slot="label">
<a-tooltip title="浏览器显示的URL/menu对应打开页面为菜单页面">
<a-icon type="question-circle-o" />
</a-tooltip>&nbsp;
路由地址
</span>
<a-input placeholder="请输入路由" v-model="form.router" />
</a-form-model-item>
</div>
<div v-show="permissionShow">
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="权限标识"
hasFeedback
prop="permission"
>
<a-input placeholder="请输入权限标识" v-model="form.permission" />
</a-form-model-item>
</div>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :md="12" :sm="24">
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="是否可见"
prop="visible"
>
<a-switch checked-children="" un-checked-children="" default-checked v-model="form.visible"/><!-- defaultChecked -->
</a-form-model-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="排序"
prop="intCode"
>
<a-input-number style="width: 100%" v-model="form.intCode" />
</a-form-model-item>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :md="12" :sm="24">
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="备注"
hasFeedback
prop="remark"
>
<a-input v-model="form.remark"></a-input>
</a-form-model-item>
</a-col>
</a-row>
</a-form-model>
</a-spin>
</a-modal>
</template>
<script>
import { menuTree, menuAdd, menuEdit } from '@/api/security/menu'
export default {
data () {
return {
labelCol: {
xs: { span: 24 },
sm: { span: 6 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 }
},
form: {
name: '',
code: '',
pid: '',
type: 1,
router: '',
component: '',
permission: '',
visible: true,
intCode: 0,
remark: ''
},
rules: {
name: [{ required: true, message: '请输入用户名', trigger: 'blur' }, { min: 5, message: '长度不能小于5', trigger: 'blur' }],
code: [{ required: true, message: '请输入姓名', trigger: 'blur' }, { min: 2, message: '长度不能小于5', trigger: 'blur' }]
},
visible: false,
confirmLoading: false,
menuTreeData: [],
componentShow: true,
componentDisabled: false,
componentRequired: true,
routerRequired: true,
routerShow: true,
pidShow: true,
permissionShow: true,
permissionRequired: true,
formLoading: true
}
},
methods: {
//
add (type) {
this.visible = true
//
this.meneTypeFunc(1)
//
this.getMenuTree()
this.formLoading = false
},
//
edit (record) {
this.visible = true
//
this.meneTypeFunc(record.type)
setTimeout(() => {
//
this.getMenuTree()
this.form = record
//
this.form.visible = record.visible === 1
this.formLoading = false
}, 100)
},
getMenuTree () {
menuTree().then((res) => {
if (res.code == 200) {
this.form.pid = ''
this.menuTreeData = [{
'id': '-1',
'parentId': '0',
'name': '顶级',
'value': '0',
'pid': '0',
'children': res.data
}]
console.log(this.menuTreeData)
} else {
this.$message.warning(res.msg)
}
})
},
/**
* 选择菜单类型执行初始化表单变量
*/
meneTypeFunc (type) {
if (type === 0 || type === 1) {
//
this.routerRequired = true
this.routerShow = true
this.form.router = ''
//
this.permissionShow = false
this.permissionRequired = false
this.form.permission = ''
}
// eslint-disable-next-line eqeqeq
if (type === 0) {
// PageView
this.componentShow = true
this.componentDisabled = false
this.form.component = 'PageView'
this.componentRequired = true
//
this.form.pid = 0
this.pidShow = false
} else {
// eslint-disable-next-line eqeqeq
if (type === 1) {
//
this.componentDisabled = false
this.form.component = ''
}
//
this.pidShow = true
}
// eslint-disable-next-line eqeqeq
if (type === 2) {
//
this.componentRequired = false
this.componentDisabled = true
// this.form.resetFields(`component`, [])
this.form.component = ''
//
this.routerRequired = true
this.form.router = ''
this.routerShow = false
//
this.permissionShow = true
this.permissionRequired = true
this.form.permission = ''
}
},
handleSubmit () {
this.$refs.ruleForm.validate(valid => {
if (valid) {
if (this.form.visible) {
this.form.visible = 1
} else {
this.form.visible = 0
}
if (this.form.id) {
menuAdd(this.form).then((res) => {
this.confirmLoading = false
if (res.code == 200) {
this.$message.success('新增成功')
this.$emit('ok', this.form)
this.handleCancel()
} else {
this.$message.error('新增失败:' + res.msg)
}
}).finally((res) => {
this.confirmLoading = false
})
} else {
menuEdit(this.form).then((res) => {
this.confirmLoading = false
if (res.code == 200) {
this.$message.success('新增成功')
this.$emit('ok', this.form)
this.handleCancel()
} else {
this.$message.error('新增失败:' + res.msg)
}
}).finally((res) => {
this.confirmLoading = false
})
}
} else {
return false
}
})
},
handleCancel () {
this.$refs.ruleForm.resetFields()
delete this.form.id
this.confirmLoading = false
this.visible = false
}
}
}
</script>

View File

@ -0,0 +1,159 @@
<template>
<div>
<a-card :bordered="false">
<div class="table-page-search-wrapper">
<a-form layout="inline">
<a-row :gutter="48">
<a-col :md="8" :sm="24">
<a-form-item label="菜单名称">
<a-input v-model="queryParam.name" allow-clear placeholder="请输入菜单名称"/>
</a-form-item>
</a-col>
<a-col :md="8" :sm="24">
<a-button type="primary" @click="$refs.table.refresh(true)">查询</a-button>
<a-button @click="() => {queryParam = {}, this.loadData()}">重置</a-button>
</a-col>
</a-row>
</a-form>
</div>
<div class="table-operator">
<a-button type="primary" icon="plus" @click="$refs.menuForm.add()">新增菜单</a-button>
</div>
<s-table
ref="table"
:rowKey="(record) => record.id"
:columns="columns"
:alert="false"
:data="loadData"
:showPagination="false"
:expandRowByClick="true"
>
<span slot="type" slot-scope="text, record">
<a-tag color="cyan" v-if="text === 0">
{{ record.type | typeFilter }}
</a-tag>
<a-tag color="blue" v-if="text === 1">
{{ record.type | typeFilter }}
</a-tag>
<a-tag color="purple" v-if="text === 2">
{{ record.type | typeFilter }}
</a-tag>
</span>
<span slot="action" slot-scope="text, record">
<template>
<a @click="$refs.menuForm.edit(record)">编辑</a>
<a-divider type="vertical"/>
<a-popconfirm placement="topRight" title="删除本菜单与下级?" @confirm="() => handleDel(record)">
<a>删除</a>
</a-popconfirm>
</template>
</span>
</s-table>
<menu-form ref="menuForm" @ok="handleOk"/>
</a-card>
</div>
</template>
<script>
import { STable } from '@/components'
import { menuList, menuDel } from '@/api/security/menu'
import MenuForm from './MenuForm'
import { listToTree } from '@/utils/util'
import { menuTypeMap } from '@/views/filterMap/menuTypeMap'
const rootParentId = 0
export default {
components: {
STable,
MenuForm
},
data () {
return {
data: [],
queryParam: {},
loading: true,
columns: [
{
title: '菜单名称',
dataIndex: 'name',
width: '20%'
},
{
title: '菜单类型',
dataIndex: 'type',
scopedSlots: { customRender: 'type' }
},
{
title: '组件',
dataIndex: 'component',
width: '20%',
ellipsis: true
},
{
title: '路由地址',
dataIndex: 'router',
key: 'router',
ellipsis: true
},
{
title: '排序',
dataIndex: 'intCode'
},
{
title: '操作',
dataIndex: 'action',
width: '150px',
scopedSlots: { customRender: 'action' }
}
],
loadData: parameter => {
return menuList(Object.assign(parameter, this.queryParam)).then((res) => {
return res.data
})
}
}
},
created () {
//
// if (this.hasPerm('sysMenu:edit') || this.hasPerm('sysMenu:delete')) {
// this.columns.push({
// title: '',
// dataIndex: 'action',
// width: '150px',
// scopedSlots: { customRender: 'action' }
// })
// }
},
filters: {
typeFilter (type) {
return menuTypeMap[type]
}
},
methods: {
handleDel (record) {
menuDel({id: record.id, deleteReason: ""}).then((res) => {
if (res.code == 200) {
this.$message.success('删除成功')
this.$refs.table.refresh()
} else {
this.$message.error('删除失败:' + res.msg)
}
})
},
handleOk () {
this.$refs.table.refresh()
}
}
}
</script>
<style scoped>
.table-operator {
margin-bottom: 18px;
}
button {
margin-right: 8px;
}
</style>

View File

@ -1,83 +0,0 @@
<template>
<a-modal v-model="visible" :title="modalTitle" @ok="onSubmit" @cancel="onCancel" :width="1020">
<template slot="footer">
<a-button key="cancel" @click="onCancel">取消</a-button>
<a-button key="submit" type="primary" @click="onSubmit">保存</a-button>
</template>
<a-form-model ref="ruleForm" :model="form" :rules="rules" :label-col="labelCol" :wrapper-col="wrapperCol">
<a-form-model-item ref="name" label="名称" prop="name">
<a-input v-model="form.name"/>
</a-form-model-item>
</a-form-model>
</a-modal>
</template>
<script>
import { userGet, userAdd, userUpdate } from '@/api/security/user'
export default {
props: {
id: {
type: String,
default: undefined
}
},
data () {
return {
modalTitle: '新增',
visible: false,
labelCol: { span: 4 },
wrapperCol: { span: 16 },
form: {
name: ''
},
rules: {
name: [
{ required: true, message: '请输入名称', trigger: 'blur' },
{ min: 2, message: '长度不能小于2', trigger: 'blur' }
]
}
}
},
methods: {
add () {
this.modalTitle = '新增'
this.visible = true
},
edit (obj) {
this.modalTitle = '修改'
this.visible = true
userGet({ id: obj.id }).then(data => {
const form = data.data
this.form = form
})
},
onSubmit (e) {
this.$refs.ruleForm.validate(valid => {
if (valid) {
if (this.form.id) {
userUpdate(this.form).then(data => {
this.$emit('ok')
this.onCancel()
})
} else {
userAdd(this.form).then(data => {
this.$emit('ok')
this.onCancel()
})
}
} else {
return false
}
})
},
onCancel () {
this.$refs.ruleForm.resetFields()
this.visible = false
},
onReset () {
this.$refs.ruleForm.resetFields()
}
}
}
</script>

View File

@ -1,48 +0,0 @@
<template>
<a-drawer
title="品牌详情"
width="640"
placement="right"
:visible="visible"
@close="onClose">
<a-descriptions :column="{ sm: 2, xs: 1 }">
<a-descriptions-item label="名称">{{ model.name }}</a-descriptions-item>
<a-descriptions-item label="编码">{{ model.code }}</a-descriptions-item>
<a-descriptions-item label="创建时间">{{ model.createdAt | moment('YYYY-MM-DD') }}</a-descriptions-item>
<a-descriptions-item label="上次修改时间">{{ model.updatedAt }}</a-descriptions-item>
<a-descriptions-item label="状态">{{ model.status | statusFilter }}</a-descriptions-item>
<a-descriptions-item label="排序">{{ model.sortOrder }}</a-descriptions-item>
</a-descriptions>
</a-drawer>
</template>
<script>
import { userGet } from '@/api/security/user'
import { statusMap } from '@/views/status/statusMap'
export default {
data () {
return {
visible: false,
model: {}
}
},
filters: {
statusFilter (status) {
return statusMap[status]
}
},
methods: {
show (id) {
this.visible = true
userGet({ id: id }).then(data => {
this.model = data.data
})
},
onClose () {
this.model = {}
this.visible = false
}
}
}
</script>

View File

@ -1,186 +0,0 @@
<template>
<a-card :bordered="false">
<a-row :gutter="8">
<a-col :span="5">
<s-tree
:dataSource="orgTree"
:openKeys.sync="openKeys"
:search="true"
@click="handleClick"
@add="handleAdd"
@titleClick="handleTitleClick"></s-tree>
</a-col>
<a-col :span="19">
<s-table
ref="table"
size="default"
:columns="columns"
:data="loadData"
:alert="false"
:rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
>
<span slot="action" slot-scope="text, record">
<template v-if="$auth('table.update')">
<a @click="handleEdit(record)">编辑</a>
<a-divider type="vertical" />
</template>
<a-dropdown>
<a class="ant-dropdown-link">
更多 <a-icon type="down" />
</a>
<a-menu slot="overlay">
<a-menu-item>
<a href="javascript:;">详情</a>
</a-menu-item>
<a-menu-item v-if="$auth('table.disable')">
<a href="javascript:;">禁用</a>
</a-menu-item>
<a-menu-item v-if="$auth('table.delete')">
<a href="javascript:;">删除</a>
</a-menu-item>
</a-menu>
</a-dropdown>
</span>
</s-table>
</a-col>
</a-row>
<org-modal ref="modal" @ok="handleSaveOk" @close="handleSaveClose" />
</a-card>
</template>
<script>
import STree from '@/components/Tree/Tree'
import { STable } from '@/components'
import OrgModal from './modules/OrgModal'
import { menuList } from '@/api/security/menu'
export default {
name: 'MenuTree',
components: {
STable,
STree,
OrgModal
},
data () {
return {
queryParam: {
parentId: '-1'
},
openKeys: ['key-01'],
orgTree: [],
selectedRowKeys: [],
selectedRows: [],
columns: [
{
title: '#',
dataIndex: 'no'
},
{
title: '成员名称',
dataIndex: 'description'
},
{
title: '登录次数',
dataIndex: 'callNo',
sorter: true,
needTotal: true,
customRender: (text) => text + ' 次'
},
{
title: '状态',
dataIndex: 'status',
needTotal: true
},
{
title: '更新时间',
dataIndex: 'updatedAt',
sorter: true
},
{
title: '操作',
dataIndex: 'action',
width: '150px',
scopedSlots: { customRender: 'action' }
}
],
// Promise
loadData: parameter => {
return menuList(Object.assign(parameter, this.queryParam))
.then(res => {
return res.result
})
}
}
},
created () {
menuList({
parentId: '-1'
}).then(res => {
this.orgTree = res.data
})
},
methods: {
handleClick (e) {
this.queryParam = {
key: e.key
}
this.$refs.table.refresh(true)
},
handleAdd (item) {
this.$message.info(`提示:你点了 ${item.key} - ${item.title} `)
this.$refs.modal.add(item.key)
},
handleTitleClick (item) {
console.log('handleTitleClick', item)
},
titleClick (e) {
console.log('titleClick', e)
},
handleSaveOk () {
},
handleSaveClose () {
},
onSelectChange (selectedRowKeys, selectedRows) {
this.selectedRowKeys = selectedRowKeys
this.selectedRows = selectedRows
}
}
}
</script>
<style lang="less">
.custom-tree {
/deep/ .ant-menu-item-group-title {
position: relative;
&:hover {
.btn {
display: block;
}
}
}
/deep/ .ant-menu-item {
&:hover {
.btn {
display: block;
}
}
}
/deep/ .btn {
display: none;
position: absolute;
top: 0;
right: 10px;
width: 20px;
height: 40px;
line-height: 40px;
z-index: 1050;
&:hover {
transform: scale(1.2);
transition: 0.5s all;
}
}
}
</style>

View File

@ -1,100 +0,0 @@
<template>
<a-modal
title="操作"
:width="600"
:visible="visible"
:confirmLoading="confirmLoading"
@ok="handleOk"
@cancel="handleCancel"
>
<a-spin :spinning="confirmLoading">
<a-form :form="form">
<a-form-item
label="父级ID"
>
<a-input v-decorator="['parentId', {}]" disabled />
</a-form-item>
<a-form-item
label="机构名称"
>
<a-input v-decorator="['orgName', {}]" />
</a-form-item>
</a-form>
</a-spin>
</a-modal>
</template>
<script>
export default {
name: 'OrgModal',
data () {
return {
labelCol: {
xs: { span: 24 },
sm: { span: 5 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 }
},
visible: false,
confirmLoading: false,
mdl: {}
}
},
beforeCreate () {
this.form = this.$form.createForm(this)
console.log('form::', this.form)
},
created () {
},
methods: {
add (id) {
this.edit({ parentId: id })
},
edit (record) {
this.mdl = Object.assign({}, record)
this.visible = true
this.$nextTick(() => {
this.form.setFieldsValue({ ...record })
})
},
close () {
this.$emit('close')
this.visible = false
},
handleOk () {
const _this = this
//
this.form.validateFields((err, values) => {
//
if (!err) {
console.log('form values', values)
_this.confirmLoading = true
// 2000
new Promise((resolve) => {
setTimeout(() => resolve(), 2000)
}).then(() => {
// Do something
_this.$message.success('保存成功')
_this.$emit('ok')
}).catch(() => {
// Do something
}).finally(() => {
_this.confirmLoading = false
_this.close()
})
}
})
},
handleCancel () {
this.close()
}
}
}
</script>

View File

@ -1,147 +0,0 @@
<template>
<a-modal
title="操作"
:width="800"
:visible="visible"
:confirmLoading="confirmLoading"
@ok="handleOk"
@cancel="handleCancel"
>
<a-steps :current="1">
<a-step>
<!-- <span slot="title">Finished</span> -->
<template slot="title">
Finished
</template>
<span slot="description">This is a description.</span>
</a-step>
<a-step title="In Progress" description="This is a description." />
<a-step title="Waiting" description="This is a description." />
</a-steps>
</a-modal>
</template>
<script>
import { getPermissions } from '@/api/manage'
import { actionToObject } from '@/utils/permissions'
import pick from 'lodash.pick'
export default {
name: 'RoleModal',
data () {
return {
labelCol: {
xs: { span: 24 },
sm: { span: 5 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 }
},
visible: false,
confirmLoading: false,
mdl: {},
form: this.$form.createForm(this),
permissions: []
}
},
created () {
this.loadPermissions()
},
methods: {
add () {
this.edit({ id: 0 })
},
edit (record) {
this.mdl = Object.assign({}, record)
this.visible = true
//
if (this.mdl.permissions && this.permissions) {
//
const permissionsAction = {}
this.mdl.permissions.forEach(permission => {
permissionsAction[permission.permissionId] = permission.actionEntitySet.map(entity => entity.action)
})
// action
this.permissions.forEach(permission => {
permission.selected = permissionsAction[permission.id] || []
})
}
this.$nextTick(() => {
this.form.setFieldsValue(pick(this.mdl, 'id', 'name', 'status', 'describe'))
})
console.log('this.mdl', this.mdl)
},
close () {
this.$emit('close')
this.visible = false
},
handleOk () {
const _this = this
//
this.form.validateFields((err, values) => {
//
if (!err) {
console.log('form values', values)
_this.confirmLoading = true
// 2000
new Promise((resolve) => {
setTimeout(() => resolve(), 2000)
}).then(() => {
// Do something
_this.$message.success('保存成功')
_this.$emit('ok')
}).catch(() => {
// Do something
}).finally(() => {
_this.confirmLoading = false
_this.close()
})
}
})
},
handleCancel () {
this.close()
},
onChangeCheck (permission) {
permission.indeterminate = !!permission.selected.length && (permission.selected.length < permission.actionsOptions.length)
permission.checkedAll = permission.selected.length === permission.actionsOptions.length
},
onChangeCheckAll (e, permission) {
Object.assign(permission, {
selected: e.target.checked ? permission.actionsOptions.map(obj => obj.value) : [],
indeterminate: false,
checkedAll: e.target.checked
})
},
loadPermissions () {
const that = this
getPermissions().then(res => {
const result = res.result
that.permissions = result.map(permission => {
const options = actionToObject(permission.actionData)
permission.checkedAll = false
permission.selected = []
permission.indeterminate = false
permission.actionsOptions = options.map(option => {
return {
label: option.describe,
value: option.action
}
})
return permission
})
})
}
}
}
</script>
<style scoped>
</style>

View File

@ -0,0 +1,117 @@
<template>
<a-modal :visible="visible" :title="modalTitle" :width="500" @cancel="onCancel" @ok="onSubmit">
<a-form-model ref="ruleForm" :model="form" :rules="rules" :label-col="labelCol" :wrapper-col="wrapperCol">
<a-form-model-item ref="name" label="名称" prop="name">
<a-input v-model="form.name" />
</a-form-model-item>
<a-form-model-item ref="code" label="编码" prop="code">
<a-input v-model="form.code" />
</a-form-model-item>
<a-form-model-item ref="sort" label="排序" prop="sort">
<a-input-number v-model="form.sort" />
</a-form-model-item>
<a-form-model-item ref="remark" label="备注" prop="remark">
<a-textarea :rows="4" v-model="form.remark" />
</a-textarea>
</a-form-model-item>
</a-form-model>
</a-modal>
</template>
<script>
import {
roleAdd,
roleEdit
} from '@/api/security/role'
export default {
props: {
id: {
type: String,
default: undefined
}
},
data() {
return {
modalTitle: '新增角色',
visible: false,
labelCol: {
xs: {
span: 24
},
sm: {
span: 5
}
},
wrapperCol: {
xs: {
span: 24
},
sm: {
span: 18
}
},
form: {
name: '',
code: '',
sort: 0,
remark: ''
},
rules: {
name: [{
required: true,
message: '请输入角色名称',
trigger: 'blur'
}],
code: [{
required: true,
message: '请输入编码',
trigger: 'blur'
}]
}
}
},
methods: {
add() {
this.modalTitle = '新增角色'
this.visible = true
},
edit(obj) {
this.modalTitle = '修改角色'
this.visible = true
this.form = obj
},
onSubmit(e) {
this.$refs.ruleForm.validate(valid => {
if (valid) {
if (this.form.id) {
roleEdit(this.form).then(res => {
if (res.code == 200) {
this.$message.success('编辑成功')
this.onCancel()
} else {
this.$message.error('编辑失败:' + res.msg)
}
})
} else {
roleAdd(this.form).then(data => {
if (res.code == 200) {
this.$message.success('新增成功')
this.onCancel()
} else {
this.$message.error('新增失败:' + res.msg)
}
})
}
} else {
return false
}
})
},
onCancel() {
this.$refs.ruleForm.resetFields()
this.visible = false
}
}
}
</script>

View File

@ -1,168 +1,129 @@
<template>
<a-card :bordered="false">
<div class="table-page-search-wrapper">
<a-form layout="inline">
<a-row :gutter="48">
<a-col :md="6" :sm="24">
<a-form-item label="名称">
<a-input v-model="queryParam.name" placeholder="请输入名称" @pressEnter="handleFefresh"/>
</a-form-item>
</a-col>
<a-col :md="6" :sm="24">
<a-form-item label="状态">
<a-select v-model="queryParam.status" placeholder="请选择" default-value="0" @pressEnter="handleFefresh">
<a-select-option value="">全部</a-select-option>
<a-select-option v-for="(item, index) in statusMap" :key="index" :value="index">{{ item }}</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :md="6" :sm="24">
<a-button type="primary" @click="handleFefresh">查询</a-button>
<a-button @click="() => {queryParam = {}, handleFefresh()}">重置</a-button>
</a-col>
<a-col :md="6" :sm="24" align="right">
<a-button type="primary" @click="handleCreate">新增</a-button>
</a-col>
</a-row>
</a-form>
</div>
<s-table
ref="table"
size="default"
rowKey="id"
:columns="columns"
:data="loadData"
:rowSelection="rowSelection"
>
<template slot="time" slot-scope="text, record">{{record.createdAt | moment}}</template>
<template slot="tbStatus" slot-scope="text, record">
<a-switch checked-children="启用" un-checked-children="停用" v-model="record.status" @change="updateStatus(record.id, record.status)"/>
</template>
<template slot="action" slot-scope="text, record">
<a href="javascript:;" @click="handleEdit(record)">修改</a>
<a-divider type="vertical" />
<a-popconfirm title="是否删除?" @confirm="() => handleDelete(record)">
<a href="javascript:;">删除</a>
</a-popconfirm>
<a-divider type="vertical" />
<a href="javascript:;" @click="handleDetail(record.id)">详情</a>
</template>
</s-table>
<create-form ref="modal" @ok="handleOk" />
<role-detail ref="detail"></role-detail>
</a-card>
<div>
<a-card :bordered="false">
<div class="table-page-search-wrapper">
<a-form layout="inline">
<a-row :gutter="48">
<a-col :md="8" :sm="24">
<a-form-item label="角色名称">
<a-input v-model="queryParam.name" allow-clear placeholder="请输入角色名称"/>
</a-form-item>
</a-col>
<a-col :md="8" :sm="24">
<a-button type="primary" @click="$refs.table.refresh(true)">查询</a-button>
<a-button @click="() => {queryParam = {}, this.loadData()}">重置</a-button>
</a-col>
</a-row>
</a-form>
</div>
<div class="table-operator">
<a-button type="primary" icon="plus" @click="$refs.roleForm.add()">新增角色</a-button>
</div>
<s-table
ref="table"
:rowKey="(record) => record.id"
:columns="columns"
:data="loadData"
>
<span slot="action" slot-scope="text, record">
<a @click="$refs.roleForm.edit(record)">编辑</a>
<a-divider type="vertical"/>
<a-dropdown>
<a class="ant-dropdown-link">
更多 <a-icon type="down" />
</a>
<a-menu slot="overlay">
<a-menu-item>
<a @click="$refs.roleMenuForm.roleMenu(record)">授权菜单</a>
</a-menu-item>
<a-menu-item>
<a-popconfirm placement="topRight" title="确认删除?" @confirm="() => handleDel(record)">
<a>删除</a>
</a-popconfirm>
</a-menu-item>
</a-menu>
</a-dropdown>
</span>
</s-table>
<role-form ref="roleForm" @ok="handleOk"/>
<role-menu-form ref="roleMenuForm" @ok="handleOk"/>
</a-card>
</div>
</template>
<script>
import { rolePage, roleUpdateStatus, roleDelete } from '@/api/security/role'
import { STable } from '@/components'
import CreateForm from './modules/CreateForm'
import RoleDetail from './modules/RoleDetail'
import { statusMap } from '@/views/status/statusMap'
import { rolePage, roleDel } from '@/api/security/role'
import RoleForm from './RoleForm'
import RoleMenuForm from './RoleMenuForm'
export default {
name: 'roleList',
components: {
STable,
CreateForm,
RoleDetail
RoleForm,
RoleMenuForm
},
data () {
return {
statusMap: statusMap,
queryParam: { name: '', status: '' },
selectedRowKeys: [], // key
selectedRows: [], //
data: [],
queryParam: {},
loading: true,
columns: [
{ title: '名称', width: 30, dataIndex: 'name', key: 'name' },
{ title: '编码', width: 30, dataIndex: 'code', key: 'code' },
{
title: '创建时间',
width: 10,
key: 'createdAt',
align: 'center',
scopedSlots: { customRender: 'time' }
title: '角色名称',
dataIndex: 'name',
width: '20%'
},
{
title: '状态',
width: 10,
key: 'tbStatus',
align: 'center',
scopedSlots: { customRender: 'tbStatus' }
title: '唯一编码',
dataIndex: 'code'
},
{
title: '排序',
dataIndex: 'sort'
},
{
title: '操作',
key: 'operation',
width: 10,
align: 'right',
dataIndex: 'action',
width: '150px',
scopedSlots: { customRender: 'action' }
}
],
loadData: parameter => {
return rolePage(Object.assign(parameter, this.queryParam))
.then(res => {
const data = res.data
data.entities.forEach((item) => {
item.status = item.status === 1
})
return data
})
return rolePage(Object.assign(parameter, this.queryParam)).then((res) => {
return res
})
}
}
},
computed: {
rowSelection () {
return {
selectedRowKeys: this.selectedRowKeys,
onChange: this.onSelectChange
}
}
created () {
//
},
methods: {
//
updateStatus (id, status) {
roleUpdateStatus({
id: id,
status: status ? 1 : 0
}).then(res => {
this.$notification.success({
message: '操作成功',
duration: 1,
description: status ? '角色已启用' : '角色已停用'
})
this.$refs.table.refresh()
handleDel (record) {
roleDel({id: record.id}).then((res) => {
if (res.code == 200) {
this.$message.success('删除成功')
this.$refs.table.refresh()
} else {
this.$message.error('删除失败:' + res.msg)
}
})
},
//
handleCreate () {
this.$refs.modal.add()
},
//
handleEdit (record) {
this.$refs.modal.edit(record)
},
//
handleDelete (record) {
roleDelete({ id: record.id }).then(() => {
this.loadData()
})
},
//
handleOk () {
this.$refs.table.refresh()
},
//
handleDetail (id) {
this.$refs.detail.show(id)
},
handleFefresh () {
this.$refs.table.refresh(true)
},
//
onSelectChange (selectedRowKeys, selectedRows) {
this.selectedRowKeys = selectedRowKeys
this.selectedRows = selectedRows
}
}
}
</script>
<style scoped>
.table-operator {
margin-bottom: 18px;
}
button {
margin-right: 8px;
}
</style>

View File

@ -0,0 +1,186 @@
<template>
<a-modal
title="授权菜单"
:width="600"
:visible="visible"
:confirmLoading="confirmLoading"
@ok="handleSubmit"
@cancel="handleCancel"
>
<a-spin :spinning="formLoading">
<a-form :form="form">
<a-form-item
label="菜单权限"
:labelCol="labelCol"
:wrapperCol="wrapperCol">
<a-tree
v-model="checkedKeys"
multiple
checkable
:auto-expand-parent="autoExpandParent"
:expanded-keys="expandedKeys"
:tree-data="menuTreeData"
:selected-keys="selectedKeys"
:replaceFields="replaceFields"
@expand="onExpand"
@check="onCheck"
/>
</a-form-item>
</a-form>
</a-spin>
</a-modal>
</template>
<script>
import { menuTreeForGrant } from '@/api/security/menu'
import { roleOwnMenu, roleGrantMenu } from '@/api/security/role'
export default {
data() {
return {
labelCol: {
style: { 'padding-right': '20px' },
xs: { span: 24 },
sm: { span: 5 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 15 }
},
menuTreeData: [],
expandedKeys: [],
checkedKeys: [],
visible: false,
confirmLoading: false,
formLoading: true,
autoExpandParent: true,
selectedKeys: [],
subValues: [],
roleEntity: [],
replaceFields: {
children:'children',
title:'name',
key:'id',
value:'id'
},
form: this.$form.createForm(this),
commitKeys: [],
leastChilds: []
}
},
methods: {
//
roleMenu(record) {
this.formLoading = true
this.roleEntity = record
this.visible = true
this.getMenuTree()
},
/**
* 获取菜单列表
*/
getMenuTree() {
const _this = this
menuTreeForGrant().then((res) => {
if (res.code == 200) {
_this.menuTreeData = res.data
_this.getLeastChilds(res.data)
//
_this.menuTreeData.forEach(item => {
_this.expandedKeys.push(item.id)
})
_this.expandedMenuKeys(_this.roleEntity)
}
})
},
getLeastChilds(data) {
for (let i = 0; i < data.length; i++) {
this.pushLeastChilds(data[i])
}
},
pushLeastChilds(e) {
if (e.children.length > 0) {
this.getLeastChilds(e.children)
return
}
this.leastChilds.push(e.id)
},
/**
* 此角色已有菜单权限
*/
expandedMenuKeys(record) {
const _this = this
roleOwnMenu({ id: record.id }).then((res) => {
if (res.code == 200) {
_this.pickCheckedKeys(res.data)
_this.commitKeys = res.data
}
_this.formLoading = false
})
},
pickCheckedKeys(data) {
for (let i = 0; i < data.length; i++) {
if (this.leastChilds.includes(data[i])) {
this.checkedKeys.push(data[i])
}
}
},
onExpand(expandedKeys) {
this.expandedKeys = expandedKeys
this.autoExpandParent = false
},
onCheck(checkedKeys, info) {
this.checkedKeys = checkedKeys
this.commitKeys = checkedKeys.concat(info.halfCheckedKeys)
},
onSelect(selectedKeys, info) {
this.selectedKeys = selectedKeys
},
handleSubmit() {
const _this = this
const { form: { validateFields } } = this
this.confirmLoading = true
validateFields((errors, values) => {
if (!errors) {
roleGrantMenu({ id: _this.roleEntity.id, grantMenuIdList: _this.commitKeys }).then((res) => {
if (res.code == 200) {
_this.$message.success('授权成功')
_this.confirmLoading = false
_this.$emit('ok', values)
_this.handleCancel()
} else {
_this.$message.error('授权失败:' + res.message)
}
}).finally((res) => {
_this.confirmLoading = false
})
} else {
_this.confirmLoading = false
}
})
},
handleCancel() {
//
this.checkedKeys = []
//
this.expandedKeys = []
this.leastChilds = []
this.visible = false
}
}
}
</script>

View File

@ -1,116 +0,0 @@
<template>
<a-modal centered :visible="visible" :title="modalTitle" :width="720" @close="onCancel">
<a-form-model ref="ruleForm" :model="form" :rules="rules" :label-col="labelCol" :wrapper-col="wrapperCol">
<a-row :gutter="16">
<a-col :span="12">
<a-form-model-item ref="name" label="名称" prop="name"><a-input v-model="form.name" /></a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item ref="code" label="编码" prop="code"><a-input v-model="form.code" /></a-form-model-item>
</a-col>
</a-row>
<a-row :gutter="16">
<a-col :span="12">
<a-form-model-item ref="description" label="描述" prop="description"><a-input v-model="form.description" /></a-form-model-item>
</a-col>
</a-row>
</a-form-model>
<div class="draw-button-container align-center">
<a-button @click="onCancel">取消</a-button>
<a-button type="primary" @click="onSubmit">保存</a-button>
</div>
</a-modal>
</template>
<script>
import { roleGet, roleAdd, roleUpdate } from '@/api/security/role'
import { typeMap } from '../../maps/map.js'
export default {
props: {
id: {
type: String,
default: undefined
}
},
data () {
return {
typeMap: typeMap,
orgList: [],
modalTitle: '新增',
visible: false,
labelCol: { span: 4 },
wrapperCol: { span: 16 },
form: {
rolename: '',
realName: '',
mobile: '',
password: '',
type: undefined,
orgId: undefined,
orgName: '',
address: '',
email: ''
},
rules: {
rolename: [{ required: true, message: '请输入用户名', trigger: 'blur' }, { min: 5, message: '长度不能小于5', trigger: 'blur' }],
realName: [{ required: true, message: '请输入姓名', trigger: 'blur' }, { min: 2, message: '长度不能小于5', trigger: 'blur' }],
mobile: [{ required: true, message: '请输入正确的手机号', pattern: /^1[3456789]\d{9}$/, trigger: 'blur' }],
password: [{ required: true, message: '请输入密码', trigger: 'blur' }, { min: 6, message: '长度不能小于6', trigger: 'blur' }],
orgId: [{ required: true, message: '请选择机构', trigger: 'blur' }]
}
}
},
filters: {
typeFilter (type) {
return typeMap[type]
}
},
methods: {
add () {
this.modalTitle = '新增'
this.visible = true
},
edit (obj) {
this.modalTitle = '修改'
this.visible = true
roleGet({ id: obj.id }).then(data => {
const form = data.data
this.form = form
})
},
onSubmit (e) {
this.$refs.ruleForm.validate(valid => {
if (valid) {
if (this.form.id) {
roleUpdate(this.form).then(data => {
this.$emit('ok')
this.onCancel()
})
} else {
roleAdd(this.form).then(data => {
this.$emit('ok')
this.onCancel()
})
}
} else {
return false
}
})
},
onCancel () {
this.$refs.ruleForm.resetFields()
this.visible = false
},
onReset () {
this.$refs.ruleForm.resetFields()
},
onChange (index) {
const org = this.orgList[index]
this.form.orgName = org.name
this.form.orgId = org.id
this.form.type = 'MALL'
}
}
}
</script>

View File

@ -1,46 +0,0 @@
<template>
<a-drawer
title="角色详情"
width="640"
placement="right"
:visible="visible"
@close="onClose">
<a-descriptions :column="{ sm: 2, xs: 1 }">
<a-descriptions-item label="名称">{{ model.name }}</a-descriptions-item>
<a-descriptions-item label="描述">{{ model.description }}</a-descriptions-item>
<a-descriptions-item label="创建时间">{{ model.createdAt | moment }}</a-descriptions-item>
<a-descriptions-item label="修改时间">{{ model.updatedAt | moment }}</a-descriptions-item>
</a-descriptions>
</a-drawer>
</template>
<script>
import { roleGet } from '@/api/security/role'
import { statusMap } from '@/views/status/statusMap'
export default {
data () {
return {
visible: false,
model: {}
}
},
filters: {
statusFilter (status) {
return statusMap[status + '']
}
},
methods: {
show (id) {
this.visible = true
roleGet({ id: id }).then(data => {
this.model = data.data
})
},
onClose () {
this.model = {}
this.visible = false
}
}
}
</script>

View File

@ -0,0 +1,282 @@
<template>
<a-modal
:title="modalTitle"
:width="900"
:visible="visible"
:confirmLoading="confirmLoading"
@ok="handleSubmit"
@cancel="handleCancel"
>
<a-spin :spinning="confirmLoading">
<a-divider orientation="left">基本信息</a-divider>
<a-row :gutter="24">
<a-col :md="12" :sm="24">
<a-form :form="form">
<a-form-item style="display: none;">
<a-input v-decorator="['id']" />
</a-form-item>
<a-form-item
label="账号"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
>
<a-input placeholder="请输入账号" v-decorator="['loginName', {rules: [{required: true, min: 5, message: '请输入至少五个字符的账号'}]}]" />
</a-form-item>
</a-form>
</a-col>
<a-col :md="12" :sm="24" >
<a-form :form="form">
<a-form-item
label="姓名"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
>
<a-input placeholder="请输入姓名" v-decorator="['userName', {rules: [{required: true, message: '请输入姓名'}]}]" />
</a-form-item>
</a-form>
</a-col>
</a-row>
<a-row :gutter="24" v-if="isAdd">
<a-col :md="12" :sm="24">
<a-form :form="form">
<a-form-item
label="密码"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
>
<a-input
placeholder="请输入密码"
type="password"
v-decorator="['password', {rules: [{required: true, message: '请输入密码!'},{
validator: validateToNextPassword,
},]}]" />
</a-form-item>
</a-form>
</a-col>
<a-col :md="12" :sm="24">
<a-form :form="form">
<a-form-item
label="重复密码"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
>
<a-input
placeholder="请再次输入密码"
type="password"
v-decorator="['confirm', {rules: [{required: true, message: '请再次输入密码!'},
{
validator: compareToFirstPassword,
}]}]" />
</a-form-item>
</a-form>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :md="12" :sm="24">
<a-form :form="form">
<a-form-item
label="昵称"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
>
<a-input placeholder="请输入昵称" v-decorator="['nickName']" />
</a-form-item>
</a-form>
</a-col>
<a-col :md="12" :sm="24">
<a-form :form="form">
<a-form-item
label="生日"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
>
<a-date-picker placeholder="请选择生日" @change="onChange" style="width: 100%" v-decorator="['birthday']" />
</a-form-item>
</a-form>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :md="12" :sm="24">
<a-form :form="form">
<a-form-item
label="性别"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
>
<a-radio-group v-decorator="['sex',{rules: [{ required: true, message: '请选择性别' }]}]" >
<a-radio :value="1"></a-radio>
<a-radio :value="2"></a-radio>
</a-radio-group>
</a-form-item>
</a-form>
</a-col>
<a-col :md="12" :sm="24">
<a-form :form="form">
<a-form-item
label="邮箱"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
>
<a-input placeholder="请输入邮箱" v-decorator="['email']" />
</a-form-item>
</a-form>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :md="12" :sm="24">
<a-form :form="form">
<a-form-item
label="手机号"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
>
<a-input placeholder="请输入手机号" v-decorator="['phoneNumber',{rules: [{ required: true, message: '请输入手机号' }]}]" />
</a-form-item>
</a-form>
</a-col>
</a-row>
</a-spin>
</a-modal>
</template>
<script>
import { userAdd, userEdit } from '@/api/security/user'
import moment from 'moment'
export default {
data () {
return {
labelCol: {
xs: { span: 24 },
sm: { span: 6 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 }
},
modalTitle: '新增菜单',
visible: false,
confirmLoading: false,
form: this.$form.createForm(this),
birthdayString: [],
isAdd: false
}
},
methods: {
//
add () {
this.modalTitle = '新增用户'
this.visible = true
this.isAdd = true
},
//
edit (record) {
this.modalTitle = '编辑用户'
this.confirmLoading = true
this.visible = true
this.isAdd = false
//
setTimeout(() => {
this.form.setFieldsValue(
{
id: record.id,
loginName: record.loginName,
userName: record.userName,
nickName: record.nickName,
sex: record.sex,
email: record.email,
phoneNumber: record.phoneNumber
}
)
}, 100)
//
if (record.birthday != null) {
this.form.getFieldDecorator('birthday', { initialValue: moment(record.birthday, 'YYYY-MM-DD') })
}
this.birthdayString = moment(record.birthday).format('YYYY-MM-DD')
this.confirmLoading = false
},
compareToFirstPassword (rule, value, callback) {
const form = this.form
if (value && value !== form.getFieldValue('password')) {
// eslint-disable-next-line standard/no-callback-literal
callback('请确认两次输入密码的一致性!')
} else {
callback()
}
},
validateToNextPassword (rule, value, callback) {
const form = this.form
if (value && this.confirmDirty) {
form.validateFields(['confirm'], { force: true })
}
callback()
},
/**
* 日期需单独转换
*/
onChange (date, dateString) {
if (date == null) {
this.birthdayString = []
} else {
this.birthdayString = moment(date).format('YYYY-MM-DD')
}
},
handleSubmit () {
const { form: { validateFields } } = this
this.confirmLoading = true
validateFields((errors, values) => {
if (!errors) {
if (this.birthdayString.length > 0) {
values.birthday = this.birthdayString
}
if (values.id) {
userEdit(values).then((res) => {
this.confirmLoading = false
if (res.code === 200) {
this.$message.success('编辑成功')
this.$emit('ok', values)
this.handleCancel()
} else {
this.$message.error('编辑失败:' + res.msg)
}
}).finally((res) => {
this.confirmLoading = false
})
} else {
userAdd(values, { password: values.password }).then((res) => {
this.confirmLoading = false
if (res.code === 200) {
this.$message.success('新增成功')
this.$emit('ok', values)
this.handleCancel()
} else {
this.$message.error('新增失败:' + res.msg)
}
}).finally((res) => {
this.confirmLoading = false
})
}
} else {
this.confirmLoading = false
}
})
},
handleCancel () {
this.form.resetFields()
this.visible = false
//
this.birthdayString = ''
this.form.getFieldDecorator('birthday', { initialValue: null })
}
}
}
</script>

View File

@ -1,152 +1,188 @@
<template>
<page-header-wrapper :title="false">
<div>
<a-card :bordered="false">
<div class="table-page-search-wrapper">
<a-form layout="inline">
<a-row :gutter="48">
<a-row :gutter="24">
<a-col :md="6" :sm="24">
<a-form-item label="名称">
<a-input v-model="queryParam.realName" placeholder="请输入名称" @pressEnter="handleFefresh"/>
<a-form-item label="用户名称" >
<a-input v-model="queryParam.userName" placeholder="请输入用户名称"/>
</a-form-item>
</a-col>
<a-col :md="6" :sm="24">
<a-form-item label="状态">
<a-select v-model="queryParam.enabled" placeholder="请选择" default-value="0" @pressEnter="handleFefresh">
<a-select-option value="">全部</a-select-option>
<a-select-option v-for="(item, index) in statusMap" :key="index" :value="index">{{ item }}</a-select-option>
</a-select>
<a-form-item label="账号" >
<a-input v-model="queryParam.loginName" placeholder="请输入账号"/>
</a-form-item>
</a-col>
<a-col :md="6" :sm="24">
<a-button type="primary" @click="handleFefresh">查询</a-button>
<a-button @click="() => {queryParam = {}, handleFefresh()}">重置</a-button>
<a-form-item label="手机号码" >
<a-input v-model="queryParam.phoneNumber" placeholder="请输入手机号码"/>
</a-form-item>
</a-col>
<a-col :md="6" :sm="24" align="right">
<a-button type="primary" @click="handleCreate">新增</a-button>
<a-col :md="4" :sm="24">
<a-button type="primary" @click="$refs.table.refresh(true)">查询</a-button>
<a-button style="margin-left: 8px" @click="() => queryParam = {}">重置</a-button>
</a-col>
</a-row>
</a-form>
</div>
<div class="table-operator">
<a-button type="primary" icon="plus" @click="$refs.userForm.add()">新增用户</a-button>
<a-button type="danger" :disabled="selectedRowKeys.length < 1" @click="batchDelete">
<a-icon type="delete"/>批量删除
</a-button>
</div>
<s-table
ref="table"
size="default"
rowKey="id"
:columns="columns"
:data="loadData"
:rowSelection="rowSelection"
:alert="options.alert"
:rowKey="(record) => record.id"
:rowSelection="options.rowSelection"
>
<template slot="tbStatus" slot-scope="text, record">
<a-switch checked-children="启用" un-checked-children="停用" v-model="record.enabled" @change="updateStatus(record.id, record.enabled)"/>
</template>
<template slot="action" slot-scope="text, record">
<a href="javascript:;" @click="handleEdit(record)">修改</a>
<span slot="sex" slot-scope="text, record">
{{ record.sex | sexFilter }}
</span>
<span slot="action" slot-scope="text, record">
<a @click="$refs.userForm.edit(record)">编辑</a>
<a-divider type="vertical" />
<a href="javascript:;" @click="handleDetail(record.id)">详情</a>
<a-divider type="vertical" />
<a href="javascript:;" @click="handleDetail(record.id)">修改密码</a>
</template>
<a-dropdown >
<a class="ant-dropdown-link">
更多 <a-icon type="down" />
</a>
<a-menu slot="overlay">
<a-menu-item>
<a-popconfirm placement="topRight" title="确认重置密码?" @confirm="() => resetPwd(record)">
<a>重置密码</a>
</a-popconfirm>
</a-menu-item>
<a-menu-item>
<a @click="$refs.userRoleForm.userRole(record)">授权角色</a>
</a-menu-item>
<a-menu-item>
<a-popconfirm placement="topRight" title="确认删除?" @confirm="() => singleDelete(record)">
<a>删除</a>
</a-popconfirm>
</a-menu-item>
</a-menu>
</a-dropdown>
</span>
</s-table>
<create-form ref="modal" @ok="handleOk" />
<user-detail ref="detail"></user-detail>
<user-form ref="userForm" @ok="handleOk" />
<user-role-form ref="userRoleForm" @ok="handleOk"/>
</a-card>
</page-header-wrapper>
</div>
</template>
<script>
import { userPage, userUpdateEnabled } from '@/api/security/user'
import { STable } from '@/components'
import CreateForm from './modules/CreateForm'
import UserDetail from './modules/UserDetail'
import { statusMap } from '@/views/status/statusMap'
import { userPage, userDel, passwordReset } from '@/api/security/user'
import UserForm from './UserForm'
import UserRoleForm from './UserRoleForm'
import { sexMap } from '@/views/filterMap/sexMap'
export default {
name: 'UserList',
components: {
STable,
CreateForm,
UserDetail
UserForm,
UserRoleForm
},
data () {
return {
statusMap: statusMap,
queryParam: { realName: '', enabled: '' },
selectedRowKeys: [], // key
selectedRows: [], //
//
queryParam: {},
//
columns: [
{ title: '名称', width: 40, dataIndex: 'realName', key: 'realName' },
{ title: '手机号', width: 40, dataIndex: 'mobile', key: 'mobile' },
{ title: '邮箱', width: 40, dataIndex: 'email', key: 'email' },
{
title: '状态',
width: 10,
key: 'tbStatus',
align: 'center',
scopedSlots: { customRender: 'tbStatus' }
title: '账号',
dataIndex: 'loginName'
},
{
title: '姓名',
dataIndex: 'userName'
},
{
title: '昵称',
dataIndex: 'nickName'
},
{
title: '性别',
dataIndex: 'sex',
scopedSlots: { customRender: 'sex' }
}, {
title: '手机',
dataIndex: 'phoneNumber'
},
{
title: '操作',
key: 'operation',
width: 10,
align: 'right',
width: '150px',
dataIndex: 'action',
scopedSlots: { customRender: 'action' }
}
],
// Promise
loadData: parameter => {
const enabled = this.queryParam.enabled
const queryParam = {
realName: this.queryParam.realName,
enabled: enabled === '1' ? true : enabled === '0' ? false : ''
return userPage(Object.assign(parameter, this.queryParam)).then((res) => {
return res
})
},
selectedRowKeys: [], // key
selectedRows: [], //
options: {
alert: { show: true, clear: () => { this.selectedRowKeys = [] } },
rowSelection: {
selectedRowKeys: this.selectedRowKeys,
onChange: this.onSelectChange
}
return userPage(Object.assign(parameter, queryParam))
.then(res => {
return res.data
})
}
}
},
computed: {
rowSelection () {
return {
selectedRowKeys: this.selectedRowKeys,
onChange: this.onSelectChange
}
filters: {
sexFilter (sex) {
return sexMap[sex]
}
},
created () {
//
},
methods: {
//
updateStatus (id, status) {
userUpdateEnabled({
id: id,
enabled: status ? 1 : 0
}).then(res => {
this.$notification.success({
message: '操作成功',
duration: 1,
description: status ? '用户已启用' : '用户已停用'
})
this.$refs.table.refresh()
//
resetPwd (record) {
passwordReset({ id: record.id }).then(res => {
if (res.code === 200) {
this.$message.success('重置成功')
// this.$refs.table.refresh()
} else {
this.$message.error('重置失败:' + res.message)
}
})
},
//
handleCreate () {
this.$refs.modal.add()
//
singleDelete (record) {
const param = { 'ids': record.id }
this.sysUserDelete(param)
},
//
handleEdit (record) {
this.$refs.modal.edit(record)
//
batchDelete () {
const paramIds = this.selectedRowKeys.join(',')
const param = { 'ids': paramIds }
this.sysUserDelete(param)
},
sysUserDelete (param) {
userDel(param).then((res) => {
if (res.code === 200) {
this.$message.success('删除成功')
this.$refs.table.refresh()
} else {
this.$message.error('删除失败:' + res.message)
}
}).catch((err) => {
this.$message.error('删除错误:' + err.message)
})
},
//
handleOk () {
this.$refs.table.refresh()
},
//
handleDetail (id) {
this.$refs.detail.show(id)
},
handleFefresh () {
this.$refs.table.refresh(true)
},
//
onSelectChange (selectedRowKeys, selectedRows) {
this.selectedRowKeys = selectedRowKeys
this.selectedRows = selectedRows
@ -154,3 +190,11 @@ export default {
}
}
</script>
<style lang="less">
.table-operator {
margin-bottom: 18px;
}
button {
margin-right: 8px;
}
</style>

View File

@ -0,0 +1,114 @@
<template>
<a-modal
title="授权角色"
:width="800"
:visible="visible"
:confirmLoading="confirmLoading"
@ok="handleSubmit"
@cancel="handleCancel"
>
<a-card :bordered="false">
<div>
<a-table
size="middle"
:row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
:columns="columns"
:dataSource="loadData"
:pagination="false"
:loading="loading"
:rowKey="(record) => record.id"
/>
</div>
</a-card>
</a-modal>
</template>
<script>
import { roleList } from '@/api/security/role'
import { userOwnRole, userGrantRole } from '@/api/security/user'
const columns = [
{
title: '角色名称',
dataIndex: 'name'
},
{
title: '唯一编码',
dataIndex: 'code'
}
]
export default {
name: 'UserRoleIndex',
data () {
return {
columns,
loadData: [],
selectedRowKeys: [], // Check here to configure the default column
loading: true,
visible: false,
confirmLoading: false,
recordEntity: []
}
},
computed: {
hasSelected () {
return this.selectedRowKeys.length > 0
}
},
methods: {
//
userRole (record) {
this.recordEntity = record
this.visible = true
//
this.sysUserOwnRole()
// ,
roleList().then((res) => {
this.loadData = res.data
})
},
/**
* 获取用户已有角色
*/
sysUserOwnRole () {
this.loading = true
userOwnRole({ id: this.recordEntity.id }).then((res) => {
//
this.selectedRowKeys = res.data
this.loading = false
})
},
onSelectChange (selectedRowKeys) {
this.selectedRowKeys = selectedRowKeys
},
handleSubmit () {
this.confirmLoading = false
userGrantRole({ id: this.recordEntity.id, grantRoleIdList: this.selectedRowKeys }).then((res) => {
if (res.code == 200) {
this.$message.success('授权成功')
this.confirmLoading = false
this.$emit('ok', this.recordEntity)
this.handleCancel()
} else {
this.$message.error('授权失败:' + res.message)
}
}).finally((res) => {
this.confirmLoading = false
})
this.visible = false
},
handleCancel () {
this.recordEntity = []
this.selectedRowKeys = []
this.visible = false
}
}
}
</script>

View File

@ -1,127 +0,0 @@
<template>
<a-drawer :visible="visible" :title="modalTitle" :width="720" @close="onCancel">
<a-form-model ref="ruleForm" :model="form" :rules="rules" :label-col="labelCol" :wrapper-col="wrapperCol">
<a-row :gutter="16">
<a-col :span="12">
<a-form-model-item ref="username" label="用户名" prop="username"><a-input v-model="form.username" /></a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item ref="realName" label="姓名" prop="realName"><a-input v-model="form.realName" /></a-form-model-item>
</a-col>
</a-row>
<a-row :gutter="16">
<a-col :span="12">
<a-form-model-item ref="mobile" label="手机号" prop="mobile"><a-input v-model="form.mobile" /></a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item ref="password" label="密码" prop="password"><a-input-password v-model="form.password" /></a-form-model-item>
</a-col>
</a-row>
<a-row :gutter="16">
<a-col :span="12">
<a-form-model-item ref="address" label="地址" prop="address"><a-input v-model="form.address" /></a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item ref="email" label="邮箱" prop="email"><a-input v-model="form.email" /></a-form-model-item>
</a-col>
</a-row>
</a-form-model>
<div class="draw-button-container align-center">
<a-button @click="onCancel">取消</a-button>
<a-button type="primary" @click="onSubmit">保存</a-button>
</div>
</a-drawer>
</template>
<script>
import { userGet, userAdd, userUpdate } from '@/api/security/user'
import { typeMap } from '../../maps/map.js'
export default {
props: {
id: {
type: String,
default: undefined
}
},
data () {
return {
typeMap: typeMap,
orgList: [],
modalTitle: '新增',
visible: false,
labelCol: { span: 4 },
wrapperCol: { span: 16 },
form: {
username: '',
realName: '',
mobile: '',
password: '',
type: undefined,
orgId: undefined,
orgName: '',
address: '',
email: ''
},
rules: {
username: [{ required: true, message: '请输入用户名', trigger: 'blur' }, { min: 5, message: '长度不能小于5', trigger: 'blur' }],
realName: [{ required: true, message: '请输入姓名', trigger: 'blur' }, { min: 2, message: '长度不能小于5', trigger: 'blur' }],
mobile: [{ required: true, message: '请输入正确的手机号', pattern: /^1[3456789]\d{9}$/, trigger: 'blur' }],
password: [{ required: true, message: '请输入密码', trigger: 'blur' }, { min: 6, message: '长度不能小于6', trigger: 'blur' }],
orgId: [{ required: true, message: '请选择机构', trigger: 'blur' }]
}
}
},
filters: {
typeFilter (type) {
return typeMap[type]
}
},
methods: {
add () {
this.modalTitle = '新增'
this.visible = true
},
edit (obj) {
this.modalTitle = '修改'
this.visible = true
userGet({ id: obj.id }).then(data => {
const form = data.data
this.form = form
})
},
onSubmit (e) {
this.$refs.ruleForm.validate(valid => {
if (valid) {
if (this.form.id) {
userUpdate(this.form).then(data => {
this.$emit('ok')
this.onCancel()
})
} else {
userAdd(this.form).then(data => {
this.$emit('ok')
this.onCancel()
})
}
} else {
return false
}
})
},
onCancel () {
this.$refs.ruleForm.resetFields()
this.visible = false
},
onReset () {
this.$refs.ruleForm.resetFields()
},
onChange (index) {
const org = this.orgList[index]
this.form.orgName = org.name
this.form.orgId = org.id
this.form.type = 'MALL'
}
}
}
</script>

View File

@ -1,56 +0,0 @@
<template>
<a-drawer
title="用户详情"
width="640"
placement="right"
:visible="visible"
@close="onClose">
<a-descriptions :column="{ sm: 2, xs: 1 }">
<a-descriptions-item label="用户名">{{ model.username }}</a-descriptions-item>
<a-descriptions-item label="姓名">{{ model.realName }}</a-descriptions-item>
<a-descriptions-item label="创建时间">{{ model.createdAt | moment }}</a-descriptions-item>
<a-descriptions-item label="修改时间">{{ model.updatedAt | moment }}</a-descriptions-item>
<a-descriptions-item label="状态">{{ model.enabled | statusFilter }}</a-descriptions-item>
<a-descriptions-item label="手机号">{{ model.mobile }}</a-descriptions-item>
<a-descriptions-item label="机构">{{ model.orgName }}</a-descriptions-item>
<a-descriptions-item label="类型">{{ model.type | typeFilter}}</a-descriptions-item>
<a-descriptions-item label="地址">{{ model.address }}</a-descriptions-item>
<a-descriptions-item label="邮箱">{{ model.email }}</a-descriptions-item>
</a-descriptions>
</a-drawer>
</template>
<script>
import { userGet } from '@/api/security/user'
import { enabledMap } from '@/views/status/enabledMap'
import { typeMap } from '../../maps/map.js'
export default {
data () {
return {
visible: false,
model: {}
}
},
filters: {
statusFilter (status) {
return enabledMap[status + '']
},
typeFilter (type) {
return typeMap[type]
}
},
methods: {
show (id) {
this.visible = true
userGet({ id: id }).then(data => {
this.model = data.data
})
},
onClose () {
this.model = {}
this.visible = false
}
}
}
</script>

View File

@ -1,4 +0,0 @@
export const enabledMap = {
'false': '停用',
'true': '启用'
}

View File

@ -1,4 +0,0 @@
export const statusMap = {
'0': '停用',
'1': '启用'
}