feat: save

src/util/index.ts

@@ -253,3 +253,5 @@ export const dateFormat = (date: Date, fmt: string) => {
   }
   return fmt;
 };
+
+export * from './tree'

src/util/tree.ts

@@ -0,0 +1,17 @@
+const traverse: any = (arr: any[], parentId: number, idName: string) =>
+    arr.filter(node => node.parentId === parentId)
+        .reduce((result, current) => [
+            ...result,
+            {
+                ...current,
+                children: traverse(arr, current[idName])
+            }
+        ], [])
+
+export const parseTree = (arr: any[], idName: string = "id") =>
+    arr.sort(({ order }) => order)
+        .filter(({ parentId }) => !parentId)
+        .map(node => ({
+            ...node,
+            children: traverse(arr, node[idName], idName)
+        }))

src/view/organization.vue

@@ -25,7 +25,7 @@
     </div>
 
     <div class="relics-content">
-      <el-table :data="relicsArray" border>
+      <el-table default-expand-all row-key="orgId" :data="relicsArray" border>
         <el-table-column label="单位名称" prop="orgName"></el-table-column>
         <el-table-column label="类型" prop="type" v-slot:default="{ row }: { row: OrganizationType }">
           {{ row.type ? OrganizationTypeDesc[row.type] : '' }}
@@ -69,7 +69,7 @@ import {
 import type { OrganizationType } from "@/request/organization";
 import { OrganizationTypeDesc } from '@/store/organization'
 import { organizationAdd, organizationEdit } from "./quisk";
-import { debounce } from "@/util";
+import { debounce, parseTree } from "@/util";
 import { ElMessageBox } from "element-plus";
 
 const initProps: PageProps<Partial<OrganizationType>> = {
@@ -88,7 +88,8 @@ const relicsArray = ref<any[]>([]);
 const refresh = debounce(async () => {
   const data = await getOrgListFetch(pageProps.value);
   total.value = data.total;
-  relicsArray.value = data.records;
+  // console.log('parseTree', parseTree(data.records, 'orgId'))
+  relicsArray.value = parseTree(data.records, 'orgId');
 });
 
 watch(pageProps, refresh, { deep: true, immediate: true });

src/view/users-edit.vue

@@ -4,7 +4,7 @@
     <el-form-item label="单位名称" prop="orgId" required>
       <!-- <el-autocomplete style="width: 300px" v-model="data.orgName" :fetch-suggestions="querySearch" clearable
         class="inline-input w-50" placeholder="请输入" @select="handleSelect" /> -->
-      <el-select style="width: 300px" v-model="data.orgId" clearable>
+      <el-select style="width: 300px" v-model="data.orgId" clearable @change="handleSelect">
         <el-option :value="Number(id)" :label="value" v-for="{ value, id } in allOrgs" />
       </el-select>
     </el-form-item>
@@ -92,7 +92,12 @@ watchEffect(() => {
     data.value = { ...props.user }
   }
 })
-
+const handleSelect = (orgId: number) => {
+  const item = Array.from(allOrgs.value).find(i => i.id === orgId)
+  if (item) {
+    data.value.orgName = item.value
+  }
+}
 defineExpose<QuiskExpose>({
   async submit() {
     if (unref(baseFormRef)) {