修改布局

src/views/realTimeSync/dataBaseToDataBase/data.ts

@@ -320,6 +320,11 @@ export const mappingRuleConfigurationFormSchema: FormSchema[] = [
     component: 'Select',
     colProps: { span: 4 },
   },
+  {
+    field: 'deleteBtn',
+    label: '',
+    slot: 'deleteBtn',
+  },
 ];
 export const dataDirectionColumns: BasicColumn[] = [
   {

src/views/realTimeSync/dataBaseToDataBase/optionPage.vue

@@ -175,7 +175,13 @@
             style="font-size: 15px; white-space: pre-wrap"
           />
           <BasicTable title="数据转换规则" @register="registerMappingRuleConfigurationTable">
-            <template #toolbar>
+            <template #headerTop>
+              <a-input-search placeholder="输入关键字搜索" style="width: 200px" />
+              <Select
+                placeholder="选择规则类型"
+                style="width: 150px; margin-left: 20px; margin-right: 1200px"
+                :options="filterRuleTypeOptions"
+              />
               <a-button
                 :disabled="getRowSelection().selectedRowKeys <= 0"
                 type="primary"
@@ -458,7 +464,7 @@
         </TabPane>
         <TabPane v-if="tabKey === '4'" key="8" tab="策略配置">
           <span style="font-weight: bold; font-size: 18px">服务策略配置</span>
-          <BasicForm @register="registerPolicyOptionsForm">
+          <BasicForm @register="registerPolicyOptionsForm" style="margin-top: 20px">
             <template #policyOption>
               <Alert
                 show-icon
@@ -472,7 +478,7 @@
         <TabPane v-if="tabKey === '4'" key="9" tab="服务配置">
           <div class="flex" v-if="scene === 'optionPage'">
             <div style="width: 50%; border: rgb(217, 217, 217) 1px solid">
-              <span style="font-size: 15px; font-weight: bold; margin-left: 10px">源端配置</span>
+              <span style="font-size: 18px; font-weight: bold; margin-left: 10px">源端配置</span>
               <BasicForm
                 @register="registerServerOptionsForm"
                 style="margin-top: 10px; margin-left: 10px"
@@ -480,6 +486,9 @@
               <div>
                 <BasicTable @register="registerServerSourceOptionsTable">
                   <template #toolbar>
+                    <span style="font-size: 15px; font-weight: bold; margin-right: 650px">
+                      高级配置
+                    </span>
                     <a-button type="primary" @click="addServerSourceOptions">添加参数</a-button>
                   </template>
                   <template #bodyCell="{ column, record }">
@@ -496,8 +505,11 @@
                   </template>
                 </BasicTable>
               </div>
-              <Description size="middle" title="配置预览" :bordered="false">
+              <Description size="middle" title=" " :bordered="false">
                 <template #action>
+                  <span style="font-size: 15px; font-weight: bold; margin-right: 690px">
+                    配置预览
+                  </span>
                   <Icon
                     style="font-size: 25px !important"
                     icon="fa6-regular:copy"
@@ -515,10 +527,13 @@
               <textarea v-model="jsonData" style="width: 100%; height: 250px"></textarea>
             </div>
             <div style="width: 50%; border: rgb(217, 217, 217) 1px solid">
-              <span style="font-size: 15px; font-weight: bold; margin-left: 10px">目标端配置</span>
+              <span style="font-size: 18px; font-weight: bold; margin-left: 10px">目标端配置</span>
               <div>
                 <BasicTable @register="registerServerTopicOptionsTable">
                   <template #toolbar>
+                    <span style="font-size: 15px; font-weight: bold; margin-right: 650px">
+                      高级配置
+                    </span>
                     <a-button type="primary" @click="addServerTopicOptions">添加参数</a-button>
                   </template>
                   <template #bodyCell="{ column, record }">
@@ -535,8 +550,11 @@
                   </template>
                 </BasicTable>
               </div>
-              <Description size="middle" title="配置预览" :bordered="false">
+              <Description size="middle" title=" " :bordered="false">
                 <template #action>
+                  <span style="font-size: 15px; font-weight: bold; margin-right: 690px">
+                    配置预览
+                  </span>
                   <Icon
                     style="font-size: 25px !important"
                     icon="fa6-regular:copy"
@@ -706,6 +724,11 @@
       value: 'V4',
     },
   ];
+  const filterRuleTypeOptions = [
+    { label: '数据操作过滤', value: '1' },
+    { label: '数据值过滤', value: '2' },
+    { label: '字段过滤', value: '3' },
+  ];
   const mappingRulesTableShow = ref(false);
   const mappingRulesTopicTableShow = ref(false);
   const tableMappingRulesTableShow = ref(false);
@@ -876,7 +899,7 @@
     showIndexColumn: false,
     rowSelection: true,
     bordered: false,
-    useSearchForm: true,
+    useSearchForm: false,
     formConfig: {
       labelWidth: 120,
       showActionButtonGroup: false,
@@ -953,7 +976,6 @@
     scroll: { y: 500 },
   });
   const [registerServerSourceOptionsTable, { reload: reloadServerSourceOptionsTable }] = useTable({
-    title: '高级配置',
     api: async () => {
       const response = {
         pageNu: '1',
@@ -977,7 +999,6 @@
     scroll: { y: 200 },
   });
   const [registerServerTopicOptionsTable, { reload: reloadServerTopicOptionsTable }] = useTable({
-    title: '高级配置',
     api: async () => {
       const response = {
         pageNu: '1',
@@ -1171,7 +1192,7 @@
 
   function handleVersionManagement() {
     openVersionManageModal(true, {
-      title: '数据加载版本管理',
+      title: '版本管理',
       scene: scene.value,
     });
   }