修改元数据

src/views/metadata/GroupTree.vue

@@ -11,6 +11,7 @@
       :actionList="actionList"
     />
     <tagModal @register="registerModal" />
+    <tagRecordModal @register="registerTagRecordModal" />
   </div>
 </template>
 <script lang="ts" setup>
@@ -22,6 +23,7 @@
   import { useMessage } from '@/hooks/web/useMessage';
   import { useModal } from '@/components/Modal';
   import tagModal from './tagModal.vue';
+  import tagRecordModal from './tagRecordModal.vue';
 
   defineOptions({ name: 'DataSourceTree' });
 
@@ -37,6 +39,7 @@
     return tree;
   }
   const [registerModal, { openModal }] = useModal();
+  const [registerTagRecordModal, { openModal: openTagRecordModal }] = useModal();
   async function fetch() {
     const data = TreeData;
     treeData.value = handleTree(data, 'businessId', undefined, undefined, undefined);
@@ -83,22 +86,22 @@
   const actionList = [
     {
       //查看打标详情
-      render: (node) => {
+      render: () => {
         return h(EditOutlined, {
           class: 'ml-2',
           onClick: () => {
-            handleUpdate(node);
+            handleUpdate();
           },
         });
       },
     },
     {
       //新增打标
-      render: (node) => {
+      render: () => {
         return h(PlusOutlined, {
           class: 'ml-2',
           onClick: () => {
-            handleAdd(node);
+            handleAdd();
           },
         });
       },
@@ -117,12 +120,19 @@
   const refresh = () => {
     createMessage.success('刷新成功');
   };
-  const handleAdd = (node) => {
+  const handleAdd = () => {
     openModal(true, {
       title: '元数据打标',
+      isUpdate: false,
+      isCopy: false,
+      isForm: true,
+    });
+  };
+  const handleUpdate = () => {
+    openTagRecordModal(true, {
+      title: '元数据打标详情',
     });
   };
-  const handleUpdate = (node) => {};
   onMounted(() => {
     fetch();
   });

src/views/metadata/data.ts

@@ -1104,7 +1104,7 @@ export const addTagSchema: FormSchema[] = [
 ];
 export const tagSchema: FormSchema[] = [
   {
-    field: 'type',
+    field: 'typeNum',
     label: '操作类型',
     component: 'RadioGroup',
     colProps: { lg: 24, md: 24 },
@@ -1117,7 +1117,7 @@ export const tagSchema: FormSchema[] = [
     required: true,
   },
   {
-    field: 'name',
+    field: 'workName',
     label: '任务名',
     component: 'Input',
     colProps: { lg: 24, md: 24 },
@@ -1151,6 +1151,18 @@ export const tagDataSourceColumns: BasicColumn[] = [
     width: 120,
   },
 ];
+export const tagSourceColumns: BasicColumn[] = [
+  {
+    title: '标签名',
+    dataIndex: 'tagName',
+    width: 120,
+  },
+  {
+    title: '标签分类',
+    dataIndex: 'tag',
+    width: 120,
+  },
+];
 export const tagDataSourceFormSchema: FormSchema[] = [
   {
     field: 'name',
@@ -1159,3 +1171,89 @@ export const tagDataSourceFormSchema: FormSchema[] = [
     colProps: { span: 8 },
   },
 ];
+export const tagRuleSchema: FormSchema[] = [
+  {
+    field: 'dataSourceName',
+    label: '元数据名称',
+    component: 'Input',
+    colProps: { lg: 24, md: 24 },
+    required: true,
+  },
+  {
+    field: 'isPhysics',
+    label: '是否为物理模型',
+    component: 'Select',
+    colProps: { lg: 24, md: 24 },
+    componentProps: {
+      options: [
+        { label: '新增标签', value: '0' },
+        { label: '删除标签', value: '1' },
+      ],
+    },
+    required: true,
+  },
+];
+export const tagRecordColumns: BasicColumn[] = [
+  {
+    title: '打标时间',
+    dataIndex: 'date',
+    width: 120,
+  },
+  {
+    title: '操作者',
+    dataIndex: 'user',
+    width: 120,
+  },
+  {
+    title: '任务名',
+    dataIndex: 'workName',
+    width: 120,
+  },
+  {
+    title: '打标数量',
+    dataIndex: 'num',
+    width: 120,
+  },
+  {
+    title: '操作类型',
+    dataIndex: 'type',
+    width: 120,
+  },
+  {
+    title: '执行状态',
+    dataIndex: 'executionStatus',
+    width: 120,
+  },
+];
+export const tagRecordFormSchema: FormSchema[] = [
+  {
+    field: 'date',
+    label: '打标时间',
+    component: 'DatePicker',
+    colProps: { lg: 6, md: 6 },
+  },
+  {
+    field: 'executionStatus',
+    label: '执行状态',
+    component: 'Select',
+    colProps: { lg: 6, md: 6 },
+    componentProps: {
+      options: [
+        { label: '成功', value: '0' },
+        { label: '失败', value: '1' },
+      ],
+    },
+  },
+  {
+    field: 'type',
+    label: '操作类型',
+    component: 'Select',
+    colProps: { lg: 6, md: 6 },
+    componentProps: {
+      options: [
+        { label: '新增标签', value: '0' },
+        { label: '删除标签', value: '1' },
+      ],
+    },
+  },
+];

src/views/metadata/metadataData.ts

@@ -1175,3 +1175,72 @@ export const storageManagementData: any[] = [
     user: '孙七',
   },
 ];
+export const tagRecordData: any[] = [
+  {
+    businessId: '1',
+    date: '2024-11-01 10:00',
+    user: '张三',
+    workName: '数据清洗任务1',
+    num: 500,
+    type: '新增标签',
+    executionStatus: '成功',
+    typeNum: '0',
+    range: '1',
+    remark: '无',
+  },
+  {
+    businessId: '2',
+    date: '2024-11-02 14:30',
+    user: '李四',
+    workName: '图像标注任务2',
+    num: 300,
+    type: '新增标签',
+    executionStatus: '成功',
+    typeNum: '0',
+    range: '1',
+    remark: '无',
+  },
+  {
+    businessId: '3',
+    date: '2024-11-03 09:15',
+    user: '王五',
+    workName: '文本分类任务3',
+    num: 750,
+    type: '新增标签',
+    executionStatus: '成功',
+    typeNum: '0',
+    range: '1',
+    remark: '无',
+  },
+  {
+    businessId: '4',
+    date: '2024-11-04 16:45',
+    user: '赵六',
+    workName: '语音识别任务4',
+    num: 220,
+    type: '新增标签',
+    executionStatus: '成功',
+    typeNum: '0',
+    range: '1',
+    remark: '无',
+  },
+  {
+    businessId: '5',
+    date: '2024-11-05 11:20',
+    user: '孙七',
+    workName: '视频处理任务5',
+    num: 800,
+    type: '新增标签',
+    executionStatus: '成功',
+    typeNum: '0',
+    range: '1',
+    remark: '无',
+  },
+];
+export const tagFormData: any[] = [
+  {
+    name: 'argodb',
+    tagName: '标签1',
+    tag: 'slark_tag',
+  },
+];

src/views/metadata/tableModal.vue

@@ -28,7 +28,7 @@
               :data="refundData"
               :schema="refundSchema"
             />
-            <a-button type="primary" @click="addTag">新增标签</a-button>
+            <a-button @click="addTag">新增标签</a-button>
             <Description
               size="middle"
               title="分区信息"

src/views/metadata/tagModal.vue

@@ -12,17 +12,68 @@
         <a-button type="primary" @click="handDelete">删除</a-button>
         <a-button type="primary" @click="handleNew">添加</a-button>
       </template>
+      <template #bodyCell="{ column }">
+        <template v-if="column.key === 'action'">
+          <TableAction
+            :actions="[
+              {
+                color: 'error',
+                label: '删除',
+                popConfirm: {
+                  title: '是否确认删除',
+                  placement: 'left',
+                  confirm: handleDelete.bind(null),
+                },
+              },
+            ]"
+          />
+        </template>
+      </template>
+    </BasicTable>
+    <Description size="large" title="打标规则" :bordered="false" />
+    <Alert show-icon message="" description="以下规则是AND关系" />
+    <BasicForm @register="registerRuleForm" />
+    <BasicTable @register="registerTagTable">
+      <template #toolbar>
+        <a-button type="primary" @click="handDelete">删除</a-button>
+        <a-button type="primary" @click="handleNew">添加</a-button>
+      </template>
+      <template #bodyCell="{ column }">
+        <template v-if="column.key === 'action'">
+          <TableAction
+            :actions="[
+              {
+                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 { ref, unref } from 'vue';
   import { BasicModal, useModalInner } from '@/components/Modal';
   import { useMessage } from '@/hooks/web/useMessage';
-  import { recommendData } from '@/views/metadata/metadataData';
+  import { tagFormData, tagRecordData } from '@/views/metadata/metadataData';
   import { BasicForm, useForm } from '@/components/Form';
-  import { tagDataSourceColumns, tagDataSourceFormSchema, tagSchema } from '@/views/metadata/data';
-  import { BasicTable, useTable } from '@/components/Table';
+  import {
+    tagDataSourceColumns,
+    tagDataSourceFormSchema,
+    tagRuleSchema,
+    tagSchema,
+    tagSourceColumns,
+  } from '@/views/metadata/data';
+  import { BasicTable, TableAction, useTable } from '@/components/Table';
+  import { Alert } from 'ant-design-vue';
+  import { Description } from '@/components/Description';
 
   defineOptions({ name: 'KnowledgeModal' });
 
@@ -30,12 +81,28 @@
   const { createMessage, createConfirm } = useMessage();
   const title = ref();
   const tableData = ref([]);
+  const formData = ref([]);
+  const isUpdate = ref(false);
+  const rowId = ref('');
+  const isCopy = ref(false);
+  const isForm = ref(false);
   //获取接口数据并放在下拉框里（这里是打开了一个弹框）
   //初始化表单
-  const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
-    labelWidth: 100,
+  const [registerForm, { setFieldsValue, resetFields }] = useForm({
+    labelWidth: 120,
     baseColProps: { lg: 12, md: 24 },
     schemas: tagSchema,
+    disabled: isForm,
+    showActionButtonGroup: false,
+    actionColOptions: {
+      span: 23,
+    },
+  });
+  const [registerRuleForm] = useForm({
+    labelWidth: 120,
+    baseColProps: { lg: 12, md: 24 },
+    schemas: tagRuleSchema,
+    disabled: isForm,
     showActionButtonGroup: false,
     actionColOptions: {
       span: 23,
@@ -43,13 +110,29 @@
   });
   //初始化弹框
   const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
-    resetFields;
+    resetFields();
     setModalProps({ confirmLoading: false });
     title.value = data.title;
+    isUpdate.value = !!data?.isUpdate;
+    isCopy.value = !data?.isCopy;
+    isForm.value = !data?.isForm;
+    console.log(isCopy.value);
+    if (unref(isUpdate)) {
+      formData.value = tagFormData;
+      tableData.value = tagRecordData;
+      // 获取行数据的id
+      rowId.value = data.record.businessId;
+      // 通过id获取行详情信息
+      var userData = [];
+      userData = tableData.value.filter((item) => item.businessId === rowId.value);
+      console.log(userData);
+      setFieldsValue(userData[0]);
+    }
   });
   const [registerPartitionTable] = useTable({
     title: '选择数据源',
     columns: tagDataSourceColumns,
+    dataSource: formData,
     showIndexColumn: false,
     useSearchForm: true,
     formConfig: {
@@ -61,13 +144,33 @@
       width: 80,
       title: '操作',
       dataIndex: 'action',
+      ifShow: isCopy,
+    },
+    scroll: { y: 300 },
+  });
+  const [registerTagTable] = useTable({
+    title: '选择标签',
+    dataSource: formData,
+    columns: tagSourceColumns,
+    showIndexColumn: false,
+    useSearchForm: true,
+    formConfig: {
+      labelWidth: 120,
+      schemas: tagDataSourceFormSchema,
+      autoSubmitOnEnter: true,
+    },
+    actionColumn: {
+      width: 80,
+      title: '操作',
+      dataIndex: 'action',
+      ifShow: isCopy,
     },
     scroll: { y: 300 },
   });
   async function handleSubmit() {
     closeModal();
     createMessage.success('提交成功');
-    resetFields;
+    resetFields();
   }
   function handDelete() {
     createConfirm({
@@ -79,10 +182,10 @@
       },
     });
   }
+  function handleDelete() {
+    createMessage.success('删除成功');
+  }
   function handleNew() {
     createMessage.success('添加成功');
   }
-  onMounted(() => {
-    tableData.value = recommendData;
-  });
 </script>

src/views/metadata/tagRecordModal.vue

+<template>
+  <BasicModal
+    width="70%"
+    v-bind="$attrs"
+    @register="registerModal"
+    :title="title"
+    @ok="handleSubmit"
+  >
+    <BasicTable @register="registerTable">
+      <template #toolbar>
+        <a-button type="primary" @click="deleteAll">批量删除</a-button>
+        <a-button type="primary" @click="refresh">刷新</a-button>
+      </template>
+      <template #bodyCell="{ column, record }">
+        <template v-if="column.key === 'action'">
+          <TableAction
+            :actions="[
+              {
+                //详情
+                icon: 'clarity:note-edit-line',
+                label: '',
+                onClick: handleEdit.bind(null, record),
+              },
+              {
+                //复制
+                icon: 'clarity:contract-line',
+                label: '',
+                onClick: handleCopy.bind(null, record),
+              },
+              {
+                icon: 'ant-design:delete-outlined',
+                color: 'error',
+                label: '',
+                popConfirm: {
+                  title: '是否确认删除',
+                  placement: 'left',
+                  confirm: handleDelete.bind(null),
+                },
+              },
+            ]"
+          />
+        </template>
+      </template>
+    </BasicTable>
+  </BasicModal>
+  <tagModal @register="registerTagModal" />
+</template>
+<script lang="ts" setup>
+  import { onMounted, ref } from 'vue';
+  import { BasicModal, useModal, useModalInner } from '@/components/Modal';
+  import { useMessage } from '@/hooks/web/useMessage';
+  import { BasicTable, TableAction, useTable } from '@/components/Table';
+  import { tagRecordColumns, tagRecordFormSchema } from '@/views/metadata/data';
+  import { tagRecordData } from '@/views/metadata/metadataData';
+  import tagModal from './tagModal.vue';
+
+  defineOptions({ name: 'KnowledgeModal' });
+
+  const emit = defineEmits(['success', 'register']);
+  const { createMessage, createConfirm } = useMessage();
+  const title = ref();
+  const tableData = ref([]);
+  const [registerTagModal, { openModal }] = useModal();
+  //获取接口数据并放在下拉框里（这里是打开了一个弹框）
+  //初始化表单
+  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: tagRecordColumns,
+    showTableSetting: false,
+    rowSelection: true,
+    rowKey: 'businessId',
+    useSearchForm: true,
+    formConfig: {
+      labelWidth: 120,
+      schemas: tagRecordFormSchema,
+      autoSubmitOnEnter: true,
+    },
+    actionColumn: {
+      width: 150,
+      title: '操作',
+      dataIndex: 'action',
+    },
+    bordered: true,
+    showIndexColumn: false,
+  });
+  //初始化弹框
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    await reload();
+    setModalProps({ confirmLoading: false });
+    title.value = data.title;
+  });
+  function handleCopy(record: Recordable) {
+    openModal(true, {
+      title: '打标任务复制',
+      isUpdate: true,
+      isCopy: false,
+      isForm: true,
+      record,
+    });
+  }
+  function handleEdit(record: Recordable) {
+    openModal(true, {
+      title: '打标任务详情',
+      isUpdate: true,
+      isCopy: true,
+      isForm: false,
+      record,
+    });
+  }
+  function handleDelete() {
+    createMessage.success('删除成功');
+  }
+  function refresh() {
+    createMessage.success('刷新成功');
+  }
+  function deleteAll() {
+    createConfirm({
+      iconType: 'warning',
+      title: '确认删除',
+      content: '确认批量删除选中数据吗？',
+      onOk() {
+        createMessage.success('批量删除成功!');
+      },
+    });
+  }
+  async function handleSubmit() {
+    closeModal();
+    createMessage.success('提交成功');
+  }
+  onMounted(() => {
+    tableData.value = tagRecordData;
+  });
+</script>