fix: 修复弹出菜单被其他记录遮挡的问题

This commit is contained in:
2026-04-09 00:40:57 +08:00
parent 43b625d31a
commit 75026508b8

View File

@@ -22,6 +22,14 @@
.note-item:hover .action-btn {
opacity: 1;
}
/* 菜单弹出时强制显示,不被其他元素遮挡 */
.action-btn.show-menu {
opacity: 1 !important;
z-index: 100 !important;
}
.popup-menu {
z-index: 1000 !important;
}
</style>
</head>
<body class="bg-gray-100 h-screen overflow-hidden">
@@ -397,18 +405,34 @@
// 显示/隐藏菜单
function toggleMenu(id) {
const menu = document.getElementById(`menu-${id}`);
const actionBtn = menu?.closest('.action-btn');
if (menu) {
// 先隐藏其他所有菜单
document.querySelectorAll('[id^="menu-"]').forEach(m => {
if (m.id !== `menu-${id}`) m.classList.add('hidden');
m.classList.remove('popup-menu');
m.classList.add('hidden');
m.closest('.action-btn')?.classList.remove('show-menu');
});
const isHidden = menu.classList.contains('hidden');
menu.classList.toggle('hidden');
if (!menu.classList.contains('hidden')) {
menu.classList.add('popup-menu');
actionBtn?.classList.add('show-menu');
}
}
}
function hideMenu(id) {
const menu = document.getElementById(`menu-${id}`);
if (menu) menu.classList.add('hidden');
const actionBtn = menu?.closest('.action-btn');
if (menu) {
menu.classList.add('hidden');
menu.classList.remove('popup-menu');
actionBtn?.classList.remove('show-menu');
}
}
// 点击其他地方关闭所有菜单