From a4043c4609409cd0d5c64a6d9c8fa75b6e447f42 Mon Sep 17 00:00:00 2001
From: Feynman <xufei@tapdata.io>
Date: Mon, 1 Dec 2025 10:47:44 +0800
Subject: [PATCH] fix(InitialList.vue): add IconButton component and enhance
 header with search functionality and refresh button

---
 .../monitor/components/InitialList.vue        | 37 +++++++++----------
 1 file changed, 17 insertions(+), 20 deletions(-)

diff --git a/packages/dag/src/components/monitor/components/InitialList.vue b/packages/dag/src/components/monitor/components/InitialList.vue
index f3b9e8f1d..c41b4a4e7 100644
--- a/packages/dag/src/components/monitor/components/InitialList.vue
+++ b/packages/dag/src/components/monitor/components/InitialList.vue
@@ -1,13 +1,14 @@
 <script>
 import { getFullStatistics } from '@tap/api/src/core/measurement'
-
 import { VTable } from '@tap/component/src/base/v-table'
+
+import { IconButton } from '@tap/component/src/icon-button'
 import i18n from '@tap/i18n'
 import { debounce } from 'lodash-es'
 
 export default {
   name: 'InitialList',
-  components: { VTable },
+  components: { VTable, IconButton },
   props: {
     dataflow: Object,
     value: {
@@ -165,33 +166,28 @@ export default {
     :modal-append-to-body="false"
     @close="$emit('update:value', false)"
   >
-    <template #header>
-      <div>
+    <template #header="{ titleClass }">
+      <div :class="titleClass" class="flex align-items-center gap-2">
         <span>{{
           $t('packages_dag_components_initiallist_quanliangxinxixiang')
         }}</span>
-        <ElTooltip
-          transition="tooltip-fade-in"
-          :content="$t('packages_dag_components_initiallist_dianjishuaxin')"
-          class="ml-2"
-        >
-          <VIcon
-            class="color-primary cursor-pointer"
-            size="12"
-            @click="startLoadData"
-            >icon_table_selector_load</VIcon
-          >
-        </ElTooltip>
-      </div>
-      <div class="mb-2">
+        <el-divider direction="vertical" />
         <ElInput
           v-model="tableName"
           :placeholder="$t('packages_form_table_rename_index_sousuobiaoming')"
-          prefix-icon="el-icon-search"
           clearable
           style="width: 240px"
           @input="handleInput"
-        />
+        >
+          <template #prefix>
+            <i-lucide-search />
+          </template>
+        </ElInput>
+        <el-button class="rounded-lg" circle @click="startLoadData">
+          <template #icon>
+            <i-lucide-refresh-cw />
+          </template>
+        </el-button>
       </div>
     </template>
     <VTable
@@ -199,6 +195,7 @@ export default {
       :remote-method="remoteMethod"
       :columns="columns"
       height="100%"
+      table-class="has-border-t"
       class="table-list"
     >
       <template #progress="scope">