修改元数据

src/views/metadata/data.ts

@@ -974,3 +974,77 @@ export const addDataBaseSchema: FormSchema[] = [
     required: true,
   },
 ];
+export const storageManagementColumns: BasicColumn[] = [
+  {
+    title: '清理开始时间',
+    dataIndex: 'startTime',
+    width: 120,
+  },
+  {
+    title: '清理结束时间',
+    dataIndex: 'endTime',
+    width: 120,
+  },
+  {
+    title: '执行耗时',
+    dataIndex: 'useTime',
+    width: 120,
+  },
+  {
+    title: '执行状态',
+    dataIndex: 'status',
+    width: 120,
+  },
+  {
+    title: '清理策略',
+    dataIndex: 'type',
+    width: 120,
+  },
+  {
+    title: '清理表顶点数',
+    dataIndex: 'pointNum',
+    width: 120,
+  },
+  {
+    title: '清理血缘关系树',
+    dataIndex: 'num',
+    width: 120,
+  },
+  {
+    title: '操作者',
+    dataIndex: 'user',
+    width: 120,
+  },
+];
+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/metadata/index.vue

@@ -28,6 +28,7 @@
       </BasicTable>
     </div>
     <MetaDataModal @register="registerModal" @success="handleSuccess" />
+    <storageManagementModal @register="registerStorageManagementModal" />
   </PageWrapper>
 </template>
 <script lang="ts" setup>
@@ -44,6 +45,7 @@
   import { fieldChangeData, metadataData, tableChangeData } from '@/views/metadata/metadataData';
   import MetaDataModal from '@/views/metadata/metaDataModal.vue';
   import * as echarts from 'echarts';
+  import storageManagementModal from './storageManagementModal.vue';
 
   defineOptions({ name: 'Metadata' });
 
@@ -52,6 +54,7 @@
   const filterStore = useFilterStore();
   const route = useRoute();
   const [registerModal, { openModal }] = useModal();
+  const [registerStorageManagementModal, { openModal: openStorageManagementModal }] = useModal();
   const searchInfo = reactive<Recordable>({});
   const tableData = ref([]);
   const selectedNode = ref(null);
@@ -135,7 +138,9 @@
     }
   }
   function handleManage() {
-    createMessage.warning('暂未完成，敬请期待');
+    openStorageManagementModal(true, {
+      title: '存储管理',
+    });
   }
   function initCharts() {
     // 获取图表容器

src/views/metadata/metadataData.ts

@@ -1118,3 +1118,55 @@ export const metaData = {
   storagePath: 'mysql24.connector_foundation1.tb_1',
   description: '无',
 };
+export const storageManagementData: any[] = [
+  {
+    startTime: '2024-10-01 08:00:00',
+    endTime: '2024-10-01 10:30:00',
+    useTime: '2小时30分钟',
+    status: '成功',
+    type: '手动清理',
+    pointNum: '5000',
+    num: '2000',
+    user: '张三',
+  },
+  {
+    startTime: '2024-10-02 09:00:00',
+    endTime: '2024-10-02 11:45:00',
+    useTime: '2小时45分钟',
+    status: '失败',
+    type: '自动清理',
+    pointNum: '7000',
+    num: '3500',
+    user: '李四',
+  },
+  {
+    startTime: '2024-10-03 10:00:00',
+    endTime: '2024-10-03 12:15:00',
+    useTime: '2小时15分钟',
+    status: '成功',
+    type: '手动清理',
+    pointNum: '6000',
+    num: '3000',
+    user: '王五',
+  },
+  {
+    startTime: '2024-10-04 11:00:00',
+    endTime: '2024-10-04 13:20:00',
+    useTime: '2小时20分钟',
+    status: '成功',
+    type: '自动清理',
+    pointNum: '4500',
+    num: '2250',
+    user: '赵六',
+  },
+  {
+    startTime: '2024-10-05 12:00:00',
+    endTime: '2024-10-05 14:30:00',
+    useTime: '2小时30分钟',
+    status: '成功',
+    type: '手动清理',
+    pointNum: '5500',
+    num: '2750',
+    user: '孙七',
+  },
+];

src/views/metadata/storageManagementModal.vue

+<template>
+  <BasicModal
+    width="80%"
+    v-bind="$attrs"
+    @register="registerModal"
+    :title="title"
+    @ok="handleSubmit"
+  >
+    <template #footer>
+      <a-button type="primary" @click="handleSubmit">关闭</a-button>
+    </template>
+    <BasicTable @register="registerTable">
+      <template #bodyCell="{ column }">
+        <template v-if="column.key === 'action'">
+          <TableAction
+            :actions="[
+              {
+                label: '提交',
+                onClick: handleEdit.bind(null),
+              },
+              {
+                label: '查看',
+                onClick: handleDetail.bind(null),
+              },
+              {
+                color: 'error',
+                label: '删除',
+                popConfirm: {
+                  title: '是否确认删除',
+                  placement: 'left',
+                  confirm: handleDelete.bind(null),
+                },
+              },
+            ]"
+          />
+        </template>
+      </template>
+    </BasicTable>
+  </BasicModal>
+</template>
+<script lang="ts" setup>
+  import { onMounted, ref } from 'vue';
+  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';
+
+  defineOptions({ name: 'KnowledgeModal' });
+
+  const emit = defineEmits(['success', 'register']);
+  const { createMessage } = useMessage();
+  const title = ref();
+  const tableData = ref([]);
+  //获取接口数据并放在下拉框里（这里是打开了一个弹框）
+  //初始化表单
+  const [registerTable, { reload }] = useTable({
+    api: async () => {
+      const response = {
+        pageNum: '1',
+        pageSize: '10',
+        pages: '1',
+        total: tableData.value.length,
+        code: '',
+        message: '',
+        data: [],
+      };
+      //过滤data中的数据，取出等于params.deptId的数据
+      var data = [];
+      data = tableData.value;
+      return { ...response, data: data };
+    },
+    pagination: false,
+    columns: storageManagementColumns,
+    useSearchForm: true,
+    showTableSetting: false,
+    formConfig: {
+      labelWidth: 120,
+      schemas: storageManagementFormSchema,
+      autoSubmitOnEnter: true,
+    },
+    bordered: true,
+    showIndexColumn: false,
+    actionColumn: {
+      width: 150,
+      title: '操作',
+      dataIndex: 'action',
+    },
+  });
+  //初始化弹框
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    await reload();
+    setModalProps({ confirmLoading: false });
+    title.value = data.title;
+  });
+
+  async function handleSubmit() {
+    closeModal();
+  }
+  function handleDetail() {
+    createMessage.success('提交成功');
+  }
+  function handleEdit() {
+    createMessage.success('提交成功');
+  }
+  function handleDelete() {
+    createMessage.success('删除成功');
+  }
+  onMounted(() => {
+    tableData.value = storageManagementData;
+  });
+</script>