|
@@ -97,6 +97,7 @@
|
|
|
在对方关注或回复你之前,您只可以发送一条消息
|
|
|
</div>
|
|
|
</template>
|
|
|
+ <!-- 左侧消息 -->
|
|
|
<template v-else>
|
|
|
<template v-if="item.messageType == 0 && item.messageContent">
|
|
|
<!-- 时间 -->
|
|
@@ -110,7 +111,7 @@
|
|
|
</div>
|
|
|
<div class="ml-10">
|
|
|
<div class="text-[#666]">
|
|
|
- {{ item?.showName || item?.object?.showName || curConversiton?.groupRemark }}
|
|
|
+ {{ memberName(item) }}
|
|
|
</div>
|
|
|
<div class="bg-[#eee] py-5 px-10 rounded text-[#333] text-wrap"
|
|
|
style="float:left;max-width: 500px;white-space:pre-wrap;word-wrap: break-word;">
|
|
@@ -170,7 +171,7 @@
|
|
|
<div class="flex-1 flex flex-col justify-end">
|
|
|
<textarea @input="onMsgInput" ref="inputBoxRef" v-model="messageContent" class="pl-10"
|
|
|
style="width:100%;height:95%;resize:none;border:none;outline: none;"
|
|
|
- placeholder="请输入消息,按Enter键或点击发送按钮发送"></textarea>
|
|
|
+ placeholder="请输入消息,按Enter键或点击发送按钮发送" type="text"></textarea>
|
|
|
</div>
|
|
|
<div class="h-full shrink-0 flex flex-col justify-between mr-5 items-end">
|
|
|
<div class="text-[#999]">{{ messageContent?.length }}/5000</div>
|
|
@@ -263,15 +264,13 @@ function getLocalId() {
|
|
|
// 发送文本消息
|
|
|
function sendMessage() {
|
|
|
if (!messageContent.value.trim()) return
|
|
|
- const msgJSONString = JSON.stringify({
|
|
|
- messageContent: messageContent.value
|
|
|
- })
|
|
|
+
|
|
|
const msg = {
|
|
|
getUserId: getUserId.value,
|
|
|
sendUserId: sendUserId.value,
|
|
|
specialUserId: specialUserId.value,
|
|
|
groupId: groupId.value,
|
|
|
- messageContent: messageContent.value,
|
|
|
+ messageContent: inputBoxRef.value.value,
|
|
|
messageType: 0,
|
|
|
noticeType: noticeType.value,
|
|
|
object: {
|
|
@@ -308,7 +307,7 @@ async function getChatHistory(messageId = '') {
|
|
|
|
|
|
if (receive.value.length >= messageCount.value && receive.value.length > 0) return
|
|
|
|
|
|
- if (receive.value.length && !messageId) return
|
|
|
+ // if (receive.value.length && !messageId) return
|
|
|
|
|
|
const query = {
|
|
|
pageSize: pageSize.value,
|
|
@@ -350,17 +349,34 @@ function convertImg(msgJSONString) {
|
|
|
return msgJSONString
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+// 我的名称
|
|
|
function myName(){
|
|
|
if(noticeType.value==2){
|
|
|
for(let i=0;i<groupMemberList.value.length;i++){
|
|
|
- const userPass = groupMemberList.value[i].pass
|
|
|
- if(userPass == user.value.pass){
|
|
|
- return groupMemberList.value[i].groupNickname
|
|
|
+ const {groupNickname,showName,loginName,pass} = groupMemberList.value[i]
|
|
|
+
|
|
|
+ if(pass == user.value.pass){
|
|
|
+ return groupNickname || showName || loginName
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
return user.value.showName
|
|
|
}
|
|
|
+// 群成员名称
|
|
|
+function memberName(member={}){
|
|
|
+ const {pass:p,sendUserId} = member || {}
|
|
|
+ const pass = sendUserId || p
|
|
|
+ if(noticeType.value==2){
|
|
|
+ for(let i=0;i<groupMemberList.value.length;i++){
|
|
|
+ const {groupNickname,showName,loginName} = groupMemberList.value[i]
|
|
|
+ if(groupMemberList.value[i].pass == pass){
|
|
|
+ return groupNickname || showName || loginName || ''
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return curConversiton.value.groupRemark || ''
|
|
|
+}
|
|
|
function showInfoTurnOnOff() {
|
|
|
if (noticeType.value == 1) {
|
|
|
showInfo.value = !showInfo.value
|
|
@@ -416,7 +432,7 @@ function addEventListenerMessage() {
|
|
|
messageBoxRef.value.removeEventListener('scroll', () => { })
|
|
|
|
|
|
messageBoxRef.value.addEventListener('scroll', (e) => {
|
|
|
-
|
|
|
+ console.log(messageBoxRef.value.scrollTop,messageBoxRef.value.scrollHeight)
|
|
|
if (messageBoxRef.value.scrollTop == 0 && receive.value[0]?.id) {
|
|
|
console.log('滚动到顶部了')
|
|
|
console.log(receive.value[0].id)
|
|
@@ -525,30 +541,32 @@ async function getGroupMembers(){
|
|
|
const query = {
|
|
|
groupId: groupId.value
|
|
|
}
|
|
|
- const { data } = await request('/website/tourGroup/getGroupInfoAndMemberByGroupId', { query })
|
|
|
- const { memberList } = data || {}
|
|
|
-
|
|
|
- if (Array.isArray(memberList)) {
|
|
|
- groupMemberList.value = memberList
|
|
|
+ const { data } = await request('/website/tourMember/getGroupUserListVo', { query })
|
|
|
+
|
|
|
+ if (Array.isArray(data)) {
|
|
|
+ groupMemberList.value = data
|
|
|
}
|
|
|
+ console.log(groupMemberList.value)
|
|
|
}
|
|
|
|
|
|
-const newMsgTimer = ref(0)
|
|
|
-function getNewMsg(){
|
|
|
- clearInterval(newMsgTimer.value)
|
|
|
- setInterval(()=>{
|
|
|
- const msgId = receive.value[receive.value.length-1]?.id
|
|
|
- chatStore.getNewMessage(groupId.value,msgId)
|
|
|
- },5000)
|
|
|
-}
|
|
|
+
|
|
|
// 监听当前会话的切换
|
|
|
watch(groupId, async () => {
|
|
|
+ init()
|
|
|
+})
|
|
|
+watch(onNewMessage, () => {
|
|
|
+ console.log('滚',Date.now())
|
|
|
+ console.log(messageBoxRef.value.scrollTop,messageBoxRef.value.scrollHeight)
|
|
|
+ return
|
|
|
+ nextTick(()=>{
|
|
|
+ messageBoxRef.value.scrollTop = messageBoxRef.value.scrollHeight + 1000
|
|
|
+ })
|
|
|
+
|
|
|
+
|
|
|
+})
|
|
|
+async function init(){
|
|
|
// 消息置空
|
|
|
receive.value = []
|
|
|
-
|
|
|
- // 获取前会话用户的聊天记录
|
|
|
- getChatHistory()
|
|
|
-
|
|
|
//隐藏右侧信息
|
|
|
if (noticeType.value == 2) {
|
|
|
showInfo.value = true
|
|
@@ -566,24 +584,20 @@ watch(groupId, async () => {
|
|
|
// 获取与当前会话用户的关注状态
|
|
|
isFollow()
|
|
|
|
|
|
- // 清除未读消息
|
|
|
- chatStore.updateRead(groupId.value)
|
|
|
-
|
|
|
// 如果是群聊天的话,获取群成员列表
|
|
|
- getGroupMembers()
|
|
|
+ await getGroupMembers()
|
|
|
|
|
|
-})
|
|
|
-watch(onNewMessage, () => {
|
|
|
- messageBoxRef.value && (messageBoxRef.value.scrollTop = messageBoxRef.value.scrollHeight + 100000)
|
|
|
-})
|
|
|
-onMounted(() => {
|
|
|
+ // 获取前会话用户的聊天记录
|
|
|
getChatHistory()
|
|
|
- addEventListenerTextarea()
|
|
|
- addEventListenerMessage()
|
|
|
- isFollow()
|
|
|
+
|
|
|
+ // 清除未读消息
|
|
|
+ chatStore.updateRead(groupId.value)
|
|
|
+}
|
|
|
+onMounted(() => {
|
|
|
+ init()
|
|
|
})
|
|
|
onBeforeUnmount(()=>{
|
|
|
- clearInterval(newMsgTimer.value)
|
|
|
+
|
|
|
})
|
|
|
</script>
|
|
|
<style scoped lang="scss">
|