feat: 长按对话弹出操作菜单 - 重命名/分享/置顶/删除

This commit is contained in:
2026-04-26 17:25:43 +08:00
parent 05e900c5af
commit 2e5fcca49e
3 changed files with 281 additions and 28 deletions

View File

@@ -152,7 +152,7 @@ body {
.conversation-item {
display: flex;
flex-direction: column;
align-items: center;
padding: 12px 16px;
background: white;
border: 1px solid var(--border-color);
@@ -160,6 +160,12 @@ body {
cursor: pointer;
transition: all 0.2s;
position: relative;
gap: 8px;
}
.conversation-item.pinned {
border-color: var(--primary);
background: rgba(102, 126, 234, 0.08);
}
.conversation-item:hover {
@@ -171,43 +177,90 @@ body {
background: rgba(102, 126, 234, 0.1);
}
.pin-icon {
font-size: 14px;
}
.conv-title {
font-size: 16px;
font-weight: 500;
color: var(--text-color);
margin-bottom: 4px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex: 1;
}
.conv-meta {
font-size: 12px;
color: var(--text-light);
white-space: nowrap;
}
.conv-delete-btn {
position: absolute;
right: 12px;
top: 50%;
transform: translateY(-50%);
/* 操作菜单 */
.action-menu {
position: fixed;
bottom: 0;
left: 0;
right: 0;
background: transparent;
border: none;
color: var(--text-light);
padding: 6px;
display: none;
z-index: 1000;
}
.action-menu.show {
display: block;
}
.action-menu-content {
background: white;
border-radius: 16px 16px 0 0;
padding: 16px;
box-shadow: 0 -4px 20px rgba(0,0,0,0.15);
animation: slideUp 0.2s ease;
}
@keyframes slideUp {
from { transform: translateY(100%); }
to { transform: translateY(0); }
}
.action-menu-item {
display: flex;
align-items: center;
gap: 12px;
padding: 14px 16px;
border-radius: 10px;
cursor: pointer;
opacity: 0;
transition: all 0.2s;
}
.conversation-item:hover .conv-delete-btn {
opacity: 1;
.action-menu-item:hover {
background: rgba(102, 126, 234, 0.1);
}
.conv-delete-btn:hover {
.action-menu-item:active {
background: rgba(102, 126, 234, 0.2);
}
.action-menu-item svg {
color: var(--primary);
}
.action-menu-item span {
font-size: 16px;
color: var(--text-color);
}
.action-menu-item.delete-action svg,
.action-menu-item.delete-action span {
color: #e53e3e;
}
.action-menu-item.delete-action:hover {
background: rgba(229, 62, 62, 0.1);
}
/* ==================== 对话页面 ==================== */
#chatPage {