feat: 角色管理

fix/0524_ch
向文可 3 years ago
parent e40eefde1e
commit 9b9ed3f9d2

@ -1,3 +1,4 @@
import * as deptAPI from '@/api/permission/dept.js';
import * as featureAPI from '@/api/permission/feature.js';
import * as menuAPI from '@/api/permission/menu.js';
import * as api from '@/api/permission/role.js';
@ -11,6 +12,7 @@ const state = () => ({
opts: {
init: false,
system: [],
dept: [],
status: [
{
label: '启用',
@ -46,6 +48,7 @@ const actions = {
...state.opts,
init: true,
system: await systemAPI.search(),
dept: await deptAPI.search({ hiddenDisable: true }),
});
},
loadMenu: async (context, systemId) => {
@ -61,6 +64,14 @@ const actions = {
}
return res;
},
updateDept: async (context, data) => {
let update = data.roleIds instanceof Array ? deptAPI.addRole : deptAPI.delRole;
let res = await update(data);
if (!res) {
ElMessage.error('保存组织机构失败');
}
return res;
},
detail: async (context, id) => {
let res = await api.detail(id);
if (!res) {

@ -59,7 +59,7 @@
</el-form-item>
</el-form>
</el-tab-pane>
<el-tab-pane label="角色权限" name="2">
<el-tab-pane :disabled="!formState.form.id" label="角色权限" name="2">
<el-form
ref="refsForm2"
v-loading="formState.submitting"
@ -107,7 +107,7 @@
</el-form-item>
</el-form>
</el-tab-pane>
<el-tab-pane label="绑定组织" name="3">
<el-tab-pane :disabled="!formState.form.id" label="绑定组织" name="3">
<el-form
ref="refsForm3"
v-loading="formState.submitting"
@ -116,7 +116,23 @@
:model="formState.form"
:rules="formState.rules3"
>
<el-form-item label="选择绑定组织" prop="menuIds" />
<el-form-item label="选择绑定组织" prop="departmentList">
<el-tree
ref="refsTree2"
:data="opts.dept"
:default-checked-keys="formState.form.departmentList.map((item) => item.id)"
default-expand-all
:expand-on-click-node="false"
highlight-current
node-key="id"
:props="{
label: 'name',
value: 'id',
}"
show-checkbox
@check-change="handleCheckDept"
/>
</el-form-item>
</el-form>
</el-tab-pane>
</el-tabs>
@ -135,7 +151,7 @@
const store = useStore();
const loading = ref(false);
const code = computed(() => store.state.role.code);
const list = computed(() => store.state.role.list);
const list = computed(() => _.cloneDeep(store.state.role.list));
const total = computed(() => store.state.role.total);
const opts = computed(() => store.state.role.opts);
if (!unref(opts).init) {
@ -198,6 +214,7 @@
isEnable: true,
menuIds: [],
permissionIds: [],
departmentList: [],
},
rules1: {
systemId: [{ required: true, message: '所属系统不能为空' }],
@ -208,6 +225,9 @@
rules2: {
menuIds: [{ required: true, message: '功能权限不能为空' }],
},
rules3: {
departmentList: [{ required: true, trigger: 'change', message: '绑定组织不能为空' }],
},
});
watch(
() => formState.currentTab,
@ -217,7 +237,9 @@
res.permissionIds = [];
const deep = (arr) => {
(arr || []).forEach((item) => {
if (item.isHave) {
res.menuIds.push(item.id);
}
res.permissionIds.push(
...(item.permissionChild || []).filter((item) => item.isHave).map((item) => item.id)
);
@ -254,16 +276,61 @@
formState.form.permissionIds.splice(formState.form.permissionIds.indexOf(data.id), 1);
}
};
const refsTree2 = ref(null);
const updateChecked = ref(false);
const handleCheckDept = async (data, checked, childChecked) => {
if (!unref(updateChecked)) {
let params =
checked || childChecked
? {
departmentId: data.id,
isDistributionCurrentDepartmentEmployee: true,
roleIds: [formState.form.id],
}
: { departmentId: data.id, isDeleteDepartmentOfEmployeeRole: true, roleIds: formState.form.id };
let res = await store.dispatch('role/updateDept', params);
if (checked || childChecked) {
if (res) {
formState.form.departmentList.push({ ...data });
}
} else {
if (res) {
formState.form.departmentList.splice(
formState.form.departmentList.findIndex((item) => item.id === data.id),
1
);
}
}
nextTick(() => {
try {
unref(refsForm3).validate();
} catch (e) {
console.info(e);
}
updateChecked.value = true;
unref(refsTree2).setCheckedKeys(formState.form.departmentList.map((item) => item.id));
nextTick(() => {
updateChecked.value = false;
});
});
}
};
const handleCreate = (row) => {
formState.formVisible = true;
Object.assign(
formState.form,
_.cloneDeep(
row || {
id: null,
systemId: null,
roleName: null,
roleDesc: null,
isEnable: true,
menuIds: [],
permissionIds: [],
departmentList: [],
}
)
);
};
const handleCancel = () => {
@ -275,6 +342,11 @@
await proxy.$validate(
formState.currentTab === '1' ? refsForm : formState.currentTab === '2' ? refsForm2 : refsForm3
);
if (formState.currentTab === '3') {
formState.formVisible = false;
formState.currentTab = '1';
handleSearch();
} else {
let data = _.cloneDeep(formState.form);
let res = await store.dispatch(
formState.currentTab === '1'
@ -287,9 +359,6 @@
if (res && formState.currentTab === '1') {
formState.form.id = res.id;
}
if (res && formState.currentTab === '3') {
formState.formVisible = false;
} else {
formState.currentTab = +formState.currentTab + 1 + '';
}
} catch (e) {
@ -368,16 +437,24 @@
</script>
<style lang="less" scoped>
.form2 {
display: flex;
.el-tabs {
.el-form {
.el-form-item {
width: 50%;
flex: 1;
width: 100%;
:deep(.el-form-item__content) {
width: 100%;
.el-tree {
width: 100%;
}
}
}
}
.form2 {
display: flex;
.el-form-item {
width: 50%;
flex: 1;
}
}
}
</style>

@ -21,10 +21,10 @@ export default (configEnv) => {
proxy: {
'/api': {
// target: 'http://192.168.10.109:8090/', // 显雨
target: 'http://192.168.10.5:4500', // 高玉
// target: 'http://192.168.10.5:4500', // 高玉
// target: 'http://192.168.10.67:8090', // 罗战
// target: 'http://192.168.10.93:8090', // 周渺
// target: 'https://k8s-horse-gateway.mashibing.cn/', // 测试地址
target: 'https://k8s-horse-gateway.mashibing.cn/', // 测试地址
// target: 'https://you-gateway.mashibing.com', // 生产环境
changeOrigin: true,
rewrite: (path) => path.replace(/^\/api/, ''),

Loading…
Cancel
Save