|
|
@@ -32,10 +32,22 @@
|
|
|
:class="{ active: currentChatId === chat.user_id }"
|
|
|
@click="selectChat(chat)"
|
|
|
>
|
|
|
- <UserAvatar
|
|
|
- :name="chat.full_name || chat.username || '未知'"
|
|
|
- :userId="chat.user_id"
|
|
|
- :size="40"
|
|
|
+ <PlatformIcon
|
|
|
+ v-if="hasSystemAppLogo(chat)"
|
|
|
+ class="msg-conv-avatar"
|
|
|
+ :text="chat.app_name || chat.full_name || chat.username || '应用'"
|
|
|
+ :size="40"
|
|
|
+ shape="circle"
|
|
|
+ :icon-url="chat.icon_url"
|
|
|
+ :app-id="chat.application_app_id"
|
|
|
+ :icon-object-key="chat.icon_object_key"
|
|
|
+ :show-caption="false"
|
|
|
+ />
|
|
|
+ <UserAvatar
|
|
|
+ v-else
|
|
|
+ :name="chat.full_name || chat.username || '未知'"
|
|
|
+ :userId="chat.user_id"
|
|
|
+ :size="40"
|
|
|
/>
|
|
|
|
|
|
<div class="chat-info">
|
|
|
@@ -70,6 +82,17 @@
|
|
|
<template v-if="currentChatId !== null">
|
|
|
<!-- 顶部标题 -->
|
|
|
<header class="chat-header-bar">
|
|
|
+ <PlatformIcon
|
|
|
+ v-if="hasSystemAppLogo(currentChatUser)"
|
|
|
+ class="chat-header-app-icon"
|
|
|
+ :text="currentChatUser.app_name || currentChatUser.full_name || '应用'"
|
|
|
+ :size="36"
|
|
|
+ shape="circle"
|
|
|
+ :icon-url="currentChatUser.icon_url"
|
|
|
+ :app-id="currentChatUser.application_app_id"
|
|
|
+ :icon-object-key="currentChatUser.icon_object_key"
|
|
|
+ :show-caption="false"
|
|
|
+ />
|
|
|
<div class="chat-header-titles">
|
|
|
<h3>
|
|
|
<!-- 系统会话优先显示应用名 -->
|
|
|
@@ -96,7 +119,18 @@
|
|
|
<div class="notification-card">
|
|
|
<!-- 发送者信息 -->
|
|
|
<div v-if="msg.app_id || msg.type === 'NOTIFICATION'" class="notification-sender">
|
|
|
- <el-icon class="sender-icon"><House /></el-icon>
|
|
|
+ <PlatformIcon
|
|
|
+ v-if="hasSystemAppLogo(currentChatUser)"
|
|
|
+ class="notification-sender-logo"
|
|
|
+ :text="getAppName(msg) || currentChatUser?.app_name || '应用'"
|
|
|
+ :size="22"
|
|
|
+ shape="circle"
|
|
|
+ :icon-url="currentChatUser?.icon_url"
|
|
|
+ :app-id="currentChatUser?.application_app_id"
|
|
|
+ :icon-object-key="currentChatUser?.icon_object_key"
|
|
|
+ :show-caption="false"
|
|
|
+ />
|
|
|
+ <el-icon v-else class="sender-icon"><House /></el-icon>
|
|
|
<span class="sender-name">{{ getAppName(msg) || '系统通知' }}</span>
|
|
|
</div>
|
|
|
|
|
|
@@ -283,6 +317,7 @@
|
|
|
<script setup lang="ts">
|
|
|
import { ref, onMounted, onUnmounted, onActivated, computed, nextTick } from 'vue'
|
|
|
import UserAvatar from '@/components/UserAvatar.vue'
|
|
|
+import PlatformIcon from '@/components/PlatformIcon.vue'
|
|
|
import { Picture, Document, House, ArrowRight } from '@element-plus/icons-vue'
|
|
|
import api from '@/utils/request'
|
|
|
import { useAuthStore } from '@/store/auth'
|
|
|
@@ -311,6 +346,14 @@ const userOptions = ref<any[]>([])
|
|
|
const searchingUsers = ref(false)
|
|
|
const markingAllRead = ref(false)
|
|
|
|
|
|
+/** 按应用拆分的系统会话(user_id < 0)且有 Logo URL 或 object key */
|
|
|
+const hasSystemAppLogo = (c: Record<string, unknown> | null | undefined) => {
|
|
|
+ if (!c || !c.is_system || typeof c.user_id !== 'number' || c.user_id >= 0) return false
|
|
|
+ const u = String((c.icon_url as string) || '').trim()
|
|
|
+ const k = String((c.icon_object_key as string) || '').trim()
|
|
|
+ return !!(u || k)
|
|
|
+}
|
|
|
+
|
|
|
// 应用名称缓存
|
|
|
const appNameCache = ref<Record<number, string>>({})
|
|
|
|
|
|
@@ -713,6 +756,38 @@ const handleNotificationAction = async (msg: any) => {
|
|
|
transition: background 0.2s;
|
|
|
}
|
|
|
|
|
|
+.msg-conv-avatar {
|
|
|
+ flex-shrink: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.msg-conv-avatar :deep(.platform-icon-cell) {
|
|
|
+ cursor: inherit;
|
|
|
+}
|
|
|
+
|
|
|
+.chat-header-app-icon {
|
|
|
+ flex-shrink: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.chat-header-app-icon :deep(.platform-icon-cell) {
|
|
|
+ cursor: default;
|
|
|
+}
|
|
|
+
|
|
|
+.notification-sender-logo {
|
|
|
+ flex-shrink: 0;
|
|
|
+ margin-right: 6px;
|
|
|
+}
|
|
|
+
|
|
|
+.notification-sender-logo :deep(.platform-icon-cell) {
|
|
|
+ cursor: default;
|
|
|
+}
|
|
|
+
|
|
|
+.notification-sender-logo :deep(.platform-icon:hover) {
|
|
|
+ transform: none;
|
|
|
+ box-shadow:
|
|
|
+ 0 4px 6px -1px rgba(0, 0, 0, 0.1),
|
|
|
+ 0 2px 4px -1px rgba(0, 0, 0, 0.06);
|
|
|
+}
|
|
|
+
|
|
|
.chat-item:hover {
|
|
|
background: #e9e9e9;
|
|
|
}
|
|
|
@@ -794,6 +869,7 @@ const handleNotificationAction = async (msg: any) => {
|
|
|
padding: 10px 20px;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
+ gap: 12px;
|
|
|
background: #f5f5f5;
|
|
|
}
|
|
|
|