修改元数据

src/views/metadata/GroupTree.vue

@@ -10,6 +10,7 @@
       @select="handleSelect"
       :actionList="actionList"
     />
+    <tagModal @register="registerModal" />
   </div>
 </template>
 <script lang="ts" setup>
@@ -17,8 +18,10 @@
   import { BasicTree, TreeActionType, TreeItem } from '@/components/Tree';
   import { Nullable } from '@vben/types';
   import { TreeData } from '@/views/metadata/metadataData';
-  import { ReloadOutlined } from '@ant-design/icons-vue';
+  import { EditOutlined, PlusOutlined, ReloadOutlined } from '@ant-design/icons-vue';
   import { useMessage } from '@/hooks/web/useMessage';
+  import { useModal } from '@/components/Modal';
+  import tagModal from './tagModal.vue';
 
   defineOptions({ name: 'DataSourceTree' });
 
@@ -33,7 +36,7 @@
     }
     return tree;
   }
-
+  const [registerModal, { openModal }] = useModal();
   async function fetch() {
     const data = TreeData;
     treeData.value = handleTree(data, 'businessId', undefined, undefined, undefined);
@@ -78,6 +81,28 @@
   }
   // 树的操作列表
   const actionList = [
+    {
+      //查看打标详情
+      render: (node) => {
+        return h(EditOutlined, {
+          class: 'ml-2',
+          onClick: () => {
+            handleUpdate(node);
+          },
+        });
+      },
+    },
+    {
+      //新增打标
+      render: (node) => {
+        return h(PlusOutlined, {
+          class: 'ml-2',
+          onClick: () => {
+            handleAdd(node);
+          },
+        });
+      },
+    },
     {
       render: () => {
         return h(ReloadOutlined, {
@@ -92,6 +117,12 @@
   const refresh = () => {
     createMessage.success('刷新成功');
   };
+  const handleAdd = (node) => {
+    openModal(true, {
+      title: '元数据打标',
+    });
+  };
+  const handleUpdate = (node) => {};
   onMounted(() => {
     fetch();
   });

src/views/metadata/data.ts

@@ -1102,3 +1102,60 @@ export const addTagSchema: FormSchema[] = [
     required: true,
   },
 ];
+export const tagSchema: FormSchema[] = [
+  {
+    field: 'type',
+    label: '操作类型',
+    component: 'RadioGroup',
+    colProps: { lg: 24, md: 24 },
+    componentProps: {
+      options: [
+        { label: '新增标签', value: '0' },
+        { label: '删除标签', value: '1' },
+      ],
+    },
+    required: true,
+  },
+  {
+    field: 'name',
+    label: '任务名',
+    component: 'Input',
+    colProps: { lg: 24, md: 24 },
+    required: true,
+  },
+  {
+    field: 'remark',
+    label: '描述',
+    component: 'Input',
+    colProps: { lg: 24, md: 24 },
+    required: true,
+  },
+  {
+    field: 'range',
+    label: '打标范围',
+    component: 'RadioGroup',
+    colProps: { lg: 24, md: 24 },
+    componentProps: {
+      options: [
+        { label: '数据源', value: '0' },
+        { label: '数据库', value: '1' },
+      ],
+    },
+    required: true,
+  },
+];
+export const tagDataSourceColumns: BasicColumn[] = [
+  {
+    title: '数据源名',
+    dataIndex: 'name',
+    width: 120,
+  },
+];
+export const tagDataSourceFormSchema: FormSchema[] = [
+  {
+    field: 'name',
+    label: '',
+    component: 'Input',
+    colProps: { span: 8 },
+  },
+];

src/views/metadata/tagModal.vue

+<template>
+  <BasicModal
+    width="40%"
+    v-bind="$attrs"
+    @register="registerModal"
+    :title="title"
+    @ok="handleSubmit"
+  >
+    <BasicForm @register="registerForm" />
+    <BasicTable @register="registerPartitionTable">
+      <template #toolbar>
+        <a-button type="primary" @click="handDelete">删除</a-button>
+        <a-button type="primary" @click="handleNew">添加</a-button>
+      </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 { recommendData } from '@/views/metadata/metadataData';
+  import { BasicForm, useForm } from '@/components/Form';
+  import { tagDataSourceColumns, tagDataSourceFormSchema, tagSchema } from '@/views/metadata/data';
+  import { BasicTable, useTable } from '@/components/Table';
+
+  defineOptions({ name: 'KnowledgeModal' });
+
+  const emit = defineEmits(['success', 'register']);
+  const { createMessage, createConfirm } = useMessage();
+  const title = ref();
+  const tableData = ref([]);
+  //获取接口数据并放在下拉框里（这里是打开了一个弹框）
+  //初始化表单
+  const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
+    labelWidth: 100,
+    baseColProps: { lg: 12, md: 24 },
+    schemas: tagSchema,
+    showActionButtonGroup: false,
+    actionColOptions: {
+      span: 23,
+    },
+  });
+  //初始化弹框
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    resetFields;
+    setModalProps({ confirmLoading: false });
+    title.value = data.title;
+  });
+  const [registerPartitionTable] = useTable({
+    title: '选择数据源',
+    columns: tagDataSourceColumns,
+    showIndexColumn: false,
+    useSearchForm: true,
+    formConfig: {
+      labelWidth: 120,
+      schemas: tagDataSourceFormSchema,
+      autoSubmitOnEnter: true,
+    },
+    actionColumn: {
+      width: 80,
+      title: '操作',
+      dataIndex: 'action',
+    },
+    scroll: { y: 300 },
+  });
+  async function handleSubmit() {
+    closeModal();
+    createMessage.success('提交成功');
+    resetFields;
+  }
+  function handDelete() {
+    createConfirm({
+      iconType: 'warning',
+      title: '确认删除',
+      content: '确认删除？',
+      onOk() {
+        createMessage.success('删除成功!');
+      },
+    });
+  }
+  function handleNew() {
+    createMessage.success('添加成功');
+  }
+  onMounted(() => {
+    tableData.value = recommendData;
+  });
+</script>