From a4ca216c5b215f323b3c439b2f445dad72bbfce1 Mon Sep 17 00:00:00 2001 From: zhangxiao <898441624@qq.com> Date: 星期一, 26 八月 2024 16:44:31 +0800 Subject: [PATCH] fix: 修改bug --- src/views/sessionManager/index.vue | 295 ++++++++++++++++++++++++++++++++++++++++++----------------- 1 files changed, 210 insertions(+), 85 deletions(-) diff --git a/src/views/sessionManager/index.vue b/src/views/sessionManager/index.vue index b8c8822..d140f21 100644 --- a/src/views/sessionManager/index.vue +++ b/src/views/sessionManager/index.vue @@ -23,14 +23,16 @@ <!-- <span class="title">{{ agentTitle }}</span>--> <a-popover position="bottom" trigger="click"> - <a-button border + <a-button border> + <span + style=" + width: 100px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + " + >{{ from.name }}</span > - <span style=" - width: 100px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - ">{{ from.name }}</span> <icon-down style="margin-left: 4px" /> </a-button> <template #content> @@ -55,13 +57,12 @@ ref="scrollbar" id="home" class="chat-list" - style=" - width: 80%; - overflow: auto; - margin: 0px auto 20px; - " + style="width: 80%; overflow: auto; margin: 0px auto 20px" :style="{ - height:uploaditemList.length > 0 ? 'calc(100vh - 480px)' : 'calc(100vh - 380px)' + height: + uploaditemList.length > 0 + ? 'calc(100vh - 480px)' + : 'calc(100vh - 380px)', }" > <div @@ -86,30 +87,68 @@ <template #avatar> <img class="icon-user-jpg" - src="../../assets/images/icon-chart.png" + src="../../assets/images/icon-picture.png" alt="鏈湴鍥剧墖" /> </template> <template #content> - <!-- <a-card :class="{ chatItemAnswer: theme === 'light' }">--> - <!-- <div--> - <!-- :class="{ light: theme === 'light' }"--> - <!-- v-html="sessionDetail.content.replace(/\n/g, '<br/>')"--> - <!-- >--> - <!-- </div>--> - <!-- </a-card>--> - <a-textarea - readonly - auto-size - v-model="sessionDetail.content" - :class="{ chatItemAnswer: theme === 'light' }" - :style="{ - backgroundColor: - theme === 'light' ? '#ffffff' : '#000000', - }" - style="border: none" - > - </a-textarea> + <a-card v-if="isExistTip(sessionDetail.content)"> + <div + :class="{ chatItemAnswer: theme === 'light' }" + :style="{ + backgroundColor: + theme === 'light' ? '#ffffff' : '#000000', + }" + style="border: none; display: inline" + v-for="(item, tipIndex) in tipMatch(sessionDetail)" + > + <span v-if="tipIndex == 0"> + {{ sessionDetail.content.substring(0, item.index) }} + <a-tooltip + background-color="#3491FA" + :content=" + getTipContent(messagenList.reference, index) + " + > + <img + style="width: 20px; height: 20px" + :src="tipImage" + /> + </a-tooltip> + </span> + <span v-else> + {{ + sessionDetail.content.substring( + item.preIndex + item.item.length, + item.index + ) + }} + <a-tooltip + background-color="#3491FA" + :content=" + getTipContent(messagenList.reference, index) + " + > + <img + style="width: 20px; height: 20px" + :src="tipImage" + /> + </a-tooltip> + </span> + </div> + </a-card> + <a-card v-else> + <div + :class="{ chatItemAnswer: theme === 'light' }" + :style="{ + backgroundColor: + theme === 'light' ? '#ffffff' : '#000000', + }" + style="border: none" + > + {{ sessionDetail.content }} + </div> + </a-card> </template> <!-- <div>{{ sessionDetail.role === 'assistant' }}</div> --> <template #actions> @@ -158,7 +197,7 @@ <template #avatar> <img class="icon-user-jpg" - src="../../assets/images/icon-chart.png" + src="../../assets/images/icon-picture.png" alt="鏈湴鍥剧墖" /> </template> @@ -221,7 +260,11 @@ v-model="inputMsg" @keydown.shift.enter="handleShiftEnter" @keydown.enter="sendMessage" - :placeholder="uploaditemList.length>0?'鏁寸悊杩欎簺鏂囦欢鐨勬牳蹇冨唴瀹�':'杈撳叆鎮ㄦ兂浜嗚В鐨勫唴瀹癸紝Shift+Enter鎹㈣锛孍nter鍙戦��'" + :placeholder=" + uploaditemList.length > 0 + ? '鏁寸悊杩欎簺鏂囦欢鐨勬牳蹇冨唴瀹�' + : '杈撳叆鎮ㄦ兂浜嗚В鐨勫唴瀹癸紝Shift+Enter鎹㈣锛孍nter鍙戦��' + " allow-clear show-word-limit :disabled="chatDis" @@ -235,8 +278,18 @@ maxRows: 5, }" /> - <div style="width: 100%;display: flex;justify-content: space-between"> - <updataFile ref="fileInput" :sessionId="activeSessionId" @selectFileCallback="selectFileCallback"></updataFile> + <div + style=" + width: 100%; + display: flex; + justify-content: space-between; + " + > + <updataFile + ref="fileInput" + :sessionId="activeSessionId" + @selectFileCallback="selectFileCallback" + ></updataFile> <a-button :disabled="chatDis" @click="sentClick" @@ -253,7 +306,12 @@ class="files" v-for="(item, index) in uploaditemList" :key="index" - style="position: relative; width: 200px; margin-top: 10px;margin-right: 20px" + style=" + position: relative; + width: 200px; + margin-top: 10px; + margin-right: 20px; + " > <a-comment :author="item.name" @@ -275,10 +333,10 @@ </template> </a-spin> <!-- <a-button type="text" :loading="onFileSelectedLoading" v-if="onFileSelectedLoading"></a-button>--> -<!-- <a-avatar v-if="!onFileSelectedLoading">--> -<!-- <icon-file style="color: #0960bd" />--> -<!-- </a-avatar>--> - <img :src="getIconByExtension(item.name)" alt="" /> + <!-- <a-avatar v-if="!onFileSelectedLoading">--> + <!-- <icon-file style="color: #0960bd" />--> + <!-- </a-avatar>--> + <img :src="getIconByExtension(item.name)" alt="" /> </template> </a-comment> <icon-close-circle-fill @@ -320,6 +378,12 @@ </div> </a-col> </a-row> + <a-modal title=" " v-model:visible="fileVisible" :footer="false" fullscreen> + <!-- <docx previewSrc="http://192.168.20.116:1080/v1/document/get/405c3efa4d8c11ef97560242ac120006"></docx>--> + <docx v-if="documenttype == 'docx'" :previewSrc="previewSrc"></docx> + <excel v-if="documenttype == 'excel'" :previewSrc="previewSrc"></excel> + <txtPdf v-if="documenttype == 'txtPdf'" :previewSrc="previewSrc"></txtPdf> + </a-modal> <a-modal v-model:visible="visible" title="淇敼鍚嶇О" @@ -328,12 +392,7 @@ :footer="false" title-align="start" > - <a-form - ref="formRef" - :rules="rules" - :model="from" - @submit="handleSubmit" - > + <a-form ref="formRef" :rules="rules" :model="from" @submit="handleSubmit"> <a-form-item field="name" label="鍚嶇О"> <a-input v-model="from.name" placeholder="璇疯緭鍏ュ悕绉�" /> </a-form-item> @@ -353,7 +412,7 @@ </div> </template> <script setup lang="ts"> - import { useAppStore, useUserStore } from '@/store'; + import { useAppStore, userModelState, useUserStore } from '@/store'; import { computed, nextTick, @@ -392,10 +451,20 @@ import pdfImg3 from '@/assets/session/execl.png'; import pdfImg4 from '@/assets/session/icon-txt.png'; import pdfImg5 from '@/assets/session/txt.png'; + import tipImage from '@/assets/session/tip.png'; + + import docx from '@/views/dmx/knowledgeLib/components/docx.vue'; + import excel from '@/views/dmx/knowledgeLib/components/excel.vue'; + import txtPdf from '@/views/dmx/knowledgeLib/components/txtPdf.vue'; // const url = ref('../../assets/session/PDF.png'); - const sessionDetailList = ref([]); //鏍规嵁浼氳瘽id鍑烘潵鐨勪細璇濊鎯� + const sessionDetailList = ref([ + { + content: '浣犲ソ锛� 鎴戞槸浣犵殑鍔╃悊锛屾湁浠�涔堝彲浠ュ府鍒颁綘鐨勫悧锛�', + role: 'assistant', + }, + ]); //鏍规嵁浼氳瘽id鍑烘潵鐨勪細璇濊鎯� const messagenList = ref({}); const sessionList = ref([]); //浼氳瘽鍒楄〃 const modalObj = reactive({ add: false }); @@ -406,7 +475,7 @@ const agentTitle = ref('鏈懡鍚嶄細璇�'); let chatObj = reactive({}); let from = reactive({ - name:'鏈懡鍚嶄細璇�', + name: '鏈懡鍚嶄細璇�', }); const isStopChat = ref(false); const currIndex = ref(0); @@ -430,7 +499,13 @@ const fileInput = ref(null); const chatDataMeg = reactive({}); const visible = ref(false); + const fileVisible = ref(false); let toStop = false; + let documenttype = ref('docx'); + let previewSrc = ref(''); + + const modelStore = userModelState(); + const httpUrl = modelStore.hrefUrl; const rules = { name: [ @@ -456,8 +531,28 @@ } }; let dataItem = []; - const getTxt = (data, role, message, index) => { + const isExistTip = (message: string): boolean => { if (/##[0-9]\$\$/.test(message)) { + return true; + } else { + return false; + } + }; + + const tipMatch = (session: any): any[] => { + //match session.content涓殑##[0-9]$$鐨勭储寮� + let indexs: any[] = []; + let preTip = 0; + session.content.match(/##([0-9]+)\$\$/g)?.map((item) => { + let i = session.content.indexOf(item); + indexs.push({ index: i, item: item, preIndex: preTip }); + preTip = i; + }); + return indexs; + }; + + const getTxt = (data, role, message, index) => { + if (isExistTip(message)) { if (role == 'assistant' && index) { let i = index / 2 - 1 > 0 ? index / 2 - 1 : 0; dataItem = data[i].doc_aggs; @@ -469,20 +564,30 @@ return dataItem; }; - const clickHref = (item) => { - // return Message.warning('鏆傛棤娉曟煡鐪�'); - // window.open(`/api/v1/document/get/${item.doc_id}`, '_blank'); - downloadFile({ - url: `/api/v1/document/get/${item.doc_id}`, - filename: item.doc_name, + const getTipContent = (data, index): string => { + let maxSimilarityContent = ''; + let i = index / 2 - 1 > 0 ? index / 2 - 1 : 0; + let maxSimilarity = 0; + data[i].chunks.forEach((chunk) => { + if (chunk.similarity > maxSimilarity) { + maxSimilarity = chunk.similarity; + maxSimilarityContent = chunk.content_with_weight; + } }); + return maxSimilarityContent; }; - const downloadFile = ({ - url, - filename, - target, - }: { + const clickHref = async (item) => { + documenttype.value = item.doc_name.split('.').pop(); + previewSrc.value = httpUrl + `/api/v1/document/get/${item.doc_id}`; + fileVisible.value = true; + }; + + const downloadFile = ({ + url, + filename, + target, + }: { url: string; filename?: string; target?: string; @@ -539,22 +644,20 @@ const selectFileCallback = (data) => { console.log(data, 'selectFileCallback'); - uploaditemList.value = data; + uploaditemList.value = [...uploaditemList.value, ...data]; }; let onFileSelectedLoading = ref(false); const deleteFile = (item) => { console.log(uploaditemList.value); - uploaditemList.value.splice(item.index,1); + uploaditemList.value.splice(item.index, 1); }; const { toClipboard } = useClipboard(); const copy = async (text) => { await toClipboard(text); //鍙傛暟涓鸿澶嶅埗鐨勬枃鏈� }; - - const DialogList = async () => { const { code, data } = await getDialogListApi(); @@ -642,21 +745,39 @@ event.preventDefault(); // 闃绘榛樿琛屼负锛屽嵆涓嶆崲琛� } - // if (!activeSessionId.value) { - // Message.warning("璇烽�夋嫨浼氳瘽"); - // chatDis.value = false; - // loading.value = false; - // return; - // } - // if (displayedText.value) { // querySessionList(); // } if (inputMsg.value) { - startChat(inputMsg.value); - - inputMsg.value = ''; + if (!activeSessionId.value) { + //鏂板缓浼氳瘽 + // 濡傛灉鏈変細璇漣d + console.log(inputMsg.value, '鏂板缓浼氳瘽鍚嶇О'); + const res = await addSessionApi({ + dialog_id: '', + conversation_desc: inputMsg.value, + }); + // console.log(res, "res"); + if (res.code == 200) { + // console.log(res.data.conversation_id); + activeSessionId.value = res.data?.conversation_id; + const { code, data } = await getSessionDetailsApi( + res.data?.conversation_id + ); + if (code === 200) { + console.log(data, '鏂板缓浼氳瘽璇︽儏'); + Object.assign(chatObj, data); + startChat(inputMsg.value); + inputMsg.value = ''; + } + } else { + Message.error('鍒涘缓浼氳瘽澶辫触锛岃閲嶈瘯'); + } + } else { + startChat(inputMsg.value); + inputMsg.value = ''; + } } else { Message.warning('娑堟伅涓嶈兘涓虹┖'); } @@ -762,7 +883,6 @@ sessionDetailList.value = sessionDetailList.value .splice(0, sessionDetailList.value.length - 2) .concat(lastArr); - console.log(sessionDetailList.value, 'sessionDetailList2'); console.log(chatObj, 'chatObj瀵硅薄'); chatObj.message = chatObj.message.concat(lastArr); @@ -858,19 +978,24 @@ querySessionList(); }; onBeforeMount(() => { - // DialogList(); - //鏂板缓浼氳瘽 - createSession(''); + activeSessionId.value = ''; }); onMounted(() => { let container = document.getElementById('container'); container.addEventListener('click', () => { fileInput.value.cancel(); - - }) + }); EventBus.on('newChat', () => { agentType.value = '1'; - createSession(''); + // createSession(''); + activeSessionId.value = ''; + sessionDetailList.value = [ + { + content: '浣犲ソ锛� 鎴戞槸浣犵殑鍔╃悊锛屾湁浠�涔堝彲浠ュ府鍒颁綘鐨勫悧锛�', + role: 'assistant', + }, + ]; + from.name = '鏈懡鍚嶄細璇�'; }); }); onBeforeUnmount(() => { @@ -1229,7 +1354,7 @@ :deep(.arco-upload-list-item-operation) { //display: none; } - .uploadFileList{ + .uploadFileList { width: 100%; max-height: 140px; overflow-y: auto; -- Gitblit v1.8.0