修改血缘

src/views/kinship/kinshipAnalysis/GroupTree.vue

+<template>
+  <div class="m-5 mr-0 overflow-hidden bg-white">
+    <BasicTree
+      title=""
+      ref="treeRef"
+      treeWrapperClassName="h-[calc(100%-35px)] overflow-auto"
+      :defaultExpandAll="true"
+      :treeData="treeData"
+      :fieldNames="{ key: 'businessId', title: 'workSpaceName' }"
+      @select="handleSelect"
+      :actionList="actionList"
+    />
+  </div>
+</template>
+<script lang="ts" setup>
+  import { h, nextTick, onMounted, ref, unref } from 'vue';
+  import { BasicTree, TreeActionType, TreeItem } from '@/components/Tree';
+  import { Nullable } from '@vben/types';
+  import { TreeData } from './analysisData';
+  import { ReloadOutlined } from '@ant-design/icons-vue';
+  import { useMessage } from '@/hooks/web/useMessage';
+
+  defineOptions({ name: 'DataSourceTree' });
+
+  const emit = defineEmits(['select']);
+  const { createMessage } = useMessage();
+  const treeData = ref<TreeItem[]>([]);
+  const treeRef = ref<Nullable<TreeActionType>>(null);
+  function getTree() {
+    const tree = unref(treeRef);
+    if (!tree) {
+      throw new Error('tree is null!');
+    }
+    return tree;
+  }
+  async function fetch() {
+    const data = TreeData;
+    treeData.value = handleTree(data, 'businessId', undefined, undefined, undefined);
+    await nextTick(() => {
+      getTree().expandAll(true);
+    });
+  }
+
+  function handleTree(data, id, parentId, children, rootId) {
+    id = id || 'id';
+    parentId = parentId || 'parentId';
+    children = children || 'children';
+    rootId =
+      rootId ||
+      Math.min.apply(
+        Math,
+        data.map((item) => {
+          return item[parentId];
+        }),
+      ) ||
+      0;
+    // 对源数据深度克隆
+    const cloneData = JSON.parse(JSON.stringify(data));
+    // 循环所有项
+    const treeData = cloneData.filter((father) => {
+      const branchArr = cloneData.filter((child) => {
+        // 返回每一项的子级数组
+        return father[id] === child[parentId];
+      });
+      branchArr.length > 0 ? (father.children = branchArr) : '';
+      // 返回第一层
+      return father[parentId] === rootId;
+    });
+    return treeData !== '' ? treeData : data;
+  }
+
+  function handleSelect() {
+    const keys = getTree().getSelectedKeys();
+    const node = getTree().getSelectedNode(keys[0]);
+    emit('select', node);
+  }
+  // 树的操作列表
+  const actionList = [
+    {
+      render: () => {
+        return h(ReloadOutlined, {
+          class: 'ml-2',
+          onClick: () => {
+            refresh();
+          },
+        });
+      },
+    },
+  ];
+  const refresh = () => {
+    createMessage.success('刷新成功');
+  };
+  onMounted(() => {
+    fetch();
+  });
+</script>

src/views/kinship/kinshipAnalysis/analysisData.ts

+export const TreeData: any[] = [
+  {
+    delFlag: '0',
+    flag: '1',
+    businessId: 100,
+    workSpaceName: '数据库对象资源',
+    parentId: 0,
+    'code:': '001',
+    ancestors: '0',
+    orderNum: 0,
+    selectType: null,
+    createTime: '2024-10-24 10:04:04',
+    createBy: 'admin',
+  },
+  {
+    delFlag: '0',
+    flag: '1',
+    businessId: 101,
+    workSpaceName: 'inc1',
+    parentId: 100,
+    'code:': '002',
+    ancestors: '0,100',
+    orderNum: 1,
+    selectType: null,
+    createTime: '2024-10-24 10:04:04',
+    createBy: 'admin',
+  },
+  {
+    delFlag: '0',
+    flag: '1',
+    businessId: 102,
+    workSpaceName: 'inc2',
+    parentId: 100,
+    'code:': '003',
+    ancestors: '0,100',
+    orderNum: 2,
+    selectType: null,
+    createTime: '2024-10-24 10:04:04',
+    createBy: 'admin',
+  },
+  {
+    delFlag: '0',
+    flag: '0',
+    businessId: 103,
+    workSpaceName: 'inc3',
+    parentId: 100,
+    'code:': '010',
+    ancestors: '0,100,107',
+    orderNum: 2,
+    selectType: null,
+    createTime: '2024-10-24 10:04:04',
+    createBy: 'admin',
+  },
+  {
+    delFlag: '0',
+    flag: '1',
+    businessId: 201,
+    workSpaceName: 'mysql1',
+    parentId: 101,
+    'code:': '002',
+    ancestors: '0,100',
+    orderNum: 1,
+    selectType: null,
+    createTime: '2024-10-24 10:04:04',
+    createBy: 'admin',
+  },
+  {
+    delFlag: '0',
+    flag: '1',
+    businessId: 202,
+    workSpaceName: 'mysql2',
+    parentId: 102,
+    'code:': '002',
+    ancestors: '0,100',
+    orderNum: 1,
+    selectType: null,
+    createTime: '2024-10-24 10:04:04',
+    createBy: 'admin',
+  },
+  {
+    delFlag: '0',
+    flag: '1',
+    businessId: 203,
+    workSpaceName: 'mysql3',
+    parentId: 103,
+    'code:': '002',
+    ancestors: '0,100',
+    orderNum: 1,
+    selectType: null,
+    createTime: '2024-10-24 10:04:04',
+    createBy: 'admin',
+  },
+];
+export const storageManagementData: any[] = [
+  {
+    id: '1',
+    startTime: '2024-10-01 08:00:00',
+    endTime: '2024-10-01 10:30:00',
+    useTime: '2小时30分钟',
+    status: '1',
+    type: '手动清理',
+    pointNum: '5000',
+    num: '2000',
+    user: '张三',
+  },
+  {
+    id: '2',
+    startTime: '2024-10-02 09:00:00',
+    endTime: '2024-10-02 11:45:00',
+    useTime: '2小时45分钟',
+    status: '0',
+    type: '自动清理',
+    pointNum: '7000',
+    num: '3500',
+    user: '李四',
+  },
+  {
+    id: '3',
+    startTime: '2024-10-03 10:00:00',
+    endTime: '2024-10-03 12:15:00',
+    useTime: '2小时15分钟',
+    status: '1',
+    type: '手动清理',
+    pointNum: '6000',
+    num: '3000',
+    user: '王五',
+  },
+  {
+    id: '4',
+    startTime: '2024-10-04 11:00:00',
+    endTime: '2024-10-04 13:20:00',
+    useTime: '2小时20分钟',
+    status: '1',
+    type: '自动清理',
+    pointNum: '4500',
+    num: '2250',
+    user: '赵六',
+  },
+  {
+    id: '5',
+    startTime: '2024-10-05 12:00:00',
+    endTime: '2024-10-05 14:30:00',
+    useTime: '2小时30分钟',
+    status: '1',
+    type: '手动清理',
+    pointNum: '5500',
+    num: '2750',
+    user: '孙七',
+  },
+];

src/views/kinship/kinshipAnalysis/data.ts

+import { BasicColumn, FormSchema } from '@/components/Table';
+
+export const columns: BasicColumn[] = [
+  {
+    title: '名称',
+    dataIndex: 'name',
+    width: 120,
+  },
+  {
+    title: '类型',
+    dataIndex: 'category',
+    width: 120,
+  },
+  {
+    title: '拥有者',
+    dataIndex: 'owner',
+    width: 120,
+  },
+  {
+    title: '创建时间',
+    dataIndex: 'createDate',
+    width: 140,
+  },
+];
+export const SearchFormSchema: FormSchema[] = [
+  {
+    field: 'name',
+    label: '名称',
+    component: 'Input',
+    colProps: { span: 8 },
+  },
+  {
+    field: 'isKinship',
+    component: 'Checkbox',
+    label: '仅看血缘对象',
+    colProps: { span: 8 },
+    labelWidth: 120,
+  },
+];
+export const storageManagementColumns: BasicColumn[] = [
+  {
+    title: '清理开始时间',
+    dataIndex: 'startTime',
+    width: 120,
+  },
+  {
+    title: '清理结束时间',
+    dataIndex: 'endTime',
+    width: 120,
+  },
+  {
+    title: '执行耗时',
+    dataIndex: 'useTime',
+    width: 80,
+  },
+  {
+    title: '执行状态',
+    dataIndex: 'status',
+    width: 120,
+  },
+  {
+    title: '清理策略',
+    dataIndex: 'type',
+    width: 120,
+  },
+  {
+    title: '清理表顶点数',
+    dataIndex: 'pointNum',
+    width: 120,
+  },
+  {
+    title: '清理血缘关系树',
+    dataIndex: 'num',
+    width: 120,
+  },
+  {
+    title: '操作者',
+    dataIndex: 'user',
+    width: 80,
+  },
+];
+export const storageManagementFormSchema: FormSchema[] = [
+  {
+    field: 'startTime',
+    label: '清理开始时间',
+    component: 'DatePicker',
+    colProps: { lg: 4, md: 4 },
+  },
+  {
+    field: 'endTime',
+    label: '清理结束时间',
+    component: 'DatePicker',
+    colProps: { lg: 4, md: 4 },
+  },
+  {
+    field: 'user',
+    label: '清理者',
+    component: 'Input',
+    colProps: { lg: 4, md: 4 },
+  },
+  {
+    field: 'type',
+    label: '清理策略',
+    component: 'Select',
+    componentProps: {
+      options: [
+        { label: '手动清理', value: '1' },
+        { label: '自动清理', value: '2' },
+      ],
+    },
+    colProps: { lg: 4, md: 4 },
+  },
+];

src/views/kinship/kinshipAnalysis/index.vue

 <template>
   <PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
-    <GroupTree class="w-1/3 xl:w-2/9" @select="onNodeSelect" />
-    <div class="w-2/3 xl:w-7/9">
+    <GroupTree class="w-1/8 xl:w-1/8" @select="onNodeSelect" />
+    <div class="w-7/8 xl:w-7/8">
       <BasicTable @register="registerTable" :searchInfo="searchInfo">
         <template #toolbar>
           <a-button type="primary" @click="handleManage">存储管理</a-button>
         </template>
-        <template #bodyCell="{ column, record }">
-          <template v-if="column.key === 'dataSourceStatus'">
-            <Tag color="error" v-if="record.dataSourceStatus === '0'">数据待采集</Tag>
-          </template>
-          <template v-if="column.key === 'dataSourceStatus'">
-            <Tag color="warning" v-if="record.dataSourceStatus === '1'">数据采集中</Tag>
-          </template>
-          <template v-if="column.key === 'dataSourceStatus'">
-            <Tag color="success" v-if="record.dataSourceStatus === '2'">采集已完成</Tag>
-          </template>
-        </template>
       </BasicTable>
     </div>
     <storageManagementModal @register="registerStorageManagementModal" />
@@ -24,13 +13,12 @@
 </template>
 <script lang="ts" setup>
   import { reactive, onMounted, ref } from 'vue';
-  import { Tag } from 'ant-design-vue';
   import { BasicTable, useTable } from '@/components/Table';
   import { PageWrapper } from '@/components/Page';
   import { useMessage } from '@/hooks/web/useMessage';
   import { useModal } from '@/components/Modal';
-  import { sourceColumns, sourceSearchFormSchema } from '@/views/metadata/data';
-  import GroupTree from '@/views/metadata/GroupTree.vue';
+  import { columns, SearchFormSchema } from './data';
+  import GroupTree from './GroupTree.vue';
   import { metadataData } from '@/views/metadata/metadataData';
   import storageManagementModal from './storageManagementModal.vue';
 
@@ -56,15 +44,15 @@
       };
       //过滤data中的数据，取出等于params.deptId的数据
       var data = [];
-      data = tableData.value.filter((item) => item.parentId !== 0);
+      data = tableData.value;
       return { ...response, data: data };
     },
     rowKey: 'businessId',
     striped: false,
-    columns: sourceColumns,
+    columns,
     formConfig: {
       labelWidth: 120,
-      schemas: sourceSearchFormSchema,
+      schemas: SearchFormSchema,
       autoSubmitOnEnter: true,
       resetFunc: () => {},
     },
@@ -103,18 +91,6 @@
     );
     await reload();
   }
-  /** 新增/编辑成功*/
-  function handleSuccess({ isUpdate, values }) {
-    if (isUpdate) {
-      // 演示不刷新表格直接更新内部数据。
-      // 注意：updateTableDataRecord要求表格的rowKey属性为string并且存在于每一行的record的keys中
-      const result = updateTableDataRecord(values.id, values);
-      // console.log(result);
-      reload();
-    } else {
-      reload();
-    }
-  }
   function handleManage() {
     openStorageManagementModal(true, {
       title: '存储管理',

src/views/kinship/kinshipAnalysis/storageManagementModal.vue

@@ -15,6 +15,12 @@
     </template>
     <BasicTable @register="registerTable">
       <template #bodyCell="{ column, record }">
+        <template v-if="column.key === 'status'">
+          <Tag color="error" v-if="record.status === '0'">失败</Tag>
+        </template>
+        <template v-if="column.key === 'status'">
+          <Tag color="success" v-if="record.status === '1'">成功</Tag>
+        </template>
         <template v-if="column.key === 'action'">
           <TableAction
             :actions="[
@@ -38,7 +44,7 @@
                 //失败日志
                 icon: 'clarity:contract-line',
                 label: '',
-                ifShow: record.status === '失败',
+                ifShow: record.status === '0',
                 onClick: handleDetail.bind(null),
               },
             ]"
@@ -53,8 +59,9 @@
   import { BasicModal, useModalInner } from '@/components/Modal';
   import { useMessage } from '@/hooks/web/useMessage';
   import { BasicTable, TableAction, useTable } from '@/components/Table';
-  import { storageManagementColumns, storageManagementFormSchema } from '@/views/metadata/data';
-  import { storageManagementData } from '@/views/metadata/metadataData';
+  import { storageManagementColumns, storageManagementFormSchema } from './data';
+  import { storageManagementData } from './analysisData';
+  import { Tag } from 'ant-design-vue';
 
   defineOptions({ name: 'KnowledgeModal' });