From 14ee62a7ac6c6659f283a6f0c5cc2bcd430bdf70 Mon Sep 17 00:00:00 2001
From: wangdan-fit2cloud <dan.wang@fit2cloud.com>
Date: Mon, 2 Dec 2024 19:01:32 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E7=94=BB=E5=B8=83?=
 =?UTF-8?q?=E4=B8=8Atable=E8=B6=85=E5=87=BA=E6=8F=90=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../component/UserInputFieldTable.vue         | 55 ++++++++++++-------
 ui/src/workflow/nodes/form-node/index.vue     | 30 +++++++---
 2 files changed, 57 insertions(+), 28 deletions(-)

diff --git a/ui/src/workflow/nodes/base-node/component/UserInputFieldTable.vue b/ui/src/workflow/nodes/base-node/component/UserInputFieldTable.vue
index 2e061c70e..c27c33851 100644
--- a/ui/src/workflow/nodes/base-node/component/UserInputFieldTable.vue
+++ b/ui/src/workflow/nodes/base-node/component/UserInputFieldTable.vue
@@ -13,11 +13,24 @@
     :data="props.nodeModel.properties.user_input_field_list"
     class="mb-16"
   >
-    <el-table-column prop="field" label="参数" show-overflow-tooltip />
-    <el-table-column prop="label" label="显示名称" show-overflow-tooltip >
+    <el-table-column prop="field" label="参数">
       <template #default="{ row }">
-        <span v-if="row.label && row.label.input_type === 'TooltipLabel'">{{ row.label.label }}</span>
-        <span v-else>{{ row.label }}</span>
+        <span :title="row.field" class="ellipsis-1">{{ row.field }}</span>
+      </template>
+    </el-table-column>
+
+    <el-table-column prop="label" label="显示名称">
+      <template #default="{ row }">
+        <span v-if="row.label && row.label.input_type === 'TooltipLabel'">
+          <span :title="row.label.label" class="ellipsis-1">
+            {{ row.label.label }}
+          </span>
+        </span>
+        <span v-else>
+          <span :title="row.label" class="ellipsis-1">
+            {{ row.label }}
+          </span></span
+        >
       </template>
     </el-table-column>
     <el-table-column label="组件类型">
@@ -25,13 +38,20 @@
         <el-tag type="info" class="info-tag" v-if="row.input_type === 'TextInput'">文本框</el-tag>
         <el-tag type="info" class="info-tag" v-if="row.input_type === 'Slider'">滑块</el-tag>
         <el-tag type="info" class="info-tag" v-if="row.input_type === 'SwitchInput'">开关</el-tag>
-        <el-tag type="info" class="info-tag" v-if="row.input_type === 'SingleSelect'">单选框</el-tag>
+        <el-tag type="info" class="info-tag" v-if="row.input_type === 'SingleSelect'"
+          >单选框</el-tag
+        >
         <el-tag type="info" class="info-tag" v-if="row.input_type === 'MultiSelect'">多选框</el-tag>
         <el-tag type="info" class="info-tag" v-if="row.input_type === 'RadioCard'">选项卡</el-tag>
         <el-tag type="info" class="info-tag" v-if="row.input_type === 'DatePicker'">日期</el-tag>
       </template>
     </el-table-column>
-    <el-table-column prop="default_value" label="默认值" show-overflow-tooltip />
+
+    <el-table-column prop="default_value" label="默认值">
+      <template #default="{ row }">
+        <span :title="row.default_value" class="ellipsis-1">{{ row.default_value }}</span>
+      </template>
+    </el-table-column>
     <el-table-column label="必填">
       <template #default="{ row }">
         <div @click.stop>
@@ -41,13 +61,13 @@
     </el-table-column>
     <el-table-column label="操作" align="left" width="80">
       <template #default="{ row, $index }">
-            <span class="mr-4">
-              <el-tooltip effect="dark" content="修改" placement="top">
-                <el-button type="primary" text @click.stop="openAddDialog(row, $index)">
-                  <el-icon><EditPen /></el-icon>
-                </el-button>
-              </el-tooltip>
-            </span>
+        <span class="mr-4">
+          <el-tooltip effect="dark" content="修改" placement="top">
+            <el-button type="primary" text @click.stop="openAddDialog(row, $index)">
+              <el-icon><EditPen /></el-icon>
+            </el-button>
+          </el-tooltip>
+        </span>
         <el-tooltip effect="dark" content="删除" placement="top">
           <el-button type="primary" text @click="deleteField($index)">
             <el-icon>
@@ -60,11 +80,9 @@
   </el-table>
 
   <UserFieldFormDialog ref="UserFieldFormDialogRef" @refresh="refreshFieldList" />
-
 </template>
 
 <script setup lang="ts">
-
 import { onMounted, ref } from 'vue'
 import { set } from 'lodash'
 import UserFieldFormDialog from './UserFieldFormDialog.vue'
@@ -84,7 +102,6 @@ function deleteField(index: any) {
   props.nodeModel.graphModel.eventCenter.emit('refreshFieldList')
 }
 
-
 function refreshFieldList(data: any, index: any) {
   for (let i = 0; i < inputFieldList.value.length; i++) {
     if (inputFieldList.value[i].field === data.field && index !== i) {
@@ -142,10 +159,6 @@ onMounted(() => {
   })
   set(props.nodeModel.properties, 'user_input_field_list', inputFieldList)
 })
-
 </script>
 
-
-<style scoped lang="scss">
-
-</style>
\ No newline at end of file
+<style scoped lang="scss"></style>
diff --git a/ui/src/workflow/nodes/form-node/index.vue b/ui/src/workflow/nodes/form-node/index.vue
index 071101640..c2c741de7 100644
--- a/ui/src/workflow/nodes/form-node/index.vue
+++ b/ui/src/workflow/nodes/form-node/index.vue
@@ -56,15 +56,26 @@
           :data="form_data.form_field_list"
           class="mb-16"
         >
-          <el-table-column prop="field" label="参数" show-overflow-tooltip />
-          <el-table-column prop="label" label="显示名称" show-overflow-tooltip>
+          <el-table-column prop="field" label="参数">
             <template #default="{ row }">
-              <span v-if="row.label && row.label.input_type === 'TooltipLabel'">{{
-                row.label.label
-              }}</span>
-              <span v-else>{{ row.label }}</span>
+              <span :title="row.field" class="ellipsis-1">{{ row.field }}</span>
             </template>
           </el-table-column>
+          <el-table-column prop="label" label="显示名称">
+            <template #default="{ row }">
+              <span v-if="row.label && row.label.input_type === 'TooltipLabel'">
+                <span :title="row.label.label" class="ellipsis-1">
+                  {{ row.label.label }}
+                </span>
+              </span>
+              <span v-else>
+                <span :title="row.label" class="ellipsis-1">
+                  {{ row.label }}
+                </span></span
+              >
+            </template>
+          </el-table-column>
+
           <el-table-column label="组件类型" width="110px">
             <template #default="{ row }">
               <el-tag type="info" class="info-tag">{{
@@ -72,7 +83,12 @@
               }}</el-tag>
             </template>
           </el-table-column>
-          <el-table-column prop="default_value" label="默认值" show-overflow-tooltip />
+
+          <el-table-column prop="default_value" label="默认值">
+            <template #default="{ row }">
+              <span :title="row.default_value" class="ellipsis-1">{{ row.default_value }}</span>
+            </template>
+          </el-table-column>
           <el-table-column label="必填">
             <template #default="{ row }">
               <div @click.stop>