优化
This commit is contained in:
@@ -201,6 +201,11 @@ onUnmounted(() => {
|
||||
|
||||
/* 类型样式 */
|
||||
.notice-bar--info {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 9999;
|
||||
background-color: #eff6ff;
|
||||
color: #1e40af;
|
||||
}
|
||||
|
||||
@@ -43,7 +43,7 @@ export const useNoticeStore = defineStore('notice', () => {
|
||||
try {
|
||||
const res = await getActiveNotices()
|
||||
console.log('[NoticeStore] 获取公告', res)
|
||||
notices.value = Array.isArray(res) ? res : []
|
||||
notices.value = Array.isArray(res) ? res.filter(n => !n.deleted) : []
|
||||
lastFetchTime.value = Date.now()
|
||||
} catch (error) {
|
||||
console.error('[NoticeStore] 获取公告失败:', error)
|
||||
|
||||
@@ -99,7 +99,7 @@
|
||||
<div
|
||||
v-if="contextMenu.visible"
|
||||
class="context-menu"
|
||||
:style="{ top: contextMenu.y + 'px', left: contextMenu.x + 'px' }"
|
||||
:style="{ top: contextMenu.y + 'px', left: contextMenu.x + 'px', transformOrigin: contextMenu.isMine ? 'top right' : 'top left' }"
|
||||
@mouseleave="hideContextMenu"
|
||||
>
|
||||
<div v-if="contextMenu.msg?.type === 'text'" class="context-menu-item" @click="copyMessage">复制</div>
|
||||
@@ -149,9 +149,13 @@ function showContextMenu(event, msg, index) {
|
||||
const rect = messagePageRef.value?.getBoundingClientRect() || { left: 0, top: 0, width: window.innerWidth, height: window.innerHeight }
|
||||
let x = event.clientX - rect.left
|
||||
let y = event.clientY - rect.top
|
||||
const isMine = msg.senderId == currentUser.value.id
|
||||
// 自己的消息在右侧,菜单向左偏移
|
||||
if (isMine) x -= menuWidth
|
||||
if (x + menuWidth > rect.width) x -= menuWidth
|
||||
if (x < 0) x = 0
|
||||
if (y + menuHeight > rect.height) y -= menuHeight
|
||||
contextMenu.value = { visible: true, x, y, msg, index }
|
||||
contextMenu.value = { visible: true, x, y, msg, index, isMine }
|
||||
}
|
||||
|
||||
function hideContextMenu() {
|
||||
@@ -684,6 +688,19 @@ onUnmounted(() => {
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.12);
|
||||
min-width: 100px;
|
||||
overflow: hidden;
|
||||
transform-origin: top left;
|
||||
animation: context-menu-in 0.15s ease-out;
|
||||
}
|
||||
|
||||
@keyframes context-menu-in {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: scale(0.7);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
.context-menu-item {
|
||||
|
||||
Reference in New Issue
Block a user