职位管理

src/api/sys/zhiwei.ts

@@ -0,0 +1,62 @@
+import { defHttp } from '/@/utils/http/axios';
+import tool from '/@/utils/Tool';
+
+enum Api {
+    GetChildDepartment = '/user-center/department/getChildDepartment',
+    GetPositionInfoByDepartmentId = '/user-center/position/getPositionInfoByDepartmentId',
+    EditPositionInfoById = '/user-center/position/editPositionInfoById',
+    DeletePositionInfoById = '/user-center/position/deletePositionInfoById'
+}
+
+/**
+ * @description: 获取机构列表
+ */
+
+export const structureList = () => {
+    return new Promise<void>((resolve, reject) => {
+        defHttp.post({ url: Api.GetChildDepartment }).then((res) => {
+            var a = tool.structureTree([res.datas]);
+            console.log(a)
+            resolve(a)
+        })
+    })
+};
+
+/**
+ * @description: 根据机构id获取下属职位列表
+ */
+export const getPostsList = (params) => {
+    const formData = new FormData();
+    Object.keys(params).forEach((key) => formData.append(key, params[key]))
+    return new Promise<void>((resolve, reject) => {
+        defHttp.post({ url: Api.GetPositionInfoByDepartmentId, params: formData }).then((res) => {
+            resolve(res)
+        })
+    })
+};
+
+/**
+ * @description: 新增、通过ID修改职位
+ */
+export const savePosts = (params) => {
+    const formData = new FormData();
+    Object.keys(params).forEach((key) => formData.append(key, params[key]))
+    return new Promise<void>((resolve, reject) => {
+        defHttp.post({ url: Api.EditPositionInfoById, params: formData }).then((res) => {
+            resolve(res)
+        })
+    })
+};
+
+/**
+* @description: 通过ID删除职位
+*/
+export const delPosts = (params) => {
+    const formData = new FormData();
+    Object.keys(params).forEach((key) => formData.append(key, params[key]))
+    return new Promise<void>((resolve, reject) => {
+        defHttp.post({ url: Api.DeletePositionInfoById, params: formData }).then((res) => {
+            resolve(res)
+        })
+    })
+};

src/views/systemAdmin/system/position/index.vue

@@ -31,7 +31,8 @@
                 </div>
             </div>
         </div>
-        <PositionDrawer :formData="formData" :drawerTitle="drawerTitle" @onSubmit="onSubmit" ref="drawerRef"></PositionDrawer>
+        <PositionDrawer :formData="formData" :drawerTitle="drawerTitle" @onSubmit="onSubmit" ref="drawerRef">
+        </PositionDrawer>
     </div>
 </template>
 
@@ -70,7 +71,7 @@ export default defineComponent({
                 duty: '',
                 sort: 0,
             },
-            drawerTitle:'新增岗位'
+            drawerTitle: '新增岗位'
         });
         /**
          * 点击树节点触发
@@ -132,9 +133,15 @@ export default defineComponent({
             } else if (data.posts.currentId === "") {
                 message.error('请先选择职位！')
             } else {
-                data.formData.orgid = data.currentNode
-                data.formData.oabaseid = data.posts.currentId
-                data.formData.sort = data.position.data.length + 1
+                data.formData = {
+                    id: "",
+                    orgid: data.currentNode,
+                    oabaseid: data.posts.currentId,
+                    name: "",
+                    duty: "",
+                    sort: data.position.data.length + 1,
+                }
+                data.drawerTitle = '新增岗位'
                 drawerRef.value.showDrawer()
             }
         }
@@ -171,14 +178,14 @@ export default defineComponent({
                 message.error('请先选择岗位！')
             } else {
                 let params = {
-                    oabaseid:data.posts.currentId,
-                    id:data.position.currentId
+                    oabaseid: data.posts.currentId,
+                    id: data.position.currentId
                 }
-                delPosition(params).then(res=>{
-                    if(res.datas===1){
+                delPosition(params).then(res => {
+                    if (res.datas === 1) {
                         message.success('操作成功')
                         onSubmit(true)
-                    }else{
+                    } else {
                         message.error('操作失败')
                     }
                 })
@@ -225,7 +232,7 @@ export default defineComponent({
         justify-content: space-between;
         align-items: center;
 
-        .position-title{
+        .position-title {
             font-size: 16px;
             font-weight: 500;
             margin-left: 20px;

src/views/systemAdmin/system/zhiwei/RoleDrawer.vue

@@ -1,225 +0,0 @@
-<template>
-  <BasicDrawer v-bind="$attrs" @register="registerDrawer" showFooter :title="getTitle" width="500px" @ok="handleSubmit">
-    <BasicForm @register="registerForm">
-      <template #menu>
-        <Spin :spinning="spinning"></Spin>
-      </template>
-    </BasicForm>
-  </BasicDrawer>
-</template>
-<script lang="ts">
-import { defineComponent, ref, computed, unref, nextTick } from 'vue';
-import { BasicForm, useForm } from '/@/components/Form/index';
-import { formSchema, KeysTypeEnum, RoleMenuDictEnum } from './role.data';
-import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
-import { BasicTree, TreeItem } from '/@/components/Tree';
-import { useMessage } from '/@/hooks/web/useMessage';
-const { t } = useI18n(); //加载国际化
-// 加载菜单数据
-import { getMenuList } from '/@/api/sys/menu';
-import { useI18n } from '/@/hooks/web/useI18n';
-import { MenuRecord } from '/@/api/sys/model/menuModel';
-import { saveOrUpdateRoleInfoWithMenu } from '/@/api/system/system';
-import { findDictItemByCode } from '/@/api/system/dict';
-import { RoleEnum } from '/@/enums/roleEnum';
-import { Spin } from 'ant-design-vue';
-import { useUserStore } from '/@/store/modules/user';
-import { session } from '/@/utils/Memory';
-import { v4 as uuidv4 } from 'uuid';
-
-
-type TreeData = MenuRecord & TreeItem;
-
-export default defineComponent({
-  name: 'RoleDrawer',
-  components: { BasicDrawer, BasicForm, BasicTree, Spin },
-  emits: ['success', 'register'],
-  setup(_, { emit }) {
-    const isUpdate = ref<boolean>(true);
-    const treeData = ref<TreeData[]>([]);
-    const roleMenus = ref<string[]>([]);
-    const roleId = ref<string>('');
-    const checked = ref<string[]>([]); //需要选中的节点
-    const spinning = ref(false);
-    var nowRole = null;
-
-    const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
-      labelWidth: 100,
-      schemas: formSchema,
-      showActionButtonGroup: false,
-    });
-
-    const transformName = (data: TreeData[]) => {
-      return data.map((item) => {
-        item.name = t(item.name);
-        if (item.children && item.children.length) {
-          item.children = transformName(item.children as unknown as TreeData[]);
-        }
-        return item;
-      });
-    };
-
-    const userStore = useUserStore();
-    const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
-      resetFields();
-      roleId.value = '';
-      // 在打开弹窗时清除所有选择的菜单
-      isUpdate.value = data.isUpdate;
-      const roleType = data?.record?.roleType || userStore.getRoleList.at(0);
-
-      try {
-        spinning.value = true;
-        // 需要在setFieldsValue之前先填充treeData，否则Tree组件可能会报key not exist警告
-
-        if (!unref(treeData).length) {
-          // 获取全部的菜单
-          const menuListModel = await getMenuList();
-          treeData.value = transformName(menuListModel as unknown as TreeData[]);
-        }
-
-        const keys = await getPermissionByRole(roleType);
-        const { keyType } = RoleMenuDictEnum[roleType];
-        treeData.value = getPermissionTreeData(
-          unref(treeData) as unknown as TreeData[],
-          keys,
-          keyType
-        );
-        // 更新
-        if (unref(isUpdate)) {
-          checked.value = [];
-          roleId.value = data.record.id;
-          nowRole = data.record;
-          setFieldsValue(data.record);
-        } else {
-        }
-      } catch (error) {
-        throw error;
-      } finally {
-        spinning.value = false;
-      }
-    });
-
-    const getTitle = computed(() => (!unref(isUpdate) ? '新增角色' : '编辑角色'));
-
-    async function handleSubmit() {
-      setDrawerProps({ confirmLoading: true });
-      const { createMessage } = useMessage();
-      try {
-        const values = await validate();
-        const req = {
-          groupName: values.groupName,
-          sort: values.sort
-        };
-        if (unref(isUpdate)) {
-          if (nowRole) {
-            req.updateuser = session.getItem("userInfo").EMPLOYEE.EMPLOYEE_ID;
-            req.groupid = nowRole.groupid;
-          }
-        } else {
-          req.groupid = uuidv4()
-        }
-        saveOrUpdateRoleInfoWithMenu(req).then(() => {
-          closeDrawer();
-          emit('success');
-          nowRole = null;
-          createMessage.success(`${unref(isUpdate) ? '编辑' : '新增'}成功`);
-        });
-      } finally {
-        setTimeout(() => {
-          setDrawerProps({ confirmLoading: false });
-        }, 300);
-      }
-    }
-
-    const getPermissionByRole = async (roleType: RoleEnum) => {
-      try {
-        const { key } = RoleMenuDictEnum[roleType];
-        const res = await findDictItemByCode({ dictCode: key });
-        return res.map((item) => item.itemValue);
-      } catch (error) { }
-      return [];
-    };
-
-    const getPermissionTreeData = (
-      data: MenuRecord[],
-      permissionKeys: string[],
-      keysType: KeysTypeEnum
-    ) => {
-      const setDisabled = (data: MenuRecord[], flag: boolean) => {
-        return data.map((item) => {
-          item.name = t(item.name);
-          if (item.children && item.children.length) {
-            item.children = setDisabled(item.children, flag);
-          }
-          return {
-            ...item,
-            disabled: flag,
-            icon: item.meta.icon,
-          } as TreeData;
-        });
-      };
-
-      const permissionCompare = (
-        data: MenuRecord[],
-        permissionKeys: string[],
-        keysType: KeysTypeEnum
-      ) => {
-        return data.map((item) => {
-          item.name = t(item.name);
-          const findFlag = permissionKeys.includes(item.permission);
-          if (findFlag) item.isDictCompareDisabled = true;
-          const disabledFlag = keysType === KeysTypeEnum.DISABLED ? findFlag : !findFlag;
-          item.disabled = disabledFlag;
-
-          if (item.isDictCompareDisabled && item.children && item.children.length) {
-            setDisabled(item.children, disabledFlag);
-          } else {
-            if (item.children && item.children.length) {
-              item.children = permissionCompare(item.children, permissionKeys, keysType);
-              item.disabled = item.children.every((temp) => temp.disabled);
-            }
-          }
-          return {
-            ...item,
-            icon: item.meta.icon,
-          } as TreeData;
-        });
-      };
-
-      const result = permissionCompare(data, permissionKeys, keysType).map((item) => {
-        if (item.children && item.children.length) {
-          const rootDisabledFlag = item.children.every((temp) => temp.disabled);
-          item.disabled = rootDisabledFlag;
-        }
-        return item;
-      });
-
-      return result;
-    };
-
-    return {
-      spinning,
-      registerDrawer,
-      registerForm,
-      getTitle,
-      handleSubmit,
-      treeData,
-      roleMenus,
-    };
-  },
-});
-</script>
-
-<style scoped lang="less">
-:deep(.vben-basic-tree) {
-  width: 100% !important;
-}
-
-:deep(.is-unflod) {
-  display: none !important;
-}
-
-:deep(.is-flod) {
-  display: none !important;
-}
-</style>

src/views/systemAdmin/system/zhiwei/ZhiweiDrawer.vue

@@ -0,0 +1,144 @@
+<template>
+    <a-drawer :title="title" :width="540" :visible="open" :body-style="{ paddingBottom: '80px' }"
+        :footer-style="{ textAlign: 'right' }" @close="onClose">
+        <a-form ref="formRef" :model="form" :rules="rules" :label-col="labelCol" :wrapper-col="wrapperCol">
+            <!-- 名称 -->
+            <a-form-item label="职位名称" name="departName">
+                <a-input v-model:value="form.departName" style="width: 100%" placeholder="请输入名称" />
+            </a-form-item>
+            <!-- 排序 -->
+            <a-form-item label="排序" name="orderId">
+                <a-input v-model:value="form.orderId" style="width: 100%" placeholder="请输入序号" />
+            </a-form-item>
+        </a-form>
+        <div :style="{
+            position: 'absolute',
+            right: 0,
+            bottom: 0,
+            width: '100%',
+            borderTop: '1px solid #e9e9e9',
+            padding: '10px 16px',
+            background: '#fff',
+            textAlign: 'right',
+            zIndex: 1,
+        }">
+            <a-button style="margin-right: 8px" @click="onClose">取消</a-button>
+            <a-button type="primary" @click="onSubmit">确定</a-button>
+        </div>
+    </a-drawer>
+</template>
+<script>
+import { defineComponent, reactive, ref, onMounted, watch } from 'vue';
+import { message } from 'ant-design-vue';
+import { v4 as uuidv4 } from 'uuid';
+import { savePosts } from '/@/api/sys/zhiwei';
+
+const props = {
+    formData: {
+        type: Object,
+        default: () => {
+            return {}
+        }
+    },
+    drawerTitle: {
+        type: String,
+        default: "新增职位"
+    }
+}
+export default defineComponent({
+    name: 'positionDrawer',
+    components: {},
+    props,
+    setup(props, { emit }) {
+        const form = reactive({
+            departid: "",
+            parentId: "",
+            departName: "",
+            orderId: 0,
+            orgId: ""
+        });
+        const rules = {
+            departName: [{
+                required: true,
+                message: '请输入职位名称',
+                trigger: 'blur'
+            }],
+            orderId: [{
+                required: true,
+                message: '请输入序号',
+                trigger: 'change'
+            }]
+        };
+        const title = ref(props.drawerTitle)
+        const open = ref(false);
+        const formRef = ref()
+
+        onMounted(() => {
+            if (Object.keys(props.formData).length) {
+                for (let key in form) {
+                    form[key] = props.formData[key]
+                }
+            }
+        })
+        watch(
+            () => [props.formData, props.drawerTitle],
+            ([newF, newD]) => {
+                for (let key in form) {
+                    form[key] = props.formData[key]
+                }
+                title.value = newD
+            },
+            {
+                immediate: true,
+                deep: true
+            }
+        )
+        const showDrawer = () => {
+            open.value = true;
+        };
+        const onClose = () => {
+            open.value = false;
+            resetForm()
+        };
+        const onSubmit = () => {
+            formRef.value.validate().then(() => {
+                //此处调用新增
+                if (title.value === '新增职位') {
+                    form.departid = uuidv4()
+                }else{
+                    form.orgId = null
+                }
+                form.orderId = parseInt(form.orderId)
+                savePosts(form).then(res => {
+                    if (res.datas === 1) {
+                        message.success('操作成功')
+                        emit('onSubmit', true)
+                    } else {
+                        message.error('操作失败')
+                        emit('onSubmit', false)
+                    }
+                    onClose()
+                })
+            }).catch((error) => {
+                console.log('error', error);
+            });
+        };
+        const resetForm = () => {
+            formRef.value.resetFields();
+        };
+        return {
+            form,
+            rules,
+            title,
+            open,
+            formRef,
+            labelCol: { span: 6 },
+            wrapperCol: { span: 18 },
+            showDrawer,
+            onClose,
+            onSubmit,
+            resetForm
+        };
+    },
+});
+</script>

src/views/systemAdmin/system/zhiwei/index.vue

@@ -1,147 +1,270 @@
 <template>
-  <div>
-    <BasicTable :rowSelection="{ type: 'checkbox' }" @register="registerTable" :clickToRowSelect="false">
-      <template #toolbar>
-        <Authority>
-          <a-button type="primary" @click="handleCreate">新增角色</a-button>
-        </Authority>
-        <Authority>
-          <Popconfirm title="您确定要批量删除数据" ok-text="确定" cancel-text="取消" @confirm="handleDeleteOrBatchDelete(null)">
-            <a-button type="primary" color="error" :disabled="hasBatchDelete"> 批量删除 </a-button>
-          </Popconfirm>
-        </Authority>
-      </template>
-      <template #status="{ record }">
-        <Switch :checked="record.status === 1" :loading="record.pendingStatus" checkedChildren="启用" unCheckedChildren="禁用"
-          @change="(checked: boolean) => statusChange(checked, record)" />
-      </template>
-      <template #action="{ record }">
-        <TableAction :actions="[
-          {
-            label: '编辑',
-            icon: 'clarity:note-edit-line',
-            onClick: handleEdit.bind(null, record),
-          },
-          {
-            label: '删除',
-            icon: 'ant-design:delete-outlined',
-            color: 'error',
-            ifShow: record.roleType != RoleEnum.SYS_ADMIN,
-            popConfirm: {
-              title: '是否确认删除',
-              confirm: handleDeleteOrBatchDelete.bind(null, record),
-            },
-          },
-        ]" />
-      </template>
-    </BasicTable>
-    <RoleDrawer @register="registerDrawer" @success="handleSuccess" />
-  </div>
+    <div class="p-4">
+        <div class="zhiwei-header">
+            <div class="zhiwei-title">职位管理</div>
+            <div class="handle-btns">
+                <a-button class="btn" type="primary" @click="addHandle">新增</a-button>
+                <a-button class="btn" @click="editHandle">修改</a-button>
+                <a-button class="btn" danger @click="delHandle">删除</a-button>
+            </div>
+        </div>
+        <div class="zhiwei-body">
+            <div class="structure-tree list-items">
+                <div class="item-title">部门列表</div>
+                <a-tree :replaceFields="replaceFields" :treeData="treeData" v-if="treeData" @select="nodeSelect"></a-tree>
+            </div>
+            <div class="posts-list list-items">
+                <div class="item-title">职位列表</div>
+                <div class="posts-box item-box">
+                    <div class="posts item" v-for="(item, index) in posts.data" :key="index"
+                        @click="chooseHandle(item, 'posts')">
+                        <span :class="{ 'chosed': item.departid === posts.currentId }">{{ item.departName }}</span>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <ZhiweiDrawer :formData="formData" :drawerTitle="drawerTitle" @onSubmit="onSubmit" ref="drawerRef"></ZhiweiDrawer>
+    </div>
 </template>
-<script lang="ts">
-import { defineComponent, nextTick } from 'vue';
-import { BasicTable, useTable, TableAction } from '/@/components/Table';
-import { delRole, getRoleListByPage, setRoleStatus } from '/@/api/system/system';
-import { useDrawer } from '/@/components/Drawer';
-import RoleDrawer from './RoleDrawer.vue';
-import { columns, searchFormSchema } from './role.data';
-import { RoleEnum } from '/@/enums/roleEnum';
-import { Authority } from '/@/components/Authority';
-import { useBatchDelete } from '/@/hooks/web/useBatchDelete';
-import { useMessage } from '/@/hooks/web/useMessage';
-import { Switch, Popconfirm } from 'ant-design-vue';
-import { roleList } from '/@/api/sys/user';
 
-export default defineComponent({
-  name: 'RoleManagement',
-  components: { BasicTable, RoleDrawer, TableAction, Authority, Switch, Popconfirm },
-  setup() {
-    const [registerDrawer, { openDrawer }] = useDrawer();
-    function handleSuccess() {
-      reload();
-    }
-    const [registerTable, { setProps, reload, setSelectedRowKeys }] = useTable({
-      title: '角色列表',
-      api: roleList,
-      columns,
-      formConfig: {
-        labelWidth: 120,
-        schemas: searchFormSchema,
-      },
-      useSearchForm: true,
-      showTableSetting: true,
-      bordered: true,
-      showIndexColumn: false,
-      actionColumn: {
-        width: 200,
-        title: '操作',
-        dataIndex: 'action',
-        slots: { customRender: 'action' },
-        fixed: 'right',
-      },
-    });
-    const { hasBatchDelete, handleDeleteOrBatchDelete, selectionOptions, resetSelectedRowKeys } =
-      useBatchDelete(delRole, handleSuccess, setProps);
-    selectionOptions.rowSelection.getCheckboxProps = (record: Recordable) => {
-      // Demo:status为1的选择框禁用
-      if (record.status === 1) {
-        return { disabled: true };
-      } else {
-        return { disabled: false };
-      }
-    };
-    nextTick(() => {
-      setProps(selectionOptions);
-    });
-
-    function handleCreate() {
-      openDrawer(true, {
-        isUpdate: false,
-      });
-    }
+<script>
+import { defineComponent, reactive, ref, toRefs, computed, onMounted, watch } from 'vue';
+import ZhiweiDrawer from './ZhiweiDrawer.vue';
+import { structureList, getPostsList, delPosts } from '/@/api/sys/zhiwei';
+import { message } from 'ant-design-vue';
 
-    function handleEdit(record: Recordable) {
-      openDrawer(true, {
-        record,
-        isUpdate: true,
-      });
-      console.log(record)
-    }
-
-    const statusChange = async (checked, record) => {
-      setProps({
-        loading: true,
-      });
-      setSelectedRowKeys([]);
-      resetSelectedRowKeys();
-      const newStatus = checked ? 1 : 0;
-      const { createMessage } = useMessage();
-      try {
-        await setRoleStatus(record.id, newStatus);
-        if (newStatus) {
-          createMessage.success(`启用成功`);
-        } else {
-          createMessage.success('禁用成功');
+export default defineComponent({
+    name: 'zhiwei',
+    components: { ZhiweiDrawer },
+    setup(props, { emit }) {
+        const drawerRef = ref(null)
+        const data = reactive({
+            replaceFields: {
+                children: 'children',
+                title: 'name',
+                key: 'id'
+            },
+            treeData: [],//单位列表树
+            currentNode: "",//当前选中的树节点
+            posts: {
+                currentId: "",
+                data: []
+            },//职位数据
+            formData: {
+                departid: "",
+                parentId: "",
+                departName: "",
+                orderId: 0,
+                orgId: ""
+            },
+            drawerTitle: '新增职位'
+        });
+        /**
+         * 点击树节点触发
+         */
+        const nodeSelect = (selectkey, { selectedNodes, node }) => {
+            if (node.dataRef.departid === data.currentNode) {
+                return;
+            } else {
+                data.currentNode = node.dataRef.departid
+            }
+            resetDatas()
+            let params = {
+                departmentId: node.dataRef.departid
+            }
+            getPostsList(params).then(res => {
+                if (res.datas) {
+                    data.posts.data = res.datas
+                }
+            })
+        };
+        const resetDatas = () => {
+            data.posts.data = []
+            data.posts.currentId = ""
+        }
+        const chooseHandle = (item) => {
+            if (data.posts.currentId === item.departid) {
+                return;
+            }
+            data.posts.currentId = item.departid
         }
-      } finally {
-        setProps({
-          loading: false,
+        onMounted(() => {
+            structureList().then(res => {
+                res.length && (data.treeData = res)
+            })
         });
-        reload();
-      }
-    };
-
-    return {
-      registerTable,
-      registerDrawer,
-      handleCreate,
-      handleEdit,
-      handleSuccess,
-      RoleEnum,
-      hasBatchDelete,
-      handleDeleteOrBatchDelete,
-      statusChange,
-    };
-  },
+        /**
+         * 对职位的操作
+         */
+        const addHandle = () => {
+            if (data.currentNode === "") {
+                message.error('请先选择机构！')
+            } else {
+                data.formData = {
+                    departid: "",
+                    parentId: "",
+                    departName: "",
+                    orderId: data.posts.data.length + 1,
+                    orgId: data.currentNode
+                }
+                data.drawerTitle = '新增职位'
+                drawerRef.value.showDrawer()
+            }
+        }
+        const editHandle = () => {
+            if (data.currentNode === "") {
+                message.error('请先选择机构！')
+            } else if (data.posts.currentId === "") {
+                message.error('请先选择职位！')
+            } else {
+                data.posts.data.forEach(item => {
+                    if (item.departid === data.posts.currentId) {
+                        data.formData = {
+                            departid: data.posts.currentId,
+                            parentId: item.parentId,
+                            departName: item.departName,
+                            orderId: item.orderId
+                        }
+                        data.drawerTitle = '修改职位'
+                        drawerRef.value.showDrawer()
+                    }
+                })
+            }
+        }
+        const delHandle = () => {
+            if (data.currentNode === "") {
+                message.error('请先选择机构！')
+            } else if (data.posts.currentId === "") {
+                message.error('请先选择职位！')
+            } else {
+                let params = {
+                    orgId: data.currentNode,
+                    departid: data.posts.currentId
+                }
+                delPosts(params).then(res => {
+                    if (res.datas === 1) {
+                        message.success('操作成功')
+                        onSubmit(true)
+                    } else {
+                        message.error('操作失败')
+                    }
+                })
+            }
+        }
+        const onSubmit = (e) => {
+            if (e) {
+                data.posts.data = []
+                data.posts.currentId = ""
+                let params = {
+                    departmentId: data.currentNode
+                }
+                getPostsList(params).then(res => {
+                    if (res.datas) {
+                        data.posts.data = res.datas
+                    }
+                })
+            }
+        }
+        return {
+            drawerRef,
+            ...toRefs(data),
+            nodeSelect,
+            chooseHandle,
+            addHandle,
+            editHandle,
+            delHandle,
+            onSubmit
+        };
+    },
 });
 </script>
+
+<style lang="less" scoped>
+.p-4 {
+    height: 100%;
+
+    .zhiwei-header {
+        padding: 10px;
+        width: 100%;
+        height: 70px;
+        background-color: #fff;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+
+        .zhiwei-title {
+            font-size: 16px;
+            font-weight: 500;
+            margin-left: 20px;
+            user-select: none;
+        }
+
+        .handle-btns {
+            margin-right: 20px;
+            display: flex;
+
+            .btn {
+                margin-right: 10px;
+
+                &:last-child {
+                    margin-right: 0;
+                }
+            }
+        }
+    }
+
+    .zhiwei-body {
+        margin-top: 20px;
+        width: 100%;
+        // height: 800px;
+        height: calc(100% - 90px);
+        display: flex;
+
+        .list-items {
+            margin-right: 20px;
+            padding: 10px;
+            height: 100%;
+            overflow: auto;
+            flex: 1;
+            background-color: #fff;
+
+            &:last-child {
+                margin-right: 0;
+            }
+
+            .item-title {
+                padding-left: 10px;
+                height: 40px;
+                line-height: 40px;
+                font-size: 16px;
+                background-color: #9eafe7;
+            }
+
+            .item-box {
+                margin-top: 7px;
+
+                .item {
+                    width: fit-content;
+                    height: 32px;
+                    display: flex;
+                    align-items: center;
+
+                    span {
+                        padding: 4px;
+                        cursor: pointer;
+                        user-select: none;
+
+                        &:hover {
+                            background-color: #f5f5f5;
+                        }
+                    }
+
+                    .chosed {
+                        background-color: #dbedff;
+                    }
+                }
+            }
+        }
+    }
+}
+</style>

src/views/systemAdmin/system/zhiwei/role.data.ts

@@ -1,90 +0,0 @@
-import { BasicColumn } from '/@/components/Table';
-import { FormSchema } from '/@/components/Table';
-import { RoleEnum } from '/@/enums/roleEnum';
-
-export enum KeysTypeEnum {
-  DISABLED = 'disabled',
-  ENABLED = 'enabled',
-}
-
-export const RoleMenuDictEnum: Recordable<{ key: string; keyType: KeysTypeEnum }> = {
-  [RoleEnum.PLATFORM_ADMIN]: { key: 'enabled_platform_admin_auth', keyType: KeysTypeEnum.ENABLED },
-  [RoleEnum.SYS_ADMIN]: { key: 'enabled_sysadmin_auth', keyType: KeysTypeEnum.ENABLED },
-  [RoleEnum.TENANT_ADMIN]: { key: 'disabled_tenant_auth', keyType: KeysTypeEnum.DISABLED },
-  [RoleEnum.CUSTOMER_USER]: { key: 'disabled_tenant_auth', keyType: KeysTypeEnum.DISABLED },
-};
-
-export const columns: BasicColumn[] = [
-  {
-    title: '角色名称',
-    dataIndex: 'groupName',
-    width: 200,
-  },
-  {
-    title: '角色Code',
-    dataIndex: 'groupid',
-    width: 200,
-  },
-  {
-    title: '类型',
-    dataIndex: 'groupType',
-    width: 120,
-  },
-
-  {
-    title: '备注',
-    dataIndex: 'memo',
-    width: 240,
-  },
-  {
-    title: '排序',
-    dataIndex: 'sort',
-    width: 180,
-  },
-];
-
-export const searchFormSchema: FormSchema[] = [
-  {
-    field: 'roleName',
-    label: '角色名称',
-    component: 'Input',
-    colProps: { span: 6 },
-    componentProps: {
-      maxLength: 255,
-    },
-  },
-  {
-    field: 'status',
-    label: '状态',
-    component: 'Select',
-    componentProps: {
-      options: [
-        { label: '启用', value: 1 },
-        { label: '停用', value: 0 },
-      ],
-    },
-    colProps: { span: 6 },
-  },
-];
-
-export const formSchema: FormSchema[] = [
-  {
-    field: 'groupName',
-    label: '角色名称',
-    required: true,
-    component: 'Input',
-    componentProps: {
-      maxLength: 255,
-      placeholder: '请输入角色名称',
-    },
-  },
-  {
-    label: '排序',
-    field: 'sort',
-    component: 'Input',
-    componentProps: {
-      maxLength: 255,
-      placeholder: '请输入排序',
-    },
-  }
-];