Skip to content

A
ant-design-pro-vue
Commit 83f779ac by Sendya
Options

fix: update RoleList2

parent d860f308
Showing with 37 additions and 77 deletions
src/config/router.config.js
......@@ -100,6 +100,12 @@ export const asyncRouterMap = [
meta: { title: '角色列表', permission: [ 'table' ] }
},
{
path: '/list/system-role',
name: 'SystemRole',
component: () => import('@/views/role/RoleList'),
meta: { title: '角色列表2', permission: [ 'table' ]}
},
{
path: '/list/permission-list',
name: 'PermissionList',
component: () => import('@/views/list/PermissionList'),
......@@ -169,21 +175,6 @@ export const asyncRouterMap = [
}
]
},
{
path: '/system',
name: 'system',
component: RouteView,
redirect: '/system/role',
meta: { title: '系统管理', icon: 'setting', permission: [ 'table' ] },
children: [
{
path: '/system/role',
name: 'SystemRole',
component: () => import('@/views/role/RoleList'),
meta: { title: '角色列表', permission: [ 'table' ]}
}
]
},
// result
{
......
src/utils/helper/permission.js
......@@ -8,46 +8,46 @@ const PERMISSION_ENUM = {
'disable': { key: 'disable', label: '禁用' },
'import': { key: 'import', label: '导入' },
'export': { key: 'import', label: '导入' },
};
}
function plugin(Vue) {
if (plugin.installed) {
return;
return
}
!Vue.prototype.$auth && Object.defineProperties(Vue.prototype, {
$auth: {
get() {
const _this = this;
const _this = this
return (permissions) => {
let [permission, action] = permissions.split('.');
const permissionList = _this.$store.getters.roles.permissions;
const [permission, action] = permissions.split('.')
const permissionList = _this.$store.getters.roles.permissions
permissionList.find((val) => {
return val.permissionId === permission
}).actionList.findIndex((val) => {
return val === action
});
})
return false
}
}
}
});
})
!Vue.prototype.$enum && Object.defineProperties(Vue.prototype, {
$enum: {
get() {
// const _this = this;
return (val) => {
let result = PERMISSION_ENUM;
let result = PERMISSION_ENUM
val && val.split('.').forEach(v => {
result = result && result[v] || null
});
})
return result
}
}
}
});
})
}
export default plugin
\ No newline at end of file
src/views/role/RoleList.vue
<template>
<page-layout title="角色管理">
<a-card :bordered="false" :style="{ height: '100%' }">
<!--<a-tabs defaultActiveKey="1" tabPosition="left" size="large" :style="{ height: '400px'}" :tabBarStyle="{ textAlign: 'left' }" @prevClick="callback" @nextClick="callback">
<a-tab-pane tab="管理员" key="1">Content of tab 1</a-tab-pane>
<a-tab-pane tab="销售组长" key="2">Content of tab 2</a-tab-pane>
<a-tab-pane tab="销售总负责人" key="3">Content of tab 3</a-tab-pane>
<a-tab-pane tab="总经理" key="4">Content of tab 4</a-tab-pane>
<a-tab-pane tab="普通销售" key="5">Content of tab 5</a-tab-pane>
<a-tab-pane tab="客服" key="6">Content of tab 6</a-tab-pane>
<a-tab-pane tab="会员" key="7">Content of tab 7</a-tab-pane>
<a-tab-pane tab="增加角色" key="-1">Content of tab 7</a-tab-pane>
</a-tabs>-->
<a-row :gutter="24">
<a-col :md="4">
<a-list itemLayout="vertical" :dataSource="roles">
......@@ -24,56 +12,37 @@
</a-list>
</a-col>
<a-col :md="20">
<a-row v-if="mdl.id">
<a-col :span="5"><h3 style="text-align: right">角色：</h3></a-col>
<a-col :span="19"><h3>{{ mdl.name }}</h3></a-col>
</a-row>
<a-form :form="form">
<a-form-item
label="唯一键"
:labelCol="{ span: 5 }"
:wrapperCol="{ span: 18 }"
>
<div style="max-width: 800px">
<a-divider v-if="isMobile()" />
<div v-if="mdl.id">
<h3>角色：{{ mdl.name }}</h3>
</div>
<a-form :form="form" :layout="isMobile() ? 'vertical' : 'horizontal'">
<a-form-item label="唯一键">
<a-input v-decorator="[ 'id', {rules: [{ required: true, message: 'Please input unique key!' }]} ]" placeholder="请填写唯一键" />
</a-form-item>
<a-form-item
label="角色名称"
:labelCol="{ span: 5 }"
:wrapperCol="{ span: 18 }"
>
<a-form-item label="角色名称">
<a-input v-decorator="[ 'name', {rules: [{ required: true, message: 'Please input role name!' }]} ]" placeholder="请填写角色名称" />
</a-form-item>
<a-form-item
label="状态"
:labelCol="{ span: 5 }"
:wrapperCol="{ span: 18 }"
>
<a-form-item label="状态">
<a-select v-decorator="[ 'status', {rules: []} ]">
<a-select-option :value="1">正常</a-select-option>
<a-select-option :value="2">禁用</a-select-option>
</a-select>
</a-form-item>
<a-form-item
label="备注说明"
:labelCol="{ span: 5 }"
:wrapperCol="{ span: 18 }"
>
<a-form-item label="备注说明">
<a-textarea :row="3" v-decorator="[ 'describe', {rules: [{ required: true, message: 'Please input role name!' }]} ]" placeholder="请填写角色名称" />
</a-form-item>
<a-form-item
label="拥有权限"
:labelCol="{ span: 5 }"
:wrapperCol="{ span: 18 }"
>
<a-form-item label="拥有权限">
<a-row :gutter="16" v-for="(permission, index) in permissions" :key="index">
<a-col :span="4">
<a-col :xl="4" :lg="24">
{{ permission.name }}：
</a-col>
<a-col :span="20">
<a-col :xl="20" :lg="24">
<a-checkbox
v-if="permission.actionsOptions.length > 0"
:indeterminate="permission.indeterminate"
......@@ -87,23 +56,22 @@
</a-form-item>
</a-form>
</div>
</a-col>
</a-row>
</a-card>
</page-layout>
</template>
<script>
import PageLayout from '@/components/page/PageLayout'
import { getRoleList, getPermissions } from "@/api/manage"
import { getRoleList, getPermissions } from '@/api/manage'
import { mixinDevice } from '@/utils/mixin'
import { actionToObject } from '@/utils/permissions'
import pick from 'lodash.pick'
export default {
name: "RoleList",
components: {
PageLayout
},
name: 'RoleList',
mixins: [mixinDevice],
components: {},
data () {
return {
form: this.$form.createForm(this),
......@@ -168,7 +136,7 @@
},
loadPermissions () {
getPermissions().then(res => {
let result = res.result
const result = res.result
this.permissions = result.map(permission => {
const options = actionToObject(permission.actionData)
permission.checkedAll = false
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment