From 332cd0a58baa11b005da99c47a014923d9c603cf Mon Sep 17 00:00:00 2001
From: wangdan-fit2cloud <dan.wang@fit2cloud.com>
Date: Tue, 25 Jun 2024 18:24:32 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BC=98=E5=8C=96=E6=89=A7=E8=A1=8C?=
 =?UTF-8?q?=E8=AF=A6=E6=83=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ai-chat/ExecutionDetailDialog.vue         | 130 ++++++++++--------
 ui/src/workflow/common/CustomLine.vue         |  16 +--
 2 files changed, 79 insertions(+), 67 deletions(-)

diff --git a/ui/src/components/ai-chat/ExecutionDetailDialog.vue b/ui/src/components/ai-chat/ExecutionDetailDialog.vue
index d63137bea..715996d81 100644
--- a/ui/src/components/ai-chat/ExecutionDetailDialog.vue
+++ b/ui/src/components/ai-chat/ExecutionDetailDialog.vue
@@ -28,65 +28,72 @@
                 <template v-if="item.type === WorkflowType.Start">
                   <div class="card-never border-r-4">
                     <h5 class="p-8-12">参数输入</h5>
-                    <div class="p-8-12 border-t-dashed lighter">{{ item.question }}</div>
+                    <div class="p-8-12 border-t-dashed lighter">{{ item.question || '-' }}</div>
                   </div>
                 </template>
                 <!-- 知识库检索 -->
                 <template v-if="item.type == WorkflowType.SearchDataset">
                   <div class="card-never border-r-4">
                     <h5 class="p-8-12">检索内容</h5>
-                    <div class="p-8-12 border-t-dashed lighter">{{ item.question }}</div>
+                    <div class="p-8-12 border-t-dashed lighter">{{ item.question || '-' }}</div>
                   </div>
-                  <div class="card-never border-r-4">
+                  <div class="card-never border-r-4 mt-8">
                     <h5 class="p-8-12">检索结果</h5>
                     <div class="p-8-12 border-t-dashed lighter">
-                      <template
-                        v-for="(paragraph, paragraphIndex) in item.paragraph_list"
-                        :key="paragraphIndex"
-                      >
-                        <CardBox
-                          shadow="never"
-                          :title="paragraph.title || '-'"
-                          class="paragraph-source-card cursor mb-8"
-                          :class="paragraph.is_active ? '' : 'disabled'"
-                          :showIcon="false"
+                      <template v-if="item.paragraph_list?.length > 0">
+                        <template
+                          v-for="(paragraph, paragraphIndex) in item.paragraph_list"
+                          :key="paragraphIndex"
                         >
-                          <template #icon>
-                            <AppAvatar class="mr-12 avatar-light" :size="22">
-                              {{ paragraphIndex + 1 + '' }}</AppAvatar
-                            >
-                          </template>
-                          <div class="active-button primary">
-                            {{ paragraph.similarity?.toFixed(3) }}
-                          </div>
-                          <template #description>
-                            <el-scrollbar height="150">
-                              <MdPreview
-                                ref="editorRef"
-                                editorId="preview-only"
-                                :modelValue="paragraph.content"
-                              />
-                            </el-scrollbar>
-                          </template>
-                          <template #footer>
-                            <div class="footer-content flex-between">
-                              <el-text>
-                                <el-icon>
-                                  <Document />
-                                </el-icon>
-                                {{ paragraph?.document_name }}
-                              </el-text>
-                              <div class="flex align-center">
-                                <AppAvatar class="mr-8" shape="square" :size="18">
-                                  <img src="@/assets/icon_document.svg" style="width: 58%" alt="" />
-                                </AppAvatar>
-
-                                <span class="ellipsis"> {{ paragraph?.dataset_name }}</span>
-                              </div>
+                          <CardBox
+                            shadow="never"
+                            :title="paragraph.title || '-'"
+                            class="paragraph-source-card cursor mb-8"
+                            :class="paragraph.is_active ? '' : 'disabled'"
+                            :showIcon="false"
+                          >
+                            <template #icon>
+                              <AppAvatar class="mr-12 avatar-light" :size="22">
+                                {{ paragraphIndex + 1 + '' }}</AppAvatar
+                              >
+                            </template>
+                            <div class="active-button primary">
+                              {{ paragraph.similarity?.toFixed(3) }}
                             </div>
-                          </template>
-                        </CardBox>
+                            <template #description>
+                              <el-scrollbar height="150">
+                                <MdPreview
+                                  ref="editorRef"
+                                  editorId="preview-only"
+                                  :modelValue="paragraph.content"
+                                />
+                              </el-scrollbar>
+                            </template>
+                            <template #footer>
+                              <div class="footer-content flex-between">
+                                <el-text>
+                                  <el-icon>
+                                    <Document />
+                                  </el-icon>
+                                  {{ paragraph?.document_name }}
+                                </el-text>
+                                <div class="flex align-center">
+                                  <AppAvatar class="mr-8" shape="square" :size="18">
+                                    <img
+                                      src="@/assets/icon_document.svg"
+                                      style="width: 58%"
+                                      alt=""
+                                    />
+                                  </AppAvatar>
+
+                                  <span class="ellipsis"> {{ paragraph?.dataset_name }}</span>
+                                </div>
+                              </div>
+                            </template>
+                          </CardBox>
+                        </template>
                       </template>
+                      <template v-else> - </template>
                     </div>
                   </div>
                 </template>
@@ -95,7 +102,7 @@
                   <div class="card-never border-r-4">
                     <h5 class="p-8-12">判断结果</h5>
                     <div class="p-8-12 border-t-dashed lighter">
-                      {{ item.branch_name }}
+                      {{ item.branch_name || '-' }}
                     </div>
                   </div>
                 </template>
@@ -112,29 +119,36 @@
                   <div class="card-never border-r-4 mt-8">
                     <h5 class="p-8-12">历史记录</h5>
                     <div class="p-8-12 border-t-dashed lighter">
-                      <p
-                        class="mt-4 mb-4"
-                        v-for="(history, historyIndex) in item.history_message"
-                        :key="historyIndex"
-                      >
-                        <span class="color-secondary mr-4">{{ history.role }}:</span
-                        ><span>{{ history.content }}</span>
-                      </p>
+                      <template v-if="item.history_message?.length > 0">
+                        <p
+                          class="mt-4 mb-4"
+                          v-for="(history, historyIndex) in item.history_message"
+                          :key="historyIndex"
+                        >
+                          <span class="color-secondary mr-4">{{ history.role }}:</span
+                          ><span>{{ history.content }}</span>
+                        </p>
+                      </template>
+                      <template v-else> - </template>
                     </div>
                   </div>
                   <div class="card-never border-r-4 mt-8">
                     <h5 class="p-8-12">本次对话</h5>
-                    <div class="p-8-12 border-t-dashed lighter pre-line">{{ item.question }}</div>
+                    <div class="p-8-12 border-t-dashed lighter pre-line">
+                      {{ item.question || '-' }}
+                    </div>
                   </div>
                   <div class="card-never border-r-4 mt-8">
                     <h5 class="p-8-12">AI 回答</h5>
                     <div class="p-8-12 border-t-dashed lighter">
                       <MdPreview
+                        v-if="item.answer"
                         ref="editorRef"
                         editorId="preview-only"
                         :modelValue="item.answer"
                         style="background: none"
                       />
+                      <template v-else> - </template>
                     </div>
                   </div>
                 </template>
@@ -146,11 +160,13 @@
                     <div class="p-8-12 border-t-dashed lighter">
                       <el-scrollbar height="150">
                         <MdPreview
+                          v-if="item.answer"
                           ref="editorRef"
                           editorId="preview-only"
                           :modelValue="item.answer"
                           style="background: none"
                         />
+                        <template v-else> - </template>
                       </el-scrollbar>
                     </div>
                   </div>
diff --git a/ui/src/workflow/common/CustomLine.vue b/ui/src/workflow/common/CustomLine.vue
index 6277e7608..79c5cff16 100644
--- a/ui/src/workflow/common/CustomLine.vue
+++ b/ui/src/workflow/common/CustomLine.vue
@@ -1,13 +1,6 @@
 <template>
-  <div class="custom-edge cursor" v-show="props.model.isHovered" @click.stop>
-    <svg
-      @click="deleteEdge"
-      width="100%"
-      height="100%"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-    >
+  <div class="custom-edge cursor" v-if="props.model.isHovered" @click.stop="deleteEdge">
+    <svg width="22" height="22" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
       <path
         d="M12 23.0001C5.925 23.0001 1 18.0751 1 12.0001C1 5.92512 5.925 1.00012 12 1.00012C18.075 1.00012 23 5.92512 23 12.0001C23 18.0751 18.075 23.0001 12 23.0001Z"
         fill="#3370FF"
@@ -30,8 +23,11 @@ const deleteEdge = () => {
 .custom-edge {
   color: var(--el-color-primary);
   stroke: none;
-  width: 22px;
   z-index: 100000;
   position: absolute;
+  pointer-events: all;
+}
+.lf-edge:has(.custom-edge) {
+  // pointer-events: none;
 }
 </style>