重构 Wave3 详情与移动体验(05-28-frontend-ux-wave3-business-mobile)

这个提交包含在:
2026-05-29 07:57:17 +08:00
父节点 85c298e25a
当前提交 2b5fd6b1b7
共修改 17 个文件,包含 1087 行新增和 32 行删除
@@ -116,12 +116,14 @@ export function MobileNotificationsPage() {
const notificationItems = listQuery.data?.items ?? [];
const totalPages = Math.max(1, Math.ceil((listQuery.data?.total ?? 0) / PAGE_SIZE));
const targetableNotificationCount = notificationItems.filter((item) => resolveMobileNotificationTargetLink(item)).length;
return (
<PageScaffold className="pb-4">
<div className="mobile-page-stack" data-testid="mobile-notifications-page">
<PageHeader
title="通知"
subtitle="事件收件箱:未读优先,点击后回到对应业务页。"
meta={<span className="badge-neutral">未读 {listQuery.data?.unreadCount ?? 0}</span>}
actions={
<Button
@@ -136,6 +138,32 @@ export function MobileNotificationsPage() {
}
/>
<section className="mobile-card mobile-focus-card mobile-page-stack" data-testid="mobile-notifications-focus">
<div className="mobile-section-header">
<div className="min-w-0">
<h3 className="mobile-section-title">当前消息焦点</h3>
<p className="mobile-list-card__subtitle mt-1">
{unreadOnly ? "只看未读,处理后会自动回到业务详情。" : "全部事件按时间排列,业务操作仍在详情页完成。"}
</p>
</div>
<span className="mobile-section-meta">{selectedType ? "已筛选" : "全部类型"}</span>
</div>
<div className="mobile-info-grid text-sm">
<div>
<div className="text-xs text-zinc-500">未读</div>
<div className="mt-1 text-xl font-semibold text-zinc-900">{listQuery.data?.unreadCount ?? 0}</div>
</div>
<div>
<div className="text-xs text-zinc-500">当前页</div>
<div className="mt-1 text-xl font-semibold text-zinc-900">{notificationItems.length}</div>
</div>
<div>
<div className="text-xs text-zinc-500">可直达</div>
<div className="mt-1 text-xl font-semibold text-zinc-900">{targetableNotificationCount}</div>
</div>
</div>
</section>
<section className="mobile-card mobile-page-stack" data-testid="mobile-notifications-list">
<div className="mobile-section-header">
<div>