文档上传修改

liudong

2024-08-19 659347e492d9d4c84e869e0cbbb1281063dd9307

文档上传修改

 src/views/sessionManager/index.vue

@@ -80,7 +80,7 @@
                  <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>
@@ -107,8 +107,9 @@
                <template #actions>
                  <div class="action"
                       @click="stopChat"
                       style="background: var(--color-bg-2);color: var(--color-primary-light-4);" v-if="displayedText != ''">
                     <icon-record-stop />
                       style="background: var(--color-bg-2);color: var(--color-primary-light-4);"
                       v-if="displayedText != ''">
                    <icon-record-stop />
                    停止生成
                  </div>
                </template>
@@ -120,7 +121,7 @@
            <div class="chartStart v-else" @click="stopChat">重新生成</div> -->
          </a-scrollbar>

          <div class="chat_bottom" >
          <div class="chat_bottom">
            <div class="center-bottom">
              <!-- <a-textarea
              v-model="inputMsg"
@@ -148,19 +149,6 @@
                  maxRows: 5,
                }"
              />
              <div style="margin-left: 20px">
                <a-upload
                  ref="uploadRef"
                  :file-list="uploadList"
                  :disabled="loading1"
                  multiple
                  :custom-request="customRequest"
                          style="font-size: 24px;">
                  <template #upload-button>
                    <icon-attachment style="color: #0960bd"/>
                  </template>
                </a-upload>
              </div>

              <div class="btn-send">
                <a-button
@@ -169,8 +157,51 @@
                  type="text"
                  style="border-radius: 24px"
                  :loading="loading"
                ><icon-send size="32" style="color: #0960bd"/>
                >
                  <icon-send size="32" style="color: #0960bd" />
                </a-button>
              </div>
            </div>
            <!--            <div style="margin-top: 0px">-->
            <!--              <a-upload-->
            <!--                ref="uploadRef"-->
            <!--                :file-list="uploadList"-->
            <!--                :limit="1"-->
            <!--                multiple-->
            <!--                :custom-request="customRequest"-->
            <!--                style="font-size: 24px;margin-bottom: 10px;position: relative;width: 200px">-->
            <!--                <template #upload-button>-->
            <!--                  <icon-attachment style="color: #0960bd;position: absolute;top:-50px;left: 20px;z-index: 10000"/>-->
            <!--                </template>-->
            <!--              </a-upload>-->
            <!--            </div>-->
            <spa style="position: absolute;top:96px;left: 10px;z-index: 10000;cursor: pointer">
              <icon-attachment size="28" @click="selectFile" style="color: #0960bd;" />
              <input
                ref="fileInput"
                type="file"
                style="display: none;"
                @change="onFileSelected"
              />
            </spa>
            <div class="uploadFileList">
              <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"
                >
                  <template #avatar>
                    <a-button type="text" :loading="onFileSelectedLoading" v-if="onFileSelectedLoading"></a-button>
                    <a-avatar v-if="!onFileSelectedLoading">
                      <icon-file style="color: #0960bd" />
                    </a-avatar>
                  </template>
                </a-comment>
                <icon-close-circle-fill size="18px"
                                        @click="deleteFile(item)"
                                        style="position: absolute;right: -4px;top: -4px;color: red;cursor: pointer"/>
              </div>
            </div>
          </div>
@@ -239,17 +270,17 @@
import { queryCanvasList } from "@/api/Agent";
import { getAgentSessionDetailsApi } from "@/api/agentSession";
import useClipboard from "vue-clipboard3";

const sessionDetailList = ref([]); //根据会话id出来的会话详情
const sessionList = ref([]); //会话列表
const modalObj = reactive({ add: false });
const dialogId = ref("");
const chatDis = ref(false);
const loading = ref(false);
const loading1= ref(false);
const agentType = ref("1");
const agentTitle = ref("未命名会话");
let chatObj = reactive({});
const isStopChat = ref(false)
const isStopChat = ref(false);
const currIndex = ref(0);
const displayedText = ref(""); // 正在显示的文字
let timer: number | null = null;
@@ -264,48 +295,81 @@
const selectValue = ref("");
const sectionList = ref({});
const uploadList = ref([]);
const uploaditemList = ref([]);
const uploadRef = ref();
const files = ref([]);
const file = ref('');
const fileInput = ref(null);

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


let onFileSelectedLoading = ref(false);
const onFileSelected = (event) => {
  const file = event.target.files[0];
  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);
    uploadWithoutKb(formData).then((res) => {
      // console.log(res);
      if (res.code == 200) {
        console.log(res);
        console.log(uploaditemList.value);
        onFileSelectedLoading.value = false;
        fileInput.value.value = "";
        uploaditemList.value = [];
        Message.success("上传成功");
      } else {
        Message.error("上传失败");
      }
    });
  }
};

const deleteFile = (item) => {
  console.log(uploaditemList.value);
  uploaditemList.value = [];
};

const { toClipboard } = useClipboard();
const copy = async (text) => {
  await toClipboard(text);    //参数为要复制的文本
}
};

const onChange = (fileList) => {
  // files.value = fileList;
};

const submitOne = (e) => {
  e.stopPropagation();
  console.log(files.value);
  uploadRef.value.submit(files.value.find((x) => x.status === 'init'));
};
// 上传文件
const customRequest = async(option) => {
  loading1.value=true;
  const {onProgress, onError, onSuccess, fileItem, name} = option

  const { code, data } = await getSessionDetailsApi(activeSessionId.value);
  if (code === 200) {
    console.log(data, "详情");
    if (fileItem.file) {
      const formData = new FormData();
      formData.append('file', fileItem.file);
      formData.append('conversation_id', data.id);
      uploadWithoutKb(formData).then((res) => {
const customRequest = async (option) => {
  const { onProgress, onError, onSuccess, fileItem, name } = option;
  fileItem.status = "ready";
  if (fileItem.file) {
    const formData = new FormData();
    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);
        uploadList.value = [];
        if (res.code == 200) {
          console.log(res);
          loading1.value=false;
        }
      });
    }
        console.log(uploadList.value);
        fileItem.status = "done";
        // uploadList.value = [];
      } else {
        fileItem.status = "error";
      }
    });
  }

}

};


const DialogList = async () => {
@@ -385,10 +449,10 @@
  });
  console.log(dialogObj.type, "dialogObj");
  if (dialogObj.type == 1) {
    agentType.value = '1';
    agentType.value = "1";
    querySessionList();
  } else {
    agentType.value = '2';
    agentType.value = "2";
    queryAgentSessionList();
  }

@@ -401,8 +465,8 @@
};
// 重新生成
const reGenerate = () => {
  let inputContent = sessionDetailList.value[sessionDetailList.value.length-2].content
  startChat(inputContent)
  let inputContent = sessionDetailList.value[sessionDetailList.value.length - 2].content;
  startChat(inputContent);
};

const sendMessage = async (event) => {
@@ -427,7 +491,7 @@

      if (inputMsg.value) {

        startChat(inputMsg.value)
        startChat(inputMsg.value);

        inputMsg.value = "";
      } else {
@@ -437,7 +501,7 @@
  }
};

const startChat = async(valMsg)=>{
const startChat = async (valMsg) => {
  chatDis.value = true;
  loading.value = true;
  sessionDetailList.value.push({
@@ -497,33 +561,33 @@
  // querySessionList();
  chatDis.value = false;
  loading.value = false;
}
};

const stopChat=async()=>{
const stopChat = async () => {
  // const { code, data } = await stopChatApi(activeSessionId.value);
  // if (code === 200) {
  //   Message.success("已停止");
  //   queryNewSessionDetail(activeSessionId.value);
  // }
  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 = [{
    content: inputText,
    role: "user"
  },{
  }, {
    content: displayedText.value,
    role: "assistant"
  }]
  sessionDetailList.value = sessionDetailList.value.splice(0, sessionDetailList.value.length-2).concat(lastArr);
  console.log(sessionDetailList.value, 'sessionDetailList2');
  console.log(chatObj, 'chatObj对象');
  }];
  sessionDetailList.value = sessionDetailList.value.splice(0, sessionDetailList.value.length - 2).concat(lastArr);
  console.log(sessionDetailList.value, "sessionDetailList2");
  console.log(chatObj, "chatObj对象");
  chatObj.message = chatObj.message.concat(lastArr);
    // clearTimeout(timer!);
    // timer = null;
  // clearTimeout(timer!);
  // timer = null;
  // const { code, data } = await addSessionApi(chatObj);
  // if (data) {
  //   //停止定时器
@@ -534,7 +598,7 @@
  // }


}
};

const queryNewSessionDetail = async (id) => {
  activeSessionId.value = id;
@@ -798,15 +862,17 @@
    }

    .chat_bottom {
      display: flex;
      align-items: center;
      //display: flex;
      //align-items: center;
      width: 78%;
      margin: 0 auto;
      position: relative;

      .center-bottom {
        // position: absolute;
        // width: 90%;
        // bottom: 20px;
        // left: 5%;
        //position: absolute;
        //width: 100%;
        //bottom: 20px;
        //left: 5%;
        background: #fff;
        border: 1px solid #00000014;
        border-radius: 24px;
@@ -823,7 +889,7 @@
        .btn-send {
          position: absolute !important;
          right: 10px;
          top: 110px;
          top: 90px;
          z-index: 10;
        }

@@ -948,7 +1014,12 @@
  transition: all 0.1s ease;
  font-size: 12px;
}

.action:hover {
  background: var(--color-fill-3);
}

:deep(.arco-upload-list-item-operation) {
  //display: none;
}
</style>