feat: 实时消息与管理端运营能力

新增群聊/私信与公共 WebSocket 总线，站长用户内容档案，并将通知与待审角标改为推送驱动；同步精简管理仪表盘并修复主题换肤 DOM 冲突。

Co-authored-by: Cursor <cursoragent@cursor.com>

frontend/app/admin/page.tsx

@@ -2,21 +2,22 @@ import type { Metadata } from "next";
 import Link from "next/link";
 import { cookies } from "next/headers";
 import {
-  Users,
-  PenLine,
-  MessageCircle,
-  Activity,
-  Megaphone,
-  Palette,
-  ChevronRight,
   UserPlus,
   LayoutGrid,
   ClipboardCheck,
+  ChevronRight,
+  MessageSquareText,
+  FileText,
+  Users,
 } from "lucide-react";
-import { fetchOverview, type OverviewResponse } from "@/lib/api";
+import {
+  fetchOverview,
+  fetchAdminPendingCounts,
+  type PendingCounts,
+} from "@/lib/api";
 import { authCookieHeader } from "@/lib/cookies";
 import { getMeCached } from "@/lib/serverData";
-import { canModerateAny, isAdminOrAbove, isSuperOrOwner } from "@/lib/roles";
+import { canModerateAny, isSuperOrOwner } from "@/lib/roles";
 import Avatar from "@/components/Avatar";
 import { formatRelative } from "@/lib/format";
 
@@ -24,7 +25,6 @@ export const metadata: Metadata = {
   title: "管理仪表盘",
 };
 
-// 精确千分位（管理员视角需要真实数值，不用首页的紧凑 K/M）
 const fmt = (n: number) => n.toLocaleString("zh-CN");
 
 function greeting(hour: number) {
@@ -35,91 +35,6 @@ function greeting(hour: number) {
   return "晚上好";
 }
 
-// 统计 Bento 卡：总量 + 今日增量，语义色与全站令牌一致
-function StatCard({
-  label,
-  value,
-  foot,
-  icon,
-  color,
-  soft,
-}: {
-  label: string;
-  value: string;
-  foot: string;
-  icon: React.ReactNode;
-  color: string;
-  soft: string;
-}) {
-  return (
-    <div className="panel p-4 sm:p-5">
-      <div className="flex items-start justify-between gap-2">
-        <p className="text-[12.5px] font-semibold" style={{ color: "var(--ink-3)" }}>
-          {label}
-        </p>
-        <span
-          className="w-8 h-8 rounded-lg flex items-center justify-center shrink-0"
-          style={{ background: soft, color }}
-          aria-hidden="true"
-        >
-          {icon}
-        </span>
-      </div>
-      <p
-        className="mt-3 text-[26px] sm:text-[30px] font-extrabold tabular-nums leading-none tracking-tight"
-        style={{ color: "var(--ink)" }}
-      >
-        {value}
-      </p>
-      <p className="mt-2 text-[11.5px] sm:text-[12px] font-semibold" style={{ color: "var(--ink-3)" }}>
-        {foot}
-      </p>
-    </div>
-  );
-}
-
-// 快捷管理入口：整卡可点（stretch-link），图标 + 标题 + 描述 + 箭头
-function QuickLink({
-  href,
-  icon,
-  title,
-  desc,
-  soft,
-  color,
-}: {
-  href: string;
-  icon: React.ReactNode;
-  title: string;
-  desc: string;
-  soft: string;
-  color: string;
-}) {
-  return (
-    <Link href={href} className="panel hover-lift relative block p-5 group">
-      <div className="flex items-start gap-3.5">
-        <span
-          className="w-10 h-10 rounded-xl flex items-center justify-center shrink-0"
-          style={{ background: soft, color }}
-          aria-hidden="true"
-        >
-          {icon}
-        </span>
-        <div className="min-w-0 flex-1">
-          <p className="text-[15px] font-extrabold" style={{ color: "var(--ink)" }}>
-            {title}
-          </p>
-          <p className="meta mt-1 text-[12.5px] leading-relaxed">{desc}</p>
-        </div>
-        <ChevronRight
-          size={17}
-          className="shrink-0 mt-1 transition-transform group-hover:translate-x-0.5"
-          style={{ color: "var(--ink-3)" }}
-        />
-      </div>
-    </Link>
-  );
-}
-
 function PanelHead({ title, extra }: { title: string; extra?: string }) {
   return (
     <div
@@ -138,12 +53,86 @@ function PanelHead({ title, extra }: { title: string; extra?: string }) {
   );
 }
 
+/** 待办工作区：待审帖子 / 评论数量，整块进入审核页 */
+function PendingWorkPanel({ counts }: { counts: PendingCounts }) {
+  const total = counts.posts + counts.comments;
+  const idle = total === 0;
+
+  return (
+    <Link
+      href="/admin/moderation"
+      className="panel hover-lift relative block p-4 sm:p-5 mb-4 group"
+    >
+      <div className="flex items-start gap-3.5">
+        <span
+          className="w-11 h-11 rounded-xl flex items-center justify-center shrink-0"
+          style={{
+            background: idle ? "var(--tint)" : "var(--ok-soft)",
+            color: idle ? "var(--ink-3)" : "var(--ok)",
+          }}
+          aria-hidden="true"
+        >
+          <ClipboardCheck size={20} />
+        </span>
+        <div className="min-w-0 flex-1">
+          <div className="flex items-center gap-2 flex-wrap">
+            <p className="text-[15px] font-extrabold" style={{ color: "var(--ink)" }}>
+              内容审核
+            </p>
+            {idle ? (
+              <span
+                className="text-[11.5px] font-semibold px-2 py-0.5 rounded-full"
+                style={{ background: "var(--tint)", color: "var(--ink-3)" }}
+              >
+                暂无待审
+              </span>
+            ) : (
+              <span
+                className="text-[11.5px] font-semibold px-2 py-0.5 rounded-full tabular-nums"
+                style={{ background: "var(--ok-soft)", color: "var(--ok)" }}
+              >
+                {fmt(total)} 项待处理
+              </span>
+            )}
+          </div>
+          <div className="mt-3 flex flex-wrap gap-3 sm:gap-5">
+            <span className="inline-flex items-center gap-1.5 text-[13px]" style={{ color: "var(--ink-2)" }}>
+              <FileText size={14} style={{ color: "var(--ink-3)" }} aria-hidden="true" />
+              待审帖子
+              <strong className="tabular-nums font-extrabold" style={{ color: "var(--ink)" }}>
+                {fmt(counts.posts)}
+              </strong>
+            </span>
+            <span className="inline-flex items-center gap-1.5 text-[13px]" style={{ color: "var(--ink-2)" }}>
+              <MessageSquareText size={14} style={{ color: "var(--ink-3)" }} aria-hidden="true" />
+              待审评论
+              <strong className="tabular-nums font-extrabold" style={{ color: "var(--ink)" }}>
+                {fmt(counts.comments)}
+              </strong>
+            </span>
+          </div>
+        </div>
+        <ChevronRight
+          size={18}
+          className="shrink-0 mt-1 transition-transform group-hover:translate-x-0.5"
+          style={{ color: "var(--ink-3)" }}
+        />
+      </div>
+    </Link>
+  );
+}
+
 export default async function AdminDashboardPage() {
   const cookie = authCookieHeader(await cookies());
-  // 与 layout 的 /me 请求共享 React cache；概览失败降级，不阻塞仪表盘骨架
-  const [me, overview] = await Promise.all([
-    getMeCached(cookie || undefined),
+  const me = await getMeCached(cookie || undefined);
+  const canMod = canModerateAny(me.user);
+  const canUsers = isSuperOrOwner(me.user?.role);
+
+  const [overview, pendingCounts] = await Promise.all([
     fetchOverview(cookie).catch(() => null),
+    canMod
+      ? fetchAdminPendingCounts(cookie).catch(() => ({ posts: 0, comments: 0 }))
+      : Promise.resolve(null),
   ]);
 
   const now = new Date();
@@ -162,100 +151,24 @@ export default async function AdminDashboardPage() {
 
   return (
     <div>
-      {/* 页头 */}
       <div className="mb-5">
-        <h1 className="text-[22px] sm:text-[26px] font-extrabold tracking-tight" style={{ color: "var(--ink)" }}>
+        <h1
+          className="text-[22px] sm:text-[26px] font-extrabold tracking-tight"
+          style={{ color: "var(--ink)" }}
+        >
           {greeting(now.getHours())}，{me.user?.nickname}
         </h1>
-        <p className="meta mt-1.5 text-[12.5px]">{dateLabel} · 这里是站点运营全貌</p>
+        <p className="meta mt-1.5 text-[12.5px]">{dateLabel} · 站点管理</p>
       </div>
 
-      {/* 统计 Bento */}
-      <div className="grid grid-cols-2 lg:grid-cols-4 gap-3 sm:gap-4">
-        <StatCard
-          label="注册用户"
-          value={stats ? fmt(stats.users) : "—"}
-          foot={stats ? `今日新增 +${fmt(stats.today_users)}` : "统计暂不可用"}
-          icon={<Users size={16} />}
-          color="var(--accent)"
-          soft="var(--accent-soft)"
-        />
-        <StatCard
-          label="话题总数"
-          value={stats ? fmt(stats.posts) : "—"}
-          foot={stats ? `今日新发 +${fmt(stats.today_posts)}` : "统计暂不可用"}
-          icon={<PenLine size={16} />}
-          color="var(--clay)"
-          soft="var(--clay-soft)"
-        />
-        <StatCard
-          label="回复总数"
-          value={stats ? fmt(stats.comments) : "—"}
-          foot={stats ? `今日新增 +${fmt(stats.today_comments)}` : "统计暂不可用"}
-          icon={<MessageCircle size={16} />}
-          color="var(--ok)"
-          soft="var(--ok-soft)"
-        />
-        <StatCard
-          label="在线用户"
-          value={stats ? fmt(stats.online) : "—"}
-          foot={stats ? `近 5 分钟活跃 · 峰值 ${fmt(stats.peak_online)}` : "统计暂不可用"}
-          icon={<Activity size={16} />}
-          color="var(--gold)"
-          soft="var(--gold-soft)"
-        />
-      </div>
+      {canMod && pendingCounts && <PendingWorkPanel counts={pendingCounts} />}
 
-      {/* 快捷入口（按角色权限过滤，与侧边栏一致；后端路由另有守卫） */}
-      <h2 className="sr-only">快捷管理</h2>
-      <div className="grid sm:grid-cols-2 xl:grid-cols-3 gap-3 sm:gap-4 mt-4">
-        {canModerateAny(me.user) && (
-          <QuickLink
-            href="/admin/moderation"
-            icon={<ClipboardCheck size={18} />}
-            title="内容审核"
-            desc="审核普通用户提交的帖子与评论，通过后内容公开可见"
-            soft="var(--ok-soft)"
-            color="var(--ok)"
-          />
-        )}
-        {isAdminOrAbove(me.user?.role) && (
-          <QuickLink
-            href="/admin/announcements"
-            icon={<Megaphone size={18} />}
-            title="公告管理"
-            desc="发布、编辑与下线站点公告，支持标签颜色与草稿状态"
-            soft="var(--clay-soft)"
-            color="var(--clay)"
-          />
-        )}
-        {isSuperOrOwner(me.user?.role) && (
-          <QuickLink
-            href="/admin/users"
-            icon={<Users size={18} />}
-            title="用户权限"
-            desc="查看全站成员，授予管理角色与板块授权，封禁违规账号"
-            soft="var(--accent-soft)"
-            color="var(--accent)"
-          />
-        )}
-        {isSuperOrOwner(me.user?.role) && (
-          <QuickLink
-            href="/admin/appearance"
-            icon={<Palette size={18} />}
-            title="外观设置"
-            desc="配置全站主题强调色，实时预览后保存并对所有用户生效"
-            soft="var(--gold-soft)"
-            color="var(--gold)"
-          />
-        )}
-      </div>
-
-      {/* 成员与板块 */}
-      <div className="grid lg:grid-cols-2 gap-4 mt-4 items-start">
-        {/* 最新注册成员 */}
+      <div className="grid lg:grid-cols-2 gap-4 items-start">
         <div className="panel overflow-hidden">
-          <PanelHead title="最新注册成员" extra={stats ? `共 ${fmt(stats.users)} 人` : undefined} />
+          <PanelHead
+            title="最新注册成员"
+            extra={stats ? `共 ${fmt(stats.users)} 人` : undefined}
+          />
           {newUsers.length === 0 ? (
             <p className="meta text-center py-14 text-[13px]">暂无成员数据</p>
           ) : (
@@ -266,12 +179,22 @@ export default async function AdminDashboardPage() {
                 className="flex items-center gap-3 px-4 sm:px-5 py-3 transition-colors hover:bg-[var(--panel-2)]"
                 style={{ borderTop: "1px solid var(--line)" }}
               >
-                <Avatar name={u.nickname || u.username} src={u.avatar || undefined} size={34} />
+                <Avatar
+                  name={u.nickname || u.username}
+                  src={u.avatar || undefined}
+                  size={34}
+                />
                 <span className="min-w-0 flex-1 leading-tight">
-                  <span className="block text-[13.5px] font-bold truncate" style={{ color: "var(--ink)" }}>
+                  <span
+                    className="block text-[13.5px] font-bold truncate"
+                    style={{ color: "var(--ink)" }}
+                  >
                     {u.nickname}
                   </span>
-                  <span className="block text-[11.5px] truncate" style={{ color: "var(--ink-3)" }}>
+                  <span
+                    className="block text-[11.5px] truncate"
+                    style={{ color: "var(--ink-3)" }}
+                  >
                     @{u.username}
                   </span>
                 </span>
@@ -285,9 +208,22 @@ export default async function AdminDashboardPage() {
               </Link>
             ))
           )}
+          {canUsers && (
+            <Link
+              href="/admin/users"
+              className="flex items-center justify-center gap-1.5 px-4 py-3 text-[13px] font-semibold transition-colors hover:bg-[var(--panel-2)]"
+              style={{
+                borderTop: "1px solid var(--line)",
+                color: "var(--accent)",
+              }}
+            >
+              <Users size={14} aria-hidden="true" />
+              前往用户权限
+              <ChevronRight size={14} aria-hidden="true" />
+            </Link>
+          )}
         </div>
 
-        {/* 板块分布 */}
         <div className="panel overflow-hidden">
           <PanelHead title="板块话题分布" extra={`${boards.length} 个板块`} />
           {topBoards.length === 0 ? (
@@ -309,14 +245,19 @@ export default async function AdminDashboardPage() {
                 </span>
                 <span className="min-w-0 flex-1">
                   <span className="flex items-center justify-between gap-2">
-                    <span className="text-[13.5px] font-bold truncate" style={{ color: "var(--ink)" }}>
+                    <span
+                      className="text-[13.5px] font-bold truncate"
+                      style={{ color: "var(--ink)" }}
+                    >
                       {b.name}
                     </span>
-                    <span className="text-[12px] font-bold tabular-nums shrink-0" style={{ color: "var(--ink-2)" }}>
+                    <span
+                      className="text-[12px] font-bold tabular-nums shrink-0"
+                      style={{ color: "var(--ink-2)" }}
+                    >
                       {fmt(b.post_count)}
                     </span>
                   </span>
-                  {/* 相对占比迷你条（纯装饰） */}
                   <span
                     className="block mt-1.5 h-1 rounded-full overflow-hidden"
                     style={{ background: "var(--tint)" }}