From 8ab183fe7d48a4f93ed44f287bb599b1ed9f2e88 Mon Sep 17 00:00:00 2001
From: liudong <liudong>
Date: 星期一, 05 八月 2024 17:56:19 +0800
Subject: [PATCH] 智能体管理的测试助手页面的bug修改
---
src/views/dmx/IntelligentAgent/components/editAgent.vue | 44 ++-----
src/views/dmx/IntelligentAgent/components/sessionAction.vue | 253 ++++++++++++++++++++++++++++++++++++++++++
.idea/codeStyles/Project.xml | 4
3 files changed, 269 insertions(+), 32 deletions(-)
diff --git a/.idea/codeStyles/Project.xml b/.idea/codeStyles/Project.xml
index 70dac63..3e22f4b 100644
--- a/.idea/codeStyles/Project.xml
+++ b/.idea/codeStyles/Project.xml
@@ -3,7 +3,7 @@
<HTMLCodeStyleSettings>
<option name="HTML_SPACE_INSIDE_EMPTY_TAG" value="true" />
</HTMLCodeStyleSettings>
- <JSCodeStyleSettings>
+ <JSCodeStyleSettings version="0">
<option name="FORCE_SEMICOLON_STYLE" value="true" />
<option name="SPACE_BEFORE_FUNCTION_LEFT_PARENTH" value="false" />
<option name="FORCE_QUOTE_STYlE" value="true" />
@@ -11,7 +11,7 @@
<option name="SPACES_WITHIN_OBJECT_LITERAL_BRACES" value="true" />
<option name="SPACES_WITHIN_IMPORTS" value="true" />
</JSCodeStyleSettings>
- <TypeScriptCodeStyleSettings>
+ <TypeScriptCodeStyleSettings version="0">
<option name="FORCE_SEMICOLON_STYLE" value="true" />
<option name="SPACE_BEFORE_FUNCTION_LEFT_PARENTH" value="false" />
<option name="FORCE_QUOTE_STYlE" value="true" />
diff --git a/src/views/dmx/IntelligentAgent/components/editAgent.vue b/src/views/dmx/IntelligentAgent/components/editAgent.vue
index ad78aa7..f10b761 100644
--- a/src/views/dmx/IntelligentAgent/components/editAgent.vue
+++ b/src/views/dmx/IntelligentAgent/components/editAgent.vue
@@ -106,29 +106,7 @@
</div>
</div>
<div class="main-container-rt">
- <div :style="{ height: heightrg }">
- <div style="padding: 10px">
- <a-avatar :style="{ backgroundColor: '#3370ff' }">
- <img
- :style="{ width: '100%' }"
- alt="dessert"
- src="https://p1-arco.byteimg.com/tos-cn-i-uwbnlip3yd/a20012a2d4d5b9db43dfc6a01fe508c0.png~tplv-uwbnlip3yd-webp.webp"
- />
- </a-avatar>
- 璋冭瘯棰勮
- </div>
- <a-divider style="margin: 0; margin-left: 10px" />
-
- <div class="bottom">
- <div class="input">
- <a-input placeholder="杈撳叆鎮ㄦ兂浜嗚В鐨勫唴瀹癸紝鎸塃nter鍙戦��">
- <template #suffix>
- <icon-send style="cursor: pointer" />
- </template> </a-input
- ></div>
- <div class="text">鍐呭鐢盇I鐢熸垚锛屼粎渚涘弬鑰�</div>
- </div>
- </div>
+ <sessionAction></sessionAction>
</div>
</div>
</a-modal>
@@ -142,6 +120,7 @@
import { dialogSet } from '@/api/Agent';
import { Message } from '@arco-design/web-vue';
import EventBus from "@/utils/EventBus";
+ import sessionAction from "@/views/dmx/IntelligentAgent/components/sessionAction.vue";
const { setLoading } = useLoading(true);
const props = defineProps(['typeAngint', 'formData']);
const visible = ref(false);
@@ -190,7 +169,6 @@
const formRef = ref(null);
let tabs = ref([]);
const height = ref('calc(100vh - 150px)');
- const heightrg = ref('calc(100vh - 100px)');
const emit = defineEmits(['cancelModal']);
const rules = {
name: [
@@ -246,8 +224,11 @@
visible.value = true;
nextTick(() => {
Object.assign(form, data);
- console.log(form);
+ console.log(form,'浼犲��');
system.value = form.prompt_config.system;
+ if(tabs.value && tabs.value.length>0){
+ form.kb_ids = [tabs.value[0].id];
+ }
});
};
defineExpose({
@@ -298,11 +279,10 @@
try {
const { data } = await queryKbList(params);
console.log(data, 'data');
- tabs.value = data;
- if(tabs.value && tabs.value.length>0){
- form.kb_ids = [tabs.value[0].id];
- }
- console.log(tabs.value, 'tabs');
+ nextTick(() => {
+ tabs.value = data;
+ console.log(tabs.value, 'tabs');
+ });
} catch (err) {
// you can report use errorHandler or other
} finally {
@@ -345,4 +325,8 @@
line-height: 40px;
}
}
+ :deep(.arco-textarea-wrapper.arco-textarea-disabled){
+ background: var(--color-bg-2);
+ color: var(--color-text-1);
+ }
</style>
diff --git a/src/views/dmx/IntelligentAgent/components/sessionAction.vue b/src/views/dmx/IntelligentAgent/components/sessionAction.vue
new file mode 100644
index 0000000..9db0aac
--- /dev/null
+++ b/src/views/dmx/IntelligentAgent/components/sessionAction.vue
@@ -0,0 +1,253 @@
+<template>
+ <div :style="{ height: heightrg }">
+ <div style="padding: 10px">
+ <a-avatar :style="{ backgroundColor: '#3370ff' }">
+ <img
+ :style="{ width: '100%' }"
+ alt="dessert"
+ src="https://p1-arco.byteimg.com/tos-cn-i-uwbnlip3yd/a20012a2d4d5b9db43dfc6a01fe508c0.png~tplv-uwbnlip3yd-webp.webp"
+ />
+ </a-avatar>
+ 璋冭瘯棰勮
+ </div>
+ <a-divider style="margin: 0; margin-left: 10px" />
+ <a-scrollbar
+ ref="scrollbar"
+ id="home"
+ class="chat-list"
+ style="width: 90%; overflow: auto; height: 70vh; margin: 0px auto"
+ >
+ <div class="chat-item" v-for="sessionDetail in sessionDetailList">
+ <a-comment
+ v-if="sessionDetail.role === 'user'"
+ avatar="https://p1-arco.byteimg.com/tos-cn-i-uwbnlip3yd/3ee5f13fb09879ecb5185e440cef6eb9.png~tplv-uwbnlip3yd-webp.webp"
+ >
+ <template #content>
+ <div :class="{ light: theme === 'light' }">{{
+ sessionDetail.content
+ }}</div>
+ </template>
+ </a-comment>
+ <a-comment
+ v-else-if="sessionDetail.role === 'assistant'"
+ avatar="https://p1-arco.byteimg.com/tos-cn-i-uwbnlip3yd/9eeb1800d9b78349b24682c3518ac4a3.png~tplv-uwbnlip3yd-webp.webp"
+ >
+ <template #content>
+ <a-card
+ class="chat-item-answer"
+ style="background-color: rgba(63, 64, 79, 1)"
+ >
+ <div :class="{ light: theme === 'light' }">{{
+ sessionDetail.content
+ }}</div>
+ </a-card>
+ </template>
+ </a-comment>
+ <a-comment
+ v-else-if="sessionDetail.role === 'last'"
+ avatar="https://p1-arco.byteimg.com/tos-cn-i-uwbnlip3yd/9eeb1800d9b78349b24682c3518ac4a3.png~tplv-uwbnlip3yd-webp.webp"
+ >
+ <template #content>
+ <a-textarea
+ readonly
+ auto-size
+ v-model="displayedText"
+ class="chat-item-answer"
+ style="background-color: rgba(63, 64, 79, 1)"
+ >
+ </a-textarea>
+ </template>
+ </a-comment>
+ </div>
+ </a-scrollbar>
+ <div class="bottom">
+ <div class="input">
+ <a-input
+ v-model="inputMsg"
+ @keydown.enter="sendMessage"
+ placeholder="杈撳叆鎮ㄦ兂浜嗚В鐨勫唴瀹癸紝鎸塃nter鍙戦��"
+ >
+ <template #suffix>
+ <icon-send style="cursor: pointer" @click="sendMessage" />
+ </template> </a-input
+ ></div>
+ <div class="text">鍐呭鐢盇I鐢熸垚锛屼粎渚涘弬鑰�</div>
+ </div>
+ </div>
+</template>
+
+<script setup lang="ts">
+import {
+ IconMoreVertical,
+ IconQuestionCircleFill,
+ IconPoweroff,
+ IconCommon,
+ IconSend,
+} from '@arco-design/web-vue/es/icon';
+import img1 from '@/assets/images/u64.png';
+import img2 from '@/assets/images/u69.png';
+import img3 from '@/assets/images/u74.png';
+import { ref, onMounted, computed, reactive, nextTick, watch } from 'vue';
+import { useUserStore, useAppStore } from '@/store';
+import {
+ sessionListApi,
+ deleteSessionApi,
+ getSessionDetailsApi,
+ chatApi,
+} from '@/api/session';
+import { Message } from '@arco-design/web-vue';
+const userStore = useUserStore();
+const appStore = useAppStore();
+const theme = computed(() => {
+ return appStore.theme;
+});
+const heightrg = ref('calc(100vh - 100px)');
+const sessionList = ref([]); //浼氳瘽鍒楄〃
+const sessionDetailList = ref([]); //鏍规嵁浼氳瘽id鍑烘潵鐨勪細璇濊鎯�
+const activeSessionId = ref('');
+const inputMsg = ref('');
+const scrollbar = ref(null);
+
+const currIndex = ref(0);
+const displayedText = ref(''); // 姝ｅ湪鏄剧ず鐨勬枃瀛�
+let timer: number | null = null;
+const streamStr = ref('');
+const modalObj = reactive({ add: false });
+//鏌ヨ浼氳瘽鍒楄〃
+const querySessionList = async () => {
+ const { code, data } = await sessionListApi();
+ if (code === 200) {
+ sessionList.value = data;
+ if (Array.isArray(data) && data.length > 0) {
+ activeSessionId.value = data[1].id;
+ const res = await getSessionDetailsApi(data[0].id);
+ if (res.code === 200) {
+ sessionDetailList.value = res.data.message;
+ refreshScroll();
+ }
+ }
+ } else {
+ Message.warning('鏌ヨ澶辫触');
+ }
+};
+//鏍规嵁浼氳瘽id鍒犻櫎浼氳瘽
+const deleteSession = async (session) => {
+ const { code } = await deleteSessionApi([session.id]);
+ if (code === 200) {
+ Message.success('鍒犻櫎鎴愬姛');
+ querySessionList();
+ }
+};
+// eslint-disable-next-line prettier/prettier
+// 鏂板浼氳瘽涔嬪悗鍒锋柊浼氳瘽鍒楄〃
+const addSession = () => {
+ querySessionList();
+};
+// 鍒濆鍖栨暟鎹�
+const initData = () => {
+ querySessionList();
+};
+// 鑾峰彇鐧诲綍淇℃伅
+const userName = computed(() => {
+ return userStore.name;
+});
+const avatar = computed(() => {
+ return userStore.avatar;
+});
+const refreshScroll = () => {
+ nextTick(() => {
+ const container = document.getElementById('home');
+ scrollbar.value.scrollTop(container.scrollHeight);
+ });
+};
+// 鏍规嵁浼氳瘽id 鏌ヨ浼氳瘽璇︽儏
+const querySessionDetail = async (session) => {
+ activeSessionId.value = session.id;
+ const { code, data } = await getSessionDetailsApi(session.id);
+ if (code === 200) {
+ sessionDetailList.value = data.message;
+ refreshScroll(); //鍒锋柊婊氬姩鏉′綅缃�
+ }
+};
+const sendMessage = async () => {
+ if (inputMsg.value) {
+ const { code, data } = await chatApi({
+ conversation_id: activeSessionId.value,
+ messages: inputMsg.value,
+ });
+ const res = await getSessionDetailsApi(activeSessionId.value);
+ if (res.code === 200) {
+ sessionDetailList.value = res.data.message.map((item, index) => {
+ if (index === res.data.message.length - 1) {
+ item.role = 'last';
+ displayedText.value = '';
+ currIndex.value = 0;
+ streamStr.value = item.content;
+ startDisplayStr();
+ }
+ return item;
+ });
+ refreshScroll();
+ }
+ inputMsg.value = '';
+ } else {
+ Message.warning('娑堟伅涓嶈兘涓虹┖');
+ }
+};
+onMounted(() => {
+ initData();
+});
+//鏂囧瓧鍔ㄦ�佽緭鍑�
+const startDisplayStr = () => {
+ if (timer) {
+ clearTimeout(timer!);
+ }
+ const res = streamStr.value;
+ // 灏嗘暟缁勪腑鐨勫瓧绗︿覆鎷兼帴璧锋潵
+ if (currIndex.value < res.length) {
+ displayedText.value += res[currIndex.value];
+ currIndex.value++;
+ setTimeout(startDisplayStr, 100);
+ } else {
+ clearTimeout(timer!);
+ timer = null;
+ }
+};
+watch(
+ () => scrollbar.value,
+ (newScroll, oldScroll) => {
+ if (newScroll) {
+ // 鑾峰彇a-scroll鐨勯珮搴�
+ const height = newScroll.$el.offsetHeight;
+ console.log('a-scroll height changed to:', height);
+ }
+ },
+ { deep: true }
+);
+</script>
+
+<style scoped lang="less">
+.container {
+ width: 100%;
+ display: flex;
+}
+
+.bottom {
+ width: 100%;
+ position: absolute;
+ bottom: 40px;
+ left: 0;
+
+ .input {
+ margin-left: 20%;
+ width: 60%;
+ }
+
+ .text {
+ margin-left: 40%;
+ font-size: 12px;
+ color: lightgrey;
+ line-height: 40px;
+ }
+}
+</style>
--
Gitblit v1.8.0