From d74b2222438c6ebce04e73dfc604606ed7de900c Mon Sep 17 00:00:00 2001
From: li-shengren-123456 <lishengren@h-partners.com>
Date: Thu, 27 Feb 2025 17:10:44 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E7=82=B9=E5=87=BB=E9=A6=96?=
 =?UTF-8?q?=E9=A1=B5=E4=BC=9A=E8=B7=B3=E8=BD=AC=E5=BA=94=E7=94=A8=E4=B8=AD?=
 =?UTF-8?q?=E5=BF=83=E9=97=AE=E9=A2=98=EF=BC=8C=E5=86=8D=E9=97=AE=E8=B0=83?=
 =?UTF-8?q?=E8=AF=95=E8=8A=82=E7=82=B9=E6=9C=AA=E6=B8=85=E7=A9=BA=E9=97=AE?=
 =?UTF-8?q?=E9=A2=98=EF=BC=8C=E8=B0=83=E8=AF=95=E4=B8=8Eyaml=E7=BC=96?=
 =?UTF-8?q?=E8=BE=91=E6=8A=98=E5=8F=A0=E9=97=AE=E9=A2=98=EF=BC=8C=E8=BE=93?=
 =?UTF-8?q?=E5=85=A5=E8=BE=93=E5=87=BA=E4=B8=8E=E8=B0=83=E8=AF=95=E4=BF=9D?=
 =?UTF-8?q?=E6=8C=81=E4=B8=80=E8=87=B4=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Upload/index.vue               | 10 +++----
 src/store/conversation.ts                     | 10 ++-----
 src/views/createapp/components/workFlow.vue   | 20 ++++++++-----
 .../components/workFlowConfig/BranchNode.vue  | 28 ++++++++++++++++--
 .../components/workFlowConfig/CustomNode.vue  | 29 +++++++++++++++----
 .../createapp/components/workFlowDebug.vue    | 25 +++++++++++-----
 src/views/createapp/index.vue                 | 12 --------
 .../dialogue/components/AppInitalPreview.vue  | 18 ++++--------
 src/views/styles/workFlowArrange.scss         |  3 ++
 9 files changed, 95 insertions(+), 60 deletions(-)

diff --git a/src/components/Upload/index.vue b/src/components/Upload/index.vue
index 41f12c1..71bb001 100644
--- a/src/components/Upload/index.vue
+++ b/src/components/Upload/index.vue
@@ -15,7 +15,7 @@ const handleCreateapi = () => {
       data:yamlToJsonContent.value,
     })
     .then(res => {
-      getServiceJson.value = res[1].result.apis;
+      getServiceJson.value = res[1]?.result?.apis;
       uploadtype.value = 'get';
     });
 };
@@ -81,7 +81,7 @@ const uploadtype = ref(props.type);
 const getServiceYaml = ref('');
 const yamlToJsonContent = ref('');
 const getServiceJson = ref('');
-const activeServiceName = ref('');
+const activeServiceNameList = ref([]);
 const imageUrl = ref('');
 const progressVal = ref(0);
 const uploadDone = ref(false);
@@ -184,7 +184,7 @@ watch(
     getServiceYaml.value = props.getServiceYaml;
     console.log(props, 'props---result')
     if (getServiceJson.value?.length) {
-      activeServiceName.value = getServiceJson.value?.[0]?.name;
+      activeServiceNameList.value = [getServiceJson.value?.[0]?.name];
     }
     if (props.type === 'edit' && props) {
       getServiceYamlFun(props.serviceId);
@@ -256,13 +256,13 @@ watch(
     />
   </div>
   <div class="json-container" v-if="uploadtype === 'get'">
-    <el-collapse v-model="activeServiceName" class="o-hpc-collapse" :prefix-icon="IconChevronDown">
+    <el-collapse v-model="activeServiceNameList" class="o-hpc-collapse" :prefix-icon="IconChevronDown">
       <!-- 这里直接展示输入和输出 -->
       <el-collapse-item v-for="(item, index) in getServiceJson" :key="index" :name="item.name">
         <template #title>
           <span>{{ item.name }}</span>
           <!-- 这里接口返回的需要限制最大位数 -->
-          <el-icon class="el-collapse-item__arrow" >
+          <el-icon class="el-collapse-item__arrow" :class="{ 'is-active': activeServiceNameList.includes(item.name) }">
             <IconCaretRight></IconCaretRight>
           </el-icon>
         </template>
diff --git a/src/store/conversation.ts b/src/store/conversation.ts
index c0aa626..4ed4b8b 100644
--- a/src/store/conversation.ts
+++ b/src/store/conversation.ts
@@ -233,7 +233,6 @@ export const useSessionStore = defineStore('conversation', () => {
           break;
         }
         const { done, value } = await reader.read();
-        console.log(value, 'value')
         const decodedValue = decoder.decode(value, { stream: true });
         const isLegal = judgeMessage(answerIndex, decodedValue);
         if (!isLegal) {
@@ -258,12 +257,10 @@ export const useSessionStore = defineStore('conversation', () => {
         // const line3 = lines2.map(item => {
         //   item = 'data: {' + item;
         // })
-        console.log(decodedValue, '---finally')
         // return;
         lines.forEach((line) => {
           // const message = Object(JSON.parse(line.replace(/^data:\s*/, '').trim()));
           // 这里json解析
-          console.log(line, 'lines=-------------------')   
           const message = Object(JSON.parse(line.replace(/^data:\s*/, '').trim()));
           if( 'metadata' in message){
             if(conversationItem.metadata?.time<message.metadata.time){
@@ -297,7 +294,7 @@ export const useSessionStore = defineStore('conversation', () => {
               //事件流开始--后续验证对话无下拉连接后则完全替换
               let flow = message.flow;
               conversationItem.flowdata = {
-                id: flow?.stepName||"",
+                id: flow?.stepName + flow?.stepId || "",
                 title: i18n.global.t('flow.flow_start'),
                 // 工作流这里stepName代替step_progresss，为不影响首页对话暂且用||
                 progress: flow?.stepProgress || "",
@@ -313,7 +310,7 @@ export const useSessionStore = defineStore('conversation', () => {
               //   target.data.input = message
               // }
                 conversationItem.flowdata?.data[0].push({
-                  id:message.flow?.stepName,
+                  id:message.flow?.stepName + message.flow?.stepId,
                   title:message.flow?.stepName,
                   status:message.flow?.stepStatus,
                   data:{
@@ -326,7 +323,7 @@ export const useSessionStore = defineStore('conversation', () => {
                 }
             }
             else if(message["event"] === "step.output") {
-              const target = conversationItem.flowdata?.data[0].find(item => item.id === message.flow.stepName);
+              const target = conversationItem.flowdata?.data[0].find(item => item.id === message.flow?.stepName + message.flow?.stepId);
               if (target) {
                 target.data.output = message.content
                 target.status = message.flow?.stepStatus;
@@ -386,7 +383,6 @@ export const useSessionStore = defineStore('conversation', () => {
         }
       }
     } catch (err: any) {
-      // console.log(err, 'errr')
       isPaused.value = true;
       isAnswerGenerating.value = false;
       (conversationList.value[answerIndex] as RobotConversationItem).isFinish = true;
diff --git a/src/views/createapp/components/workFlow.vue b/src/views/createapp/components/workFlow.vue
index b99fbc5..59db808 100644
--- a/src/views/createapp/components/workFlow.vue
+++ b/src/views/createapp/components/workFlow.vue
@@ -272,7 +272,9 @@ const handleDebugDialogOps = (visible) => {
   if (visible) {
     saveFlow();
   }
-  debugDialogVisible.value = visible;
+  if (typeof visible === 'boolean') {
+    debugDialogVisible.value = visible;
+  }
   // 调试弹窗关闭时---结果清空
   debugStatus.value = '';
   // 调试弹窗关闭时---节点状态清空
@@ -463,8 +465,11 @@ $bus.on('getNodesStatue', lines => {
           if (newLines.data.event === 'step.output') {
             totalTime.value += newLines.data?.metadata?.time_cost;
             constTime = `${newLines.data?.metadata?.time_cost?.toFixed(3)}s`
+            // 此处获取output的数据，并将此数据传给节点显示
+            updateNodeFunc(newLines.data.flow.stepId, newLines.data.flow?.stepStatus, constTime, newLines.data?.content);
+          } else {
+            updateNodeFunc(newLines.data.flow.stepId, newLines.data.flow?.stepStatus, constTime);
           }
-          updateNodeFunc(newLines.data.flow.stepId, newLines.data.flow?.stepStatus, constTime);
       } else if (newLines?.data?.event === 'flow.stop') {
         emits('updateFlowsDebug')
         debugStatus.value = newLines.data.flow?.stepStatus;
@@ -477,15 +482,14 @@ $bus.on('getNodesStatue', lines => {
   } catch (error) {
     ElMessage.error('请检查格式是否正确');
   }
-
   // 修改节点时，需要将对应节点的边也进行修改
 });
 
 // 更新节点状态--这里是测试第一个成功节点改变状态的方法【同时边也随之改变】
-const updateNodeFunc = (id, status, constTime) => {
+const updateNodeFunc = (id, status, constTime, content?) => {
   // 获取到当前的nodeId,更新状态
   const node = findNode(id);
-  const data = node?.data;
+  const data = content ? {...node?.data, content} : node?.data;
   // 更新当前节点的状态，以及运行时间
   updateNode(id, { data: { ...data, status, constTime } });
   // 遍历获取以当前节点为起源节点的边和为目的节点的边
@@ -670,12 +674,12 @@ defineExpose({
         <CustomControl :handleChangeZoom="handleChangeZoom" :flowZoom="flowZoom" :layoutGraph="layoutGraph" />
         <!-- 自定义节点 -->
         <template #node-custom="customNodeProps">
-          <CustomNode v-bind="customNodeProps" @delNode="delNode" @editYamlDrawer="editYamlDrawer"></CustomNode>
+          <CustomNode v-bind="customNodeProps" :disabled="debugDialogVisible" @delNode="delNode" @editYamlDrawer="editYamlDrawer"></CustomNode>
         </template>
 
         <!-- 自定义分支节点 -->
         <template #node-branch="branchNodeProps">
-          <BranchNode v-bind="branchNodeProps" @delNode="delNode" @editYamlDrawer="editYamlDrawer"></BranchNode>
+          <BranchNode v-bind="branchNodeProps" :disabled="debugDialogVisible" @delNode="delNode" @editYamlDrawer="editYamlDrawer"></BranchNode>
         </template>
 
         <template #node-start="nodeStartProps">
@@ -722,7 +726,7 @@ defineExpose({
       <div class="workFlowOps" v-if="workFlowList.length">
         <!-- 工作流画布左上方选择工作流以及调试按钮等区域 -->
         <div class="workFlowSelect">
-          <el-select v-model="workFlowItemName" placeholder="请选择" :suffix-icon="IconCaretDown">
+          <el-select :disabled="debugDialogVisible" v-model="workFlowItemName" placeholder="请选择" :suffix-icon="IconCaretDown">
             <el-option
               class="workFlowOption"
               v-for="(item, index) in workFlowList"
diff --git a/src/views/createapp/components/workFlowConfig/BranchNode.vue b/src/views/createapp/components/workFlowConfig/BranchNode.vue
index 318542c..31aaf2f 100644
--- a/src/views/createapp/components/workFlowConfig/BranchNode.vue
+++ b/src/views/createapp/components/workFlowConfig/BranchNode.vue
@@ -20,6 +20,10 @@ const props = defineProps({
     type: Object,
     required: false,
   },
+  disabled: {
+    type: Boolean,
+    required: false,
+  }
 });
 const emits = defineEmits(['delNode', 'editYamlDrawer']);
 
@@ -33,21 +37,39 @@ const curStatus = ref('');
 // 当前节点运行耗时
 const costTime = ref('');
 
+// 定义传给mirror展示输入输出的存储量
+const inputAndOutput = ref({
+  input_parameters: {},
+  output_parameters: {},
+});
+
 watch(
   () => props.data,
   () => {
     const isInclude = statusList.value.includes(props.data?.status);
+    // 设置节点的状态-默认以及成功、失败、运行中
     if (!isInclude) {
       curStatus.value = 'default';
     } else {
       curStatus.value = props.data?.status;
     }
+    // 节点调试消耗时间【目前只有调试接口返回的节点step.output才有值，其余状态为''不显示】
     costTime.value = props.data?.constTime || '';
+    // 这里是分支节点独有的，需要根据接口拖拽节点里的choices决定有几个handle节点
     if (props.data?.parameters?.input_parameters?.choices) {
       branchIdList.value = props.data?.parameters?.input_parameters?.choices.map(
         item => item?.branchId,
       );
     }
+    // 默认的输入赋值
+    inputAndOutput.value.input_parameters = props.data?.parameters?.input_parameters || {};
+    // 判断是否有调试的输出，有调试的输出，需要将其显示/否则显示默认的输出
+    if (props.data?.content) {
+      // 将paramaters里的output换为接口返回的output_parameters
+      inputAndOutput.value.output_parameters = props.data.content;
+    } else {
+      inputAndOutput.value.output_parameters = props.data?.parameters?.output_parameters || {};
+    }
   },
   { deep: true, immediate: true },
 );
@@ -72,8 +94,8 @@ const editYaml = (nodeName, yamlCode) => {
       <div class="title" v-if="props.data.name">
         <div class="iconStyle"></div>
         <div class="label">{{ props.data.name }}</div>
-        <div class="moreTip">
-          <el-popover placement="right" trigger="hover" popper-class="nodeDealPopper">
+        <div class="moreTip" :class="{'notAllow': props.disabled}">
+          <el-popover :disabled="props.disabled" placement="right" trigger="hover" popper-class="nodeDealPopper">
             <template #reference>···</template>
             <el-button text class="dealItem" @click="editYaml(props.data.name, props.data.parameters)">编辑</el-button>
             <el-button text class="dealItem" @click="delNode(props.id)">删除</el-button>
@@ -99,7 +121,7 @@ const editYaml = (nodeName, yamlCode) => {
       v-if="curStatus !== 'default'"
       :status="curStatus"
       :costTime="costTime"
-      :inputAndOutput="props.data?.parameters"
+      :inputAndOutput="inputAndOutput"
       style="display: block"
     ></NodeMirrorText>
   </div>
diff --git a/src/views/createapp/components/workFlowConfig/CustomNode.vue b/src/views/createapp/components/workFlowConfig/CustomNode.vue
index 0e1198e..27ddcbf 100644
--- a/src/views/createapp/components/workFlowConfig/CustomNode.vue
+++ b/src/views/createapp/components/workFlowConfig/CustomNode.vue
@@ -19,10 +19,10 @@ const props = defineProps({
     type: Object,
     required: false,
   },
-  mark: {
-    type: String,
+  disabled: {
+    type: Boolean,
     required: false,
-  },
+  }
 });
 const emits = defineEmits(['delNode', 'editYamlDrawer']);
 
@@ -34,16 +34,33 @@ const curStatus = ref('');
 // 当前节点运行耗时
 const costTime = ref('');
 
+// 定义传给mirror展示输入输出的存储量
+const inputAndOutput = ref({
+  input_parameters: {},
+  output_parameters: {},
+});
+
 watch(
   () => props.data,
   () => {
     const isInclude = statusList.value.includes(props.data?.status);
+    // 设置节点的状态-默认以及成功、失败、运行中
     if (!isInclude) {
       curStatus.value = 'default';
     } else {
       curStatus.value = props.data?.status;
     }
+    // 节点调试消耗时间【目前只有调试接口返回的节点step.output才有值，其余状态为''不显示】
     costTime.value = props.data?.constTime || '';
+    // 默认的输入赋值
+    inputAndOutput.value.input_parameters = props.data?.parameters?.input_parameters || {};
+    // 判断是否有调试的输出，有调试的输出，需要将其显示/否则显示默认的输出
+    if (props.data?.content) {
+      // 将paramaters里的output换为接口返回的output_parameters
+      inputAndOutput.value.output_parameters = props.data.content;
+    } else {
+      inputAndOutput.value.output_parameters = props.data?.parameters?.output_parameters || {};
+    }
   },
   { deep: true, immediate: true },
 );
@@ -68,8 +85,8 @@ const editYaml = (nodeName, yamlCode) => {
       <div class="title" v-if="props.data.name">
         <div class="iconStyle"></div>
         <div class="label">{{ props.data.name }}</div>
-        <div class="moreTip">
-          <el-popover placement="right" trigger="hover" popper-class="nodeDealPopper">
+        <div class="moreTip" :class="{'notAllow': props.disabled}">
+          <el-popover :disabled="props.disabled" placement="right" trigger="hover" popper-class="nodeDealPopper">
             <template #reference>···</template>
             <el-button text class="dealItem" @click="editYaml(props.data.name, props.data.parameters)">编辑</el-button>
             <el-button text class="dealItem" @click="delNode(props.id)">删除</el-button>
@@ -89,7 +106,7 @@ const editYaml = (nodeName, yamlCode) => {
       v-if="curStatus !== 'default'"
       :status="curStatus"
       :costTime="costTime"
-      :inputAndOutput="props.data?.parameters"
+      :inputAndOutput="inputAndOutput"
       style="display: block"
     ></NodeMirrorText>
   </div>
diff --git a/src/views/createapp/components/workFlowDebug.vue b/src/views/createapp/components/workFlowDebug.vue
index db54ce4..7693d37 100644
--- a/src/views/createapp/components/workFlowDebug.vue
+++ b/src/views/createapp/components/workFlowDebug.vue
@@ -56,7 +56,7 @@
 </template>
 <script setup lang="ts">
 import '../../styles/workFlowDebug.scss';
-import { ref } from 'vue';
+import { onMounted, ref } from 'vue';
 import { IconX } from '@computing/opendesign-icons';
 import DialoguePanel from 'src/components/dialoguePanel/DialoguePanel.vue';
 import type { ConversationItem, RobotConversationItem } from 'src/views/dialogue/types';
@@ -71,7 +71,8 @@ const testFlag = ref(true);
 const { conversationList, isAnswerGenerating } = storeToRefs(useSessionStore());
 const { user_selected_app } = storeToRefs(useHistorySessionStore());
 const { generateSession, generateSessionDebug } = useHistorySessionStore();
-const { historySession, currentSelectedSession, isSelectedAll, selectedSessionIds } = storeToRefs(useHistorySessionStore());
+const { historySession, currentSelectedSession, isSelectedAll, selectedSessionIds } =
+  storeToRefs(useHistorySessionStore());
 const { app, appList } = storeToRefs(useSessionStore());
 const themeStore = useChangeThemeStore();
 const tmpConversationId = ref('');
@@ -103,6 +104,14 @@ const getItem = <T,>(item: ConversationItem, field: string): T | undefined => {
   return undefined;
 };
 
+onMounted(() => {
+  // 删除成功
+  conversationList.value = [];
+  selectedSessionIds.value = [];
+  currentSelectedSession.value = '';
+  historySession.value = [];
+});
+
 /**
  * 发送消息
  */
@@ -117,6 +126,8 @@ const handleSendMessage = async (groupId: string | undefined, question: string,
     const res = await generateSessionDebug({ debug: true });
     tmpConversationId.value = res || 1;
   }
+
+  props.handleDebugDialogOps!();
   await sendQuestion(groupId, question, [props.appId], undefined, undefined, props.flowId, undefined, true);
 };
 
@@ -140,10 +151,10 @@ const handleKeydown = (event: KeyboardEvent) => {
 };
 
 const handleCloseDebugDialog = () => {
-  testFlag.value = false
+  testFlag.value = false;
   stopDebug();
   delChat();
-  props.handleDebugDialogOps(false);
+  props.handleDebugDialogOps!(false);
 };
 
 // 关闭或者跳转前需要将会话删除
@@ -162,10 +173,10 @@ const delChat = async () => {
       historySession.value = [];
     }
   }
-}
+};
 
-onBeforeRouteLeave((to, from ,next) => {
+onBeforeRouteLeave((to, from, next) => {
   handleCloseDebugDialog();
   next();
-})
+});
 </script>
diff --git a/src/views/createapp/index.vue b/src/views/createapp/index.vue
index bf2635a..7dc6c24 100644
--- a/src/views/createapp/index.vue
+++ b/src/views/createapp/index.vue
@@ -116,18 +116,6 @@ const getPublishStatus = (status) => {
     publishStatus.value = '已发布'
   }
 }
-watch(
-  () => router,
-  () => {
-    if (!route.query?.appId) {
-      router.push('/app');
-    }
-  },
-  {
-    deep: true,
-    immediate: true,
-  },
-);
 
 const handleJumperAppCenter = () => {
   router.push('/app');
diff --git a/src/views/dialogue/components/AppInitalPreview.vue b/src/views/dialogue/components/AppInitalPreview.vue
index fc02a51..2093057 100644
--- a/src/views/dialogue/components/AppInitalPreview.vue
+++ b/src/views/dialogue/components/AppInitalPreview.vue
@@ -6,13 +6,11 @@
         <textarea ref="inputRef" maxlength="2000" :placeholder="$t('main.ask_me_anything')" />
       </div>
       <div class="dialogue-conversation-bottom-sendbox__upload">
-        <el-tooltip placement="top" :content="$t('upload.upload_tip_text')" effect="light">
-          <div class="upload-wrapper">
-            <input ref="uploadButton" type="file" multiple src="@/assets/svgs/upload_light.svg" />
-            <img v-if="themeStore.theme === 'dark'" src="@/assets/svgs/upload_light.svg" />
-            <img v-else src="@/assets/svgs/upload_dark.svg" />
-          </div>
-        </el-tooltip>
+        <div class="upload-wrapper">
+          <input ref="uploadButton" type="file" multiple src="@/assets/svgs/upload_light.svg" />
+          <img v-if="themeStore.theme === 'dark'" src="@/assets/svgs/upload_light.svg" />
+          <img v-else src="@/assets/svgs/upload_dark.svg" />
+        </div>
       </div>
       <div class="dialogue-conversation-bottom-sendbox__icon">
         <img src="@/assets/images/send_disable.png" alt="" />
@@ -48,7 +46,7 @@ watch(
   border-radius: 8px;
   bottom: 0px;
   box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
-  margin: 12px;
+  margin: 12px 104px;
 }
 
 .dialogue-conversation-bottom-sendbox {
@@ -140,10 +138,6 @@ watch(
         top: 0;
         background-color: transparent;
       }
-
-      img:hover {
-        filter: invert(50%) sepia(66%) saturate(446%) hue-rotate(182deg) brightness(100%) contrast(103%);
-      }
     }
   }
 
diff --git a/src/views/styles/workFlowArrange.scss b/src/views/styles/workFlowArrange.scss
index a1cf5b3..de09ad9 100644
--- a/src/views/styles/workFlowArrange.scss
+++ b/src/views/styles/workFlowArrange.scss
@@ -309,6 +309,9 @@
             color: #6395fd;
           }
         }
+        .notAllow {
+          cursor: not-allowed;
+        }
       }
       .desc {
         font-size: 12px;
-- 
Gitee