feat: 首页消息列表调整
This commit is contained in:
@@ -25,10 +25,8 @@
|
|||||||
</ChatTopWelcome>
|
</ChatTopWelcome>
|
||||||
|
|
||||||
<view class="area-msg-list-content" v-for="item in chatMsgList" :key="item.msgId" :id="item.msgId">
|
<view class="area-msg-list-content" v-for="item in chatMsgList" :key="item.msgId" :id="item.msgId">
|
||||||
|
|
||||||
<template v-if="item.msgType === MessageRole.AI">
|
<template v-if="item.msgType === MessageRole.AI">
|
||||||
<ChatCardAI class="message-item-ai" :text="item.msg">
|
<ChatCardAI class="message-item-ai" :text="item.msg">
|
||||||
|
|
||||||
</ChatCardAI>
|
</ChatCardAI>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -49,17 +47,17 @@
|
|||||||
</view>
|
</view>
|
||||||
|
|
||||||
<!-- 底部锚点(用于滚动到底部) -->
|
<!-- 底部锚点(用于滚动到底部) -->
|
||||||
<view :id="lastMsgId"></view>
|
<view :id="lastMsgId" class="lastMsgId"></view>
|
||||||
</scroll-view>
|
</scroll-view>
|
||||||
|
|
||||||
<!-- 输入框区域 -->
|
<!-- 输入框区域 -->
|
||||||
<view class="footer-area">
|
<view class="footer-area">
|
||||||
<ChatMoreTips @replySent="handleReply" :itemList="mainPageDataModel.guideWords"></ChatMoreTips>
|
<ChatMoreTips @replySent="handleReply" :itemList="mainPageDataModel.guideWords"></ChatMoreTips>
|
||||||
<ChatQuickAccess @replySent="handleReply"></ChatQuickAccess>
|
<ChatQuickAccess @replySent="handleReplyInstruct"></ChatQuickAccess>
|
||||||
<ChatInputArea
|
<ChatInputArea
|
||||||
v-model:inputMessage="inputMessage"
|
v-model:inputMessage="inputMessage"
|
||||||
:holdKeyboard="holdKeyboard"
|
:holdKeyboard="holdKeyboard"
|
||||||
@send="sendMessage"
|
@send="sendMessageAction"
|
||||||
@noHideKeyboard="handleNoHideKeyboard"
|
@noHideKeyboard="handleNoHideKeyboard"
|
||||||
/>
|
/>
|
||||||
</view>
|
</view>
|
||||||
@@ -99,11 +97,13 @@
|
|||||||
|
|
||||||
const chatMsgList = ref([])
|
const chatMsgList = ref([])
|
||||||
const inputMessage = ref('')
|
const inputMessage = ref('')
|
||||||
|
|
||||||
const activityList = ref([])
|
|
||||||
|
|
||||||
/// 从个渠道获取如二维,没有的时候就返回首页的数据
|
/// 从个渠道获取如二维,没有的时候就返回首页的数据
|
||||||
const sceneId = ref('')
|
const sceneId = ref('')
|
||||||
|
/// agentId 首页接口中获取
|
||||||
|
const agentId = ref('1')
|
||||||
|
/// 会话ID 历史数据接口中获取
|
||||||
|
const conversationId = ref('1931957498711957505')
|
||||||
const mainPageDataModel = ref({})
|
const mainPageDataModel = ref({})
|
||||||
|
|
||||||
// 锚点ID(控制滚动位置)
|
// 锚点ID(控制滚动位置)
|
||||||
@@ -116,41 +116,7 @@
|
|||||||
emits('openDrawer')
|
emits('openDrawer')
|
||||||
console.log('=============打开抽屉')
|
console.log('=============打开抽屉')
|
||||||
}
|
}
|
||||||
|
|
||||||
const handleReply = (text) => {
|
|
||||||
loadMessage(text)
|
|
||||||
scrollToBottom()
|
|
||||||
};
|
|
||||||
|
|
||||||
onLoad(() => {
|
|
||||||
uni.getSystemInfo({
|
|
||||||
success: (res) => {
|
|
||||||
statusBarHeight.value = res.statusBarHeight || 20;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
getMainPageData()
|
|
||||||
})
|
|
||||||
|
|
||||||
const getMainPageData = async() => {
|
|
||||||
const res = await mainPageData(sceneId.value)
|
|
||||||
if(res.code === 0) {
|
|
||||||
mainPageDataModel.value = res.data
|
|
||||||
initData()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const initData = () => {
|
|
||||||
const msg = {
|
|
||||||
msgId: `msg_${0}`,
|
|
||||||
msgType: MessageRole.OTHER,
|
|
||||||
msg: '',
|
|
||||||
}
|
|
||||||
chatMsgList.value.push(msg)
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleTouchEnd = () => {
|
const handleTouchEnd = () => {
|
||||||
// #ifdef MP-WEIXIN
|
// #ifdef MP-WEIXIN
|
||||||
clearTimeout(timer.value)
|
clearTimeout(timer.value)
|
||||||
@@ -164,42 +130,13 @@
|
|||||||
// #endif
|
// #endif
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// 点击输入框、发送按钮时,不收键盘
|
// 点击输入框、发送按钮时,不收键盘
|
||||||
const handleNoHideKeyboard = () => {
|
const handleNoHideKeyboard = () => {
|
||||||
// #ifdef MP-WEIXIN
|
// #ifdef MP-WEIXIN
|
||||||
holdKeyboardFlag.value = false
|
holdKeyboardFlag.value = false
|
||||||
// #endif
|
// #endif
|
||||||
}
|
}
|
||||||
|
|
||||||
// 发送消息
|
|
||||||
const sendMessage = (message) => {
|
|
||||||
console.log("inputMessage list:", message)
|
|
||||||
if (!message.trim()) return;
|
|
||||||
handleNoHideKeyboard()
|
|
||||||
// 发送消息代码
|
|
||||||
loadMessage(message)
|
|
||||||
inputMessage.value = ''
|
|
||||||
scrollToBottom()
|
|
||||||
}
|
|
||||||
|
|
||||||
const loadMessage = (text) => {
|
|
||||||
const newMsg = {
|
|
||||||
msgId: `msg_${chatMsgList.value.length}`,
|
|
||||||
msgType: MessageRole.ME,
|
|
||||||
msg: text,
|
|
||||||
msgContent: {
|
|
||||||
type: MessageType.TEXT,
|
|
||||||
text: text
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
chatMsgList.value.push(newMsg)
|
|
||||||
console.log("发送的新消息:",JSON.stringify(newMsg))
|
|
||||||
|
|
||||||
sendChat(text)
|
|
||||||
}
|
|
||||||
|
|
||||||
const scrollToBottom = () => {
|
const scrollToBottom = () => {
|
||||||
// 短暂指向最新消息的ID(触发滚动)
|
// 短暂指向最新消息的ID(触发滚动)
|
||||||
lastMsgId.value = `${chatMsgList.value[chatMsgList.value.length - 1].msgId}`;
|
lastMsgId.value = `${chatMsgList.value[chatMsgList.value.length - 1].msgId}`;
|
||||||
@@ -211,22 +148,93 @@
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/// 发送普通消息
|
||||||
|
const handleReply = (text) => {
|
||||||
|
sendMessage(text)
|
||||||
|
scrollToBottom()
|
||||||
|
};
|
||||||
|
|
||||||
|
/// 是发送指令
|
||||||
|
const handleReplyInstruct = (text) => {
|
||||||
|
sendMessage(text, true)
|
||||||
|
scrollToBottom()
|
||||||
|
}
|
||||||
|
|
||||||
|
onLoad(() => {
|
||||||
|
uni.getSystemInfo({
|
||||||
|
success: (res) => {
|
||||||
|
statusBarHeight.value = res.statusBarHeight || 20;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
getMainPageData()
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
/// 获取首页数据
|
||||||
|
const getMainPageData = async() => {
|
||||||
|
const res = await mainPageData(sceneId.value)
|
||||||
|
if(res.code === 0) {
|
||||||
|
mainPageDataModel.value = res.data
|
||||||
|
agentId.value = res.data.agentId
|
||||||
|
initData()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/// 初始化数据
|
||||||
|
const initData = () => {
|
||||||
|
const msg = {
|
||||||
|
msgId: `msg_${0}`,
|
||||||
|
msgType: MessageRole.OTHER,
|
||||||
|
msg: '',
|
||||||
|
}
|
||||||
|
chatMsgList.value.push(msg)
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/// 输入区的发送消息事件
|
||||||
|
const sendMessageAction = (inputText) => {
|
||||||
|
console.log("输入消息:", inputText)
|
||||||
|
if (!inputText.trim()) return;
|
||||||
|
handleNoHideKeyboard()
|
||||||
|
sendMessage(inputText)
|
||||||
|
inputMessage.value = ''
|
||||||
|
scrollToBottom()
|
||||||
|
}
|
||||||
|
|
||||||
|
const sendMessage = (message, isInstruct = false) => {
|
||||||
|
const newMsg = {
|
||||||
|
msgId: `msg_${chatMsgList.value.length}`,
|
||||||
|
msgType: MessageRole.ME,
|
||||||
|
msg: message,
|
||||||
|
msgContent: {
|
||||||
|
type: MessageType.TEXT,
|
||||||
|
text: message
|
||||||
|
}
|
||||||
|
}
|
||||||
|
chatMsgList.value.push(newMsg)
|
||||||
|
sendChat(message, isInstruct)
|
||||||
|
console.log("发送的新消息:",JSON.stringify(newMsg))
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
let loadingTimer = null;
|
let loadingTimer = null;
|
||||||
let typeWriterTimer = null;
|
let typeWriterTimer = null;
|
||||||
let aiMsgBuffer = ''; // 全局缓冲区
|
let aiMsgBuffer = ''; // 全局缓冲区
|
||||||
let isTyping = false; // 是否正在打字
|
let isTyping = false; // 是否正在打字
|
||||||
|
|
||||||
const sendChat = (text) => {
|
/// 发送获取AI聊天消息
|
||||||
|
const sendChat = (message, isInstruct = false) => {
|
||||||
console.log('=============会话测试')
|
|
||||||
const args = {
|
const args = {
|
||||||
conversationId: "1931957498711957505",
|
conversationId: conversationId.value,
|
||||||
agentId: "1",
|
agentId: agentId.value,
|
||||||
messageType: 0,
|
messageType: isInstruct ? 1 : 0,
|
||||||
messageContent: text
|
messageContent: message
|
||||||
}
|
}
|
||||||
|
|
||||||
// 1. 插入AI消息
|
// 插入AI消息
|
||||||
const aiMsg = {
|
const aiMsg = {
|
||||||
msgId: `msg_${chatMsgList.value.length}`,
|
msgId: `msg_${chatMsgList.value.length}`,
|
||||||
msgType: MessageRole.AI,
|
msgType: MessageRole.AI,
|
||||||
|
|||||||
@@ -71,6 +71,11 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.lastMsgId {
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
.footer-area {
|
.footer-area {
|
||||||
width: 100vw;
|
width: 100vw;
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
|
|||||||
Reference in New Issue
Block a user