[feat][ai聊天][语音识别]

src/views/xjc-integratedmachine/common/ai/chat.vue

@@ -13,7 +13,7 @@
             </div>
         </div>
         <div class="main-content">
-            <div class="chat-container" ref="chatContainerRef">
+            <div v-loading="loadingHistoryRecord" class="chat-container" ref="chatContainerRef">
                 <div class="message-list">
                     <div v-for="(item, index) in chatRecordList" :key="item.id">
                         <div v-if="item.isUser == 1" class="user-message">
@@ -22,17 +22,23 @@
                         </div>
                         <div v-else class="bot-message">
                             <img src="@/assets/images/common/ai/system.png" alt="icon" style="margin-left: 4px"/>
-                            <div v-show="!expandIndexList.includes(index)" class="bot-message-content" style="margin-left: 4px" v-html="item.content.substring(0, 80)"></div>
-                            <div v-show="expandIndexList.includes(index)" class="bot-message-content" style="margin-left: 4px" v-html="item.content"></div>
+                            <div>
+                                <div v-show="!expandIndexList.includes(index)" class="bot-message-content" style="margin-left: 4px" v-html="item.content.substring(0, 80)"></div>
+                                <div v-show="expandIndexList.includes(index)" class="bot-message-content" style="margin-left: 4px" v-html="item.content"></div>
+                                <div style="margin: 4px">
+                                    <el-text>{{item.createTime}}</el-text>
+                                </div>
+                            </div>
+
                             <el-button v-if="item.content.length>80" style="margin-left: 4px" @click="foldOrExpandMessage(index, expandIndexList.includes(index))">{{expandIndexList.includes(index)?'折叠':'展开'}}</el-button>
                             <el-button>播放</el-button>
                         </div>
                     </div>
                     <div class="bot-message" v-if="streamHtmlData">
                         <img src="@/assets/images/common/ai/system.png" alt="icon"/>
-                        <div>
-                            <div class="bot-message-content" v-html="streamHtmlData"></div>
-                            <div class="typing">
+                        <div class="bot-message-content">
+                            <div v-html="streamHtmlData"></div>
+                            <div v-if="isLoading" class="typing">
                                 <span class="loading-dots">
                                     <span class="dot"></span>
                                     <span class="dot"></span>
@@ -87,7 +93,7 @@
     import * as RecorderManager from "/public/ai/iat/dist/index.umd.js"
     import * as AudioPlayer from "/public/ai/tts/dist/index.umd.js"
 
-
+    const loadingHistoryRecord = ref(false)
     // 聊天记录
     let chatRecordList = ref([])
     // md流式数据
@@ -112,12 +118,14 @@
     // 查看所有聊天记录
     list();
     function list() {
+        loadingHistoryRecord.value = true
         let queryForm = {
-
+            pageNum: 1,
+            pageSize: 10000
         }
         aiChatRecordList(queryForm).then(resp =>{
-            console.log(resp)
             chatRecordList.value = resp.rows;
+            loadingHistoryRecord.value = false
         })
     }
 
@@ -190,9 +198,10 @@
                 streamMarkdownData.value = 'Error: ' + error.message;
             }
         } finally {
-            streamHtmlData.value = marked(streamMarkdownData.value)
             isLoading.value = false;
-            addRecord(streamHtmlData.value);
+            let htmlData = marked(streamMarkdownData.value);
+            addRecord(htmlData);
+            streamHtmlData.value = htmlData;
         }
     }
 
@@ -597,6 +606,11 @@
         /* align-items: center; */
     }
 
+    .typing {
+        display: flex;
+        justify-content: center;
+    }
+
     .user-message {
         display: flex;
         align-self: flex-end;