tijiao
This commit is contained in:
@@ -9,7 +9,7 @@
|
||||
<ns-button style="margin: 10px" type="primary" @click="addApartment">新增部门</ns-button>
|
||||
<ns-button type="primary" @click="addApartmentSon">新增子部门</ns-button>
|
||||
<ns-button style="margin: 10px" type="primary" @click="deleteApartment">删除</ns-button>
|
||||
<a-tree :tree-data="apartmentTreeData" @select="SelectApartmentTree">
|
||||
<a-tree :tree-data="apartmentTreeData" defaultExpandAll @select="SelectApartmentTree">
|
||||
<template #title="{ title }">
|
||||
{{ title }}
|
||||
</template>
|
||||
@@ -18,13 +18,19 @@
|
||||
<a-col :span="12" class="list">
|
||||
<a-tabs v-model:activeKey="activeKey">
|
||||
<a-tab-pane key="1" tab="部门信息">
|
||||
<ns-form :schemas="formSchema" :model="formData" formLayout="vertical" class="form" />
|
||||
<ns-form
|
||||
ref="formRef"
|
||||
:schemas="formSchema"
|
||||
:model="formData"
|
||||
formLayout="vertical"
|
||||
class="form" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="部门权限">
|
||||
<a-tree
|
||||
:tree-data="apartmentAdminTreeData"
|
||||
v-model:checkedKeys="ApartcheckedKeys"
|
||||
checkable
|
||||
defaultExpandAll
|
||||
@select="ApartmentSelect">
|
||||
<template #title="{ title }">
|
||||
{{ title }}
|
||||
@@ -46,7 +52,7 @@
|
||||
<ns-button style="margin: 10px" type="primary" @click="addUser">新增角色</ns-button>
|
||||
<ns-button type="primary" @click="addUserSon">新增子角色</ns-button>
|
||||
<ns-button style="margin: 10px" type="primary" @click="deleteUser">删除</ns-button>
|
||||
<a-tree :tree-data="userTreeData" @select="SelectUserTree">
|
||||
<a-tree :tree-data="userTreeData" defaultExpandAll @select="SelectUserTree">
|
||||
<template #title="{ title }">
|
||||
{{ title }}
|
||||
</template>
|
||||
@@ -65,6 +71,7 @@
|
||||
<a-tree
|
||||
:tree-data="userAdminTreeData"
|
||||
v-model:checkedKeys="UsercheckedKeys"
|
||||
defaultExpandAll
|
||||
checkable
|
||||
@select="UserSelect">
|
||||
<template #title="{ title }">
|
||||
@@ -86,9 +93,12 @@
|
||||
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||
import { http } from '/nerv-lib/util/http';
|
||||
import { uuid } from '@antv/x6/lib/util/string/uuid';
|
||||
import { cloneDeep } from 'lodash-es';
|
||||
import { formConfig, formConfig2 } from './config';
|
||||
export default defineComponent({
|
||||
name: 'AuthorityManageIndex',
|
||||
setup() {
|
||||
const formRef = ref();
|
||||
let formData = ref({});
|
||||
let formData2 = ref({});
|
||||
const activeKey = ref('1');
|
||||
@@ -97,7 +107,12 @@
|
||||
const disabled2 = ref(true);
|
||||
const ApartcheckedKeys = ref<string[]>([]);
|
||||
const UsercheckedKeys = ref<string[]>([]);
|
||||
|
||||
const selectKey = ref();
|
||||
const selectRef = ref();
|
||||
const selectKey2 = ref();
|
||||
const selectRef2 = ref();
|
||||
const formSchema = formConfig(disabled as any);
|
||||
const formSchema2 = formConfig2(disabled2 as any);
|
||||
watch(ApartcheckedKeys, () => {
|
||||
console.log('checkedKeys', ApartcheckedKeys.value);
|
||||
});
|
||||
@@ -115,9 +130,10 @@
|
||||
{
|
||||
title: '铁路总局',
|
||||
key: '0-0',
|
||||
info: { name: '铁路总局' },
|
||||
children: [
|
||||
{ title: '济阳站', key: '0-0-0' },
|
||||
{ title: '临沂站', key: '0-0-1' },
|
||||
{ title: '济阳站', key: '0-0-0', info: { name: '济阳站' } },
|
||||
{ title: '临沂站', key: '0-0-1', info: { name: '临沂站' } },
|
||||
],
|
||||
},
|
||||
]);
|
||||
@@ -127,8 +143,8 @@
|
||||
title: '产品总监',
|
||||
key: '0-0',
|
||||
children: [
|
||||
{ title: '产品经理', key: '0-0-0' },
|
||||
{ title: '产品助理', key: '0-0-1' },
|
||||
{ title: '产品经理', key: '0-0-0', info: { departname: '产品经理' } },
|
||||
{ title: '产品助理', key: '0-0-1', info: { departname: '产品助理' } },
|
||||
],
|
||||
},
|
||||
]);
|
||||
@@ -182,14 +198,22 @@
|
||||
|
||||
const addUserSon = () => {
|
||||
disabled.value = false;
|
||||
opMap.type = 'addson';
|
||||
};
|
||||
|
||||
const deleteApartment = () => {
|
||||
Modal.confirm({
|
||||
title: '是否确认删除',
|
||||
icon: createVNode(ExclamationCircleOutlined),
|
||||
content: createVNode('div', { style: 'color:red;' }, ''),
|
||||
onOk() {},
|
||||
onOk() {
|
||||
function deepDel(data = apartmentTreeData.value[0].children) {
|
||||
data.map((item, index) => {
|
||||
if (item.key === selectKey.value) data.splice(index, 1);
|
||||
});
|
||||
}
|
||||
deepDel();
|
||||
console.log(selectKey.value);
|
||||
},
|
||||
onCancel() {
|
||||
console.log('Cancel');
|
||||
},
|
||||
@@ -202,7 +226,15 @@
|
||||
title: '是否确认删除',
|
||||
icon: createVNode(ExclamationCircleOutlined),
|
||||
content: createVNode('div', { style: 'color:red;' }, ''),
|
||||
onOk() {},
|
||||
onOk() {
|
||||
function deepDel(data = userTreeData.value[0].children) {
|
||||
data.map((item, index) => {
|
||||
if (item.key === selectKey2.value) data.splice(index, 1);
|
||||
});
|
||||
}
|
||||
deepDel();
|
||||
console.log(selectKey2.value);
|
||||
},
|
||||
onCancel() {
|
||||
console.log('Cancel');
|
||||
},
|
||||
@@ -213,12 +245,18 @@
|
||||
const SelectApartmentTree = (selectedKeys: any, info: any) => {
|
||||
disabled.value = false;
|
||||
console.log(selectedKeys, 'selectedKeys');
|
||||
console.log(info, 'info');
|
||||
console.log(info.node.dataRef, 'info');
|
||||
selectKey.value = selectedKeys[0];
|
||||
selectRef.value = info.node.dataRef;
|
||||
formData.value = info.node.dataRef.info;
|
||||
};
|
||||
const SelectUserTree = (selectedKeys: any, info: any) => {
|
||||
disabled2.value = false;
|
||||
console.log(selectedKeys, 'selectedKeys');
|
||||
console.log(info, 'info');
|
||||
console.log(info.node.dataRef.info, 'info');
|
||||
selectKey2.value = selectedKeys[0];
|
||||
selectRef2.value = info.node.dataRef;
|
||||
formData2.value = info.node.dataRef.info;
|
||||
};
|
||||
|
||||
const CancelApartment = () => {
|
||||
@@ -240,6 +278,8 @@
|
||||
};
|
||||
|
||||
const ApartmentSure = () => {
|
||||
// formRef.value?.triggerSubmit().then(() => {});
|
||||
|
||||
disabled.value = !disabled.value;
|
||||
opMap.fuc && opMap.fuc(formData.value);
|
||||
// console.log(formData.value.name, 'formData');
|
||||
@@ -248,191 +288,42 @@
|
||||
apartmentTreeData.value[0].children.push({
|
||||
title: formData.value.name,
|
||||
key: 'a1',
|
||||
info: { ...formData.value },
|
||||
});
|
||||
} else {
|
||||
} else if (selectRef.value && opMap.type === 'addson')
|
||||
selectRef.value['children'] = [
|
||||
{ key: '123', title: formData.value.name, info: { ...cloneDeep(formData.value) } },
|
||||
];
|
||||
else {
|
||||
console.log('ss');
|
||||
}
|
||||
formData.value = {};
|
||||
};
|
||||
const UserSure = () => {
|
||||
disabled2.value = !disabled2.value;
|
||||
opMap.fuc && opMap.fuc(formData2.value);
|
||||
console.log(formData2.value, 'formData2');
|
||||
userTreeData.value[0].children.push({
|
||||
title: formData2.value.departname,
|
||||
key: 'a2',
|
||||
});
|
||||
console.log(opMap.type, 'opMap.type');
|
||||
if (opMap.type === 'add') {
|
||||
userTreeData.value[0].children.push({
|
||||
title: formData2.value.departname,
|
||||
key: 'a2',
|
||||
info: { ...formData2.value },
|
||||
});
|
||||
} else if (selectRef2.value && opMap.type === 'addson')
|
||||
selectRef2.value['children'] = [
|
||||
{
|
||||
key: '123',
|
||||
title: formData2.value.departname,
|
||||
info: { ...cloneDeep(formData2.value) },
|
||||
},
|
||||
];
|
||||
else {
|
||||
console.log('ss');
|
||||
}
|
||||
formData2.value = {};
|
||||
};
|
||||
|
||||
const formSchema = reactive([
|
||||
{
|
||||
field: 'field111',
|
||||
component: 'NsChildForm',
|
||||
componentProps: {
|
||||
schemas: [
|
||||
{
|
||||
label: '部门名称',
|
||||
field: 'name',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
disabled: disabled,
|
||||
placeholder: '请输入部门名称',
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: false,
|
||||
message: '请输入部门名称',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '上级部门',
|
||||
field: 'department',
|
||||
component: 'NsSelect',
|
||||
componentProps: {
|
||||
disabled: disabled,
|
||||
placeholder: '请选择上级部门',
|
||||
options: [
|
||||
{
|
||||
label: '部门1',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '部门2',
|
||||
value: 2,
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '部门编码',
|
||||
field: 'code',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
disabled: disabled,
|
||||
placeholder: '请输入部门编码',
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: false,
|
||||
message: '请输入部门编码',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '排序',
|
||||
field: 'order',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
disabled: disabled,
|
||||
placeholder: '请输入排序',
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: false,
|
||||
message: '请输入排序',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
field: 'remark',
|
||||
label: '备注',
|
||||
component: 'NsTextarea',
|
||||
componentProps: {
|
||||
disabled: disabled,
|
||||
placeholder: '请输入',
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
]);
|
||||
const formSchema2 = reactive([
|
||||
{
|
||||
field: 'field111',
|
||||
component: 'NsChildForm',
|
||||
componentProps: {
|
||||
schemas: [
|
||||
{
|
||||
label: '角色名称',
|
||||
field: 'departname',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
disabled: disabled2,
|
||||
placeholder: '请输入角色名称',
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: false,
|
||||
message: '请输入角色名称',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '上级领导',
|
||||
field: 'department',
|
||||
component: 'NsSelect',
|
||||
componentProps: {
|
||||
disabled: disabled2,
|
||||
placeholder: '请选择上级领导',
|
||||
options: [
|
||||
{
|
||||
label: '领导1',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '领导2',
|
||||
value: 2,
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '节点编码',
|
||||
field: 'code',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
disabled: disabled2,
|
||||
placeholder: '请输入节点编码',
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: false,
|
||||
message: '请输入节点编码',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '是否部门领导',
|
||||
field: 'isleader',
|
||||
component: 'NsRadioGroup',
|
||||
componentProps: {
|
||||
disabled: disabled2,
|
||||
radioType: 'radio',
|
||||
options: [
|
||||
{ label: '是', value: 1 },
|
||||
{ label: '否', value: 2 },
|
||||
],
|
||||
rules: [
|
||||
{
|
||||
required: false,
|
||||
message: '请选择是否部门领导',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'remark',
|
||||
label: '备注',
|
||||
component: 'NsTextarea',
|
||||
componentProps: {
|
||||
disabled: disabled2,
|
||||
placeholder: '请输入',
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
]);
|
||||
return {
|
||||
disabled,
|
||||
disabled2,
|
||||
@@ -462,6 +353,7 @@
|
||||
userAdminTreeData,
|
||||
UsercheckedKeys,
|
||||
UserSelect,
|
||||
formRef,
|
||||
};
|
||||
},
|
||||
});
|
||||
|
Reference in New Issue
Block a user