fix: 修改bug

zhangxiao

2024-08-22 897aca261fe00f8eb7fbb4279591026b3217a802

fix: 修改bug

 src/assets/session/PDF.png

 src/assets/session/execl.png

 src/assets/session/icon-txt.png

 src/assets/session/txt.png

 src/assets/session/wps-write.png

 src/assets/session/Ìáʾ.png

 src/views/sessionManager/index.vue

@@ -22,10 +22,7 @@
              <div class="chatHeaderBox">
<!--                <span class="title">{{ agentTitle }}</span>-->

                <a-popover
                  position="bottom"
                  trigger="click"
                >
                <a-popover position="bottom" trigger="click">
                  <a-button border
                  >{{agentTitle}}
                    <icon-down style="margin-left: 4px" />
@@ -45,7 +42,6 @@
<!--                    <a-divider style="margin: 10px 0" />-->
                  </template>
                </a-popover>

              </div>
            </div>
          </div>
@@ -60,7 +56,10 @@
              margin: 0px auto 20px;
            "
          >
            <div class="chat-item" v-for="(sessionDetail,index) in sessionDetailList">
            <div
              class="chat-item"
              v-for="(sessionDetail, index) in sessionDetailList"
            >
              <a-comment v-if="sessionDetail.role === 'user'">
                <template #avatar>
                  <img
@@ -96,16 +95,53 @@
                    auto-size
                    v-model="sessionDetail.content"
                    :class="{ chatItemAnswer: theme === 'light' }"
                    :style="{backgroundColor: theme === 'light' ? '#ffffff' : '#000000'}"
                    :style="{
                      backgroundColor:
                        theme === 'light' ? '#ffffff' : '#000000',
                    }"
                    style="border: none"
                  >
                  </a-textarea>
                </template>
                <!-- <div>{{ sessionDetail.role === 'assistant' }}</div> -->
                <template #actions>
                  <span class="action" v-if="index != 0" @click="copy(sessionDetail.content)">
                  <!-- <div
                    v-for="(item, leng) in messagenList.reference"
                    :key="leng"
                  > -->
                  <div>
                    <div>
                      <template
                        v-for="(v, lix) in getTxt(
                          messagenList.reference,
                          sessionDetail.role,
                          sessionDetail.content,
                          index
                        )"
                        :key="lix"
                      >
                        <div class="icon-box">
                          <div>
                            <img :src="getIconByExtension(v.doc_name)" alt="" />
                          </div>
                          <div class="icon-text"> {{ v.doc_name }} </div>
                        </div>
                      </template>
                    </div>
                  </div>

                  <span
                    class="action"
                    v-if="index != 0"
                    @click="copy(sessionDetail.content)"
                  >
                     <icon-copy /> å¤åˆ¶
                  </span>
                  <span class="action" v-if="index != 0 && index == sessionDetailList.length - 1" @click="reGenerate()">
                  <span
                    class="action"
                    v-if="index != 0 && index == sessionDetailList.length - 1"
                    @click="reGenerate()"
                  >
                     <icon-refresh /> é‡æ–°ç”Ÿæˆ
                  </span>
                </template>
@@ -124,16 +160,31 @@
                    auto-size
                    v-model="displayedText"
                    :class="{ chatItemAnswer: theme === 'light' }"
                    :style="{backgroundColor: theme === 'light' ? '#ffffff' : '#000000'}"
                    :style="{
                      backgroundColor:
                        theme === 'light' ? '#ffffff' : '#000000',
                    }"
                    style="border: none"
                  >
                  </a-textarea>
                </template>

                <template #actions>
                  <div class="action"
                  <!-- <div class="icon-box">
                    <div>
                      <img :src="getIconByExtension('pdf')" alt="" />
                    </div>
                    <div class="icon-text"> æ–‡ä»¶ç±»åž‹ </div>
                  </div> -->
                  <div
                    class="action"
                       @click="stopChat"
                       style="background: var(--color-bg-2);color: var(--color-primary-light-4);"
                       v-if="displayedText != ''">
                    style="
                      background: var(--color-bg-2);
                      color: var(--color-primary-light-4);
                    "
                    v-if="displayedText != ''"
                  >
                    <icon-record-stop />
                    åœæ­¢ç”Ÿæˆ
                  </div>
@@ -167,7 +218,9 @@
                show-word-limit
                :disabled="chatDis"
                :class="{ textItemAnswer: theme === 'dark' }"
                :style="{backgroundColor: theme === 'light' ? '#ffffff' : '#000000'}"
                :style="{
                  backgroundColor: theme === 'light' ? '#ffffff' : '#000000',
                }"
                style="border: none"
                :auto-size="{
                  minRows: 12,
@@ -200,25 +253,48 @@
            <!--                </template>-->
            <!--              </a-upload>-->
            <!--            </div>-->
            <span style="position: absolute;top:94px;left: 20px;z-index: 999;cursor: pointer">
              <icon-attachment size="28" @click="selectFile" style="color: #0960bd;" />
            <span
              style="
                position: absolute;
                top: 94px;
                left: 20px;
                z-index: 999;
                cursor: pointer;
              "
            >
              <icon-attachment
                size="28"
                @click="selectFile"
                style="color: #0960bd"
              />
              <input
                ref="fileInput"
                type="file"
                style="display: none;"
                style="display: none"
                @change="onFileSelected"
              />
            </span>
            <div class="uploadFileList">
              <div class="files" v-for="(item,index) in uploaditemList" :key="index"
                   style="position: relative;width: 200px;margin-top: 10px;">
              <div
                class="files"
                v-for="(item, index) in uploaditemList"
                :key="index"
                style="position: relative; width: 200px; margin-top: 10px"
              >
                <a-comment
                  :author="item.name"
                  :content="item.size +''"
                  style="background: var(--color-bg-2);padding:10px;border-radius: 10px"
                  style="
                    background: var(--color-bg-2);
                    padding: 10px;
                    border-radius: 10px;
                  "
                >
                  <template #avatar>
                    <a-spin :loading="onFileSelectedLoading" v-if="onFileSelectedLoading">
                    <a-spin
                      :loading="onFileSelectedLoading"
                      v-if="onFileSelectedLoading"
                    >
                      <template #icon>
                        <icon-sync />
                      </template>
@@ -229,9 +305,17 @@
                    </a-avatar>
                  </template>
                </a-comment>
                <icon-close-circle-fill size="18px"
                <icon-close-circle-fill
                  size="18px"
                                        @click="deleteFile(item)"
                                        style="position: absolute;right: -4px;top: -4px;color: red;cursor: pointer"/>
                  style="
                    position: absolute;
                    right: -4px;
                    top: -4px;
                    color: red;
                    cursor: pointer;
                  "
                />
              </div>
            </div>
          </div>
@@ -260,15 +344,32 @@
        </div>
      </a-col>
    </a-row>
    <a-modal v-model:visible="visible" title="修改名称" @before-open="handleOpened" @cancel="handleCancel" :footer="false" title-align="start">
      <a-form ref="formRef" :rules="rules" :model="chatObj" @submit="handleSubmit" >
    <a-modal
      v-model:visible="visible"
      title="修改名称"
      @before-open="handleOpened"
      @cancel="handleCancel"
      :footer="false"
      title-align="start"
    >
      <a-form
        ref="formRef"
        :rules="rules"
        :model="chatObj"
        @submit="handleSubmit"
      >
        <a-form-item field="name" label="名称">
          <a-input v-model="agentTitle" placeholder="请输入名称"/>
        </a-form-item>
        <a-form-item>
          <div style="width: 100%;text-align: right">
            <a-button @click="visible = false">取消</a-button>
            <a-button style="margin-left: 10px" type="primary" html-type="submit">确定</a-button>
            <a-button
              style="margin-left: 10px"
              type="primary"
              html-type="submit"
              >确定</a-button
            >
          </div>
        </a-form-item>
      </a-form>
@@ -279,9 +380,9 @@
import {
  IconClose,
  IconSearch,
  IconTiktokColor
} from "@arco-design/web-vue/es/icon";
import { useAppStore, useUserStore } from "@/store";
    IconTiktokColor,
  } from '@arco-design/web-vue/es/icon';
  import { useAppStore, useUserStore } from '@/store';
import {
  computed,
  nextTick,
@@ -290,53 +391,62 @@
  reactive,
  ref,
  onBeforeMount,
  onBeforeUnmount
} from "vue";
    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 setName from "@/views/sessionManager/components/setName.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 setName from '@/views/sessionManager/components/setName.vue';
  import EventBus from '@/utils/EventBus';
import {
  addSessionApi,
  chatApi,
  getDialogListApi,
  getSessionDetailsApi,
  sessionListApi, uploadWithoutKb
} from "@/api/session";
import { getAuthorization } from "@/utils/auth";
import { queryCanvasList } from "@/api/Agent";
import { getAgentSessionDetailsApi } from "@/api/agentSession";
import useClipboard from "vue-clipboard3";
    sessionListApi,
    uploadWithoutKb,
  } from '@/api/session';
  import { getAuthorization } from '@/utils/auth';
  import { queryCanvasList } from '@/api/Agent';
  import { getAgentSessionDetailsApi } from '@/api/agentSession';
  import useClipboard from 'vue-clipboard3';
  import pdfImg1 from '@/assets/session/PDF.png';
  import pdfImg2 from '@/assets/session/wps-write.png';
  import pdfImg3 from '@/assets/session/execl.png';
  import pdfImg4 from '@/assets/session/icon-txt.png';
  import pdfImg5 from '@/assets/session/txt.png';

  // const url = ref('../../assets/session/PDF.png');

const sessionDetailList = ref([]); //根据会话id出来的会话详情
  const messagenList = ref({});
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('未命名会话');
let chatObj = reactive({});
const isStopChat = ref(false);
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 uploadList = ref([]);
const uploaditemList = ref([]);
@@ -344,10 +454,8 @@
const files = ref([]);
const file = ref('');
const fileInput = ref(null);
const chatDataMeg = reactive({})
  const chatDataMeg = reactive({});
const visible = ref(false);



const rules = {
  name: [
@@ -356,7 +464,7 @@
      message:'名称不允许为空',
    },
  ],
}
  };

const handleSubmit = async({values, errors}) => {
  if(errors) return;
@@ -365,62 +473,97 @@
  let chatData = {
    id:chatObj.id,
    conversation_id:chatObj.id,
    name: agentTitle.value
  }
      name: agentTitle.value,
    };
  const { code, data } = await addSessionApi(chatData);
  if (data) {
    Message.success("修改成功");
    handleCancel()
      Message.success('修改成功');
      handleCancel();
    queryNewSessionDetail(activeSessionId.value);
  }
  };
  let dataItem = [];
  const getTxt = (data, role, message, index) => {
    if (/##0\$\$/.test(message)) {
      if (role == 'assistant' && index) {
        data.forEach((item) => {
          if (Object.keys(item).length !== 0 && item?.doc_aggs.length > 0) {
            dataItem = item.doc_aggs;
            console.log(dataItem, 999);
}
        });
      }
    } else {
      dataItem = [];
    }

    return dataItem;
  };

  const getIconByExtension = computed(() => (extension) => {
    const fileExtension = ref('');
    fileExtension.value = extension.split('.').pop();
    switch (fileExtension.value) {
      case 'pptx':
      case 'ppt':
      case 'pdf':
        return pdfImg1; // PDF图标的URL
      case 'docx':
      case 'doc':
        return pdfImg2; // Word图标的URL
      case 'xlsx':
      case 'xls':
        return pdfImg3; // Excel图标的URL
      case 'txt':
        return pdfImg4; // æ–‡æœ¬æ–‡æ¡£å›¾æ ‡çš„URL
      default:
        return pdfImg5; // é»˜è®¤å›¾æ ‡
    }
  });

const handleClick = () => {
  visible.value = true;
};
const handleCancel = () => {
  visible.value = false;
}
  };

const handleOpened =(el) => {
  // Object.assign(form,{
  //   name: '',// ç”¨æˆ·å
  // });
  // formRef.value.resetFields();
}




  };

const selectFile = () => {
  fileInput.value.click();
};


let onFileSelectedLoading = ref(false);
const onFileSelected = (event) => {
  const file = event.target.files[0];
  uploaditemList.value = [{
    uploaditemList.value = [
      {
    name: file.name,
    size: file.size,
  }];
      },
    ];
  if (file) {
    onFileSelectedLoading.value = true;
    const formData = new FormData();
    formData.append("file", file);
    formData.append("conversation_id", activeSessionId.value);
      formData.append('file', file);
      formData.append('conversation_id', activeSessionId.value);
    uploadWithoutKb(formData).then((res) => {
      // console.log(res);
      if (res.code == 200) {
        console.log(res);
        console.log(uploaditemList.value);
        onFileSelectedLoading.value = false;
        fileInput.value.value = "";
          fileInput.value.value = '';
        uploaditemList.value = [];
        Message.success("上传成功");
          Message.success('上传成功');
      } else {
        Message.error("上传失败");
          Message.error('上传失败');
      }
    });
  }
@@ -443,26 +586,24 @@
// ä¸Šä¼ æ–‡ä»¶
const customRequest = async (option) => {
  const { onProgress, onError, onSuccess, fileItem, name } = option;
  fileItem.status = "ready";
    fileItem.status = 'ready';
  if (fileItem.file) {
    const formData = new FormData();
    formData.append("file", fileItem.file);
    formData.append("conversation_id", activeSessionId.value);
      formData.append('file', fileItem.file);
      formData.append('conversation_id', activeSessionId.value);
    uploadWithoutKb(formData).then((res) => {
      // console.log(res);
      if (res.code == 200) {
        console.log(res);
        console.log(uploadList.value);
        fileItem.status = "done";
          fileItem.status = 'done';
        // uploadList.value = [];
      } else {
        fileItem.status = "error";
          fileItem.status = 'error';
      }
    });
  }

};


const DialogList = async () => {
  const { code, data } = await getDialogListApi();
@@ -472,10 +613,10 @@
      dialogs.value = data.map((item) => {
        return {
          ...item,
          type: 1 //智能体
            type: 1, //智能体
        };
      });
      console.log(data, "dialogs");
        console.log(data, 'dialogs');
      queryCanvas();
    }
  }
@@ -484,12 +625,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
      };
    });
    // åˆå¹¶æ•°ç»„
@@ -508,13 +649,13 @@
  }
};
// æ–°å»ºä¼šè¯
const createSession = async (id, name = "未命名会话") => {
  const createSession = async (id, name = '未命名会话') => {
  // å¦‚果有会话id
  console.log(name, "新建会话名称");
    console.log(name, '新建会话名称');

  const res = await addSessionApi({
    dialog_id: id,
    conversation_desc: name
      conversation_desc: name,
  });
  // console.log(res, "res");
  if (res.code == 200) {
@@ -522,13 +663,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
@@ -539,12 +680,12 @@
      Object.assign(dialogObj, item);
    }
  });
  console.log(dialogObj.type, "dialogObj");
    console.log(dialogObj.type, 'dialogObj');
  if (dialogObj.type == 1) {
    agentType.value = "1";
      agentType.value = '1';
    querySessionList();
  } else {
    agentType.value = "2";
      agentType.value = '2';
    queryAgentSessionList();
  }

@@ -553,22 +694,22 @@

// å‘送
const sentClick = () => {
  sendMessage("click");
    sendMessage('click');
};
// é‡æ–°ç”Ÿæˆ
const reGenerate = () => {
  let inputContent = sessionDetailList.value[sessionDetailList.value.length - 2].content;
    let inputContent =
      sessionDetailList.value[sessionDetailList.value.length - 2].content;
  startChat(inputContent);
};

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(); // é˜»æ­¢é»˜è®¤è¡Œä¸ºï¼Œå³ä¸æ¢è¡Œ
      }


      // if (!activeSessionId.value) {
      //   Message.warning("请选择会话");
@@ -582,12 +723,11 @@
      // }

      if (inputMsg.value) {

        startChat(inputMsg.value);

        inputMsg.value = "";
          inputMsg.value = '';
      } else {
        Message.warning("消息不能为空");
          Message.warning('消息不能为空');
      }
    }
  }
@@ -598,22 +738,22 @@
  loading.value = true;
  sessionDetailList.value.push({
    content: valMsg,
    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: valMsg
      })
          messages: valMsg,
        }),
    }
  );

@@ -628,9 +768,9 @@
      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") {
          if (typeof d !== 'boolean') {
          // console.info("data:", d);
          streamStr.value = d.content;
          startDisplayStr();
@@ -639,13 +779,13 @@
        console.warn(e);
      }
      if (done) {
        console.info("done");
        displayedText.value = "";
          console.info('done');
          displayedText.value = '';
        if(isStopChat.value){
          setChatDataMeg(chatDataMeg);
        }else{
          queryNewSessionDetail(activeSessionId.value);
          EventBus.emit("queryAppUsageList");
            EventBus.emit('queryAppUsageList');
        }
        break;
      }
@@ -656,8 +796,6 @@
  loading.value = false;
};



const stopChat = async () => {
  // const { code, data } = await stopChatApi(activeSessionId.value);
  // if (code === 200) {
@@ -667,29 +805,34 @@
  loading.value = false;
  chatDis.value = false;
  isStopChat.value = true;
  console.log("stopChat");
  console.log(displayedText.value, "displayedText");
  console.log(sessionDetailList.value, "sessionDetailList");
  let inputText = sessionDetailList.value[sessionDetailList.value.length - 2].content;
    console.log('stopChat');
    console.log(displayedText.value, 'displayedText');
    console.log(sessionDetailList.value, 'sessionDetailList');
    let inputText =
      sessionDetailList.value[sessionDetailList.value.length - 2].content;
  // æ•°ç»„合并
  let lastArr = [{
    let lastArr = [
      {
    content: inputText,
    role: "user"
  }, {
        role: 'user',
      },
      {
    content: displayedText.value,
    role: "assistant"
  }];
  sessionDetailList.value = sessionDetailList.value.splice(0, sessionDetailList.value.length - 2).concat(lastArr);
        role: 'assistant',
      },
    ];
    sessionDetailList.value = sessionDetailList.value
      .splice(0, sessionDetailList.value.length - 2)
      .concat(lastArr);

  console.log(sessionDetailList.value, "sessionDetailList2");
  console.log(chatObj, "chatObj对象");
    console.log(sessionDetailList.value, 'sessionDetailList2');
    console.log(chatObj, 'chatObj对象');
  chatObj.message = chatObj.message.concat(lastArr);
  Object.assign(chatDataMeg,{
    id:chatObj.id,
    conversation_id:chatObj.id,
    message: sessionDetailList.value
      message: sessionDetailList.value,
  });

};

const setChatDataMeg = async(chatData) => {
@@ -703,16 +846,14 @@
  }
};




const queryNewSessionDetail = async (id) => {
  activeSessionId.value = id;
  const { code, data } = await getSessionDetailsApi(id);
  if (code === 200) {
    console.log(data, "新建会话详情");
      console.log(data, '新建会话详情');
    Object.assign(chatObj, data);
    sessionDetailList.value = data.message;
      messagenList.value = data;
    agentTitle.value = data.name;
    refreshScroll(); //刷新滚动条位置
    isStopChat.value = false;
@@ -721,7 +862,7 @@

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

const querySessionDetail = async (session) => {
@@ -730,6 +871,7 @@
  const { code, data } = await getSessionDetailsApi(session.id);
  if (code === 200) {
    sessionDetailList.value = data.message;
      messagenList.value = data;
    refreshScroll(); //刷新滚动条位置
  }
};
@@ -744,7 +886,7 @@
const scrollbar = ref(null);
const refreshScroll = () => {
  nextTick(() => {
    const container = document.getElementById("home");
      const container = document.getElementById('home');
    scrollbar.value.scrollTop(container.scrollHeight);
  });
};
@@ -756,7 +898,7 @@
    activeSessionId.value = data[0].id; //默认选择第一个
    querySessionDetail(data[0]);
  } else {
    Message.warning("查询失败");
      Message.warning('查询失败');
  }
};

@@ -778,16 +920,16 @@
onBeforeMount(() => {
  // DialogList();
  //新建会话
  createSession("");
    createSession('');
});
onMounted(() => {
  EventBus.on("newChat", () => {
    agentType.value = "1";
    createSession("");
    EventBus.on('newChat', () => {
      agentType.value = '1';
      createSession('');
  });
});
onBeforeUnmount(() => {
  EventBus.off("newChat");
    EventBus.off('newChat');
});

const appStore = useAppStore();
@@ -1024,6 +1166,19 @@
    .icon-user-jpg {
      border: 1px solid #d9d9d9;
    }
      .icon-box {
        display: flex;
        align-items: center;
        box-sizing: border-box;
        background: var(--color-bg-1);
        border: 1px solid var(--color-border-2);
        padding: 10px;
        border-radius: 14px;
        min-width: 200px;
        .icon-text {
          margin-left: 10px;
        }
      }
  }

  .right {