数据表-改

src/router/routes/index.ts

@@ -787,7 +787,7 @@ export const QualityRuleRoute: AppRouteRecordRaw = {
       name: 'rule',
       component: () => import('@/views/dataQuality/dataSheet/rule/index.vue'),
       meta: {
-        title: '质量规则批量创建',
+        title: '质量规则',
         icon: '',
       },
     },

src/views/dataQuality/dataSheet/rule/index.vue

 <template>
   <PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
-    <div class="w-1/4 xl:w-1/5">
+    <div class="w-1/4 xl:w-1/5" style="padding: 0 0 0 16px">
       <Tabs default-active-key="1">
         <Tabs.TabPane key="1" tab="数据库">
           <BasicTree :treeData="treeData" :checkable="true" defaultExpandLevel="1" />
@@ -42,7 +42,7 @@
         <a-button type="primary" :disabled="getRowSelection().selectedRowKeys <= 0">导出</a-button>
         <a-button type="primary" @click="handleAdd">新建规则</a-button>
         <a-button type="primary" @click="handleMoreAdd">批量新建规则</a-button>
-        <a-button type="primary">新建质量任务</a-button>
+        <a-button type="primary" @click="handleAddQuality">新建质量任务</a-button>
       </template>
       <template #bodyCell="{ column, record }">
         <template v-if="column.key === 'action'">
@@ -97,7 +97,7 @@
   import { useMessage } from '@/hooks/web/useMessage';
   import { h, ref } from 'vue';
   import { FolderAddOutlined, SettingOutlined } from '@ant-design/icons-vue';
-  import ImportModal from "@/views/dataQuality/dataSheet/rule/rulesExport.vue";
+  import ImportModal from '@/views/dataQuality/dataSheet/rule/rulesExport.vue';
   // 模态框
   const isAdd = ref(true);
   const { push } = useRouter();
@@ -140,7 +140,7 @@
   ];
   // 新增
   function handleAdd() {
-    isAdd.value = true
+    isAdd.value = true;
     openRuleEditModel(true, {
       isUpdate: false,
     });
@@ -151,6 +151,11 @@
       path: '/dataQuality/ruleMoreAdd',
     });
   }
+  function handleAddQuality() {
+    push({
+      path: '/dataQuality/dataSheet/task',
+    });
+  }
   function handlePlus(node) {}
 
   /**
@@ -175,7 +180,7 @@
    * 列表编辑
    */
   function handleEdit(record) {
-    isAdd.value = false
+    isAdd.value = false;
     openRuleEditModel(true, {
       record,
       isUpdate: true,
@@ -206,8 +211,6 @@
     });
   }
 
-
-
   /** 导入按钮*/
   function handleImport() {
     openImportModal(true, {});

src/views/dataQuality/dataSheet/rule/rule.data.ts

@@ -129,10 +129,7 @@ export const ruleModelFormSchema: any[] = [
     field: 'model',
     label: '关键模板',
     required: true,
-    component: 'Select',
-    componentProps: {
-      options: [{ label: '公民身份号码', value: '公民身份号码' }],
-    },
+    slot: 'model',
     colProps: { lg: 24, md: 24 },
   },
   {
@@ -147,7 +144,6 @@ export const ruleModelFormSchema: any[] = [
     component: 'Select',
     colProps: { lg: 24, md: 24 },
     show: ({ values }) => {
-      console.log('values', values);
       return values.group ? values.group.substring(0, 2) === '主体' : false;
     },
   },
@@ -156,8 +152,11 @@ export const ruleModelFormSchema: any[] = [
     label: 'SQL预览',
     component: 'InputTextArea',
     componentProps: {
-      placeholder: '请输入描述',
+      placeholder: ' ',
       rows: 4,
+      style: {
+        pointerEvents: 'none',
+      },
     },
     colProps: { lg: 24, md: 24 },
   },
@@ -206,10 +205,7 @@ export const ruleEditModelFormSchema: any[] = [
     field: 'model',
     label: '关键模板',
     required: true,
-    component: 'Select',
-    componentProps: {
-      options: [{ label: '公民身份号码', value: '公民身份号码' }],
-    },
+    slot: 'model',
     colProps: { lg: 24, md: 24 },
   },
   {
@@ -224,7 +220,6 @@ export const ruleEditModelFormSchema: any[] = [
     component: 'Select',
     colProps: { lg: 24, md: 24 },
     show: ({ values }) => {
-      console.log('values', values);
       return values.group ? values.group.substring(0, 2) === '主体' : false;
     },
   },
@@ -233,8 +228,11 @@ export const ruleEditModelFormSchema: any[] = [
     label: 'SQL预览',
     component: 'InputTextArea',
     componentProps: {
-      placeholder: '请输入描述',
+      placeholder: ' ',
       rows: 4,
+      style: {
+        pointerEvents: 'none',
+      },
     },
     colProps: { lg: 24, md: 24 },
   },

src/views/dataQuality/dataSheet/rule/ruleEditModel.vue

@@ -68,6 +68,9 @@
       <template #dataSourceTxt="{ model, field }">
         {{ model[field] }}
       </template>
+      <template #model="{ field, model }">
+        <Select v-model:value="model[field]" @change="changeModel" :options="modelOptions" />
+      </template>
       <template #config>
         <div>
           <BasicTable @register="configTable">
@@ -130,17 +133,19 @@
   //获取接口数据并放在下拉框里（这里是打开了一个弹框）
   const [ruleGroupAddModel, { openModal: openRuleGroupAddModel }] = useModal();
   const [addNewVersion, { openModal: openAddNewVersion }] = useModal();
+  const modelOptions = [{ label: '公民身份号码', value: '公民身份号码' }];
   //初始化表单
-  const [registerForm, { setFieldsValue, resetSchema, resetFields, validate }] = useForm({
-    labelWidth: 100,
-    baseColProps: { lg: 12, md: 24 },
-    // schemas: props.isAdd ? ruleModelFormSchema : ruleEditModelFormSchema,
-    showActionButtonGroup: false,
-    disabled: props.disabled,
-    actionColOptions: {
-      span: 23,
-    },
-  });
+  const [registerForm, { setFieldsValue, getFieldsValue, resetSchema, resetFields, validate }] =
+    useForm({
+      labelWidth: 100,
+      baseColProps: { lg: 12, md: 24 },
+      // schemas: props.isAdd ? ruleModelFormSchema : ruleEditModelFormSchema,
+      showActionButtonGroup: false,
+      disabled: props.disabled,
+      actionColOptions: {
+        span: 23,
+      },
+    });
   //初始化弹框
   const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
     await resetFields();
@@ -161,32 +166,66 @@
       await resetSchema([...ruleModelFormSchema]);
     }
   });
-  const [configTable, { reload, updateTableDataRecord, getSearchInfo, getForm, getRowSelection }] =
-    useTable({
-      title: '',
-      // 定高
-      scroll: { y: 150 },
-      api: async (params) => {
-        console.log('params:', params);
-        const response = {
-          pageNu: '1',
-          pageSize: '10',
-          pages: '1',
-          total: configData.length,
-          code: '',
-          message: '',
-          data: configData,
-        };
-        return { ...response };
-      },
-      rowKey: 'businessId',
-      columns: configColumn,
-      striped: false,
-      showIndexColumn: false,
-      showTableSetting: false,
-      bordered: true,
-      pagination: false,
-    });
+  // 关键模板-修改后
+  function changeModel() {
+    // 更新表单
+    reload();
+    // 更新sql预览
+    getSql();
+  }
+  function getSql() {
+    const model = getFieldsValue();
+    if (model.model) {
+      // 修改表单-SQL预览
+      setFieldsValue({
+        preview:
+          'SELECT COUNT(*)\n' +
+          'FROM $(table a}\n' +
+          'WHERE ${column a}IS NOT NULL AND ${column a}NOT IN (${range a})',
+      });
+    } else {
+      setFieldsValue({
+        preview: null,
+      });
+    }
+  }
+  // 获取数据 判断表单
+  function getData() {
+    const model = getFieldsValue();
+    if (model.model) {
+      return [...configData];
+    } else {
+      return [];
+    }
+  }
+  const [
+    configTable,
+    { reload, updateTableDataRecord, getSearchInfo, getForm, getRowSelection, setTableData },
+  ] = useTable({
+    title: '',
+    // 定高
+    scroll: { y: 150 },
+    api: async (params) => {
+      console.log('params:', params);
+      const response = {
+        pageNu: '1',
+        pageSize: '10',
+        pages: '1',
+        total: getData().length,
+        code: '',
+        message: '',
+        data: getData(),
+      };
+      return { ...response };
+    },
+    rowKey: 'businessId',
+    columns: configColumn,
+    striped: false,
+    showIndexColumn: false,
+    showTableSetting: false,
+    bordered: true,
+    pagination: false,
+  });
   const [taskTable] = useTable({
     title: '',
     // 定高

src/views/dataStandards/labelDropInspection/labelReport/index.vue

 <template>
-  <PageWrapper contentBackground headerSticky>
+  <PageWrapper dense contentBackground headerSticky>
     <template #headerContent>
       <div class="flex" style="gap: 10px">
         <div class="flex-1 flex" style="gap: 10px">