|
@@ -5,10 +5,22 @@
|
|
|
<el-tab-pane
|
|
|
v-for="item in qwUserList"
|
|
|
:key="item.id"
|
|
|
- :label="item.qwUserId"
|
|
|
- :name="item.appKey"/>
|
|
|
+ :name="item.appKey">
|
|
|
+ <span slot="label">
|
|
|
+ <el-badge :value="getUnreadCount(item.appKey)"
|
|
|
+ :max="99"
|
|
|
+ v-if="getUnreadCount(item.appKey) > 0">
|
|
|
+ {{ item.qwUserName }}
|
|
|
+ </el-badge>
|
|
|
+ <template v-else>
|
|
|
+ {{ item.qwUserName }}
|
|
|
+ </template>
|
|
|
+ </span>
|
|
|
+ </el-tab-pane>
|
|
|
</el-tabs>
|
|
|
|
|
|
+ <i class="el-icon-close" @click="handleClose" style="font-size: 22px;position: absolute;top: 8px;right: 8px;cursor: pointer;"/>
|
|
|
+
|
|
|
<div class="imui-center qq-lemon-imui" v-show="showQW">
|
|
|
<lemon-imui class="lemon-slot"
|
|
|
:width="isMaximized ? '100vw' : windowWidth"
|
|
@@ -31,7 +43,7 @@
|
|
|
@pick-image="handleImageClick"
|
|
|
@send="handleSend">
|
|
|
<template #sidebar-message-top>
|
|
|
- <div style="padding: 8px;">
|
|
|
+ <div style="padding: 8px; display: flex; align-items: center;">
|
|
|
<el-input
|
|
|
v-model="searchKeyword"
|
|
|
prefix-icon="el-icon-search"
|
|
@@ -39,21 +51,50 @@
|
|
|
size="small"
|
|
|
clearable
|
|
|
@input="handleSearch"
|
|
|
- style="width: 100%;"
|
|
|
+ style="flex: 1;height: 32px;"
|
|
|
/>
|
|
|
+ <el-popover
|
|
|
+ placement="bottom-end"
|
|
|
+ width="200"
|
|
|
+ v-model="filterPopoverVisible"
|
|
|
+ trigger="click"
|
|
|
+ >
|
|
|
+ <!-- 这里放你的过滤选项内容 -->
|
|
|
+ <div>
|
|
|
+ <el-checkbox-group v-model="selectedFilters">
|
|
|
+ <el-checkbox label="1">去掉重粉</el-checkbox>
|
|
|
+ <el-checkbox label="2">去掉小黑屋</el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+ <div style="margin-top: 10px; text-align: right;">
|
|
|
+ <el-button size="mini" type="primary" @click="applyFilter">确定</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <el-button
|
|
|
+ slot="reference"
|
|
|
+ icon="el-icon-setting"
|
|
|
+ style="padding: 8px;height: 32px;"
|
|
|
+ size="small"
|
|
|
+ :type="selectedFilters.length > 0 ? 'primary' : 'default'"
|
|
|
+ ></el-button>
|
|
|
+ </el-popover>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template #message-title="contact">
|
|
|
<!-- <div @click="openDrawer('right')" style="position: absolute;right: 14px;top: 10px;">-->
|
|
|
<!-- <i class="el-icon-more" style="cursor: pointer"/>-->
|
|
|
<!-- </div>-->
|
|
|
- <div>
|
|
|
- <el-button
|
|
|
- type="primary"
|
|
|
- size="small"
|
|
|
- style="position: absolute;right: 14px;top: 10px;z-index: 1000"
|
|
|
- @click="showDetail(contact.extId)"
|
|
|
- >详情</el-button>
|
|
|
+<!-- <div>-->
|
|
|
+<!-- <el-button-->
|
|
|
+<!-- type="primary"-->
|
|
|
+<!-- size="small"-->
|
|
|
+<!-- style="position: absolute;right: 14px;top: 10px;z-index: 1000"-->
|
|
|
+<!-- @click="showDetail(contact.extId)"-->
|
|
|
+<!-- >详情</el-button>-->
|
|
|
+<!-- </div>-->
|
|
|
+ </template>
|
|
|
+ <template #message-extend="contact">
|
|
|
+ <div v-if="contact.extId" style="width: 100%;height: 100%;overflow: auto">
|
|
|
+ <userDetail :ext-id="contact.extId" :extend="true" ref="userDetail" />
|
|
|
</div>
|
|
|
</template>
|
|
|
</lemon-imui>
|
|
@@ -100,8 +141,9 @@ import {getToken} from '@/utils/auth'
|
|
|
import {uploadOss} from "@/api/common";
|
|
|
import {mapState} from "vuex";
|
|
|
import {generateUUID} from "@/components/LemonUI/utils";
|
|
|
+import {getTime} from "@/utils";
|
|
|
+import notificationMp3 from '@/assets/voice/new-notification.mp3'
|
|
|
|
|
|
-let pages = {};
|
|
|
export default {
|
|
|
name: "qqChat",
|
|
|
components: {
|
|
@@ -150,8 +192,8 @@ export default {
|
|
|
roomMembers:[],
|
|
|
roomAdmins:[],
|
|
|
roomInfo:null,
|
|
|
- windowWidth: document.documentElement.clientWidth*0.6, //实时屏幕宽度
|
|
|
- windowHeight: document.documentElement.clientHeight*0.7, //实时屏幕高度
|
|
|
+ windowWidth: document.documentElement.clientWidth * 0.8, //实时屏幕宽度
|
|
|
+ windowHeight: document.documentElement.clientHeight * 0.85, //实时屏幕高度
|
|
|
queryParams: {
|
|
|
pageNum: 1,
|
|
|
pageSize: 10,
|
|
@@ -165,29 +207,53 @@ export default {
|
|
|
imSocket: null,
|
|
|
imUrl: process.env.VUE_APP_IM_WS_URL,
|
|
|
searchKeyword: '',
|
|
|
+ filterPopoverVisible: false,
|
|
|
+ selectedFilters: [],
|
|
|
+ // 存储每个企微账号的会话记录和状态
|
|
|
+ qwUserSessions: {},
|
|
|
+ // 存储每个企微账号的分页信息
|
|
|
+ qwUserPages: {},
|
|
|
+ // 公司ID,用于WebSocket连接
|
|
|
+ companyId: null,
|
|
|
+ // 存储每个企微账号的未读消息数
|
|
|
+ qwUserUnreadCount: [],
|
|
|
};
|
|
|
},
|
|
|
created(){
|
|
|
+ // 初始化企微账号会话页码对象
|
|
|
+ this.qwUserPages = {};
|
|
|
+
|
|
|
//获取企微列表
|
|
|
getQwUserList().then(response => {
|
|
|
this.qwUserList = response.data;
|
|
|
if (this.qwUserList.length>0){
|
|
|
this.qwUser = this.qwUserList[0];
|
|
|
this.appKey = this.qwUser.appKey;
|
|
|
+ this.companyId = this.qwUser.companyId; // 保存公司ID用于WebSocket连接
|
|
|
this.setQwUserInfo();
|
|
|
this.getConversation();
|
|
|
- this.initImSocket(this.qwUser.companyId)
|
|
|
+
|
|
|
+ // 初始化单个WebSocket连接
|
|
|
+ this.initImSocket();
|
|
|
+
|
|
|
+ // 初始化未读消息数
|
|
|
+ this.initUnreadCount();
|
|
|
}else {
|
|
|
this.qwUser={};
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
computed: {
|
|
|
- ...mapState('qwIm', ['shareCourse'])
|
|
|
+ ...mapState('qwIm', ['shareCourse']),
|
|
|
+ // 计算所有企微账号的未读消息总数
|
|
|
+ totalUnreadCount() {
|
|
|
+ return this.qwUserUnreadCount.reduce((sum, item) => sum + item.unreadCount, 0);
|
|
|
+ },
|
|
|
},
|
|
|
watch: {
|
|
|
showQw(nv, ov) {
|
|
|
if (nv) {
|
|
|
+ this.clearUnreadCount(this.appKey)
|
|
|
this.$nextTick(() => {
|
|
|
this.$refs.IMUI.messageViewToBottom();
|
|
|
});
|
|
@@ -221,6 +287,13 @@ export default {
|
|
|
null
|
|
|
);
|
|
|
}
|
|
|
+ },
|
|
|
+ // 监听未读消息数变化
|
|
|
+ qwUserUnreadCount: {
|
|
|
+ handler() {
|
|
|
+ this.$store.dispatch('qwIm/totalUnreadCount', this.totalUnreadCount)
|
|
|
+ },
|
|
|
+ deep: true // 深度监听对象内部变化
|
|
|
}
|
|
|
},
|
|
|
mounted() {
|
|
@@ -244,49 +317,197 @@ export default {
|
|
|
])
|
|
|
},
|
|
|
beforeDestroy() {
|
|
|
+ // 关闭WebSocket连接
|
|
|
if (this.imSocket) {
|
|
|
this.imSocket.close();
|
|
|
+ this.imSocket = null;
|
|
|
}
|
|
|
+ this.clearSessionCache()
|
|
|
},
|
|
|
methods: {
|
|
|
- initImSocket(companyId) {
|
|
|
- this.imSocket = new ImSocket(`${this.imUrl}/${companyId}?token=${getToken()}`);
|
|
|
+ getUnreadCount(appKey) {
|
|
|
+ const index = this.qwUserUnreadCount.findIndex(entry => entry.appKey === appKey);
|
|
|
+ return index !== -1 ? this.qwUserUnreadCount[index].unreadCount : 0;
|
|
|
+ },
|
|
|
+ // 清除会话缓存
|
|
|
+ clearSessionCache() {
|
|
|
+ this.qwUserSessions = {};
|
|
|
+ this.qwUserPages = {};
|
|
|
+ },
|
|
|
+
|
|
|
+ // 初始化WebSocket连接
|
|
|
+ initImSocket() {
|
|
|
+ // 如果已经有连接,先关闭
|
|
|
+ if (this.imSocket) {
|
|
|
+ this.imSocket.close();
|
|
|
+ }
|
|
|
+
|
|
|
+ // 创建新的WebSocket连接,使用公司ID
|
|
|
+ this.imSocket = new ImSocket(`${this.imUrl}/${this.companyId}?token=${getToken()}`);
|
|
|
+
|
|
|
+ // 处理接收到的消息
|
|
|
this.imSocket.onMessage(data => {
|
|
|
const { IMUI } = this.$refs;
|
|
|
- let message = JSON.parse(data);
|
|
|
- this.appendRemoteMessage(message)
|
|
|
-
|
|
|
- let conversation = IMUI.findConversation(message.toContactId);
|
|
|
- if (conversation.msgId) {
|
|
|
- conversation.lastSendTime = message.sendTime;
|
|
|
- conversation.lastContent = IMUI.lastContentRender(message)//message.content;
|
|
|
- IMUI.topPopConversations(conversation);
|
|
|
+ try {
|
|
|
+ let message = JSON.parse(data);
|
|
|
+ this.appendRemoteMessage(message);
|
|
|
+
|
|
|
+ // 播放声音
|
|
|
+ const audio = new Audio(notificationMp3);
|
|
|
+ audio.play().catch(err => {
|
|
|
+ console.warn("播放声音失败", err);
|
|
|
+ });
|
|
|
+
|
|
|
+ // 确定消息所属的企微账号
|
|
|
+ const messageAppKey = message.appKey;
|
|
|
+
|
|
|
+ // 检查消息是否属于当前企微账号
|
|
|
+ if (messageAppKey === this.appKey) {
|
|
|
+
|
|
|
+ if (!this.showQw) {
|
|
|
+ this.incrementUnreadCount(messageAppKey);
|
|
|
+ }
|
|
|
+
|
|
|
+ let conversation = IMUI.findConversation(message.toContactId);
|
|
|
+ if (conversation) {
|
|
|
+ conversation.lastSendTime = message.sendTime;
|
|
|
+ conversation.lastContent = IMUI.lastContentRender(message);
|
|
|
+ IMUI.topPopConversations(conversation);
|
|
|
+
|
|
|
+ // 更新缓存中的会话记录
|
|
|
+ this.updateSessionConversation(conversation);
|
|
|
+ } else {
|
|
|
+ // 如果找不到会话,可能需要刷新会话列表
|
|
|
+ this.refreshCurrentSession();
|
|
|
+ }
|
|
|
+ } else if (messageAppKey) {
|
|
|
+ // 如果不是当前账号的消息,增加对应账号的未读消息数
|
|
|
+ this.incrementUnreadCount(messageAppKey);
|
|
|
+
|
|
|
+ if (this.qwUserSessions[messageAppKey]) {
|
|
|
+ const index = this.qwUserSessions[messageAppKey].findIndex(
|
|
|
+ item => item.conversationId === message.toContactId
|
|
|
+ );
|
|
|
+
|
|
|
+ if (index !== -1) {
|
|
|
+ let conversation = this.qwUserSessions[messageAppKey][index]
|
|
|
+ conversation.lastSendTime = message.sendTime;
|
|
|
+ conversation.lastContent = IMUI.lastContentRender(message);
|
|
|
+ conversation.unread = conversation.unread + 1;
|
|
|
+ this.qwUserSessions[messageAppKey][index] = {...conversation};
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ console.error("处理WebSocket消息时出错:", error);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 初始化未读消息数
|
|
|
+ initUnreadCount() {
|
|
|
+ // 为每个企微账号初始化未读消息数为0
|
|
|
+ this.qwUserUnreadCount = []; // 先清空
|
|
|
+
|
|
|
+ this.qwUserList.forEach(user => {
|
|
|
+ this.qwUserUnreadCount.push({
|
|
|
+ appKey: user.appKey,
|
|
|
+ qwUserId: user.qwUserId,
|
|
|
+ unreadCount: 0
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ // 增加指定企微账号的未读消息数
|
|
|
+ incrementUnreadCount(appKey) {
|
|
|
+ if (!appKey) {
|
|
|
+ console.error("incrementUnreadCount: appKey不能为空");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 查找对应的企微账号记录
|
|
|
+ const index = this.qwUserUnreadCount.findIndex(item => item.appKey === appKey);
|
|
|
+
|
|
|
+ if (index !== -1) {
|
|
|
+ // 如果找到,则增加未读消息数
|
|
|
+ const newCount = this.qwUserUnreadCount[index].unreadCount + 1;
|
|
|
+ this.$set(this.qwUserUnreadCount[index], 'unreadCount', newCount);
|
|
|
+ } else {
|
|
|
+ // 如果没找到,则添加新记录
|
|
|
+ const user = this.qwUserList.find(u => u.appKey === appKey);
|
|
|
+ if (user) {
|
|
|
+ this.qwUserUnreadCount.push({
|
|
|
+ appKey: appKey,
|
|
|
+ qwUserId: user.qwUserId,
|
|
|
+ unreadCount: 1
|
|
|
+ });
|
|
|
}
|
|
|
- })
|
|
|
+ }
|
|
|
},
|
|
|
+
|
|
|
+ // 清除指定企微账号的未读消息数
|
|
|
+ clearUnreadCount(appKey) {
|
|
|
+ // 查找对应的企微账号记录
|
|
|
+ const index = this.qwUserUnreadCount.findIndex(item => item.appKey === appKey);
|
|
|
+
|
|
|
+ if (index !== -1) {
|
|
|
+ // 如果找到,则清除未读消息数
|
|
|
+ this.$set(this.qwUserUnreadCount[index], 'unreadCount', 0);
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
// 切换企微账号
|
|
|
qwUserChange(tab, event){
|
|
|
this.appKey = tab.name;
|
|
|
let index= this.qwUserList.findIndex(item => item.appKey === tab.name);
|
|
|
this.qwUser=this.qwUserList[index];
|
|
|
- this.getConversation(); //获取会话信息
|
|
|
+
|
|
|
+ // 清除当前账号的未读消息数
|
|
|
+ this.clearUnreadCount(this.appKey);
|
|
|
+
|
|
|
+ // 不需要重新创建WebSocket连接,只需更新当前账号信息
|
|
|
this.setQwUserInfo();
|
|
|
+ this.getConversation(); //获取会话信息
|
|
|
},
|
|
|
setQwUserInfo(){
|
|
|
this.userData.id=this.qwUser.id;
|
|
|
this.userData.displayName=this.qwUser.qwUserName;
|
|
|
- this.userData.avatar="https://cos.his.cdwjyyh.com/fs/20241231/22a765a96da247d1b83ea94fef438a41.png";
|
|
|
+ this.userData.avatar=this.qwUser.avatar;
|
|
|
},
|
|
|
getConversation(){
|
|
|
const IMUI = this.$refs.IMUI;
|
|
|
- getConversations(this.qwUser.id).then(response => {
|
|
|
- this.conversationData = response.data;
|
|
|
- IMUI.initConversations(response.data);
|
|
|
- const fstConversation = this.conversationData[0];
|
|
|
- if(fstConversation) {
|
|
|
- IMUI.changeContact(fstConversation.conversationId);
|
|
|
+
|
|
|
+ // 检查是否已有该企微账号的会话记录缓存
|
|
|
+ if (this.qwUserSessions[this.appKey]) {
|
|
|
+ // 如果有,直接使用缓存的会话记录
|
|
|
+ this.conversationData = this.qwUserSessions[this.appKey];
|
|
|
+ IMUI.initConversations(this.conversationData);
|
|
|
+
|
|
|
+ // 恢复上次选中的会话
|
|
|
+ const lastSelectedConversation = this.qwUserSessions[`${this.appKey}_selected`];
|
|
|
+ if (lastSelectedConversation) {
|
|
|
+ IMUI.changeContact(lastSelectedConversation);
|
|
|
+ } else {
|
|
|
+ // 如果没有上次选中的会话,选择第一个会话
|
|
|
+ const fstConversation = this.conversationData[0];
|
|
|
+ if(fstConversation) {
|
|
|
+ IMUI.changeContact(fstConversation.conversationId);
|
|
|
+ }
|
|
|
}
|
|
|
- });
|
|
|
+ } else {
|
|
|
+ // 如果没有缓存,则从服务器获取会话记录
|
|
|
+ getConversations(this.qwUser.id).then(response => {
|
|
|
+ this.conversationData = response.data;
|
|
|
+
|
|
|
+ // 缓存会话记录
|
|
|
+ this.qwUserSessions[this.appKey] = response.data;
|
|
|
+
|
|
|
+ IMUI.initConversations(response.data);
|
|
|
+ const fstConversation = this.conversationData[0];
|
|
|
+ if(fstConversation) {
|
|
|
+ IMUI.changeContact(fstConversation.conversationId);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
},
|
|
|
messageTimeFormat(time) {
|
|
|
return this.friendlyDate(time);
|
|
@@ -314,23 +535,44 @@ export default {
|
|
|
isEnd=response.data.isLastPage;
|
|
|
next(response.data.list, isEnd);
|
|
|
if(!isEnd){
|
|
|
- pages[contact.conversationId]++;
|
|
|
- this.queryParams.pageNum=pages[contact.conversationId];
|
|
|
+ this.qwUserPages[contact.conversationId]++;
|
|
|
+ this.queryParams.pageNum=this.qwUserPages[contact.conversationId];
|
|
|
this.queryParams.userId = this.qwUser.id
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
handleChangeConversation(conversation, instance) {
|
|
|
- if (!pages[conversation.conversationId]){
|
|
|
- pages[conversation.conversationId] =1;
|
|
|
+ // 保存当前选中的会话ID
|
|
|
+ this.qwUserSessions[`${this.appKey}_selected`] = conversation.conversationId;
|
|
|
+
|
|
|
+ // 检查是否已有该会话的分页信息
|
|
|
+ if (!this.qwUserPages[conversation.conversationId]){
|
|
|
+ this.qwUserPages[conversation.conversationId] =1;
|
|
|
}
|
|
|
- this.queryParams.pageNum=pages[conversation.conversationId];
|
|
|
+
|
|
|
+ this.queryParams.pageNum=this.qwUserPages[conversation.conversationId];
|
|
|
this.queryParams.conversationId=conversation.conversationId;
|
|
|
this.queryParams.userId = this.qwUser.id
|
|
|
+
|
|
|
if(conversation.unread>0){
|
|
|
conversation.unread=0;
|
|
|
instance.updateContact(conversation);
|
|
|
+
|
|
|
+ // 更新缓存中的会话记录
|
|
|
+ this.updateSessionConversation(conversation);
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ // 更新缓存中的会话记录
|
|
|
+ updateSessionConversation(conversation) {
|
|
|
+ if (this.qwUserSessions[this.appKey]) {
|
|
|
+ const index = this.qwUserSessions[this.appKey].findIndex(
|
|
|
+ item => item.conversationId === conversation.conversationId
|
|
|
+ );
|
|
|
+ if (index !== -1) {
|
|
|
+ this.qwUserSessions[this.appKey][index] = {...conversation};
|
|
|
+ }
|
|
|
}
|
|
|
},
|
|
|
handleChangeContact(contact, instance) {
|
|
@@ -394,6 +636,10 @@ export default {
|
|
|
conversation.lastSendTime = message.sendTime;
|
|
|
conversation.lastContent = IMUI.lastContentRender(message)
|
|
|
IMUI.topPopConversations(conversation);
|
|
|
+
|
|
|
+ // 更新缓存中的会话记录
|
|
|
+ this.updateSessionConversation(conversation);
|
|
|
+
|
|
|
next();
|
|
|
} else {
|
|
|
next({status:'failed'})
|
|
@@ -415,6 +661,10 @@ export default {
|
|
|
conversation.lastSendTime = message.sendTime;
|
|
|
conversation.lastContent = IMUI.lastContentRender(message)
|
|
|
IMUI.topPopConversations(conversation);
|
|
|
+
|
|
|
+ // 更新缓存中的会话记录
|
|
|
+ this.updateSessionConversation(conversation);
|
|
|
+
|
|
|
next();
|
|
|
} else {
|
|
|
next({status:'failed'})
|
|
@@ -440,6 +690,9 @@ export default {
|
|
|
conversation.lastSendTime = message.sendTime;
|
|
|
conversation.lastContent = IMUI.lastContentRender(message)
|
|
|
IMUI.topPopConversations(conversation);
|
|
|
+
|
|
|
+ // 更新缓存中的会话记录
|
|
|
+ this.updateSessionConversation(conversation);
|
|
|
}
|
|
|
});
|
|
|
}
|
|
@@ -543,7 +796,7 @@ export default {
|
|
|
appendCustomMessage() {
|
|
|
const { IMUI } = this.$refs;
|
|
|
const message = {
|
|
|
- id: generateRandId(),
|
|
|
+ id: generateUUID(),
|
|
|
status: "succeed",
|
|
|
type: "voice",
|
|
|
sendTime: getTime(),
|
|
@@ -568,7 +821,79 @@ export default {
|
|
|
},
|
|
|
appendRemoteMessage(message) { //从服务端返回的消息
|
|
|
const { IMUI } = this.$refs;
|
|
|
- IMUI.appendMessage(message, true);
|
|
|
+ if (!IMUI) {
|
|
|
+ console.error("IMUI引用不存在,无法添加消息");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ try {
|
|
|
+ // 确保消息对象包含必要的字段
|
|
|
+ if (!message.id) {
|
|
|
+ message.id = generateUUID(); // 使用UUID生成唯一ID
|
|
|
+ }
|
|
|
+
|
|
|
+ if (!message.status) {
|
|
|
+ message.status = "succeed";
|
|
|
+ }
|
|
|
+
|
|
|
+ if (!message.sendTime) {
|
|
|
+ message.sendTime = new Date().getTime();
|
|
|
+ }
|
|
|
+
|
|
|
+ // 根据消息类型处理
|
|
|
+ switch (message.type) {
|
|
|
+ case "text":
|
|
|
+ // 文本消息不需要特殊处理
|
|
|
+ break;
|
|
|
+ case "image":
|
|
|
+ // 确保图片消息有content或url字段
|
|
|
+ if (!message.content && message.url) {
|
|
|
+ message.content = message.url;
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case "voice":
|
|
|
+ // 确保语音消息有content字段
|
|
|
+ if (!message.content) {
|
|
|
+ message.content = "语音消息";
|
|
|
+ }
|
|
|
+ // 添加语音时长
|
|
|
+ if (message.duration) {
|
|
|
+ message.params1 = message.duration.toString();
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case "file":
|
|
|
+ // 确保文件消息有fileName和fileSize字段
|
|
|
+ if (!message.fileName) {
|
|
|
+ message.fileName = "未命名文件";
|
|
|
+ }
|
|
|
+ if (!message.fileSize && message.fileSize !== 0) {
|
|
|
+ message.fileSize = 0;
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case "miniprogram":
|
|
|
+ // 小程序消息处理
|
|
|
+ if (!message.content) {
|
|
|
+ message.content = "小程序卡片";
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ default:
|
|
|
+ console.warn("未知消息类型:", message.type);
|
|
|
+ break;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 添加消息到UI
|
|
|
+ IMUI.appendMessage(message, true);
|
|
|
+
|
|
|
+ // 更新缓存中的会话记录
|
|
|
+ if (message.toContactId && IMUI.conversations) {
|
|
|
+ const conversation = IMUI.findConversation(message.toContactId);
|
|
|
+ if (conversation) {
|
|
|
+ this.updateSessionConversation(conversation);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ console.error("添加远程消息时出错:", error);
|
|
|
+ }
|
|
|
},
|
|
|
handleChangeMenu() {
|
|
|
console.log("Event:change-menu");
|
|
@@ -602,6 +927,30 @@ export default {
|
|
|
});
|
|
|
this.$refs.IMUI.initConversations(filtered);
|
|
|
},
|
|
|
+ applyFilter() {
|
|
|
+ this.filterPopoverVisible = false;
|
|
|
+ // 这里可以根据 selectedFilters 做过滤
|
|
|
+ this.handleSearch();
|
|
|
+ },
|
|
|
+ // 手动刷新当前企微账号的会话列表
|
|
|
+ refreshCurrentSession() {
|
|
|
+ // 删除当前企微账号的会话缓存
|
|
|
+ if (this.appKey) {
|
|
|
+ delete this.qwUserSessions[this.appKey];
|
|
|
+ delete this.qwUserSessions[`${this.appKey}_selected`];
|
|
|
+
|
|
|
+ // 重新获取会话列表
|
|
|
+ this.getConversation();
|
|
|
+
|
|
|
+ this.$message({
|
|
|
+ message: '会话列表已刷新',
|
|
|
+ type: 'success'
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleClose() {
|
|
|
+ this.$emit('close')
|
|
|
+ }
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
@@ -611,10 +960,6 @@ export default {
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
}
|
|
|
-.lemon-wrapper{
|
|
|
- border:1px solid #ddd;
|
|
|
- //height: !important;
|
|
|
-}
|
|
|
.lemon-drawer{
|
|
|
border:1px solid #ddd;
|
|
|
border-left:0;
|
|
@@ -647,12 +992,23 @@ export default {
|
|
|
}
|
|
|
|
|
|
::v-deep .im-tabs {
|
|
|
+ width: 97%;
|
|
|
.el-tabs__header {
|
|
|
margin: 0 !important;
|
|
|
.el-tabs__item {
|
|
|
border-bottom: 0 !important;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+ /* 未读消息徽标样式 */
|
|
|
+ .el-badge__content {
|
|
|
+ border: none;
|
|
|
+ font-size: 12px;
|
|
|
+ font-weight: bold;
|
|
|
+ background-color: #F56C6C;
|
|
|
+ transform: translateY(-2px);
|
|
|
+ right: unset
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
</style>
|