diff --git a/pages/index/detail.vue b/pages/index/detail.vue index a25d4aa..ecb6d29 100644 --- a/pages/index/detail.vue +++ b/pages/index/detail.vue @@ -55,6 +55,7 @@ height: isExpanded ? 'calc(100% - 350rpx)' : 'calc(100% - 250rpx)', }" class="chatlist" + id="scrollView" ref="scrollView" @click="clickContent" > @@ -76,7 +77,7 @@ : '/static/left_user.png' " class="img" - /> + />{{ isExpanded }} @@ -228,14 +229,15 @@ export default { }; }, onLoad(options) { + console.log(options) let params = options; - params.deptId = "3702000000"; - params.id = "37020017609"; - params.sectionId = "37020017609"; - params.roadName = "023县道"; - params.taskId = "000001"; - params.userId = "admin1"; - this.params = params; + // params.deptId = "3702000000"; + // params.id = "37020017609"; + // params.sectionId = "37020017609"; + // params.roadName = "023县道"; + // params.taskId = "000001"; + // params.userId = "admin1"; + // this.params = params; let str = ""; if (params.roadName) { str += "路段名:" + params.roadName; @@ -297,7 +299,7 @@ export default { id: this.params.id, taskId: this.params.taskId, sectionId: this.params.sectionId, - // sectionType: this.params.sectionType, + sectionType: this.params.sectionType, }), signal: ctrl.signal, openWhenHidden: true, @@ -443,16 +445,12 @@ export default { }; this.msgList.push(newQuestion); // 将问题添加到消息列表 // this.$store.commit('setMSg_List', this.msgList); - this.scrollBottom(); + }, scrollBottom() { - uni.createSelectorQuery().in(this).select('#scroll-view-content').boundingClientRect((res)=>{ - let top = res.height-this.scrollViewHeight; - if(top>0){ - this.scrollTop=top; - } - }).exec() - // this.$nextTick(() => { + + + this.$nextTick(() => { // const height = // this.$refs.scrollView && // this.$refs.scrollView.$refs && @@ -460,7 +458,8 @@ export default { // ? this.$refs.scrollView.$refs.content.scrollHeight // : 0; // this.scrollTop = height; - // }); + this.scrollTop = this.scrollTop + 1 + }); }, // 发送 handleSend(text) { @@ -512,15 +511,7 @@ export default { this.msgList[this.msgList.length - 1].data = newdata; } index += 1; - this.$nextTick(() => { - const height = - this.$refs.scrollView && - this.$refs.scrollView.$refs && - this.$refs.scrollView.$refs.content - ? this.$refs.scrollView.$refs.content.scrollHeight - : 0; - this.scrollTop = height; - }); + this.scrollBottom(); if (newdata == data) { if (optionType == 0 || optionType == 1) { @@ -545,15 +536,7 @@ export default { data, }, ]; - this.$nextTick(() => { - const height = - this.$refs.scrollView && - this.$refs.scrollView.$refs && - this.$refs.scrollView.$refs.content - ? this.$refs.scrollView.$refs.content.scrollHeight - : 0; - this.scrollTop = height; - }); + this.scrollBottom(); } }, diff --git a/pages/knowledge/index.vue b/pages/knowledge/index.vue index 44dff88..3c3ba82 100644 --- a/pages/knowledge/index.vue +++ b/pages/knowledge/index.vue @@ -7,6 +7,7 @@ height: isExpanded ? 'calc(100% - 332rpx)' : 'calc(100% - 210rpx)', }" class="chatlist" + id="scrollView" ref="scrollView" @click="clickContent" > @@ -34,7 +35,7 @@ @@ -161,253 +162,13 @@ export default { this.es = null; } }, - // methods: { - - // async queryChat(voiceText) { - // // console.log(voiceText,"voiceText"); - // this.loading = true; - // const [err, res] = await uni.request({ - // // url: 'http://10.16.3.159:8777/api/local_doc_qa/local_doc_chat', - // url: this.$.chatUrl+'/chat', - // dataType: 'json', - // method: 'POST', - // // responseType: 'arraybuffer', - // headers: { - // // 'Accept': 'text/event-stream', - // 'content-type': 'application/json' - // }, - // data: { - // voiceText, - // "sceneFlag": "", - // "sessionId": this.sessionId, - // "id": this.id, - // "multiType": "", - // "userId": "admin1", - // "deptId": "3702000000", - // "type": '0', - - // "stream": 'false', - // // "user_id": "zzp", - // // "kb_ids": ["KBa80ea15e786241eca70a20f136f4e34c"], - // // "question": "隐患排查流程是什么", - // // "streaming": true, - // // "history": [] - // } - // }); - // console.log(res) - // if (res && res.data && res.data.code == 200) { - // // console.log('request success', res.data) - // const { - // result = {} - // } = res.data; - // const { - // data = {} - // } = result; - // if (data.tabkey - 1 != this.active) { - // this.active = data.tabkey - 1 > 0 ? data.tabkey - 1 : 0; - // } - // if (data.content) { - // this.changeMsgList(data.answerId || '1', data.content); - // } - // this.loading = false; - // } else { - // if (err) { - // console.log('request fail', err.errMsg); - // } - // uni.showToast({ - // title: "查询失败", - // icon: "error", - // duration: 2000 - // }) - // } - // }, - // // 快捷回复 - // handleBtn(text) { - - // this.handleSend(text) - // }, - // // 输入框 - // onKeyInput(event) { - // this.inputValue = event.detail.value - // }, - // // 发送 - // handleSend(text) { - // if (!this.inputValue & !text) { - // uni.showToast({ - // title: "请输入内容", - // icon: "closeempty", - // duration: 2000 - // }) - // } - // this.changeMsgList('0', this.inputValue || text); - // this.queryChat(this.inputValue || text,); - // this.inputValue = ''; - // }, - // // 更新列表信息 - // changeMsgList(answerId, data) { - - // let id = 1; - // if (this.msgList.length > 0) { - // id = this.msgList[this.msgList.length - 1].id + 1; - // } - // if (answerId == '1') { // 后台返回来的消息 - // let newdata = ''; - // let index = 0; - // const timer = setInterval(() => { - // console.log(this.msgList); - // newdata = newdata += data[index] - // if (this.msgList?.filter(item => (item.id == id)).length == 0) { - // this.msgList = [...this.msgList, { - // id, - // answerId, - // data: newdata, - // }]; - // } else { - // this.msgList[this.msgList.length - 1].data = newdata; - // } - // index += 1; - // this.$nextTick(() => { - // const height = this.$refs.scrollView && this.$refs.scrollView.$refs && this - // .$refs.scrollView.$refs.content ? this.$refs.scrollView.$refs.content - // .scrollHeight : 0; - // this.scrollTop = height; - // }) - // if (newdata == data) { - // clearInterval(timer); - // } - // }, 50) - // } else { - // this.msgList = [...this.msgList, { - // id, - // answerId, - // data, - // }]; - // this.$nextTick(() => { - // const height = this.$refs.scrollView && this.$refs.scrollView.$refs && this.$refs - // .scrollView.$refs.content ? this.$refs.scrollView.$refs.content.scrollHeight : 0; - // this.scrollTop = height; - // }) - // } - // }, - // handlePlus() { - // this.isExpanded = !this.isExpanded; - // }, - // clickContent() { - // if (this.isExpanded) { - // this.isExpanded = !this.isExpanded; - // } - // }, - // goToKnowledge() { - // uni.navigateTo({ - // url: `/pages/home/detail?params=${encodeURIComponent(JSON.stringify(item))}` - // }) - // }, - // // 选择图片 - // chooseImage() { - // uni.chooseImage({ - // count: 6, //默认9 - // sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有 - // sourceType: ['album'], //从相册选择 - // success: (res) => { - // if (res.tempFilePaths && res.tempFilePaths.length) { - // let str = ''; - // for (let i = 0; i < res.tempFilePaths.length; i++) { - // str += `![图${i + 1}](${res.tempFilePaths[i]})`; - // } - // this.changeMsgList('0', str); - // this.queryChat(res.tempFilePaths); - // } - // } - // }); - // } - // } methods: { - // 建立SSE长连接 - SSE(voiceText, answerId) { - const ctrl = new AbortController(); - console.log(ctrl.signal); - fetchEventSource($.chatUrl + "/chat", { - method: "POST", - headers: { - "Content-Type": "application/json", - Accept: ["text/event-stream", "application/json"], - }, - body: JSON.stringify({ - voiceText, - deptId: "3702000000", - id: "37020017407", - multiType: "", - sceneFlag: "", - stream: true, - type: "0", - userId: "admin1", - }), - signal: ctrl.signal, - openWhenHidden: true, - onopen: () => {}, - onmessage: (ev) => { - console.log(ev); - this.loading = true; - const res = JSON.parse(ev.data); - if (res?.code == 200 && res.result) { - console.log(res.result.data.tabkey); - console.log(res.result.data); - this.tabkey = res.result.data.tabkey; - if (this.tabkey - 1 != this.active) { - this.active = this.tabkey - 1 > 0 ? this.tabkey - 1 : 0; - } - if (this.msgList.length == 0) { - this.msgList = [ - { - answerId, - data: res.result.data.content, - }, - ]; - } else { - // debugger - //回答 - if (this.msgList[this.msgList.length - 1].answerId == "1") { - //最后一个是回答 - this.msgList[this.msgList.length - 1].data += - res.result.data.content; - } else { - //最后一个是问题 - this.msgList = [ - ...this.msgList, - { - answerId: "1", - data: res.result.data.content, - }, - ]; - } - } - - // debugger - - this.scrollBottom(); - } - }, - onclose: () => { - console.log(1111); - this.loading = false; - - if (this.isExpanded) { - this.isExpanded = !this.isExpanded; - } - }, - onerror(error) { - console.log("error", error); - throw error; - }, - }); - }, - async queryChat(voiceText) { // console.log(voiceText,"voiceText"); this.loading = true; const [err, res] = await uni.request({ // url: 'http://10.16.3.159:8777/api/local_doc_qa/local_doc_chat', - url: $.chatUrl + "/chat", + url: this.$.chatUrl + "/chat", dataType: "json", method: "POST", // responseType: 'arraybuffer', @@ -417,14 +178,13 @@ export default { }, data: { voiceText, - sceneFlag: "", - sessionId: this.sessionId, - id: this.id, + deptId: "3702000000", + id: "37020017407", multiType: "", + sceneFlag: "", + stream: false, + type: "0", userId: "admin1", - deptId: "3702000000", - type: '0', - stream: true, // "user_id": "zzp", // "kb_ids": ["KBa80ea15e786241eca70a20f136f4e34c"], // "question": "隐患排查流程是什么", @@ -432,24 +192,18 @@ export default { // "history": [] }, }); + console.log(res); if (res && res.data && res.data.code == 200) { // console.log('request success', res.data) - const { result = {} } = res.data; - const { data = {} } = result; - if (data.tabkey - 1 != this.active) { - this.active = data.tabkey - 1 > 0 ? data.tabkey - 1 : 0; - } - if (data.content) { - this.changeMsgList( - data.answerId || "1", - data.content, - data.answerOptions - ); + // const { result = {} } = res.data; + // const { data = {} } = result; + // if (data.tabkey - 1 != this.active) { + // this.active = data.tabkey - 1 > 0 ? data.tabkey - 1 : 0; + // } + if (res.data.result) { + this.changeMsgList("1", res.data.result); } this.loading = false; - if (this.isExpanded) { - this.isExpanded = !this.isExpanded; - } } else { if (err) { console.log("request fail", err.errMsg); @@ -461,30 +215,14 @@ export default { }); } }, + // 快捷回复 + handleBtn(text) { + this.handleSend(text); + }, // 输入框 onKeyInput(event) { this.inputValue = event.detail.value; }, - addQuestion(q, answerId) { - const newQuestion = { - answerId, - data: q, - }; - this.msgList.push(newQuestion); // 将问题添加到消息列表 - // this.$store.commit('setMSg_List', this.msgList); - this.scrollBottom(); - }, - scrollBottom() { - this.$nextTick(() => { - const height = - this.$refs.scrollView && - this.$refs.scrollView.$refs && - this.$refs.scrollView.$refs.content - ? this.$refs.scrollView.$refs.content.scrollHeight - : 0; - this.scrollTop = height; - }); - }, // 发送 handleSend(text) { if (!this.inputValue & !text) { @@ -494,20 +232,12 @@ export default { duration: 2000, }); } - if (text || this.inputValue) { - // if (this.params.id == 12121212) { - // this.changeMsgList("0", this.inputValue || text); - // this.queryChat(this.inputValue || text); - // this.scrollBottom(); - // } else { - this.addQuestion(this.inputValue || text, "0"); - this.SSE(this.inputValue || text, "0"); - // } - this.inputValue = ""; - } + this.changeMsgList("0", this.inputValue || text); + this.queryChat(this.inputValue || text); + this.inputValue = ""; }, // 更新列表信息 - changeMsgList(answerId, data, answerOptions) { + changeMsgList(answerId, data) { let id = 1; if (this.msgList.length > 0) { id = this.msgList[this.msgList.length - 1].id + 1; @@ -517,7 +247,6 @@ export default { let newdata = ""; let index = 0; const timer = setInterval(() => { - console.log(this.msgList); newdata = newdata += data[index]; if (this.msgList?.filter((item) => item.id == id).length == 0) { this.msgList = [ @@ -526,7 +255,6 @@ export default { id, answerId, data: newdata, - // options: answerOptions // ['东南西北','东北','东南北','东南西北'] answerOptions }, ]; } else { @@ -534,16 +262,15 @@ export default { } index += 1; this.$nextTick(() => { - const height = - this.$refs.scrollView && - this.$refs.scrollView.$refs && - this.$refs.scrollView.$refs.content - ? this.$refs.scrollView.$refs.content.scrollHeight - : 0; - this.scrollTop = height; + // const height = + // this.$refs.scrollView && + // this.$refs.scrollView.$refs && + // this.$refs.scrollView.$refs.content + // ? this.$refs.scrollView.$refs.content.scrollHeight + // : 0; + this.scrollTop = this.scrollTop + 1; }); if (newdata == data) { - this.msgList[this.msgList.length - 1].options = answerOptions; clearInterval(timer); } }, 50); @@ -557,24 +284,19 @@ export default { }, ]; this.$nextTick(() => { - const height = - this.$refs.scrollView && - this.$refs.scrollView.$refs && - this.$refs.scrollView.$refs.content - ? this.$refs.scrollView.$refs.content.scrollHeight - : 0; - this.scrollTop = height; + // const height = + // this.$refs.scrollView && + // this.$refs.scrollView.$refs && + // this.$refs.scrollView.$refs.content + // ? this.$refs.scrollView.$refs.content.scrollHeight + // : 0; + this.scrollTop = this.scrollTop + 1; }); } }, - handlePlus() { this.isExpanded = !this.isExpanded; }, - // 快捷回复 - handleBtn(text) { - this.handleSend(text); - }, clickContent() { if (this.isExpanded) { this.isExpanded = !this.isExpanded; @@ -582,10 +304,12 @@ export default { }, goToKnowledge() { uni.navigateTo({ - url: "/pages/home/knowledge", - // url: `/pages/home/knowledge?params=${encodeURIComponent(JSON.stringify(this.$route.query.params))}` + url: `/pages/home/detail?params=${encodeURIComponent( + JSON.stringify(item) + )}`, }); }, + // 选择图片 chooseImage() { uni.chooseImage({ @@ -593,24 +317,26 @@ export default { sizeType: ["original", "compressed"], //可以指定是原图还是压缩图,默认二者都有 sourceType: ["album"], //从相册选择 success: async (res) => { - console.log(res) + console.log(res); if (res.tempFilePaths && res.tempFilePaths.length) { let str = ""; - let jsonArr = [] + let jsonArr = []; for (let i = 0; i < res.tempFilePaths.length; i++) { const result = await this.uploadFilePromise(res.tempFilePaths[i]); - let json = JSON.parse(result) + let json = JSON.parse(result); str += `![图${i + 1}](${json.result})`; - jsonArr.push(json.result) + jsonArr.push(json.result); } - console.log(str) + console.log(str); if (this.id == 12121212) { this.changeMsgList("0", str); - this.queryChat(res.tempFilePaths); + this.queryChat(jsonArr); } else { - this.addQuestion(str, "0"); - this.SSE(jsonArr, "0"); + // this.addQuestion(str, "0"); + // this.SSE(jsonArr, "0"); + this.changeMsgList("0", str); + this.queryChat(jsonArr); } } }, @@ -619,16 +345,310 @@ export default { uploadFilePromise(url) { return new Promise((resolve, reject) => { let a = uni.uploadFile({ - url: this.$.baseUrl + '/hiddenDanger/ftp/uploadFileToFtp', // 仅为示例,非真实的接口地址 + url: this.$.baseUrl + "/hiddenDanger/ftp/uploadFileToFtp", // 仅为示例,非真实的接口地址 filePath: url, - name: 'file', + name: "file", success: (res) => { - resolve(res.data) - } + resolve(res.data); + }, }); - }) + }); }, }, + // methods: { + // // 建立SSE长连接 + // SSE(voiceText, answerId) { + // const ctrl = new AbortController(); + // console.log(ctrl.signal); + // fetchEventSource($.chatUrl + "/chat", { + // method: "POST", + // headers: { + // "Content-Type": "application/json", + // Accept: ["text/event-stream", "application/json"], + // }, + // body: JSON.stringify({ + // voiceText, + // deptId: "3702000000", + // id: "37020017407", + // multiType: "", + // sceneFlag: "", + // stream: true, + // type: "0", + // userId: "admin1", + // }), + // signal: ctrl.signal, + // openWhenHidden: true, + // onopen: () => {}, + // onmessage: (ev) => { + // console.log(ev); + // this.loading = true; + // const res = JSON.parse(ev.data); + // if (res?.code == 200 && res.result) { + // console.log(res.result.data.tabkey); + // console.log(res.result.data); + // this.tabkey = res.result.data.tabkey; + // if (this.tabkey - 1 != this.active) { + // this.active = this.tabkey - 1 > 0 ? this.tabkey - 1 : 0; + // } + // if (this.msgList.length == 0) { + // this.msgList = [ + // { + // answerId, + // data: res.result.data.content, + // }, + // ]; + // } else { + // // debugger + // //回答 + // if (this.msgList[this.msgList.length - 1].answerId == "1") { + // //最后一个是回答 + // this.msgList[this.msgList.length - 1].data += + // res.result.data.content; + // } else { + // //最后一个是问题 + // this.msgList = [ + // ...this.msgList, + // { + // answerId: "1", + // data: res.result.data.content, + // }, + // ]; + // } + // } + + // // debugger + + // this.scrollBottom(); + // } + // }, + // onclose: () => { + // console.log(1111); + // this.loading = false; + + // if (this.isExpanded) { + // this.isExpanded = !this.isExpanded; + // } + // }, + // onerror(error) { + // console.log("error", error); + // throw error; + // }, + // }); + // }, + + // async queryChat(voiceText) { + + // // console.log(voiceText,"voiceText"); + // this.loading = true; + // const [err, res] = await uni.request({ + // // url: 'http://10.16.3.159:8777/api/local_doc_qa/local_doc_chat', + // url: $.chatUrl + "/chat", + // dataType: "json", + // method: "POST", + // // responseType: 'arraybuffer', + // headers: { + // // 'Accept': 'text/event-stream', + // "content-type": "application/json", + // }, + // data: { + // voiceText, + // sceneFlag: "", + // sessionId: this.sessionId, + // id: this.id, + // multiType: "", + // userId: "admin1", + // deptId: "3702000000", + // type: '0', + // stream: false, + // // "user_id": "zzp", + // // "kb_ids": ["KBa80ea15e786241eca70a20f136f4e34c"], + // // "question": "隐患排查流程是什么", + // // "streaming": true, + // // "history": [] + // }, + // }); + // if (res && res.data && res.data.code == 200) { + // // console.log('request success', res.data) + // const { result = {} } = res.data; + // const { data = {} } = result; + // if (data.tabkey - 1 != this.active) { + // this.active = data.tabkey - 1 > 0 ? data.tabkey - 1 : 0; + // } + // if (data.content) { + // this.changeMsgList( + // data.answerId || "1", + // data.content, + // data.answerOptions + // ); + // } + // this.loading = false; + // if (this.isExpanded) { + // this.isExpanded = !this.isExpanded; + // } + // } else { + // if (err) { + // console.log("request fail", err.errMsg); + // } + // uni.showToast({ + // title: "查询失败", + // icon: "error", + // duration: 2000, + // }); + // } + // }, + // // 输入框 + // onKeyInput(event) { + // this.inputValue = event.detail.value; + // }, + // addQuestion(q, answerId) { + // const newQuestion = { + // answerId, + // data: q, + // }; + // this.msgList.push(newQuestion); // 将问题添加到消息列表 + // // this.$store.commit('setMSg_List', this.msgList); + // this.scrollBottom(); + // }, + // scrollBottom() { + // this.$nextTick(() => { + // // const height = + // // this.$refs.scrollView && + // // this.$refs.scrollView.$refs && + // // this.$refs.scrollView.$refs.content + // // ? this.$refs.scrollView.$refs.content.scrollHeight + // // : 0; + // this.scrollTop = this.scrollTop + 1; + // }); + // }, + // // 发送 + // handleSend(text) { + // if (!this.inputValue & !text) { + // uni.showToast({ + // title: "请输入内容", + // icon: "closeempty", + // duration: 2000, + // }); + // } + // if (text || this.inputValue) { + // // if (this.params.id == 12121212) { + // this.changeMsgList("0", this.inputValue || text); + // this.queryChat(this.inputValue || text); + // this.scrollBottom(); + // // } else { + // // this.addQuestion(this.inputValue || text, "0"); + // // this.SSE(this.inputValue || text, "0"); + // // } + // this.inputValue = ""; + // } + // }, + // // 更新列表信息 + // changeMsgList(answerId, data, answerOptions) { + // let id = 1; + // if (this.msgList.length > 0) { + // id = this.msgList[this.msgList.length - 1].id + 1; + // } + // if (answerId == "1") { + // // 后台返回来的消息 + // let newdata = ""; + // let index = 0; + // const timer = setInterval(() => { + // newdata = newdata += data[index]; + // if (this.msgList?.filter((item) => item.id == id).length == 0) { + // this.msgList = [ + // ...this.msgList, + // { + // id, + // answerId, + // data: newdata, + // // options: answerOptions // ['东南西北','东北','东南北','东南西北'] answerOptions + // }, + // ]; + // } else { + // this.msgList[this.msgList.length - 1].data = newdata; + // } + // index += 1; + // this.scrollBottom(); + // if (newdata == data) { + // this.msgList[this.msgList.length - 1].options = answerOptions; + // clearInterval(timer); + // } + // }, 50); + // } else { + // this.msgList = [ + // ...this.msgList, + // { + // id, + // answerId, + // data, + // }, + // ]; + // this.scrollBottom(); + // } + // }, + + // handlePlus() { + // this.isExpanded = !this.isExpanded; + // }, + // // 快捷回复 + // handleBtn(text) { + // this.handleSend(text); + // }, + // clickContent() { + // if (this.isExpanded) { + // this.isExpanded = !this.isExpanded; + // } + // }, + // goToKnowledge() { + // uni.navigateTo({ + // url: "/pages/home/knowledge", + // // url: `/pages/home/knowledge?params=${encodeURIComponent(JSON.stringify(this.$route.query.params))}` + // }); + // }, + // // 选择图片 + // chooseImage() { + // uni.chooseImage({ + // count: 6, //默认9 + // sizeType: ["original", "compressed"], //可以指定是原图还是压缩图,默认二者都有 + // sourceType: ["album"], //从相册选择 + // success: async (res) => { + // console.log(res) + // if (res.tempFilePaths && res.tempFilePaths.length) { + // let str = ""; + // let jsonArr = [] + // for (let i = 0; i < res.tempFilePaths.length; i++) { + // const result = await this.uploadFilePromise(res.tempFilePaths[i]); + // let json = JSON.parse(result) + // str += `![图${i + 1}](${json.result})`; + // jsonArr.push(json.result) + // } + + // console.log(str) + // if (this.id == 12121212) { + // this.changeMsgList("0", str); + // this.queryChat(jsonArr); + // } else { + // // this.addQuestion(str, "0"); + // // this.SSE(jsonArr, "0"); + // this.changeMsgList("0", str); + // this.queryChat(jsonArr); + // } + // } + // }, + // }); + // }, + // uploadFilePromise(url) { + // return new Promise((resolve, reject) => { + // let a = uni.uploadFile({ + // url: this.$.baseUrl + '/hiddenDanger/ftp/uploadFileToFtp', // 仅为示例,非真实的接口地址 + // filePath: url, + // name: 'file', + // success: (res) => { + // resolve(res.data) + // } + // }); + // }) + // }, + // }, };