From fa5fd89d1fd0f2d0b0bb1944b3ac4a452c49f83a Mon Sep 17 00:00:00 2001
From: zhangxiao <898441624@qq.com>
Date: 星期六, 17 八月 2024 16:30:33 +0800
Subject: [PATCH] fix: 修改分页id

---
 src/views/sessionManager/components/agentSession.vue |  235 ++++++++++++++++++++++++++++++++++++++++++++++++++++------
 1 files changed, 209 insertions(+), 26 deletions(-)

diff --git a/src/views/sessionManager/components/agentSession.vue b/src/views/sessionManager/components/agentSession.vue
index e73415b..5702476 100644
--- a/src/views/sessionManager/components/agentSession.vue
+++ b/src/views/sessionManager/components/agentSession.vue
@@ -1,8 +1,15 @@
 <template>
   <!--      鍐呭-->
+  <div class="header___lEPyH">
+    <div class="chatHeader">
+      <div class="chatHeaderBox">
+        <span class="title">{{agentTitle}}</span>
+      </div>
+    </div>
+  </div>
   <a-scrollbar
     ref="scrollbar"
-    id="home"
+    id="agentHome"
     class="chat-list"
     style="
               width: 90%;
@@ -99,24 +106,26 @@
 </template>
 
 <script setup lang="ts">
-import { defineProps, ref, watch, defineEmits, onMounted, reactive, computed } from "vue";
+import { defineProps, ref, watch, defineEmits, onMounted, reactive, computed, nextTick, onBeforeUnmount } from "vue";
 import { Message } from '@arco-design/web-vue';
 import { useAppStore } from "@/store";
 import { getAuthorization } from "@/utils/auth";
 import { EventSourceParserStream } from 'eventsource-parser/stream';
-// const props = defineProps({
-//   modalObj: Object,
-//   dialogId: String,
-// });
+import { agentResetApi, agentSetApi, getAgentSessionDetailsApi } from "@/api/agentSession";
+import EventBus from '@/utils/EventBus';
+const props = defineProps({
+  modalObj: Object,
+});
 
 // const emit = defineEmits(['addSession']);
 
 const sessionDetailList = ref([]); //鏍规嵁浼氳瘽id鍑烘潵鐨勪細璇濊鎯�
 const sessionList = ref([]); //浼氳瘽鍒楄〃
-const modalObj = reactive({ add: false });
+const modalObj = reactive({ });
 const dialogId = ref('');
 const chatDis = ref(false);
 const loading = ref(false);
+const agentTitle = ref("鏈懡鍚嶄細璇�");
 
 
 const currIndex = ref(0);
@@ -126,8 +135,7 @@
 const inputMsg = ref('');
 const activeSessionId = ref('');
 const fieldNames = { value: 'id', label: 'name' };
-const dialogs = ref([]);
-const dialogObj = reactive({});
+const agentObj = reactive({});
 const agentList = ref([]);
 const selectValue = ref('');
 const sectionList = ref({});
@@ -136,6 +144,109 @@
 const theme = computed(() => {
   return appStore.theme;
 });
+
+
+
+// 鍒濆鍖栭〉闈�
+const initPage = async () => {
+  agentSet();
+};
+
+const createNewAgent = async (session) => {
+  Object.assign(agentObj, session);
+  initPage();
+
+
+}
+
+
+
+// 璋冪敤set鏂规硶
+const agentSet = async () => {
+  const res = await agentSetApi({
+    id: agentObj.id,
+    title: agentObj.title,
+    dsl: agentObj.dsl,
+  });
+  console.log(res,'agentSet');
+  if (res.code == 0) {
+    // sessionDetailList.value = res.data.dsl.messages;
+    // Message.success('淇敼鎴愬姛');
+    agentReset();
+  }
+}
+// 璋冪敤reset鏂规硶
+const agentReset = async () => {
+  const res = await agentResetApi({
+    id: agentObj.id,
+  });
+  if (res.code == 0) {
+    // Message.success('淇敼鎴愬姛');
+    agentCompletion();
+  }
+}
+// 璋冪敤completion鏂规硶
+const agentCompletion = async () => {
+  const response = await fetch(
+    '/api/v1/canvas/completion',
+    {
+      method: 'POST',
+      headers: {
+        'Authorization': getAuthorization(),
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({
+        id: agentObj.id
+      }),
+    }
+  );
+
+  const reader = response?.body
+    ?.pipeThrough(new TextDecoderStream())
+    .pipeThrough(new EventSourceParserStream())
+    .getReader();
+  currIndex.value = 0;
+  while (true) {
+    const x = await reader?.read();
+    if (x) {
+      const { done, value } = x;
+      console.log(x, 999);
+      try {
+        const val = JSON.parse(value?.data || '');
+        const d = val?.data;
+        if (typeof d !== 'boolean') {
+          console.info('data:', d);
+          streamStr.value = d.content;
+          startDisplayStr();
+        }
+      } catch (e) {
+        console.warn(e);
+      }
+      if (done) {
+        console.info('done');
+        displayedText.value = '';
+        queryAgentSessionDetail(agentObj.id);
+        break;
+      }
+    }
+  }
+  chatDis.value = false;
+  loading.value = false;
+  inputMsg.value = '';
+}
+// 璋冪敤get鏂规硶
+
+const queryAgentSessionDetail = async (id) => {
+  const { code, data } = await getAgentSessionDetailsApi(id);
+  if (code == 0) {
+    console.log(data,'浼氳瘽璇︽儏');
+    sessionDetailList.value = data.dsl.messages;
+    agentTitle.value = data.name || '鏈懡鍚嶄細璇�';
+    refreshScroll(); //鍒锋柊婊氬姩鏉′綅缃�
+  }
+};
+
+
 
 
 
@@ -152,12 +263,12 @@
 
       chatDis.value = true;
       loading.value = true;
-      if (!activeSessionId.value) {
-        Message.warning('璇烽�夋嫨浼氳瘽');
-        chatDis.value = false;
-        loading.value = false;
-        return;
-      }
+      // if (!agentObj.id) {
+      //   Message.warning('璇烽�夋嫨浼氳瘽');
+      //   chatDis.value = false;
+      //   loading.value = false;
+      //   return;
+      // }
 
       // if (displayedText.value) {
       //   querySessionList();
@@ -171,7 +282,7 @@
         sessionDetailList.value.push({ role: 'last' });
         refreshScroll();
         const response = await fetch(
-          '/api/tech/cloudminds/query?modeltype=localragflow',
+          '/api/v1/canvas/completion',
           {
             method: 'POST',
             headers: {
@@ -179,8 +290,8 @@
               'Content-Type': 'application/json',
             },
             body: JSON.stringify({
-              conversation_id: activeSessionId.value,
-              messages: inputMsg.value,
+              id: agentObj.id,
+              message: inputMsg.value,
             }),
           }
         );
@@ -209,7 +320,8 @@
             if (done) {
               console.info('done');
               displayedText.value = '';
-              querySessionDetail(sectionList.value);
+              queryAgentSessionDetail(agentObj.id);
+              EventBus.emit('queryAppUsageList');
               break;
             }
           }
@@ -232,16 +344,61 @@
 };
 
 
-onMounted(() => {
 
+//鏂囧瓧鍔ㄦ�佽緭鍑�
+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);
+    refreshScroll();
+  } else {
+    clearTimeout(timer!);
+    timer = null;
+  }
+};
+
+const scrollbar = ref(null);
+const refreshScroll = () => {
+  nextTick(() => {
+    const container = document.getElementById('agentHome');
+    scrollbar.value.scrollTop(container.scrollHeight);
+  });
+};
+
+
+onMounted(() => {
+  EventBus.on('createAgent', (data) => {
+    createNewAgent(data);
+  });
+  EventBus.on('queryAgentSessionDetail', (data) => {
+    Object.assign(agentObj, data);
+    queryAgentSessionDetail(data.id);
+  });
+});
+onBeforeUnmount(() => {
+  EventBus.off('createAgent');
+  EventBus.off('queryAgentSessionDetail');
 });
 
-// watch(
-//   () => props.dialogId,
-//   (newVal, oldVal) => {
-//
-//   }
-// );
+watch(
+  () => props.modalObj,
+  (newVal, oldVal) => {
+    // Object.assign(agentObj, newVal);
+    //璋冪敤agent鍒濆鍖栨柟娉�
+    if(JSON.stringify(newVal) != '{}'){
+      // initPage();
+    }
+  },{
+    immediate: true,
+    deep: true
+  }
+);
 </script>
 
 <style scoped lang="scss">
@@ -374,4 +531,30 @@
     }
   }
 }
+.header___lEPyH {
+  width: 100%;
+  height: 46px;
+  position: relative;
+  backdrop-filter: blur(15px);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  -webkit-backdrop-filter: blur(15px);
+  .chatHeaderBox {
+    width: auto;
+    border-radius: 8px;
+    padding: 4px 20px;
+    transition: all var(--animation-duration) var(--animation-transition);
+    display: flex;
+    align-items: flex-end;
+    overflow: hidden;        /* 闅愯棌瓒呭嚭鐨勫唴瀹� */
+    text-overflow: ellipsis; /* 浣跨敤鐪佺暐鍙锋潵浠f浛琚殣钘忕殑鏂囧瓧 */
+    white-space: nowrap;     /* 涓嶆崲琛岋紝浣垮唴瀹瑰湪涓�琛屽唴鏄剧ず */
+    max-width: 200px;
+    .title{
+      color: var(--color-text-1);
+      font-size: 12px;
+    }
+  }
+}
 </style>

--
Gitblit v1.8.0