fix: 换行

zhangxiao

2024-08-17 0ea2c6031b92050574c11fa0dc060af1c7fd1f0b

fix: 换行

 src/views/sessionManager/index.vue

@@ -6,9 +6,13 @@
<!--      :dialogId="dialogId"-->
<!--    ></AddSession>-->
    <!--    <a-card class="top-title">AI会话记录</a-card>-->
    <a-row :gutter="[5, 5]" style="margin-top: 3px;">
    <a-row :gutter="[5, 5]" style="margin-top: 3px">
      <a-col :span="1">
        <chatMenu @createSession="createSession" @querySessionDetail="querySessionDetail" @changeAgentType="changeAgentType"></chatMenu>
        <chatMenu
          @createSession="createSession"
          @querySessionDetail="querySessionDetail"
          @changeAgentType="changeAgentType"
        ></chatMenu>
      </a-col>
      <!--      智能体会话-->
      <a-col :span="23" v-show="agentType == '1'">
@@ -56,8 +60,10 @@
                </template>
                <template #content>
                  <a-card :class="{ chatItemAnswer: theme === 'light' }">
                    <div :class="{ light: theme === 'light' }"
                    >{{ sessionDetail.content }}
                    <div
                      :class="{ light: theme === 'light' }"
                      v-html="sessionDetail.content.replace(/\n/g, '<br/>')"
                    >
                    </div>
                  </a-card>
                </template>
@@ -122,8 +128,7 @@
                  :loading="loading"
                  size="large"
                >发送
                </a-button
                >
                </a-button>
              </div>
            </div>
          </div>
@@ -136,12 +141,19 @@
      </a-col>
      <a-col :span="23" v-show="agentType == '3'">
        <div class="center" style="padding: 0">
          <historySession @querySessionDetail="querySessionDetail" @changeAgentType="changeAgentType"></historySession>
          <historySession
            @querySessionDetail="querySessionDetail"
            @changeAgentType="changeAgentType"
          ></historySession>
        </div>
      </a-col>
      <a-col :span="23" v-show="agentType == '4'">
        <div class="center" style="padding: 0">
          <smartAi @createSession="createSession" @querySessionDetail="querySessionDetail" @changeAgentType="changeAgentType"></smartAi>
          <smartAi
            @createSession="createSession"
            @querySessionDetail="querySessionDetail"
            @changeAgentType="changeAgentType"
          ></smartAi>
        </div>
      </a-col>
    </a-row>
@@ -151,52 +163,61 @@
import {
  IconClose,
  IconSearch,
  IconTiktokColor
} from "@arco-design/web-vue/es/icon";
import { useAppStore, useUserStore } from "@/store";
import { computed, nextTick, onMounted, watch, reactive, ref, onBeforeMount, onBeforeUnmount } from "vue";
    IconTiktokColor,
  } from '@arco-design/web-vue/es/icon';
  import { useAppStore, useUserStore } from '@/store';
  import {
    computed,
    nextTick,
    onMounted,
    watch,
    reactive,
    ref,
    onBeforeMount,
    onBeforeUnmount,
  } from 'vue';

import { Message } from "@arco-design/web-vue";
import { EventSourceParserStream } from "eventsource-parser/stream";
import moment from "moment";
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 historySession from "@/views/sessionManager/components/historySession.vue";
import smartAi from "@/views/sessionManager/components/smartAi.vue";
import EventBus from "@/utils/EventBus";
  import { Message } from '@arco-design/web-vue';
  import { EventSourceParserStream } from 'eventsource-parser/stream';
  import moment from 'moment';
  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 historySession from '@/views/sessionManager/components/historySession.vue';
  import smartAi from '@/views/sessionManager/components/smartAi.vue';
  import EventBus from '@/utils/EventBus';
import {
  addSessionApi,
  chatApi,
  getDialogListApi,
  getSessionDetailsApi,
  sessionListApi
} from "@/api/session";
import { getAuthorization } from "@/utils/auth";
import { queryCanvasList } from "@/api/Agent";
import { getAgentSessionDetailsApi } from "@/api/agentSession";
    sessionListApi,
  } from '@/api/session';
  import { getAuthorization } from '@/utils/auth';
  import { queryCanvasList } from '@/api/Agent';
  import { getAgentSessionDetailsApi } from '@/api/agentSession';

const sessionDetailList = ref([]); //根据会话id出来的会话详情
const sessionList = ref([]); //会话列表
const modalObj = reactive({ add: false });
const dialogId = ref("");
  const dialogId = ref('');
const chatDis = ref(false);
const loading = ref(false);
const agentType = ref("1");
const agentTitle = ref("未命名会话");
  const agentType = ref('1');
  const agentTitle = ref('未命名会话');

const currIndex = ref(0);
const displayedText = ref(""); // 正在显示的文字
  const displayedText = ref(''); // 正在显示的文字
let timer: number | null = null;
const streamStr = ref("");
const inputMsg = ref("");
const activeSessionId = ref("");
const fieldNames = { value: "id", label: "name" };
  const streamStr = ref('');
  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 selectValue = ref('');
const sectionList = ref({});
const DialogList = async () => {
  const { code, data } = await getDialogListApi();
@@ -206,10 +227,10 @@
      dialogs.value = data.map((item) => {
        return {
          ...item,
          type: 1 //智能体
            type: 1, //智能体
        };
      });
      console.log(data, "dialogs");
        console.log(data, 'dialogs');
      queryCanvas();
    }
  }
@@ -218,12 +239,12 @@
const queryCanvas = async (params = {}) => {
  try {
    const { data } = await queryCanvasList(params);
    console.log(data, "agent");
      console.log(data, 'agent');
    agentList.value = data.map((item) => {
      return {
        ...item,
        name: item.title,
        type: 2 //agent
          type: 2, //agent
      };
    });
    // 合并数组
@@ -236,8 +257,6 @@
    // }
    //新建会话
    createSession(dialogs.value[0].id);


  } catch (err) {
    // you can report use errorHandler or other
  } finally {
@@ -248,11 +267,9 @@
  // 如果有会话id
  console.log(name, '新建会话名称');



  const res = await addSessionApi({
    dialog_id: id,
    conversation_desc: name
      conversation_desc: name,
  });
  // console.log(res, "res");
  if (res.code == 200) {
@@ -260,15 +277,13 @@
    activeSessionId.value = res.data?.conversation_id;
    queryNewSessionDetail(res.data?.conversation_id);
  } else {
    Message.error("创建会话失败，请重试");
      Message.error('创建会话失败，请重试');
  }

};


const handleShiftEnter = (event) => {
  event.preventDefault();
  inputMsg.value += "\n";
    inputMsg.value += '\n';
};
const dialogChange = (val) => {
  // 判断当前是智能体或agent
@@ -279,7 +294,7 @@
      Object.assign(dialogObj, item);
    }
  });
  console.log(dialogObj.type, "dialogObj");
    console.log(dialogObj.type, 'dialogObj');
  if (dialogObj.type == 1) {
    agentType.value = 1;
    querySessionList();
@@ -291,20 +306,20 @@
  // querySessionList();
};
const sentClick = () => {
  sendMessage("click");
    sendMessage('click');
};
const sendMessage = async (event) => {
  if (event.keyCode == 13 || event === "click") {
    if (event.keyCode == 13 || event === 'click') {
    if (!event.shiftKey) {
      //只有enter没有shift，或进行你的其他逻辑
      if (event !== "click") {
        if (event !== 'click') {
        event.preventDefault(); // 阻止默认行为，即不换行
      }

      chatDis.value = true;
      loading.value = true;
      if (!activeSessionId.value) {
        Message.warning("请选择会话");
          Message.warning('请选择会话');
        chatDis.value = false;
        loading.value = false;
        return;
@@ -317,22 +332,22 @@
      if (inputMsg.value) {
        sessionDetailList.value.push({
          content: inputMsg.value,
          role: "user"
            role: 'user',
        });
        sessionDetailList.value.push({ role: "last" });
          sessionDetailList.value.push({ role: 'last' });
        refreshScroll();
        const response = await fetch(
          "/api/tech/cloudminds/query?modeltype=localragflow",
            '/api/tech/cloudminds/query?modeltype=localragflow',
          {
            method: "POST",
              method: 'POST',
            headers: {
              "Authorization": getAuthorization(),
              "Content-Type": "application/json"
                'Authorization': getAuthorization(),
                'Content-Type': 'application/json',
            },
            body: JSON.stringify({
              conversation_id: activeSessionId.value,
              messages: inputMsg.value
            })
                messages: inputMsg.value,
              }),
          }
        );

@@ -347,10 +362,10 @@
            const { done, value } = x;
            console.log(x, 999);
            try {
              const val = JSON.parse(value?.data || "");
                const val = JSON.parse(value?.data || '');
              const d = val?.data;
              if (typeof d !== "boolean") {
                console.info("data:", d);
                if (typeof d !== 'boolean') {
                  console.info('data:', d);
                streamStr.value = d.content;
                startDisplayStr();
              }
@@ -358,8 +373,8 @@
              console.warn(e);
            }
            if (done) {
              console.info("done");
              displayedText.value = "";
                console.info('done');
                displayedText.value = '';
              queryNewSessionDetail(activeSessionId.value);
              EventBus.emit('queryAppUsageList');
              break;
@@ -369,9 +384,9 @@
        // querySessionList();
        chatDis.value = false;
        loading.value = false;
        inputMsg.value = "";
          inputMsg.value = '';
      } else {
        Message.warning("消息不能为空");
          Message.warning('消息不能为空');
        chatDis.value = false;
        loading.value = false;
      }
@@ -383,7 +398,7 @@
  activeSessionId.value = id;
  const { code, data } = await getSessionDetailsApi(id);
  if (code === 200) {
    console.log(data, "新建会话详情");
      console.log(data, '新建会话详情');
    sessionDetailList.value = data.message;
    agentTitle.value = data.name;
    refreshScroll(); //刷新滚动条位置
@@ -392,8 +407,8 @@

const changeAgentType = (val,session) => {
  agentType.value = val;
  console.log(val, "val");
}
    console.log(val, 'val');
  };

const querySessionDetail = async (session) => {
  sectionList.value = session;
@@ -415,7 +430,7 @@
const scrollbar = ref(null);
const refreshScroll = () => {
  nextTick(() => {
    const container = document.getElementById("home");
      const container = document.getElementById('home');
    scrollbar.value.scrollTop(container.scrollHeight);
  });
};
@@ -427,7 +442,7 @@
    activeSessionId.value = data[0].id; //默认选择第一个
    querySessionDetail(data[0]);
  } else {
    Message.warning("查询失败");
      Message.warning('查询失败');
  }
};

@@ -452,13 +467,13 @@
  createSession('');
});
onMounted(() => {
  EventBus.on("newChat", () => {
    EventBus.on('newChat', () => {
    agentType.value = 1;
    createSession('');
  });
});
onBeforeUnmount(() => {
  EventBus.off("newChat");
    EventBus.off('newChat');
});

const appStore = useAppStore();