新版UI对话页面开发

liudong

2024-08-16 e4dbf13e917784f0e690709e2dd405e7475a86a1

 src/views/sessionManager/components/agentSession.vue

@@ -2,7 +2,7 @@
  <!--      内容-->
  <a-scrollbar
    ref="scrollbar"
    id="home"
    id="agentHome"
    class="chat-list"
    style="
              width: 90%;
@@ -105,6 +105,7 @@
import { getAuthorization } from "@/utils/auth";
import { EventSourceParserStream } from 'eventsource-parser/stream';
import { agentResetApi, agentSetApi, getAgentSessionDetailsApi } from "@/api/agentSession";
import EventBus from '@/utils/EventBus';
const props = defineProps({
  modalObj: Object,
});
@@ -146,6 +147,15 @@
  queryAgentSessionDetail(agentObj.id);
};

const createNewAgent = async (session) => {
  Object.assign(agentObj, session);
  initPage();


}



// 调用set方法
const agentSet = async () => {
  const res = await agentSetApi({
@@ -153,7 +163,9 @@
    title: agentObj.title,
    dsl: agentObj.dsl,
  });
  if (res.code === 200) {
  console.log(res,'agentSet');
  if (res.code == 0) {
    // sessionDetailList.value = res.data.dsl.messages;
    // Message.success('修改成功');
  }
}
@@ -187,30 +199,30 @@
    .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;
      }
    }
  }
  // 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 = '';
@@ -222,7 +234,7 @@
  if (code == 0) {
    console.log(data,'会话详情');
    sessionDetailList.value = data.dsl.messages;
    // refreshScroll(); //刷新滚动条位置
    refreshScroll(); //刷新滚动条位置
  }
};

@@ -243,12 +255,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();
@@ -270,8 +282,8 @@
              'Content-Type': 'application/json',
            },
            body: JSON.stringify({
              conversation_id: activeSessionId.value,
              messages: inputMsg.value,
              id: agentObj.id,
              message: inputMsg.value,
            }),
          }
        );
@@ -345,24 +357,25 @@
const scrollbar = ref(null);
const refreshScroll = () => {
  nextTick(() => {
    const container = document.getElementById('home');
    const container = document.getElementById('agentHome');
    scrollbar.value.scrollTop(container.scrollHeight);
  });
};


onMounted(() => {

  EventBus.on('createAgent', (data) => {
    createNewAgent(data);
  });
});

watch(
  () => props.modalObj,
  (newVal, oldVal) => {
    console.log(newVal,'监听变化');
    Object.assign(agentObj, newVal);
    // Object.assign(agentObj, newVal);
    //调用agent初始化方法
    if(JSON.stringify(newVal) != '{}'){
      initPage();
      // initPage();
    }
  },{
    immediate: true,