feat: 站点媒体库与移动端底部导航，服务测试补强

- 新增媒体库：media_library/media_thumbs 服务（WebP 缩略图）、管理端 media 页面
- 移动端底部导航 MobileTabBar 替换 MobilePostBar
- 旧数据导入增强与测试、路由与登录会话/板块侧边栏测试补强
- site-doc 组件精简（移除 Breadcrumb），文档新增迁移公告说明

frontend/app/admin/settings/import/ImportPanel.tsx

@@ -7,6 +7,7 @@ import {
   ClipboardCheck,
   Database,
   FileUp,
+  Images,
   ListChecks,
   ListX,
   Loader2,
@@ -22,9 +23,8 @@ import {
 } from "@/components/admin";
 import {
   apiAdminImportLegacy,
-  type LegacyCommentReport,
   type LegacyImportReport,
-  type LegacyPostReport,
+  type LegacyUserPreview,
 } from "@/lib/api";
 
 /** 数据源清单：enabled=false 的来源展示为「计划中」，为后续 WordPress/Typecho 适配预留 */
@@ -34,27 +34,40 @@ const SOURCES = [
   { key: "typecho", label: "Typecho", enabled: false },
 ] as const;
 
+/** 单个旧用户的导入选择：是否建号 + 内容归属 */
+type UserSel = { create: boolean; owner: "auto" | "operator" | "custom"; target: string };
+
 /**
  * 站点设置 → 数据导入：
- * 上传旧站数据库（+可选头像包）→ 预检（dry-run，不写库）→ 确认正式导入。
+ * 上传旧站数据库（+可选头像包 / 帖子图片包）→ 预检（dry-run，返回用户/帖子/评论清单）
+ * → 勾选导入范围（是否建号、内容归属、排除帖子/评论）→ 确认正式导入。
  * 全程幂等：已导入对象自动跳过，可安全重复执行。
  */
 export default function ImportPanel() {
   const [source, setSource] = useState<string>("jiang13");
   const [dbFile, setDbFile] = useState<File | null>(null);
   const [zipFile, setZipFile] = useState<File | null>(null);
+  const [imagesZipFile, setImagesZipFile] = useState<File | null>(null);
   const [withContent, setWithContent] = useState(true);
   const [busy, setBusy] = useState<"check" | "import" | null>(null);
   const [error, setError] = useState("");
-  const [report, setReport] = useState<LegacyImportReport | null>(null);
+  const [preview, setPreview] = useState<LegacyImportReport | null>(null); // 预检清单
+  const [report, setReport] = useState<LegacyImportReport | null>(null); // 最近一次执行结果
   const dbInputRef = useRef<HTMLInputElement>(null);
   const zipInputRef = useRef<HTMLInputElement>(null);
+  const imagesZipInputRef = useRef<HTMLInputElement>(null);
+
+  // 勾选状态（预检后按清单初始化，默认全部导入）
+  const [userSel, setUserSel] = useState<Record<number, UserSel>>({});
+  const [postChecked, setPostChecked] = useState<Set<number>>(new Set());
+  const [commentChecked, setCommentChecked] = useState<Set<number>>(new Set());
 
   // 「确认导入」只有在当前配置下跑过预检后才可用；文件/选项变化即重置
   const [preflighted, setPreflighted] = useState(false);
 
   const resetResult = () => {
     setPreflighted(false);
+    setPreview(null);
     setReport(null);
     setError("");
   };
@@ -67,22 +80,73 @@ export default function ImportPanel() {
     setZipFile(f);
     resetResult();
   };
+  const pickImagesZip = (f: File | null) => {
+    setImagesZipFile(f);
+    resetResult();
+  };
   const toggleContent = () => {
     setWithContent((v) => !v);
     resetResult();
   };
 
+  const initSelections = (rep: LegacyImportReport) => {
+    const users: Record<number, UserSel> = {};
+    (rep.user_list ?? []).forEach((u) => {
+      users[u.id] = { create: true, owner: "auto", target: "" };
+    });
+    setUserSel(users);
+    setPostChecked(new Set((rep.post_list ?? []).filter((p) => p.published && !p.poll).map((p) => p.id)));
+    setCommentChecked(new Set((rep.comment_list ?? []).filter((c) => c.published).map((c) => c.id)));
+  };
+
+  // 由勾选状态构造请求参数（相对预检清单求差集）
+  const buildOptions = () => {
+    const skipUsers: number[] = [];
+    const operatorUsers: number[] = [];
+    const userMap: { oldId: number; username: string }[] = [];
+    Object.entries(userSel).forEach(([idStr, sel]) => {
+      const id = Number(idStr);
+      if (sel.owner === "operator") {
+        skipUsers.push(id);
+        operatorUsers.push(id);
+      } else if (sel.owner === "custom" && sel.target.trim()) {
+        skipUsers.push(id);
+        userMap.push({ oldId: id, username: sel.target.trim() });
+      } else if (!sel.create) {
+        skipUsers.push(id);
+      }
+    });
+    return {
+      withContent,
+      dryRun: false,
+      skipUsers,
+      operatorUsers,
+      userMap,
+      skipPosts: (preview?.post_list ?? [])
+        .filter((p) => p.published && !p.poll && !postChecked.has(p.id))
+        .map((p) => p.id),
+      skipComments: (preview?.comment_list ?? [])
+        .filter((c) => c.published && !commentChecked.has(c.id))
+        .map((c) => c.id),
+    };
+  };
+
   const run = async (dryRun: boolean) => {
     if (!dbFile || busy) return;
     setBusy(dryRun ? "check" : "import");
     setError("");
     try {
-      const rep = await apiAdminImportLegacy(source, dbFile, zipFile, {
-        withContent,
+      const opts = dryRun ? { withContent, dryRun } : buildOptions();
+      const rep = await apiAdminImportLegacy(source, dbFile, zipFile, imagesZipFile, {
+        ...opts,
         dryRun,
       });
       setReport(rep);
-      if (dryRun) setPreflighted(true);
+      if (dryRun) {
+        setPreview(rep);
+        initSelections(rep);
+        setPreflighted(true);
+      }
     } catch (e) {
       setError(e instanceof Error ? e.message : "导入失败");
     } finally {
@@ -90,6 +154,25 @@ export default function ImportPanel() {
     }
   };
 
+  const setUser = (id: number, patch: Partial<UserSel>) => {
+    setUserSel((m) => {
+      const cur = m[id] ?? { create: true, owner: "auto" as const, target: "" };
+      const next = { ...cur, ...patch };
+      // 归属指定已有账号 / 站长时，账号不再新建
+      if (next.owner !== "auto") next.create = false;
+      return { ...m, [id]: next };
+    });
+  };
+
+  const toggleSet = (set: Set<number>, id: number) => {
+    const next = new Set(set);
+    if (next.has(id)) next.delete(id);
+    else next.add(id);
+    return next;
+  };
+
+  const hasLists = withContent && !!preview?.post_list?.length;
+
   return (
     <div className="flex flex-col gap-4">
       <AdminSettingsGroup
@@ -145,12 +228,21 @@ export default function ImportPanel() {
             onPick={pickZip}
             busy={busy !== null}
           />
+          <FilePickRow
+            label="帖子图片压缩包（可选）"
+            hint="把旧站 data/uploads/posts 目录压缩为 zip，最大 128MB；帖子/评论正文里的旧站图片会迁移到新站并改写链接"
+            fileName={imagesZipFile?.name}
+            inputRef={imagesZipInputRef}
+            accept=".zip,application/zip"
+            onPick={pickImagesZip}
+            busy={busy !== null}
+          />
         </div>
       </AdminSettingsGroup>
 
       <AdminSettingsGroup
         title="导入范围"
-        description="第二步：确认导入范围。板块按旧板块名自动创建（同名复用）；帖子与评论保留原发布时间与浏览/点赞数；作者账号缺失时归到站长。投票帖暂不迁移。"
+        description="第二步：确认是否导入内容。板块按旧板块名自动创建（同名复用）；帖子与评论保留原发布时间与浏览/点赞数。投票帖暂不迁移。"
       >
         <div className="flex items-center gap-3">
           <AdminSwitch checked={withContent} onChange={toggleContent} label="同时导入帖子与评论" />
@@ -162,7 +254,7 @@ export default function ImportPanel() {
 
       <AdminSettingsGroup
         title="预检与导入"
-        description="第三步：先预检确认将导入的内容，再正式写入。可重复执行，已导入的内容自动跳过。"
+        description="第三步：先预检生成内容清单并勾选导入范围，再正式写入。可重复执行，已导入的内容自动跳过。"
       >
         <div className="flex flex-wrap items-center gap-2">
           <button
@@ -190,7 +282,7 @@ export default function ImportPanel() {
                 ? "请先选择站点数据库"
                 : !preflighted
                   ? "请先运行预检"
-                  : "预检通过，可以正式导入"}
+                  : "已生成清单，确认勾选后可正式导入"}
           </span>
         </div>
 
@@ -201,6 +293,38 @@ export default function ImportPanel() {
           </p>
         )}
 
+        {preflighted && preview?.user_list && preview.user_list.length > 0 && (
+          <UserSelectList list={preview.user_list} sel={userSel} onChange={setUser} />
+        )}
+        {hasLists && preview && (
+          <PostSelectList
+            list={preview.post_list ?? []}
+            checked={postChecked}
+            onToggle={(id) => setPostChecked((s) => toggleSet(s, id))}
+            onAll={(on) =>
+              setPostChecked(
+                on
+                  ? new Set((preview.post_list ?? []).filter((p) => p.published && !p.poll).map((p) => p.id))
+                  : new Set()
+              )
+            }
+          />
+        )}
+        {hasLists && preview && !!preview.comment_list?.length && (
+          <CommentSelectList
+            list={preview.comment_list}
+            checked={commentChecked}
+            onToggle={(id) => setCommentChecked((s) => toggleSet(s, id))}
+            onAll={(on) =>
+              setCommentChecked(
+                on
+                  ? new Set(preview.comment_list!.filter((c) => c.published).map((c) => c.id))
+                  : new Set()
+              )
+            }
+          />
+        )}
+
         {report && <ReportView report={report} />}
       </AdminSettingsGroup>
     </div>
@@ -258,6 +382,222 @@ function FilePickRow({
   );
 }
 
+// ===== 预检后勾选清单 =====
+
+const fieldStyle = { background: "var(--panel)", border: "1px solid var(--line)" } as const;
+
+function UserSelectList({
+  list,
+  sel,
+  onChange,
+}: {
+  list: LegacyUserPreview[];
+  sel: Record<number, UserSel>;
+  onChange: (id: number, patch: Partial<UserSel>) => void;
+}) {
+  return (
+    <div className="mt-2 flex flex-col gap-2">
+      <p className="flex items-center gap-1.5 text-[13px] font-semibold" style={{ color: "var(--ink)" }}>
+        <Users size={14} aria-hidden />
+        用户（{list.length}）——取消勾选则不创建账号，其内容按右侧归属落位
+      </p>
+      <div className="max-h-80 overflow-y-auto flex flex-col gap-1.5 pr-1">
+        {list.map((u) => {
+          const s = sel[u.id] ?? { create: true, owner: "auto" as const, target: "" };
+          return (
+            <div
+              key={u.id}
+              className="rounded-lg px-3 py-2 flex items-center gap-2.5 flex-wrap"
+              style={fieldStyle}
+            >
+              <label className="inline-flex items-center gap-2 text-[12.5px] shrink-0" style={{ color: "var(--ink)" }}>
+                <input
+                  type="checkbox"
+                  className="accent-[var(--accent)]"
+                  checked={s.create}
+                  disabled={s.owner !== "auto"}
+                  onChange={(e) => onChange(u.id, { create: e.target.checked })}
+                />
+                建号
+              </label>
+              <div className="min-w-0 flex-1 flex items-baseline gap-1.5 flex-wrap">
+                <span className="text-[13px] font-semibold truncate" style={{ color: "var(--ink)" }}>
+                  {u.username}
+                </span>
+                {u.nickname && u.nickname !== u.username && (
+                  <span className="meta text-[12px] truncate">{u.nickname}</span>
+                )}
+                {u.exists && (
+                  <span className="text-[11px] font-semibold" style={{ color: "var(--warn, #b45309)" }}>
+                    同名已存在·导入时跳过建号
+                  </span>
+                )}
+              </div>
+              <span className="meta text-[12px] shrink-0">
+                帖 {u.posts} · 评 {u.comments}
+              </span>
+              <select
+                value={s.owner}
+                onChange={(e) => onChange(u.id, { owner: e.target.value as UserSel["owner"] })}
+                className="rounded-lg px-2 py-1 text-[12.5px] shrink-0"
+                style={fieldStyle}
+              >
+                <option value="auto">归属：跟随默认</option>
+                <option value="operator">归到站长</option>
+                <option value="custom">指定已有账号…</option>
+              </select>
+              {s.owner === "custom" && (
+                <input
+                  value={s.target}
+                  placeholder="本站用户名"
+                  onChange={(e) => onChange(u.id, { target: e.target.value })}
+                  className="rounded-lg px-2 py-1 text-[12.5px] w-36 shrink-0"
+                  style={fieldStyle}
+                />
+              )}
+            </div>
+          );
+        })}
+      </div>
+    </div>
+  );
+}
+
+function BulkBar({ label, onAll }: { label: string; onAll: (on: boolean) => void }) {
+  return (
+    <span className="inline-flex items-center gap-1.5 text-[12px]" style={{ color: "var(--ink-3)" }}>
+      {label}
+      <button type="button" className="btn btn-line btn-xs" onClick={() => onAll(true)}>
+        全选
+      </button>
+      <button type="button" className="btn btn-line btn-xs" onClick={() => onAll(false)}>
+        全不选
+      </button>
+    </span>
+  );
+}
+
+function PostSelectList({
+  list,
+  checked,
+  onToggle,
+  onAll,
+}: {
+  list: { id: number; title: string; author: string; board: string; created_at: string; poll: boolean; published: boolean }[];
+  checked: Set<number>;
+  onToggle: (id: number) => void;
+  onAll: (on: boolean) => void;
+}) {
+  const selectable = list.filter((p) => p.published && !p.poll).length;
+  return (
+    <div className="mt-2 flex flex-col gap-2">
+      <div className="flex items-center gap-3 flex-wrap">
+        <p className="flex items-center gap-1.5 text-[13px] font-semibold" style={{ color: "var(--ink)" }}>
+          <ListChecks size={14} aria-hidden />
+          帖子（{selectable}/{list.length} 可导入）——取消勾选即排除，其评论一并跳过
+        </p>
+        <BulkBar label="批量：" onAll={onAll} />
+      </div>
+      <div className="max-h-80 overflow-y-auto flex flex-col gap-1.5 pr-1">
+        {list.map((p) => {
+          const disabled = !p.published || p.poll;
+          return (
+            <label
+              key={p.id}
+              className={`rounded-lg px-3 py-2 flex items-center gap-2.5 ${disabled ? "opacity-55" : "cursor-pointer"}`}
+              style={fieldStyle}
+            >
+              <input
+                type="checkbox"
+                className="accent-[var(--accent)] shrink-0"
+                checked={!disabled && checked.has(p.id)}
+                disabled={disabled}
+                onChange={() => onToggle(p.id)}
+              />
+              <span className="text-[13px] truncate flex-1" style={{ color: "var(--ink)" }}>
+                {p.title}
+              </span>
+              {p.poll && (
+                <span className="text-[11px] font-semibold shrink-0" style={{ color: "var(--danger)" }}>
+                  投票帖·不可迁移
+                </span>
+              )}
+              {!p.published && (
+                <span className="text-[11px] font-semibold shrink-0" style={{ color: "var(--danger)" }}>
+                  非公开
+                </span>
+              )}
+              <span className="meta text-[12px] shrink-0 truncate max-w-[180px]">
+                {p.author} · {p.board} · {fmtDate(p.created_at)}
+              </span>
+            </label>
+          );
+        })}
+      </div>
+    </div>
+  );
+}
+
+function CommentSelectList({
+  list,
+  checked,
+  onToggle,
+  onAll,
+}: {
+  list: { id: number; post_title: string; author: string; excerpt: string; created_at: string; published: boolean }[];
+  checked: Set<number>;
+  onToggle: (id: number) => void;
+  onAll: (on: boolean) => void;
+}) {
+  const selectable = list.filter((c) => c.published).length;
+  return (
+    <details className="mt-2 flex flex-col gap-2">
+      <summary className="flex items-center gap-2 flex-wrap cursor-pointer select-none">
+        <span className="flex items-center gap-1.5 text-[13px] font-semibold" style={{ color: "var(--ink)" }}>
+          <MessageSquare size={14} aria-hidden />
+          评论（{selectable}/{list.length} 可导入）
+        </span>
+        <BulkBar label="批量：" onAll={onAll} />
+      </summary>
+      <div className="max-h-80 overflow-y-auto flex flex-col gap-1.5 pr-1">
+        {list.map((c) => (
+          <label
+            key={c.id}
+            className={`rounded-lg px-3 py-2 flex items-center gap-2.5 ${!c.published ? "opacity-55" : "cursor-pointer"}`}
+            style={fieldStyle}
+          >
+            <input
+              type="checkbox"
+              className="accent-[var(--accent)] shrink-0"
+              checked={c.published && checked.has(c.id)}
+              disabled={!c.published}
+              onChange={() => onToggle(c.id)}
+            />
+            <span className="text-[12.5px] truncate flex-1" style={{ color: "var(--ink)" }}>
+              {c.excerpt || "（无文字）"}
+            </span>
+            {!c.published && (
+              <span className="text-[11px] font-semibold shrink-0" style={{ color: "var(--danger)" }}>
+                非公开
+              </span>
+            )}
+            <span className="meta text-[12px] shrink-0 truncate max-w-[240px]">
+              《{c.post_title}》{c.author} · {fmtDate(c.created_at)}
+            </span>
+          </label>
+        ))}
+      </div>
+    </details>
+  );
+}
+
+function fmtDate(s: string) {
+  const d = new Date(s);
+  return Number.isNaN(d.getTime()) ? "" : d.toLocaleDateString("zh-CN");
+}
+
+// ===== 结果报告 =====
+
 function StatChip({ icon, label, value, ok }: { icon: React.ReactNode; label: string; value: number; ok?: boolean }) {
   return (
     <div
@@ -282,7 +622,7 @@ function ReportView({ report }: { report: LegacyImportReport }) {
         {isDry ? (
           <>
             <ScanLine size={15} aria-hidden />
-            预检结果（未写入任何数据）——确认无误后点击「确认正式导入」
+            预检结果（未写入任何数据）——请在上方勾选导入范围，确认后点击「确认正式导入」
           </>
         ) : (
           <>
@@ -296,6 +636,9 @@ function ReportView({ report }: { report: LegacyImportReport }) {
         <StatChip icon={<ListChecks size={13} aria-hidden />} label="旧库用户" value={report.users.total} />
         <StatChip icon={<CheckCircle2 size={13} aria-hidden />} label={isDry ? "将导入" : "已导入"} value={report.users.imported} />
         <StatChip icon={<ListX size={13} aria-hidden />} label="已存在跳过" value={report.users.skipped} ok={false} />
+        {report.users.excluded > 0 && (
+          <StatChip icon={<ListX size={13} aria-hidden />} label="不建号" value={report.users.excluded} ok={false} />
+        )}
         {report.users.avatar_written > 0 && (
           <StatChip icon={<FileUp size={13} aria-hidden />} label="头像写入" value={report.users.avatar_written} />
         )}
@@ -332,29 +675,45 @@ function ReportView({ report }: { report: LegacyImportReport }) {
   );
 }
 
-function PostsView({ report, isDry }: { report: LegacyPostReport; isDry: boolean }) {
+function PostsView({ report, isDry }: { report: NonNullable<LegacyImportReport["posts"]>; isDry: boolean }) {
   return (
     <ReportCard icon={<ListChecks size={14} aria-hidden />} title="帖子">
       <StatChip icon={<ListChecks size={13} aria-hidden />} label="旧帖" value={report.total} />
       <StatChip icon={<CheckCircle2 size={13} aria-hidden />} label={isDry ? "将导入" : "已导入"} value={report.imported} />
       <StatChip icon={<ListX size={13} aria-hidden />} label="已导入跳过" value={report.skipped} ok={false} />
+      {report.excluded > 0 && (
+        <StatChip icon={<ListX size={13} aria-hidden />} label="手动排除" value={report.excluded} ok={false} />
+      )}
+      {report.images_written > 0 && (
+        <StatChip icon={<Images size={13} aria-hidden />} label={isDry ? "将迁移图片" : "图片迁移"} value={report.images_written} />
+      )}
       {report.polls_skipped > 0 && (
         <StatChip icon={<XCircle size={13} aria-hidden />} label="投票帖未迁移" value={report.polls_skipped} ok={false} />
       )}
       <DetailList title="投票帖（未迁移）" items={report.poll_titles} color="var(--danger)" />
+      <DetailList title="手动排除" items={report.excluded_detail} />
+      <DetailList title="图片缺失（保留原链接）" items={report.images_missing} color="var(--danger)" />
       <DetailList title="作者缺失（归到站长）" items={report.owner_fallback} />
       <DetailList title="失败 / 非公开" items={report.failed} color="var(--danger)" />
     </ReportCard>
   );
 }
 
-function CommentsView({ report, isDry }: { report: LegacyCommentReport; isDry: boolean }) {
+function CommentsView({ report, isDry }: { report: NonNullable<LegacyImportReport["comments"]>; isDry: boolean }) {
   return (
     <ReportCard icon={<MessageSquare size={14} aria-hidden />} title="评论">
       <StatChip icon={<ListChecks size={13} aria-hidden />} label="旧评论" value={report.total} />
       <StatChip icon={<CheckCircle2 size={13} aria-hidden />} label={isDry ? "将导入" : "已导入"} value={report.imported} />
       <StatChip icon={<ListX size={13} aria-hidden />} label="已导入跳过" value={report.skipped} ok={false} />
+      {report.excluded > 0 && (
+        <StatChip icon={<ListX size={13} aria-hidden />} label="手动排除" value={report.excluded} ok={false} />
+      )}
+      {report.images_written > 0 && (
+        <StatChip icon={<Images size={13} aria-hidden />} label={isDry ? "将迁移图片" : "图片迁移"} value={report.images_written} />
+      )}
+      <DetailList title="手动排除" items={report.excluded_detail} />
       <DetailList title="非公开 / 已导入跳过明细" items={report.skipped_detail} />
+      <DetailList title="图片缺失（保留原链接）" items={report.images_missing} color="var(--danger)" />
       <DetailList title="作者缺失（归到站长）" items={report.owner_fallback} />
       <DetailList title="失败" items={report.failed} color="var(--danger)" />
     </ReportCard>