perf: prompt

ui/src/components/generate-related-dialog/index.vue

@@ -57,20 +57,17 @@
             @change="modelChange"
           ></ModelSelect>
         </el-form-item>
-        <el-form-item :label="$t('views.application.form.prompt.label')" prop="prompt">
+        <el-form-item prop="prompt">
           <template #label>
             <div class="flex-between">
               <div>
-                <span
+                <span>{{ $t('common.prompt.label') }} <span class="color-danger">*</span></span>
-                  >{{ $t('views.application.form.prompt.label') }}
-                  <span class="color-danger">*</span></span
-                >
               </div>
             </div>
           </template>
           <el-input
             v-model="form.prompt"
-            :placeholder="$t('views.application.form.prompt.placeholder')"
+            :placeholder="$t('common.prompt.placeholder')"
             :rows="7"
             type="textarea"
           />
@@ -150,7 +147,7 @@ const rules = reactive({
   prompt: [
     {
       required: true,
-      message: t('views.application.form.prompt.placeholder'),
+      message: t('common.prompt.placeholder'),
       trigger: 'blur',
     },
   ],

ui/src/locales/lang/en-US/common.ts

@@ -110,4 +110,8 @@ export default {
   copyTitle: 'Copy',
   professional: 'Purchase the Professional Edition',
   sync: 'Sync',
+  prompt: {
+    label: 'Prompt',
+    placeholder: 'Please enter prompt',
+  },
 }

ui/src/locales/lang/en-US/views/application-workflow.ts

@@ -142,9 +142,18 @@ export default {
       label: 'Question Optimization',
       text: 'Optimize and improve the current question based on historical chat records to better match knowledge segments',
       result: 'Optimized Question Result',
-      defaultPrompt1: `Optimize and improve the user's question based on context:`,
+      systemDefault: `#Role
-      defaultPrompt2: `Please output an optimized question.`,
+You are a master of problem optimization, adept at accurately inferring user intentions based on context and optimizing the questions raised by users.
-      systemDefault: 'You are a question optimization expert',
+
+##Skills
+###Skill 1: Optimizing Problems
+2. Receive user input questions.
+3. Carefully analyze the meaning of the problem based on the context.
+4. Output optimized problems.
+
+##Limitations:
+-Only return the optimized problem without any additional explanation or clarification.
+-Ensure that the optimized problem accurately reflects the original problem intent and does not alter the original intention.`,
     },
     conditionNode: {
       label: 'Conditional Branch',
@@ -403,5 +412,6 @@ export default {
     len_le: 'Length less than or equal to',
     len_lt: 'Length less than',
   },
-  FileUploadSetting: {},
+  SystemPromptPlaceholder: 'System Prompt, can reference variables in the system, such as',
+  UserPromptPlaceholder: 'User Prompt, can reference variables in the system, such as',
 }

ui/src/locales/lang/en-US/views/application.ts

@@ -67,17 +67,20 @@ export default {
     },
     roleSettings: {
       label: 'System Prompt',
-      placeholder: 'You are xxx assistant',
+      placeholder:
+        'System prompt, you can reference variables in the system: {data} is the segment hit in the knowledge base; {question} is the question asked by the user.',
+      tooltip: 'Set the role or instructions for the model to follow',
     },
 
     prompt: {
-      label: 'Prompt',
+      label: 'User Prompt',
       noReferences: '（No references Knowledge）',
       references: ' (References Knowledge)',
-      placeholder: 'Please enter prompt',
+      placeholder:
-      requiredMessage: 'Please enter prompt',
+        'User prompt, you can reference variables in the system: {data} is the segment hit in the knowledge base; {question} is the question asked by the user',
+      requiredMessage: 'Please enter User prompt',
       tooltip:
-        'By adjusting the content of the prompt, you can guide the direction of the large model chat.',
+        'The question or command that the user poses to the model',
 
       noReferencesTooltip:
         'By adjusting the content of the prompt, you can guide the direction of the large model chat. This prompt will be fixed at the beginning of the context. Variables used: {question} is the question posed by the user.',

ui/src/locales/lang/zh-CN/common.ts

@@ -113,4 +113,8 @@ export default {
   copyTitle: '副本',
   professional: '购买专业版',
   sync: '同步',
+  prompt: {
+    label: '提示词',
+    placeholder: '请输入提示词',
+  },
 }

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

@@ -150,9 +150,18 @@ export default {
       label: '问题优化',
       text: '根据历史聊天记录优化完善当前问题，更利于匹配知识库分段',
       result: '问题优化结果',
-      defaultPrompt1: `根据上下文优化和完善用户问题`,
+      systemDefault: `# 角色
-      defaultPrompt2: `请输出一个优化后的问题。`,
+你是一位问题优化大师，擅长根据上下文精准揣测用户意图，并对用户提出的问题进行优化。
-      systemDefault: '你是一个问题优化大师',
+
+## 技能
+### 技能 1: 优化问题
+2. 接收用户输入的问题。
+3. 依据上下文仔细分析问题含义。
+4. 输出优化后的问题。
+
+## 限制:
+- 仅返回优化后的问题，不进行额外解释或说明。
+- 确保优化后的问题准确反映原始问题意图，不得改变原意。`,
     },
     conditionNode: {
       label: '判断器',
@@ -405,5 +414,6 @@ export default {
     is_true: '为真',
     is_not_true: '不为真',
   },
-  FileUploadSetting: {},
+  SystemPromptPlaceholder: '系统提示词，可以引用系统中的变量：如',
+  UserPromptPlaceholder: '用户提示词，可以引用系统中的变量：如',
 }

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

@@ -1,3 +1,5 @@
+import tool from '@/api/tool/tool'
+
 export default {
   title: '应用',
   createApplication: '创建简易应用',
@@ -63,17 +65,20 @@ export default {
     },
     roleSettings: {
       label: '系统提示词',
-      placeholder: '你是 xxx 小助手',
+      placeholder:
+        '系统提示词，可以引用系统中的变量：{data} 是命中知识库中的分段；{question} 是用户提出的问题。',
+      tooltip: '设定模型扮演的角色或遵循的指令',
     },
 
     prompt: {
-      label: '提示词',
+      label: '用户提示词',
       noReferences: ' (无引用知识库)',
       references: ' (引用知识库)',
-      placeholder: '请输入提示词',
+      placeholder:
-      requiredMessage: '请输入提示词',
+        '用户提示词，可以引用系统中的变量：{data} 是命中知识库中的分段；{question} 是用户提出的问题。',
+      requiredMessage: '请输入用户提示词',
       tooltip:
-        '通过调整提示词内容，可以引导大模型聊天方向，该提示词会被固定在上下文的开头，可以使用变量。',
+        '用户向模型提出的问题或输入的指令',
       noReferencesTooltip:
         '通过调整提示词内容，可以引导大模型聊天方向，该提示词会被固定在上下文的开头。可以使用变量：{question} 是用户提出问题的占位符。',
       referencesTooltip:

ui/src/locales/lang/zh-Hant/common.ts

@@ -109,4 +109,8 @@ export default {
   copyTitle: '副本',
   professional: '購買專業版',
   sync: '同步',
+  prompt: {
+    label: '提示詞',
+    placeholder: '請輸入提示詞',
+  },
 }

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

@@ -143,9 +143,18 @@ export default {
       label: '問題優化',
       text: '根據歷史聊天記錄優化完善當前問題，更利於匹配知識庫分段',
       result: '問題優化結果',
-      defaultPrompt1: `根據上下文優化和完善用戶問題：`,
+      systemDefault: `# 角色
-      defaultPrompt2: `請輸出一個優化後的問題。`,
+妳是壹位問題優化大師，擅長根據上下文精準揣測用戶意圖，並對用戶提出的問題進行優化。
-      systemDefault: '你是一個問題優化大師',
+
+## 技能
+### 技能 1: 優化問題
+2. 接收用戶輸入的問題。
+3. 依據上下文仔細分析問題含義。
+4. 輸出優化後的問題。
+
+## 限制:
+- 僅返回優化後的問題，不進行額外解釋或說明。
+- 確保優化後的問題準確反映原始問題意圖，不得改變原意。`,
     },
     conditionNode: {
       label: '判斷器',
@@ -389,5 +398,6 @@ export default {
     len_le: '長度小於等於',
     len_lt: '長度小於',
   },
-  FileUploadSetting: {},
+  SystemPromptPlaceholder: '系統提示詞，可以引用系統中的變量：如',
+  UserPromptPlaceholder: '用戶提示詞，可以引用系統中的變量：如',
 }

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

@@ -63,15 +63,18 @@ export default {
     },
     roleSettings: {
       label: '系統提示詞',
-      placeholder: '你是 xxx 小助手',
+      placeholder:
+        '系統提示詞，可以引用系統中的變數：{data} 是命中知識庫中的分段；{question} 是用戶提出的問題。',
+      tooltip: '設定模型扮演的角色或遵循的指令',
     },
     prompt: {
-      label: '提示詞',
+      label: '用戶提示詞',
       noReferences: ' (無引用知識庫)',
       references: ' (引用知識庫)',
-      placeholder: '請輸入提示詞',
+      placeholder:
-      requiredMessage: '請輸入提示詞',
+        '用戶提示詞，可以引用系統中的變數：{data} 是命中知識庫中的分段；{question} 是用戶提出的問題。',
-      tooltip: '透過調整提示詞內容，可以引導大模型對話方向，該提示詞會被固定在上下文的開頭。',
+      requiredMessage: '請輸入用戶提示詞',
+      tooltip: '用戶向模型提出的問題或輸入的指令',
 
       noReferencesTooltip:
         '透過調整提示詞內容，可以引導大模型對話方向，該提示詞會被固定在上下文的開頭。可以使用變數：{question} 是用戶提出問題的佔位符。',

ui/src/views/application/ApplicationSetting.vue

@@ -102,7 +102,17 @@
                 <el-form-item>
                   <template #label>
                     <div class="flex-between">
-                      <span>{{ $t('views.application.form.roleSettings.label') }}</span>
+                      <div class="flex align-center">
+                        <span>{{ $t('views.application.form.roleSettings.label') }}</span>
+                        <el-tooltip
+                          effect="dark"
+                          :content="$t('views.application.form.roleSettings.tooltip')"
+                          placement="right"
+                        >
+                          <AppIcon iconName="app-warning" class="app-warning-icon ml-4"></AppIcon>
+                        </el-tooltip>
+                      </div>
+
                       <el-button
                         type="primary"
                         link
@@ -119,7 +129,12 @@
                     v-model="applicationForm.model_setting.system"
                     style="height: 120px"
                     @submitDialog="submitSystemDialog"
-                    :placeholder="$t('views.application.form.roleSettings.placeholder')"
+                    :placeholder="
+                      $t('views.application.form.roleSettings.placeholder', {
+                        data: '{data}',
+                        question: '{question}',
+                      })
+                    "
                   />
                 </el-form-item>
                 <el-form-item
@@ -140,11 +155,7 @@
                       </span>
                       <el-tooltip
                         effect="dark"
-                        :content="
+                        :content="$t('views.application.form.prompt.tooltip')"
-                          $t('views.application.form.prompt.noReferencesTooltip', {
-                            question: '{question}',
-                          })
-                        "
                         placement="right"
                         popper-class="max-w-350"
                       >
@@ -162,7 +173,12 @@
                     v-model="applicationForm.model_setting.no_references_prompt"
                     style="height: 120px"
                     @submitDialog="submitNoReferencesPromptDialog"
-                    placeholder="{question}"
+                    :placeholder="
+                      $t('views.application.form.roleSettings.placeholder', {
+                        data: '{data}',
+                        question: '{question}',
+                      })
+                    "
                   />
                 </el-form-item>
                 <el-form-item
@@ -253,12 +269,7 @@
                       </span>
                       <el-tooltip
                         effect="dark"
-                        :content="
+                        :content="$t('views.application.form.prompt.tooltip')"
-                          $t('views.application.form.prompt.referencesTooltip', {
-                            data: '{data}',
-                            question: '{question}',
-                          })
-                        "
                         popper-class="max-w-350"
                         placement="right"
                       >
@@ -276,7 +287,12 @@
                     v-model="applicationForm.model_setting.prompt"
                     style="height: 150px"
                     @submitDialog="submitPromptDialog"
-                    :placeholder="defaultPrompt"
+                    :placeholder="
+                      $t('views.application.form.roleSettings.placeholder', {
+                        data: '{data}',
+                        question: '{question}',
+                      })
+                    "
                   />
                 </el-form-item>
                 <el-form-item :label="$t('views.application.form.prologue')">
@@ -415,7 +431,10 @@
                     </div>
                   </template>
                 </div>
-                <el-form-item @click.prevent v-if="applicationForm.mcp_enable || applicationForm.tool_enable">
+                <el-form-item
+                  @click.prevent
+                  v-if="applicationForm.mcp_enable || applicationForm.tool_enable"
+                >
                   <template #label>
                     <div class="flex-between">
                       <span class="mr-4">
@@ -485,12 +504,12 @@
                   </template>
                   <div class="flex-between w-full">
                     <ModelSelect
-                    v-show="applicationForm.stt_model_enable"
+                      v-show="applicationForm.stt_model_enable"
-                    v-model="applicationForm.stt_model_id"
+                      v-model="applicationForm.stt_model_id"
-                    :placeholder="$t('views.application.form.voiceInput.placeholder')"
+                      :placeholder="$t('views.application.form.voiceInput.placeholder')"
-                    :options="sttModelOptions"
+                      :options="sttModelOptions"
-                    @change="sttModelChange"
+                      @change="sttModelChange"
-                    :model-type="'STT'"
+                      :model-type="'STT'"
                     >
                     </ModelSelect>
 
@@ -698,7 +717,7 @@ const applicationForm = ref<ApplicationFormType>({
   },
   model_setting: {
     prompt: defaultPrompt,
-    system: t('views.application.form.roleSettings.placeholder'),
+    system: '',
     no_references_prompt: '{question}',
     reasoning_content_enable: false,
   },
@@ -834,7 +853,6 @@ const openSTTParamSettingDialog = () => {
   }
 }
 
-
 const openParamSettingDialog = () => {
   ParamSettingDialogRef.value?.open(applicationForm.value)
 }
@@ -847,7 +865,9 @@ function removeTool(id: any) {
 
 function removeMcpTool(id: any) {
   if (applicationForm.value.mcp_tool_ids) {
-    applicationForm.value.mcp_tool_ids = applicationForm.value.mcp_tool_ids.filter((v: any) => v !== id)
+    applicationForm.value.mcp_tool_ids = applicationForm.value.mcp_tool_ids.filter(
+      (v: any) => v !== id,
+    )
   }
 }
 

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

@@ -151,7 +151,7 @@ const applicationForm = ref<ApplicationFormType>({
   },
   model_setting: {
     prompt: defaultPrompt,
-    system: t('views.application.form.roleSettings.placeholder'),
+    system: '',
     no_references_prompt: '{question}',
   },
   model_params_setting: {},
@@ -205,7 +205,7 @@ watch(dialogVisible, (bool) => {
       },
       model_setting: {
         prompt: defaultPrompt,
-        system: t('views.application.form.roleSettings.placeholder'),
+        system: '',
         no_references_prompt: '{question}',
       },
       model_params_setting: {},

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

@@ -168,7 +168,7 @@
           </el-form-item>
           <el-form-item
             v-if="form.problem_optimization"
-            :label="$t('views.application.form.prompt.label')"
+            :label="$t('common.prompt.label')"
           >
             <el-input
               v-model="form.problem_optimization_prompt"
@@ -246,7 +246,7 @@ const noReferencesRules = reactive<FormRules<any>>({
   designated_answer: [
     {
       required: true,
-      message: t('views.application.form.prompt.requiredMessage'),
+      message: t('common.prompt.placeholder'),
       trigger: 'blur',
     },
   ],

ui/src/workflow/nodes/ai-chat-node/index.vue

@@ -56,7 +56,17 @@
         <el-form-item>
           <template #label>
             <div class="flex-between">
-              <span>{{ $t('views.application.form.roleSettings.label') }}</span>
+              <div class="flex align-center">
+                <span>{{ $t('views.application.form.roleSettings.label') }}</span>
+                <el-tooltip
+                  effect="dark"
+                  :content="$t('views.application.form.roleSettings.tooltip')"
+                  placement="right"
+                >
+                  <AppIcon iconName="app-warning" class="app-warning-icon ml-4"></AppIcon>
+                </el-tooltip>
+              </div>
+
               <el-button
                 type="primary"
                 link
@@ -72,7 +82,7 @@
             v-model="chat_data.system"
             style="height: 100px"
             @submitDialog="submitSystemDialog"
-            :placeholder="$t('views.application.form.roleSettings.placeholder')"
+            :placeholder="`${t('views.applicationWorkflow.SystemPromptPlaceholder')}{{${t('views.applicationWorkflow.nodes.startNode.label')}.question}}`"
           />
         </el-form-item>
         <el-form-item
@@ -104,6 +114,7 @@
             v-model="chat_data.prompt"
             style="height: 150px"
             @submitDialog="submitDialog"
+            :placeholder="`${t('views.applicationWorkflow.UserPromptPlaceholder')}{{${t('views.applicationWorkflow.nodes.startNode.label')}.question}}`"
           />
         </el-form-item>
         <el-form-item :label="$t('views.application.form.historyRecord.label')">
@@ -144,10 +155,7 @@
             <el-switch size="small" v-model="chat_data.mcp_enable" />
           </div>
         </div>
-        <div
+        <div class="w-full mb-16" v-if="chat_data.mcp_tool_ids?.length > 0">
-          class="w-full mb-16"
-          v-if=" chat_data.mcp_tool_ids?.length > 0"
-        >
           <template v-for="(item, index) in chat_data.mcp_tool_ids" :key="index">
             <div
               class="flex-between border border-r-6 white-bg mb-4"
@@ -185,20 +193,19 @@
             </div>
           </template>
         </div>
-        <div v-if="chat_data.mcp_servers && chat_data.mcp_servers.length > 0"
+        <div
-             class="flex-between border border-r-6 white-bg mb-4"
+          v-if="chat_data.mcp_servers && chat_data.mcp_servers.length > 0"
-             style="padding: 5px 8px"
+          class="flex-between border border-r-6 white-bg mb-4"
+          style="padding: 5px 8px"
         >
           <div class="flex align-center" style="line-height: 20px">
-            <ToolIcon type="MCP" class="mr-8" :size="20"/>
+            <ToolIcon type="MCP" class="mr-8" :size="20" />
             <div class="ellipsis">
-              {{
+              {{ $t('common.custom') + ' MCP' }}
-                $t('common.custom') + ' MCP'
-              }}
             </div>
           </div>
           <el-button text @click="chat_data.mcp_servers = ''">
-            <el-icon><Close/></el-icon>
+            <el-icon><Close /></el-icon>
           </el-button>
         </div>
         <!-- 工具       -->

ui/src/workflow/nodes/image-generate/index.vue

@@ -59,7 +59,7 @@
           prop="prompt"
           :rules="{
             required: true,
-            message: $t('views.application.form.prompt.requiredMessage'),
+            message: $t('common.prompt.placeholder'),
             trigger: 'blur',
           }"
         >
@@ -92,7 +92,7 @@
           prop="prompt"
           :rules="{
             required: false,
-            message: $t('views.application.form.prompt.requiredMessage'),
+            message: $t('common.prompt.placeholder'),
             trigger: 'blur',
           }"
         >

ui/src/workflow/nodes/image-to-video/index.vue

@@ -61,7 +61,7 @@
           prop="prompt"
           :rules="{
             required: true,
-            message: $t('views.application.form.prompt.requiredMessage'),
+            message: $t('common.prompt.placeholder'),
             trigger: 'blur',
           }"
         >
@@ -95,7 +95,7 @@
           prop="prompt"
           :rules="{
             required: false,
-            message: $t('views.application.form.prompt.requiredMessage'),
+            message: $t('common.prompt.placeholder'),
             trigger: 'blur',
           }"
         >

ui/src/workflow/nodes/image-understand/index.vue

@@ -55,13 +55,27 @@
           ></ModelSelect>
         </el-form-item>
 
-        <el-form-item :label="$t('views.application.form.roleSettings.label')">
+        <el-form-item>
+          <template #label>
+            <div class="flex-between">
+              <div class="flex align-center">
+                <span>{{ $t('views.application.form.roleSettings.label') }}</span>
+                <el-tooltip
+                  effect="dark"
+                  :content="$t('views.application.form.roleSettings.tooltip')"
+                  placement="right"
+                >
+                  <AppIcon iconName="app-warning" class="app-warning-icon ml-4"></AppIcon>
+                </el-tooltip>
+              </div>
+            </div>
+          </template>
           <MdEditorMagnify
             :title="$t('views.application.form.roleSettings.label')"
             v-model="form_data.system"
             style="height: 100px"
             @submitDialog="submitSystemDialog"
-            :placeholder="$t('views.application.form.roleSettings.placeholder')"
+            :placeholder="`${t('views.applicationWorkflow.SystemPromptPlaceholder')}{{${t('views.applicationWorkflow.nodes.startNode.label')}.question}}`"
           />
         </el-form-item>
         <el-form-item
@@ -93,6 +107,7 @@
             v-model="form_data.prompt"
             style="height: 150px"
             @submitDialog="submitDialog"
+            :placeholder="`${t('views.applicationWorkflow.UserPromptPlaceholder')}{{${t('views.applicationWorkflow.nodes.startNode.label')}.question}}`"
           />
         </el-form-item>
         <el-form-item>

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

@@ -51,13 +51,27 @@
             :model-type="'LLM'"
           ></ModelSelect>
         </el-form-item>
-        <el-form-item :label="$t('views.application.form.roleSettings.label')">
+        <el-form-item>
+          <template #label>
+            <div class="flex-between">
+              <div class="flex align-center">
+                <span>{{ $t('views.application.form.roleSettings.label') }}</span>
+                <el-tooltip
+                  effect="dark"
+                  :content="$t('views.application.form.roleSettings.tooltip')"
+                  placement="right"
+                >
+                  <AppIcon iconName="app-warning" class="app-warning-icon ml-4"></AppIcon>
+                </el-tooltip>
+              </div>
+            </div>
+          </template>
           <MdEditorMagnify
             :title="$t('views.application.form.roleSettings.label')"
             v-model="form_data.system"
             style="height: 100px"
             @submitDialog="submitSystemDialog"
-            :placeholder="$t('views.application.form.roleSettings.placeholder')"
+            :placeholder="`${t('views.applicationWorkflow.SystemPromptPlaceholder')}{{${t('views.applicationWorkflow.nodes.startNode.label')}.question}}`"
           />
         </el-form-item>
         <el-form-item
@@ -89,6 +103,7 @@
             v-model="form_data.prompt"
             style="height: 150px"
             @submitDialog="submitDialog"
+            :placeholder="`${t('views.applicationWorkflow.UserPromptPlaceholder')}{{${t('views.applicationWorkflow.nodes.startNode.label')}.question}}`"
           />
         </el-form-item>
         <el-form-item :label="$t('views.application.form.historyRecord.label')">
@@ -182,14 +197,12 @@ function submitSystemDialog(val: string) {
   set(props.nodeModel.properties.node_data, 'system', val)
 }
 
-// @ts-ignore
+const defaultPrompt = `{{${t('views.applicationWorkflow.nodes.startNode.label')}.question}}`
-const defaultPrompt = `${t('views.applicationWorkflow.nodes.questionNode.defaultPrompt1')}{{${t('views.applicationWorkflow.nodes.startNode.label')}.question}}
-${t('views.applicationWorkflow.nodes.questionNode.defaultPrompt2')}`
 
 const form = {
   model_id: '',
-  system: t('views.applicationWorkflow.nodes.questionNode.systemDefault'),
+  system: defaultPrompt,
-  prompt: defaultPrompt,
+  prompt: t('views.applicationWorkflow.nodes.questionNode.systemDefault'),
   dialogue_number: 1,
   is_result: false,
 }

ui/src/workflow/nodes/text-to-video/index.vue

@@ -60,7 +60,7 @@
           prop="prompt"
           :rules="{
             required: true,
-            message: $t('views.application.form.prompt.requiredMessage'),
+            message: $t('common.prompt.placeholder'),
             trigger: 'blur',
           }"
         >
@@ -93,7 +93,7 @@
           prop="prompt"
           :rules="{
             required: false,
-            message: $t('views.application.form.prompt.requiredMessage'),
+            message: $t('common.prompt.placeholder'),
             trigger: 'blur',
           }"
         >