perf: 优化对话页面

perf: 优化对话页面

ui/src/components/ai-chat/OperationButton.vue

@@ -1,4 +1,9 @@
 <template>
+  <div>
+    <el-text type="info">
+      <span class="ml-4">{{ datetimeFormat(data.create_time) }}</span>
+    </el-text>
+  </div>
   <div>
     <el-tooltip effect="dark" content="重新生成" placement="top">
       <el-button text @click="regeneration">
@@ -59,6 +64,7 @@
 import { ref } from 'vue'
 import { copyClick } from '@/utils/clipboard'
 import applicationApi from '@/api/application'
+import { datetimeFormat } from '@/utils/time'
 const props = defineProps({
   data: {
     type: Object,

ui/src/components/ai-chat/ParagraphSourceDialog.vue

@@ -33,7 +33,7 @@
                   </template>
                   <div class="active-button primary">{{ item.similarity?.toFixed(3) }}</div>
                   <template #description>
-                    <el-scrollbar height="90">
+                    <el-scrollbar height="150">
                       <MdPreview
                         ref="editorRef"
                         editorId="preview-only"
@@ -110,6 +110,9 @@ defineExpose({ open })
   .paragraph-source-height {
     height: calc(100vh - 260px);
   }
+  .paragraph-source-card {
+    height: 260px;
+  }
 }
 @media only screen and (max-width: 768px) {
   .paragraph-source {
@@ -118,7 +121,7 @@ defineExpose({ open })
       display: block;
     }
     .paragraph-source-card {
-      height: 225px;
+      height: 285px;
     }
   }
 }

ui/src/components/ai-chat/index.vue

@@ -75,7 +75,7 @@
                 <MdRenderer :source="item.answer_text"></MdRenderer>
                 <div v-if="showSource(item)">
                   <el-divider> <el-text type="info">知识来源</el-text> </el-divider>
-                  <div class="mb-8">
+                  <div>
                     <el-space wrap>
                       <el-button
                         v-for="(dataset, index) in item.dataset_list"
@@ -91,7 +91,7 @@
 
                   <div>
                     <el-button
-                      class="mr-8"
+                      class="mr-8 mt-8"
                       type="primary"
                       plain
                       size="small"
@@ -99,10 +99,10 @@
                       :disabled="!item.paragraph_list || item.paragraph_list?.length === 0"
                       >引用分段：{{ item.paragraph_list?.length || 0 }}</el-button
                     >
-                    <el-tag type="info" effect="plain">
+                    <el-tag type="info" effect="plain" class="mr-8 mt-8">
                       消耗 tokens: {{ item?.message_tokens + item?.answer_tokens }}
                     </el-tag>
-                    <el-tag class="ml-8" type="info" effect="plain">
+                    <el-tag type="info" effect="plain" class="mt-8">
                       耗时: {{ item.run_time?.toFixed(2) }} s
                     </el-tag>
                   </div>
@@ -125,8 +125,8 @@
                     >停止回答</el-button
                   >
                 </div>
-
+              </div>
-                <div v-if="item.write_ed && props.appId">
+              <div v-if="item.write_ed && props.appId" class="flex-between">
                 <OperationButton
                   :data="item"
                   :applicationId="appId"
@@ -136,7 +136,6 @@
               </div>
             </div>
           </div>
-          </div>
         </template>
       </div>
     </el-scrollbar>

ui/src/views/chat/pc/index.vue

@@ -41,13 +41,16 @@
       </div>
       <div class="chat-pc__right">
         <div class="right-header border-b mb-24 p-16-24 flex-between">
-          <h4>{{ currentChatName }}</h4>
+          <h4 class="ellipsis-1" style="width: 70%">
+            {{ currentChatName }}
+          </h4>
+
           <span v-if="currentRecordList.length" class="flex align-center">
             <AppIcon iconName="app-chat-record" class="info mr-8" style="font-size: 16px"></AppIcon>
             <span class="lighter"> {{ paginationConfig.total }} 条提问 </span>
           </span>
         </div>
-        <div class="right-height">
+        <div class="right-height chat-width">
           <!-- 对话 -->
           <AiChat
             ref="AiChatRef"