From 1c180d70f0445fa804b40df106e1fdbb50508c55 Mon Sep 17 00:00:00 2001 From: yinbangzhong <zhongbangyin@126.com> Date: 星期一, 02 九月 2024 09:22:33 +0800 Subject: [PATCH] 单文档 --- src/views/sessionManager/index.vue | 376 +++++++++++++++++++++++++++++++++++++++++----------- 1 files changed, 293 insertions(+), 83 deletions(-) diff --git a/src/views/sessionManager/index.vue b/src/views/sessionManager/index.vue index a46713c..a7332b5 100644 --- a/src/views/sessionManager/index.vue +++ b/src/views/sessionManager/index.vue @@ -78,9 +78,38 @@ /> </template> <template #content> - <div :class="{ chartUserText: theme === 'light' }" - >{{ sessionDetail.content }} + <div :class="{ chartUserText: theme === 'light' }"> + {{ sessionDetail.content }} + <!-- <a-input + :style="{ width: '100%' }" + v-model="sessionDetail.content" + v-if="isEdit" + /> + + <div v-else> + {{ sessionDetail.content }} + </div> --> </div> + <!-- <div v-if="!isEdit"> + <span + class="action" + v-if="index != 0" + @click="copy(sessionDetail.content)" + > + <icon-copy /> 澶嶅埗 + </span> + <span class="action" @click="edit()"> + <icon-pen /> 缂栬緫 + </span> + </div> + <a-space v-else> + <a-button type="outline" size="mini" @click="cancelEdit(1)" + >鍙栨秷</a-button + > + <a-button type="primary" size="mini" @click="cancelEdit(2)" + >纭畾</a-button + > + </a-space> --> </template> </a-comment> <a-comment v-else-if="sessionDetail.role === 'assistant'"> @@ -99,81 +128,82 @@ backgroundColor: theme === 'light' ? '#ffffff' : '#000000', }" - style="border: none;" - v-for="(breakContent, breakIndex) in breakLine(sessionDetail.content)" + style="border: none" + v-for="(breakContent, breakIndex) in breakLine( + sessionDetail.content + )" > <div :class="{ chatItemAnswer: theme === 'light' }" :style="{ - backgroundColor: - theme === 'light' ? '#ffffff' : '#000000', - }" - style="border: none;" - v-if="isExistTip(breakContent)"> + backgroundColor: + theme === 'light' ? '#ffffff' : '#000000', + }" + style="border: none" + v-if="isExistTip(breakContent)" + > <div :class="{ chatItemAnswer: theme === 'light' }" :style="{ - backgroundColor: - theme === 'light' ? '#ffffff' : '#000000', - }" - style="border: none;" + backgroundColor: + theme === 'light' ? '#ffffff' : '#000000', + }" + style="border: none" v-for="(item, tipIndex) in tipMatch(breakContent)" > - <span v-if="tipIndex == 0"> - {{ breakContent.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-if ="tipIndex == item.len - 1"> - {{ + <span v-if="tipIndex == 0"> + {{ breakContent.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-if="tipIndex == item.len - 1"> + {{ breakContent.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> - {{ - breakContent.substring(item.index+5) - }} - </span> + <a-tooltip + background-color="#3491FA" + :content=" + getTipContent(messagenList.reference, index) + " + > + <img + style="width: 20px; height: 20px" + :src="tipImage" + /> + </a-tooltip> + {{ breakContent.substring(item.index + 5) }} + </span> <span v-else> - {{ + {{ breakContent.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> + <a-tooltip + background-color="#3491FA" + :content=" + getTipContent(messagenList.reference, index) + " + > + <img + style="width: 20px; height: 20px" + :src="tipImage" + /> + </a-tooltip> + </span> </div> </div> <div v-else> @@ -185,16 +215,28 @@ <a-textarea readonly auto-size - v-model="sessionDetail.content" + :default-value="chartText(sessionDetail.content)" :class="{ chatItemAnswer: theme === 'light' }" :style="{ - backgroundColor: - theme === 'light' ? '#ffffff' : '#000000', - }" + backgroundColor: + theme === 'light' ? '#ffffff' : '#000000', + }" style="border: none" > </a-textarea> </a-card> + <!-- <div class="prompt"> + <ul> + <li class="prompt-item" @click="copyText('43234')"> + <span> + 344343klsdjkjksdjkjksdjk灏卞紑濮嬪ぇ瀹剁湅鏁版嵁搴撶櫥璁板崱鍙楁墦鍑诲嚡鎾掔櫥璁板崱鍙楁墦鍑诲嚡鎾掔櫥璁板崱鍙楁墦鍑诲嚡鎾掔殑43</span + > + <span style="margin-left: 20px"> + <icon-right /> + </span> + </li> + </ul> + </div> --> </template> <!-- <div>{{ sessionDetail.role === 'assistant' }}</div> --> <template #actions> @@ -237,6 +279,7 @@ > <icon-refresh /> 閲嶆柊鐢熸垚 </span> + <!-- <span class="action"><icon-to-bottom />涓嬭浇 </span> --> </template> </a-comment> <a-comment v-else-if="sessionDetail.role === 'last'"> @@ -248,18 +291,20 @@ /> </template> <template #content> - <a-textarea - readonly - auto-size - v-model="displayedText" - :class="{ chatItemAnswer: theme === 'light' }" - :style="{ - backgroundColor: - theme === 'light' ? '#ffffff' : '#000000', - }" - style="border: none" - > - </a-textarea> + <a-spin :loading="chartLoading" dot style="width: 100%"> + <a-textarea + readonly + auto-size + v-model="displayedText" + :class="{ chatItemAnswer: theme === 'light' }" + :style="{ + backgroundColor: + theme === 'light' ? '#ffffff' : '#000000', + }" + style="border: none" + > + </a-textarea> + </a-spin> </template> <template #actions> @@ -330,12 +375,20 @@ display: flex; justify-content: space-between; " + class="uploadFileDis" > <updataFile ref="fileInput" :sessionId="activeSessionId" @selectFileCallback="selectFileCallback" ></updataFile> + <!-- <uploadFile + ref="fileInput" + :handleRemove="handleRemove" + :typeXLse="false" + @selectFileCallback="selectFileCallback" + ></uploadFile> --> + <a-button :disabled="chatDis" @click="sentClick" @@ -423,6 +476,11 @@ ></smartAi> </div> </a-col> + <a-col :span="23" v-show="agentType == '5'"> + <div class="center"> + <seniorAgentSession :modalObj="agentObj"></seniorAgentSession> + </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>--> @@ -476,9 +534,11 @@ import chatMenu from '@/views/sessionManager/components/chatMenu.vue'; import AddSession from '@/views/sessionManager/components/addSession.vue'; import agentSession from '@/views/sessionManager/components/agentSession.vue'; + import seniorAgentSession from '@/views/sessionManager/components/seniorAgentSession.vue'; import historySession from '@/views/sessionManager/components/historySession.vue'; import smartAi from '@/views/sessionManager/components/smartAi.vue'; import updataFile from '@/views/sessionManager/components/updataFile.vue'; + import EventBus from '@/utils/EventBus'; import { addSessionApi, @@ -487,6 +547,9 @@ getSessionDetailsApi, sessionListApi, uploadWithoutKb, + uploadAndParse, + chatInfos, + chatRm, } from '@/api/session'; import { getAuthorization } from '@/utils/auth'; import { queryCanvasList } from '@/api/Agent'; @@ -502,7 +565,8 @@ 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'; - import { is } from "immutable"; + import { is } from 'immutable'; + import uploadFile from './components/uploadFile.vue'; // const url = ref('../../assets/session/PDF.png'); @@ -517,6 +581,7 @@ const modalObj = reactive({ add: false }); const dialogId = ref(''); const chatDis = ref(false); + const chartLoading = ref(false); const loading = ref(false); const agentType = ref('1'); const agentTitle = ref('鏈懡鍚嶄細璇�'); @@ -543,7 +608,7 @@ const uploadRef = ref(); const files = ref([]); const file = ref(''); - const fileInput = ref(null); + const fileInput = ref(); const chatDataMeg = reactive({}); const visible = ref(false); const fileVisible = ref(false); @@ -589,17 +654,29 @@ const breakLine = (message: string): string[] => { //鎸塡n鍒嗗壊瀛楃涓� let arr = message.split('\n'); - return arr - } + return arr; + }; + + const chartText = (message: string): string => { + //鍘婚櫎鎵�鏈夌殑#鍜�** + let arr = message.replace(/\*\*|\#\#\#/g, ''); + return arr; + }; const tipMatch = (msg: string): any[] => { //match session.content涓殑##[0-9]$$鐨勭储寮� + let indexs: any[] = []; let preTip = 0; - let matches=msg.match(/##([0-9]+)\$\$/g) + let matches = msg.match(/##([0-9]+)\$\$/g); matches?.map((item) => { let i = msg.indexOf(item); - indexs.push({ index: i, item: item, preIndex: preTip, len: matches.length }); + indexs.push({ + index: i, + item: item, + preIndex: preTip, + len: matches.length, + }); preTip = i; }); return indexs; @@ -696,9 +773,76 @@ // formRef.value.resetFields(); }; - const selectFileCallback = (data) => { - console.log(data, 'selectFileCallback'); + const selectFileCallback = (data,conversation_id) => { uploaditemList.value = [...uploaditemList.value, ...data]; + activeSessionId.value = conversation_id; + }; + + //涓婁紶 + // const selectFileCallback = async (resData, file) => { + // console.log(111); + // try { + // const formData = new FormData(); + // uploaditemList.value = resData; + // uploaditemList.value.map((item) => { + // if (item.name == file[0].file.name) { + // item.onFileSelectedLoading = true; + // item.textName = '涓婁紶涓�'; + // } + // return item; + // }); + // debugger; + // if (!activeSessionId.value) { + // await createSession(resData); + // } + + // // onFileSelectedLoading.value = true; + // // textName.value = '涓婁紶涓�'; + + // formData.append('files', file[0].file); + // formData.append('conversation_id', activeSessionId.value); + + // console.log(formData, 'formData'); + // const { data, code } = await uploadAndParse(formData); + // if (code === 200) { + // uploaditemList.value.map((item: any) => { + // item.onFileSelectedLoading = false; + // item.textName = '涓婁紶鎴愬姛'; + // return item; + // }); + // getInfo(data); + // // onFileSelectedLoading.value = false; + // // textName.value = '涓婁紶鎴愬姛'; + // } + // } catch (err) { + // uploaditemList.value.map((item: any) => { + // item.onFileSelectedLoading = false; + // item.textName = '涓婁紶澶辫触'; + // return item; + // }); + // // onFileSelectedLoading.value = false; + // // textName.value = '涓婁紶澶辫触'; + // Message.error('涓婁紶澶辫触'); + // } + // }; + + //涓婁紶鎴愬姛瑙f瀽getinfo + const getInfo = async (id) => { + const { code, data } = await chatInfos({ + doc_ids: activeSessionId.value, + }); + if (code === 200) { + uploaditemList.value = data; + } + }; + //鍒犻櫎涓婁紶鏂囨。 + const deleteUpload = async (id) => { + const { code, data } = await chatRm({ + doc_id: id, + }); + if (code === 200) { + getInfo(); + } }; let onFileSelectedLoading = ref(false); @@ -706,11 +850,25 @@ const deleteFile = (item) => { console.log(uploaditemList.value); uploaditemList.value.splice(item.index, 1); + // EventBus.emit('queryAgent', item); }; const { toClipboard } = useClipboard(); const copy = async (text) => { await toClipboard(text); //鍙傛暟涓鸿澶嶅埗鐨勬枃鏈� + }; + + const isEdit = ref(false); + const edit = () => { + isEdit.value = !isEdit.value; + }; + const cancelEdit = (val) => { + if (val == 1) { + isEdit.value = !isEdit.value; + } else { + //缂栬緫淇濆瓨 + isEdit.value = !isEdit.value; + } }; const DialogList = async () => { @@ -762,7 +920,7 @@ console.log(name, '鏂板缓浼氳瘽鍚嶇О'); const res = await addSessionApi({ - dialog_id: id, + dialog_id: '', conversation_desc: name, }); // console.log(res, "res"); @@ -843,6 +1001,7 @@ const startChat = async (valMsg) => { chatDis.value = true; loading.value = true; + chartLoading.value = true; toStop = false; sessionDetailList.value.push({ content: valMsg, @@ -886,6 +1045,7 @@ if (typeof d !== 'boolean') { // console.info("data:", d); streamStr.value = d.content; + chartLoading.value = false; startDisplayStr(); } } catch (e) { @@ -894,6 +1054,7 @@ if (done) { console.info('done'); displayedText.value = ''; + chartLoading.value = false; if (isStopChat.value) { setChatDataMeg(chatDataMeg); } else { @@ -1036,9 +1197,10 @@ activeSessionId.value = ''; }); onMounted(() => { + document.getElementsByTagName; let container = document.getElementById('container'); container.addEventListener('click', () => { - fileInput.value.cancel(); + // fileInput.value.cancel(); }); EventBus.on('newChat', () => { agentType.value = '1'; @@ -1141,6 +1303,33 @@ font-size: 12px; padding-left: 10px; } + } + } + } + // .uploadFileDis { + // :deep(.arco-upload-list-type-text) { + // display: none; + // } + // } + .prompt { + ul { + margin: 0; + padding: 0; + display: flex; + } + ul > li { + list-style-type: none; + } + .prompt-item { + display: flex; + justify-content: space-between; + background-color: #fff; + cursor: pointer; + border-radius: 8px; + padding: 10px; + border: #e5e5e5; + &:hover { + background-color: #eee; } } } @@ -1277,6 +1466,11 @@ } } } + .uploadFileDis { + :deep(.arco-upload-list-type-text) { + display: none; + } + } .chat-item { padding: 10px 0; @@ -1286,6 +1480,19 @@ font-size: 14px; color: #333; margin-top: 4px; + } + :deep(.arco-card-body) { + padding: 0; + border-radius: 10px; + } + :deep(.arco-textarea) { + padding-top: 10px !important; + } + :deep(.arco-comment-inner-content) { + border-radius: 10px; + } + :deep(.arco-card-bordered) { + border-radius: 10px; } .icon-user-jpg { @@ -1305,6 +1512,9 @@ margin-left: 10px; } } + :deep(.arco-spin-loading .arco-spin-mask-icon) { + left: 10%; + } } .right { -- Gitblit v1.8.0