Thu Nov 16 13:11:00 CST 2023 inscode

src/App.vue

@@ -3,12 +3,14 @@ import contractList from './component/contractManagement/contractList/contractLi
 import contractCategory from './component/contractManagement/contractCategory/contractCategory.vue'
 import register from './component/userLogin/login-dialog-button.vue'
 import announcementType from './component/enterpriseAnnouncement/announcementType.vue';
+import departments from './component/humanResources/department.vue'
 </script>
 
 <template>
   <!-- <contractCategory></contractCategory>
   <contract-list></contract-list> -->
   <announcementType></announcementType>
+  <departments></departments>
   <el-row>
     <el-col>后台管理平台</el-col>
   </el-row>

src/api/api.ts

 import request from "./index";
 import type { IParams } from './index';
-import { CONTRACT_CATEGORY, CONTRACT_LIST, CONTRACT_LIST_Type, DEPT_MENU, LOGIN, TABLE_ANNOUNCEMENT } from "./path";
+import { CONTRACT_CATEGORY, CONTRACT_LIST, CONTRACT_LIST_Type, DEPT_MENU, HUMAN_RESOURCES_DEPARTMENT, LOGIN, TABLE_ANNOUNCEMENT } from "./path";
 import type { AxiosResponse } from "axios";
 
 
@@ -45,4 +45,8 @@ export function getContractList(body: IParams): Promise<AxiosResponse<IContractC
 
 export function getContractListType(): Promise<AxiosResponse<any>>{
     return request.get(CONTRACT_LIST_Type, {});
+}
+
+export function getHumanResourcesDepartment(): Promise<AxiosResponse<any>>{
+    return request.get(HUMAN_RESOURCES_DEPARTMENT, {});
 }
\ No newline at end of file

src/api/path.ts

@@ -9,4 +9,6 @@ export const TABLE_ANNOUNCEMENT = baseURL + "/table/announcement";
 export const CONTRACT_CATEGORY = baseURL + "/contract/category";
 
 export const CONTRACT_LIST = baseURL + "/contract/list";
-export const CONTRACT_LIST_Type = CONTRACT_LIST + '/Type';
+export const CONTRACT_LIST_Type = CONTRACT_LIST + '/Type';
\ No newline at end of file
+
+export const HUMAN_RESOURCES_DEPARTMENT = baseURL + '/humanResources/department';
\ No newline at end of file

src/component/humanResources/department.vue

@@ -5,41 +5,19 @@ import addDownload from '@/component/main/header/add_download/addDownload.vue';
 import buttoner from '@/component/main/header/add_download/button.vue';
 import downloadItem from '@/component/main/header/add_download/downloadItem.vue';
 import ejectDialog from '@/component/main/ejectDialog.vue';
-import { ref, provide } from 'vue';
+import { ref, provide, onMounted } from 'vue';
+import { getHumanResourcesDepartment } from '@/api/api';
+import { FlatToTree } from '@/util/toTree';
+import { deepClone } from '@/util/deepCode';
 const addText = ref('添加分类');
 
 let tableData = ref([
-  {
-    id: 1,
-    sort: 1,
-    typeName: "普通公告",
-    parent: 0,
-    state: true,
-  },
-  {
-    id: 2,
-    sort: 2,
-    typeName: "紧急公告",
-    parent: 0,
-    state: true,
-    children: [
-      {
-        id: 6,
-        sort: 0,
-        typeName: "紧急公告",
-        state: true,
-        parent: 2,
-      }
-    ]
-  },
-  {
-    id: 3,
-    sort: 3,
-    typeName: "防疫公告",
-    state: true,
-    parent: 0,
-  },
 ])
+onMounted(async()=>{
+  let data = (await getHumanResourcesDepartment()).data.data.data;
+  console.log(FlatToTree(data));
+  tableData.value = FlatToTree(data).tree;
+})
 
 let tableType = ref([
   {
@@ -57,22 +35,29 @@ let tableType = ref([
     align: "center"
   },
   {
-    name: '分类名称',
-    type: "typeName",
+    name: '上级ID',
+    type: "parentID",
     width: "auto",
     isSort: false,
     align: "left"
   },
   {
-    name: '父级id',
-    type: "parent",
+    name: '部门名称',
+    type: "departmentName",
     width: "80px",
     isSort: false,
     align: "center"
   },
   {
-    name: '状态',
-    type: "state",
+    name: '部门负责人',
+    type: "departmentHead",
+    width: "100px",
+    isSort: false,
+    align: "center"
+  },
+  {
+    name: '部门电话',
+    type: "departmentPhone",
     width: "100px",
     isSort: false,
     align: "center"

src/util/deepCode.js

+export function deepClone(target) {
+    const map = new WeakMap()
+    
+    function isObject(target) {
+        return (typeof target === 'object' && target ) || typeof target === 'function'
+    }
+
+    function clone(data) {
+        if (!isObject(data)) {
+            return data
+        }
+        if ([Date, RegExp].includes(data.constructor)) {
+            return new data.constructor(data)
+        }
+        if (typeof data === 'function') {
+            return new Function('return ' + data.toString())()
+        }
+        const exist = map.get(data)
+        if (exist) {
+            return exist
+        }
+        if (data instanceof Map) {
+            const result = new Map()
+            map.set(data, result)
+            data.forEach((val, key) => {
+                if (isObject(val)) {
+                    result.set(key, clone(val))
+                } else {
+                    result.set(key, val)
+                }
+            })
+            return result
+        }
+        if (data instanceof Set) {
+            const result = new Set()
+            map.set(data, result)
+            data.forEach(val => {
+                if (isObject(val)) {
+                    result.add(clone(val))
+                } else {
+                    result.add(val)
+                }
+            })
+            return result
+        }
+        const keys = Reflect.ownKeys(data)
+        const allDesc = Object.getOwnPropertyDescriptors(data)
+        const result = Object.create(Object.getPrototypeOf(data), allDesc)
+        map.set(data, result)
+        keys.forEach(key => {
+            const val = data[key]
+            if (isObject(val)) {
+                result[key] = clone(val)
+            } else {
+                result[key] = val
+            }
+        })
+        return result
+    }
+
+    return clone(target)
+}

src/util/toTree.js

-const treeData = [
-    {
-        id: 1,
-        title: "课程1",
-        children: [
-            { id: 4, title: "课程1-1" },
-            {
-                id: 5,
-                title: "课程1-2",
-                children: [
-                    { id: 6, title: "课程1-2-1" },
-                    { id: 7, title: "课程1-2-2" },
-                ],
-            },
-        ],
-    },
-    { id: 2, title: "课程2" },
-    { id: 3, title: "课程3" },
-];
+// const treeData = [
+//     {
+//         id: 1,
+//         title: "课程1",
+//         children: [
+//             { id: 4, title: "课程1-1" },
+//             {
+//                 id: 5,
+//                 title: "课程1-2",
+//                 children: [
+//                     { id: 6, title: "课程1-2-1" },
+//                     { id: 7, title: "课程1-2-2" },
+//                 ],
+//             },
+//         ],
+//     },
+//     { id: 2, title: "课程2" },
+//     { id: 3, title: "课程3" },
+// ];
 const flatData = [
-    { id: 1, parent: 0, title: "课程1" },
-    { id: 4, parent: 1, title: "课程1-1" },
-    { id: 5, parent: 1, title: "课程1-2" },
-    { id: 6, parent: 5, title: "课程1-2-1" },
-    { id: 7, parent: 5, title: "课程1-2-2" },
-    { id: 2, parent: 0, title: "课程2" },
-    { id: 3, parent: 0, title: "课程3" },
+    { id: 1, parentID: 0, title: "课程1" },
+    { id: 4, parentID: 1, title: "课程1-1" },
+    { id: 5, parentID: 1, title: "课程1-2" },
+    { id: 6, parentID: 5, title: "课程1-2-1" },
+    { id: 7, parentID: 5, title: "课程1-2-2" },
+    { id: 2, parentID: 0, title: "课程2" },
+    { id: 3, parentID: 0, title: "课程3" },
 ]
 
 export function TreeToFlat(data) {
@@ -42,20 +42,20 @@ export function TreeToFlat(data) {
 }
 // console.log(TreeToFlat(treeData), '输出为扁平化结构')
 
-function FlatToTree(arr) {
+export function FlatToTree(arr) {
     const map = arr.reduce((acc, val) => {
-        acc[val.id] = val
+        acc[Number(val.id)] = val
         return acc
     }, {})
     const tree = []
     arr.forEach(region => {
-        if (region.parent) {
-            const parent = map[region.parent]
-            if (!parent.children) {
-                parent.children = [region]
+        if (Number(region.parentID)) {
+            const parentID = map[Number(region.parentID)];
+            if (!parentID?.children) {
+                parentID.children = [region]
             }
             else {
-                parent.children.push(region)
+                parentID.children.push(region)
             }
         }
         else {