fix: optimize folder style (#4104)

Author: wangdan-fit2cloud

ui/src/components/folder-tree/MoveToDialog.vue

@@ -139,5 +139,8 @@ defineExpose({ open })
     padding: 0 !important;
     margin-bottom: 8px;
   }
+  :deep(.tree-label) {
+    max-width: 100% !important;
+  }
 }
 </style>

ui/src/components/folder-tree/index.vue

@@ -42,7 +42,7 @@
             <div class="flex-between w-full" @mouseenter.stop="handleMouseEnter(data)">
               <div class="flex align-center">
                 <AppIcon iconName="app-folder" style="font-size: 20px"></AppIcon>
-                <span class="ml-8 ellipsis" style="max-width: 110px" :title="node.label">{{
+                <span class="ml-8 ellipsis tree-label" style="max-width: 110px" :title="node.label">{{
                   node.label
                 }}</span>
               </div>

ui/src/locales/lang/zh-CN/views/application.ts

@@ -7,7 +7,7 @@ export default {
   importApplication: '导入应用',
   copyApplication: '复制应用',
   workflow: '高级编排',
-  simple: '简单应用',
+  simple: '简易应用',
   simplePlaceholder: '适用于初级用户使用表单设置构建AI对话助手',
   workflowPlaceholder: '适用于高级用户使用低代码拖拉拽方式构建复杂逻辑的AI对话助手',
   appTest: '调试预览',

ui/src/locales/lang/zh-Hant/views/application.ts

@@ -5,7 +5,7 @@ export default {
   importApplication: '匯入應用',
   copyApplication: '複製應用',
   workflow: '進階編排',
-  simple: '簡單配置',
+  simple: '簡易應用',
   simplePlaceholder: '適用於初級用戶使用表單設定構建AI對話助手',
   workflowPlaceholder: '適用於高階用戶使用低代碼拖拉拽方式構建複雜邏輯的AI對話助手',
   appTest: '調試預覽',

ui/src/views/application-overview/xpack-component/XPackLimitDrawer.vue

@@ -23,8 +23,8 @@
           step-strictly
         />
         <span class="ml-4">{{
-            $t('views.applicationOverview.appInfo.LimitDialog.timesDays')
-          }}</span>
+          $t('views.applicationOverview.appInfo.LimitDialog.timesDays')
+        }}</span>
       </el-form-item>
       <!--     身份验证 -->
       <el-form-item
@@ -74,7 +74,7 @@
                     style="margin: 0 4px 0 0 !important"
                   >
                     <el-icon>
-                      <RefreshRight/>
+                      <RefreshRight />
                     </el-icon>
                   </el-button>
                 </el-tooltip>
@@ -111,12 +111,16 @@
           >
             <el-checkbox-group v-model="form.authentication_value.login_value">
               <template v-for="t in auth_list" :key="t.value">
-                <el-checkbox :label="t.label" :value="t.value"/>
+                <el-checkbox :label="t.label" :value="t.value" />
               </template>
             </el-checkbox-group>
           </el-form-item>
           <el-form-item
-            v-if="form.authentication_value.type === 'login' && form.authentication_value?.login_value?.includes('LOCAL')"
+            class="ml-24"
+            v-if="
+              form.authentication_value.type === 'login' &&
+              form.authentication_value?.login_value?.includes('LOCAL')
+            "
             :label="$t('views.system.display_code')"
             :rules="[
               {
@@ -127,23 +131,23 @@
             ]"
             prop="authentication_value.max_attempts"
           >
-             <span style="font-size: 13px;">
-      {{ $t('views.system.loginFailed') }}
-    </span>
+            <span style="font-size: 13px">
+              {{ $t('views.system.loginFailed') }}
+            </span>
             <el-input-number
-              style="margin-left: 8px;"
+              style="margin-left: 8px"
               v-model="form.authentication_value.max_attempts"
               :min="-1"
               :max="10"
               :step="1"
               controls-position="right"
             />
-            <span style="margin-left: 8px; font-size: 13px;">
-      {{ $t('views.system.loginFailedMessage') }}
-    </span>
-            <span style="margin-left: 8px; color: #909399; font-size: 12px;">
-      ({{ $t('views.system.display_codeTip') }})
-    </span>
+            <span style="margin-left: 8px; font-size: 13px">
+              {{ $t('views.system.loginFailedMessage') }}
+            </span>
+            <span style="margin-left: 8px; color: #909399; font-size: 12px">
+              ({{ $t('views.system.display_codeTip') }})
+            </span>
           </el-form-item>
         </el-card>
       </el-radio-group>
@@ -174,18 +178,18 @@
   </el-drawer>
 </template>
 <script setup lang="ts">
-import {ref, watch, computed} from 'vue'
-import {useRoute, useRouter} from 'vue-router'
-import type {FormInstance, FormRules} from 'element-plus'
-import {MsgSuccess} from '@/utils/message'
-import {t} from '@/locales'
-import {copyClick} from '@/utils/clipboard'
-import {loadSharedApi} from '@/utils/dynamics-api/shared-api'
+import { ref, watch, computed } from 'vue'
+import { useRoute, useRouter } from 'vue-router'
+import type { FormInstance, FormRules } from 'element-plus'
+import { MsgSuccess } from '@/utils/message'
+import { t } from '@/locales'
+import { copyClick } from '@/utils/clipboard'
+import { loadSharedApi } from '@/utils/dynamics-api/shared-api'
 
 const router = useRouter()
 const route = useRoute()
 const {
-  params: {id},
+  params: { id },
 } = route
 
 const apiType = computed(() => {
@@ -236,7 +240,7 @@ const open = (data: any) => {
   }
   form.value.authentication = data.authentication
   dialogVisible.value = true
-  loadSharedApi({type: 'application', systemType: apiType.value})
+  loadSharedApi({ type: 'application', systemType: apiType.value })
     .getChatUserAuthType()
     .then((ok: any) => {
       auth_list.value = ok.data
@@ -254,7 +258,7 @@ const submit = async (formEl: FormInstance | undefined) => {
         authentication: form.value.authentication,
         authentication_value: form.value.authentication_value,
       }
-      loadSharedApi({type: 'application', systemType: apiType.value})
+      loadSharedApi({ type: 'application', systemType: apiType.value })
         .putAccessToken(id as string, obj, loading)
         .then(() => {
           emit('refresh')
@@ -290,7 +294,7 @@ function firstGeneration() {
   }
 }
 
-defineExpose({open})
+defineExpose({ open })
 </script>
 <style lang="scss" scoped>
 .authentication-append-input {

ui/src/views/application/component/GeneratePromptDialog.vue

@@ -24,7 +24,7 @@
             </div>
             <p v-else-if="loading" shadow="always" style="margin: 0.5rem 0">
               <el-icon class="is-loading color-primary mr-4"><Loading /></el-icon>
-               {{ $t('views.application.generateDialog.loading') }}
+              {{ $t('views.application.generateDialog.loading') }}
               <span class="dotting"></span>
             </p>
             <p v-else class="flex align-center">
@@ -196,7 +196,7 @@ const startStreamingOutput = () => {
     } else if (loading.value === false && currentDisplayIndex.value >= fullContent.value.length) {
       stopStreaming()
     }
-  }, 50) as  any
+  }, 50) as any
 }
 
 // 停止流式输出
@@ -338,7 +338,6 @@ function generatePrompt(inputValue: any) {
         reader.read().then(getWrite(reader))
       })
   } else if (apiType.value === 'systemManage') {
-    console.log(apiType.value)
     systemGeneratePromptAPI
       .generate_prompt(applicationID.value, modelID.value, requestData)
       .then((response) => {
@@ -423,24 +422,26 @@ const handleScroll = () => {
 }
 
 const handleDialogClose = (done: () => void) => {
-  // 弹出 消息
-  MsgConfirm(t('common.tip'), t('views.application.generateDialog.exit'), {
-    confirmButtonText: t('common.confirm'),
-    cancelButtonText: t('common.cancel'),
-    distinguishCancelAndClose: true,
-  })
-    .then(() => {
-      // 点击确认，清除状态
-      stopStreaming()
-      chatMessages.value = []
-      fullContent.value = ''
-      currentDisplayIndex.value = 0
-      isOutputComplete.value = false
-      done() // 真正关闭
-    })
-    .catch(() => {
-      // 点击取消
+  if (answer.value) {
+    // 弹出 消息
+    MsgConfirm(t('common.tip'), t('views.application.generateDialog.exit'), {
+      confirmButtonText: t('common.confirm'),
+      cancelButtonText: t('common.cancel'),
+      distinguishCancelAndClose: true,
     })
+      .then(() => {
+        // 点击确认，清除状态
+        stopStreaming()
+        chatMessages.value = []
+        fullContent.value = ''
+        currentDisplayIndex.value = 0
+        isOutputComplete.value = false
+        done() // 真正关闭
+      })
+      .catch(() => {
+        // 点击取消
+      })
+  }
 }
 
 // 组件卸载时清理定时器

ui/src/views/tool/toolStore/ToolStoreDialog.vue

@@ -1,7 +1,7 @@
 <template>
   <el-dialog
     v-model="dialogVisible"
-    width="1000"
+    width="1200"
     append-to-body
     class="tool-store-dialog"
     align-center
@@ -10,7 +10,7 @@
   >
     <template #header="{ titleId }">
       <div class="dialog-header flex-between mb-8">
-        <h4 :id="titleId" class="medium">
+        <h4 :id="titleId" class="medium w-240 mr-8">
           {{ $t('views.tool.toolStore.title') }}
         </h4>
         <el-radio-group v-model="toolType" @change="radioChange" class="app-radio-button-group">

ui/src/workflow/nodes/question-node/index.vue

@@ -201,8 +201,8 @@ const defaultPrompt = `{{${t('views.applicationWorkflow.nodes.startNode.label')}
 
 const form = {
   model_id: '',
-  system: defaultPrompt,
-  prompt: t('views.applicationWorkflow.nodes.questionNode.systemDefault'),
+  system: t('views.applicationWorkflow.nodes.questionNode.systemDefault'),
+  prompt: defaultPrompt,
   dialogue_number: 1,
   is_result: false,
 }