From 2bcb43eaf7ec8ea86efa155f74e38a5cb8fde894 Mon Sep 17 00:00:00 2001
From: wangdan-fit2cloud <dan.wang@fit2cloud.com>
Date: Wed, 3 Dec 2025 15:21:59 +0800
Subject: [PATCH] perf: Style optimization

---
 .../nodes/data-source-local-node/index.vue    |   2 -
 .../nodes/data-source-web-node/index.vue      |   2 +-
 .../nodes/document-split-node/index.vue       | 266 +++++++++---------
 .../nodes/search-document-node/index.vue      |  27 +-
 .../nodes/search-knowledge-node/index.vue     |  37 +--
 5 files changed, 148 insertions(+), 186 deletions(-)

diff --git a/ui/src/workflow/nodes/data-source-local-node/index.vue b/ui/src/workflow/nodes/data-source-local-node/index.vue
index 31814d39e..b40965b70 100644
--- a/ui/src/workflow/nodes/data-source-local-node/index.vue
+++ b/ui/src/workflow/nodes/data-source-local-node/index.vue
@@ -42,7 +42,6 @@
         <el-form-item
           :label="$t('views.workflow.nodes.dataSourceLocalNode.maxFileNumber.label')"
           :rules="{
-            type: 'array',
             required: true,
             message: $t('common.inputPlaceholder'),
             trigger: 'change',
@@ -62,7 +61,6 @@
         <el-form-item
           :label="$t('views.workflow.nodes.dataSourceLocalNode.maxFileCountNumber.label')"
           :rules="{
-            type: 'array',
             required: true,
             message: $t('common.inputPlaceholder'),
             trigger: 'change',
diff --git a/ui/src/workflow/nodes/data-source-web-node/index.vue b/ui/src/workflow/nodes/data-source-web-node/index.vue
index 64a223906..66dba085e 100644
--- a/ui/src/workflow/nodes/data-source-web-node/index.vue
+++ b/ui/src/workflow/nodes/data-source-web-node/index.vue
@@ -2,7 +2,7 @@
   <NodeContainer :nodeModel="nodeModel">
     <h5 class="title-decoration-1 mb-8">{{ $t('views.workflow.nodeSetting') }}</h5>
     <el-card shadow="never" class="card-never">
-      <h4>{{ $t('common.noData') }}</h4>
+      <span class="lighter">{{ $t('common.noData') }}</span>
     </el-card>
   </NodeContainer>
 </template>
diff --git a/ui/src/workflow/nodes/document-split-node/index.vue b/ui/src/workflow/nodes/document-split-node/index.vue
index b8de19913..390e72ec7 100644
--- a/ui/src/workflow/nodes/document-split-node/index.vue
+++ b/ui/src/workflow/nodes/document-split-node/index.vue
@@ -58,21 +58,22 @@
                   <AppIcon iconName="app-warning" class="app-warning-icon"></AppIcon>
                 </el-tooltip>
               </span>
-              <el-select v-model="form_data.chunk_size_type" size="small" style="width: 100px">
-                <el-option
-                  :label="$t('views.workflow.nodes.searchDocumentNode.custom')"
-                  value="custom"
-                />
+              <el-select v-model="form_data.chunk_size_type" size="small" style="width: 85px">
                 <el-option :label="$t('views.workflow.variable.Referencing')" value="referencing" />
+                <el-option :label="$t('common.custom')" value="custom" />
               </el-select>
             </div>
           </template>
           <el-input-number
             v-if="form_data.chunk_size_type === 'custom'"
             v-model="form_data.chunk_size"
-            show-input
             :min="50"
             :max="100000"
+            :value-on-clear="0"
+            controls-position="right"
+            class="w-full"
+            :step="1"
+            :step-strictly="true"
           />
           <NodeCascader
             v-else
@@ -83,132 +84,127 @@
             v-model="form_data.chunk_size_reference"
           />
         </el-form-item>
-        <div v-if="form_data.split_strategy === 'custom'">
-          <div class="set-rules__form">
-            <div class="form-item mb-16">
-              <div class="flex-between">
-                <div class="title flex align-center mb-8">
-                  <span style="margin-right: 4px">
-                    {{ $t('views.document.setRules.patterns.label') }}
-                  </span>
-                  <el-tooltip
-                    effect="dark"
-                    :content="$t('views.document.setRules.patterns.tooltip')"
-                    placement="right"
-                  >
-                    <AppIcon iconName="app-warning" class="app-warning-icon"></AppIcon>
-                  </el-tooltip>
-                </div>
-                <el-select v-model="form_data.patterns_type" size="small" style="width: 100px">
-                  <el-option
-                    :label="$t('views.workflow.nodes.searchDocumentNode.custom')"
-                    value="custom"
-                  />
-                  <el-option
-                    :label="$t('views.workflow.variable.Referencing')"
-                    value="referencing"
-                  />
-                </el-select>
-              </div>
-              <div @click.stop>
-                <el-select
-                  v-if="form_data.patterns_type === 'custom'"
-                  v-model="form_data.patterns"
-                  multiple
-                  :reserve-keyword="false"
-                  allow-create
-                  default-first-option
-                  filterable
-                  :placeholder="$t('views.document.setRules.patterns.placeholder')"
+
+        <el-form-item v-if="form_data.split_strategy === 'custom'">
+          <template #label>
+            <div class="flex-between">
+              <div class="flex align-center mb-8">
+                <span class="mr-4">
+                  {{ $t('views.document.setRules.patterns.label') }}
+                </span>
+                <el-tooltip
+                  effect="dark"
+                  :content="$t('views.document.setRules.patterns.tooltip')"
+                  placement="right"
                 >
-                  <el-option
-                    v-for="(item, index) in splitPatternList"
-                    :key="index"
-                    :label="item.key"
-                    :value="item.value"
-                  >
-                  </el-option>
-                </el-select>
-                <NodeCascader
-                  v-else
-                  ref="nodeCascaderRef5"
-                  :nodeModel="nodeModel"
-                  class="w-full"
-                  :placeholder="$t('views.chatLog.documentPlaceholder')"
-                  v-model="form_data.patterns_reference"
-                />
+                  <AppIcon iconName="app-warning" class="app-warning-icon"></AppIcon>
+                </el-tooltip>
               </div>
-            </div>
-            <div class="form-item mb-16">
-              <div class="flex-between">
-                <div class="title mb-8">
-                  {{ $t('views.document.setRules.limit.label') }}
-                </div>
-                <el-select v-model="form_data.limit_type" size="small" style="width: 100px">
-                  <el-option
-                    :label="$t('views.workflow.nodes.searchDocumentNode.custom')"
-                    value="custom"
-                  />
-                  <el-option
-                    :label="$t('views.workflow.variable.Referencing')"
-                    value="referencing"
-                  />
-                </el-select>
-              </div>
-              <el-slider
-                v-if="form_data.limit_type === 'custom'"
-                v-model="form_data.limit"
-                show-input
-                :show-input-controls="false"
-                :min="50"
-                :max="100000"
-              />
-              <NodeCascader
-                v-else
-                ref="nodeCascaderRef6"
-                :nodeModel="nodeModel"
-                class="w-full"
-                :placeholder="$t('views.chatLog.documentPlaceholder')"
-                v-model="form_data.limit_reference"
-              />
-            </div>
-            <div class="form-item mb-16">
-              <div class="flex-between">
-                <div class="title mb-8">
-                  {{ $t('views.document.setRules.with_filter.label') }}
-                </div>
-                <el-select v-model="form_data.with_filter_type" size="small" style="width: 100px">
-                  <el-option
-                    :label="$t('views.workflow.nodes.searchDocumentNode.custom')"
-                    value="custom"
-                  />
-                  <el-option
-                    :label="$t('views.workflow.variable.Referencing')"
-                    value="referencing"
-                  />
-                </el-select>
-              </div>
-              <el-switch
-                v-if="form_data.with_filter_type === 'custom'"
+              <el-select
+                :teleported="false"
+                v-model="form_data.patterns_type"
                 size="small"
-                v-model="form_data.with_filter"
-              />
-              <NodeCascader
-                v-else
-                ref="nodeCascaderRef7"
-                :nodeModel="nodeModel"
-                class="w-full"
-                :placeholder="$t('views.chatLog.documentPlaceholder')"
-                v-model="form_data.with_filter_reference"
-              />
-              <div style="margin-top: 4px">
-                <el-text type="info">
-                  {{ $t('views.document.setRules.with_filter.text') }}
-                </el-text>
-              </div>
+                style="width: 85px"
+              >
+                <el-option :label="$t('views.workflow.variable.Referencing')" value="referencing" />
+                <el-option :label="$t('common.custom')" value="custom" />
+              </el-select>
             </div>
-          </div>
-        </div>
+          </template>
+          <el-select
+            v-if="form_data.patterns_type === 'custom'"
+            v-model="form_data.patterns"
+            multiple
+            :reserve-keyword="false"
+            allow-create
+            default-first-option
+            filterable
+            :placeholder="$t('views.document.setRules.patterns.placeholder')"
+          >
+            <el-option
+              v-for="(item, index) in splitPatternList"
+              :key="index"
+              :label="item.key"
+              :value="item.value"
+            >
+            </el-option>
+          </el-select>
+          <NodeCascader
+            v-else
+            ref="nodeCascaderRef5"
+            :nodeModel="nodeModel"
+            class="w-full"
+            :placeholder="$t('views.chatLog.documentPlaceholder')"
+            v-model="form_data.patterns_reference"
+          />
+        </el-form-item>
+        <el-form-item v-if="form_data.split_strategy === 'custom'">
+          <template #label>
+            <div class="flex-between">
+              <span>
+                {{ $t('views.document.setRules.limit.label') }}
+              </span>
+              <el-select v-model="form_data.limit_type" size="small" style="width: 85px">
+                <el-option :label="$t('views.workflow.variable.Referencing')" value="referencing" />
+                <el-option :label="$t('common.custom')" value="custom" />
+              </el-select>
+            </div>
+          </template>
+          <el-input-number
+            v-if="form_data.limit_type === 'custom'"
+            v-model="form_data.limit"
+            :min="50"
+            :max="100000"
+            :value-on-clear="0"
+            controls-position="right"
+            class="w-full"
+            :step="1"
+            :step-strictly="true"
+          />
+          <NodeCascader
+            v-else
+            ref="nodeCascaderRef6"
+            :nodeModel="nodeModel"
+            class="w-full"
+            :placeholder="$t('views.chatLog.documentPlaceholder')"
+            v-model="form_data.limit_reference"
+          />
+        </el-form-item>
+        <el-form-item v-if="form_data.split_strategy === 'custom'">
+          <template #label>
+            <div class="flex-between">
+              <div class="flex align-center mb-8">
+                <span class="mr-4">
+                  {{ $t('views.document.setRules.with_filter.label') }}
+                </span>
+                <el-tooltip
+                  effect="dark"
+                  :content="$t('views.document.setRules.with_filter.text')"
+                  placement="right"
+                >
+                  <AppIcon iconName="app-warning" class="app-warning-icon"></AppIcon>
+                </el-tooltip>
+              </div>
+              <el-select v-model="form_data.limit_type" size="small" style="width: 85px">
+                <el-option :label="$t('views.workflow.variable.Referencing')" value="referencing" />
+                <el-option :label="$t('common.custom')" value="custom" />
+              </el-select>
+            </div>
+          </template>
+          <el-switch
+            v-if="form_data.with_filter_type === 'custom'"
+            size="small"
+            v-model="form_data.with_filter"
+          />
+          <NodeCascader
+            v-else
+            ref="nodeCascaderRef7"
+            :nodeModel="nodeModel"
+            class="w-full"
+            :placeholder="$t('views.chatLog.documentPlaceholder')"
+            v-model="form_data.with_filter_reference"
+          />
+        </el-form-item>
         <el-form-item v-if="form_data.split_strategy !== 'qa'">
           <template #label>
             <div class="flex-between">
@@ -216,13 +212,10 @@
               <el-select
                 v-model="form_data.paragraph_title_relate_problem_type"
                 size="small"
-                style="width: 100px"
+                style="width: 85px"
               >
-                <el-option
-                  :label="$t('views.workflow.nodes.searchDocumentNode.custom')"
-                  value="custom"
-                />
                 <el-option :label="$t('views.workflow.variable.Referencing')" value="referencing" />
+                <el-option :label="$t('common.custom')" value="custom" />
               </el-select>
             </div>
           </template>
@@ -247,13 +240,10 @@
               <el-select
                 v-model="form_data.document_name_relate_problem_type"
                 size="small"
-                style="width: 100px"
+                style="width: 85px"
               >
-                <el-option
-                  :label="$t('views.workflow.nodes.searchDocumentNode.custom')"
-                  value="custom"
-                />
                 <el-option :label="$t('views.workflow.variable.Referencing')" value="referencing" />
+                <el-option :label="$t('common.custom')" value="custom" />
               </el-select>
             </div>
           </template>
diff --git a/ui/src/workflow/nodes/search-document-node/index.vue b/ui/src/workflow/nodes/search-document-node/index.vue
index d8598c548..364b37e3c 100644
--- a/ui/src/workflow/nodes/search-document-node/index.vue
+++ b/ui/src/workflow/nodes/search-document-node/index.vue
@@ -31,14 +31,11 @@
                   v-model="form_data.search_scope_type"
                   style="width: 85px"
                 >
-                  <el-option
-                    :label="$t('views.workflow.nodes.searchDocumentNode.custom')"
-                    value="custom"
-                  />
                   <el-option
                     :label="$t('views.workflow.variable.Referencing')"
                     value="referencing"
                   />
+                  <el-option :label="$t('common.custom')" value="custom" />
                 </el-select>
               </span>
             </div>
@@ -92,15 +89,11 @@
                       @change="form_data.search_scope_reference = []"
                     >
                       <el-option
-                        :label="
-                          $t('views.workflow.nodes.searchDocumentNode.knowledgeList')
-                        "
+                        :label="$t('views.workflow.nodes.searchDocumentNode.knowledgeList')"
                         value="knowledge"
                       />
                       <el-option
-                        :label="
-                          $t('views.workflow.nodes.searchDocumentNode.documentList')
-                        "
+                        :label="$t('views.workflow.nodes.searchDocumentNode.documentList')"
                         value="document"
                       />
                     </el-select>
@@ -117,9 +110,7 @@
             </el-form-item>
           </div>
         </el-form-item>
-        <el-form-item
-          :label="$t('views.workflow.nodes.searchDocumentNode.searchSetting')"
-        >
+        <el-form-item :label="$t('views.workflow.nodes.searchDocumentNode.searchSetting')">
           <el-radio-group v-model="form_data.search_mode">
             <el-radio value="auto">
               <span class="flex align-center">
@@ -194,7 +185,11 @@
             <div v-for="(c, index) in form_data.search_condition_list" :key="index">
               <el-row :gutter="8" class="mb-8">
                 <el-col :span="8">
-                  <el-select v-model="c.key" filterable @focus="getAllTags(form_data.knowledge_id_list)">
+                  <el-select
+                    v-model="c.key"
+                    filterable
+                    @focus="getAllTags(form_data.knowledge_id_list)"
+                  >
                     <el-option
                       v-for="tag in form_data.knowledge_tags"
                       :key="tag"
@@ -216,9 +211,7 @@
                 <el-col :span="8">
                   <el-input
                     v-model="c.value"
-                    :placeholder="
-                      $t('views.workflow.nodes.searchDocumentNode.valueMessage')
-                    "
+                    :placeholder="$t('views.workflow.nodes.searchDocumentNode.valueMessage')"
                   ></el-input>
                 </el-col>
                 <el-col :span="1">
diff --git a/ui/src/workflow/nodes/search-knowledge-node/index.vue b/ui/src/workflow/nodes/search-knowledge-node/index.vue
index ef7258f50..33e662634 100644
--- a/ui/src/workflow/nodes/search-knowledge-node/index.vue
+++ b/ui/src/workflow/nodes/search-knowledge-node/index.vue
@@ -14,9 +14,7 @@
         <el-form-item>
           <template #label>
             <div class="flex-between">
-              <span>
-                {{ $t('views.workflow.nodes.searchDocumentNode.selectKnowledge') }}</span
-              >
+              <span> {{ $t('views.workflow.nodes.searchDocumentNode.selectKnowledge') }}</span>
               <span>
                 <el-button
                   v-if="form_data.search_scope_type === 'custom'"
@@ -32,14 +30,11 @@
                   v-model="form_data.search_scope_type"
                   style="width: 85px"
                 >
-                  <el-option
-                    :label="$t('views.workflow.nodes.searchDocumentNode.custom')"
-                    value="custom"
-                  />
                   <el-option
                     :label="$t('views.workflow.variable.Referencing')"
                     value="referencing"
                   />
+                  <el-option :label="$t('common.custom')" value="custom" />
                 </el-select>
               </span>
             </div>
@@ -91,15 +86,11 @@
                       @change="form_data.search_scope_reference = []"
                     >
                       <el-option
-                        :label="
-                          $t('views.workflow.nodes.searchDocumentNode.knowledgeList')
-                        "
+                        :label="$t('views.workflow.nodes.searchDocumentNode.knowledgeList')"
                         value="knowledge"
                       />
                       <el-option
-                        :label="
-                          $t('views.workflow.nodes.searchDocumentNode.documentList')
-                        "
+                        :label="$t('views.workflow.nodes.searchDocumentNode.documentList')"
                         value="document"
                       />
                     </el-select>
@@ -116,14 +107,10 @@
             </el-form-item>
           </div>
         </el-form-item>
-        <el-form-item
-          :label="$t('views.workflow.nodes.searchKnowledgeNode.searchParam')"
-        >
+        <el-form-item :label="$t('views.workflow.nodes.searchKnowledgeNode.searchParam')">
           <template #label>
             <div class="flex-between">
-              <span
-                >{{ $t('views.workflow.nodes.searchKnowledgeNode.searchParam') }}
-              </span>
+              <span>{{ $t('views.workflow.nodes.searchKnowledgeNode.searchParam') }} </span>
               <el-button type="primary" link @click="openParamSettingDialog">
                 <AppIcon iconName="app-setting"></AppIcon>
               </el-button>
@@ -161,9 +148,7 @@
         <el-form-item
           prop="question_reference_address"
           :rules="{
-            message: $t(
-              'views.workflow.nodes.searchKnowledgeNode.searchQuestion.requiredMessage',
-            ),
+            message: $t('views.workflow.nodes.searchKnowledgeNode.searchQuestion.requiredMessage'),
             trigger: 'blur',
             required: true,
           }"
@@ -180,18 +165,14 @@
             ref="nodeCascaderRef"
             :nodeModel="nodeModel"
             class="w-full"
-            :placeholder="
-              $t('views.workflow.nodes.searchKnowledgeNode.searchQuestion.placeholder')
-            "
+            :placeholder="$t('views.workflow.nodes.searchKnowledgeNode.searchQuestion.placeholder')"
             v-model="form_data.question_reference_address"
           />
         </el-form-item>
         <el-form-item
           prop="show_knowledge"
           :rules="{
-            message: $t(
-              'views.workflow.nodes.searchKnowledgeNode.showKnowledge.requiredMessage',
-            ),
+            message: $t('views.workflow.nodes.searchKnowledgeNode.showKnowledge.requiredMessage'),
             trigger: 'blur',
             required: true,
           }"