|
|
|
<template>
|
|
|
|
<view class="content">
|
|
|
|
<scroll-view scroll-y scroll-x show-scrollbar scroll-with-animation :style="{
|
|
|
|
paddingBottom: '20px',
|
|
|
|
height: screenHeight - bottomHeight - statusbarHeight - 148 + 'px',
|
|
|
|
position: 'relative'
|
|
|
|
}" class="scrollView" :scroll-top="scrollTopHeight" :scroll-into-view="getScrollView">
|
|
|
|
<view id="scroll-view-content">
|
|
|
|
<dialogue :chatLog="chatLog" :projectConfig="projectConfig" :userinfo="userinfo" ref="dialogueRef"
|
|
|
|
@clickKeywordSearch="clickKeywordSearch" />
|
|
|
|
</view>
|
|
|
|
</scroll-view>
|
|
|
|
<dialogue :chatLog="chatLog" :projectConfig=" projectConfig" :userinfo="userinfo"
|
|
|
|
@clickKeywordSearch="clickKeywordSearch" />
|
|
|
|
<bottom-bar bgColor="#151419" :height="height">
|
|
|
|
<view class="bottom-wrap">
|
|
|
|
<image class="menu-icon" src="/static/images/menu.png" @click="isShowPopup=true"></image>
|
|
|
|
<u-search placeholder="请输入消息..." v-model="dialogueVal" shape="square" bgColor="#242228"
|
|
|
|
:actionStyle="{color:'#f7dcbd'}" @search="fetchStartConversation(dialogueVal)" actionText="发送"
|
|
|
|
@custom="fetchStartConversation(dialogueVal)"></u-search>
|
|
|
|
<u-search placeholder="请输入信息..." v-model="dialogueVal" searchIconSize="0" shape="square" bgColor="#242228"
|
|
|
|
:actionStyle="{color:'#f7dcbd'}" :disabled="disabled" @search="fetchStartConversation(dialogueVal)"
|
|
|
|
actionText="发送" color="#fff" placeholderColor="#fff" @custom="fetchStartConversation(dialogueVal)"></u-search>
|
|
|
|
</view>
|
|
|
|
</bottom-bar>
|
|
|
|
<bottom-popup :isShow=" isShowPopup" @closePopup="isShowPopup=false" :userinfo="userinfo"
|
|
...
|
...
|
@@ -26,7 +18,7 @@ |
|
|
|
<script setup>
|
|
|
|
import { EventSourcePolyfill } from 'event-source-polyfill';
|
|
|
|
|
|
|
|
import { computed, ref, watchEffect } from 'vue'
|
|
|
|
import { computed, nextTick, ref, watchEffect } from 'vue'
|
|
|
|
import { onLoad } from '@dcloudio/uni-app'
|
|
|
|
import dialogue from '@/components/dialogue.vue'
|
|
|
|
import bottomBar from '@/components/bottom-bar/bottom-bar.vue'
|
|
...
|
...
|
@@ -41,8 +33,8 @@ |
|
|
|
const isShowPopup = ref(false)
|
|
|
|
const userinfo = ref()
|
|
|
|
const projectConfig = ref()
|
|
|
|
const dialogueRef = ref()
|
|
|
|
const height = ref('104rpx')
|
|
|
|
const disabled = ref(false)
|
|
|
|
watchEffect(() => {
|
|
|
|
if (uni.getStorageSync('token')) {
|
|
|
|
fetchRecord()
|
|
...
|
...
|
@@ -50,11 +42,31 @@ |
|
|
|
fetchConfig()
|
|
|
|
}
|
|
|
|
})
|
|
|
|
|
|
|
|
function getElementScollTop() {
|
|
|
|
nextTick(() => {
|
|
|
|
setTimeout(() => {
|
|
|
|
uni.pageScrollTo({
|
|
|
|
scrollTop: 99999999999999999999, //滚动到页面的目标位置（单位px）
|
|
|
|
})
|
|
|
|
}, 200)
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
nextTick(() => {
|
|
|
|
setTimeout(() => {
|
|
|
|
uni.pageScrollTo({
|
|
|
|
scrollTop: 99999999999999999999, //滚动到页面的目标位置（单位px）
|
|
|
|
})
|
|
|
|
}, 200)
|
|
|
|
})
|
|
|
|
|
|
|
|
const chatLog = ref([])
|
|
|
|
|
|
|
|
async function fetchStartConversation(message) {
|
|
|
|
if (!message || isNull(message)) return showToast('请输入消息，消息不能为空哦~')
|
|
|
|
chatLog.value.push({ message: dialogueVal.value, response: '' })
|
|
|
|
getElementScollTop()
|
|
|
|
let source = new EventSourcePolyfill(
|
|
|
|
`http://aladmin.shs.broing.cn/api/message/sendText2?message=${message}`, {
|
|
|
|
headers: {
|
|
...
|
...
|
@@ -64,44 +76,30 @@ |
|
|
|
}
|
|
|
|
})
|
|
|
|
source.onopen = function(e) {
|
|
|
|
getElementScollTop()
|
|
|
|
disabled.value = true
|
|
|
|
// console.log('开始流式监听', e)
|
|
|
|
};
|
|
|
|
source.onmessage = function(event) {
|
|
|
|
console.log('onmessage', event.data)
|
|
|
|
disabled.value = true
|
|
|
|
// console.log('onmessage', event.data)
|
|
|
|
chatLog.value[chatLog.value.length - 1].response = chatLog.value[chatLog.value.length - 1].response.concat(
|
|
|
|
event.data).replaceAll('<br/>', ' ').replaceAll('undefined', ' ')
|
|
|
|
};
|
|
|
|
|
|
|
|
source.onerror = function(err) {
|
|
|
|
getElementScollTop()
|
|
|
|
disabled.value = false
|
|
|
|
source.close();
|
|
|
|
};
|
|
|
|
|
|
|
|
dialogueVal.value = ''
|
|
|
|
fetchUserinfo()
|
|
|
|
if (res.msg === '您的会话次数不足') showToast(`${res.msg}`)
|
|
|
|
}
|
|
|
|
|
|
|
|
onLoad(() => {
|
|
|
|
uni.getSystemInfo({
|
|
|
|
success: function(res) {
|
|
|
|
console.log(res, '------------')
|
|
|
|
}
|
|
|
|
})
|
|
|
|
})
|
|
|
|
|
|
|
|
// 页面滚动到底部
|
|
|
|
function scrollToBottom() {
|
|
|
|
uni.createSelectorQuery().in(s).select('#scroll-view-content').boundingClientRect((res) => {
|
|
|
|
let top = res.height - (s.screenHeight - s.bottomHeight - 140);
|
|
|
|
if (top > 0) {
|
|
|
|
this.scrollTopHeight = top;
|
|
|
|
}
|
|
|
|
}).exec()
|
|
|
|
}
|
|
|
|
|
|
|
|
// 点击关键词进行搜索
|
|
|
|
function clickKeywordSearch(e) {
|
|
|
|
dialogueVal.value = e
|
|
|
|
// dialogueVal.value = e
|
|
|
|
fetchStartConversation(e)
|
|
|
|
}
|
|
|
|
|
|
...
|
...
|
@@ -138,23 +136,17 @@ |
|
|
|
|
|
|
|
<style lang="scss">
|
|
|
|
page {
|
|
|
|
padding-bottom: 208rpx;
|
|
|
|
|
|
|
|
padding-bottom: 104rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.scrollView {
|
|
|
|
position: fixed;
|
|
|
|
right: 0px;
|
|
|
|
left: 0;
|
|
|
|
top: 0;
|
|
|
|
/* padding-left: 10px;
|
|
|
|
padding-right: 10px;
|
|
|
|
padding-top: 10px; */
|
|
|
|
width: auto;
|
|
|
|
::v-deep .u-popup__content {
|
|
|
|
background: #000 !important;
|
|
|
|
margin: 0 auto;
|
|
|
|
}
|
|
|
|
|
|
|
|
.content {
|
|
|
|
@include wrap();
|
|
|
|
overflow: scroll;
|
|
|
|
height: auto !important;
|
|
|
|
margin-top: 40rpx;
|
|
|
|
}
|
...
|
...
|
|
