diff --git a/apps/daas/package.json b/apps/daas/package.json
index dd9842331a..50f8d08bdd 100644
--- a/apps/daas/package.json
+++ b/apps/daas/package.json
@@ -55,9 +55,9 @@
     "nodemon": "^2.0.7",
     "rollup-plugin-visualizer": "^5.14.0",
     "sass": "^1.86.2",
-    "unplugin-auto-import": "^0.17.6",
+    "unplugin-auto-import": "^19.2.0",
     "unplugin-icons": "^0.19.0",
-    "unplugin-vue-components": "^0.27.0",
+    "unplugin-vue-components": "^28.5.0",
     "vite": "^6.2.4",
     "vue-tsc": "^2.0.21"
   },
diff --git a/apps/daas/src/auto-imports.d.ts b/apps/daas/src/auto-imports.d.ts
index 459454d427..541046c404 100644
--- a/apps/daas/src/auto-imports.d.ts
+++ b/apps/daas/src/auto-imports.d.ts
@@ -3,6 +3,7 @@
 // @ts-nocheck
 // noinspection JSUnusedGlobalSymbols
 // Generated by unplugin-auto-import
+// biome-ignore lint: disable
 export {}
 declare global {
   const ElIcon: typeof import('element-plus/es')['ElIcon']
diff --git a/apps/daas/src/components.d.ts b/apps/daas/src/components.d.ts
index d237710e02..bbeefec609 100644
--- a/apps/daas/src/components.d.ts
+++ b/apps/daas/src/components.d.ts
@@ -34,7 +34,6 @@ declare module 'vue' {
     ElDropdown: typeof import('element-plus/es')['ElDropdown']
     ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
     ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu']
-    ElEmpty: typeof import('element-plus/es')['ElEmpty']
     ElForm: typeof import('element-plus/es')['ElForm']
     ElFormItem: typeof import('element-plus/es')['ElFormItem']
     ElHeader: typeof import('element-plus/es')['ElHeader']
@@ -65,6 +64,7 @@ declare module 'vue' {
     ElRow: typeof import('element-plus/es')['ElRow']
     ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
     ElSelect: typeof import('element-plus/es')['ElSelect']
+    ElSelectLoading: typeof import('element-plus/es')['ElSelectLoading']
     ElSelectV2: typeof import('element-plus/es')['ElSelectV2']
     ElSkeleton: typeof import('element-plus/es')['ElSkeleton']
     ElSkeletonItem: typeof import('element-plus/es')['ElSkeletonItem']
diff --git a/apps/daas/src/layouts/Header.vue b/apps/daas/src/layouts/Header.vue
index 185f51c5d5..07b393939e 100644
--- a/apps/daas/src/layouts/Header.vue
+++ b/apps/daas/src/layouts/Header.vue
@@ -244,7 +244,11 @@ defineExpose({
 </script>
 
 <template>
-  <ElHeader v-if="!IS_IFRAME" class="flex align-center gap-4" height="64px">
+  <ElHeader
+    v-if="!IS_IFRAME"
+    class="flex align-center gap-4 layout-header"
+    height="64px"
+  >
     <a
       v-if="isOP"
       class="logo w-auto text-white flex align-center gap-2"
@@ -379,6 +383,11 @@ defineExpose({
 </template>
 
 <style lang="scss" scoped>
+.layout-header {
+  :deep(.el-button .el-icon:only-child) {
+    color: var(--icon-n1);
+  }
+}
 .divider {
   height: 1.8em;
   border-color: rgba(60, 60, 67, 0.12);
diff --git a/apps/daas/src/views/user/List.vue b/apps/daas/src/views/user/List.vue
index 25dcd91d00..e69e841a45 100644
--- a/apps/daas/src/views/user/List.vue
+++ b/apps/daas/src/views/user/List.vue
@@ -3,7 +3,7 @@ import { roleApi, roleMappingsApi, usersApi } from '@tap/api'
 import { TablePage } from '@tap/business'
 
 import PageContainer from '@tap/business/src/components/PageContainer.vue'
-import { FilterBar } from '@tap/component'
+import { DownBoldOutlined, FilterBar } from '@tap/component'
 import dayjs from 'dayjs'
 import { escapeRegExp } from 'lodash-es'
 
@@ -12,6 +12,7 @@ export default {
     PageContainer,
     TablePage,
     FilterBar,
+    DownBoldOutlined,
   },
   data() {
     return {
@@ -344,14 +345,18 @@ export default {
 
     // 选择分类
     handleSelectTag() {
-      const tagList = {}
+      const tagList = []
+      const tagMap = {}
+
       this.multipleSelection.forEach((row) => {
-        if (row.listtags && row.listtags.length > 0) {
-          tagList[row.listtags[0].id] = {
-            value: row.listtags[0].value,
+        row.listtags.forEach((item) => {
+          if (!tagMap[item.id]) {
+            tagList.push(item)
+            tagMap[item.id] = true
           }
-        }
+        })
       })
+
       return tagList
     },
     // 分类设置保存
@@ -655,40 +660,6 @@ export default {
 <template>
   <PageContainer>
     <template #actions>
-      <el-button
-        v-show="multipleSelection.length > 0"
-        v-readonlybtn="'user_category_application'"
-        class="btn"
-        @click="$refs.table.showClassify(handleSelectTag())"
-      >
-        <span> {{ $t('public_button_bulk_tag') }}</span>
-      </el-button>
-      <el-dropdown
-        v-show="multipleSelection.length > 0"
-        v-readonlybtn="'user_edition'"
-        @command="handleCommand($event)"
-      >
-        <el-button class="btn btn-dropdowm">
-          <i class="iconfont icon-piliang back-btn-icon" />
-          <span> {{ $t('public_button_bulk_operation') }}</span>
-        </el-button>
-        <template #dropdown>
-          <el-dropdown-menu>
-            <el-dropdown-item v-if="$has('user_edition')" command="activated">
-              {{ $t('user_list_bulk_activation') }}
-            </el-dropdown-item>
-            <el-dropdown-item v-if="$has('user_edition')" command="rejected">{{
-              $t('user_list_bulk_freeze')
-            }}</el-dropdown-item>
-            <el-dropdown-item
-              v-if="$has('user_edition')"
-              command="notActivated"
-            >
-              {{ $t('user_list_bulk_check') }}
-            </el-dropdown-item>
-          </el-dropdown-menu>
-        </template>
-      </el-dropdown>
       <el-button
         v-readonlybtn="'new_model_creation'"
         class="btn btn-create"
@@ -702,16 +673,35 @@ export default {
     <TablePage
       ref="table"
       row-key="id"
-      class="user-list"
-      :classify="{ authority: 'user_category_management', types: ['user'] }"
+      class="user-table-page"
+      :classify="{
+        authority: 'user_category_management',
+        types: ['user'],
+        hideIcon: true,
+      }"
       :remote-method="getData"
       @selection-change="handleSelectionChange"
       @classify-submit="handleOperationClassify"
       @sort-change="handleSortTable"
     >
-      <template #nav>
-        <div class="tapNav">
-          <ElTabs v-model="activePanel" @tab-change="handleTapClick">
+      <template #nav="{ openClassify }">
+        <div class="tapNav position-relative">
+          <el-button
+            class="position-absolute z-10 start-0"
+            text
+            style="top: 4px"
+            @click="openClassify"
+          >
+            <template #icon>
+              <VIcon>expand-list</VIcon>
+            </template>
+          </el-button>
+
+          <ElTabs
+            v-model="activePanel"
+            style="--el-tabs-padding-left: 36px; --el-tabs-header-height: 36px"
+            @tab-change="handleTapClick"
+          >
             <ElTabPane
               v-for="item in muneList"
               :key="item.icon"
@@ -757,6 +747,45 @@ export default {
         </div>
       </template>
 
+      <template #multipleSelectionActions>
+        <el-button
+          v-readonlybtn="'user_category_application'"
+          class="btn"
+          @click="$refs.table.showClassify(handleSelectTag())"
+        >
+          <span> {{ $t('public_button_bulk_tag') }}</span>
+        </el-button>
+        <el-dropdown
+          v-readonlybtn="'user_edition'"
+          @command="handleCommand($event)"
+        >
+          <el-button class="btn btn-dropdowm">
+            <span> {{ $t('public_button_bulk_operation') }}</span>
+            <el-icon class="ml-1">
+              <DownBoldOutlined />
+            </el-icon>
+          </el-button>
+          <template #dropdown>
+            <el-dropdown-menu>
+              <el-dropdown-item v-if="$has('user_edition')" command="activated">
+                {{ $t('user_list_bulk_activation') }}
+              </el-dropdown-item>
+              <el-dropdown-item
+                v-if="$has('user_edition')"
+                command="rejected"
+                >{{ $t('user_list_bulk_freeze') }}</el-dropdown-item
+              >
+              <el-dropdown-item
+                v-if="$has('user_edition')"
+                command="notActivated"
+              >
+                {{ $t('user_list_bulk_check') }}
+              </el-dropdown-item>
+            </el-dropdown-menu>
+          </template>
+        </el-dropdown>
+      </template>
+
       <el-table-column type="selection" width="45" :reserve-selection="true" />
       <el-table-column
         :label="$t('user_list_user_name')"
@@ -1039,6 +1068,12 @@ export default {
 </template>
 
 <style lang="scss" scoped>
+.user-table-page {
+  :deep(.classification) {
+    margin-top: -6px !important;
+  }
+}
+
 .user-list-wrap {
   .tapNav {
     :deep(.el-tabs__header) {
@@ -1078,35 +1113,3 @@ export default {
   }
 }
 </style>
-
-<style lang="scss">
-.user-list-wrap {
-  .table-page-container {
-    .table-page-body {
-      .table-page-topbar {
-        padding-inline: 16px;
-        background-color: map.get($bgColor, white);
-      }
-      .el-table,
-      .el-pagination {
-        padding-inline: 16px;
-        box-sizing: border-box;
-        overflow: hidden;
-      }
-      .table-page-pagination {
-        margin-top: 0;
-        //padding: 5px 20px;
-        background-color: map.get($bgColor, white);
-        box-sizing: border-box;
-      }
-      .status {
-        padding: 5px 10px;
-        border-radius: 4px;
-      }
-    }
-  }
-  .classification {
-    margin-left: 16px;
-  }
-}
-</style>
diff --git a/apps/daas/src/vuex/modules/feature.js b/apps/daas/src/vuex/modules/feature.js
index f8ae7d3690..c3a98cb22c 100644
--- a/apps/daas/src/vuex/modules/feature.js
+++ b/apps/daas/src/vuex/modules/feature.js
@@ -1,5 +1,4 @@
 import { licensesApi } from '@tap/api'
-import { SettingList } from '@/router/menu'
 
 const MENU_FEATURE_MAP = {
   dataService: 'dataService',
diff --git a/package.json b/package.json
index 568d445108..cb51e724b0 100644
--- a/package.json
+++ b/package.json
@@ -66,7 +66,8 @@
       "vue-virtual-scroller": "2.0.0-beta.8"
     },
     "patchedDependencies": {
-      "@formily/element-plus@1.1.0": "patches/@formily__element-plus@1.1.0.patch"
+      "@formily/element-plus@1.1.0": "patches/@formily__element-plus@1.1.0.patch",
+      "@formily/vue@2.3.3": "patches/@formily__vue@2.3.3.patch"
     }
   },
   "prettier": "@sxzz/prettier-config"
diff --git a/packages/api/src/Connections.ts b/packages/api/src/Connections.ts
index ee80807a6b..072516bb40 100644
--- a/packages/api/src/Connections.ts
+++ b/packages/api/src/Connections.ts
@@ -1,5 +1,5 @@
-import Http from './Http'
 import { isPlainObj } from '@tap/shared'
+import Http from './Http'
 
 export default class Connections extends Http {
   constructor() {
@@ -8,10 +8,10 @@ export default class Connections extends Http {
   get(params = {}, filter) {
     if (Array.isArray(params)) {
       filter = typeof filter === 'object' ? JSON.stringify(filter) : filter
-      let qs = filter ? '?filter=' + encodeURIComponent(filter) : ''
-      return this.axios.get(this.url + '/' + params.join('/') + qs)
+      const qs = filter ? `?filter=${encodeURIComponent(filter)}` : ''
+      return this.axios.get(`${this.url}/${params.join('/')}${qs}`)
     } else if (typeof params === 'string') {
-      return this.axios.get(this.url + '/' + params, { params: filter })
+      return this.axios.get(`${this.url}/${params}`, { params: filter })
     }
 
     const config = { params }
@@ -23,12 +23,12 @@ export default class Connections extends Http {
   customQuery(id: string, params: { [key: string]: unknown }) {
     let url = `${this.url}/${id}` + '/customQuery?'
     for (const item in params) {
-      url += item + '=' + params[item] + '&'
+      url += `${item}=${params[item]}&`
     }
     return this.axios.get(url)
   }
   copy(id: string, params: unknown) {
-    return this.axios.post(this.url + '/' + id + '/copy', params)
+    return this.axios.post(`${this.url}/${id}/copy`, params)
   }
   batchUpdateListtags(params: unknown) {
     return this.axios.patch(`${this.url}/batchUpdateListtags`, params)
@@ -50,17 +50,25 @@ export default class Connections extends Http {
     return this.axios.patch(`${this.url}/${id}`, params)
   }
   findAll(filter: unknown) {
-    return this.axios.get(`${this.url}/findAll?filter=` + encodeURIComponent(JSON.stringify(filter)))
+    return this.axios.get(
+      `${this.url}/findAll?filter=${encodeURIComponent(
+        JSON.stringify(filter),
+      )}`,
+    )
   }
   listAll(filter: unknown) {
-    return this.axios.get(`${this.url}/listAll?filter=` + encodeURIComponent(JSON.stringify(filter)))
+    return this.axios.get(
+      `${this.url}/listAll?filter=${encodeURIComponent(
+        JSON.stringify(filter),
+      )}`,
+    )
   }
   checkConnectionTask(id: string) {
-    return this.axios.get(`${this.url}/task/` + id + '/10')
+    return this.axios.get(`${this.url}/task/${id}/10`)
   }
 
   getStats() {
-    return this.axios.get(this.url + '/stats')
+    return this.axios.get(`${this.url}/stats`)
   }
   create(params: unknown, urlParams: any) {
     let url = this.url
@@ -73,7 +81,13 @@ export default class Connections extends Http {
     return this.axios.get(`${this.url}/${connectionId}/heartbeat-task`)
   }
   usingDigginTaskByConnectionId(connectionId) {
-    return this.axios.get(`${this.url}/${connectionId}/usingDigginTaskByConnectionId`)
+    return this.axios.get(
+      `${this.url}/${connectionId}/usingDigginTaskByConnectionId`,
+    )
+  }
+
+  getDatabaseTypes() {
+    return this.axios.get(`${this.url}/databaseTypes`)
   }
 }
 
diff --git a/packages/api/src/TaskInspect.ts b/packages/api/src/TaskInspect.ts
new file mode 100644
index 0000000000..c6e6b6f6a4
--- /dev/null
+++ b/packages/api/src/TaskInspect.ts
@@ -0,0 +1,81 @@
+import Http from './Http'
+
+interface TaskInspectConfig {
+  custom: {
+    cdc: {
+      enable: boolean
+      sample: {
+        interval: number
+        limit: number
+      }
+      type: 'CLOSE' | 'SAMPLE'
+    }
+    full?: {
+      enable: boolean
+      cron: string
+      diffEnable: boolean
+      diffLimit: number
+      diffRetryTimes: number
+      sampleLimit: number
+      samplePercent: number
+      trigger: string
+      type: string
+    }
+    recover?: {
+      enable: boolean
+    }
+  }
+  intelligent?: {
+    cdcSampleInterval: number
+    cdcSampleLimit: number
+    enableRecover: boolean
+    fullDiffLimit: number
+    fullSampleLimit: number
+  }
+  mode: 'CLOSE' | 'INTELLIGENT' | 'CUSTOM'
+}
+
+interface TaskInspectHistory {
+  id: string
+  taskId: string
+  createdAt: string
+  status: string
+  type: string
+  [key: string]: any
+}
+
+export default class TaskInspect extends Http {
+  constructor() {
+    super('/api/task-inspect')
+  }
+
+  async getConfig(taskId: string, params?: any): Promise<TaskInspectConfig> {
+    const response = (await this.axios.get(`${this.url}/${taskId}`, {
+      params,
+    })) as unknown as TaskInspectConfig
+
+    return (
+      response || {
+        mode: 'CLOSE',
+        custom: {
+          cdc: {
+            enable: true,
+            sample: { interval: 10, limit: 1 },
+            type: 'SAMPLE',
+          },
+        },
+      }
+    )
+  }
+
+  putConfig(taskId: string, params: TaskInspectConfig) {
+    return this.axios.put<TaskInspectConfig>(`${this.url}/${taskId}`, params)
+  }
+
+  getHistories(taskId: string, params: any) {
+    return this.axios.get<TaskInspectHistory[]>(
+      `${this.url}/${taskId}/histories`,
+      { params },
+    )
+  }
+}
diff --git a/packages/api/src/index.ts b/packages/api/src/index.ts
index b055daa962..f179c1c2b6 100644
--- a/packages/api/src/index.ts
+++ b/packages/api/src/index.ts
@@ -250,6 +250,9 @@ const agentGroupApi = new AgentGroup()
 import Webhook from './Webhook'
 const webhookApi = new Webhook()
 
+import TaskInspect from './TaskInspect'
+const taskInspectApi = new TaskInspect()
+
 export {
   connectionsApi,
   databaseTypesApi,
@@ -313,7 +316,8 @@ export {
   connectorRecordApi,
   alarmMailApi,
   agentGroupApi,
-  webhookApi
+  webhookApi,
+  taskInspectApi
 }
 export * from './ApiClient'
 
diff --git a/packages/assets/icons/svg/ArrowToTopRightLinear.svg b/packages/assets/icons/svg/ArrowToTopRightLinear.svg
new file mode 100644
index 0000000000..5efb80adb7
--- /dev/null
+++ b/packages/assets/icons/svg/ArrowToTopRightLinear.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><!-- Icon from Solar by 480 Design - https://creativecommons.org/licenses/by/4.0/ --><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m12 4.5l-5 5m5-5l5 5m-5-5v10c0 1.667 1 5 5 5"/></svg>
\ No newline at end of file
diff --git a/packages/assets/icons/svg/ArrowsTurnForward.svg b/packages/assets/icons/svg/ArrowsTurnForward.svg
new file mode 100644
index 0000000000..a456bdc5af
--- /dev/null
+++ b/packages/assets/icons/svg/ArrowsTurnForward.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 16 16"><!-- Icon from Gravity UI Icons by YANDEX LLC - https://github.com/gravity-ui/icons/blob/main/LICENSE --><path fill="currentColor" fill-rule="evenodd" d="M13.53 11.28a.75.75 0 0 0 0-1.06l-3-3a.75.75 0 1 0-1.06 1.06L11.19 10H7a3.25 3.25 0 0 1 0-6.5h1A.75.75 0 0 0 8 2H7a4.75 4.75 0 0 0 0 9.5h4.19l-1.72 1.72a.75.75 0 1 0 1.06 1.06z" clip-rule="evenodd"/></svg>
\ No newline at end of file
diff --git a/packages/assets/icons/svg/Eye.svg b/packages/assets/icons/svg/Eye.svg
new file mode 100644
index 0000000000..b195726fd5
--- /dev/null
+++ b/packages/assets/icons/svg/Eye.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path fill="none" d="M2.062 12.348a1 1 0 0 1 0-.696a10.75 10.75 0 0 1 19.876 0a1 1 0 0 1 0 .696a10.75 10.75 0 0 1-19.876 0"/><circle cx="12" cy="12" r="3"/></g></svg>
\ No newline at end of file
diff --git a/packages/assets/icons/svg/EyeOff.svg b/packages/assets/icons/svg/EyeOff.svg
new file mode 100644
index 0000000000..6672c29fac
--- /dev/null
+++ b/packages/assets/icons/svg/EyeOff.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path fill="none" d="M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575a1 1 0 0 1 0 .696a10.8 10.8 0 0 1-1.444 2.49m-6.41-.679a3 3 0 0 1-4.242-4.242"/><path fill="none" d="M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151a1 1 0 0 1 0-.696a10.75 10.75 0 0 1 4.446-5.143M2 2l20 20"/></g></svg>
\ No newline at end of file
diff --git a/packages/assets/icons/svg/FileChartColumnIncreasing.svg b/packages/assets/icons/svg/FileChartColumnIncreasing.svg
new file mode 100644
index 0000000000..c8a0e69ee2
--- /dev/null
+++ b/packages/assets/icons/svg/FileChartColumnIncreasing.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path fill="none" d="M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z"/><path fill="none" d="M14 2v4a2 2 0 0 0 2 2h4M8 18v-2m4 2v-4m4 4v-6"/></g></svg>
\ No newline at end of file
diff --git a/packages/assets/icons/svg/data-scan.svg b/packages/assets/icons/svg/data-scan.svg
new file mode 100644
index 0000000000..a1359d996c
--- /dev/null
+++ b/packages/assets/icons/svg/data-scan.svg
@@ -0,0 +1,10 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_2591_11088)">
+<path d="M8.72739 0.725586L8.72739 15.2725C8.72739 15.674 8.40083 15.999 7.99927 15.999C7.5977 15.999 7.27271 15.674 7.27271 15.2725L7.2727 0.727148C7.2727 0.325585 7.5977 0.000585284 7.99927 0.000585267C8.40083 -0.000976869 8.72739 0.324023 8.72739 0.725586ZM14.618 2.18027L14.618 13.8178C14.618 14.2193 14.293 14.5443 13.8915 14.5443L10.8352 14.5443C10.4336 14.5443 10.1086 14.2193 10.1086 13.8178C10.1086 13.4162 10.4336 13.0912 10.8352 13.0912L13.1618 13.0912L13.1618 2.90996L10.8352 2.90996C10.4336 2.90996 10.1086 2.58496 10.1086 2.1834C10.1086 1.78184 10.4336 1.45684 10.8352 1.45684L13.8899 1.45684C14.2915 1.45371 14.618 1.77871 14.618 2.18027ZM5.88989 2.18027C5.88989 2.58184 5.56489 2.90684 5.16333 2.90684L2.8352 2.90684L2.8352 13.0896L5.16177 13.0896C5.56333 13.0896 5.88833 13.4146 5.88833 13.8162C5.88833 14.2178 5.56333 14.5428 5.16177 14.5428L2.10864 14.5428C1.70708 14.5428 1.38208 14.2178 1.38208 13.8162L1.38208 2.18027C1.38208 1.77871 1.70708 1.45371 2.10864 1.45371L5.16333 1.45371C5.56489 1.45371 5.88989 1.77871 5.88989 2.18027Z" fill="currentColor"/>
+</g>
+<defs>
+<clipPath id="clip0_2591_11088">
+<rect width="16" height="16" fill="currentColor" transform="translate(0 16) rotate(-90)"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/packages/assets/icons/svg/expand-list.svg b/packages/assets/icons/svg/expand-list.svg
index 3ffe51f88d..b4bb76c439 100644
--- a/packages/assets/icons/svg/expand-list.svg
+++ b/packages/assets/icons/svg/expand-list.svg
@@ -1,5 +1 @@
-<!-- Generated by IcoMoon.io -->
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
-<title>zhankai2</title>
-<path d="M27.475 28.45h-22.375c-1.075 0-1.6-0.6-1.6-1.775s0.525-1.775 1.6-1.775h22.375c1.075 0 1.6 0.6 1.6 1.775-0.025 1.175-0.55 1.775-1.6 1.775zM15.6 21.325h-10.6c-1 0-1.525-0.6-1.525-1.775s0.5-1.775 1.525-1.775h10.6c1 0 1.525 0.6 1.525 1.775 0 1.2-0.5 1.775-1.525 1.775zM28.025 17.025l-6.95 4.175c-0.475 0.275-1.075 0.125-1.35-0.35-0.1-0.15-0.15-0.325-0.15-0.5v-8.35c0-0.55 0.45-0.975 0.975-0.975 0.175 0 0.35 0.050 0.5 0.15l6.975 4.15c0.475 0.275 0.625 0.875 0.35 1.35-0.1 0.15-0.225 0.25-0.35 0.35zM15.6 14.225h-10.6c-1 0-1.525-0.6-1.525-1.775s0.5-1.775 1.525-1.775h10.6c1 0 1.525 0.6 1.525 1.775s-0.5 1.775-1.525 1.775zM27.475 7.1h-22.375c-1.075 0-1.6-0.6-1.6-1.775s0.525-1.775 1.6-1.775h22.375c1.075 0 1.6 0.6 1.6 1.775-0.025 1.2-0.55 1.775-1.6 1.775z"></path>
-</svg>
+<svg width="1em" height="1em" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" data-icon="SideExpandOutlined"><path d="M22 4a1 1 0 0 0-1-1H3a1 1 0 0 0 0 2h18a1 1 0 0 0 1-1Zm-11.111 7c.614 0 1.111.448 1.111 1s-.498 1-1.111 1H3.11C2.497 13 2 12.552 2 12s.497-1 1.111-1h7.778ZM12 20c0-.552-.498-1-1.111-1H3.11C2.497 19 2 19.448 2 20s.497 1 1.111 1h7.778c.614 0 1.111-.448 1.111-1Zm3.41-3.136a1.117 1.117 0 0 1 0-1.729l4.951-3.917c.675-.534 1.639-.026 1.639.865v7.834c0 .89-.964 1.4-1.639.865l-4.951-3.918Z" fill="currentColor"></path></svg>
\ No newline at end of file
diff --git a/packages/assets/styles/element.scss b/packages/assets/styles/element.scss
index 0fbb8512ae..68a33843c3 100644
--- a/packages/assets/styles/element.scss
+++ b/packages/assets/styles/element.scss
@@ -29,6 +29,33 @@
     font-weight: 500;
   }
 
+  .cell-no-padding .cell {
+    padding: 0;
+  }
+
+  .el-table-column--selection .cell {
+    padding: 0;
+    .el-checkbox {
+      --el-checkbox-input-width: 16px;
+      --el-checkbox-input-height: 16px;
+      .el-checkbox__inner::after {
+        height: 8px;
+        left: 5px;
+      }
+      .el-checkbox__input.is-indeterminate .el-checkbox__inner::before {
+        top: 6px;
+      }
+    }
+  }
+
+  .table-cell-drag-btn {
+    display: none;
+  }
+
+  .hover-row .table-cell-drag-btn {
+    display: inline-flex;
+  }
+
   .cell {
     --btn-space: 4px;
     overflow-wrap: break-word;
@@ -152,6 +179,11 @@
 }
 
 // Tree
+.el-tree {
+  .is-drop-inner > .el-tree-node__content {
+    background-color: var(--el-color-primary-light-8);
+  }
+}
 .el-tree-node__content {
   border-radius: map.get($border-radius, base);
 }
@@ -346,6 +378,8 @@
 
   // 图标按钮
   &.is-text:has(> i:only-child), &.is-text:has(> i + span:empty) {
+    --el-button-text-color: var(--icon-n2);
+    --el-border-radius-base: 8px;
     --el-fill-color-light: rgba(31, 35, 41, 0.1);
     //--el-fill-color-light: rgba(0, 0, 0, 0.06);
     padding: 4px;
@@ -355,7 +389,12 @@
     line-height: 0;
     font-size: 20px;
 
+    &:hover {
+      --el-button-text-color: var(--icon-n1);
+    }
+
     &.el-button--primary {
+      --el-button-text-color: var(--el-color-primary);
       --el-fill-color-light: var(--el-color-primary-light-9);
       --el-fill-color: var(--el-color-primary-light-8);
     }
@@ -369,16 +408,17 @@
     margin-left: 0;
   }
 
-  &.is-text.el-button--small:has(> i:only-child) {
+  &.is-text.el-button--small:has(> i:only-child), &.is-text.el-button--small:has(> i + span:empty) {
+    --el-border-radius-base: var(--el-border-radius-small);
     font-size: 16px;
   }
 
   // 这里的default 介于按钮的 sm/default 之间
-  &.is-text.el-button--default:has(> i:only-child) {
+  &.is-text.el-button--default:has(> i:only-child), &.is-text.el-button--default:has(> i + span:empty) {
     font-size: 18px;
   }
 
-  &.is-text.el-button--large:has(> i:only-child) {
+  &.is-text.el-button--large:has(> i:only-child), &.is-text.el-button--large:has(> i + span:empty) {
     font-size: 24px;
   }
 }
@@ -500,4 +540,76 @@
       --color: var(--el-color-primary);
     }
 }
+}
+
+
+
+
+// Custome Component
+.drag-node-image {
+  $h: 36px;
+  position: absolute;
+  top: 0;
+  left: 0;
+  display: flex;
+  align-items: center;
+  width: 240px;
+  height: $h;
+  z-index: 103;
+  background-color: rgba(0, 0, 0, 0);
+  .drag-preview-container {
+    position: absolute;
+    top: 0;
+    left: 0;
+    z-index: 104;
+    pointer-events: none;
+    display: flex;
+    align-items: center;
+    padding-left: 12px;
+    padding-right: 12px;
+    width: 100%;
+    height: 100%;
+    border-radius: 8px;
+    background-color: #fff;
+
+    .drag-preview-icon {
+      display: flex;
+      align-items: center;
+      margin-right: 8px;
+    }
+  }
+
+  .drag-preview-layerEffect {
+    position: absolute;
+    z-index: 102;
+    top: 6px;
+    left: 6px;
+    right: 0;
+    height: $h;
+    border-radius: 8px;
+    background-color: #fff;
+  }
+
+  .drag-preview-dot {
+    position: absolute;
+    right: -12px;
+    top: -12px;
+    background-color: map-get($color, danger);
+    color: #fff;
+    width: 24px;
+    height: 24px;
+    line-height: 24px;
+    font-size: 14px;
+    font-weight: 500;
+    border-radius: 50px;
+    z-index: 104;
+    text-align: center;
+
+    &.expand {
+      width: auto;
+      padding: 0 7px;
+      border-radius: 16px;
+      right: -18px;
+    }
+  }
 }
\ No newline at end of file
diff --git a/packages/assets/styles/utilities.scss b/packages/assets/styles/utilities.scss
index ba50da9849..45345d9ee1 100644
--- a/packages/assets/styles/utilities.scss
+++ b/packages/assets/styles/utilities.scss
@@ -1008,6 +1008,11 @@
   margin-left: 0 !important;
 }
 
+.mx-0\.5 {
+  margin-right: 0.125rem !important;
+  margin-left: 0.125rem !important;
+}
+
 .mx-1 {
   margin-right: 0.25rem !important;
   margin-left: 0.25rem !important;
@@ -1716,6 +1721,10 @@
   margin-bottom: -4rem !important;
 }
 
+.mt-n0\.5 {
+  margin-top: -0.125rem !important;
+}
+
 .mt-n1 {
   margin-top: -0.25rem !important;
 }
@@ -12538,6 +12547,30 @@
   text-overflow: ellipsis;
 }
 
+.active-primary {
+  background-color: rgb(59 71 229 / 10%) !important;
+  color: map-get($color, primary) !important;
+}
+
+.bg-fill-hover {
+  background-color: rgb(24 24 27 / 5%);
+}
+
+.last\:border-0:last-child {
+  border: 0 !important;
+}
+
+.text-muted-foreground {
+  color: rgb(113 113 122);
+}
+
+.hover\:bg-light:hover {
+  background-color: #f8f9fa !important;
+}
+
+
+
+
 .break-all {
   word-break: break-all;
 }
@@ -12571,4 +12604,14 @@
   background-color: rgb(229 231 235);
 }
 
+.grid-cols-2 {
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+}
+
+.col-start-1 {
+  grid-column-start: 1;
+}
 
+.col-start-2 {
+  grid-column-start: 2;
+}
diff --git a/packages/business/src/components/TablePage.vue b/packages/business/src/components/TablePage.vue
index d40866eace..3d5a5cd685 100644
--- a/packages/business/src/components/TablePage.vue
+++ b/packages/business/src/components/TablePage.vue
@@ -275,6 +275,7 @@ export default {
           v-if="classify && !hideClassify"
           ref="classification"
           v-model:visible="classificationVisible"
+          class="mt-n2 ml-n2"
           :com-title="classify.comTitle"
           :authority="classify.authority"
           :view-page="classify.viewPage"
@@ -288,16 +289,24 @@ export default {
         />
         <div class="table-page-body gap-4">
           <div class="table-page-nav">
-            <slot name="nav" />
+            <slot name="nav" :open-classify="handleToggleClassify" />
           </div>
           <div class="table-page-topbar">
             <div class="table-page-search-bar flex align-center gap-2">
-              <IconButton
-                v-if="classify && !hideClassify && !classificationVisible"
-                class="rotate-180"
+              <el-button
+                v-if="
+                  classify &&
+                  !hideClassify &&
+                  !classificationVisible &&
+                  !classify.hideIcon
+                "
+                text
                 @click="handleToggleClassify"
-                >expand-list</IconButton
               >
+                <template #icon>
+                  <VIcon>expand-list</VIcon>
+                </template>
+              </el-button>
               <slot name="search" />
             </div>
             <div class="table-page-operation-bar">
@@ -316,13 +325,36 @@ export default {
             :span-method="spanMethod"
             :data="list"
             :default-sort="defaultSort"
-            :draggable="draggable || classificationVisible"
             @selection-change="handleSelectionChange"
             @sort-change="$emit('sortChange', $event)"
             @row-dragstart="handleDragStart"
             @row-dragend="handleDragEnd"
             @select="onSelectRow"
           >
+            <el-table-column
+              v-if="classificationVisible"
+              width="28"
+              align="center"
+              class-name="cell-no-padding"
+            >
+              <template #default="{ row, column }">
+                <el-button
+                  draggable="true"
+                  class="grabbable table-cell-drag-btn"
+                  :class="{
+                    'inline-flex': multipleSelection.includes(row),
+                  }"
+                  text
+                  size="small"
+                  @dragstart="handleDragStart(row, column, $event)"
+                  @dragend="handleDragEnd"
+                >
+                  <template #icon>
+                    <VIcon>drag</VIcon>
+                  </template>
+                </el-button>
+              </template>
+            </el-table-column>
             <slot />
             <template #empty>
               <div class="empty">
@@ -346,6 +378,7 @@ export default {
               <div
                 v-if="multipleSelection.length"
                 class="flex align-center gap-3"
+                style="--btn-space: 0"
               >
                 <ElCheckbox :model-value="true" @change="clearSelection" />
                 <span class="fw-sub text-nowrap color-primary"
@@ -439,7 +472,7 @@ export default {
     display: flex;
     flex: 1;
     // padding: 0 20px 20px 20px;
-    overflow: hidden;
+    min-height: 0;
     .table-page-main-box {
       display: flex;
       flex: 1;
@@ -449,17 +482,11 @@ export default {
     }
   }
 
-  .table-page-left {
-    //border-right: 1px solid #ebeef5;
-    // margin-right: 10px;
-  }
-
   .table-page-body {
     flex: 1;
     display: flex;
     flex-direction: column;
     overflow: hidden;
-    // background-color: map.get($bgColor, white);
     border-radius: 4px;
     .el-table--border {
       border: none;
diff --git a/packages/business/src/locale/lang/en.js b/packages/business/src/locale/lang/en.js
index 7c75e74984..6c7083a164 100644
--- a/packages/business/src/locale/lang/en.js
+++ b/packages/business/src/locale/lang/en.js
@@ -377,7 +377,7 @@ export default {
     'Source table field: value',
   packages_business_verification_details_xianshiwanzhengzi: 'Show full fields',
   packages_business_verification_details_jinxianshichayi:
-    'Display only fields with differences.',
+    'Show diff fields',
   packages_business_verification_details_yichangshujuhang:
     'Exception data (row):',
   packages_business_verification_details_mubiaobiao: 'Target table:',
diff --git a/packages/business/src/shared/classification.js b/packages/business/src/shared/classification.js
index 8bb83526b6..a9f553f0b8 100644
--- a/packages/business/src/shared/classification.js
+++ b/packages/business/src/shared/classification.js
@@ -1,4 +1,9 @@
-export const makeDragNodeImage = ($icon, nodeName, size = 1, parent = document.body) => {
+export const makeDragNodeImage = (
+  $icon,
+  nodeName,
+  size = 1,
+  parent = document.body,
+) => {
   const dragImage = document.createElement('div')
 
   if (!nodeName) return dragImage
@@ -6,30 +11,30 @@ export const makeDragNodeImage = ($icon, nodeName, size = 1, parent = document.b
   dragImage.style.position = 'absolute'
   dragImage.style.zIndex = '-100'
   dragImage.style.opacity = '1'
-  parent.appendChild(dragImage)
+  parent.append(dragImage)
   const container = document.createElement('div')
-  container.className = 'drag-preview-container'
+  container.className = 'drag-preview-container shadow-sm'
 
   if ($icon) {
     const icon = $icon.cloneNode(true)
     icon.className = 'drag-preview-icon'
-    container.appendChild(icon)
+    container.append(icon)
   }
 
   const text = document.createElement('div')
   text.className = 'drag-preview-name ellipsis'
   text.innerHTML = nodeName
-  container.appendChild(text)
-  dragImage.appendChild(container)
+  container.append(text)
+  dragImage.append(container)
 
   if (size > 1) {
-    let layer = document.createElement('div')
-    layer.className = 'drag-preview-layerEffect'
-    let dot = document.createElement('div')
+    const layer = document.createElement('div')
+    layer.className = 'drag-preview-layerEffect shadow-sm'
+    const dot = document.createElement('div')
     dot.className = size > 9 ? 'drag-preview-dot expand' : 'drag-preview-dot'
     dot.innerHTML = size
-    dragImage.appendChild(layer)
-    dragImage.appendChild(dot)
+    dragImage.append(layer)
+    dragImage.append(dot)
   }
 
   return dragImage
diff --git a/packages/business/src/views/connections/List.vue b/packages/business/src/views/connections/List.vue
index c651467f48..8f4646497f 100644
--- a/packages/business/src/views/connections/List.vue
+++ b/packages/business/src/views/connections/List.vue
@@ -1,6 +1,6 @@
 <script>
 import { connectionsApi, databaseTypesApi } from '@tap/api'
-import { FilterBar, VIcon } from '@tap/component'
+import { FilterBar, SelectList, VIcon } from '@tap/component'
 
 import i18n from '@tap/i18n'
 
@@ -32,6 +32,7 @@ export default {
     FilterBar,
     UsedTaskDialog,
     PermissionseSettingsCreate,
+    SelectList,
   },
   inject: ['checkAgent', 'buried'],
   data() {
@@ -96,7 +97,6 @@ export default {
           value: 'testing',
         },
       ],
-      databaseTypeOptions: [],
       searchParams: {
         databaseType: null,
         keyword: '',
@@ -114,6 +114,8 @@ export default {
       connectionTaskDialog: false,
 
       connectionDialogProps,
+
+      databaseTypeOptions: [],
     }
   },
   computed: {
@@ -480,20 +482,18 @@ export default {
       }
     },
     handleSelectTag() {
-      let tagList = []
+      const tagList = []
+      const tagMap = {}
+
       this.multipleSelection.forEach((row) => {
-        if (row.listtags) {
-          tagList = [...row.listtags, ...tagList]
-        }
+        row.listtags.forEach((item) => {
+          if (!tagMap[item.id]) {
+            tagList.push(item)
+            tagMap[item.id] = true
+          }
+        })
       })
-      //去重
-      const map = new Map()
-      for (const item of tagList) {
-        if (!map.has(item.id)) {
-          map.set(item.id, item)
-        }
-      }
-      tagList = [...map.values()]
+
       return tagList
     },
     handleOperationClassify(listtags) {
@@ -598,32 +598,30 @@ export default {
           items: this.databaseStatusOptions,
         },
         {
+          slotName: 'databaseType',
           label: this.$t(
             'packages_business_connection_list_form_database_type',
           ),
           key: 'databaseType',
           type: 'select-inner',
-          width: '250px',
+          width: 250,
           // dropdownWidth: '250px',
           filterable: true,
           items: async () => {
-            let data = await databaseTypesApi.get()
-            data = data || []
-            const databaseTypes = []
-            databaseTypes.push(...data)
-            const databaseTypeOptions = databaseTypes.sort((t1, t2) =>
-              t1.name > t2.name ? 1 : t1.name === t2.name ? 0 : -1,
+            const data = await connectionsApi.getDatabaseTypes()
+
+            if (!data?.length) {
+              return []
+            }
+
+            data.sort((t1, t2) =>
+              t1.databaseType.localeCompare(t2.databaseType),
             )
-            //默认全部
-            // let all = {
-            //   name: this.$t('public_select_option_all'),
-            //   type: ''
-            // }
-            // databaseTypeOptions.unshift(all)
-            return databaseTypeOptions.map((item) => {
+
+            return data.map((item) => {
               return {
-                label: item.name,
-                value: item.type,
+                label: item.databaseType,
+                value: item.databaseType,
               }
             })
           },
@@ -667,6 +665,36 @@ export default {
     handlePermissionsSettings() {
       this.$refs.permissionseSettingsCreate.open(this.multipleSelection)
     },
+    async fetchDatabaseTypeOptions() {
+      const data = await connectionsApi.getDatabaseTypes()
+
+      if (!data?.length) {
+        return []
+      }
+
+      data.sort((t1, t2) => t1.databaseType.localeCompare(t2.databaseType))
+
+      this.databaseTypeOptions = data.map((item) => {
+        return { label: item.databaseType, value: item.databaseType }
+      })
+    },
+    handleChangeDatabaseType(value) {
+      const query = {}
+
+      this.filterItems.forEach((item) => {
+        if (!item.slotName && item.value) {
+          query[item.key] = item.value
+        }
+      })
+
+      if (value) {
+        query.databaseType = value
+      }
+
+      this.$router.replace({
+        query,
+      })
+    },
   },
 }
 </script>
@@ -725,6 +753,20 @@ export default {
               }}</ElRadioButton>
             </ElRadioGroup>
           </template>
+
+          <template #databaseType>
+            <SelectList
+              v-model="searchParams.databaseType"
+              :label="
+                $t('packages_business_connection_list_form_database_type')
+              "
+              :items="databaseTypeOptions"
+              filterable
+              clearable
+              @change="handleChangeDatabaseType"
+              @visible-change="fetchDatabaseTypeOptions"
+            />
+          </template>
         </FilterBar>
       </template>
       <template v-if="isDaas" #multipleSelectionActions>
@@ -738,14 +780,13 @@ export default {
           class="btn"
           @click="$refs.table.showClassify(handleSelectTag())"
         >
-          <i class="iconfont icon-biaoqian back-btn-icon" />
           <span> {{ $t('public_button_bulk_tag') }}</span>
         </ElButton>
       </template>
       <ElTableColumn
         v-if="isDaas"
         type="selection"
-        width="38"
+        width="32"
         align="center"
         :reserve-selection="true"
       />
diff --git a/packages/business/src/views/setting/AlarmSetting.vue b/packages/business/src/views/setting/AlarmSetting.vue
index 2169dbbef4..cfce9b552c 100644
--- a/packages/business/src/views/setting/AlarmSetting.vue
+++ b/packages/business/src/views/setting/AlarmSetting.vue
@@ -85,6 +85,9 @@ export default {
         SYSTEM_FLOW_EGINGE_UP: i18n.t(
           'packages_business_setting_alarmnotification_dangrenwuuP',
         ),
+        TASK_INSPECT_DIFFERENCE: i18n.t(
+          'packages_dag_task_inspect_difference_alarm',
+        ),
       },
       alarmRulesColumns: [
         {
diff --git a/packages/business/src/views/task/List.vue b/packages/business/src/views/task/List.vue
index 99857e8639..d389d6091a 100644
--- a/packages/business/src/views/task/List.vue
+++ b/packages/business/src/views/task/List.vue
@@ -6,8 +6,7 @@ import {
   taskApi,
   workerApi,
 } from '@tap/api'
-import { FilterBar, SelectList } from '@tap/component'
-import InfiniteSelect from '@tap/form/src/components/infinite-select/InfiniteSelect.vue'
+import { DownBoldOutlined, FilterBar, SelectList } from '@tap/component'
 import i18n from '@tap/i18n'
 import { generateId } from '@tap/shared'
 import dayjs from 'dayjs'
@@ -32,7 +31,7 @@ export default {
   name: 'List',
 
   components: {
-    InfiniteSelect,
+    DownBoldOutlined,
     DatabaseIcon,
     FilterBar,
     SelectList,
@@ -552,20 +551,18 @@ export default {
     },
 
     handleSelectTag() {
-      let tagList = []
+      const tagList = []
+      const tagMap = {}
+
       this.multipleSelection.forEach((row) => {
-        if (row.listtags) {
-          tagList = [...row.listtags, ...tagList]
-        }
+        row.listtags.forEach((item) => {
+          if (!tagMap[item.id]) {
+            tagList.push(item)
+            tagMap[item.id] = true
+          }
+        })
       })
-      //去重
-      const map = new Map()
-      for (const item of tagList) {
-        if (!map.has(item.id)) {
-          map.set(item.id, item)
-        }
-      }
-      tagList = [...map.values()]
+
       return tagList
     },
 
@@ -1008,10 +1005,7 @@ export default {
 </script>
 
 <template>
-  <section
-    v-loading="restLoading"
-    class="data-flow-wrap rounded-lg overflow-hidden"
-  >
+  <section v-loading="restLoading" class="data-flow-wrap rounded-lg">
     <TablePage
       ref="table"
       row-key="id"
@@ -1121,7 +1115,9 @@ export default {
             <span>
               {{ $t('packages_business_dataFlow_taskBulkOperation') }}</span
             >
-            <i class="el-icon-arrow-down el-icon--right" />
+            <el-icon class="ml-1">
+              <DownBoldOutlined />
+            </el-icon>
           </ElButton>
           <template #dropdown>
             <ElDropdownMenu>
@@ -1164,9 +1160,10 @@ export default {
       </template>
 
       <el-table-column
+        class-name="cell-no-padding"
         reserve-selection
         type="selection"
-        width="38"
+        width="32"
         align="center"
         :selectable="
           (row) =>
@@ -1188,7 +1185,7 @@ export default {
               v-else
               role="ellipsis"
               type="primary"
-              underline="hover"
+              underline="never"
               class="justify-content-start ellipsis block mr-1"
               :class="['name', { 'has-children': row.hasChildren }]"
               @click.stop="handleClickName(row)"
diff --git a/packages/business/src/views/verification/Form.vue b/packages/business/src/views/verification/Form.vue
index ac55ec9471..e3c9cce78e 100644
--- a/packages/business/src/views/verification/Form.vue
+++ b/packages/business/src/views/verification/Form.vue
@@ -86,6 +86,7 @@ const defaultTime = ref([
   new Date(2025, 1, 1, 0, 0, 0),
   new Date(2025, 2, 1, 23, 59, 59),
 ])
+const conditionList = ref([])
 
 const taskSelect = useTemplateRef('taskSelect')
 
@@ -108,7 +109,7 @@ const form = reactive({
     keep: 100,
   },
   enabled: true,
-  tasks: [],
+  // tasks: [],
   taskMode: 'pipeline',
   errorNotifys: ['SYSTEM', 'EMAIL'],
   inconsistentNotifys: ['SYSTEM', 'EMAIL'],
@@ -320,6 +321,10 @@ const getData = async (id: string) => {
           return t
         }) || []
 
+      conditionList.value = data.tasks
+
+      delete data.tasks
+
       Object.assign(form, data)
     }
   } catch (error) {
@@ -409,7 +414,7 @@ const goBack = () => {
 const save = async (saveOnly = false) => {
   await baseForm.value.validate(async (valid: boolean) => {
     if (valid) {
-      let tasks = conditionBox.value.getList()
+      let tasks = conditionList.value
       // 自动过滤出完整数据，以及索引字段数量不相等的情况
       tasks = tasks.filter((t) => {
         if (
@@ -472,7 +477,13 @@ const save = async (saveOnly = false) => {
               script,
               webScript,
               jsEngineName,
+              modeType,
             }) => {
+              if (modeType === 'all') {
+                source.columns = null
+                target.columns = null
+              }
+
               if (webScript && webScript !== '') {
                 script = `function validate(sourceRow){${webScript}}`
               }
@@ -592,6 +603,7 @@ const openTaskSelect = () => {
 fetchDatabaseTypes()
 
 provide('formData', form)
+provide('conditionList', conditionList)
 provide('ConnectorMap', ConnectorMap)
 </script>
 
@@ -604,41 +616,42 @@ provide('ConnectorMap', ConnectorMap)
     <ElForm
       ref="baseForm"
       class="grey"
-      label-position="left"
-      label-width="auto"
+      label-position="top"
       :model="form"
       :rules="rules"
       :validate-on-rule-change="false"
     >
-      <ElFormItem
-        v-if="form.taskMode === 'pipeline'"
-        required
-        class="form-item"
-        prop="flowId"
-        :label="`${$t('packages_business_verification_chooseJob')}: `"
-      >
-        <InfiniteSelect
-          ref="taskSelect"
-          v-model="form.flowId"
-          class="form-input"
-          :method="getTaskOptions"
-          :current-label="taskName"
-          item-label="name"
-          item-value="id"
-          item-query="name"
-          :page-size="10000000000"
-          @option-select="handleSelectTask"
-        />
-      </ElFormItem>
-
-      <ElFormItem
-        required
-        class="form-item"
-        prop="name"
-        :label="`${$t('packages_business_verification_task_name')}: `"
-      >
-        <ElInput v-model="form.name" class="form-input" />
-      </ElFormItem>
+      <div class="flex gap-4">
+        <ElFormItem
+          v-if="form.taskMode === 'pipeline'"
+          required
+          class="form-item"
+          prop="flowId"
+          :label="`${$t('packages_business_verification_chooseJob')}: `"
+        >
+          <InfiniteSelect
+            ref="taskSelect"
+            v-model="form.flowId"
+            class="form-input"
+            :method="getTaskOptions"
+            :current-label="taskName"
+            item-label="name"
+            item-value="id"
+            item-query="name"
+            :page-size="10000000000"
+            @option-select="handleSelectTask"
+          />
+        </ElFormItem>
+
+        <ElFormItem
+          required
+          class="form-item"
+          prop="name"
+          :label="`${$t('packages_business_verification_task_name')}: `"
+        >
+          <ElInput v-model="form.name" class="form-input" />
+        </ElFormItem>
+      </div>
 
       <ElFormItem
         required
@@ -1088,9 +1101,9 @@ provide('ConnectorMap', ConnectorMap)
   color: map.get($fontColor, dark);
 }
 
-.form-item {
-  margin-bottom: 32px;
-}
+// .form-item {
+//   margin-bottom: 32px;
+// }
 
 .form-select {
   width: 276px;
diff --git a/packages/business/src/views/verification/components/CollateMap.vue b/packages/business/src/views/verification/components/CollateMap.vue
index c67b725f2a..75b70be116 100644
--- a/packages/business/src/views/verification/components/CollateMap.vue
+++ b/packages/business/src/views/verification/components/CollateMap.vue
@@ -82,7 +82,7 @@ export default defineComponent({
 </script>
 
 <template>
-  <div class="py-3 flex flex-column gap-3">
+  <div class="flex flex-column gap-3">
     <div class="flex flex-column gap-3">
       <FieldSelect
         v-model="selectedFields"
diff --git a/packages/business/src/views/verification/components/ConditionBox.vue b/packages/business/src/views/verification/components/ConditionBox.vue
index 67c2921129..205ea7022b 100644
--- a/packages/business/src/views/verification/components/ConditionBox.vue
+++ b/packages/business/src/views/verification/components/ConditionBox.vue
@@ -4,10 +4,9 @@ import { action } from '@formily/reactive'
 import { connectionsApi, metadataInstancesApi } from '@tap/api'
 import { GitBook, VCodeEditor } from '@tap/component'
 import SwitchNumber from '@tap/component/src/SwitchNumber.vue'
-import { AsyncSelect, JsonEditor, SqlEditor } from '@tap/form'
+import { InfiniteSelect as AsyncSelect, JsonEditor, SqlEditor } from '@tap/form'
 import i18n from '@tap/i18n'
 import { uuid } from '@tap/shared'
-import { ElMessage, ElMessageBox } from 'element-plus'
 import {
   cloneDeep,
   debounce,
@@ -141,6 +140,7 @@ interface StageItem {
 }
 
 const formData = inject('formData')
+const conditionList = inject('conditionList')
 const ConnectorMap = inject('ConnectorMap')
 
 // Props and Emits
@@ -164,13 +164,11 @@ const webScript = ref('')
 const jsEngineName = ref('graal.js')
 const doc = ref('')
 const currentPage = ref(1)
-const pageSize = ref(10)
+const pageSize = ref(5)
 const autoSuggestJoinFields = ref(true)
 const searchValue = ref('')
 const fieldDialog = ref()
-
-// Computed Properties
-const list = computed(() => formData.tasks)
+const filteredList = ref([])
 
 const flowStages = computed(() => {
   const types = props.isDB ? ['database'] : ['table']
@@ -181,17 +179,16 @@ const isCountOrHash = computed(() => {
   return props.inspectMethod === 'row_count' || props.inspectMethod === 'hash'
 })
 
-const filteredList = computed(() => {
-  if (!searchValue.value) return list.value
-
-  const searchTerm = searchValue.value.toLowerCase()
-  return list.value.filter((item) => {
-    const sourceTable = (item.source.table || '').toLowerCase()
-    const targetTable = (item.target.table || '').toLowerCase()
+// const filteredList = computed(() => {
+//   if (!searchValue.value) return conditionList.value
 
-    return sourceTable.includes(searchTerm) || targetTable.includes(searchTerm)
-  })
-})
+//   const searchTerm = searchValue.value.toLowerCase()
+//   return conditionList.value.filter((item) => {
+//     const sourceTable = (item.source.table || '').toLowerCase()
+//     const targetTable = (item.target.table || '').toLowerCase()
+//     return sourceTable.includes(searchTerm) || targetTable.includes(searchTerm)
+//   })
+// })
 
 const paginatedList = computed(() => {
   const startIndex = (currentPage.value - 1) * pageSize.value
@@ -214,10 +211,10 @@ const openApiDrawer = (path: string) => {
   showDoc.value = true
 }
 
-const hasCapability = (obj, capability) => {
-  if (!obj.databaseType) return false
+const hasCapability = (databaseType: string, capability: string) => {
+  if (!databaseType) return false
 
-  const item = ConnectorMap.value[obj.databaseType]
+  const item = ConnectorMap.value[databaseType]
 
   return item?.capabilityMap[capability]
 }
@@ -572,14 +569,14 @@ const handleClearIndexEmpty = () => {
       return
     }
 
-    formData.tasks = formData.tasks.filter(
+    conditionList.value = conditionList.value.filter(
       (t) => t.source.sortColumn && t.target.sortColumn,
     )
   })
 }
 
 const clearList = () => {
-  formData.tasks = []
+  conditionList.value = []
   currentPage.value = 1
   validate()
 }
@@ -598,7 +595,7 @@ const getItemOptions = () => {
 }
 
 const addItem = () => {
-  list.value.push(getItemOptions())
+  conditionList.value.push(getItemOptions())
   currentPage.value = totalPages.value
 
   nextTick(() => {
@@ -611,19 +608,19 @@ const addItem = () => {
 }
 
 const removeItem = (id: string) => {
-  const index = formData.tasks.findIndex((t) => t.id === id)
+  const index = conditionList.value.findIndex((t) => t.id === id)
   if (index !== -1) {
-    formData.tasks.splice(index, 1)
+    conditionList.value.splice(index, 1)
   }
 
   // If current page is now empty and it's not the first page, go to previous page
-  if (paginatedList.value.length === 0 && currentPage.value > 1) {
+  if (conditionList.value.length === 0 && currentPage.value > 1) {
     currentPage.value--
   }
 }
 
 const autoAddTable = async () => {
-  if (!props.taskId || formData.tasks.length) return
+  if (!props.taskId || conditionList.value.length) return
   autoAddTableLoading.value = true
   updateAutoAddTableLoading()
   const connectionSet = new Set()
@@ -809,7 +806,7 @@ const autoAddTable = async () => {
           i18n.t('packages_business_components_conditionbox_suoxuanrenwuque'),
         )
       }
-      formData.tasks = newItems
+      conditionList.value = newItems
 
       // 显示提示
       validate()
@@ -821,7 +818,7 @@ const autoAddTable = async () => {
 }
 
 const getList = () => {
-  const listData = formData.tasks
+  const listData = conditionList.value
   if (props.taskId) {
     listData.forEach((el: any) => {
       if (el.modeType === 'all') {
@@ -1003,7 +1000,7 @@ const handleAddScriptClose = () => {
 }
 
 const submitScript = () => {
-  const task = formData.tasks
+  const task = conditionList.value
   const currentFormIndex = formIndex.value
   task[currentFormIndex].webScript = webScript.value
   task[currentFormIndex].jsEngineName = jsEngineName.value
@@ -1015,7 +1012,7 @@ const submitScript = () => {
 
 const editScript = (index: number) => {
   formIndex.value = index
-  const task = paginatedList.value
+  const task = conditionList.value
   const script = JSON.parse(JSON.stringify(task[formIndex.value].webScript))
   jsEngineName.value = JSON.parse(
     JSON.stringify(task[formIndex.value].jsEngineName || 'nashorn'),
@@ -1220,11 +1217,11 @@ const validate = async () => {
 const validateCapabilities = (tasks: any[], capability: string) => {
   const noSupportList = new Set()
   tasks.forEach((item) => {
-    if (!hasCapability(item.source, capability)) {
+    if (!hasCapability(item.source.databaseType, capability)) {
       noSupportList.add(item.source.databaseType)
     }
 
-    if (!hasCapability(item.target, capability)) {
+    if (!hasCapability(item.target.databaseType, capability)) {
       noSupportList.add(item.target.databaseType)
     }
   })
@@ -1361,7 +1358,7 @@ const handleChangeModeType = (val: string, item: any) => {
 }
 
 const handleChangeFields = (data: any[] = [], id: string) => {
-  const item = formData.tasks.find((t) => t.id === id)
+  const item = conditionList.value.find((t) => t.id === id)
 
   item.source.columns = data.map((t) => t.source)
   item.target.columns = data.map((t) => t.target)
@@ -1457,6 +1454,7 @@ const isNullsLast = (item: any) => {
 // Lifecycle Hooks
 onMounted(() => {
   loadDoc()
+  handleSearch('')
 })
 
 // Expose methods to parent component
@@ -1465,6 +1463,25 @@ defineExpose({
   getList,
   validate,
 })
+
+const handleSearch = debounce((value: string) => {
+  console.log('handleSearch', value)
+  if (!value) {
+    filteredList.value = conditionList.value
+    return
+  }
+
+  const searchTerm = value.toLowerCase()
+  filteredList.value = conditionList.value.filter((item) => {
+    const sourceTable = (item.source.table || '').toLowerCase()
+    const targetTable = (item.target.table || '').toLowerCase()
+    return sourceTable.includes(searchTerm) || targetTable.includes(searchTerm)
+  })
+}, 300)
+
+watch(conditionList, () => {
+  handleSearch(searchValue.value)
+})
 </script>
 
 <template>
@@ -1499,8 +1516,10 @@ defineExpose({
           <ElInput
             v-model="searchValue"
             :placeholder="$t('packages_form_table_rename_index_sousuobiaoming')"
-            class="w-auto mr-4"
+            class="mr-4"
+            style="width: 240px"
             clearable
+            @input="handleSearch"
           >
             <template #prefix>
               <VIcon size="14" class="ml-1 h-100">search-outline</VIcon>
@@ -1509,11 +1528,13 @@ defineExpose({
           <ElButton
             v-if="
               !isCountOrHash &&
-              list.some((t) => !t.source.sortColumn || !t.target.sortColumn)
+              conditionList.some(
+                (t) => !t.source.sortColumn || !t.target.sortColumn,
+              )
             "
             text
             type="primary"
-            :disabled="!list.length"
+            :disabled="!conditionList.length"
             @click="handleClearIndexEmpty"
             >{{
               $t('packages_business_components_conditionbox_yijianqingchusuo')
@@ -1522,9 +1543,11 @@ defineExpose({
           <ElButton
             text
             type="primary"
-            :disabled="!list.length"
+            :disabled="!conditionList.length"
             @click="handleClear"
-            >{{ $t('packages_business_verification_clear') }}
+          >
+            <VIcon class="mr-1">close</VIcon>
+            {{ $t('packages_business_verification_clear') }}
           </ElButton>
         </div>
       </div>
@@ -1543,7 +1566,7 @@ defineExpose({
             (currentPage - 1) * pageSize + index + 1
           }}</span>
           <div class="joint-table-setting overflow-hidden">
-            <div class="flex justify-content-between">
+            <div class="flex justify-content-between mb-2">
               <div
                 class="cond-item__title flex align-items-center gap-2 text-truncate min-w-0"
               >
@@ -1573,359 +1596,328 @@ defineExpose({
                 <span>/</span>
                 <span class="fw-sub">{{ item.target.table || '-' }}</span>
               </div>
-              <div class="flex align-items-center">
-                <ElButton text type="danger" @click.stop="removeItem(item.id)">
-                  <VIcon class="mr-1">delete</VIcon>
-                  {{ $t('public_button_delete') }}</ElButton
-                >
-              </div>
+              <ElButton
+                class="condition-del-btn"
+                text
+                type="danger"
+                @click.stop="removeItem(item.id)"
+              >
+                <VIcon class="mr-1">delete</VIcon>
+                {{ $t('public_button_delete') }}</ElButton
+              >
             </div>
-            <div :key="`connection${item.id}`" class="setting-item mt-4">
-              <label class="item-label"
-                >{{
-                  $t(
-                    'packages_business_components_conditionbox_daijiaoyanlianjie',
-                  )
-                }}:</label
+
+            <div class="flex gap-4">
+              <el-form-item
+                class="flex-1"
+                :label="$t('public_source_connection')"
+              >
+                <AsyncSelect
+                  v-model="item.source.connectionId"
+                  :method="getConnectionsListMethod"
+                  item-query="name"
+                  item-value="id"
+                  filterable
+                />
+              </el-form-item>
+
+              <el-form-item
+                class="flex-1"
+                :label="$t('public_target_connection')"
               >
-              <AsyncSelect
-                :key="`sourceConnectionId${item.id}`"
-                v-model="item.source.connectionId"
-                :method="getConnectionsListMethod"
-                item-query="name"
-                item-value="id"
-                filterable
-                class="item-select"
-                @option-select="handleChangeConnection($event, item.source)"
-              />
-              <span class="item-icon fs-6">
-                <el-icon><el-icon-arrow-right /></el-icon>
-              </span>
-              <AsyncSelect
-                :key="`targetConnectionId${item.id}`"
-                v-model="item.target.connectionId"
-                :method="getConnectionsListMethod"
-                item-query="name"
-                item-value="id"
-                filterable
-                class="item-select"
-                @option-select="handleChangeConnection($event, item.target)"
-              />
+                <AsyncSelect
+                  v-model="item.source.connectionId"
+                  :method="getConnectionsListMethod"
+                  item-query="name"
+                  item-value="id"
+                  filterable
+                />
+              </el-form-item>
             </div>
-            <div :key="`table${item.id}`" class="setting-item mt-4">
-              <label class="item-label"
-                >{{
+
+            <div class="flex gap-4">
+              <el-form-item
+                class="flex-1"
+                :label="
                   $t('packages_business_components_conditionbox_laiyuanbiao')
-                }}:</label
+                "
               >
-              <AsyncSelect
-                :key="`sourceTable${item.id}`"
-                v-model="item.source.table"
-                :method="getTableListMethod"
-                :params="{
-                  connectionId: item.source.connectionId,
-                  nodeId: item.source.nodeId,
-                }"
-                item-query="name"
-                item-type="string"
-                lazy
-                filterable
-                class="item-select"
-                @change="handleChangeTable($event, item, index, 'source')"
-              />
-              <span class="item-icon"
-                >{{
+                <AsyncSelect
+                  v-model="item.source.table"
+                  :method="getTableListMethod"
+                  :params="{
+                    connectionId: item.source.connectionId,
+                    nodeId: item.source.nodeId,
+                  }"
+                  item-query="name"
+                  item-type="string"
+                  lazy
+                  filterable
+                  class="item-select"
+                  @change="handleChangeTable($event, item, index, 'source')"
+                />
+              </el-form-item>
+
+              <el-form-item
+                class="flex-1"
+                :label="
                   $t('packages_business_components_conditionbox_mubiaobiao')
-                }}:</span
+                "
               >
-              <AsyncSelect
-                :key="`targetTable${item.id}`"
-                v-model="item.target.table"
-                :method="getTableListMethod"
-                :params="{
-                  connectionId: item.target.connectionId,
-                  nodeId: item.target.nodeId,
-                }"
-                item-query="name"
-                item-type="string"
-                lazy
-                filterable
-                class="item-select"
-                @change="handleChangeTable($event, item, index, 'target')"
-              />
+                <AsyncSelect
+                  v-model="item.target.table"
+                  :method="getTableListMethod"
+                  :params="{
+                    connectionId: item.target.connectionId,
+                    nodeId: item.target.nodeId,
+                  }"
+                  item-query="name"
+                  item-type="string"
+                  lazy
+                  filterable
+                  class="item-select"
+                  @change="handleChangeTable($event, item, index, 'target')"
+                />
+              </el-form-item>
             </div>
 
-            <div class="flex gap-4 setting-item">
-              <div class="flex-1">
-                <div
-                  v-if="hasCapability(item.source, 'execute_command_function')"
-                  class="mt-4 flex align-center"
-                >
-                  <label class="item-label">
-                    <el-text>
-                      {{
+            <div class="grid gap-4 grid-cols-2">
+              <el-form-item
+                v-if="
+                  hasCapability(
+                    item.source.databaseType,
+                    'execute_command_function',
+                  )
+                "
+                label-position="left"
+                class="col-start-1 mb-2"
+              >
+                <template #label>
+                  <el-text>
+                    {{
+                      $t(
+                        'packages_business_components_conditionbox_laiyuanbiaoshuju',
+                      )
+                    }}
+
+                    <el-tooltip
+                      effect="dark"
+                      placement="top"
+                      :content="
                         $t(
-                          'packages_business_components_conditionbox_laiyuanbiaoshuju',
+                          'packages_business_components_conditionbox_enableCustomCommand_tip',
                         )
-                      }}
-                      <el-tooltip
-                        effect="dark"
-                        placement="top"
-                        :content="
-                          $t(
-                            'packages_business_components_conditionbox_enableCustomCommand_tip',
-                          )
-                        "
-                        ><el-icon color="#909399"
-                          ><InfoFilled
-                        /></el-icon> </el-tooltip
-                      ><span class="ml-0.5 mr-2">:</span>
-                    </el-text>
-                  </label>
-                  <el-switch
-                    v-model="item.source.enableCustomCommand"
-                    @change="handleChangeCustomCommand($event, item.source)"
-                  />
+                      "
+                    >
+                      <el-icon color="#909399"><InfoFilled /></el-icon>
+                    </el-tooltip>
+                  </el-text>
+                </template>
+                <el-switch
+                  v-model="item.source.enableCustomCommand"
+                  @change="handleChangeCustomCommand($event, item.source)"
+                />
+              </el-form-item>
 
+              <el-form-item
+                v-if="
+                  hasCapability(
+                    item.target.databaseType,
+                    'execute_command_function',
+                  )
+                "
+                label-position="left"
+                class="col-start-2 mb-2"
+              >
+                <template #label>
+                  <el-text>
+                    {{
+                      $t(
+                        'packages_business_components_conditionbox_laiyuanbiaoshuju',
+                      )
+                    }}
+
+                    <el-tooltip
+                      effect="dark"
+                      placement="top"
+                      :content="
+                        $t(
+                          'packages_business_components_conditionbox_enableCustomCommand_tip',
+                        )
+                      "
+                    >
+                      <el-icon color="#909399"><InfoFilled /></el-icon>
+                    </el-tooltip>
+                  </el-text>
+                </template>
+                <el-switch
+                  v-model="item.target.enableCustomCommand"
+                  @change="handleChangeCustomCommand($event, item.target)"
+                />
+              </el-form-item>
+            </div>
+
+            <div class="grid gap-4 grid-cols-2">
+              <el-form-item
+                v-if="item.source.enableCustomCommand"
+                class="col-start-1"
+              >
+                <div
+                  v-if="
+                    item.source.databaseType.toLowerCase().includes('mongo')
+                  "
+                  class="flex-1"
+                >
+                  <template
+                    v-if="item.source.customCommand.command === 'executeQuery'"
+                  >
+                    <JsonEditor
+                      v-model:value="item.source.customCommand.params.filter"
+                    />
+                    <div class="flex align-center flex-wrap">
+                      <el-text>{{
+                        $t('packages_dag_nodes_table_jinzhichiqu')
+                      }}</el-text>
+                      <el-button text type="primary" @click="openApiDrawer">
+                        {{ $t('packages_business_view_more_apis') }}
+                      </el-button>
+                    </div>
+                  </template>
                   <template
-                    v-if="
-                      item.source.enableCustomCommand &&
-                      item.source.databaseType.toLowerCase().includes('mongo')
+                    v-else-if="
+                      item.source.customCommand.command === 'aggregate'
                     "
                   >
-                    <el-divider direction="vertical" class="mx-4" />
-                    <el-radio-group v-model="item.source.customCommand.command">
-                      <el-radio value="executeQuery">{{
-                        $t('public_query')
-                      }}</el-radio>
-                      <el-radio value="aggregate">{{
-                        $t('public_aggregate')
-                      }}</el-radio>
-                    </el-radio-group>
+                    <JsonEditor
+                      v-model:value="item.source.customCommand.params.pipeline"
+                    />
+                    <div class="flex align-center flex-wrap">
+                      <el-text>{{
+                        $t('packages_dag_nodes_table_shiligro')
+                      }}</el-text>
+                      <el-button text type="primary" @click="openApiDrawer">
+                        {{ $t('packages_business_view_more_apis') }}
+                      </el-button>
+                    </div>
                   </template>
                 </div>
-              </div>
-              <div class="flex-1">
+                <SqlEditor
+                  v-else
+                  v-model:value="item.source.customCommand.params.sql"
+                />
+              </el-form-item>
+
+              <el-form-item
+                v-if="item.target.enableCustomCommand"
+                class="col-start-2"
+              >
                 <div
-                  v-if="hasCapability(item.target, 'execute_command_function')"
-                  class="mt-4 flex align-center"
+                  v-if="
+                    item.target.databaseType.toLowerCase().includes('mongo')
+                  "
+                  class="flex-1"
                 >
-                  <label class="item-label">
-                    <el-text>
-                      {{
-                        $t(
-                          'packages_business_components_conditionbox_laiyuanbiaoshuju',
-                        )
-                      }}
-                      <el-tooltip
-                        effect="dark"
-                        placement="top"
-                        :content="
-                          $t(
-                            'packages_business_components_conditionbox_enableCustomCommand_tip',
-                          )
-                        "
-                        ><el-icon color="#909399"
-                          ><InfoFilled
-                        /></el-icon> </el-tooltip
-                      ><span class="ml-0.5 mr-2">:</span>
-                    </el-text>
-                  </label>
-                  <el-switch
-                    v-model="item.target.enableCustomCommand"
-                    @change="handleChangeCustomCommand($event, item.target)"
-                  />
                   <template
-                    v-if="
-                      item.target.enableCustomCommand &&
-                      item.target.databaseType.toLowerCase().includes('mongo')
+                    v-if="item.target.customCommand.command === 'executeQuery'"
+                  >
+                    <JsonEditor
+                      v-model:value="item.target.customCommand.params.filter"
+                    />
+                    <div class="flex align-center flex-wrap">
+                      <el-text>{{
+                        $t('packages_dag_nodes_table_jinzhichiqu')
+                      }}</el-text>
+                      <el-button text type="primary" @click="openApiDrawer">
+                        {{ $t('packages_business_view_more_apis') }}
+                      </el-button>
+                    </div>
+                  </template>
+                  <template
+                    v-else-if="
+                      item.target.customCommand.command === 'aggregate'
                     "
                   >
-                    <el-divider direction="vertical" class="mx-4" />
-                    <el-radio-group v-model="item.target.customCommand.command">
-                      <el-radio value="executeQuery">{{
-                        $t('public_query')
-                      }}</el-radio>
-                      <el-radio value="aggregate">{{
-                        $t('public_aggregate')
-                      }}</el-radio>
-                    </el-radio-group>
+                    <JsonEditor
+                      v-model:value="item.target.customCommand.params.pipeline"
+                    />
+                    <div class="flex align-center flex-wrap">
+                      <el-text>{{
+                        $t('packages_dag_nodes_table_shiligro')
+                      }}</el-text>
+                      <el-button text type="primary" @click="openApiDrawer">
+                        {{ $t('packages_business_view_more_apis') }}
+                      </el-button>
+                    </div>
                   </template>
                 </div>
-              </div>
+                <SqlEditor
+                  v-else
+                  v-model:value="item.target.customCommand.params.sql"
+                />
+              </el-form-item>
             </div>
 
-            <div class="flex gap-4 setting-item">
-              <div class="flex-1">
-                <div v-if="item.source.enableCustomCommand" class="mt-4 flex">
-                  <label class="item-label" />
-                  <div
-                    v-if="
-                      item.source.databaseType.toLowerCase().includes('mongo')
-                    "
-                    class="flex-1"
-                  >
-                    <template
-                      v-if="
-                        item.source.customCommand.command === 'executeQuery'
-                      "
-                    >
-                      <JsonEditor
-                        v-model:value="item.source.customCommand.params.filter"
-                      />
-                      <div class="flex align-center flex-wrap">
-                        <el-text>{{
-                          $t('packages_dag_nodes_table_jinzhichiqu')
-                        }}</el-text>
-                        <el-button text type="primary" @click="openApiDrawer">
-                          {{ $t('packages_business_view_more_apis') }}
-                        </el-button>
-                      </div>
-                    </template>
-                    <template
-                      v-else-if="
-                        item.source.customCommand.command === 'aggregate'
-                      "
-                    >
-                      <JsonEditor
-                        v-model:value="
-                          item.source.customCommand.params.pipeline
-                        "
-                      />
-                      <div class="flex align-center flex-wrap">
-                        <el-text>{{
-                          $t('packages_dag_nodes_table_shiligro')
-                        }}</el-text>
-                        <el-button text type="primary" @click="openApiDrawer">
-                          {{ $t('packages_business_view_more_apis') }}
-                        </el-button>
-                      </div>
-                    </template>
-                  </div>
-                  <SqlEditor
-                    v-else
-                    v-model:value="item.source.customCommand.params.sql"
+            <template v-if="!isCountOrHash">
+              <div class="grid gap-4 grid-cols-2">
+                <el-form-item
+                  class="col-start-1"
+                  :label="$t('packages_business_verification_indexField')"
+                >
+                  <FieldSelectWrap
+                    v-model:value="item.source.sortColumn"
+                    :options="item.source.fields"
                   />
-                </div>
-              </div>
+                </el-form-item>
 
-              <div class="flex-1">
-                <div v-if="item.target.enableCustomCommand" class="mt-4 flex">
-                  <label class="item-label" />
-                  <div
-                    v-if="
-                      item.target.databaseType.toLowerCase().includes('mongo')
-                    "
-                    class="flex-1"
-                  >
-                    <template
-                      v-if="
-                        item.target.customCommand.command === 'executeQuery'
-                      "
-                    >
-                      <JsonEditor
-                        v-model:value="item.target.customCommand.params.filter"
-                      />
-                      <div class="flex align-center flex-wrap">
-                        <el-text>{{
-                          $t('packages_dag_nodes_table_jinzhichiqu')
-                        }}</el-text>
-                        <el-button text type="primary" @click="openApiDrawer">
-                          {{ $t('packages_business_view_more_apis') }}
-                        </el-button>
-                      </div>
-                    </template>
-                    <template
-                      v-else-if="
-                        item.target.customCommand.command === 'aggregate'
-                      "
-                    >
-                      <JsonEditor
-                        v-model:value="
-                          item.target.customCommand.params.pipeline
-                        "
-                      />
-                      <div class="flex align-center flex-wrap">
-                        <el-text>{{
-                          $t('packages_dag_nodes_table_shiligro')
-                        }}</el-text>
-                        <el-button text type="primary" @click="openApiDrawer">
-                          {{ $t('packages_business_view_more_apis') }}
-                        </el-button>
-                      </div>
-                    </template>
-                  </div>
-                  <SqlEditor
-                    v-else
-                    v-model:value="item.target.customCommand.params.sql"
+                <el-form-item
+                  class="col-start-2"
+                  :label="$t('packages_business_verification_indexField')"
+                >
+                  <FieldSelectWrap
+                    v-model:value="item.target.sortColumn"
+                    :options="item.target.fields"
+                    :loading="item.target.fieldsLoading"
+                    @visible-change="onVisibleChange(item.target, $event)"
                   />
-                </div>
-              </div>
-            </div>
-
-            <template v-if="!isCountOrHash">
-              <div class="setting-item mt-4">
-                <label class="item-label"
-                  >{{ $t('packages_business_verification_indexField') }}:
-                </label>
-                <FieldSelectWrap
-                  v-model:value="item.source.sortColumn"
-                  :options="item.source.fields"
-                  class="flex-1"
-                  :loading="item.source.fieldsLoading"
-                  @visible-change="onVisibleChange(item.source, $event)"
-                />
-                <span class="item-icon" />
-                <FieldSelectWrap
-                  v-model:value="item.target.sortColumn"
-                  :options="item.target.fields"
-                  class="flex-1"
-                  :loading="item.target.fieldsLoading"
-                  @visible-change="onVisibleChange(item.target, $event)"
-                />
+                </el-form-item>
               </div>
 
-              <div class="setting-item mt-4">
-                <label class="item-label"
-                  >{{ $t('packages_business_custom_collate') }}:
-                </label>
-                <div class="flex-1">
-                  <div class="flex gap-3 align-center">
+              <div class="grid gap-4 grid-cols-2">
+                <el-form-item
+                  label-position="left"
+                  class="col-start-1 mb-2"
+                  :label="$t('packages_business_custom_collate')"
+                >
+                  <div class="flex-1">
                     <ElSwitch
                       v-model="item.source.enableCustomCollate"
                       @change="toggleCollate(item.source, $event)"
                     />
-
                     <ElButton
                       text
                       type="primary"
+                      class="ml-2"
                       @click="openApiDrawer('inspect-collate')"
                     >
                       <VIcon class="mr-1">question-circle</VIcon>
                       {{ $t('public_view_docs') }}
                     </ElButton>
                   </div>
+                </el-form-item>
 
-                  <div v-if="item.source.enableCustomCollate">
-                    <CollateMap
-                      v-model:value="item.source.collate"
-                      :sort-column="item.source.sortColumn"
-                      :fields="item.source.fields"
-                      :loading="item.source.fieldsLoading"
-                      @visible-change="onVisibleChange(item.source, $event)"
-                    />
-                  </div>
-                </div>
-                <span class="item-icon" />
-                <div class="flex-1">
-                  <div class="flex gap-3 align-center">
+                <el-form-item
+                  label-position="left"
+                  class="col-start-2 mb-2"
+                  :label="$t('packages_business_custom_collate')"
+                >
+                  <div class="flex-1">
                     <ElSwitch
                       v-model="item.target.enableCustomCollate"
                       @change="toggleCollate(item.target, $event)"
                     />
-
                     <ElButton
                       text
+                      class="ml-2"
                       type="primary"
                       @click="openApiDrawer('inspect-collate')"
                     >
@@ -1933,153 +1925,195 @@ defineExpose({
                       {{ $t('public_view_docs') }}
                     </ElButton>
                   </div>
-
-                  <div v-if="item.target.enableCustomCollate">
-                    <CollateMap
-                      v-model:value="item.target.collate"
-                      :sort-column="item.target.sortColumn"
-                      :fields="item.target.fields"
-                      :loading="item.target.fieldsLoading"
-                      @visible-change="onVisibleChange(item.target, $event)"
-                    />
-                  </div>
-                </div>
+                </el-form-item>
               </div>
 
-              <div
-                v-if="isNullsLast(item.source) || isNullsLast(item.target)"
-                class="setting-item mt-4 align-items-center"
-              >
-                <label v-if="isNullsLast(item.source)" class="item-label"
-                  >{{ $t('packages_business_nulls_first') }}
-                  <el-tooltip
-                    effect="dark"
-                    placement="top"
-                    :content="$t('packages_business_nulls_first_tip')"
-                  >
-                    <i
-                      class="el-tooltip el-icon-info"
-                      style="color: #909399; font-size: 14px"
-                    /> </el-tooltip
-                  >:
-                </label>
-                <label v-else class="item-label" />
-                <div class="flex-1">
-                  <SwitchNumber
-                    v-if="isNullsLast(item.source)"
-                    v-model:value="item.source.customNullSort"
+              <div class="grid gap-4 grid-cols-2">
+                <div
+                  v-if="item.source.enableCustomCollate"
+                  class="col-start-1 mb-4"
+                >
+                  <CollateMap
+                    v-model:value="item.source.collate"
+                    :sort-column="item.source.sortColumn"
+                    :fields="item.source.fields"
+                    :loading="item.source.fieldsLoading"
+                    @visible-change="onVisibleChange(item.source, $event)"
                   />
                 </div>
+                <div
+                  v-if="item.target.enableCustomCollate"
+                  class="col-start-2 mb-4"
+                >
+                  <CollateMap
+                    v-model:value="item.target.collate"
+                    :sort-column="item.target.sortColumn"
+                    :fields="item.target.fields"
+                    :loading="item.target.fieldsLoading"
+                    @visible-change="onVisibleChange(item.target, $event)"
+                  />
+                </div>
+              </div>
 
-                <span v-if="isNullsLast(item.target)" class="item-icon"
-                  >{{ $t('packages_business_nulls_first')
-                  }}<el-tooltip
-                    effect="dark"
-                    placement="top"
-                    :content="$t('packages_business_nulls_first_tip')"
-                  >
-                    <i
-                      class="el-tooltip el-icon-info"
-                      style="color: #909399; font-size: 14px"
-                    /> </el-tooltip
-                  >:</span
+              <div class="grid gap-4 grid-cols-2">
+                <el-form-item
+                  v-if="isNullsLast(item.source)"
+                  class="col-start-1"
                 >
-                <div v-if="isNullsLast(item.target)" class="flex-1">
+                  <template #label>
+                    {{ $t('packages_business_nulls_first') }}
+                    <el-tooltip
+                      effect="dark"
+                      placement="top"
+                      :content="$t('packages_business_nulls_first_tip')"
+                    >
+                      <i
+                        class="el-tooltip el-icon-info"
+                        style="color: #909399; font-size: 14px"
+                      />
+                    </el-tooltip>
+                  </template>
+                  <SwitchNumber v-model:value="item.source.customNullSort" />
+                </el-form-item>
+
+                <el-form-item
+                  v-if="isNullsLast(item.target)"
+                  class="col-start-2"
+                  ><template #label>
+                    {{ $t('packages_business_nulls_first') }}
+                    <el-tooltip
+                      effect="dark"
+                      placement="top"
+                      :content="$t('packages_business_nulls_first_tip')"
+                    >
+                      <i
+                        class="el-tooltip el-icon-info"
+                        style="color: #909399; font-size: 14px"
+                      />
+                    </el-tooltip>
+                  </template>
                   <SwitchNumber v-model:value="item.target.customNullSort" />
-                </div>
+                </el-form-item>
               </div>
             </template>
 
+            <el-divider v-if="inspectMethod === 'field'" class="my-2" />
+
             <div
               v-if="inspectMethod === 'field'"
-              class="setting-item align-items-center mt-4"
+              class="grid gap-4 grid-cols-2"
             >
-              <label class="item-label"
-                >{{
+              <el-form-item
+                class="col-start-1 mb-2"
+                label-position="left"
+                :label="
                   $t('packages_business_components_fieldbox_daijiaoyanmoxing')
-                }}:</label
+                "
               >
-              <ElRadioGroup
-                v-model="item.modeType"
-                :disabled="getModeTypeDisabled(item)"
-                @change="handleChangeModeType($event, item)"
-              >
-                <ElRadio value="all">{{
-                  $t('packages_business_components_fieldbox_quanziduan')
-                }}</ElRadio>
-                <ElRadio value="custom">{{
-                  $t('packages_business_connections_databaseform_zidingyi')
-                }}</ElRadio>
-              </ElRadioGroup>
-              <el-divider
-                v-if="item.modeType === 'custom'"
-                direction="vertical"
-                class="mx-2"
-              />
-              <ElButton
-                v-if="item.modeType === 'custom'"
-                text
-                type="primary"
-                @click="handleCustomFields(item)"
-              >
-                {{
-                  $t('packages_business_components_conditionbox_chakanzidingyi')
-                }}
-                ({{ item.source.columns ? item.source.columns.length : 0 }})
-              </ElButton>
-            </div>
-            <div v-show="inspectMethod === 'field'" class="setting-item mt-4">
-              <ElCheckbox
-                v-model="item.showAdvancedVerification"
-                @change="handleChangeAdvanced(item)"
-                >{{ $t('packages_business_verification_advanceVerify') }}
-              </ElCheckbox>
-            </div>
-            <div
-              v-if="item.showAdvancedVerification && inspectMethod === 'field'"
-              class="setting-item mt-4"
-            >
-              <label class="item-label"
-                >{{ $t('packages_business_verification_JSVerifyLogic') }}:
-              </label>
-              <ElButton
-                v-if="!item.webScript || item.webScript === ''"
-                @click="addScript(index)"
-                >{{ $t('packages_business_verification_addJS') }}
-              </ElButton>
-              <template v-else>
-                <ElButton
-                  text
-                  type="primary"
-                  class="ml-4"
-                  @click="editScript(index)"
-                  >{{ $t('public_button_edit') }}</ElButton
+                <ElRadioGroup
+                  v-model="item.modeType"
+                  :disabled="getModeTypeDisabled(item)"
+                  @change="handleChangeModeType($event, item)"
                 >
+                  <ElRadio value="all">{{
+                    $t('packages_business_components_fieldbox_quanziduan')
+                  }}</ElRadio>
+                  <ElRadio value="custom">{{
+                    $t('packages_business_connections_databaseform_zidingyi')
+                  }}</ElRadio>
+                </ElRadioGroup>
+                <el-divider
+                  v-if="item.modeType === 'custom'"
+                  direction="vertical"
+                  class="mx-2"
+                />
                 <ElButton
+                  v-if="item.modeType === 'custom'"
                   text
                   type="primary"
-                  class="ml-4"
-                  @click="removeScript(item)"
-                  >{{ $t('public_button_delete') }}
+                  @click="handleCustomFields(item)"
+                >
+                  {{
+                    $t(
+                      'packages_business_components_conditionbox_chakanzidingyi',
+                    )
+                  }}
+                  ({{ item.source.columns ? item.source.columns.length : 0 }})
                 </ElButton>
-              </template>
+              </el-form-item>
             </div>
+
             <div
-              v-if="
-                inspectMethod === 'field' &&
-                item.showAdvancedVerification &&
-                item.webScript
-              "
-              class="setting-item mt-4"
+              v-if="inspectMethod === 'field'"
+              class="grid gap-4 grid-cols-2"
             >
-              <pre class="item-script">{{ item.webScript }}</pre>
+              <el-form-item
+                label-position="left"
+                class="col-start-1 mb-2"
+                :label="$t('packages_business_verification_advanceVerify')"
+              >
+                <ElSwitch
+                  v-model="item.showAdvancedVerification"
+                  @change="handleChangeAdvanced(item)"
+                />
+              </el-form-item>
+            </div>
+
+            <div
+              v-if="item.showAdvancedVerification && inspectMethod === 'field'"
+              class="grid gap-4 grid-cols-2"
+            >
+              <el-form-item
+                class="col-start-1"
+                :label="$t('packages_business_verification_JSVerifyLogic')"
+              >
+                <template #label>
+                  <span class="flex align-center">
+                    <span class="mr-1">{{
+                      $t('packages_business_verification_JSVerifyLogic')
+                    }}</span>
+                    <el-button
+                      v-if="!item.webScript || item.webScript === ''"
+                      text
+                      type="primary"
+                      @click="addScript(index)"
+                    >
+                      <VIcon class="mr-1">plus</VIcon>
+                      {{
+                        $t('packages_business_verification_addJS')
+                      }}</el-button
+                    >
+                    <template v-else>
+                      <el-button
+                        text
+                        type="primary"
+                        class="ml-4"
+                        @click="editScript(index)"
+                        >{{ $t('public_button_edit') }}</el-button
+                      >
+                      <el-button
+                        text
+                        type="primary"
+                        class="ml-4"
+                        @click="removeScript(item)"
+                        >{{ $t('public_button_delete') }}
+                      </el-button>
+                    </template>
+                  </span>
+                </template>
+                <pre
+                  v-if="item.webScript"
+                  class="m-0 p-2 px-3 lh-base rounded-lg bg-color-main"
+                  >{{ item.webScript }}</pre
+                >
+              </el-form-item>
             </div>
           </div>
         </div>
       </div>
 
       <div
-        v-if="list.length === 0"
+        v-if="conditionList.length === 0"
         class="bg-gray-50 p-4 rounded-xl flex flex-column justify-center align-center gap-2"
       >
         <div class="flex rounded-pill bg-gray-100 p-3">
@@ -2127,7 +2161,10 @@ defineExpose({
         </template>
       </div>
 
-      <div v-if="list.length" class="py-4 condition-footer flex align-center">
+      <div
+        v-if="conditionList.length"
+        class="py-4 condition-footer flex align-center"
+      >
         <ElButton :icon="Plus" @click="addItem">{{
           $t('packages_business_verification_addTable')
         }}</ElButton>
@@ -2168,7 +2205,7 @@ defineExpose({
             v-model:page-size="pageSize"
             hide-on-single-page
             background
-            :page-sizes="[10, 20, 50, 100]"
+            :page-sizes="[5, 10, 20, 50, 100]"
             layout="sizes, prev, pager, next"
             :total="filteredList.length"
             @size-change="handleSizeChange"
@@ -2250,10 +2287,18 @@ defineExpose({
     padding: 16px 24px;
     display: flex;
     // border-bottom: 1px solid map.get($borderColor, light);
+    .condition-del-btn {
+      visibility: hidden;
+      opacity: 0;
+    }
     &:hover {
       .cond-item__index {
         display: block;
       }
+      .condition-del-btn {
+        visibility: visible;
+        opacity: 1;
+      }
     }
   }
 
diff --git a/packages/component/src/Classification.vue b/packages/component/src/Classification.vue
index d180f1ec04..7a6b0a9d78 100644
--- a/packages/component/src/Classification.vue
+++ b/packages/component/src/Classification.vue
@@ -49,6 +49,8 @@ export default {
 
       nodeName: '',
       parent_id: '',
+
+      showSearch: false,
     }
   },
   computed: {
@@ -482,28 +484,48 @@ export default {
         this.$message.info(this.$t('packages_component_data_already_exists'))
       }
     },
+
+    openSearch() {
+      this.showSearch = !this.showSearch
+      this.filterText = ''
+
+      if (this.showSearch) {
+        this.$nextTick(() => {
+          this.$refs.searchInput.focus()
+        })
+      }
+    },
   },
 }
 </script>
 
 <template>
-  <div class="classification py-0 px-3 bg-light rounded-xl" v-show="visible">
+  <div class="classification py-0 px-2 bg-light rounded-xl" v-show="visible">
     <div class="classification-header">
-      <div class="h-32 flex align-center mt-3">
-        <IconButton class="mr-2" @click="toggle()"> expand-list </IconButton>
-        <div class="fs-7 fw-sub flex-1">
+      <div class="h-32 flex align-center mt-2 gap-1" style="--btn-space: 0">
+        <el-button text @click="toggle">
+          <template #icon>
+            <VIcon class="rotate-180">expand-list</VIcon>
+          </template>
+        </el-button>
+        <div class="fs-6 flex-1">
           <span>{{ comTitle }}</span>
         </div>
-        <IconButton :disabled="$disabledReadonlyUserBtn()" v-readonlybtn="authority" @click="showDialog()">
-          add
-        </IconButton>
+        <el-button text @click="openSearch" :class="{ 'is-active': showSearch }">
+          <template #icon>
+            <VIcon size="18">magnify</VIcon>
+          </template>
+        </el-button>
+        <el-button text :disabled="$disabledReadonlyUserBtn()" v-readonlybtn="authority" @click="showDialog()">
+          <template #icon>
+            <VIcon>add</VIcon>
+          </template>
+        </el-button>
       </div>
-      <div class="pt-1 pb-2">
-        <ElInput v-model="filterText">
+      <div v-if="showSearch" class="my-2">
+        <ElInput v-model="filterText" clearable ref="searchInput">
           <template #prefix>
-            <span class="el-input__icon h-100 ml-1">
-              <VIcon size="14">search</VIcon>
-            </span>
+            <VIcon size="14">magnify</VIcon>
           </template>
         </ElInput>
       </div>
diff --git a/packages/component/src/filter-bar/FilterItemSelect.vue b/packages/component/src/filter-bar/FilterItemSelect.vue
index 72483af0df..be1598b251 100644
--- a/packages/component/src/filter-bar/FilterItemSelect.vue
+++ b/packages/component/src/filter-bar/FilterItemSelect.vue
@@ -1,12 +1,19 @@
 <script setup>
 import { isFn } from '@tap/shared'
-import { addUnit } from 'element-plus/es/utils/index.mjs'
-import { computed, onBeforeMount, ref, toRefs, watch } from 'vue'
+
+import { escapeRegExp, get } from 'lodash-es'
+import { computed, nextTick, ref, useAttrs, useTemplateRef, watch } from 'vue'
 
 defineOptions({
   name: 'FilterItemSelect',
 })
 
+const attrs = useAttrs()
+
+const search = ref('')
+const root = useTemplateRef('root')
+const searchInput = useTemplateRef('searchInput')
+
 const model = defineModel()
 
 const props = defineProps({
@@ -27,7 +34,8 @@ const props = defineProps({
 const selectStyle = computed(() => {
   return {
     // width: isEmpty.value && !props.filterable ? 'auto' : addUnit(props.width),
-    width: !props.filterable ? 'auto' : addUnit(props.width),
+    // width: !props.filterable ? 'auto' : addUnit(props.width),
+    width: 'auto',
   }
 })
 
@@ -35,6 +43,19 @@ const isEmpty = computed(() => {
   return props.emptyValues.includes(model.value)
 })
 
+const filteredOptions = computed(() => {
+  if (!props.filterable || !search.value) {
+    return options.value
+  }
+
+  const labelKey = attrs.props?.label || 'label'
+
+  const regexp = new RegExp(escapeRegExp(search.value), 'i')
+  return options.value.filter((item) => {
+    return regexp.test(get(item, labelKey))
+  })
+})
+
 const options = ref([])
 
 const setOptions = async () => {
@@ -55,6 +76,36 @@ watch(
   },
 )
 
+const inputEvent = new Event('input', {
+  bubbles: true,
+  cancelable: true,
+})
+
+const handleSearch = (value) => {
+  // const inputRef = root.value.inputRef
+  // if (inputRef) {
+  //   inputRef.value = value
+  //   inputRef.dispatchEvent(inputEvent)
+  // }
+  nextTick(() => {
+    // console.log('handleSearch', root.value, root.value.handleResize)
+    root.value.handleResize()
+  })
+}
+
+const handleVisibleChange = (visible) => {
+  if (props.filterable) {
+    if (!visible) {
+      search.value = ''
+      searchInput.value.blur()
+    } else {
+      nextTick(() => {
+        searchInput.value.focus()
+      })
+    }
+  }
+}
+
 // onBeforeMount(async () => {
 //   setOptions()
 // })
@@ -62,14 +113,30 @@ watch(
 
 <template>
   <ElSelectV2
+    ref="root"
     v-model="model"
     class="filter-item-select"
+    popper-class="filter-item-select-popper"
     :class="{ 'is-empty': isEmpty, 'is-active': !isEmpty }"
     :style="selectStyle"
-    :filterable="filterable"
-    :options="options"
-    :fit-input-width="props.width"
+    :options="filteredOptions"
+    :fit-input-width="width"
+    @visible-change="handleVisibleChange"
   >
+    <template v-if="filterable" #header>
+      <el-input
+        ref="searchInput"
+        v-model="search"
+        :placeholder="$attrs.placeholder || 'Search'"
+        clearable
+        @input="handleSearch"
+      >
+        <template #prefix>
+          <VIcon>magnify</VIcon>
+        </template>
+      </el-input>
+    </template>
+
     <template #prefix>
       {{ label }}
     </template>
@@ -90,16 +157,25 @@ watch(
     color: var(--el-text-color-caption);
   }
 
+  .el-select__input-wrapper {
+    display: none;
+  }
+
   &.is-active {
     --el-text-color-regular: var(--el-color-primary);
 
     .el-select__wrapper {
-      &:not(.is-filterable) {
-        .el-select__placeholder {
-          position: static;
-          transform: none;
-          width: auto;
-        }
+      // &:not(.is-filterable) {
+      //   .el-select__placeholder {
+      //     position: static;
+      //     transform: none;
+      //     width: auto;
+      //   }
+      // }
+      .el-select__placeholder {
+        position: static;
+        transform: none;
+        width: auto;
       }
       box-shadow: 0 0 0 1px var(--el-color-primary) inset;
     }
@@ -123,4 +199,13 @@ watch(
     }
   }
 }
+
+.filter-item-select-popper {
+  .el-select-dropdown__header {
+    padding: 4px 0;
+    .el-input__wrapper {
+      box-shadow: none;
+    }
+  }
+}
 </style>
diff --git a/packages/component/src/index.js b/packages/component/src/index.js
index 6785971d18..fc8aed527c 100644
--- a/packages/component/src/index.js
+++ b/packages/component/src/index.js
@@ -78,4 +78,6 @@ export * from './CloseIcon'
 
 export * from './RightBoldOutlined'
 
+export * from './DownBoldOutlined'
+
 export * from './InstallElement'
diff --git a/packages/dag/package.json b/packages/dag/package.json
index d7eb77e0df..237be07386 100644
--- a/packages/dag/package.json
+++ b/packages/dag/package.json
@@ -33,6 +33,7 @@
     "jsplumb": "^2.15.6",
     "mousetrap": "^1.6.5",
     "resize-observer-polyfill": "^1.5.1",
+    "vue": "^3.0.0",
     "vue-json-pretty": "^1.9.5",
     "vue-request": "^2.0.4",
     "vue-virtual-scroller": "2.0.0-beta.8",
diff --git a/packages/dag/src/MigrationMonitor.vue b/packages/dag/src/MigrationMonitor.vue
index 0ba1b638d8..c570d5e99f 100644
--- a/packages/dag/src/MigrationMonitor.vue
+++ b/packages/dag/src/MigrationMonitor.vue
@@ -1200,6 +1200,10 @@ export default {
         this.handleShowUpgradeDialog()
       }
     },
+
+    handleOpenInspect() {
+      this.$refs.topHeader.openValidation = true
+    },
   },
 }
 </script>
@@ -1208,6 +1212,7 @@ export default {
   <section class="dataflow-editor layout-wrap vh-100">
     <!--头部-->
     <TopHeader
+      ref="topHeader"
       :loading="loading"
       :is-saving="isSaving"
       :dataflow-name="dataflow.name"
@@ -1357,6 +1362,7 @@ export default {
           :log-totals="logTotals"
           :task-record="taskRecord"
           :quota="quota"
+          @open-inspect="handleOpenInspect"
           @load-data="init"
           @show-bottom-panel="handleShowBottomPanel"
           @action="handleBottomPanelAction"
diff --git a/packages/dag/src/components/DataValidationDialog.vue b/packages/dag/src/components/DataValidationDialog.vue
new file mode 100644
index 0000000000..bb317b9603
--- /dev/null
+++ b/packages/dag/src/components/DataValidationDialog.vue
@@ -0,0 +1,366 @@
+<script setup lang="ts">
+import { taskInspectApi } from '@tap/api'
+import { useI18n } from '@tap/i18n'
+import { computed, ref, watch } from 'vue'
+
+interface TaskInspectConfig {
+  custom: {
+    cdc: {
+      enable: boolean
+      sample: {
+        interval: number
+        limit: number
+      }
+      type: 'CLOSE' | 'SAMPLE'
+    }
+    full?: {
+      enable: boolean
+    }
+    recover?: {
+      enable: boolean
+    }
+  }
+  mode: 'CLOSE' | 'INTELLIGENT' | 'CUSTOM'
+}
+
+const { t } = useI18n()
+
+interface ValidationSettings {
+  enabled: boolean
+  type: string
+  frequency: {
+    time: number
+    records: number
+  }
+}
+
+interface Props {
+  taskId: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  taskId: '',
+})
+
+const loading = ref(false)
+const saving = ref(false)
+const validationEnabled = ref(false)
+const cdcEnabled = ref(false)
+const fullEnabled = ref(false)
+const frequencyTime = ref(1)
+const frequencyRecords = ref(10)
+const recoverEnabled = ref(false)
+
+const dialogRef = ref<InstanceType<typeof ElDialog> | null>(null)
+
+async function initFormData() {
+  loading.value = true
+  try {
+    const res = await taskInspectApi.getConfig(props.taskId, {})
+    validationEnabled.value = res.mode && res.mode !== 'CLOSE'
+    cdcEnabled.value = res.custom.cdc?.enable ?? false
+    fullEnabled.value = res.custom.full?.enable ?? false
+    recoverEnabled.value = res.custom.recover?.enable ?? false
+    frequencyTime.value = res.custom.cdc.sample.interval
+    frequencyRecords.value = res.custom.cdc.sample.limit
+  } catch (error) {
+    console.error('Failed to load validation settings:', error)
+  } finally {
+    loading.value = false
+  }
+}
+
+function handleClose() {
+  dialogRef.value.handleClose()
+}
+
+async function handleSave() {
+  const settings: TaskInspectConfig = {
+    mode: validationEnabled.value ? 'CUSTOM' : 'CLOSE',
+    custom: {
+      cdc: {
+        enable: cdcEnabled.value,
+        sample: {
+          interval: frequencyTime.value,
+          limit: frequencyRecords.value,
+        },
+        type: 'SAMPLE',
+      },
+      full: {
+        enable: fullEnabled.value,
+      },
+      recover: { enable: recoverEnabled.value },
+    },
+  }
+
+  saving.value = true
+  try {
+    await taskInspectApi.putConfig(props.taskId, settings)
+    ElMessage.success(t('public_message_save_ok'))
+    handleClose()
+  } catch (error) {
+    console.error('Failed to save validation settings:', error)
+    ElMessage.error(t('public_message_save_fail'))
+  } finally {
+    saving.value = false
+  }
+}
+
+function handleCheckChange() {
+  if (!cdcEnabled.value && !fullEnabled.value) {
+    recoverEnabled.value = false
+  }
+}
+</script>
+
+<template>
+  <ElDialog
+    ref="dialogRef"
+    :title="t('public_data_validation')"
+    append-to-body
+    width="500px"
+    custom-class="data-validation-dialog"
+    @open="initFormData"
+  >
+    <div v-loading="loading">
+      <div class="validation-header gap-3 justify-content-between">
+        <label
+          class="header-label fs-6 fw-sub cursor-pointer"
+          for="validation-switch"
+        >
+          {{ t('packages_dag_enable_validation') }}
+        </label>
+        <ElSwitch id="validation-switch" v-model="validationEnabled" />
+      </div>
+
+      <div v-if="validationEnabled" class="mt-2">
+        <div class="validation-option mb-4">
+          <ElCheckbox
+            v-model="fullEnabled"
+            disabled
+            @change="handleCheckChange"
+          >
+            <span class="radio-label flex align-center gap-2">
+              <span>{{ $t('packages_dag_full_validation') }}</span>
+              <el-tag type="info" size="small">开发中</el-tag>
+            </span>
+          </ElCheckbox>
+        </div>
+
+        <div class="validation-option mb-4">
+          <ElCheckbox v-model="cdcEnabled" @change="handleCheckChange">
+            <div class="fw-sub">
+              {{ $t('packages_dag_incremental_validation') }}
+            </div>
+          </ElCheckbox>
+          <div class="font-color-light fs-8 pl-6 mt-n0.5">
+            {{ $t('packages_dag_incremental_validation_tips') }}
+          </div>
+        </div>
+
+        <div v-if="cdcEnabled" class="validation-frequency rounded-xl ml-6">
+          <div class="font-color-dark mb-4">
+            {{ $t('packages_dag_validation_frequency') }}
+          </div>
+          <div class="frequency-inputs">
+            <span class="frequency-text">{{ $t('packages_dag_every') }}</span>
+            <div class="input-number-container">
+              <ElInputNumber
+                v-model="frequencyTime"
+                :min="1"
+                :controls="false"
+                controls-position="right"
+              />
+            </div>
+            <span class="frequency-text">{{ $t('packages_dag_seconds') }}</span>
+            <div class="input-number-container">
+              <ElInputNumber
+                v-model="frequencyRecords"
+                :min="1"
+                :controls="false"
+                controls-position="right"
+              />
+            </div>
+            <span class="frequency-text">{{ $t('packages_dag_records') }}</span>
+          </div>
+        </div>
+
+        <el-divider />
+
+        <div class="flex align-center mb-2">
+          <div class="flex-1">
+            <label class="fw-sub cursor-pointer" for="recover-switch">{{
+              $t('packages_dag_auto_repair')
+            }}</label>
+            <div class="fs-8 font-color-light mt-1">
+              {{
+                !cdcEnabled && !fullEnabled
+                  ? $t('packages_dag_auto_repair_disabled_tips')
+                  : $t('packages_dag_auto_repair_tips')
+              }}
+            </div>
+          </div>
+
+          <ElSwitch
+            id="recover-switch"
+            v-model="recoverEnabled"
+            :disabled="!cdcEnabled && !fullEnabled"
+          />
+        </div>
+      </div>
+    </div>
+
+    <template #footer>
+      <ElButton @click="handleClose">{{ t('public_button_cancel') }}</ElButton>
+      <ElButton type="primary" @click="handleSave">{{
+        t('public_button_save')
+      }}</ElButton>
+    </template>
+  </ElDialog>
+</template>
+
+<style lang="scss" scoped>
+.data-validation-dialog {
+  border-radius: 12px;
+  overflow: hidden;
+
+  :deep(.el-dialog__header) {
+    display: none;
+  }
+
+  :deep(.el-dialog__body) {
+    padding: 0;
+  }
+
+  :deep(.el-dialog__footer) {
+    display: none;
+  }
+}
+
+.dialog-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 20px 24px;
+  border-bottom: 1px solid #f0f0f0;
+
+  .dialog-title {
+    font-size: 18px;
+    font-weight: 500;
+    color: #1f2329;
+  }
+
+  .close-button {
+    background: transparent;
+    border: none;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 4px;
+
+    &:hover {
+      opacity: 0.8;
+    }
+  }
+}
+
+.validation-container {
+  padding: 24px;
+}
+
+.validation-header {
+  display: flex;
+  align-items: center;
+  margin-bottom: 4px;
+
+  .switch-container {
+    :deep(.el-switch__core) {
+      height: 24px;
+      border-radius: 12px;
+      width: 50px !important;
+
+      &::after {
+        height: 20px;
+        width: 20px;
+        top: 1px;
+      }
+    }
+
+    :deep(.el-switch.is-checked .el-switch__core::after) {
+      margin-left: -21px;
+    }
+  }
+}
+
+.validation-content {
+}
+
+.validation-option {
+  .el-checkbox {
+    --el-checkbox-input-width: 16px;
+    --el-checkbox-input-height: 16px;
+    :deep(.el-checkbox__inner::after) {
+      width: 4px;
+      height: 8px;
+      left: 4px;
+    }
+  }
+
+  .custom-radio {
+    display: flex;
+    align-items: center;
+
+    :deep(.el-radio__input) {
+      .el-radio__inner {
+        width: 20px;
+        height: 20px;
+        border-color: #d9d9d9;
+
+        &::after {
+          width: 10px;
+          height: 10px;
+          background-color: #5764f6;
+        }
+      }
+
+      &.is-checked {
+        .el-radio__inner {
+          border-color: #5764f6;
+          background: #ffffff;
+        }
+      }
+    }
+
+    .radio-label {
+      font-size: 15px;
+      color: #1f2329;
+      margin-left: 4px;
+    }
+  }
+}
+
+.validation-frequency {
+  background-color: #f7f8fa;
+  padding: 20px;
+  border-radius: 8px;
+
+  .frequency-inputs {
+    display: flex;
+    align-items: center;
+    flex-wrap: wrap;
+
+    .frequency-text {
+      font-size: 14px;
+      color: #3e4152;
+      margin: 0 8px;
+    }
+
+    .input-number-container {
+      .el-input-number {
+        width: 80px;
+      }
+    }
+  }
+}
+</style>
diff --git a/packages/dag/src/components/TopHeader.vue b/packages/dag/src/components/TopHeader.vue
index 99b4b77919..d681a83d16 100644
--- a/packages/dag/src/components/TopHeader.vue
+++ b/packages/dag/src/components/TopHeader.vue
@@ -13,6 +13,7 @@ import { ElSelect as Select } from 'element-plus'
 import { mapGetters, mapMutations, mapState } from 'vuex'
 import { $emit, $off, $on, $once } from '../../utils/gogocodeTransfer'
 import DataCaptureDebug from './DataCaptureDebug.vue'
+import DataValidationDialog from './DataValidationDialog.vue'
 
 export default {
   name: 'TopHeader',
@@ -20,6 +21,7 @@ export default {
 
   components: {
     DataCaptureDebug,
+    DataValidationDialog,
     TextEditable,
     TaskStatus,
     VDivider,
@@ -59,6 +61,7 @@ export default {
       nodeSearchInput: '',
       refreshing: false,
       openDebug: false,
+      openValidation: false,
     }
   },
   computed: {
@@ -441,6 +444,17 @@ export default {
           <VIcon size="18">bug-outlined</VIcon>
         </button>
       </ElTooltip>
+      <template v-if="isDaas && !isCommunity">
+        <el-divider direction="vertical" />
+        <ElTooltip
+          transition="tooltip-fade-in"
+          :content="$t('public_data_validation')"
+        >
+          <button class="icon-btn" @click="openValidation = true">
+            <VIcon size="18">data-scan</VIcon>
+          </button>
+        </ElTooltip>
+      </template>
     </div>
     <!--复制dag查看不显示-->
     <div class="flex align-center flex-grow-1">
@@ -541,10 +555,12 @@ export default {
       @update:visible="openDebug = $event"
       @start="$emit('debug-start')"
     />
+
+    <DataValidationDialog v-model="openValidation" :task-id="dataflow.id" />
   </header>
 </template>
 
-<style lang="scss" scoped>
+<style scoped lang="scss">
 $sidebarW: 236px;
 $hoverBg: #eef3ff;
 $radius: 6px;
diff --git a/packages/dag/src/components/form/field-processor/index.jsx b/packages/dag/src/components/form/field-processor/index.jsx
index 86eade2e4d..b99e882f88 100644
--- a/packages/dag/src/components/form/field-processor/index.jsx
+++ b/packages/dag/src/components/form/field-processor/index.jsx
@@ -838,7 +838,7 @@ export const FieldRenameProcessor = connect(
           {
             label: i18n.t('public_operation_abb'),
             prop: 'operation',
-            // width: 60,
+            width: 88,
             slot: 'operation',
           },
         ]
@@ -1074,26 +1074,26 @@ export const FieldRenameProcessor = connect(
         }
         const renderOpNode = ({ row }) => {
           const show = row.isShow ? (
-            <span
-              class="text-primary cursor-pointer"
+            <el-button
+              disabled={props.disabled}
+              text
+              type="primary"
               onClick={() => doDeleteRow(row)}
             >
               {i18n.t('packages_form_field_processor_index_pingbi')}
-            </span>
+            </el-button>
           ) : (
-            <span
-              class="text-primary cursor-pointer"
+            <el-button
+              disabled={props.disabled}
+              text
+              type="primary"
               onClick={() => doShowRow(row)}
             >
               {i18n.t('packages_form_field_processor_index_huifu')}
-            </span>
+            </el-button>
           )
-          const disabled = row.isShow ? (
-            <span>{i18n.t('packages_form_field_processor_index_pingbi')}</span>
-          ) : (
-            <span>{i18n.t('packages_form_field_processor_index_huifu')}</span>
-          )
-          return props.disabled ? disabled : show
+
+          return show
         }
 
         const showBatchRemove = computed(() => {
@@ -1329,13 +1329,17 @@ export const FieldRenameProcessor = connect(
                                 onClick={() => updateView(index)}
                               >
                                 <span>
-                                  <span>
+                                  <span class="mr-1">
                                     {i18n.t(
                                       'packages_form_dag_dialog_field_mapping_selected',
                                     )}
                                   </span>
-                                  {item.sourceFieldCount - item.userDeletedNum}{' '}
-                                  /{item.sourceFieldCount}
+                                  <span>
+                                    {item.sourceFieldCount -
+                                      item.userDeletedNum}
+                                    <span class="mx-0.5">/</span>
+                                    {item.sourceFieldCount}
+                                  </span>
                                 </span>
                               </div>
                             </div>
diff --git a/packages/dag/src/components/form/table-select/index.jsx b/packages/dag/src/components/form/table-select/index.jsx
index f80b3076c6..c3d78f71e5 100644
--- a/packages/dag/src/components/form/table-select/index.jsx
+++ b/packages/dag/src/components/form/table-select/index.jsx
@@ -132,7 +132,7 @@ export const TableSelect = connect(
         const loading = ref(false)
 
         const loadSelectData = () => {
-          select.value.loadDataList(1)
+          select.value.getInnerRef()?.refresh?.()
         }
 
         const loadSchema = async (keys) => {
diff --git a/packages/dag/src/components/migration/SettingPanel.vue b/packages/dag/src/components/migration/SettingPanel.vue
index 93979b913b..f4eb461fbe 100644
--- a/packages/dag/src/components/migration/SettingPanel.vue
+++ b/packages/dag/src/components/migration/SettingPanel.vue
@@ -6,7 +6,6 @@ import {
   onFieldValueChange,
 } from '@formily/core'
 import { action } from '@formily/reactive'
-import { observer } from '@formily/reactive-vue'
 import { alarmApi, dataPermissionApi, taskApi, usersApi } from '@tap/api'
 import { getPickerOptionsBeforeTime } from '@tap/business/src/shared/util'
 import i18n from '@tap/i18n'
@@ -46,23 +45,10 @@ interface FormScope {
   handleRemovePermissionsItem: () => void
   getConnectionNameByAgent: (field: any) => void
   handleQuicklySyncPoints: () => void
-  loadEmailReceivers: (field: any) => void
-}
-
-interface UserInfo {
-  openid?: string
-}
-
-declare global {
-  interface Window {
-    __USER_INFO__?: UserInfo
-    getSettingByKey: (key: string) => any
-  }
 }
 
 // Props
 const props = defineProps<Props>()
-const emit = defineEmits(['update:settings'])
 
 // Store
 const store = useStore()
@@ -205,31 +191,6 @@ const formScope: FormScope = {
       point.dateTime = currentEventTimestamp
     })
   },
-  loadEmailReceivers: (field: any) => {
-    const str = window.getSettingByKey('email.receivers')
-    const receivers = str ? str.split(',').filter(Boolean) : []
-
-    const size = field.value.length
-
-    if (size) {
-      const filter = field.value.filter((email: string) =>
-        receivers.includes(email),
-      )
-
-      if (size !== filter.length) {
-        field.form.setValuesIn(field.path, [...filter])
-      }
-    } else {
-      field.setInitialValue(receivers)
-    }
-
-    field.dataSource = receivers.map((receiver: string) => {
-      return {
-        label: receiver,
-        value: receiver,
-      }
-    })
-  },
 }
 
 // Computed
@@ -1290,6 +1251,15 @@ const schema = {
                   interval: 300,
                   unit: 'SECOND',
                 },
+                {
+                  type: 'TASK',
+                  open: isDaas,
+                  key: 'TASK_INSPECT_DIFFERENCE',
+                  sort: 7,
+                  notify: ['SYSTEM', 'EMAIL'],
+                  interval: 300,
+                  unit: 'SECOND',
+                },
               ],
             },
             alarmRules: {
@@ -1668,6 +1638,61 @@ const schema = {
                 },
               },
             },
+            'alarmSettings.4': {
+              type: 'object',
+              title: i18n.t('packages_dag_task_inspect_difference_alarm'),
+              'x-decorator': 'FormItem',
+              'x-component': 'div',
+              'x-component-props': {
+                class: 'flex align-center',
+              },
+              properties: {
+                open: {
+                  title: i18n.t('packages_dag_task_inspect_difference_alarm'),
+                  type: 'boolean',
+                  default: true,
+                  'x-editable': true,
+                  'x-component': 'Switch',
+                  'x-component-props': {
+                    onChange: `{{val=>(val && !$values.alarmSettings[4].notify.length && ($values.alarmSettings[4].notify=["SYSTEM"]))}}`,
+                  },
+                },
+                divider: {
+                  type: 'void',
+                  'x-component': 'Divider',
+                  'x-component-props': {
+                    direction: 'vertical',
+                    class: 'mx-4',
+                  },
+                  'x-reactions': {
+                    dependencies: ['.open'],
+                    fulfill: {
+                      state: {
+                        display: `{{$deps[0] ? 'visible' : 'hidden'}}`,
+                      },
+                    },
+                  },
+                },
+                notify: {
+                  type: 'array',
+                  'x-component': 'Checkbox.Group',
+                  'x-component-props': {
+                    onChange: `{{val=>(!val.length && ($values.alarmSettings[4].open=false))}}`,
+                  },
+                  default: ['SYSTEM', 'EMAIL'],
+                  enum: '{{$alarmChannels}}',
+                  'x-editable': true,
+                  'x-reactions': {
+                    dependencies: ['.open'],
+                    fulfill: {
+                      state: {
+                        display: `{{$deps[0] ? 'visible' : 'hidden'}}`,
+                      },
+                    },
+                  },
+                },
+              },
+            },
             emailReceivers: {
               title: i18n.t('packages_dag_email_receivers'),
               type: 'array',
@@ -1682,7 +1707,6 @@ const schema = {
               'x-content': {
                 prefix: () => h(ElIcon, [h(User)]),
               },
-              // 'x-reactions': `{{loadEmailReceivers}}`,
             },
           },
         },
@@ -1791,6 +1815,8 @@ const schema = {
                         type: 'void',
                         'x-component': 'ArrayTable.Remove',
                         'x-component-props': {
+                          text: true,
+                          type: 'primary',
                           onClick: `{{handleRemovePermissionsItem}}`,
                         },
                       },
diff --git a/packages/dag/src/components/monitor/BottomPanel.vue b/packages/dag/src/components/monitor/BottomPanel.vue
index 8748b48bd2..dc01a66636 100644
--- a/packages/dag/src/components/monitor/BottomPanel.vue
+++ b/packages/dag/src/components/monitor/BottomPanel.vue
@@ -10,11 +10,19 @@ import { mapActions, mapGetters, mapMutations } from 'vuex'
 
 import Alert from './components/Alert'
 import Record from './components/Record'
+import TaskInspect from './components/TaskInspect'
 import '@tap/component/src/directives/resize/index.scss'
 
 export default {
   name: 'ConfigPanel',
-  components: { Record, Alert, RelationList, NodeLog, MilestoneList },
+  components: {
+    Record,
+    Alert,
+    RelationList,
+    NodeLog,
+    MilestoneList,
+    TaskInspect,
+  },
   directives: {
     resize,
     focusSelect,
@@ -28,6 +36,8 @@ export default {
   },
   data() {
     return {
+      isDaas: import.meta.env.VUE_APP_PLATFORM === 'DAAS',
+      isCommunity: import.meta.env.VUE_APP_MODE === 'community',
       currentTab: 'milestone',
       name: this.activeNode?.name,
       relationCount: 0,
@@ -217,6 +227,19 @@ export default {
             @load-data="$emit('load-data')"
           />
         </ElTabPane>
+        <ElTabPane
+          v-if="isDaas && !isCommunity"
+          :label="$t('public_validation_record')"
+          name="inspect"
+        >
+          <TaskInspect
+            v-if="currentTab === 'inspect'"
+            v-bind="$attrs"
+            style="min-width: 1000px"
+            :current-tab="currentTab"
+            @open-inspect="$emit('open-inspect')"
+          />
+        </ElTabPane>
       </ElTabs>
 
       <el-button text class="close-icon" @click="$emit('showBottomPanel')">
diff --git a/packages/dag/src/components/monitor/TopHeader.vue b/packages/dag/src/components/monitor/TopHeader.vue
index 40ebf3b535..45c402ae2a 100644
--- a/packages/dag/src/components/monitor/TopHeader.vue
+++ b/packages/dag/src/components/monitor/TopHeader.vue
@@ -1,188 +1,32 @@
-<template>
-  <header class="layout-header border-bottom px-4 text-nowrap">
-    <div class="left-content flex align-center overflow-hidden">
-      <button @click="$emit('page-return')" class="icon-btn mr-2">
-        <VIcon size="18">left</VIcon>
-      </button>
-      <div class="overflow-hidden">
-        <div class="flex align-items-center">
-          <TextEditable
-            class="overflow-hidden"
-            v-model:value="name"
-            :placeholder="$t('packages_dag_monitor_topheader_qingshururenwu')"
-            :input-min-width="32"
-            :maxlength="200"
-            @change="onNameInputChange"
-          />
-          <TaskStatus :task="dataflow" :agent-map="agentMap" class="ml-4" />
-        </div>
-        <div class="flex align-items-center font-color-light mt-1">
-          <span class="mr-2">{{ syncType[dataflow.type] }}</span>
-          <template v-if="!hideMenus.includes('agent')">
-            <span>{{ $t('packages_dag_monitor_topheader_zuijinyiciqi') }}</span>
-            <span>{{ lastStartDate }}</span>
-          </template>
-        </div>
-      </div>
-      <div v-if="dataflow.agentId && !hideMenus.includes('agent')" class="agent-data__item ml-4 px-4">
-        <OverflowTooltip
-          class="agent-name__item text-truncate mb-2 font-color-dark"
-          placement="bottom"
-          :text="dataflow.agentName"
-          :open-delay="400"
-        />
-        <div v-if="agentData" class="font-color-sslight agent-statistical">
-          <span>CPU：</span>
-          <span>{{ agentData.cpuUsage }}</span>
-          <span class="ml-3">MEM：</span>
-          <span>{{ agentData.memoryRate }}</span>
-          <span class="ml-3">GC：</span>
-          <span>{{ agentData.gcRate }}</span>
-        </div>
-      </div>
-    </div>
-
-    <div v-if="!hideOperation" class="flex align-center">
-      <!--内容居中-->
-      <ElTooltip transition="tooltip-fade-in" :content="$t('packages_dag_button_center_content') + '(Shift + 1)'">
-        <button @click="$emit('center-content')" class="icon-btn">
-          <VIcon size="20">compress</VIcon>
-        </button>
-      </ElTooltip>
-      <el-divider direction="vertical" />
-      <!--缩小-->
-      <ElTooltip transition="tooltip-fade-in" :content="$t('packages_dag_button_zoom_out') + `(${commandCode} -)`">
-        <button @click="$emit('zoom-out')" class="icon-btn">
-          <VIcon size="20">remove-outline</VIcon>
-        </button>
-      </ElTooltip>
-      <div class="choose-size mx-2">
-        <ElPopover placement="bottom" trigger="hover" popper-class="rounded-xl p-0" width="auto">
-          <template v-slot:reference>
-            <div class="size-wrap">{{ scaleTxt }}</div>
-          </template>
-          <div class="choose-list p-2">
-            <div @click="$emit('zoom-in')" class="choose-item pl-4 flex justify-content-between align-center">
-              <span class="title">{{ $t('packages_dag_button_zoom_out') }}</span>
-              <div class="kbd-wrap flex align-center mr-2"><kbd>⌘</kbd><span class="mx-1">+</span><kbd>+</kbd></div>
-            </div>
-            <div @click="$emit('zoom-out')" class="choose-item pl-4 flex justify-content-between align-center">
-              <span class="title">{{ $t('packages_dag_button_zoom_in') }}</span>
-              <div class="kbd-wrap flex align-center mr-2"><kbd>⌘</kbd><span class="mx-1">+</span><kbd>–</kbd></div>
-            </div>
-            <VDivider class="my-2"></VDivider>
-            <div v-for="val in chooseItems" :key="val" class="choose-item pl-4" @click="$emit('zoom-to', val)">
-              {{ val * 100 }}%
-            </div>
-          </div>
-        </ElPopover>
-      </div>
-      <!--放大-->
-      <ElTooltip transition="tooltip-fade-in" :content="$t('packages_dag_button_zoom_in') + `(${commandCode} +)`">
-        <button @click="$emit('zoom-in')" class="icon-btn">
-          <VIcon size="20">add-outline</VIcon>
-        </button>
-      </ElTooltip>
-      <el-divider direction="vertical" />
-      <ElTooltip transition="tooltip-fade-in" :content="$t('packages_dag_monitor_bottompanel_rizhi')">
-        <button :class="{ active: showBottomPanel }" class="icon-btn" @click="$emit('showBottomPanel')">
-          <VIcon size="16">list</VIcon>
-        </button>
-      </ElTooltip>
-      <el-divider direction="vertical" />
-      <button
-        v-if="buttonShowMap.Start"
-        class="icon-btn"
-        :class="{ disabled: dataflow.disabledData && dataflow.disabledData.start && dataflow.status !== 'running' }"
-        @click="handleOpenDebug"
-      >
-        <VIcon size="18">bug-outlined</VIcon>
-      </button>
-    </div>
-    <div class="flex-grow-1"></div>
-    <div class="flex align-center ml-2">
-      <ElButton v-if="!hideSetting && !hideOperation" class="ml-3" @click="$emit('showSettings')">
-        <VIcon class="mr-1">cog-o</VIcon>
-        {{ $t('public_button_setting') }}
-      </ElButton>
-      <template v-if="!hideMenus.includes('operation')">
-        <ElButton
-          v-if="dataflow.disabledData && !dataflow.disabledData.edit && !hideEdit && buttonShowMap.Edit"
-          :disabled="$disabledReadonlyUserBtn()"
-          class="ml-3"
-          @click="$emit('edit')"
-        >
-          <VIcon class="mr-1">edit-outline</VIcon>
-          {{ $t('public_button_edit') }}
-        </ElButton>
-        <ElButton
-          v-if="!(dataflow.disabledData && dataflow.disabledData.reset) && buttonShowMap.Reset"
-          :disabled="$disabledReadonlyUserBtn()"
-          class="ml-3"
-          type="warning"
-          @click="$emit('reset')"
-        >
-          {{ $t('public_button_reset') }}
-        </ElButton>
-        <ElButton
-          v-if="!(dataflow.disabledData && dataflow.disabledData.start) && buttonShowMap.Start"
-          :disabled="$disabledReadonlyUserBtn()"
-          class="ml-3"
-          type="primary"
-          @click="$emit('start')"
-        >
-          {{ $t('public_button_start') }}
-        </ElButton>
-        <template v-else>
-          <ElButton
-            v-if="isShowForceStop(dataflow) && buttonShowMap.Stop"
-            :disabled="(dataflow.disabledData && dataflow.disabledData.forceStop) || $disabledReadonlyUserBtn()"
-            class="ml-3"
-            type="danger"
-            @click="$emit('forceStop')"
-          >
-            {{ $t('public_button_force_stop') }}
-          </ElButton>
-          <ElButton
-            v-else-if="buttonShowMap.Stop"
-            :disabled="(dataflow.disabledData && dataflow.disabledData.stop) || $disabledReadonlyUserBtn()"
-            type="danger"
-            class="ml-3"
-            @click="$emit('stop')"
-          >
-            {{ $t('public_button_stop') }}
-          </ElButton>
-        </template>
-      </template>
-    </div>
-
-    <DataCaptureDebug
-      :visible="openDebug"
-      :task-id="dataflow.id"
-      @update:visible="openDebug = $event"
-      @start="$emit('debug-start')"
-    ></DataCaptureDebug>
-  </header>
-</template>
-
 <script>
-import { $on, $off, $once, $emit } from '../../../utils/gogocodeTransfer'
-import i18n from '@tap/i18n'
 import { taskApi } from '@tap/api'
+import editSvg from '@tap/assets/images/edit-fill.svg'
+import { TaskStatus } from '@tap/business'
 
-import { mapGetters, mapMutations, mapState } from 'vuex'
-import dayjs from 'dayjs'
+import syncTaskAgent from '@tap/business/src/mixins/syncTaskAgent'
+import { OverflowTooltip, TextEditable, VDivider, VIcon } from '@tap/component'
 
 import focusSelect from '@tap/component/src/directives/focusSelect'
-import { TextEditable, VIcon, VDivider, OverflowTooltip } from '@tap/component'
-import { TaskStatus } from '@tap/business'
-import syncTaskAgent from '@tap/business/src/mixins/syncTaskAgent'
+import i18n from '@tap/i18n'
+import dayjs from 'dayjs'
+import { mapGetters, mapMutations, mapState } from 'vuex'
+import { $emit, $off, $on, $once } from '../../../utils/gogocodeTransfer'
 import DataCaptureDebug from '../DataCaptureDebug.vue'
-import editSvg from '@tap/assets/images/edit-fill.svg'
+import DataValidationDialog from '../DataValidationDialog.vue'
 
 export default {
   name: 'TopHeader',
   directives: { focusSelect },
+  components: {
+    DataCaptureDebug,
+    VIcon,
+    TaskStatus,
+    VDivider,
+    OverflowTooltip,
+    TextEditable,
+    DataValidationDialog,
+  },
+  mixins: [syncTaskAgent],
   props: {
     loading: Boolean,
     dataflowName: String,
@@ -202,11 +46,11 @@ export default {
       },
     },
   },
-  mixins: [syncTaskAgent],
-  components: { DataCaptureDebug, VIcon, TaskStatus, VDivider, OverflowTooltip, TextEditable },
   data() {
     const isMacOs = /(ipad|iphone|ipod|mac)/i.test(navigator.platform)
     return {
+      isDaas: import.meta.env.VUE_APP_PLATFORM === 'DAAS',
+      isCommunity: import.meta.env.VUE_APP_MODE === 'community',
       commandCode: isMacOs ? '⌘' : 'Ctrl',
       optionCode: isMacOs ? 'Option' : 'Alt',
       name: '',
@@ -222,9 +66,10 @@ export default {
       syncType: {
         initial_sync: i18n.t('public_task_type_initial_sync'),
         cdc: i18n.t('public_task_type_cdc'),
-        'initial_sync+cdc': i18n.t('public_task_type_initial_sync_and_cdc')
+        'initial_sync+cdc': i18n.t('public_task_type_initial_sync_and_cdc'),
       },
-      openDebug: false
+      openDebug: false,
+      openValidation: false,
     }
   },
   computed: {
@@ -232,7 +77,7 @@ export default {
     ...mapState('dataflow', ['spaceKeyPressed']),
 
     scaleTxt() {
-      return Math.round(this.scale * 100) + '%'
+      return `${Math.round(this.scale * 100)}%`
     },
 
     startTime() {
@@ -242,7 +87,9 @@ export default {
 
     lastStartDate() {
       const { lastStartDate } = this.dataflow
-      return lastStartDate ? dayjs(lastStartDate).format('YYYY-MM-DD HH:mm:ss') : '-'
+      return lastStartDate
+        ? dayjs(lastStartDate).format('YYYY-MM-DD HH:mm:ss')
+        : '-'
     },
 
     agentData() {
@@ -251,24 +98,24 @@ export default {
       return {
         cpuUsage:
           typeof cpuUsage === 'number'
-            ? (cpuUsage * 100).toLocaleString('zh-CN', {
+            ? `${(cpuUsage * 100).toLocaleString('zh-CN', {
                 minimumFractionDigits: 2,
                 maximumFractionDigits: 2,
-              }) + '%'
+              })}%`
             : '',
         memoryRate:
           typeof memoryRate === 'number'
-            ? (memoryRate * 100).toLocaleString('zh-CN', {
+            ? `${(memoryRate * 100).toLocaleString('zh-CN', {
                 minimumFractionDigits: 2,
                 maximumFractionDigits: 2,
-              }) + '%'
+              })}%`
             : '',
         gcRate:
           typeof gcRate === 'number'
-            ? (gcRate * 100).toLocaleString('zh-CN', {
+            ? `${(gcRate * 100).toLocaleString('zh-CN', {
                 minimumFractionDigits: 2,
                 maximumFractionDigits: 2,
-              }) + '%'
+              })}%`
             : '',
       }
     },
@@ -311,7 +158,7 @@ export default {
     },
 
     back() {
-      let mapping = this.$route.query.mapping
+      const mapping = this.$route.query.mapping
       const $PLATFORM = window.getSettingByKey('DFS_TCM_PLATFORM')
       const backToList = () => {
         if ($PLATFORM === 'dfs') {
@@ -322,7 +169,7 @@ export default {
           this.$router.push({
             name: 'dataFlows',
             query: {
-              mapping: mapping,
+              mapping,
             },
           })
         }
@@ -337,7 +184,7 @@ export default {
       }
 
       this.openDebug = true
-    }
+    },
   },
   emits: [
     'page-return',
@@ -369,6 +216,253 @@ export default {
 }
 </script>
 
+<template>
+  <header class="layout-header border-bottom px-4 text-nowrap">
+    <div class="left-content flex align-center overflow-hidden">
+      <button class="icon-btn mr-2" @click="$emit('page-return')">
+        <VIcon size="18">left</VIcon>
+      </button>
+      <div class="overflow-hidden">
+        <div class="flex align-items-center">
+          <TextEditable
+            v-model:value="name"
+            class="overflow-hidden"
+            :placeholder="$t('packages_dag_monitor_topheader_qingshururenwu')"
+            :input-min-width="32"
+            :maxlength="200"
+            @change="onNameInputChange"
+          />
+          <TaskStatus :task="dataflow" :agent-map="agentMap" class="ml-4" />
+        </div>
+        <div class="flex align-items-center font-color-light mt-1">
+          <span class="mr-2">{{ syncType[dataflow.type] }}</span>
+          <template v-if="!hideMenus.includes('agent')">
+            <span>{{ $t('packages_dag_monitor_topheader_zuijinyiciqi') }}</span>
+            <span>{{ lastStartDate }}</span>
+          </template>
+        </div>
+      </div>
+      <div
+        v-if="dataflow.agentId && !hideMenus.includes('agent')"
+        class="agent-data__item ml-4 px-4"
+      >
+        <OverflowTooltip
+          class="agent-name__item text-truncate mb-2 font-color-dark"
+          placement="bottom"
+          :text="dataflow.agentName"
+          :open-delay="400"
+        />
+        <div v-if="agentData" class="font-color-sslight agent-statistical">
+          <span>CPU：</span>
+          <span>{{ agentData.cpuUsage }}</span>
+          <span class="ml-3">MEM：</span>
+          <span>{{ agentData.memoryRate }}</span>
+          <span class="ml-3">GC：</span>
+          <span>{{ agentData.gcRate }}</span>
+        </div>
+      </div>
+    </div>
+
+    <div v-if="!hideOperation" class="flex align-center">
+      <!--内容居中-->
+      <ElTooltip
+        transition="tooltip-fade-in"
+        :content="`${$t('packages_dag_button_center_content')}(Shift + 1)`"
+      >
+        <button class="icon-btn" @click="$emit('center-content')">
+          <VIcon size="20">compress</VIcon>
+        </button>
+      </ElTooltip>
+      <el-divider direction="vertical" />
+      <!--缩小-->
+      <ElTooltip
+        transition="tooltip-fade-in"
+        :content="`${$t('packages_dag_button_zoom_out')}(${commandCode} -)`"
+      >
+        <button class="icon-btn" @click="$emit('zoom-out')">
+          <VIcon size="20">remove-outline</VIcon>
+        </button>
+      </ElTooltip>
+      <div class="choose-size mx-2">
+        <ElPopover
+          placement="bottom"
+          trigger="hover"
+          popper-class="rounded-xl p-0"
+          width="auto"
+        >
+          <template #reference>
+            <div class="size-wrap">{{ scaleTxt }}</div>
+          </template>
+          <div class="choose-list p-2">
+            <div
+              class="choose-item pl-4 flex justify-content-between align-center"
+              @click="$emit('zoom-in')"
+            >
+              <span class="title">{{
+                $t('packages_dag_button_zoom_out')
+              }}</span>
+              <div class="kbd-wrap flex align-center mr-2">
+                <kbd>⌘</kbd><span class="mx-1">+</span><kbd>+</kbd>
+              </div>
+            </div>
+            <div
+              class="choose-item pl-4 flex justify-content-between align-center"
+              @click="$emit('zoom-out')"
+            >
+              <span class="title">{{ $t('packages_dag_button_zoom_in') }}</span>
+              <div class="kbd-wrap flex align-center mr-2">
+                <kbd>⌘</kbd><span class="mx-1">+</span><kbd>–</kbd>
+              </div>
+            </div>
+            <VDivider class="my-2" />
+            <div
+              v-for="val in chooseItems"
+              :key="val"
+              class="choose-item pl-4"
+              @click="$emit('zoom-to', val)"
+            >
+              {{ val * 100 }}%
+            </div>
+          </div>
+        </ElPopover>
+      </div>
+      <!--放大-->
+      <ElTooltip
+        transition="tooltip-fade-in"
+        :content="`${$t('packages_dag_button_zoom_in')}(${commandCode} +)`"
+      >
+        <button class="icon-btn" @click="$emit('zoom-in')">
+          <VIcon size="20">add-outline</VIcon>
+        </button>
+      </ElTooltip>
+      <el-divider direction="vertical" />
+      <ElTooltip
+        transition="tooltip-fade-in"
+        :content="$t('packages_dag_monitor_bottompanel_rizhi')"
+      >
+        <button
+          :class="{ active: showBottomPanel }"
+          class="icon-btn"
+          @click="$emit('showBottomPanel')"
+        >
+          <VIcon size="16">list</VIcon>
+        </button>
+      </ElTooltip>
+      <el-divider direction="vertical" />
+      <button
+        v-if="buttonShowMap.Start"
+        class="icon-btn"
+        :class="{
+          disabled:
+            dataflow.disabledData &&
+            dataflow.disabledData.start &&
+            dataflow.status !== 'running',
+        }"
+        @click="handleOpenDebug"
+      >
+        <VIcon size="18">bug-outlined</VIcon>
+      </button>
+      <template v-if="isDaas && !isCommunity">
+        <el-divider direction="vertical" />
+        <ElTooltip
+          transition="tooltip-fade-in"
+          :content="$t('public_data_validation')"
+        >
+          <button class="icon-btn" @click="openValidation = true">
+            <VIcon size="18">data-scan</VIcon>
+          </button>
+        </ElTooltip>
+      </template>
+    </div>
+    <div class="flex-grow-1" />
+    <div class="flex align-center ml-2">
+      <ElButton
+        v-if="!hideSetting && !hideOperation"
+        class="ml-3"
+        @click="$emit('showSettings')"
+      >
+        <VIcon class="mr-1">cog-o</VIcon>
+        {{ $t('public_button_setting') }}
+      </ElButton>
+      <template v-if="!hideMenus.includes('operation')">
+        <ElButton
+          v-if="
+            dataflow.disabledData &&
+            !dataflow.disabledData.edit &&
+            !hideEdit &&
+            buttonShowMap.Edit
+          "
+          :disabled="$disabledReadonlyUserBtn()"
+          class="ml-3"
+          @click="$emit('edit')"
+        >
+          <VIcon class="mr-1">edit-outline</VIcon>
+          {{ $t('public_button_edit') }}
+        </ElButton>
+        <ElButton
+          v-if="
+            !(dataflow.disabledData && dataflow.disabledData.reset) &&
+            buttonShowMap.Reset
+          "
+          :disabled="$disabledReadonlyUserBtn()"
+          class="ml-3"
+          type="warning"
+          @click="$emit('reset')"
+        >
+          {{ $t('public_button_reset') }}
+        </ElButton>
+        <ElButton
+          v-if="
+            !(dataflow.disabledData && dataflow.disabledData.start) &&
+            buttonShowMap.Start
+          "
+          :disabled="$disabledReadonlyUserBtn()"
+          class="ml-3"
+          type="primary"
+          @click="$emit('start')"
+        >
+          {{ $t('public_button_start') }}
+        </ElButton>
+        <template v-else>
+          <ElButton
+            v-if="isShowForceStop(dataflow) && buttonShowMap.Stop"
+            :disabled="
+              (dataflow.disabledData && dataflow.disabledData.forceStop) ||
+              $disabledReadonlyUserBtn()
+            "
+            class="ml-3"
+            type="danger"
+            @click="$emit('forceStop')"
+          >
+            {{ $t('public_button_force_stop') }}
+          </ElButton>
+          <ElButton
+            v-else-if="buttonShowMap.Stop"
+            :disabled="
+              (dataflow.disabledData && dataflow.disabledData.stop) ||
+              $disabledReadonlyUserBtn()
+            "
+            type="danger"
+            class="ml-3"
+            @click="$emit('stop')"
+          >
+            {{ $t('public_button_stop') }}
+          </ElButton>
+        </template>
+      </template>
+    </div>
+
+    <DataCaptureDebug
+      :visible="openDebug"
+      :task-id="dataflow.id"
+      @update:visible="openDebug = $event"
+      @start="$emit('debug-start')"
+    />
+
+    <DataValidationDialog v-model="openValidation" :task-id="dataflow.id" />
+  </header>
+</template>
+
 <style lang="scss" scoped>
 $sidebarW: 236px;
 $hoverBg: #eef3ff;
diff --git a/packages/dag/src/components/monitor/components/InspectDetailDialog.vue b/packages/dag/src/components/monitor/components/InspectDetailDialog.vue
new file mode 100644
index 0000000000..249ea82038
--- /dev/null
+++ b/packages/dag/src/components/monitor/components/InspectDetailDialog.vue
@@ -0,0 +1,586 @@
+<script setup lang="ts">
+import axios from 'axios'
+import { ref } from 'vue'
+import InspectRecordDialog from './InspectRecordDialog.vue'
+
+interface InspectionRow {
+  sourceTable: string
+  targetTable: string
+  countDiff: number
+  countMore: number
+  countMiss: number
+}
+
+interface DiffRow {
+  id: string
+  diffType: 'DIFF' | 'MISS' | 'MORE'
+  source: Record<string, any>
+  target: Record<string, any>
+  diffFields: string[]
+  sourceFields: string[]
+  targetFields: string[]
+  diffFieldsMap?: Record<string, string>
+}
+
+const props = defineProps({
+  inspectId: {
+    type: String,
+    default: '',
+  },
+  pingTime: {
+    type: String,
+    default: '',
+  },
+  visible: {
+    type: Boolean,
+    default: false,
+  },
+})
+
+const emit = defineEmits(['update:visible'])
+
+const activeTab = ref('details')
+const inspectList = ref<InspectionRow[]>([])
+const rowDiffList = ref<DiffRow[]>([])
+const loadingList = ref(false)
+const loadingDetails = ref(false)
+const currentSelectedRow = ref<InspectionRow | null>(null)
+const onlyShowDiffFields = ref(true)
+
+function onClose(): void {
+  emit('update:visible', false)
+  resetData()
+}
+
+function resetData(): void {
+  activeTab.value = 'details'
+  currentSelectedRow.value = null
+}
+
+async function fetchDiffList(): Promise<void> {
+  loadingList.value = true
+  try {
+    const data = await axios.get(
+      `/api/task-inspect-histories/${props.inspectId}/results/group-by-table`,
+    )
+    inspectList.value = data?.items || []
+
+    if (inspectList.value.length > 0) {
+      currentSelectedRow.value = inspectList.value[0]
+      fetchTableDiff(inspectList.value[0].sourceTable)
+    }
+  } catch (error) {
+    console.error('Failed to fetch inspect list:', error)
+  } finally {
+    loadingList.value = false
+  }
+}
+
+async function fetchTableDiff(sourceTable: string): Promise<void> {
+  if (!props.inspectId) return
+
+  loadingDetails.value = true
+
+  try {
+    const data = await axios.get<ApiResponse<DiffRow>>(
+      `/api/task-inspect-histories/${props.inspectId}/results`,
+      {
+        params: {
+          filter: JSON.stringify({
+            where: { sourceTable },
+          }),
+        },
+      },
+    )
+
+    rowDiffList.value = (data?.items || []).map((item: DiffRow) => {
+      if (item.diffType === 'DIFF') {
+        return {
+          ...item,
+          diffFieldsMap: item.diffFields.reduce(
+            (acc: Record<string, string>, field: string) => {
+              acc[field] = item.targetFields[item.sourceFields.indexOf(field)]
+              return acc
+            },
+            {},
+          ),
+        }
+      }
+      return item
+    })
+  } catch (error) {
+    console.error('Failed to fetch inspect details:', error)
+  } finally {
+    loadingDetails.value = false
+  }
+}
+
+function handleRowClick(row: InspectionRow): void {
+  if (currentSelectedRow.value === row) return
+  currentSelectedRow.value = row
+  fetchTableDiff(row.sourceTable)
+}
+
+function onOpen(): void {
+  if (props.inspectId) {
+    fetchDiffList()
+  }
+}
+
+const recordDialogVisible = ref(false)
+const resultId = ref('')
+
+function handleRecordClick(row: DiffRow): void {
+  resultId.value = row.id
+  recordDialogVisible.value = true
+}
+</script>
+
+<template>
+  <ElDialog
+    :title="$t('packages_dag_inspect_detail_title')"
+    width="80%"
+    append-to-body
+    class="inspect-detail-dialog p-0"
+    :close-on-click-modal="false"
+    @open="onOpen"
+    @close="onClose"
+  >
+    <template #title>
+      <div class="flex align-items-center">
+        <span>{{ $t('packages_dag_inspect_detail_title') }}</span>
+        <VIcon class="text-muted ml-4 mr-1" :size="14">time</VIcon>
+        <span class="text-muted fs-8"
+          >{{ $t('packages_dag_inspect_last_verify_time') }}:
+          {{ pingTime }}</span
+        >
+      </div>
+    </template>
+    <div class="inspect-detail-container border-top">
+      <div
+        v-loading="loadingList"
+        :class="inspectList.length || loadingList ? 'flex' : 'none'"
+        style="min-height: 400px"
+      >
+        <div class="inspection-result-list bg-light p-3 overflow-y-auto">
+          <div class="flex flex-column gap-3">
+            <div
+              v-for="(row, index) in inspectList"
+              :key="index"
+              class="inspection-result-card p-3 bg-white rounded-xl shadow-sm"
+              :class="{ 'border-primary': currentSelectedRow === row }"
+              @click="handleRowClick(row)"
+            >
+              <div>
+                <div class="flex align-items-center gap-2 fs-6 font-color-dark">
+                  <VIcon :size="20">table</VIcon>
+                  <div
+                    v-if="row.sourceTable !== row.targetTable"
+                    class="flex align-center gap-1"
+                  >
+                    <VIcon class="mt-1" size="16">ArrowsTurnForward</VIcon>
+                    <div>
+                      <div class="font-color-light fs-7">
+                        {{ row.sourceTable || '-' }}
+                      </div>
+                      <div>{{ row.targetTable || '-' }}</div>
+                    </div>
+                  </div>
+                  <div v-else>{{ row.targetTable || '-' }}</div>
+                </div>
+              </div>
+
+              <div class="flex mt-2 gap-3">
+                <ElTag
+                  v-if="row.countDiff > 0"
+                  class="rounded-4"
+                  size="small"
+                  type="danger"
+                >
+                  {{
+                    $t('packages_dag_inspect_diff_records_num', {
+                      num: row.countDiff,
+                    })
+                  }}
+                </ElTag>
+                <ElTag
+                  v-if="row.countMore > 0"
+                  class="rounded-4"
+                  size="small"
+                  type="warning"
+                >
+                  {{
+                    $t('packages_dag_inspect_target_more_num', {
+                      num: row.countMore,
+                    })
+                  }}
+                </ElTag>
+                <ElTag
+                  v-if="row.countMiss > 0"
+                  class="rounded-4 tag-amber"
+                  size="small"
+                >
+                  {{
+                    $t('packages_dag_inspect_target_less_num', {
+                      num: row.countMiss,
+                    })
+                  }}
+                </ElTag>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <div
+          v-loading="loadingDetails"
+          class="bg-white border-left flex-1 flex flex-column"
+        >
+          <div class="flex gap-3 px-4 py-3 border-bottom">
+            <span
+              class="bg-subtle rounded-lg px-3 lh-8 cursor-pointer"
+              :class="{
+                'active-primary': onlyShowDiffFields,
+              }"
+              @click="onlyShowDiffFields = true"
+              >{{
+                $t('packages_business_verification_details_jinxianshichayi')
+              }}</span
+            >
+
+            <span
+              class="bg-subtle rounded-lg px-3 lh-8 cursor-pointer"
+              :class="{
+                'active-primary': !onlyShowDiffFields,
+              }"
+              @click="onlyShowDiffFields = false"
+              >{{
+                $t('packages_business_verification_details_xianshiwanzhengzi')
+              }}</span
+            >
+          </div>
+          <div class="overflow-y-auto p-4 min-height-0">
+            <div class="flex flex-column gap-4">
+              <div
+                v-for="(row, index) in rowDiffList"
+                :key="index"
+                class="border rounded-xl overflow-hidden"
+              >
+                <div class="flex align-items-center gap-2 p-3 bg-light">
+                  <span class="bg-fill-hover rounded-lg px-2 py-1">
+                    {{ $t('packages_dag_inspect_row_id') }}: {{ row.id }}
+                  </span>
+                  <ElTag
+                    v-if="row.diffType === 'DIFF'"
+                    class="rounded-4"
+                    size="small"
+                    type="danger"
+                  >
+                    {{ $t('packages_dag_inspect_diff_type_diff') }}
+                  </ElTag>
+
+                  <ElTag
+                    v-if="row.diffType === 'MISS'"
+                    class="rounded-4 tag-amber"
+                    size="small"
+                  >
+                    {{ $t('packages_dag_inspect_diff_type_miss') }}
+                  </ElTag>
+
+                  <ElTag
+                    v-if="row.diffType === 'MORE'"
+                    class="rounded-4"
+                    size="small"
+                    type="warning"
+                  >
+                    {{ $t('packages_dag_inspect_diff_type_more') }}
+                  </ElTag>
+
+                  <div class="flex-1" />
+
+                  <el-button text type="primary" @click="handleRecordClick(row)"
+                    >{{ $t('packages_dag_inspect_operation_record') }}
+                  </el-button>
+                </div>
+
+                <table
+                  v-if="row.diffType === 'DIFF'"
+                  class="w-100 row-diff-table font-color-dark"
+                >
+                  <thead class="bg-light border-bottom">
+                    <tr>
+                      <th
+                        class="text-start p-3 text-sm fw-sub text-muted-foreground w-1/4"
+                      >
+                        {{
+                          $t('packages_business_verification_result_field_name')
+                        }}
+                      </th>
+                      <th class="text-start p-3 text-sm fw-sub w-[37.5%]">
+                        {{ $t('packages_dag_inspect_source_value') }}
+                      </th>
+                      <th
+                        class="text-start p-3 text-sm fw-sub text-destructive w-[37.5%]"
+                      >
+                        {{ $t('packages_dag_inspect_target_value') }}
+                      </th>
+                    </tr>
+                  </thead>
+                  <tbody v-if="onlyShowDiffFields">
+                    <tr
+                      v-for="field in row.diffFields"
+                      :key="field"
+                      class="border-bottom hover:bg-light"
+                    >
+                      <td class="p-3 text-sm text-muted-foreground">
+                        <div
+                          v-if="row.diffFieldsMap[field] !== field"
+                          class="flex align-center gap-1"
+                        >
+                          <VIcon class="mt-2" size="16"
+                            >ArrowsTurnForward</VIcon
+                          >
+                          <div>
+                            <div class="font-color-sslight">
+                              {{ field }}
+                            </div>
+                            <div class="font-color-dark">
+                              {{ row.diffFieldsMap[field] }}
+                            </div>
+                          </div>
+                        </div>
+
+                        <div v-else>
+                          {{ row.diffFieldsMap[field] }}
+                        </div>
+                      </td>
+                      <td class="p-3 text-sm font-medium">
+                        <span>{{ row.source[field] }}</span>
+                      </td>
+                      <td class="p-3 text-sm font-medium color-danger">
+                        <span>{{ row.target[row.diffFieldsMap[field]] }}</span>
+                      </td>
+                    </tr>
+                  </tbody>
+                  <tbody v-else>
+                    <tr
+                      v-for="(targetField, i) in row.targetFields"
+                      :key="targetField"
+                      class="border-bottom hover:bg-light"
+                    >
+                      <td class="p-3 text-sm text-muted-foreground">
+                        <div
+                          v-if="row.sourceFields[i] !== targetField"
+                          class="flex align-center gap-1"
+                        >
+                          <VIcon class="mt-2" size="16"
+                            >ArrowsTurnForward</VIcon
+                          >
+                          <div>
+                            <div class="font-color-sslight">
+                              {{ row.sourceFields[i] }}
+                            </div>
+                            <div class="font-color-dark">
+                              {{ targetField }}
+                            </div>
+                          </div>
+                        </div>
+                        <span v-else>{{ targetField }}</span>
+                      </td>
+                      <td class="p-3 text-sm font-medium">
+                        <span>{{ row.source[row.sourceFields[i]] }}</span>
+                      </td>
+                      <td
+                        class="p-3 text-sm font-medium"
+                        :class="{
+                          'color-danger':
+                            row.diffFieldsMap[row.sourceFields[i]],
+                        }"
+                      >
+                        <span>{{ row.target[targetField] }}</span>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+
+                <div v-else class="font-color-dark border-top">
+                  <div
+                    v-for="(value, key) in row.source || row.target"
+                    :key="key"
+                    class="flex border-bottom last:border-0 hover:bg-light"
+                  >
+                    <div class="flex-1 p-3 text-sm text-muted-foreground">
+                      {{ key }}
+                    </div>
+                    <div class="flex-1 p-3 text-sm font-medium">
+                      <span>{{ value }}</span>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <el-empty
+        v-show="!loadingList && !loadingDetails && !inspectList.length"
+      />
+    </div>
+
+    <InspectRecordDialog v-model="recordDialogVisible" :result-id="resultId" />
+  </ElDialog>
+</template>
+
+<style lang="scss">
+.inspect-detail-dialog {
+  max-height: 80vh;
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+
+  .el-dialog__header {
+    padding: 20px;
+  }
+  .el-dialog__body {
+    padding: 0;
+    display: flex;
+    flex-direction: column;
+    min-height: 0;
+  }
+}
+</style>
+
+<style lang="scss" scoped>
+.inspect-detail-container {
+  display: flex;
+  flex-direction: column;
+  min-height: 0;
+
+  .tag-amber {
+    background-color: #fceccd;
+    color: oklch(0.769 0.188 70.08);
+    border-color: oklch(0.83 0.19 84.43 / 0.4);
+  }
+
+  .row-diff-table {
+    thead > tr > th {
+      width: 37.5%;
+
+      &:first-child {
+        width: 25%;
+      }
+    }
+
+    tbody > tr {
+      &:last-child {
+        border-bottom: none !important;
+      }
+    }
+  }
+
+  .last-verify-time {
+    text-align: right;
+    color: #909399;
+  }
+
+  .text-muted {
+    color: #909399;
+  }
+
+  .text-danger {
+    color: #f56c6c;
+  }
+
+  .font-size-small {
+    font-size: 12px;
+  }
+
+  .inspect-detail-tabs {
+    &::v-deep .el-tabs__header {
+      margin-bottom: 15px;
+    }
+  }
+
+  .inspection-result-list {
+    width: 320px;
+  }
+
+  .inspection-result-header {
+  }
+
+  .inspection-result-count {
+    font-size: 12px;
+    color: #909399;
+    margin-top: 4px;
+  }
+
+  .inspection-result-actions {
+    margin-top: 8px;
+    display: flex;
+    justify-content: space-between;
+  }
+
+  .inspection-result-card {
+    cursor: pointer;
+    transition: background-color 0.2s;
+
+    border: 1px solid transparent;
+
+    &:hover {
+      background-color: rgba(31, 35, 41, 0.08);
+    }
+
+    &.active {
+      background-color: rgb(240, 244, 255) !important;
+    }
+  }
+
+  .inspection-card-header {
+    display: flex;
+    align-items: center;
+    margin-bottom: 12px;
+
+    i {
+      margin-right: 8px;
+      color: #909399;
+    }
+
+    .card-title {
+      flex: 1;
+      font-weight: 500;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+
+    .diff-tag {
+      margin-left: 8px;
+    }
+  }
+
+  .inspection-card-content {
+    padding-left: 24px;
+  }
+
+  .inspection-card-metrics {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 10px;
+  }
+
+  .inspection-card-metric {
+    display: flex;
+    flex-direction: column;
+
+    .metric-label {
+      font-size: 12px;
+      color: #909399;
+    }
+
+    .metric-value {
+      font-size: 14px;
+      font-weight: 500;
+    }
+  }
+}
+</style>
diff --git a/packages/dag/src/components/monitor/components/InspectRecordDialog.vue b/packages/dag/src/components/monitor/components/InspectRecordDialog.vue
new file mode 100644
index 0000000000..92ce2d8b2d
--- /dev/null
+++ b/packages/dag/src/components/monitor/components/InspectRecordDialog.vue
@@ -0,0 +1,89 @@
+<script setup lang="ts">
+import axios from 'axios'
+import dayjs from 'dayjs'
+import { ref } from 'vue'
+
+const loadingList = ref(false)
+const list = ref([])
+
+const props = defineProps({
+  resultId: {
+    type: String,
+    required: true,
+  },
+})
+
+interface Operation {
+  ts: number // 操作时间
+  op: string // 操作类型
+  msg: string // 操作信息
+  userId: string // 用户编号
+  user: string // 用户名
+}
+
+async function fetchList(): Promise<void> {
+  loadingList.value = true
+  try {
+    const data = await axios.get<Operation[]>(
+      `/api/task-inspect-results/${props.resultId}/operations`,
+    )
+    list.value = data
+  } catch (error) {
+    console.error('Failed to fetch inspect list:', error)
+  } finally {
+    loadingList.value = false
+  }
+}
+
+const onOpen = () => {
+  fetchList()
+}
+
+function formatTime(timestamp: number): string {
+  if (!timestamp) return '--'
+  return dayjs(timestamp).format('YYYY-MM-DD HH:mm:ss')
+}
+</script>
+
+<template>
+  <ElDialog
+    :title="$t('packages_dag_inspect_operation_record')"
+    width="60%"
+    append-to-body
+    :close-on-click-modal="false"
+    @open="onOpen"
+  >
+    <el-table
+      v-loading="loadingList"
+      class="has-border-t"
+      :data="list"
+      :default-sort="{ prop: 'ts', order: 'descending' }"
+    >
+      <el-table-column
+        prop="user"
+        :label="$t('packages_dag_inspect_operation_user')"
+        width="150"
+      />
+      <el-table-column
+        prop="op"
+        :label="$t('packages_dag_inspect_operation_type')"
+        width="180"
+      />
+      <el-table-column
+        prop="msg"
+        :label="$t('packages_dag_inspect_operation_message')"
+        show-overflow-tooltip
+      />
+      <el-table-column
+        prop="ts"
+        :label="$t('packages_dag_inspect_operation_time')"
+        width="180"
+        sortable
+      >
+        <template #default="{ row }">
+          {{ formatTime(row.ts) }}
+        </template>
+      </el-table-column>
+    </el-table>
+  </ElDialog>
+</template>
diff --git a/packages/dag/src/components/monitor/components/TaskInspect.vue b/packages/dag/src/components/monitor/components/TaskInspect.vue
new file mode 100644
index 0000000000..1e4904d61d
--- /dev/null
+++ b/packages/dag/src/components/monitor/components/TaskInspect.vue
@@ -0,0 +1,304 @@
+<script setup lang="ts">
+import { taskInspectApi } from '@tap/api'
+import { VEmpty } from '@tap/component'
+import i18n from '@tap/i18n'
+import dayjs from 'dayjs'
+import { onBeforeUnmount, ref, watch } from 'vue'
+import InspectDetailDialog from './InspectDetailDialog.vue'
+
+interface Props {
+  dataflow: {
+    id?: string
+    [key: string]: any
+  }
+  currentTab: string
+}
+
+const props = defineProps<Props>()
+const emit = defineEmits<{
+  (e: 'openInspect'): void
+}>()
+
+interface InspectItem {
+  id: string
+  type: string
+  beginTime: string
+  endTime: string
+  status: string
+  statusType: string
+  pingTime?: string
+  attrs: {
+    cdcIgnores: number
+    cdcAccepts: number
+    diffToTotals?: number
+  }
+}
+
+interface TaskInspectHistory {
+  id: string
+  type: string
+  beginTime: string
+  endTime: string
+  status: string
+  attrs: {
+    cdcIgnores: number
+    cdcAccepts: number
+    diffToTotals?: number
+  }
+}
+
+interface ApiResponse {
+  total: number
+  items: TaskInspectHistory[]
+}
+
+const loading = ref(false)
+const detailDialogVisible = ref(false)
+const currentInspectId = ref('')
+const inspectList = ref<InspectItem[]>([])
+const pingTime = ref('')
+const showEnabled = ref(false)
+let timeout: number | undefined
+
+const makeStatus = (status: string) => {
+  const statusMap: Record<string, string> = {
+    RUNNING: i18n.t('public_status_running'),
+    STOPPED: i18n.t('public_status_stop'),
+    DONE: i18n.t('public_status_finished'),
+    ERROR: i18n.t('public_status_error'),
+    PING_TIMEOUT: i18n.t('public_status_ping_timeout'),
+  }
+
+  const typeMap: Record<string, string> = {
+    RUNNING: 'success',
+    STOPPED: 'info',
+    DONE: 'primary',
+    ERROR: 'danger',
+    PING_TIMEOUT: 'warning',
+  }
+
+  return {
+    status: statusMap[status],
+    statusType: typeMap[status],
+  }
+}
+
+const handleDetail = (row: InspectItem) => {
+  currentInspectId.value = row.id
+  pingTime.value = dayjs(row.pingTime || row.beginTime).format(
+    'YYYY-MM-DD HH:mm:ss',
+  )
+  detailDialogVisible.value = true
+}
+
+const remoteMethod = async ({
+  page,
+}: {
+  page: { current: number; size: number }
+}) => {
+  const { current, size } = page
+  const { id: taskId } = props.dataflow || {}
+
+  if (!taskId) return Promise.resolve({ total: 0, data: [] })
+
+  const filter = JSON.stringify({
+    page: current,
+    size,
+    sort: ['beginTime desc'],
+  })
+
+  try {
+    const response = await taskInspectApi.getHistories(taskId, { filter })
+    const data = response as unknown as ApiResponse
+    return {
+      total: data.total || 0,
+      data:
+        data.items?.map((item) => ({
+          id: item.id,
+          type: item.type,
+          beginTime: dayjs(item.beginTime).format('YYYY-MM-DD HH:mm:ss'),
+          endTime: item.endTime
+            ? dayjs(item.endTime).format('YYYY-MM-DD HH:mm:ss')
+            : '',
+          ...makeStatus(item.status),
+          attrs: item.attrs,
+        })) || [],
+    }
+  } catch (error) {
+    console.error('Failed to fetch inspection results:', error)
+    return { total: 0, data: [] }
+  }
+}
+
+const fetch = async () => {
+  loading.value = true
+  const { data } = await remoteMethod({
+    page: { current: 1, size: 10 },
+  })
+
+  // data.sort((a, b) => dayjs(b.beginTime).diff(dayjs(a.beginTime)))
+
+  inspectList.value = data
+  loading.value = false
+}
+
+const checkEnabled = async () => {
+  const res = await taskInspectApi.getConfig(props.dataflow.id)
+  return res.mode && res.mode !== 'CLOSE'
+}
+
+const startLoop = () => {
+  timeout = window.setInterval(async () => {
+    await fetch()
+    if (!inspectList.value.length) {
+      const enabled = await checkEnabled()
+      if (!enabled) {
+        showEnabled.value = true
+      }
+    }
+  }, 5000)
+}
+
+const stopLoop = () => {
+  if (timeout) {
+    clearInterval(timeout)
+  }
+}
+
+watch(
+  () => props.currentTab,
+  (val) => {
+    if (val === 'inspect') {
+      fetch()
+      startLoop()
+    } else {
+      stopLoop()
+    }
+  },
+)
+
+fetch().then(async () => {
+  if (!inspectList.value.length) {
+    const enabled = await checkEnabled()
+    if (!enabled) {
+      showEnabled.value = true
+    }
+  }
+})
+
+onBeforeUnmount(() => {
+  stopLoop()
+})
+</script>
+
+<template>
+  <div v-loading="loading" class="inspect-wrap p-4 h-100 w-100 overflow-y-auto">
+    <div class="flex flex-column gap-4">
+      <div
+        v-for="inspect in inspectList"
+        :key="inspect.id"
+        class="flex align-items-stretch border rounded-xl overflow-hidden cursor-pointer hover:bg-light"
+        @click="handleDetail(inspect)"
+      >
+        <div
+          class="flex flex-column align-center gap-2 bg-light p-3 border-end"
+          style="min-width: 150px"
+        >
+          <div class="rounded-lg px-2 py-1 bg-fill-hover">
+            {{ inspect.type }}
+          </div>
+          <ElTag :type="inspect.statusType" size="small">{{
+            inspect.status
+          }}</ElTag>
+        </div>
+
+        <div
+          class="flex justify-content-around align-center flex-1 gap-4 p-3 px-4 border-end"
+        >
+          <div class="flex flex-column gap-2" style="min-width: 150px">
+            <span class="flex align-center gap-1"
+              ><VIcon>time</VIcon>{{ $t('packages_dag_inspect_start_time') }}
+            </span>
+            <span class="fw-sub font-color-dark">
+              {{ inspect.beginTime }}
+            </span>
+          </div>
+          <div class="flex flex-column gap-2" style="min-width: 150px">
+            <span class="flex align-center gap-1"
+              ><VIcon>time</VIcon>{{ $t('packages_dag_inspect_end_time') }}
+            </span>
+            <span class="fw-sub font-color-dark">
+              {{ inspect.endTime || '-' }}
+            </span>
+          </div>
+        </div>
+
+        <div
+          class="flex justify-content-around align-center flex-1 gap-4 p-3 px-4"
+        >
+          <div class="flex flex-column gap-2">
+            <span class="flex align-center gap-1"
+              ><VIcon>EyeOff</VIcon
+              >{{ $t('packages_dag_inspect_ignore_records') }}</span
+            >
+            <span class="fw-sub font-color-dark">
+              {{ inspect.attrs.cdcIgnores }}
+            </span>
+          </div>
+
+          <div class="flex flex-column gap-2">
+            <span class="flex align-center gap-1"
+              ><VIcon>Eye</VIcon
+              >{{ $t('packages_dag_inspect_accept_records') }}</span
+            >
+            <span class="fw-sub font-color-dark">
+              {{ inspect.attrs.cdcAccepts }}
+            </span>
+          </div>
+
+          <div class="flex flex-column gap-2">
+            <span class="flex align-center gap-1"
+              ><VIcon>FileChartColumnIncreasing</VIcon
+              >{{ $t('packages_dag_inspect_diff_records') }}</span
+            >
+            <span
+              class="fw-sub font-color-dark"
+              :class="{
+                'color-danger':
+                  inspect.attrs.diffToTotals > 0 &&
+                  inspect.status === 'RUNNING',
+              }"
+            >
+              {{ inspect.attrs.diffToTotals }}
+            </span>
+          </div>
+
+          <ElButton text type="primary">
+            {{ $t('public_button_details') }}
+            <VIcon>arrow-right</VIcon>
+          </ElButton>
+        </div>
+      </div>
+    </div>
+
+    <VEmpty v-if="inspectList.length === 0" large>
+      <template v-if="showEnabled">
+        <div class="flex flex-column gap-3 align-center">
+          <span class="font-color-light">{{
+            $t('packages_dag_inspect_start_config_desc')
+          }}</span>
+          <ElButton @click="emit('openInspect')">
+            <VIcon>data-scan</VIcon>
+            {{ $t('packages_dag_inspect_start_config') }}
+          </ElButton>
+        </div>
+      </template>
+    </VEmpty>
+
+    <InspectDetailDialog
+      v-model="detailDialogVisible"
+      :inspect-id="currentInspectId"
+      :ping-time="pingTime"
+    />
+  </div>
+</template>
diff --git a/packages/dag/src/locale/lang/en.js b/packages/dag/src/locale/lang/en.js
index b65f34ceec..4f6ae9a9c9 100644
--- a/packages/dag/src/locale/lang/en.js
+++ b/packages/dag/src/locale/lang/en.js
@@ -927,6 +927,8 @@ export default {
     'When enabled, the generated table names will have a date suffix corresponding to the runtime of the task',
   packages_dag_table_rename_multiple:
     'In the task, only one table editing node is allowed',
+  packages_dag_table_rename_multiple:
+    'In the task, only one table editing node is allowed',
   packages_dag_migrate_union: 'Union',
   packages_dag_merged_tableName: 'Merged Table Name',
   packages_dag_merged_tableName_ph: 'Please enter the merged table name',
@@ -953,7 +955,7 @@ export default {
     'When enabled, the child tables are filtered out; when disabled, the main table is filtered out.',
   packages_dag_enableConcurrentRead: 'Enable Concurrent Table Reading',
   packages_dag_enableConcurrentRead_tips:
-    'Enabling this will allow the system to read and sync multiple tables simultaneously, ideal for scenarios with many small tables to improve performance. \nNote: In full-sync mode, newly added tables won’t sync once enabled. Adjust the target node concurrent thread count based on available resources to maintain stability.',
+    "Enabling this will allow the system to read and sync multiple tables simultaneously, ideal for scenarios with many small tables to improve performance. \nNote: In full-sync mode, newly added tables won't sync once enabled. Adjust the target node concurrent thread count based on available resources to maintain stability.",
   packages_dag_concurrentReadThreadNumber: 'Number of Tables to Read',
   packages_dag_missing_primary_key_or_index:
     'Missing Primary Key or Unique Index',
@@ -964,8 +966,8 @@ export default {
   packages_dag_add_new_connection: 'Create New Connection',
   packages_dag_add_own_datasource_desc:
     'Configure a new data source from the list of connectors in TapData',
-  packages_dag_no_datasource: 'I Don’t Have a Data Source',
-  packages_dag_no_target_datasource: 'I Don’t Have a Target Data Source',
+  packages_dag_no_datasource: "I Don't Have a Data Source",
+  packages_dag_no_target_datasource: "I Don't Have a Target Data Source",
   packages_dag_no_datasource_desc:
     'TapData provides a demo library with 2 sources and 2 targets.',
   packages_dag_have_connection: 'Select Existing Connection',
@@ -999,9 +1001,85 @@ export default {
   packages_dag_field_path: 'Field Path',
   packages_dag_email_receivers: 'Email Receivers',
   packages_dag_merge_table_js_node_error:
+   
     'Merge table node cannot have JS node after it',
   packages_dag_merge_table_table_not_allow_target:
+   
     'Merge table does not support writing to {val}',
+  packages_dag_full_validation: 'Full Validation',
+  packages_dag_incremental_validation: 'Incremental Validation',
+  packages_dag_incremental_validation_tips:
+    'Only validate new and modified data',
+  packages_dag_validation_frequency: 'Validation Frequency',
+  packages_dag_every: 'Every',
+  packages_dag_seconds: 'Seconds',
+  packages_dag_records: 'Records',
+  packages_dag_enable_validation: 'Enable Validation',
+  packages_dag_inspect_type: 'Type',
+  packages_dag_inspect_start_time: 'Start Time',
+  packages_dag_inspect_end_time: 'End Time',
+  packages_dag_inspect_status: 'Status',
+  packages_dag_inspect_result: 'Result',
+  packages_dag_inspect_type_count: 'Incremental Validation',
+  packages_dag_inspect_type_hash: 'Auto Repair',
+  packages_dag_inspect_type_field: 'Field Validation',
+  packages_dag_inspect_type_jointField: 'Joint Field Validation',
+  packages_dag_inspect_type_full: 'Full Validation',
+  packages_dag_inspect_type_increment: 'Incremental Validation',
+  packages_dag_inspect_status_scheduling: 'Scheduling',
+  packages_dag_inspect_status_running: 'Running',
+  packages_dag_inspect_status_done: 'Completed',
+  packages_dag_inspect_status_error: 'Error',
+  packages_dag_inspect_result_passed: 'Passed',
+  packages_dag_inspect_result_failed: 'Failed',
+  packages_dag_inspect_result_error: 'Error',
+  packages_dag_inspect_detail_title: 'Verification Details',
+  packages_dag_inspect_last_verify_time: 'Last Verification Time',
+  packages_dag_inspect_source_table: 'Source Table',
+  packages_dag_inspect_target_table: 'Target Table',
+  packages_dag_inspect_count: 'Verification Count',
+  packages_dag_inspect_diff_count: 'Data Differences: {count}',
+  packages_dag_inspect_detail_tab: 'Verification Details',
+  packages_dag_inspect_summary_tab: 'Verification Summary',
+  packages_dag_inspect_source_field: 'Source Field',
+  packages_dag_inspect_target_field: 'Target Field',
+  packages_dag_inspect_value: 'Value',
+  packages_dag_inspect_no_data: 'No data available',
+  packages_dag_inspect_loading: 'Loading...',
+  packages_dag_inspect_fetch_error: 'Failed to fetch verification details',
+  packages_dag_inspect_summary_title: 'Data Differences Found',
+  packages_dag_inspect_summary_desc:
+    'There are {count} records with differences between source and target',
+  packages_dag_inspect_verification_summary: 'Verification Summary',
+  packages_dag_inspect_total_records: 'Total Records',
+  packages_dag_inspect_source_records: 'Source Records',
+  packages_dag_inspect_target_records: 'Target Records',
+  packages_dag_inspect_ignore_records: 'Ignores',
+  packages_dag_inspect_accept_records: 'Accepts',
+  packages_dag_inspect_diff_records: 'Differences',
+  packages_dag_inspect_diff_records_num: 'Diff: {num}',
+  packages_dag_inspect_target_more_num: 'More: {num}',
+  packages_dag_inspect_target_less_num: 'Less: {num}',
+  packages_dag_inspect_source_value: 'Source Value',
+  packages_dag_inspect_target_value: 'Target Value',
+  packages_dag_inspect_row_id: 'Row ID',
+  packages_dag_inspect_diff_type_diff: 'Diff',
+  packages_dag_inspect_diff_type_miss: 'Miss',
+  packages_dag_inspect_diff_type_more: 'More',
+  packages_dag_inspect_start_config: 'Start Configuration',
+  packages_dag_inspect_start_config_desc:
+    'You have not enabled data validation',
   packages_dag_only_include_pk: 'Only Include Primary Key',
   packages_dag_only_include_uk: 'Only Include Unique Index',
+  packages_dag_auto_repair: 'Auto Repair',
+  packages_dag_auto_repair_tips: 'Enable auto repair',
+  packages_dag_auto_repair_disabled_tips:
+    'Please select at least one validation method',
+  packages_dag_inspect_operation_record: 'Operation Record',
+  packages_dag_inspect_operation_type: 'Operation Type',
+  packages_dag_inspect_operation_message: 'Operation Message',
+  packages_dag_inspect_operation_time: 'Operation Time',
+  packages_dag_inspect_operation_user: 'Operation User',
+  packages_dag_task_inspect_difference_alarm:
+    'Task Inspection Difference Alarm',
 }
diff --git a/packages/dag/src/locale/lang/zh-CN.js b/packages/dag/src/locale/lang/zh-CN.js
index 6a9fbcac9e..af7037f9fa 100644
--- a/packages/dag/src/locale/lang/zh-CN.js
+++ b/packages/dag/src/locale/lang/zh-CN.js
@@ -10,6 +10,8 @@ export default {
   packages_dag_dag_table: '表',
   packages_dag_dag_create_table_as_node: '创建新表作为节点使用',
   packages_dag_dialog_createTable: '创建新表',
+  packages_dag_dialog_placeholderTable:
+    '仅支持英文、数字、下划线、点、减号，并以英文字母开头，不允许 system 开头',
   packages_dag_dialog_placeholderTable:
     '仅支持英文、数字、下划线、点、减号，并以英文字母开头，不允许 system 开头',
   packages_dag_dataFlow_flowEngineVersion: '引擎版本',
@@ -422,9 +424,9 @@ export default {
   packages_dag_nodes_targetdatabase_jiedianmiaoshu: '节点描述',
   packages_dag_src_store_weizhaodaojiedian: '未找到节点',
   packages_dag_src_store_qingkongjiedianshu: '清空节点输入输出的监听',
-  packages_dag_node_none_input: '“ {val1} ”至少需要{val2}个源节点',
-  packages_dag_node_none_output: '“ {val1} ”至少需要{val2}个目标节点',
-  packages_dag_node_none_connection: '“ {val1} ”没有任何连线',
+  packages_dag_node_none_input: '" {val1} "至少需要{val2}个源节点',
+  packages_dag_node_none_output: '" {val1} "至少需要{val2}个目标节点',
+  packages_dag_node_none_connection: '" {val1} "没有任何连线',
   packages_dag_node_only_as_source: '该节点「{val1}」仅支持作为源',
   packages_dag_node_only_as_target: '该节点「{val1}」仅支持作为目标',
   packages_dag_components_alert_dangqianrenwuyi: '当前任务已报错停止，请关注!',
@@ -863,4 +865,75 @@ export default {
     '主从合并后不支持将 {val} 作为写入目标',
   packages_dag_only_include_pk: '仅包含主键',
   packages_dag_only_include_uk: '仅包含唯一索引',
+  packages_dag_full_validation: '全量校验',
+  packages_dag_incremental_validation: '增量校验',
+  packages_dag_incremental_validation_tips: '仅校验新增和修改的数据',
+  packages_dag_validation_frequency: '校验频率',
+  packages_dag_every: '每',
+  packages_dag_seconds: '秒',
+  packages_dag_records: '条记录',
+  packages_dag_enable_validation: '启用校验',
+  packages_dag_inspect_type: '类型',
+  packages_dag_inspect_start_time: '运行开始时间',
+  packages_dag_inspect_end_time: '运行结束时间',
+  packages_dag_inspect_status: '状态',
+  packages_dag_inspect_result: '结果',
+  packages_dag_inspect_type_count: '增量校验',
+  packages_dag_inspect_type_hash: '自动修复',
+  packages_dag_inspect_type_field: '字段校验',
+  packages_dag_inspect_type_jointField: '联合字段校验',
+  packages_dag_inspect_type_full: '全量校验',
+  packages_dag_inspect_type_increment: '增量校验',
+  packages_dag_inspect_status_scheduling: '调度中',
+  packages_dag_inspect_status_running: '运行中',
+  packages_dag_inspect_status_done: '已完成',
+  packages_dag_inspect_status_error: '错误',
+  packages_dag_inspect_result_passed: '一致',
+  packages_dag_inspect_result_failed: '错误',
+  packages_dag_inspect_result_error: '错误',
+  // Inspect detail dialog translations
+  packages_dag_inspect_detail_title: '检验详情',
+  packages_dag_inspect_last_verify_time: '最后验证时间',
+  packages_dag_inspect_source_table: '源表',
+  packages_dag_inspect_target_table: '目标表',
+  packages_dag_inspect_count: '校验次数',
+  packages_dag_inspect_diff_count: '表数据差异：{count}',
+  packages_dag_inspect_detail_tab: '校验详情',
+  packages_dag_inspect_summary_tab: '校验摘要',
+  packages_dag_inspect_source_field: '源表字段名',
+  packages_dag_inspect_target_field: '目标字段名',
+  packages_dag_inspect_value: '值',
+  packages_dag_inspect_no_data: '暂无数据',
+  packages_dag_inspect_loading: '加载中...',
+  packages_dag_inspect_fetch_error: '获取检验详情失败',
+  packages_dag_inspect_summary_title: '存在数据差异',
+  packages_dag_inspect_summary_desc:
+    '源表和目标表数据存在差异，共 {count} 条记录不一致',
+  packages_dag_inspect_verification_summary: '验证摘要',
+  packages_dag_inspect_total_records: '总记录数',
+  packages_dag_inspect_source_records: '源表记录数',
+  packages_dag_inspect_target_records: '目标表记录数',
+  packages_dag_inspect_ignore_records: '忽略次数',
+  packages_dag_inspect_accept_records: '抽样次数',
+  packages_dag_inspect_diff_records: '差异条数',
+  packages_dag_inspect_diff_records_num: '差异 {num} 条',
+  packages_dag_inspect_target_more_num: '目标多 {num} 条',
+  packages_dag_inspect_target_less_num: '目标少 {num} 条',
+  packages_dag_inspect_source_value: '源表值',
+  packages_dag_inspect_target_value: '目标表值',
+  packages_dag_inspect_row_id: '行 ID',
+  packages_dag_inspect_diff_type_diff: '差异',
+  packages_dag_inspect_diff_type_miss: '目标少',
+  packages_dag_inspect_diff_type_more: '目标多',
+  packages_dag_inspect_start_config: '开始配置',
+  packages_dag_inspect_start_config_desc: '您尚未开启数据校验功能',
+  packages_dag_auto_repair: '自动修复',
+  packages_dag_auto_repair_tips: '启用后将自动修复数据差异',
+  packages_dag_auto_repair_disabled_tips: '请先选择至少一种校验方式',
+  packages_dag_inspect_operation_record: '操作记录',
+  packages_dag_inspect_operation_type: '操作类型',
+  packages_dag_inspect_operation_message: '操作信息',
+  packages_dag_inspect_operation_time: '操作时间',
+  packages_dag_inspect_operation_user: '操作人',
+  packages_dag_task_inspect_difference_alarm: '任务校验差异告警',
 }
diff --git a/packages/dag/src/locale/lang/zh-TW.js b/packages/dag/src/locale/lang/zh-TW.js
index 7ee780c422..d2b85c047a 100644
--- a/packages/dag/src/locale/lang/zh-TW.js
+++ b/packages/dag/src/locale/lang/zh-TW.js
@@ -853,4 +853,70 @@ export default {
     '主從合併後不支持將 {val} 作為寫入目標',
   packages_dag_only_include_pk: '僅包含主鍵',
   packages_dag_only_include_uk: '僅包含唯一索引',
+  packages_dag_full_validation: '全量校验',
+  packages_dag_incremental_validation: '增量校验',
+  packages_dag_incremental_validation_tips: '僅校驗新增和修改的數據',
+  packages_dag_validation_frequency: '校驗頻率',
+  packages_dag_every: '每',
+  packages_dag_seconds: '秒',
+  packages_dag_records: '條記錄',
+  packages_dag_enable_validation: '啟用校驗',
+  packages_dag_inspect_type: '類型',
+  packages_dag_inspect_start_time: '運行開始時間',
+  packages_dag_inspect_end_time: '運行結束時間',
+  packages_dag_inspect_status: '狀態',
+  packages_dag_inspect_result: '結果',
+  packages_dag_inspect_type_count: '增量校驗',
+  packages_dag_inspect_type_hash: '自動修復',
+  packages_dag_inspect_type_field: '字段校驗',
+  packages_dag_inspect_type_jointField: '聯合字段校驗',
+  packages_dag_inspect_type_full: '全量校驗',
+  packages_dag_inspect_type_increment: '增量校驗',
+  packages_dag_inspect_status_scheduling: '調度中',
+  packages_dag_inspect_status_running: '運行中',
+  packages_dag_inspect_status_done: '已完成',
+  packages_dag_inspect_status_error: '錯誤',
+  packages_dag_inspect_result_passed: '一致',
+  packages_dag_inspect_result_failed: '錯誤',
+  packages_dag_inspect_result_error: '錯誤',
+  packages_dag_inspect_detail_title: '檢驗詳情',
+  packages_dag_inspect_last_verify_time: '最後驗證時間',
+  packages_dag_inspect_source_table: '源表',
+  packages_dag_inspect_target_table: '目標表',
+  packages_dag_inspect_count: '校驗次數',
+  packages_dag_inspect_diff_count: '表數據差異：{count}',
+  packages_dag_inspect_detail_tab: '校驗詳情',
+  packages_dag_inspect_summary_tab: '校驗摘要',
+  packages_dag_inspect_source_field: '源表字段名',
+  packages_dag_inspect_target_field: '目標表字段名',
+  packages_dag_inspect_value: '值',
+  packages_dag_inspect_no_data: '暫無數據',
+  packages_dag_inspect_loading: '加載中...',
+  packages_dag_inspect_fetch_error: '獲取檢驗詳情失敗',
+  packages_dag_inspect_summary_title: '存在數據差異',
+  packages_dag_inspect_summary_desc:
+    '源表和目標表數據存在差異，共 {count} 條記錄不一致',
+  packages_dag_inspect_verification_summary: '驗證摘要',
+  packages_dag_inspect_total_records: '總記錄數',
+  packages_dag_inspect_source_records: '源表記錄數',
+  packages_dag_inspect_target_records: '目標表記錄數',
+  packages_dag_inspect_ignore_records: '忽略次數',
+  packages_dag_inspect_accept_records: '接受次數',
+  packages_dag_inspect_diff_records: '差異條數',
+  packages_dag_inspect_diff_records_num: '差異 {num} 條',
+  packages_dag_inspect_target_more_num: '目標多 {num} 條',
+  packages_dag_inspect_target_less_num: '目標少 {num} 條',
+  packages_dag_inspect_source_value: '源表值',
+  packages_dag_inspect_target_value: '目標表值',
+  packages_dag_inspect_row_id: '行 ID',
+  packages_dag_inspect_diff_type_diff: '差異',
+  packages_dag_inspect_diff_type_miss: '目標少',
+  packages_dag_inspect_diff_type_more: '目標多',
+  packages_dag_inspect_start_config: '開始配置',
+  packages_dag_inspect_start_config_desc: '您尚未開啟數據校驗功能',
+  packages_dag_auto_repair: '自動修復',
+  packages_dag_auto_repair_tips: '啟用後將自動修復數據差異',
+  packages_dag_auto_repair_disabled_tips: '請先選擇至少一種校驗方式',
+  packages_dag_inspect_operation_record: '操作記錄',
+  packages_dag_task_inspect_difference_alarm: '任務校驗差異告警',
 }
diff --git a/packages/form/src/components/infinite-select/InfiniteSelect.vue b/packages/form/src/components/infinite-select/InfiniteSelect.vue
index e6828a6284..de8ab1e342 100644
--- a/packages/form/src/components/infinite-select/InfiniteSelect.vue
+++ b/packages/form/src/components/infinite-select/InfiniteSelect.vue
@@ -2,7 +2,7 @@
 import { isNum } from '@tap/shared'
 import { debounce, escapeRegExp, isString, merge } from 'lodash-es'
 import { computed, nextTick, onMounted, ref, watch } from 'vue'
-import ElSelectLoading from './ElSelectLoading.vue'
+import SelectLoading from './SelectLoading.vue'
 
 const page = ref(0)
 const loadingData = ref(false)
@@ -160,8 +160,6 @@ const onVisibleChange = (visible: boolean) => {
  */
 const loadDataList = async (newPage: number) => {
   try {
-    loadingMore.value = true
-    emit('update:loading', true)
     const res = await props.method(getParams(newPage))
     const list = res.items || []
 
@@ -174,16 +172,24 @@ const loadDataList = async (newPage: number) => {
     page.value = newPage
   } catch (error) {
     console.error(error)
-  } finally {
-    loadingMore.value = false
   }
 }
 
+const refresh = async () => {
+  loadingData.value = true
+  await loadDataList(1).finally(() => {
+    loadingData.value = false
+  })
+}
+
 /**
  * 加载更多数据
  */
 const handleLoadMore = async (newPage: number) => {
-  await loadDataList(newPage)
+  loadingMore.value = true
+  await loadDataList(newPage).finally(() => {
+    loadingMore.value = false
+  })
 }
 
 const handleChange = () => {
@@ -222,7 +228,8 @@ const onUpdateModelValue = (val) => {
 }
 
 defineExpose({
-  loadDataList,
+  loadDataList: refresh,
+  refresh,
   focus: () => {
     selectRef.value.focus()
   },
@@ -301,7 +308,7 @@ onMounted(() => {
       </template>
     </div>
 
-    <ElSelectLoading
+    <SelectLoading
       v-if="optionTotal !== 0 && !showLoading"
       :page="page"
       :loading="loadingMore"
diff --git a/packages/form/src/components/infinite-select/ElSelectLoading.vue b/packages/form/src/components/infinite-select/SelectLoading.vue
similarity index 100%
rename from packages/form/src/components/infinite-select/ElSelectLoading.vue
rename to packages/form/src/components/infinite-select/SelectLoading.vue
diff --git a/packages/form/src/components/infinite-select/index.ts b/packages/form/src/components/infinite-select/index.ts
index 16fc670b00..6cc6d8602f 100644
--- a/packages/form/src/components/infinite-select/index.ts
+++ b/packages/form/src/components/infinite-select/index.ts
@@ -1,6 +1,6 @@
 import { PreviewText } from '@formily/element-plus'
-import { transformComponent } from '@formily/element-plus/esm/__builtins__'
 import { connect, mapProps, mapReadPretty } from '@formily/vue'
+import { transformComponent } from '../../shared'
 import InfiniteSelect from './InfiniteSelect.vue'
 
 const AsyncSelect = InfiniteSelect
@@ -10,6 +10,7 @@ const TransformAsyncSelect = transformComponent(AsyncSelect, {
 })
 
 // ⚠️被connect包裹了一层，里面的defineExpose会访问不到
+// 可以使用 getInnerRef() 获取暴露的属性
 const InnerAsyncSelect = connect(
   TransformAsyncSelect,
   mapProps({
diff --git a/packages/form/src/shared/index.js b/packages/form/src/shared/index.js
deleted file mode 100644
index d67ed124ff..0000000000
--- a/packages/form/src/shared/index.js
+++ /dev/null
@@ -1,3 +0,0 @@
-export * from './create'
-export * from './validate'
-export * from './reactive'
diff --git a/packages/form/src/shared/index.ts b/packages/form/src/shared/index.ts
new file mode 100644
index 0000000000..b947151a86
--- /dev/null
+++ b/packages/form/src/shared/index.ts
@@ -0,0 +1,44 @@
+import { each, merge } from '@formily/shared'
+import { h } from '@formily/vue'
+import { defineComponent, ref, type Component } from 'vue'
+
+export * from './create'
+export * from './validate'
+export * from './reactive'
+
+type ListenersTransformRules = Record<string, string>
+
+export const transformComponent = <T extends Record<string, any>>(
+  tag: any,
+  transformRules?: ListenersTransformRules,
+  defaultProps?: Partial<T>,
+): Component<T> | any => {
+  return defineComponent({
+    setup(props, { attrs, slots, expose }) {
+      return () => {
+        const innerRef = ref(null)
+        let data = {
+          ...attrs,
+        }
+        if (transformRules) {
+          const listeners = transformRules
+          each(listeners, (event, extract) => {
+            data[`on${event[0].toUpperCase()}${event.slice(1)}`] =
+              attrs[`on${extract[0].toUpperCase()}${extract.slice(1)}`]
+          })
+        }
+        if (defaultProps) {
+          data = merge(defaultProps, attrs)
+        }
+
+        data.ref = innerRef
+
+        expose({
+          getInnerRef: () => innerRef.value,
+        })
+
+        return h(tag, data, slots)
+      }
+    },
+  })
+}
diff --git a/packages/i18n/src/locale/lang/en.js b/packages/i18n/src/locale/lang/en.js
index d8d537d67e..69a95e8bfb 100644
--- a/packages/i18n/src/locale/lang/en.js
+++ b/packages/i18n/src/locale/lang/en.js
@@ -81,6 +81,7 @@ export default {
   public_status_do_snapshot: 'Full Syncing',
   public_status_snapshot_completed: 'Full Sync Completed',
   public_status_do_cdc: 'Incremental Syncing',
+  public_status_ping_timeout: 'Ping Timeout',
   // button
   public_button_edit: 'Edit',
   public_button_confirm: 'OK',
@@ -389,6 +390,8 @@ export default {
   public_store_type: 'Store Type',
   public_from_db_type: 'From DB Type',
   public_sample_size: 'Sample Size',
+  public_data_validation: 'Data Validation',
+  public_validation_record: 'Validation Record',
   public_foreign_key_tip: 'Foreign key {name} to {val}',
   public_form_design: 'Form Design',
   public_code_edit: 'Code Edit',
diff --git a/packages/i18n/src/locale/lang/zh-CN.js b/packages/i18n/src/locale/lang/zh-CN.js
index 4cc7da6683..aa2dbdbbcd 100644
--- a/packages/i18n/src/locale/lang/zh-CN.js
+++ b/packages/i18n/src/locale/lang/zh-CN.js
@@ -81,7 +81,7 @@ export default {
   public_status_do_snapshot: '全量进行中',
   public_status_snapshot_completed: '全量已完成',
   public_status_do_cdc: '增量进行中',
-
+  public_status_ping_timeout: '心跳超时',
   // 按钮
   public_button_edit: '编辑',
   public_button_confirm: '确定',
@@ -380,6 +380,8 @@ export default {
   public_load_more: '加载更多',
   public_loading: '拼命加载中',
   public_load_end: '到底了',
+  public_data_validation: '数据校验',
+  public_validation_record: '校验记录',
   public_foreign_key_tip: '外键 {name} 指向 {val}',
   public_form_design: '表单设计',
   public_code_edit: '代码编辑',
diff --git a/packages/i18n/src/locale/lang/zh-TW.js b/packages/i18n/src/locale/lang/zh-TW.js
index 5a5384401e..80adc9439c 100644
--- a/packages/i18n/src/locale/lang/zh-TW.js
+++ b/packages/i18n/src/locale/lang/zh-TW.js
@@ -81,6 +81,7 @@ export default {
   public_status_do_snapshot: '全量進行中',
   public_status_snapshot_completed: '全量已完成',
   public_status_do_cdc: '增量進行中',
+  public_status_ping_timeout: '心跳超時',
   // 按鈕
   public_button_edit: '編輯',
   public_button_confirm: '確定',
@@ -378,6 +379,8 @@ export default {
   public_load_more: '加載更多',
   public_loading: '拼命加載中',
   public_load_end: '到底了',
+  public_data_validation: '數據校驗',
+  public_validation_record: '校驗記錄',
   public_foreign_key_tip: '外鍵 {name} 指向 {val}',
   public_form_design: '表單設計',
   public_code_edit: '代碼編輯',
diff --git a/patches/@formily__vue@2.3.3.patch b/patches/@formily__vue@2.3.3.patch
new file mode 100644
index 0000000000..dd3d61e36e
--- /dev/null
+++ b/patches/@formily__vue@2.3.3.patch
@@ -0,0 +1,81 @@
+diff --git a/esm/shared/connect.js b/esm/shared/connect.js
+index 11841dd0a4cc6231e4485fe0d9adfb93abec9db3..3c036b08a9b968587b06f4eb90155562dc1f6109 100644
+--- a/esm/shared/connect.js
++++ b/esm/shared/connect.js
+@@ -9,7 +9,7 @@ var __assign = (this && this.__assign) || function () {
+     };
+     return __assign.apply(this, arguments);
+ };
+-import { isVue2, markRaw, defineComponent } from 'vue-demi';
++import { isVue2, markRaw, defineComponent, ref } from 'vue-demi';
+ import { isFn, isStr, FormPath, each, isValid } from '@formily/shared';
+ import { isVoidField } from '@formily/core';
+ import { observer } from '@formily/reactive-vue';
+@@ -47,8 +47,14 @@ export function mapProps() {
+         return observer(defineComponent({
+             name: target.name ? "Connected".concat(target.name) : "ConnectedComponent",
+             setup: function (props, _a) {
+-                var attrs = _a.attrs, slots = _a.slots, listeners = _a.listeners;
++                var attrs = _a.attrs, slots = _a.slots, listeners = _a.listeners, expose = _a.expose;
+                 var fieldRef = useField();
++                var innerRef = ref(null)
++
++                expose({
++                    getInnerRef: () => innerRef.value?.getInnerRef?.() || innerRef.value
++                })
++
+                 return function () {
+                     var newAttrs = fieldRef.value
+                         ? transform(__assign({}, attrs), fieldRef.value)
+@@ -56,6 +62,7 @@ export function mapProps() {
+                     return h(target, {
+                         attrs: newAttrs,
+                         on: listeners,
++                        ref: innerRef
+                     }, slots);
+                 };
+             },
+@@ -67,8 +74,14 @@ export function mapReadPretty(component, readPrettyProps) {
+         return observer(defineComponent({
+             name: target.name ? "Read".concat(target.name) : "ReadComponent",
+             setup: function (props, _a) {
+-                var attrs = _a.attrs, slots = _a.slots, listeners = _a.listeners;
++                var attrs = _a.attrs, slots = _a.slots, listeners = _a.listeners, expose = _a.expose;
+                 var fieldRef = useField();
++                var innerRef = ref(null)
++
++                expose({
++                    getInnerRef: () => innerRef.value?.getInnerRef?.() || innerRef.value
++                })
++
+                 return function () {
+                     var field = fieldRef.value;
+                     return h(field && !isVoidField(field) && field.pattern === 'readPretty'
+@@ -76,6 +89,7 @@ export function mapReadPretty(component, readPrettyProps) {
+                         : target, {
+                         attrs: __assign(__assign({}, readPrettyProps), attrs),
+                         on: listeners,
++                        ref: innerRef
+                     }, slots);
+                 };
+             },
+@@ -104,10 +118,16 @@ export function connect(target) {
+     else {
+         var functionalComponent = defineComponent({
+             name: target.name,
+-            setup: function (props, _a) {
+-                var attrs = _a.attrs, slots = _a.slots;
++            setup: function (props, _a,) {
++                var attrs = _a.attrs, slots = _a.slots, expose = _a.expose;
++                var innerRef = ref(null)
++
++                expose({
++                    getInnerRef: () => innerRef.value?.getInnerRef?.() || innerRef.value
++                })
++
+                 return function () {
+-                    return h(Component, { props: props, attrs: attrs }, slots);
++                    return h(Component, { props: props, attrs: attrs, ref: innerRef }, slots);
+                 };
+             },
+         });
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index e00c7174e6..14a9148614 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -21,6 +21,9 @@ patchedDependencies:
   '@formily/element-plus@1.1.0':
     hash: b1e72365abdc6112dde3a107e094ffbc07b8d534caf03a0500bdd8c6c4c380f6
     path: patches/@formily__element-plus@1.1.0.patch
+  '@formily/vue@2.3.3':
+    hash: b575cff2c1081e22c9bafc64ee247547bca91d60de4d342714efff2cd12f1700
+    path: patches/@formily__vue@2.3.3.patch
 
 importers:
 
@@ -122,7 +125,7 @@ importers:
         version: 2.3.3
       '@formily/vue':
         specifier: ^2.3.0
-        version: 2.3.3(typescript@5.8.3)(vue@3.5.13(typescript@5.8.3))
+        version: 2.3.3(patch_hash=b575cff2c1081e22c9bafc64ee247547bca91d60de4d342714efff2cd12f1700)(typescript@5.8.3)(vue@3.5.13(typescript@5.8.3))
       '@tap/api':
         specifier: workspace:^1.0.0
         version: link:../../packages/api
@@ -249,7 +252,7 @@ importers:
         version: 0.17.4(@vue/compiler-sfc@3.5.13)
       unplugin-vue-components:
         specifier: ^0.25.2
-        version: 0.25.2(@babel/parser@7.27.0)(rollup@4.40.0)(vue@3.5.13(typescript@5.8.3))
+        version: 0.25.2(@babel/parser@7.27.2)(rollup@4.40.0)(vue@3.5.13(typescript@5.8.3))
       vite:
         specifier: ^5.3.1
         version: 5.4.18(@types/node@20.17.30)(sass@1.86.3)(terser@5.39.0)
@@ -369,14 +372,14 @@ importers:
         specifier: ^1.86.2
         version: 1.86.3
       unplugin-auto-import:
-        specifier: ^0.17.6
-        version: 0.17.8(@vueuse/core@10.11.1(vue@3.5.13(typescript@5.8.3)))(rollup@4.40.0)
+        specifier: ^19.2.0
+        version: 19.2.0(@vueuse/core@10.11.1(vue@3.5.13(typescript@5.8.3)))
       unplugin-icons:
         specifier: ^0.19.0
         version: 0.19.3(@vue/compiler-sfc@3.5.13)
       unplugin-vue-components:
         specifier: ^0.27.0
-        version: 0.27.5(@babel/parser@7.27.0)(rollup@4.40.0)(vue@3.5.13(typescript@5.8.3))
+        version: 0.27.5(@babel/parser@7.27.2)(rollup@4.40.0)(vue@3.5.13(typescript@5.8.3))
       vite:
         specifier: ^6.2.4
         version: 6.3.1(@types/node@20.17.30)(sass@1.86.3)(terser@5.39.0)(yaml@2.7.1)
@@ -583,6 +586,9 @@ importers:
       resize-observer-polyfill:
         specifier: ^1.5.1
         version: 1.5.1
+      vue:
+        specifier: ^3.4.29
+        version: 3.5.13(typescript@5.8.3)
       vue-json-pretty:
         specifier: ^1.9.5
         version: 1.9.5
@@ -621,7 +627,7 @@ importers:
         version: 2.3.3
       '@formily/vue':
         specifier: ^2.3.0
-        version: 2.3.3(typescript@5.8.3)(vue@3.5.13(typescript@5.8.3))
+        version: 2.3.3(patch_hash=b575cff2c1081e22c9bafc64ee247547bca91d60de4d342714efff2cd12f1700)(typescript@5.8.3)(vue@3.5.13(typescript@5.8.3))
       '@tap/api':
         specifier: workspace:^1.0.0
         version: link:../api
@@ -914,10 +920,18 @@ packages:
     resolution: {integrity: sha512-4A/SCr/2KLd5jrtOMFzaKjVtAei3+2r/NChoBNoZ3EyP/+GlhoaEGoWOZUmFmoITP7zOJyHIMm+DYRd8o3PvHA==}
     engines: {node: '>=6.9.0'}
 
+  '@babel/helper-string-parser@7.27.1':
+    resolution: {integrity: sha512-qMlSxKbpRlAridDExk92nSobyDdpPijUq2DW6oDnUqd0iOGxmQjyqhMIihI9+zv4LPyZdRje2cavWPbCbWm3eA==}
+    engines: {node: '>=6.9.0'}
+
   '@babel/helper-validator-identifier@7.25.9':
     resolution: {integrity: sha512-Ed61U6XJc3CVRfkERJWDz4dJwKe7iLmmJsbOGu9wSloNSFttHV0I8g6UAgb7qnK5ly5bGLPd4oXZlxCdANBOWQ==}
     engines: {node: '>=6.9.0'}
 
+  '@babel/helper-validator-identifier@7.27.1':
+    resolution: {integrity: sha512-D2hP9eA+Sqx1kBZgzxZh0y1trbuU+JoDkiEwqhQ36nodYqJwyEIhPSdMNd7lOm/4io72luTPWH20Yda0xOuUow==}
+    engines: {node: '>=6.9.0'}
+
   '@babel/helper-validator-option@7.25.9':
     resolution: {integrity: sha512-e/zv1co8pp55dNdEcCynfj9X7nyUKUXoUEwfXqaZt0omVOmDe9oOTdKStH4GmAw6zxMFs50ZayuMfHDKlO7Tfw==}
     engines: {node: '>=6.9.0'}
@@ -931,6 +945,11 @@ packages:
     engines: {node: '>=6.0.0'}
     hasBin: true
 
+  '@babel/parser@7.27.2':
+    resolution: {integrity: sha512-QYLs8299NA7WM/bZAdp+CviYYkVoYXlDW2rzliy3chxd1PQjej7JORuMJDJXJUb9g0TT+B99EwaVLKmX+sPXWw==}
+    engines: {node: '>=6.0.0'}
+    hasBin: true
+
   '@babel/plugin-syntax-jsx@7.25.9':
     resolution: {integrity: sha512-ld6oezHQMZsZfp6pWtbjaNDF2tiiCYYDqQszHt5VV437lewP9aSi2Of99CK0D0XB21k7FLgnLcmQKyKzynfeAA==}
     engines: {node: '>=6.9.0'}
@@ -961,6 +980,10 @@ packages:
     resolution: {integrity: sha512-H45s8fVLYjbhFH62dIJ3WtmJ6RSPt/3DRO0ZcT2SUiYiQyz3BLVb9ADEnLl91m74aQPS3AzzeajZHYOalWe3bg==}
     engines: {node: '>=6.9.0'}
 
+  '@babel/types@7.27.1':
+    resolution: {integrity: sha512-+EzkxvLNfiUeKMgy/3luqfsCWFRXLb7U6wNQTk60tovuckwB15B191tJWvpp4HjiQWdJkCxO3Wbvc6jlk3Xb2Q==}
+    engines: {node: '>=6.9.0'}
+
   '@cn-xufei/vite-plugin-svg-icons@2.1.0':
     resolution: {integrity: sha512-P4uyUY+4EbKQSBzjF906VHxETa4aqlK6HzmJoLmV7Z2SP+kJADhU71BWKL6EKmxXI9UqDUMlm/4jp+gehnln5A==}
     peerDependencies:
@@ -4950,6 +4973,9 @@ packages:
   strip-literal@2.1.1:
     resolution: {integrity: sha512-631UJ6O00eNGfMiWG78ck80dfBab8X6IVFB51jZK5Icd7XAs60Z5y7QdSd/wGIklnWvRbUNloVzhOKKmutxQ6Q==}
 
+  strip-literal@3.0.0:
+    resolution: {integrity: sha512-TcccoMhJOM3OebGhSBEmp3UZ2SfDMZUEBdRA/9ynfLi8yYajyWX3JiXArcJt4Umh4vISpspkQIY8ZZoCqjbviA==}
+
   supports-color@2.0.0:
     resolution: {integrity: sha512-KKNVtd6pCYgPIKU4cp2733HWYCpplQhddZLBUryaAHou723x+FRzQ5Df824Fj+IyyuiQTRoub4SnIFfIcrp70g==}
     engines: {node: '>=0.8.0'}
@@ -5172,6 +5198,10 @@ packages:
   unimport@3.14.6:
     resolution: {integrity: sha512-CYvbDaTT04Rh8bmD8jz3WPmHYZRG/NnvYVzwD6V1YAlvvKROlAeNDUBhkBGzNav2RKaeuXvlWYaa1V4Lfi/O0g==}
 
+  unimport@4.2.0:
+    resolution: {integrity: sha512-mYVtA0nmzrysnYnyb3ALMbByJ+Maosee2+WyE0puXl+Xm2bUwPorPaaeZt0ETfuroPOtG8jj1g/qeFZ6buFnag==}
+    engines: {node: '>=18.12.0'}
+
   union-value@1.0.1:
     resolution: {integrity: sha512-tJfXmxMeWYnczCVs7XAEvIV7ieppALdyepWMkHkwciRpZraG/xwT+s2JN8+pr1+8jCRf80FFzvr+MpQeeoF4Xg==}
     engines: {node: '>=0.10.0'}
@@ -5212,8 +5242,8 @@ packages:
       '@vueuse/core':
         optional: true
 
-  unplugin-auto-import@0.17.8:
-    resolution: {integrity: sha512-CHryj6HzJ+n4ASjzwHruD8arhbdl+UXvhuAIlHDs15Y/IMecG3wrf7FVg4pVH/DIysbq/n0phIjNHAjl7TG7Iw==}
+  unplugin-auto-import@19.2.0:
+    resolution: {integrity: sha512-DGRHg86nUDKEYpny1p2kFZjeLg7kHQmknsPQ8krAshvpeypps7dFxNBsAqhBaxYINjetbgQilF8wbjuZxpdomg==}
     engines: {node: '>=14'}
     peerDependencies:
       '@nuxt/kit': ^3.2.2
@@ -5264,6 +5294,10 @@ packages:
       vue-template-es2015-compiler:
         optional: true
 
+  unplugin-utils@0.2.4:
+    resolution: {integrity: sha512-8U/MtpkPkkk3Atewj1+RcKIjb5WBimZ/WSLhhR3w6SsIj8XJuKTacSP8g+2JhfSGw0Cb125Y+2zA/IzJZDVbhA==}
+    engines: {node: '>=18.12.0'}
+
   unplugin-vue-components@0.25.2:
     resolution: {integrity: sha512-OVmLFqILH6w+eM8fyt/d/eoJT9A6WO51NZLf1vC5c1FZ4rmq2bbGxTy8WP2Jm7xwFdukaIdv819+UI7RClPyCA==}
     engines: {node: '>=14'}
@@ -5277,8 +5311,8 @@ packages:
       '@nuxt/kit':
         optional: true
 
-  unplugin-vue-components@0.27.5:
-    resolution: {integrity: sha512-m9j4goBeNwXyNN8oZHHxvIIYiG8FQ9UfmKWeNllpDvhU7btKNNELGPt+o3mckQKuPwrE7e0PvCsx+IWuDSD9Vg==}
+  unplugin-vue-components@28.5.0:
+    resolution: {integrity: sha512-o7fMKU/uI8NiP+E0W62zoduuguWqB0obTfHFtbr1AP2uo2lhUPnPttWUE92yesdiYfo9/0hxIrj38FMc1eaySg==}
     engines: {node: '>=14'}
     peerDependencies:
       '@babel/parser': ^7.15.8
@@ -5294,6 +5328,10 @@ packages:
     resolution: {integrity: sha512-4/u/j4FrCKdi17jaxuJA0jClGxB1AvU2hw/IuayPc4ay1XGaJs/rbb4v5WKwAjNifjmXK9PIFyuPiaK8azyR9w==}
     engines: {node: '>=14.0.0'}
 
+  unplugin@2.3.4:
+    resolution: {integrity: sha512-m4PjxTurwpWfpMomp8AptjD5yj8qEZN5uQjjGM3TAs9MWWD2tXSSNNj6jGR2FoVGod4293ytyV6SwBbertfyJg==}
+    engines: {node: '>=18.12.0'}
+
   unrs-resolver@1.5.0:
     resolution: {integrity: sha512-6aia3Oy7SEe0MuUGQm2nsyob0L2+g57w178K5SE/3pvSGAIp28BB2O921fKx424Ahc/gQ6v0DXFbhcpyhGZdOA==}
 
@@ -5881,8 +5919,14 @@ snapshots:
 
   '@babel/helper-string-parser@7.25.9': {}
 
+  '@babel/helper-string-parser@7.27.1':
+    optional: true
+
   '@babel/helper-validator-identifier@7.25.9': {}
 
+  '@babel/helper-validator-identifier@7.27.1':
+    optional: true
+
   '@babel/helper-validator-option@7.25.9': {}
 
   '@babel/helpers@7.27.0':
@@ -5894,6 +5938,11 @@ snapshots:
     dependencies:
       '@babel/types': 7.27.0
 
+  '@babel/parser@7.27.2':
+    dependencies:
+      '@babel/types': 7.27.1
+    optional: true
+
   '@babel/plugin-syntax-jsx@7.25.9(@babel/core@7.26.10)':
     dependencies:
       '@babel/core': 7.26.10
@@ -5938,6 +5987,12 @@ snapshots:
       '@babel/helper-string-parser': 7.25.9
       '@babel/helper-validator-identifier': 7.25.9
 
+  '@babel/types@7.27.1':
+    dependencies:
+      '@babel/helper-string-parser': 7.27.1
+      '@babel/helper-validator-identifier': 7.27.1
+    optional: true
+
   '@cn-xufei/vite-plugin-svg-icons@2.1.0(vite@5.4.18(@types/node@20.17.30)(sass@1.86.3)(terser@5.39.0))':
     dependencies:
       cors: 2.8.5
@@ -6282,7 +6337,7 @@ snapshots:
       '@formily/reactive': 2.3.3
       '@formily/reactive-vue': 2.3.3(vue@3.5.13(typescript@5.8.3))
       '@formily/shared': 2.3.3
-      '@formily/vue': 2.3.3(typescript@5.8.3)(vue@3.5.13(typescript@5.8.3))
+      '@formily/vue': 2.3.3(patch_hash=b575cff2c1081e22c9bafc64ee247547bca91d60de4d342714efff2cd12f1700)(typescript@5.8.3)(vue@3.5.13(typescript@5.8.3))
       element-plus: 2.9.10(vue@3.5.13(typescript@5.8.3))
       resize-observer-polyfill: 1.5.1
       vue: 3.5.13(typescript@5.8.3)
@@ -6329,7 +6384,7 @@ snapshots:
     dependencies:
       '@formily/shared': 2.3.3
 
-  '@formily/vue@2.3.3(typescript@5.8.3)(vue@3.5.13(typescript@5.8.3))':
+  '@formily/vue@2.3.3(patch_hash=b575cff2c1081e22c9bafc64ee247547bca91d60de4d342714efff2cd12f1700)(typescript@5.8.3)(vue@3.5.13(typescript@5.8.3))':
     dependencies:
       '@formily/core': 2.3.3
       '@formily/json-schema': 2.3.3(typescript@5.8.3)
@@ -10410,6 +10465,10 @@ snapshots:
     dependencies:
       js-tokens: 9.0.1
 
+  strip-literal@3.0.0:
+    dependencies:
+      js-tokens: 9.0.1
+
   supports-color@2.0.0: {}
 
   supports-color@3.2.3:
@@ -10676,6 +10735,23 @@ snapshots:
     transitivePeerDependencies:
       - rollup
 
+  unimport@4.2.0:
+    dependencies:
+      acorn: 8.14.1
+      escape-string-regexp: 5.0.0
+      estree-walker: 3.0.3
+      local-pkg: 1.1.1
+      magic-string: 0.30.17
+      mlly: 1.7.4
+      pathe: 2.0.3
+      picomatch: 4.0.2
+      pkg-types: 2.1.0
+      scule: 1.3.0
+      strip-literal: 3.0.0
+      tinyglobby: 0.2.12
+      unplugin: 2.3.4
+      unplugin-utils: 0.2.4
+
   union-value@1.0.1:
     dependencies:
       arr-union: 3.1.0
@@ -10723,20 +10799,16 @@ snapshots:
     transitivePeerDependencies:
       - rollup
 
-  unplugin-auto-import@0.17.8(@vueuse/core@10.11.1(vue@3.5.13(typescript@5.8.3)))(rollup@4.40.0):
+  unplugin-auto-import@19.2.0(@vueuse/core@10.11.1(vue@3.5.13(typescript@5.8.3))):
     dependencies:
-      '@antfu/utils': 0.7.10
-      '@rollup/pluginutils': 5.1.4(rollup@4.40.0)
-      fast-glob: 3.3.3
-      local-pkg: 0.5.1
+      local-pkg: 1.1.1
       magic-string: 0.30.17
-      minimatch: 9.0.5
-      unimport: 3.14.6(rollup@4.40.0)
-      unplugin: 1.16.1
+      picomatch: 4.0.2
+      unimport: 4.2.0
+      unplugin: 2.3.4
+      unplugin-utils: 0.2.4
     optionalDependencies:
       '@vueuse/core': 10.11.1(vue@3.5.13(typescript@5.8.3))
-    transitivePeerDependencies:
-      - rollup
 
   unplugin-icons@0.17.4(@vue/compiler-sfc@3.5.13):
     dependencies:
@@ -10766,7 +10838,7 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  unplugin-vue-components@0.25.2(@babel/parser@7.27.0)(rollup@4.40.0)(vue@3.5.13(typescript@5.8.3)):
+  unplugin-vue-components@0.25.2(@babel/parser@7.27.2)(rollup@4.40.0)(vue@3.5.13(typescript@5.8.3)):
     dependencies:
       '@antfu/utils': 0.7.10
       '@rollup/pluginutils': 5.1.4(rollup@4.40.0)
@@ -10780,28 +10852,25 @@ snapshots:
       unplugin: 1.16.1
       vue: 3.5.13(typescript@5.8.3)
     optionalDependencies:
-      '@babel/parser': 7.27.0
+      '@babel/parser': 7.27.2
     transitivePeerDependencies:
       - rollup
       - supports-color
 
-  unplugin-vue-components@0.27.5(@babel/parser@7.27.0)(rollup@4.40.0)(vue@3.5.13(typescript@5.8.3)):
+  unplugin-vue-components@0.27.5(@babel/parser@7.27.2)(rollup@4.40.0)(vue@3.5.13(typescript@5.8.3)):
     dependencies:
-      '@antfu/utils': 0.7.10
-      '@rollup/pluginutils': 5.1.4(rollup@4.40.0)
       chokidar: 3.6.0
       debug: 4.4.0
-      fast-glob: 3.3.3
-      local-pkg: 0.5.1
+      local-pkg: 1.1.1
       magic-string: 0.30.17
-      minimatch: 9.0.5
       mlly: 1.7.4
-      unplugin: 1.16.1
+      tinyglobby: 0.2.12
+      unplugin: 2.3.4
+      unplugin-utils: 0.2.4
       vue: 3.5.13(typescript@5.8.3)
     optionalDependencies:
-      '@babel/parser': 7.27.0
+      '@babel/parser': 7.27.2
     transitivePeerDependencies:
-      - rollup
       - supports-color
 
   unplugin@1.16.1:
@@ -10809,6 +10878,12 @@ snapshots:
       acorn: 8.14.1
       webpack-virtual-modules: 0.6.2
 
+  unplugin@2.3.4:
+    dependencies:
+      acorn: 8.14.1
+      picomatch: 4.0.2
+      webpack-virtual-modules: 0.6.2
+
   unrs-resolver@1.5.0:
     optionalDependencies:
       '@unrs/resolver-binding-darwin-arm64': 1.5.0