diff --git a/admin/src/pages/site-settings-page.tsx b/admin/src/pages/site-settings-page.tsx
index f5c7233..0e35f9c 100644
--- a/admin/src/pages/site-settings-page.tsx
+++ b/admin/src/pages/site-settings-page.tsx
@@ -1,19 +1,32 @@
-import { Bot, Check, Plus, RefreshCcw, Save, Trash2 } from 'lucide-react'
-import type { ReactNode } from 'react'
-import { startTransition, useCallback, useEffect, useMemo, useState } from 'react'
-import { Link } from 'react-router-dom'
-import { toast } from 'sonner'
+import { Bot, Check, Plus, RefreshCcw, Save, Trash2 } from "lucide-react";
+import type { ReactNode } from "react";
+import {
+  startTransition,
+  useCallback,
+  useEffect,
+  useMemo,
+  useState,
+} from "react";
+import { Link } from "react-router-dom";
+import { toast } from "sonner";
 
-import { MediaUrlControls } from '@/components/media-url-controls'
-import { Badge } from '@/components/ui/badge'
-import { Button } from '@/components/ui/button'
-import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
-import { Input } from '@/components/ui/input'
-import { Label } from '@/components/ui/label'
-import { Select } from '@/components/ui/select'
-import { Skeleton } from '@/components/ui/skeleton'
-import { Textarea } from '@/components/ui/textarea'
-import { adminApi, ApiError } from '@/lib/api'
+import { MediaUrlControls } from "@/components/media-url-controls";
+import { Badge } from "@/components/ui/badge";
+import { Button } from "@/components/ui/button";
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+} from "@/components/ui/card";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import { Select } from "@/components/ui/select";
+import { Skeleton } from "@/components/ui/skeleton";
+import { Textarea } from "@/components/ui/textarea";
+import { adminApi, ApiError } from "@/lib/api";
+import { formatWorkerProgress } from "@/lib/worker-progress";
 import type {
   AdminSiteSettingsResponse,
   AiProviderConfig,
@@ -21,102 +34,113 @@ import type {
   MusicTrack,
   SiteSettingsPayload,
   WorkerJobRecord,
-} from '@/lib/types'
+} from "@/lib/types";
 
 function createEmptyMusicTrack(): MusicTrack {
   return {
-    title: '',
-    artist: '',
-    album: '',
-    url: '',
-    cover_image_url: '',
-    accent_color: '',
-    description: '',
-  }
+    title: "",
+    artist: "",
+    album: "",
+    url: "",
+    cover_image_url: "",
+    accent_color: "",
+    description: "",
+  };
 }
 
 function createAiProviderId() {
-  if (typeof crypto !== 'undefined' && typeof crypto.randomUUID === 'function') {
-    return `provider-${crypto.randomUUID()}`
+  if (
+    typeof crypto !== "undefined" &&
+    typeof crypto.randomUUID === "function"
+  ) {
+    return `provider-${crypto.randomUUID()}`;
   }
 
-  return `provider-${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 8)}`
+  return `provider-${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 8)}`;
 }
 
 function createEmptyAiProvider(): AiProviderConfig {
   return {
     id: createAiProviderId(),
-    name: '',
-    provider: 'openai',
-    api_base: '',
-    api_key: '',
-    chat_model: '',
-    image_model: '',
-  }
+    name: "",
+    provider: "openai",
+    api_base: "",
+    api_key: "",
+    chat_model: "",
+    image_model: "",
+  };
 }
 
 const AI_PROVIDER_OPTIONS = [
-  { value: 'openai', label: 'OpenAI' },
-  { value: 'anthropic', label: 'Anthropic' },
-  { value: 'gemini', label: 'Gemini' },
-  { value: 'cloudflare', label: 'Cloudflare Workers AI' },
-  { value: 'newapi', label: 'NewAPI / Responses' },
-  { value: 'openai-compatible', label: 'OpenAI Compatible' },
-] as const
+  { value: "openai", label: "OpenAI" },
+  { value: "anthropic", label: "Anthropic" },
+  { value: "gemini", label: "Gemini" },
+  { value: "cloudflare", label: "Cloudflare Workers AI" },
+  { value: "newapi", label: "NewAPI / Responses" },
+  { value: "openai-compatible", label: "OpenAI Compatible" },
+] as const;
 
 const MEDIA_STORAGE_PROVIDER_OPTIONS = [
-  { value: 'r2', label: 'Cloudflare R2' },
-  { value: 'minio', label: 'MinIO' },
-] as const
+  { value: "r2", label: "Cloudflare R2" },
+  { value: "minio", label: "MinIO" },
+] as const;
 
 const NOTIFICATION_CHANNEL_OPTIONS = [
-  { value: 'webhook', label: 'Webhook' },
-  { value: 'ntfy', label: 'ntfy' },
-] as const
+  { value: "webhook", label: "Webhook" },
+  { value: "ntfy", label: "ntfy" },
+] as const;
 
 const HUMAN_VERIFICATION_MODE_OPTIONS = [
-  { value: 'off', label: '关闭' },
-  { value: 'captcha', label: '普通验证码' },
-  { value: 'turnstile', label: 'Turnstile' },
-] as const
+  { value: "off", label: "关闭" },
+  { value: "captcha", label: "普通验证码" },
+  { value: "turnstile", label: "Turnstile" },
+] as const;
 
 function normalizeHumanVerificationMode(
   value: string | null | undefined,
   fallback: HumanVerificationMode,
 ): HumanVerificationMode {
-  switch ((value ?? '').trim().toLowerCase()) {
-    case 'off':
-      return 'off'
-    case 'captcha':
-    case 'normal':
-    case 'simple':
-      return 'captcha'
-    case 'turnstile':
-      return 'turnstile'
+  switch ((value ?? "").trim().toLowerCase()) {
+    case "off":
+      return "off";
+    case "captcha":
+    case "normal":
+    case "simple":
+      return "captcha";
+    case "turnstile":
+      return "turnstile";
     default:
-      return fallback
+      return fallback;
   }
 }
 
 function isCloudflareProvider(provider: string | null | undefined) {
-  const normalized = provider?.trim().toLowerCase()
-  return normalized === 'cloudflare' || normalized === 'cloudflare-workers-ai' || normalized === 'workers-ai'
+  const normalized = provider?.trim().toLowerCase();
+  return (
+    normalized === "cloudflare" ||
+    normalized === "cloudflare-workers-ai" ||
+    normalized === "workers-ai"
+  );
 }
 
 function buildCloudflareAiPreset(current: AiProviderConfig): AiProviderConfig {
   return {
     ...current,
-    name: current.name?.trim() ? current.name : 'Cloudflare Workers AI',
-    provider: 'cloudflare',
-    chat_model: current.chat_model?.trim() || '@cf/meta/llama-3.1-8b-instruct',
-  }
+    name: current.name?.trim() ? current.name : "Cloudflare Workers AI",
+    provider: "cloudflare",
+    chat_model: current.chat_model?.trim() || "@cf/meta/llama-3.1-8b-instruct",
+  };
 }
 
 function normalizeSettingsResponse(
   input: AdminSiteSettingsResponse,
 ): AdminSiteSettingsResponse {
-  const aiProviders = Array.isArray(input.ai_providers) ? input.ai_providers : []
-  const searchSynonyms = Array.isArray(input.search_synonyms) ? input.search_synonyms : []
+  const aiProviders = Array.isArray(input.ai_providers)
+    ? input.ai_providers
+    : [];
+  const searchSynonyms = Array.isArray(input.search_synonyms)
+    ? input.search_synonyms
+    : [];
 
   return {
     ...input,
@@ -124,11 +148,11 @@ function normalizeSettingsResponse(
     search_synonyms: searchSynonyms,
     comment_verification_mode: normalizeHumanVerificationMode(
       input.comment_verification_mode,
-      input.comment_turnstile_enabled ? 'turnstile' : 'captcha',
+      input.comment_turnstile_enabled ? "turnstile" : "captcha",
     ),
     subscription_verification_mode: normalizeHumanVerificationMode(
       input.subscription_verification_mode,
-      input.subscription_turnstile_enabled ? 'turnstile' : 'off',
+      input.subscription_turnstile_enabled ? "turnstile" : "off",
     ),
     turnstile_site_key: input.turnstile_site_key ?? null,
     turnstile_secret_key: input.turnstile_secret_key ?? null,
@@ -140,7 +164,7 @@ function normalizeSettingsResponse(
     maintenance_access_code: input.maintenance_access_code ?? null,
     ai_active_provider_id:
       input.ai_active_provider_id ?? aiProviders[0]?.id ?? null,
-  }
+  };
 }
 
 function Field({
@@ -148,22 +172,26 @@ function Field({
   hint,
   children,
 }: {
-  label: string
-  hint?: string
-  children: ReactNode
+  label: string;
+  hint?: string;
+  children: ReactNode;
 }) {
   return (
     <div className="space-y-2">
       <Label>{label}</Label>
       {children}
-      {hint ? <p className="text-xs leading-5 text-muted-foreground">{hint}</p> : null}
+      {hint ? (
+        <p className="text-xs leading-5 text-muted-foreground">{hint}</p>
+      ) : null}
     </div>
-  )
+  );
 }
 
 function toPayload(form: AdminSiteSettingsResponse): SiteSettingsPayload {
-  const commentTurnstileEnabled = form.comment_verification_mode === 'turnstile'
-  const subscriptionTurnstileEnabled = form.subscription_verification_mode === 'turnstile'
+  const commentTurnstileEnabled =
+    form.comment_verification_mode === "turnstile";
+  const subscriptionTurnstileEnabled =
+    form.subscription_verification_mode === "turnstile";
 
   return {
     siteName: form.site_name,
@@ -231,162 +259,198 @@ function toPayload(form: AdminSiteSettingsResponse): SiteSettingsPayload {
     subscriptionPopupDescription: form.subscription_popup_description,
     subscriptionPopupDelaySeconds: form.subscription_popup_delay_seconds,
     searchSynonyms: form.search_synonyms,
-  }
+  };
 }
 
 export function SiteSettingsPage() {
-  const [form, setForm] = useState<AdminSiteSettingsResponse | null>(null)
-  const [loading, setLoading] = useState(true)
-  const [saving, setSaving] = useState(false)
-  const [reindexing, setReindexing] = useState(false)
-  const [reindexJobId, setReindexJobId] = useState<number | null>(null)
-  const [reindexJobStatus, setReindexJobStatus] = useState<WorkerJobRecord['status'] | null>(null)
-  const [testingProvider, setTestingProvider] = useState(false)
-  const [testingImageProvider, setTestingImageProvider] = useState(false)
-  const [testingR2Storage, setTestingR2Storage] = useState(false)
-  const [selectedTrackIndex, setSelectedTrackIndex] = useState(0)
-  const [selectedProviderIndex, setSelectedProviderIndex] = useState(0)
+  const [form, setForm] = useState<AdminSiteSettingsResponse | null>(null);
+  const [loading, setLoading] = useState(true);
+  const [saving, setSaving] = useState(false);
+  const [reindexing, setReindexing] = useState(false);
+  const [reindexJobId, setReindexJobId] = useState<number | null>(null);
+  const [reindexJobStatus, setReindexJobStatus] = useState<
+    WorkerJobRecord["status"] | null
+  >(null);
+  const [reindexJobResult, setReindexJobResult] =
+    useState<WorkerJobRecord["result"]>(null);
+  const [testingProvider, setTestingProvider] = useState(false);
+  const [testingImageProvider, setTestingImageProvider] = useState(false);
+  const [testingR2Storage, setTestingR2Storage] = useState(false);
+  const [selectedTrackIndex, setSelectedTrackIndex] = useState(0);
+  const [selectedProviderIndex, setSelectedProviderIndex] = useState(0);
 
   const loadSettings = useCallback(async (showToast = false) => {
     try {
-      const next = normalizeSettingsResponse(await adminApi.getSiteSettings())
+      const next = normalizeSettingsResponse(await adminApi.getSiteSettings());
+      let activeReindexJob: WorkerJobRecord | null | undefined = undefined;
+
+      try {
+        const workerJobs = await adminApi.listWorkerJobs({
+          workerName: "worker.ai_reindex",
+          limit: 8,
+        });
+        activeReindexJob =
+          workerJobs.jobs.find(
+            (item) => item.status === "queued" || item.status === "running",
+          ) ?? null;
+      } catch {
+        activeReindexJob = undefined;
+      }
+
       startTransition(() => {
-        setForm(next)
-      })
+        setForm(next);
+        if (activeReindexJob !== undefined) {
+          setReindexing(Boolean(activeReindexJob));
+          setReindexJobId(activeReindexJob?.id ?? null);
+          setReindexJobStatus(activeReindexJob?.status ?? null);
+          setReindexJobResult(activeReindexJob?.result ?? null);
+        }
+      });
 
       if (showToast) {
-        toast.success('站点设置已刷新。')
+        toast.success("站点设置已刷新。");
       }
     } catch (error) {
       if (error instanceof ApiError && error.status === 401) {
-        return
+        return;
       }
-      toast.error(error instanceof ApiError ? error.message : '无法加载站点设置。')
+      toast.error(
+        error instanceof ApiError ? error.message : "无法加载站点设置。",
+      );
     } finally {
-      setLoading(false)
+      setLoading(false);
     }
-  }, [])
+  }, []);
 
   useEffect(() => {
-    void loadSettings(false)
-  }, [loadSettings])
+    void loadSettings(false);
+  }, [loadSettings]);
 
   useEffect(() => {
     if (!form?.music_playlist.length) {
-      setSelectedTrackIndex(0)
-      return
+      setSelectedTrackIndex(0);
+      return;
     }
 
-    setSelectedTrackIndex((current) => Math.min(current, form.music_playlist.length - 1))
-  }, [form?.music_playlist.length])
+    setSelectedTrackIndex((current) =>
+      Math.min(current, form.music_playlist.length - 1),
+    );
+  }, [form?.music_playlist.length]);
 
   useEffect(() => {
     if (!form?.ai_providers.length) {
-      setSelectedProviderIndex(0)
-      return
+      setSelectedProviderIndex(0);
+      return;
     }
 
     setSelectedProviderIndex((current) => {
       const activeIndex = form.ai_providers.findIndex(
         (provider) => provider.id === form.ai_active_provider_id,
-      )
+      );
 
       if (activeIndex >= 0) {
-        return activeIndex
+        return activeIndex;
       }
 
-      return Math.min(current, form.ai_providers.length - 1)
-    })
-  }, [form?.ai_active_provider_id, form?.ai_providers])
+      return Math.min(current, form.ai_providers.length - 1);
+    });
+  }, [form?.ai_active_provider_id, form?.ai_providers]);
 
   useEffect(() => {
     if (!reindexJobId) {
-      return
+      return;
     }
 
-    let cancelled = false
-    let timer: ReturnType<typeof setTimeout> | null = null
+    let cancelled = false;
+    let timer: ReturnType<typeof setTimeout> | null = null;
 
     const scheduleNextPoll = () => {
       timer = setTimeout(() => {
-        void pollJob()
-      }, 4000)
-    }
+        void pollJob();
+      }, 4000);
+    };
 
     const pollJob = async () => {
       try {
-        const job = await adminApi.getWorkerJob(reindexJobId)
+        const job = await adminApi.getWorkerJob(reindexJobId);
         if (cancelled) {
-          return
+          return;
         }
 
-        setReindexJobStatus(job.status)
+        setReindexJobStatus(job.status);
+        setReindexJobResult(job.result);
 
-        if (job.status === 'succeeded') {
-          setReindexing(false)
-          setReindexJobId(null)
-          setReindexJobStatus(null)
-          const indexedChunks = Number(job.result?.indexed_chunks ?? 0)
+        if (job.status === "succeeded") {
+          setReindexing(false);
+          setReindexJobId(null);
+          setReindexJobStatus(null);
+          setReindexJobResult(null);
+          const indexedChunks = Number(job.result?.indexed_chunks ?? 0);
           toast.success(
             indexedChunks > 0
               ? `AI 索引重建完成，共生成 ${indexedChunks} 个分块。`
-              : 'AI 索引重建完成。',
-          )
-          await loadSettings(false)
-          return
+              : "AI 索引重建完成。",
+          );
+          await loadSettings(false);
+          return;
         }
 
-        if (job.status === 'failed' || job.status === 'cancelled') {
-          setReindexing(false)
-          setReindexJobId(null)
-          setReindexJobStatus(null)
-          toast.error(job.error_text?.trim() || 'AI 重建索引失败。')
-          return
+        if (job.status === "failed" || job.status === "cancelled") {
+          setReindexing(false);
+          setReindexJobId(null);
+          setReindexJobStatus(null);
+          setReindexJobResult(null);
+          toast.error(job.error_text?.trim() || "AI 重建索引失败。");
+          return;
         }
 
-        scheduleNextPoll()
+        scheduleNextPoll();
       } catch (error) {
         if (cancelled) {
-          return
+          return;
         }
 
-        scheduleNextPoll()
+        scheduleNextPoll();
         if (error instanceof ApiError && error.status === 401) {
-          return
+          return;
         }
       }
-    }
+    };
 
-    void pollJob()
+    void pollJob();
 
     return () => {
-      cancelled = true
+      cancelled = true;
       if (timer) {
-        clearTimeout(timer)
+        clearTimeout(timer);
       }
-    }
-  }, [loadSettings, reindexJobId])
+    };
+  }, [loadSettings, reindexJobId]);
 
   const updateField = <K extends keyof AdminSiteSettingsResponse>(
     key: K,
     value: AdminSiteSettingsResponse[K],
   ) => {
-    setForm((current) => (current ? { ...current, [key]: value } : current))
-  }
+    setForm((current) => (current ? { ...current, [key]: value } : current));
+  };
 
-  const updateMusicTrack = <K extends keyof MusicTrack>(index: number, key: K, value: MusicTrack[K]) => {
+  const updateMusicTrack = <K extends keyof MusicTrack>(
+    index: number,
+    key: K,
+    value: MusicTrack[K],
+  ) => {
     setForm((current) => {
       if (!current) {
-        return current
+        return current;
       }
 
       const nextPlaylist = current.music_playlist.map((track, trackIndex) =>
         trackIndex === index ? { ...track, [key]: value } : track,
-      )
+      );
 
-      return { ...current, music_playlist: nextPlaylist }
-    })
-  }
+      return { ...current, music_playlist: nextPlaylist };
+    });
+  };
 
   const updateAiProvider = <K extends keyof AiProviderConfig>(
     index: number,
@@ -395,153 +459,182 @@ export function SiteSettingsPage() {
   ) => {
     setForm((current) => {
       if (!current) {
-        return current
+        return current;
       }
 
-      const nextProviders = current.ai_providers.map((provider, providerIndex) =>
-        providerIndex === index ? { ...provider, [key]: value } : provider,
-      )
+      const nextProviders = current.ai_providers.map(
+        (provider, providerIndex) =>
+          providerIndex === index ? { ...provider, [key]: value } : provider,
+      );
 
-      return { ...current, ai_providers: nextProviders }
-    })
-  }
+      return { ...current, ai_providers: nextProviders };
+    });
+  };
 
   const addMusicTrack = () => {
     setForm((current) => {
       if (!current) {
-        return current
+        return current;
       }
 
-      const nextPlaylist = [...current.music_playlist, createEmptyMusicTrack()]
-      setSelectedTrackIndex(nextPlaylist.length - 1)
+      const nextPlaylist = [...current.music_playlist, createEmptyMusicTrack()];
+      setSelectedTrackIndex(nextPlaylist.length - 1);
 
-      return { ...current, music_playlist: nextPlaylist }
-    })
-  }
+      return { ...current, music_playlist: nextPlaylist };
+    });
+  };
 
   const removeMusicTrack = (index: number) => {
     setForm((current) => {
       if (!current) {
-        return current
+        return current;
       }
 
-      const nextPlaylist = current.music_playlist.filter((_, trackIndex) => trackIndex !== index)
+      const nextPlaylist = current.music_playlist.filter(
+        (_, trackIndex) => trackIndex !== index,
+      );
       setSelectedTrackIndex((currentIndex) =>
-        Math.max(0, Math.min(currentIndex > index ? currentIndex - 1 : currentIndex, nextPlaylist.length - 1)),
-      )
+        Math.max(
+          0,
+          Math.min(
+            currentIndex > index ? currentIndex - 1 : currentIndex,
+            nextPlaylist.length - 1,
+          ),
+        ),
+      );
 
       return {
         ...current,
         music_playlist: nextPlaylist,
-      }
-    })
-  }
+      };
+    });
+  };
 
   const addAiProvider = () => {
     setForm((current) => {
       if (!current) {
-        return current
+        return current;
       }
 
-      const nextProvider = createEmptyAiProvider()
-      const nextProviders = [...current.ai_providers, nextProvider]
-      setSelectedProviderIndex(nextProviders.length - 1)
+      const nextProvider = createEmptyAiProvider();
+      const nextProviders = [...current.ai_providers, nextProvider];
+      setSelectedProviderIndex(nextProviders.length - 1);
 
       return {
         ...current,
         ai_providers: nextProviders,
         ai_active_provider_id: current.ai_active_provider_id ?? nextProvider.id,
-      }
-    })
-  }
+      };
+    });
+  };
 
   const removeAiProvider = (index: number) => {
     setForm((current) => {
       if (!current) {
-        return current
+        return current;
       }
 
-      const removed = current.ai_providers[index]
-      const nextProviders = current.ai_providers.filter((_, providerIndex) => providerIndex !== index)
+      const removed = current.ai_providers[index];
+      const nextProviders = current.ai_providers.filter(
+        (_, providerIndex) => providerIndex !== index,
+      );
       const nextActiveProviderId =
-        removed?.id === current.ai_active_provider_id ? (nextProviders[0]?.id ?? null) : current.ai_active_provider_id
+        removed?.id === current.ai_active_provider_id
+          ? (nextProviders[0]?.id ?? null)
+          : current.ai_active_provider_id;
 
       setSelectedProviderIndex((currentIndex) =>
-        Math.max(0, Math.min(currentIndex > index ? currentIndex - 1 : currentIndex, nextProviders.length - 1)),
-      )
+        Math.max(
+          0,
+          Math.min(
+            currentIndex > index ? currentIndex - 1 : currentIndex,
+            nextProviders.length - 1,
+          ),
+        ),
+      );
 
       return {
         ...current,
         ai_providers: nextProviders,
         ai_active_provider_id: nextActiveProviderId,
-      }
-    })
-  }
+      };
+    });
+  };
 
   const setActiveAiProvider = (providerId: string) => {
-    updateField('ai_active_provider_id', providerId)
-  }
+    updateField("ai_active_provider_id", providerId);
+  };
 
   const applyCloudflarePreset = (index: number) => {
     setForm((current) => {
       if (!current) {
-        return current
+        return current;
       }
 
-      const nextProviders = current.ai_providers.map((provider, providerIndex) =>
-        providerIndex === index ? buildCloudflareAiPreset(provider) : provider,
-      )
+      const nextProviders = current.ai_providers.map(
+        (provider, providerIndex) =>
+          providerIndex === index
+            ? buildCloudflareAiPreset(provider)
+            : provider,
+      );
 
       return {
         ...current,
         ai_providers: nextProviders,
-      }
-    })
-  }
+      };
+    });
+  };
 
   const applyCloudflareImagePreset = () => {
     setForm((current) => {
       if (!current) {
-        return current
+        return current;
       }
 
       return {
         ...current,
-        ai_image_provider: 'cloudflare',
+        ai_image_provider: "cloudflare",
         ai_image_model:
-          current.ai_image_model?.trim() || '@cf/black-forest-labs/flux-2-klein-4b',
-      }
-    })
-  }
+          current.ai_image_model?.trim() ||
+          "@cf/black-forest-labs/flux-2-klein-4b",
+      };
+    });
+  };
 
   const techStackValue = useMemo(
-    () => (form?.tech_stack.length ? form.tech_stack.join('\n') : ''),
+    () => (form?.tech_stack.length ? form.tech_stack.join("\n") : ""),
     [form?.tech_stack],
-  )
+  );
   const selectedTrack = useMemo(
     () => form?.music_playlist[selectedTrackIndex] ?? createEmptyMusicTrack(),
     [form, selectedTrackIndex],
-  )
+  );
   const selectedProvider = useMemo(
     () => form?.ai_providers[selectedProviderIndex] ?? createEmptyAiProvider(),
     [form, selectedProviderIndex],
-  )
+  );
   const activeProvider = useMemo(
-    () => form?.ai_providers.find((provider) => provider.id === form.ai_active_provider_id) ?? null,
+    () =>
+      form?.ai_providers.find(
+        (provider) => provider.id === form.ai_active_provider_id,
+      ) ?? null,
     [form],
-  )
+  );
   const selectedProviderIsCloudflare = useMemo(
     () => isCloudflareProvider(selectedProvider.provider),
     [selectedProvider.provider],
-  )
+  );
   const imageProviderIsCloudflare = useMemo(
     () => isCloudflareProvider(form?.ai_image_provider),
     [form?.ai_image_provider],
-  )
+  );
   const mediaStorageProvider = useMemo(
-    () => (form?.media_storage_provider?.trim().toLowerCase() === 'minio' ? 'minio' : 'r2'),
+    () =>
+      form?.media_storage_provider?.trim().toLowerCase() === "minio"
+        ? "minio"
+        : "r2",
     [form?.media_storage_provider],
-  )
+  );
 
   if (loading || !form) {
     return (
@@ -549,7 +642,7 @@ export function SiteSettingsPage() {
         <Skeleton className="h-48 rounded-3xl" />
         <Skeleton className="h-[540px] rounded-3xl" />
       </div>
-    )
+    );
   }
 
   return (
@@ -558,20 +651,31 @@ export function SiteSettingsPage() {
         <div className="space-y-3">
           <Badge variant="secondary">站点设置</Badge>
           <div>
-            <h2 className="text-3xl font-semibold tracking-tight">品牌、资料与 AI 控制</h2>
+            <h2 className="text-3xl font-semibold tracking-tight">
+              品牌、资料与 AI 控制
+            </h2>
             <p className="mt-2 max-w-3xl text-sm leading-7 text-muted-foreground">
-              这里统一维护前台站点使用的品牌信息、站长资料与 AI 配置，确保和后端数据模型一致。
+              这里统一维护前台站点使用的品牌信息、站长资料与 AI
+              配置，确保和后端数据模型一致。
             </p>
           </div>
         </div>
 
         <div className="flex flex-wrap items-center gap-3">
-          <Button variant="outline" onClick={() => void loadSettings(true)} data-testid="site-settings-refresh">
+          <Button
+            variant="outline"
+            onClick={() => void loadSettings(true)}
+            data-testid="site-settings-refresh"
+          >
             <RefreshCcw className="h-4 w-4" />
             刷新
           </Button>
           {reindexJobId ? (
-            <Button variant="outline" asChild data-testid="site-settings-reindex-job">
+            <Button
+              variant="outline"
+              asChild
+              data-testid="site-settings-reindex-job"
+            >
               <Link to={`/workers?job=${reindexJobId}`}>查看索引任务</Link>
             </Button>
           ) : null}
@@ -580,54 +684,68 @@ export function SiteSettingsPage() {
             disabled={reindexing}
             data-testid="site-settings-reindex"
             onClick={async () => {
-              let queued = false
+              let queued = false;
               try {
-                setReindexing(true)
-                setReindexJobStatus('queued')
-                const result = await adminApi.reindexAi()
-                queued = true
-                setReindexJobId(result.job.id)
-                setReindexJobStatus(result.job.status)
-                toast.success(`AI 重建任务已入队：#${result.job.id}`)
+                setReindexing(true);
+                setReindexJobStatus("queued");
+                setReindexJobResult(null);
+                const result = await adminApi.reindexAi();
+                queued = true;
+                setReindexJobId(result.job.id);
+                setReindexJobStatus(result.job.status);
+                setReindexJobResult(result.job.result);
+                toast.success(`AI 重建任务已入队：#${result.job.id}`);
               } catch (error) {
-                setReindexJobId(null)
-                setReindexJobStatus(null)
-                toast.error(error instanceof ApiError ? error.message : 'AI 重建索引失败。')
+                setReindexJobId(null);
+                setReindexJobStatus(null);
+                setReindexJobResult(null);
+                toast.error(
+                  error instanceof ApiError
+                    ? error.message
+                    : "AI 重建索引失败。",
+                );
               } finally {
                 if (!queued) {
-                  setReindexing(false)
+                  setReindexing(false);
                 }
               }
             }}
           >
             <Bot className="h-4 w-4" />
-            {reindexing ? '任务进行中...' : '重建 AI 索引'}
+            {reindexing ? "任务进行中..." : "重建 AI 索引"}
           </Button>
           <Button
             disabled={saving}
             data-testid="site-settings-save"
             onClick={async () => {
-              if (form.maintenance_mode_enabled && !form.maintenance_access_code?.trim()) {
-                toast.error('开启维护模式前请先填写访问口令。')
-                return
+              if (
+                form.maintenance_mode_enabled &&
+                !form.maintenance_access_code?.trim()
+              ) {
+                toast.error("开启维护模式前请先填写访问口令。");
+                return;
               }
 
               try {
-                setSaving(true)
-                const updated = await adminApi.updateSiteSettings(toPayload(form))
+                setSaving(true);
+                const updated = await adminApi.updateSiteSettings(
+                  toPayload(form),
+                );
                 startTransition(() => {
-                  setForm(normalizeSettingsResponse(updated))
-                })
-                toast.success('站点设置已保存。')
+                  setForm(normalizeSettingsResponse(updated));
+                });
+                toast.success("站点设置已保存。");
               } catch (error) {
-                toast.error(error instanceof ApiError ? error.message : '保存失败。')
+                toast.error(
+                  error instanceof ApiError ? error.message : "保存失败。",
+                );
               } finally {
-                setSaving(false)
+                setSaving(false);
               }
             }}
           >
             <Save className="h-4 w-4" />
-            {saving ? '保存中...' : '保存修改'}
+            {saving ? "保存中..." : "保存修改"}
           </Button>
         </div>
       </div>
@@ -635,138 +753,175 @@ export function SiteSettingsPage() {
       <div className="grid gap-6 xl:grid-cols-[minmax(0,1fr)_360px] 2xl:grid-cols-[minmax(0,1fr)_400px]">
         <div className="space-y-6">
           <Card>
-          <CardHeader>
-            <CardTitle>前台站点资料</CardTitle>
-            <CardDescription>
-              前台站点用于展示品牌、首页文案、站长资料和社交信息的全部字段。
-            </CardDescription>
-          </CardHeader>
-          <CardContent className="grid gap-6 lg:grid-cols-2">
-            <Field label="站点名称">
-              <Input
-                data-testid="site-settings-site-name"
-                value={form.site_name ?? ''}
-                onChange={(event) => updateField('site_name', event.target.value)}
-              />
-            </Field>
-            <Field label="站点短名">
-              <Input
-                value={form.site_short_name ?? ''}
-                onChange={(event) => updateField('site_short_name', event.target.value)}
-              />
-            </Field>
-            <Field label="站点 URL">
-              <Input
-                value={form.site_url ?? ''}
-                onChange={(event) => updateField('site_url', event.target.value)}
-              />
-            </Field>
-            <Field label="所在地">
-              <Input
-                value={form.location ?? ''}
-                onChange={(event) => updateField('location', event.target.value)}
-              />
-            </Field>
-            <Field label="站点标题" hint="用于页面标题与 SEO 展示。">
-              <Input
-                value={form.site_title ?? ''}
-                onChange={(event) => updateField('site_title', event.target.value)}
-              />
-            </Field>
-            <Field label="站长头衔">
-              <Input
-                value={form.owner_title ?? ''}
-                onChange={(event) => updateField('owner_title', event.target.value)}
-              />
-            </Field>
-            <div className="lg:col-span-2">
-              <Field label="站点简介">
-                <Textarea
-                  value={form.site_description ?? ''}
-                  onChange={(event) => updateField('site_description', event.target.value)}
-                />
-              </Field>
-            </div>
-            <Field label="首页主标题">
-              <Input
-                value={form.hero_title ?? ''}
-                onChange={(event) => updateField('hero_title', event.target.value)}
-              />
-            </Field>
-            <Field label="首页副标题">
-              <Input
-                value={form.hero_subtitle ?? ''}
-                onChange={(event) => updateField('hero_subtitle', event.target.value)}
-              />
-            </Field>
-            <Field label="站长名称">
-              <Input
-                value={form.owner_name ?? ''}
-                onChange={(event) => updateField('owner_name', event.target.value)}
-              />
-            </Field>
-            <Field label="头像 URL" hint="可直接填写外链，也可以上传 / 抓取 / 从媒体库选择后自动回填。">
-              <div className="space-y-3">
+            <CardHeader>
+              <CardTitle>前台站点资料</CardTitle>
+              <CardDescription>
+                前台站点用于展示品牌、首页文案、站长资料和社交信息的全部字段。
+              </CardDescription>
+            </CardHeader>
+            <CardContent className="grid gap-6 lg:grid-cols-2">
+              <Field label="站点名称">
                 <Input
-                  value={form.owner_avatar_url ?? ''}
-                  onChange={(event) => updateField('owner_avatar_url', event.target.value)}
-                />
-                <MediaUrlControls
-                  value={form.owner_avatar_url ?? ''}
-                  onChange={(ownerAvatarUrl) => updateField('owner_avatar_url', ownerAvatarUrl)}
-                  prefix="site-assets/"
-                  contextLabel="站长头像上传"
-                  remoteTitle={form.owner_name || form.site_name || '站长头像'}
-                  dataTestIdPrefix="site-owner-avatar"
-                />
-              </div>
-            </Field>
-            <div className="lg:col-span-2">
-              <Field label="站长简介">
-                <Textarea
-                  value={form.owner_bio ?? ''}
-                  onChange={(event) => updateField('owner_bio', event.target.value)}
-                />
-              </Field>
-            </div>
-            <Field label="GitHub">
-              <Input
-                value={form.social_github ?? ''}
-                onChange={(event) => updateField('social_github', event.target.value)}
-              />
-            </Field>
-            <Field label="Twitter / X">
-              <Input
-                value={form.social_twitter ?? ''}
-                onChange={(event) => updateField('social_twitter', event.target.value)}
-              />
-            </Field>
-            <div className="lg:col-span-2">
-              <Field label="邮箱 / mailto">
-                <Input
-                  value={form.social_email ?? ''}
-                  onChange={(event) => updateField('social_email', event.target.value)}
-                />
-              </Field>
-            </div>
-            <div className="lg:col-span-2">
-              <Field label="技术栈" hint="每行填写一个项目。">
-                <Textarea
-                  value={techStackValue}
+                  data-testid="site-settings-site-name"
+                  value={form.site_name ?? ""}
                   onChange={(event) =>
-                    updateField(
-                      'tech_stack',
-                      event.target.value
-                        .split('\n')
-                        .map((item) => item.trim())
-                        .filter(Boolean),
-                    )
+                    updateField("site_name", event.target.value)
                   }
                 />
               </Field>
-            </div>
-          </CardContent>
-        </Card>
+              <Field label="站点短名">
+                <Input
+                  value={form.site_short_name ?? ""}
+                  onChange={(event) =>
+                    updateField("site_short_name", event.target.value)
+                  }
+                />
+              </Field>
+              <Field label="站点 URL">
+                <Input
+                  value={form.site_url ?? ""}
+                  onChange={(event) =>
+                    updateField("site_url", event.target.value)
+                  }
+                />
+              </Field>
+              <Field label="所在地">
+                <Input
+                  value={form.location ?? ""}
+                  onChange={(event) =>
+                    updateField("location", event.target.value)
+                  }
+                />
+              </Field>
+              <Field label="站点标题" hint="用于页面标题与 SEO 展示。">
+                <Input
+                  value={form.site_title ?? ""}
+                  onChange={(event) =>
+                    updateField("site_title", event.target.value)
+                  }
+                />
+              </Field>
+              <Field label="站长头衔">
+                <Input
+                  value={form.owner_title ?? ""}
+                  onChange={(event) =>
+                    updateField("owner_title", event.target.value)
+                  }
+                />
+              </Field>
+              <div className="lg:col-span-2">
+                <Field label="站点简介">
+                  <Textarea
+                    value={form.site_description ?? ""}
+                    onChange={(event) =>
+                      updateField("site_description", event.target.value)
+                    }
+                  />
+                </Field>
+              </div>
+              <Field label="首页主标题">
+                <Input
+                  value={form.hero_title ?? ""}
+                  onChange={(event) =>
+                    updateField("hero_title", event.target.value)
+                  }
+                />
+              </Field>
+              <Field label="首页副标题">
+                <Input
+                  value={form.hero_subtitle ?? ""}
+                  onChange={(event) =>
+                    updateField("hero_subtitle", event.target.value)
+                  }
+                />
+              </Field>
+              <Field label="站长名称">
+                <Input
+                  value={form.owner_name ?? ""}
+                  onChange={(event) =>
+                    updateField("owner_name", event.target.value)
+                  }
+                />
+              </Field>
+              <Field
+                label="头像 URL"
+                hint="可直接填写外链，也可以上传 / 抓取 / 从媒体库选择后自动回填。"
+              >
+                <div className="space-y-3">
+                  <Input
+                    value={form.owner_avatar_url ?? ""}
+                    onChange={(event) =>
+                      updateField("owner_avatar_url", event.target.value)
+                    }
+                  />
+                  <MediaUrlControls
+                    value={form.owner_avatar_url ?? ""}
+                    onChange={(ownerAvatarUrl) =>
+                      updateField("owner_avatar_url", ownerAvatarUrl)
+                    }
+                    prefix="site-assets/"
+                    contextLabel="站长头像上传"
+                    remoteTitle={
+                      form.owner_name || form.site_name || "站长头像"
+                    }
+                    dataTestIdPrefix="site-owner-avatar"
+                  />
+                </div>
+              </Field>
+              <div className="lg:col-span-2">
+                <Field label="站长简介">
+                  <Textarea
+                    value={form.owner_bio ?? ""}
+                    onChange={(event) =>
+                      updateField("owner_bio", event.target.value)
+                    }
+                  />
+                </Field>
+              </div>
+              <Field label="GitHub">
+                <Input
+                  value={form.social_github ?? ""}
+                  onChange={(event) =>
+                    updateField("social_github", event.target.value)
+                  }
+                />
+              </Field>
+              <Field label="Twitter / X">
+                <Input
+                  value={form.social_twitter ?? ""}
+                  onChange={(event) =>
+                    updateField("social_twitter", event.target.value)
+                  }
+                />
+              </Field>
+              <div className="lg:col-span-2">
+                <Field label="邮箱 / mailto">
+                  <Input
+                    value={form.social_email ?? ""}
+                    onChange={(event) =>
+                      updateField("social_email", event.target.value)
+                    }
+                  />
+                </Field>
+              </div>
+              <div className="lg:col-span-2">
+                <Field label="技术栈" hint="每行填写一个项目。">
+                  <Textarea
+                    value={techStackValue}
+                    onChange={(event) =>
+                      updateField(
+                        "tech_stack",
+                        event.target.value
+                          .split("\n")
+                          .map((item) => item.trim())
+                          .filter(Boolean),
+                      )
+                    }
+                  />
+                </Field>
+              </div>
+            </CardContent>
+          </Card>
 
           <Card>
             <CardHeader>
@@ -781,7 +936,10 @@ export function SiteSettingsPage() {
                   type="checkbox"
                   checked={form.subscription_popup_enabled}
                   onChange={(event) =>
-                    updateField('subscription_popup_enabled', event.target.checked)
+                    updateField(
+                      "subscription_popup_enabled",
+                      event.target.checked,
+                    )
                   }
                   className="mt-1 h-4 w-4 rounded border-input text-primary focus:ring-ring"
                 />
@@ -798,13 +956,16 @@ export function SiteSettingsPage() {
                   <input
                     type="checkbox"
                     checked={form.web_push_enabled}
-                    onChange={(event) => updateField('web_push_enabled', event.target.checked)}
+                    onChange={(event) =>
+                      updateField("web_push_enabled", event.target.checked)
+                    }
                     className="mt-1 h-4 w-4 rounded border-input text-primary focus:ring-ring"
                   />
                   <div>
                     <div className="font-medium">开启浏览器推送</div>
                     <p className="mt-1 text-sm leading-6 text-muted-foreground">
-                      前台订阅弹窗会增加浏览器通知授权入口。保存下方 VAPID 公私钥后，前台会直接读取当前后台配置。
+                      前台订阅弹窗会增加浏览器通知授权入口。保存下方 VAPID
+                      公私钥后，前台会直接读取当前后台配置。
                     </p>
                   </div>
                 </label>
@@ -818,8 +979,11 @@ export function SiteSettingsPage() {
                       value={form.subscription_verification_mode}
                       onChange={(event) =>
                         updateField(
-                          'subscription_verification_mode',
-                          normalizeHumanVerificationMode(event.target.value, 'off'),
+                          "subscription_verification_mode",
+                          normalizeHumanVerificationMode(
+                            event.target.value,
+                            "off",
+                          ),
                         )
                       }
                     >
@@ -834,16 +998,25 @@ export function SiteSettingsPage() {
               </div>
 
               <div className="grid gap-4 lg:grid-cols-2">
-                <Field label="弹窗标题" hint="建议直接传达价值，例如“订阅更新”或“别错过新文章”。">
+                <Field
+                  label="弹窗标题"
+                  hint="建议直接传达价值，例如“订阅更新”或“别错过新文章”。"
+                >
                   <Input
                     data-testid="site-settings-popup-title"
                     value={form.subscription_popup_title}
                     onChange={(event) =>
-                      updateField('subscription_popup_title', event.target.value)
+                      updateField(
+                        "subscription_popup_title",
+                        event.target.value,
+                      )
                     }
                   />
                 </Field>
-                <Field label="触发延迟（秒）" hint="建议保持在 10～20 秒，避免首屏强打断。">
+                <Field
+                  label="触发延迟（秒）"
+                  hint="建议保持在 10～20 秒，避免首屏强打断。"
+                >
                   <Input
                     type="number"
                     min={3}
@@ -851,7 +1024,7 @@ export function SiteSettingsPage() {
                     value={form.subscription_popup_delay_seconds}
                     onChange={(event) =>
                       updateField(
-                        'subscription_popup_delay_seconds',
+                        "subscription_popup_delay_seconds",
                         event.target.value ? Number(event.target.value) : 18,
                       )
                     }
@@ -866,7 +1039,10 @@ export function SiteSettingsPage() {
                 <Textarea
                   value={form.subscription_popup_description}
                   onChange={(event) =>
-                    updateField('subscription_popup_description', event.target.value)
+                    updateField(
+                      "subscription_popup_description",
+                      event.target.value,
+                    )
                   }
                 />
               </Field>
@@ -886,7 +1062,10 @@ export function SiteSettingsPage() {
                   type="checkbox"
                   checked={form.maintenance_mode_enabled}
                   onChange={(event) =>
-                    updateField('maintenance_mode_enabled', event.target.checked)
+                    updateField(
+                      "maintenance_mode_enabled",
+                      event.target.checked,
+                    )
                   }
                   className="mt-1 h-4 w-4 rounded border-input text-primary focus:ring-ring"
                 />
@@ -905,17 +1084,21 @@ export function SiteSettingsPage() {
                 >
                   <Input
                     type="password"
-                    value={form.maintenance_access_code ?? ''}
+                    value={form.maintenance_access_code ?? ""}
                     onChange={(event) =>
-                      updateField('maintenance_access_code', event.target.value)
+                      updateField("maintenance_access_code", event.target.value)
                     }
                     placeholder="例如：staging-2026"
                   />
                 </Field>
 
                 <div className="flex items-end">
-                  <Badge variant={form.maintenance_mode_enabled ? 'warning' : 'outline'}>
-                    {form.maintenance_mode_enabled ? '维护中' : '正常开放'}
+                  <Badge
+                    variant={
+                      form.maintenance_mode_enabled ? "warning" : "outline"
+                    }
+                  >
+                    {form.maintenance_mode_enabled ? "维护中" : "正常开放"}
                   </Badge>
                 </div>
               </div>
@@ -935,8 +1118,10 @@ export function SiteSettingsPage() {
                 hint="评论区和订阅弹窗共用这一套站点 key，保存后前台会在运行时读取。"
               >
                 <Input
-                  value={form.turnstile_site_key ?? ''}
-                  onChange={(event) => updateField('turnstile_site_key', event.target.value)}
+                  value={form.turnstile_site_key ?? ""}
+                  onChange={(event) =>
+                    updateField("turnstile_site_key", event.target.value)
+                  }
                   placeholder="0x4AAAA..."
                 />
               </Field>
@@ -945,8 +1130,10 @@ export function SiteSettingsPage() {
                 hint="后端验证 token 使用；留空可清除数据库配置并回退到环境变量。"
               >
                 <Input
-                  value={form.turnstile_secret_key ?? ''}
-                  onChange={(event) => updateField('turnstile_secret_key', event.target.value)}
+                  value={form.turnstile_secret_key ?? ""}
+                  onChange={(event) =>
+                    updateField("turnstile_secret_key", event.target.value)
+                  }
                   placeholder="ts-secret-key"
                 />
               </Field>
@@ -955,9 +1142,9 @@ export function SiteSettingsPage() {
                 hint="浏览器订阅按钮会把这把 public key 下发到前台。"
               >
                 <Textarea
-                  value={form.web_push_vapid_public_key ?? ''}
+                  value={form.web_push_vapid_public_key ?? ""}
                   onChange={(event) =>
-                    updateField('web_push_vapid_public_key', event.target.value)
+                    updateField("web_push_vapid_public_key", event.target.value)
                   }
                   placeholder="BEl6..."
                   rows={3}
@@ -968,9 +1155,12 @@ export function SiteSettingsPage() {
                 hint="后端发送浏览器推送时签名使用。"
               >
                 <Textarea
-                  value={form.web_push_vapid_private_key ?? ''}
+                  value={form.web_push_vapid_private_key ?? ""}
                   onChange={(event) =>
-                    updateField('web_push_vapid_private_key', event.target.value)
+                    updateField(
+                      "web_push_vapid_private_key",
+                      event.target.value,
+                    )
                   }
                   placeholder="5aQ..."
                   rows={3}
@@ -982,9 +1172,9 @@ export function SiteSettingsPage() {
                   hint="推荐填写 mailto:you@example.com；留空时会优先回退到环境变量，再退回站点 URL / 默认值。"
                 >
                   <Input
-                    value={form.web_push_vapid_subject ?? ''}
+                    value={form.web_push_vapid_subject ?? ""}
                     onChange={(event) =>
-                      updateField('web_push_vapid_subject', event.target.value)
+                      updateField("web_push_vapid_subject", event.target.value)
                     }
                     placeholder="mailto:admin@example.com"
                   />
@@ -1001,45 +1191,64 @@ export function SiteSettingsPage() {
               </CardDescription>
             </CardHeader>
             <CardContent className="grid gap-6 lg:grid-cols-2">
-              <Field label="Favicon URL" hint="浏览器标签页图标；支持外链，也支持上传 / 抓取 / 选择媒体库。">
+              <Field
+                label="Favicon URL"
+                hint="浏览器标签页图标；支持外链，也支持上传 / 抓取 / 选择媒体库。"
+              >
                 <div className="space-y-3">
                   <Input
-                    value={form.seo_favicon_url ?? ''}
-                    onChange={(event) => updateField('seo_favicon_url', event.target.value)}
+                    value={form.seo_favicon_url ?? ""}
+                    onChange={(event) =>
+                      updateField("seo_favicon_url", event.target.value)
+                    }
                   />
                   <MediaUrlControls
-                    value={form.seo_favicon_url ?? ''}
-                    onChange={(seoFaviconUrl) => updateField('seo_favicon_url', seoFaviconUrl)}
+                    value={form.seo_favicon_url ?? ""}
+                    onChange={(seoFaviconUrl) =>
+                      updateField("seo_favicon_url", seoFaviconUrl)
+                    }
                     prefix="seo-assets/"
                     contextLabel="站点 favicon 上传"
-                    remoteTitle={form.site_name || form.site_title || '站点 favicon'}
+                    remoteTitle={
+                      form.site_name || form.site_title || "站点 favicon"
+                    }
                     dataTestIdPrefix="site-favicon"
                   />
                 </div>
               </Field>
-              <Field label="默认 OG 图 URL" hint="文章未单独设置时作为分享图回退，也支持上传 / 抓取 / 选择媒体库。">
+              <Field
+                label="默认 OG 图 URL"
+                hint="文章未单独设置时作为分享图回退，也支持上传 / 抓取 / 选择媒体库。"
+              >
                 <div className="space-y-3">
                   <Input
-                    value={form.seo_default_og_image ?? ''}
-                    onChange={(event) => updateField('seo_default_og_image', event.target.value)}
+                    value={form.seo_default_og_image ?? ""}
+                    onChange={(event) =>
+                      updateField("seo_default_og_image", event.target.value)
+                    }
                   />
                   <MediaUrlControls
-                    value={form.seo_default_og_image ?? ''}
+                    value={form.seo_default_og_image ?? ""}
                     onChange={(seoDefaultOgImage) =>
-                      updateField('seo_default_og_image', seoDefaultOgImage)
+                      updateField("seo_default_og_image", seoDefaultOgImage)
                     }
                     prefix="seo-assets/"
                     contextLabel="默认 OG 图上传"
-                    remoteTitle={form.site_name || form.site_title || '默认 OG 图'}
+                    remoteTitle={
+                      form.site_name || form.site_title || "默认 OG 图"
+                    }
                     dataTestIdPrefix="site-default-og"
                   />
                 </div>
               </Field>
               <Field label="Twitter / X Handle" hint="例如 @initcool。">
                 <Input
-                  value={form.seo_default_twitter_handle ?? ''}
+                  value={form.seo_default_twitter_handle ?? ""}
                   onChange={(event) =>
-                    updateField('seo_default_twitter_handle', event.target.value)
+                    updateField(
+                      "seo_default_twitter_handle",
+                      event.target.value,
+                    )
                   }
                 />
               </Field>
@@ -1049,7 +1258,10 @@ export function SiteSettingsPage() {
                     type="checkbox"
                     checked={form.seo_wechat_share_qr_enabled}
                     onChange={(event) =>
-                      updateField('seo_wechat_share_qr_enabled', event.target.checked)
+                      updateField(
+                        "seo_wechat_share_qr_enabled",
+                        event.target.checked,
+                      )
                     }
                     className="mt-1 h-4 w-4 rounded border-input text-primary focus:ring-ring"
                   />
@@ -1066,7 +1278,10 @@ export function SiteSettingsPage() {
                   <Select
                     value={form.notification_channel_type}
                     onChange={(event) =>
-                      updateField('notification_channel_type', event.target.value)
+                      updateField(
+                        "notification_channel_type",
+                        event.target.value,
+                      )
                     }
                   >
                     {NOTIFICATION_CHANNEL_OPTIONS.map((item) => (
@@ -1079,20 +1294,23 @@ export function SiteSettingsPage() {
                 <Field
                   label="通知目标"
                   hint={
-                    form.notification_channel_type === 'ntfy'
-                      ? '支持 topic 名称或完整 ntfy URL。'
-                      : '评论和友链申请会向这个地址推送 JSON。'
+                    form.notification_channel_type === "ntfy"
+                      ? "支持 topic 名称或完整 ntfy URL。"
+                      : "评论和友链申请会向这个地址推送 JSON。"
                   }
                 >
                   <Input
-                    value={form.notification_webhook_url ?? ''}
+                    value={form.notification_webhook_url ?? ""}
                     onChange={(event) =>
-                      updateField('notification_webhook_url', event.target.value)
+                      updateField(
+                        "notification_webhook_url",
+                        event.target.value,
+                      )
                     }
                     placeholder={
-                      form.notification_channel_type === 'ntfy'
-                        ? 'blog-admin 或 https://ntfy.example.com/blog-admin'
-                        : 'https://example.com/hooks/termi'
+                      form.notification_channel_type === "ntfy"
+                        ? "blog-admin 或 https://ntfy.example.com/blog-admin"
+                        : "https://example.com/hooks/termi"
                     }
                   />
                 </Field>
@@ -1103,7 +1321,10 @@ export function SiteSettingsPage() {
                     type="checkbox"
                     checked={form.notification_comment_enabled}
                     onChange={(event) =>
-                      updateField('notification_comment_enabled', event.target.checked)
+                      updateField(
+                        "notification_comment_enabled",
+                        event.target.checked,
+                      )
                     }
                     className="mt-1 h-4 w-4 rounded border-input text-primary focus:ring-ring"
                   />
@@ -1119,7 +1340,10 @@ export function SiteSettingsPage() {
                     type="checkbox"
                     checked={form.notification_friend_link_enabled}
                     onChange={(event) =>
-                      updateField('notification_friend_link_enabled', event.target.checked)
+                      updateField(
+                        "notification_friend_link_enabled",
+                        event.target.checked,
+                      )
                     }
                     className="mt-1 h-4 w-4 rounded border-input text-primary focus:ring-ring"
                   />
@@ -1137,12 +1361,12 @@ export function SiteSettingsPage() {
                   hint="每行一组，逗号分隔。例如：ai, llm, gpt 或 rust, cargo, crates。"
                 >
                   <Textarea
-                    value={form.search_synonyms.join('\n')}
+                    value={form.search_synonyms.join("\n")}
                     onChange={(event) =>
                       updateField(
-                        'search_synonyms',
+                        "search_synonyms",
                         event.target.value
-                          .split('\n')
+                          .split("\n")
                           .map((item) => item.trim())
                           .filter(Boolean),
                       )
@@ -1166,7 +1390,10 @@ export function SiteSettingsPage() {
                   type="checkbox"
                   checked={form.paragraph_comments_enabled}
                   onChange={(event) =>
-                    updateField('paragraph_comments_enabled', event.target.checked)
+                    updateField(
+                      "paragraph_comments_enabled",
+                      event.target.checked,
+                    )
                   }
                   className="mt-1 h-4 w-4 rounded border-input text-primary focus:ring-ring"
                 />
@@ -1187,8 +1414,11 @@ export function SiteSettingsPage() {
                     value={form.comment_verification_mode}
                     onChange={(event) =>
                       updateField(
-                        'comment_verification_mode',
-                        normalizeHumanVerificationMode(event.target.value, 'captcha'),
+                        "comment_verification_mode",
+                        normalizeHumanVerificationMode(
+                          event.target.value,
+                          "captcha",
+                        ),
                       )
                     }
                   >
@@ -1215,13 +1445,16 @@ export function SiteSettingsPage() {
                 <input
                   type="checkbox"
                   checked={form.ai_enabled}
-                  onChange={(event) => updateField('ai_enabled', event.target.checked)}
+                  onChange={(event) =>
+                    updateField("ai_enabled", event.target.checked)
+                  }
                   className="mt-1 h-4 w-4 rounded border-input text-primary focus:ring-ring"
                 />
                 <div>
                   <div className="font-medium">开启前台 AI 问答</div>
                   <p className="mt-1 text-sm leading-6 text-muted-foreground">
-                    关闭后，前台 AI 问答入口只会展示为不可用状态，用户不能直接发起提问。
+                    关闭后，前台 AI
+                    问答入口只会展示为不可用状态，用户不能直接发起提问。
                   </p>
                 </div>
               </label>
@@ -1234,7 +1467,11 @@ export function SiteSettingsPage() {
                       这里用于站内问答、文章元数据生成和文案润色。
                     </p>
                   </div>
-                  <Button type="button" variant="outline" onClick={addAiProvider}>
+                  <Button
+                    type="button"
+                    variant="outline"
+                    onClick={addAiProvider}
+                  >
                     <Plus className="h-4 w-4" />
                     添加提供商
                   </Button>
@@ -1244,8 +1481,9 @@ export function SiteSettingsPage() {
                   <div className="space-y-3">
                     {form.ai_providers.length ? (
                       form.ai_providers.map((provider, index) => {
-                        const active = provider.id === form.ai_active_provider_id
-                        const selected = index === selectedProviderIndex
+                        const active =
+                          provider.id === form.ai_active_provider_id;
+                        const selected = index === selectedProviderIndex;
 
                         return (
                           <button
@@ -1254,17 +1492,19 @@ export function SiteSettingsPage() {
                             onClick={() => setSelectedProviderIndex(index)}
                             className={
                               selected
-                                ? 'w-full rounded-[1.35rem] border border-primary/30 bg-primary/10 px-4 py-4 text-left shadow-[0_12px_28px_rgba(37,99,235,0.12)]'
-                                : 'w-full rounded-[1.35rem] border border-border/70 bg-background/70 px-4 py-4 text-left transition hover:border-border hover:bg-accent/35'
+                                ? "w-full rounded-[1.35rem] border border-primary/30 bg-primary/10 px-4 py-4 text-left shadow-[0_12px_28px_rgba(37,99,235,0.12)]"
+                                : "w-full rounded-[1.35rem] border border-border/70 bg-background/70 px-4 py-4 text-left transition hover:border-border hover:bg-accent/35"
                             }
                           >
                             <div className="flex items-start justify-between gap-3">
                               <div className="min-w-0 flex-1">
                                 <p className="truncate font-medium">
-                                  {provider.name?.trim() || `提供商 ${index + 1}`}
+                                  {provider.name?.trim() ||
+                                    `提供商 ${index + 1}`}
                                 </p>
                                 <p className="mt-1 truncate text-sm text-muted-foreground">
-                                  Provider：{provider.provider?.trim() || '未填写'}
+                                  Provider：
+                                  {provider.provider?.trim() || "未填写"}
                                 </p>
                               </div>
                               {active ? (
@@ -1274,10 +1514,10 @@ export function SiteSettingsPage() {
                               ) : null}
                             </div>
                             <p className="mt-3 truncate font-mono text-[11px] text-muted-foreground">
-                              {provider.chat_model?.trim() || '未填写模型'}
+                              {provider.chat_model?.trim() || "未填写模型"}
                             </p>
                           </button>
-                        )
+                        );
                       })
                     ) : (
                       <div className="rounded-[1.35rem] border border-dashed border-border/70 bg-background/60 px-4 py-6 text-sm leading-6 text-muted-foreground">
@@ -1295,17 +1535,21 @@ export function SiteSettingsPage() {
                               当前编辑
                             </p>
                             <p className="mt-2 text-lg font-semibold">
-                              {selectedProvider.name?.trim() || `提供商 ${selectedProviderIndex + 1}`}
+                              {selectedProvider.name?.trim() ||
+                                `提供商 ${selectedProviderIndex + 1}`}
                             </p>
                             <p className="mt-1 text-sm text-muted-foreground">
-                              保存后，系统会使用“当前启用”的提供商处理文本 AI 请求。
+                              保存后，系统会使用“当前启用”的提供商处理文本 AI
+                              请求。
                             </p>
                           </div>
                           <div className="flex flex-wrap gap-2">
                             <Button
                               type="button"
                               variant="outline"
-                              onClick={() => applyCloudflarePreset(selectedProviderIndex)}
+                              onClick={() =>
+                                applyCloudflarePreset(selectedProviderIndex)
+                              }
                             >
                               <RefreshCcw className="h-4 w-4" />
                               套用 Cloudflare
@@ -1317,35 +1561,52 @@ export function SiteSettingsPage() {
                               disabled={testingProvider}
                               onClick={async () => {
                                 try {
-                                  setTestingProvider(true)
-                                  const result = await adminApi.testAiProvider(selectedProvider)
+                                  setTestingProvider(true);
+                                  const result =
+                                    await adminApi.testAiProvider(
+                                      selectedProvider,
+                                    );
                                   toast.success(
                                     `连通成功：${result.provider} / ${result.chat_model} / ${result.reply_preview}`,
-                                  )
+                                  );
                                 } catch (error) {
                                   toast.error(
-                                    error instanceof ApiError ? error.message : '模型连通性测试失败。',
-                                  )
+                                    error instanceof ApiError
+                                      ? error.message
+                                      : "模型连通性测试失败。",
+                                  );
                                 } finally {
-                                  setTestingProvider(false)
+                                  setTestingProvider(false);
                                 }
                               }}
                             >
                               <Bot className="h-4 w-4" />
-                              {testingProvider ? '测试中...' : '测试连通性'}
+                              {testingProvider ? "测试中..." : "测试连通性"}
                             </Button>
                             <Button
                               type="button"
-                              variant={selectedProvider.id === form.ai_active_provider_id ? 'secondary' : 'outline'}
-                              onClick={() => setActiveAiProvider(selectedProvider.id)}
+                              variant={
+                                selectedProvider.id ===
+                                form.ai_active_provider_id
+                                  ? "secondary"
+                                  : "outline"
+                              }
+                              onClick={() =>
+                                setActiveAiProvider(selectedProvider.id)
+                              }
                             >
                               <Check className="h-4 w-4" />
-                              {selectedProvider.id === form.ai_active_provider_id ? '已启用' : '设为启用'}
+                              {selectedProvider.id ===
+                              form.ai_active_provider_id
+                                ? "已启用"
+                                : "设为启用"}
                             </Button>
                             <Button
                               type="button"
                               variant="outline"
-                              onClick={() => removeAiProvider(selectedProviderIndex)}
+                              onClick={() =>
+                                removeAiProvider(selectedProviderIndex)
+                              }
                             >
                               <Trash2 className="h-4 w-4" />
                               删除
@@ -1353,11 +1614,18 @@ export function SiteSettingsPage() {
                           </div>
                         </div>
 
-                        <Field label="显示名称" hint="例如 OpenAI 主通道、Gemini 备用线路。">
+                        <Field
+                          label="显示名称"
+                          hint="例如 OpenAI 主通道、Gemini 备用线路。"
+                        >
                           <Input
-                            value={selectedProvider.name ?? ''}
+                            value={selectedProvider.name ?? ""}
                             onChange={(event) =>
-                              updateAiProvider(selectedProviderIndex, 'name', event.target.value)
+                              updateAiProvider(
+                                selectedProviderIndex,
+                                "name",
+                                event.target.value,
+                              )
                             }
                           />
                         </Field>
@@ -1366,9 +1634,13 @@ export function SiteSettingsPage() {
                           hint="选择文本模型提供方。Cloudflare 文本模型也支持。"
                         >
                           <Select
-                            value={selectedProvider.provider ?? ''}
+                            value={selectedProvider.provider ?? ""}
                             onChange={(event) =>
-                              updateAiProvider(selectedProviderIndex, 'provider', event.target.value)
+                              updateAiProvider(
+                                selectedProviderIndex,
+                                "provider",
+                                event.target.value,
+                              )
                             }
                           >
                             {AI_PROVIDER_OPTIONS.map((option) => (
@@ -1380,51 +1652,84 @@ export function SiteSettingsPage() {
                         </Field>
                         <Field
                           label="API 地址"
-                          hint={selectedProviderIsCloudflare ? 'Cloudflare 可直接填写 Account ID，或填写 https://api.cloudflare.com/client/v4/accounts/<ACCOUNT_ID>。' : undefined}
+                          hint={
+                            selectedProviderIsCloudflare
+                              ? "Cloudflare 可直接填写 Account ID，或填写 https://api.cloudflare.com/client/v4/accounts/<ACCOUNT_ID>。"
+                              : undefined
+                          }
                         >
                           <Input
-                            value={selectedProvider.api_base ?? ''}
+                            value={selectedProvider.api_base ?? ""}
                             onChange={(event) =>
-                              updateAiProvider(selectedProviderIndex, 'api_base', event.target.value)
+                              updateAiProvider(
+                                selectedProviderIndex,
+                                "api_base",
+                                event.target.value,
+                              )
+                            }
+                            placeholder={
+                              selectedProviderIsCloudflare
+                                ? "Cloudflare Account ID 或完整 accounts URL"
+                                : undefined
                             }
-                            placeholder={selectedProviderIsCloudflare ? 'Cloudflare Account ID 或完整 accounts URL' : undefined}
                           />
                         </Field>
                         <Field
                           label="API 密钥"
-                          hint={selectedProviderIsCloudflare ? '请填写 Cloudflare Workers AI API Token。该 Token 需要 Workers AI Read 和 Edit 权限。' : undefined}
+                          hint={
+                            selectedProviderIsCloudflare
+                              ? "请填写 Cloudflare Workers AI API Token。该 Token 需要 Workers AI Read 和 Edit 权限。"
+                              : undefined
+                          }
                         >
                           <Input
-                            value={selectedProvider.api_key ?? ''}
+                            value={selectedProvider.api_key ?? ""}
                             onChange={(event) =>
-                              updateAiProvider(selectedProviderIndex, 'api_key', event.target.value)
+                              updateAiProvider(
+                                selectedProviderIndex,
+                                "api_key",
+                                event.target.value,
+                              )
                             }
                           />
                         </Field>
                         <Field
                           label="对话模型"
-                          hint={selectedProviderIsCloudflare ? '例如 @cf/meta/llama-3.1-8b-instruct，用于问答与连通性测试。' : undefined}
+                          hint={
+                            selectedProviderIsCloudflare
+                              ? "例如 @cf/meta/llama-3.1-8b-instruct，用于问答与连通性测试。"
+                              : undefined
+                          }
                         >
                           <Input
-                            value={selectedProvider.chat_model ?? ''}
+                            value={selectedProvider.chat_model ?? ""}
                             onChange={(event) =>
-                              updateAiProvider(selectedProviderIndex, 'chat_model', event.target.value)
+                              updateAiProvider(
+                                selectedProviderIndex,
+                                "chat_model",
+                                event.target.value,
+                              )
                             }
                           />
                         </Field>
                         {selectedProviderIsCloudflare ? (
                           <div className="rounded-2xl border border-primary/15 bg-primary/5 px-4 py-3 text-sm leading-6 text-muted-foreground">
-                            <p className="font-medium text-foreground">文本问答 / Cloudflare 说明</p>
+                            <p className="font-medium text-foreground">
+                              文本问答 / Cloudflare 说明
+                            </p>
                             <ul className="mt-2 list-disc space-y-1 pl-5">
                               <li>API 地址可直接填 Cloudflare Account ID。</li>
-                              <li>这里的模型只负责文本问答与后台文字类 AI 能力。</li>
+                              <li>
+                                这里的模型只负责文本问答与后台文字类 AI 能力。
+                              </li>
                             </ul>
                           </div>
                         ) : null}
                       </div>
                     ) : (
                       <div className="flex h-full min-h-[240px] items-center justify-center rounded-[1.35rem] border border-dashed border-border/70 bg-background/60 px-6 text-center text-sm leading-6 text-muted-foreground">
-                        添加第一套 provider 后，就可以在这里编辑它的 API 地址、密钥和模型名。
+                        添加第一套 provider 后，就可以在这里编辑它的 API
+                        地址、密钥和模型名。
                       </div>
                     )}
                   </div>
@@ -1433,8 +1738,8 @@ export function SiteSettingsPage() {
               <div className="rounded-2xl border border-border/70 bg-background/60 p-4 text-sm leading-6 text-muted-foreground">
                 文本 AI 当前生效：
                 {activeProvider
-                  ? `${activeProvider.provider || activeProvider.name} / ${activeProvider.chat_model || '未填写模型'}`
-                  : '未选择提供商'}
+                  ? `${activeProvider.provider || activeProvider.name} / ${activeProvider.chat_model || "未填写模型"}`
+                  : "未选择提供商"}
               </div>
               <div className="rounded-[1.75rem] border border-border/70 bg-background/55 p-5">
                 <div className="flex flex-wrap items-start justify-between gap-3">
@@ -1445,7 +1750,11 @@ export function SiteSettingsPage() {
                     </p>
                   </div>
                   <div className="flex flex-wrap gap-2">
-                    <Button type="button" variant="outline" onClick={applyCloudflareImagePreset}>
+                    <Button
+                      type="button"
+                      variant="outline"
+                      onClick={applyCloudflareImagePreset}
+                    >
                       <RefreshCcw className="h-4 w-4" />
                       套用 Cloudflare
                     </Button>
@@ -1456,27 +1765,29 @@ export function SiteSettingsPage() {
                       disabled={testingImageProvider}
                       onClick={async () => {
                         try {
-                          setTestingImageProvider(true)
+                          setTestingImageProvider(true);
                           const result = await adminApi.testAiImageProvider({
-                            provider: form.ai_image_provider ?? '',
+                            provider: form.ai_image_provider ?? "",
                             api_base: form.ai_image_api_base,
                             api_key: form.ai_image_api_key,
                             image_model: form.ai_image_model,
-                          })
+                          });
                           toast.success(
                             `图片连通成功：${result.provider} / ${result.image_model} / ${result.result_preview}`,
-                          )
+                          );
                         } catch (error) {
                           toast.error(
-                            error instanceof ApiError ? error.message : '图片模型连通性测试失败。',
-                          )
+                            error instanceof ApiError
+                              ? error.message
+                              : "图片模型连通性测试失败。",
+                          );
                         } finally {
-                          setTestingImageProvider(false)
+                          setTestingImageProvider(false);
                         }
                       }}
                     >
                       <Bot className="h-4 w-4" />
-                      {testingImageProvider ? '测试中...' : '测试图片连通性'}
+                      {testingImageProvider ? "测试中..." : "测试图片连通性"}
                     </Button>
                   </div>
                 </div>
@@ -1487,8 +1798,10 @@ export function SiteSettingsPage() {
                     hint="选择图片模型提供方。这里专门用于封面图生成。"
                   >
                     <Select
-                      value={form.ai_image_provider ?? ''}
-                      onChange={(event) => updateField('ai_image_provider', event.target.value)}
+                      value={form.ai_image_provider ?? ""}
+                      onChange={(event) =>
+                        updateField("ai_image_provider", event.target.value)
+                      }
                     >
                       {AI_PROVIDER_OPTIONS.map((option) => (
                         <option key={option.value} value={option.value}>
@@ -1499,34 +1812,60 @@ export function SiteSettingsPage() {
                   </Field>
                   <Field
                     label="图片模型"
-                    hint={imageProviderIsCloudflare ? 'Cloudflare 建议使用 @cf/black-forest-labs/flux-2-klein-4b。' : '这里填写图片模型名。'}
+                    hint={
+                      imageProviderIsCloudflare
+                        ? "Cloudflare 建议使用 @cf/black-forest-labs/flux-2-klein-4b。"
+                        : "这里填写图片模型名。"
+                    }
                   >
                     <Input
-                      value={form.ai_image_model ?? ''}
-                      onChange={(event) => updateField('ai_image_model', event.target.value)}
-                      placeholder={imageProviderIsCloudflare ? '@cf/black-forest-labs/flux-2-klein-4b' : undefined}
+                      value={form.ai_image_model ?? ""}
+                      onChange={(event) =>
+                        updateField("ai_image_model", event.target.value)
+                      }
+                      placeholder={
+                        imageProviderIsCloudflare
+                          ? "@cf/black-forest-labs/flux-2-klein-4b"
+                          : undefined
+                      }
                     />
                   </Field>
                   <div className="lg:col-span-2">
                     <Field
                       label="图片 API 地址"
-                      hint={imageProviderIsCloudflare ? 'Cloudflare 可直接填写 Account ID，或填写完整 accounts URL。' : '填写图片服务的 API 地址。'}
+                      hint={
+                        imageProviderIsCloudflare
+                          ? "Cloudflare 可直接填写 Account ID，或填写完整 accounts URL。"
+                          : "填写图片服务的 API 地址。"
+                      }
                     >
                       <Input
-                        value={form.ai_image_api_base ?? ''}
-                        onChange={(event) => updateField('ai_image_api_base', event.target.value)}
-                        placeholder={imageProviderIsCloudflare ? 'Cloudflare Account ID 或完整 accounts URL' : undefined}
+                        value={form.ai_image_api_base ?? ""}
+                        onChange={(event) =>
+                          updateField("ai_image_api_base", event.target.value)
+                        }
+                        placeholder={
+                          imageProviderIsCloudflare
+                            ? "Cloudflare Account ID 或完整 accounts URL"
+                            : undefined
+                        }
                       />
                     </Field>
                   </div>
                   <div className="lg:col-span-2">
                     <Field
                       label="图片 API 密钥"
-                      hint={imageProviderIsCloudflare ? '请填写 Cloudflare Workers AI API Token。' : '填写图片服务的 API Key。'}
+                      hint={
+                        imageProviderIsCloudflare
+                          ? "请填写 Cloudflare Workers AI API Token。"
+                          : "填写图片服务的 API Key。"
+                      }
                     >
                       <Input
-                        value={form.ai_image_api_key ?? ''}
-                        onChange={(event) => updateField('ai_image_api_key', event.target.value)}
+                        value={form.ai_image_api_key ?? ""}
+                        onChange={(event) =>
+                          updateField("ai_image_api_key", event.target.value)
+                        }
                       />
                     </Field>
                   </div>
@@ -1535,13 +1874,15 @@ export function SiteSettingsPage() {
                 <div className="mt-4 rounded-2xl border border-border/70 bg-background/60 p-4 text-sm leading-6 text-muted-foreground">
                   图片 AI 当前配置：
                   {form.ai_image_provider?.trim()
-                    ? `${form.ai_image_provider} / ${form.ai_image_model || '未填写模型'}`
-                    : '未填写，封面图会回退到旧配置'}
+                    ? `${form.ai_image_provider} / ${form.ai_image_model || "未填写模型"}`
+                    : "未填写，封面图会回退到旧配置"}
                 </div>
 
                 {imageProviderIsCloudflare ? (
                   <div className="mt-4 rounded-2xl border border-primary/15 bg-primary/5 px-4 py-3 text-sm leading-6 text-muted-foreground">
-                    <p className="font-medium text-foreground">封面图 / Cloudflare 说明</p>
+                    <p className="font-medium text-foreground">
+                      封面图 / Cloudflare 说明
+                    </p>
                     <ul className="mt-2 list-disc space-y-1 pl-5">
                       <li>API 地址可直接填 Cloudflare Account ID。</li>
                       <li>这套配置只用于后台“AI 生成封面”。</li>
@@ -1555,18 +1896,20 @@ export function SiteSettingsPage() {
                 hint={`本地选项：${form.ai_local_embedding}`}
               >
                 <Input
-                  value={form.ai_embedding_model ?? ''}
-                  onChange={(event) => updateField('ai_embedding_model', event.target.value)}
+                  value={form.ai_embedding_model ?? ""}
+                  onChange={(event) =>
+                    updateField("ai_embedding_model", event.target.value)
+                  }
                 />
               </Field>
               <div className="grid gap-4 sm:grid-cols-2">
                 <Field label="Top K">
                   <Input
                     type="number"
-                    value={form.ai_top_k ?? ''}
+                    value={form.ai_top_k ?? ""}
                     onChange={(event) =>
                       updateField(
-                        'ai_top_k',
+                        "ai_top_k",
                         event.target.value ? Number(event.target.value) : null,
                       )
                     }
@@ -1575,10 +1918,10 @@ export function SiteSettingsPage() {
                 <Field label="分块大小">
                   <Input
                     type="number"
-                    value={form.ai_chunk_size ?? ''}
+                    value={form.ai_chunk_size ?? ""}
                     onChange={(event) =>
                       updateField(
-                        'ai_chunk_size',
+                        "ai_chunk_size",
                         event.target.value ? Number(event.target.value) : null,
                       )
                     }
@@ -1587,8 +1930,10 @@ export function SiteSettingsPage() {
               </div>
               <Field label="系统提示词">
                 <Textarea
-                  value={form.ai_system_prompt ?? ''}
-                  onChange={(event) => updateField('ai_system_prompt', event.target.value)}
+                  value={form.ai_system_prompt ?? ""}
+                  onChange={(event) =>
+                    updateField("ai_system_prompt", event.target.value)
+                  }
                 />
               </Field>
             </CardContent>
@@ -1600,7 +1945,8 @@ export function SiteSettingsPage() {
                 <div>
                   <CardTitle>媒体对象存储</CardTitle>
                   <CardDescription>
-                    AI 封面图和评测封面上传都会优先走这里的对象存储。支持 Cloudflare R2 / MinIO。
+                    AI 封面图和评测封面上传都会优先走这里的对象存储。支持
+                    Cloudflare R2 / MinIO。
                   </CardDescription>
                 </div>
                 <Button
@@ -1610,30 +1956,35 @@ export function SiteSettingsPage() {
                   disabled={testingR2Storage}
                   onClick={async () => {
                     try {
-                      setTestingR2Storage(true)
-                      const result = await adminApi.testR2Storage()
-                      toast.success(`存储连通成功：${result.bucket} / ${result.public_base_url}`)
+                      setTestingR2Storage(true);
+                      const result = await adminApi.testR2Storage();
+                      toast.success(
+                        `存储连通成功：${result.bucket} / ${result.public_base_url}`,
+                      );
                     } catch (error) {
-                      toast.error(error instanceof ApiError ? error.message : '对象存储连通性测试失败。')
+                      toast.error(
+                        error instanceof ApiError
+                          ? error.message
+                          : "对象存储连通性测试失败。",
+                      );
                     } finally {
-                      setTestingR2Storage(false)
+                      setTestingR2Storage(false);
                     }
                   }}
                 >
                   <Bot className="h-4 w-4" />
-                  {testingR2Storage ? '测试中...' : '测试存储连通性'}
+                  {testingR2Storage ? "测试中..." : "测试存储连通性"}
                 </Button>
               </div>
             </CardHeader>
             <CardContent className="space-y-5">
               <div className="grid gap-4 lg:grid-cols-2">
-                <Field
-                  label="存储 Provider"
-                  hint="选择媒体资源存储后端。"
-                >
+                <Field label="存储 Provider" hint="选择媒体资源存储后端。">
                   <Select
-                    value={form.media_storage_provider ?? 'r2'}
-                    onChange={(event) => updateField('media_storage_provider', event.target.value)}
+                    value={form.media_storage_provider ?? "r2"}
+                    onChange={(event) =>
+                      updateField("media_storage_provider", event.target.value)
+                    }
                   >
                     {MEDIA_STORAGE_PROVIDER_OPTIONS.map((option) => (
                       <option key={option.value} value={option.value}>
@@ -1643,64 +1994,92 @@ export function SiteSettingsPage() {
                   </Select>
                 </Field>
                 <Field
-                  label={mediaStorageProvider === 'minio' ? 'Endpoint' : 'Account ID'}
+                  label={
+                    mediaStorageProvider === "minio" ? "Endpoint" : "Account ID"
+                  }
                   hint={
-                    mediaStorageProvider === 'minio'
-                      ? '例如 http://10.0.0.2:9100 或你的 MinIO API 地址。'
-                      : 'Cloudflare 账户 ID，用来拼接 R2 S3 兼容 endpoint。'
+                    mediaStorageProvider === "minio"
+                      ? "例如 http://10.0.0.2:9100 或你的 MinIO API 地址。"
+                      : "Cloudflare 账户 ID，用来拼接 R2 S3 兼容 endpoint。"
                   }
                 >
                   <Input
-                    value={form.media_r2_account_id ?? ''}
-                    onChange={(event) => updateField('media_r2_account_id', event.target.value)}
-                    placeholder={mediaStorageProvider === 'minio' ? 'http://10.0.0.2:9100' : undefined}
+                    value={form.media_r2_account_id ?? ""}
+                    onChange={(event) =>
+                      updateField("media_r2_account_id", event.target.value)
+                    }
+                    placeholder={
+                      mediaStorageProvider === "minio"
+                        ? "http://10.0.0.2:9100"
+                        : undefined
+                    }
                   />
                 </Field>
                 <Field
                   label="Bucket"
-                  hint={mediaStorageProvider === 'minio' ? '存放封面图的 MinIO bucket 名称。' : '存放封面图的 R2 bucket 名称。'}
+                  hint={
+                    mediaStorageProvider === "minio"
+                      ? "存放封面图的 MinIO bucket 名称。"
+                      : "存放封面图的 R2 bucket 名称。"
+                  }
                 >
                   <Input
-                    value={form.media_r2_bucket ?? ''}
-                    onChange={(event) => updateField('media_r2_bucket', event.target.value)}
+                    value={form.media_r2_bucket ?? ""}
+                    onChange={(event) =>
+                      updateField("media_r2_bucket", event.target.value)
+                    }
                   />
                 </Field>
                 <div className="lg:col-span-2">
                   <Field
                     label="Public Base URL"
                     hint={
-                      mediaStorageProvider === 'minio'
-                      ? '例如 https://s3.init.cool/你的bucket 或 http://10.0.0.2:9100/你的bucket。系统会把对象 key 拼到这个地址后面。'
-                        : '例如 https://image.init.cool 或你的 R2 公网域名。系统会把对象 key 拼到这个地址后面。'
+                      mediaStorageProvider === "minio"
+                        ? "例如 https://s3.init.cool/你的bucket 或 http://10.0.0.2:9100/你的bucket。系统会把对象 key 拼到这个地址后面。"
+                        : "例如 https://image.init.cool 或你的 R2 公网域名。系统会把对象 key 拼到这个地址后面。"
                     }
                   >
                     <Input
-                      value={form.media_r2_public_base_url ?? ''}
+                      value={form.media_r2_public_base_url ?? ""}
                       onChange={(event) =>
-                        updateField('media_r2_public_base_url', event.target.value)
+                        updateField(
+                          "media_r2_public_base_url",
+                          event.target.value,
+                        )
                       }
                     />
                   </Field>
                 </div>
                 <Field
                   label="Access Key ID"
-                  hint={mediaStorageProvider === 'minio' ? 'MinIO / S3 的 Access Key ID。' : 'R2 S3 API 的 Access Key ID。'}
+                  hint={
+                    mediaStorageProvider === "minio"
+                      ? "MinIO / S3 的 Access Key ID。"
+                      : "R2 S3 API 的 Access Key ID。"
+                  }
                 >
                   <Input
-                    value={form.media_r2_access_key_id ?? ''}
+                    value={form.media_r2_access_key_id ?? ""}
                     onChange={(event) =>
-                      updateField('media_r2_access_key_id', event.target.value)
+                      updateField("media_r2_access_key_id", event.target.value)
                     }
                   />
                 </Field>
                 <Field
                   label="Secret Access Key"
-                  hint={mediaStorageProvider === 'minio' ? 'MinIO / S3 的 Secret Access Key。后端会用 Rust SDK 上传图片。' : 'R2 S3 API 的 Secret Access Key。后端会用 Rust SDK 上传图片。'}
+                  hint={
+                    mediaStorageProvider === "minio"
+                      ? "MinIO / S3 的 Secret Access Key。后端会用 Rust SDK 上传图片。"
+                      : "R2 S3 API 的 Secret Access Key。后端会用 Rust SDK 上传图片。"
+                  }
                 >
                   <Input
-                    value={form.media_r2_secret_access_key ?? ''}
+                    value={form.media_r2_secret_access_key ?? ""}
                     onChange={(event) =>
-                      updateField('media_r2_secret_access_key', event.target.value)
+                      updateField(
+                        "media_r2_secret_access_key",
+                        event.target.value,
+                      )
                     }
                   />
                 </Field>
@@ -1711,7 +2090,11 @@ export function SiteSettingsPage() {
                 <ul className="mt-2 list-disc space-y-1 pl-5">
                   <li>文章 AI 生成封面：上传到 `post-covers/`</li>
                   <li>评测封面上传：上传到 `review-covers/`</li>
-                  <li>{mediaStorageProvider === 'minio' ? '当前会按 MinIO / S3 兼容方式上传。' : '当前会按 Cloudflare R2 方式上传。'}</li>
+                  <li>
+                    {mediaStorageProvider === "minio"
+                      ? "当前会按 MinIO / S3 兼容方式上传。"
+                      : "当前会按 Cloudflare R2 方式上传。"}
+                  </li>
                 </ul>
               </div>
             </CardContent>
@@ -1720,28 +2103,34 @@ export function SiteSettingsPage() {
           <Card>
             <CardHeader>
               <CardTitle>索引状态</CardTitle>
-              <CardDescription>
-                当前 AI 知识库的只读状态信息。
-              </CardDescription>
+              <CardDescription>当前 AI 知识库的只读状态信息。</CardDescription>
             </CardHeader>
             <CardContent className="space-y-4">
               <div className="rounded-2xl border border-border/70 bg-background/70 p-4">
                 <p className="text-xs uppercase tracking-[0.2em] text-muted-foreground">
                   已索引分块
                 </p>
-                <p className="mt-3 text-3xl font-semibold">{form.ai_chunks_count}</p>
+                <p className="mt-3 text-3xl font-semibold">
+                  {form.ai_chunks_count}
+                </p>
               </div>
               <div className="rounded-2xl border border-border/70 bg-background/70 p-4">
                 <p className="text-xs uppercase tracking-[0.2em] text-muted-foreground">
                   最近索引时间
                 </p>
                 <p className="mt-3 text-sm leading-6 text-muted-foreground">
-                  {form.ai_last_indexed_at ?? '索引尚未建立。'}
+                  {form.ai_last_indexed_at ?? "索引尚未建立。"}
                 </p>
                 {reindexJobId ? (
                   <p className="mt-3 text-xs leading-6 text-muted-foreground">
                     当前后台任务 #{reindexJobId}
-                    {reindexJobStatus ? `，状态：${reindexJobStatus}` : ''}
+                    {reindexJobStatus ? `，状态：${reindexJobStatus}` : ""}
+                  </p>
+                ) : null}
+                {reindexJobResult ? (
+                  <p className="mt-2 text-xs leading-6 text-muted-foreground">
+                    {formatWorkerProgress({ result: reindexJobResult }) ??
+                      "任务已经开始，正在等待下一次进度更新。"}
                   </p>
                 ) : null}
               </div>
@@ -1760,10 +2149,12 @@ export function SiteSettingsPage() {
                   </CardDescription>
                 </div>
                 <div className="flex flex-wrap items-center gap-2">
-                  <Badge variant={form.music_enabled ? 'default' : 'outline'}>
-                    {form.music_enabled ? '前台已开启' : '前台已关闭'}
+                  <Badge variant={form.music_enabled ? "default" : "outline"}>
+                    {form.music_enabled ? "前台已开启" : "前台已关闭"}
+                  </Badge>
+                  <Badge variant="outline">
+                    {form.music_playlist.length} 首
                   </Badge>
-                  <Badge variant="outline">{form.music_playlist.length} 首</Badge>
                 </div>
               </div>
             </CardHeader>
@@ -1772,7 +2163,9 @@ export function SiteSettingsPage() {
                 <input
                   type="checkbox"
                   checked={form.music_enabled}
-                  onChange={(event) => updateField('music_enabled', event.target.checked)}
+                  onChange={(event) =>
+                    updateField("music_enabled", event.target.checked)
+                  }
                   className="mt-1 h-4 w-4 rounded border-input text-primary focus:ring-ring"
                 />
                 <div>
@@ -1785,7 +2178,7 @@ export function SiteSettingsPage() {
 
               <div className="space-y-3">
                 {form.music_playlist.map((track, index) => {
-                  const active = index === selectedTrackIndex
+                  const active = index === selectedTrackIndex;
 
                   return (
                     <button
@@ -1794,17 +2187,19 @@ export function SiteSettingsPage() {
                       onClick={() => setSelectedTrackIndex(index)}
                       className={
                         active
-                          ? 'w-full rounded-[1.5rem] border border-primary/30 bg-primary/10 px-4 py-4 text-left shadow-[0_14px_32px_rgba(37,99,235,0.14)]'
-                          : 'w-full rounded-[1.5rem] border border-border/70 bg-background/60 px-4 py-4 text-left transition hover:border-border hover:bg-accent/35'
+                          ? "w-full rounded-[1.5rem] border border-primary/30 bg-primary/10 px-4 py-4 text-left shadow-[0_14px_32px_rgba(37,99,235,0.14)]"
+                          : "w-full rounded-[1.5rem] border border-border/70 bg-background/60 px-4 py-4 text-left transition hover:border-border hover:bg-accent/35"
                       }
                     >
                       <div className="flex items-start justify-between gap-3">
                         <div className="min-w-0 flex-1">
                           <p className="truncate font-medium">
-                            {track.title?.trim() ? track.title : `曲目 ${index + 1}`}
+                            {track.title?.trim()
+                              ? track.title
+                              : `曲目 ${index + 1}`}
                           </p>
                           <p className="mt-1 truncate text-sm text-muted-foreground">
-                            {track.artist?.trim() || '未填写歌手'}
+                            {track.artist?.trim() || "未填写歌手"}
                           </p>
                         </div>
                         {track.accent_color ? (
@@ -1815,13 +2210,18 @@ export function SiteSettingsPage() {
                         ) : null}
                       </div>
                       <p className="mt-3 truncate font-mono text-[11px] text-muted-foreground">
-                        {track.url || '未填写音频 URL'}
+                        {track.url || "未填写音频 URL"}
                       </p>
                     </button>
-                  )
+                  );
                 })}
 
-                <Button type="button" variant="outline" onClick={addMusicTrack} className="w-full">
+                <Button
+                  type="button"
+                  variant="outline"
+                  onClick={addMusicTrack}
+                  className="w-full"
+                >
                   <Plus className="h-4 w-4" />
                   添加曲目
                 </Button>
@@ -1857,7 +2257,9 @@ export function SiteSettingsPage() {
                   <div className="mb-5 overflow-hidden rounded-3xl border border-border/70 bg-black/5">
                     <img
                       src={selectedTrack.cover_image_url}
-                      alt={selectedTrack.title || `曲目 ${selectedTrackIndex + 1}`}
+                      alt={
+                        selectedTrack.title || `曲目 ${selectedTrackIndex + 1}`
+                      }
                       className="h-44 w-full object-cover"
                     />
                   </div>
@@ -1866,64 +2268,101 @@ export function SiteSettingsPage() {
                 <div className="space-y-4">
                   <Field label="标题">
                     <Input
-                      value={selectedTrack.title ?? ''}
+                      value={selectedTrack.title ?? ""}
                       onChange={(event) =>
-                        updateMusicTrack(selectedTrackIndex, 'title', event.target.value)
+                        updateMusicTrack(
+                          selectedTrackIndex,
+                          "title",
+                          event.target.value,
+                        )
                       }
                     />
                   </Field>
                   <div className="grid gap-4 sm:grid-cols-2 xl:grid-cols-1 2xl:grid-cols-2">
                     <Field label="歌手">
                       <Input
-                        value={selectedTrack.artist ?? ''}
+                        value={selectedTrack.artist ?? ""}
                         onChange={(event) =>
-                          updateMusicTrack(selectedTrackIndex, 'artist', event.target.value)
+                          updateMusicTrack(
+                            selectedTrackIndex,
+                            "artist",
+                            event.target.value,
+                          )
                         }
                       />
                     </Field>
                     <Field label="专辑">
                       <Input
-                        value={selectedTrack.album ?? ''}
+                        value={selectedTrack.album ?? ""}
                         onChange={(event) =>
-                          updateMusicTrack(selectedTrackIndex, 'album', event.target.value)
+                          updateMusicTrack(
+                            selectedTrackIndex,
+                            "album",
+                            event.target.value,
+                          )
                         }
                       />
                     </Field>
                   </div>
                   <Field label="音频 URL">
                     <Input
-                      value={selectedTrack.url ?? ''}
+                      value={selectedTrack.url ?? ""}
                       onChange={(event) =>
-                        updateMusicTrack(selectedTrackIndex, 'url', event.target.value)
+                        updateMusicTrack(
+                          selectedTrackIndex,
+                          "url",
+                          event.target.value,
+                        )
                       }
                     />
                   </Field>
-                  <Field label="封面图 URL" hint="可直接填写外链，也可以上传 / 抓取 / 从媒体库选择后自动回填。">
+                  <Field
+                    label="封面图 URL"
+                    hint="可直接填写外链，也可以上传 / 抓取 / 从媒体库选择后自动回填。"
+                  >
                     <div className="space-y-3">
                       <Input
-                        value={selectedTrack.cover_image_url ?? ''}
+                        value={selectedTrack.cover_image_url ?? ""}
                         onChange={(event) =>
-                          updateMusicTrack(selectedTrackIndex, 'cover_image_url', event.target.value)
+                          updateMusicTrack(
+                            selectedTrackIndex,
+                            "cover_image_url",
+                            event.target.value,
+                          )
                         }
                       />
                       <MediaUrlControls
-                        value={selectedTrack.cover_image_url ?? ''}
+                        value={selectedTrack.cover_image_url ?? ""}
                         onChange={(coverImageUrl) =>
-                          updateMusicTrack(selectedTrackIndex, 'cover_image_url', coverImageUrl)
+                          updateMusicTrack(
+                            selectedTrackIndex,
+                            "cover_image_url",
+                            coverImageUrl,
+                          )
                         }
                         prefix="music-covers/"
                         contextLabel="音乐封面上传"
-                        remoteTitle={selectedTrack.title || `曲目 ${selectedTrackIndex + 1} 封面`}
+                        remoteTitle={
+                          selectedTrack.title ||
+                          `曲目 ${selectedTrackIndex + 1} 封面`
+                        }
                         dataTestIdPrefix="site-music-cover"
                       />
                     </div>
                   </Field>
-                  <Field label="主题色" hint="例如 `#2f6b5f`，前台播放器会读取这个颜色。">
+                  <Field
+                    label="主题色"
+                    hint="例如 `#2f6b5f`，前台播放器会读取这个颜色。"
+                  >
                     <div className="flex items-center gap-3">
                       <Input
-                        value={selectedTrack.accent_color ?? ''}
+                        value={selectedTrack.accent_color ?? ""}
                         onChange={(event) =>
-                          updateMusicTrack(selectedTrackIndex, 'accent_color', event.target.value)
+                          updateMusicTrack(
+                            selectedTrackIndex,
+                            "accent_color",
+                            event.target.value,
+                          )
                         }
                         placeholder="#2f6b5f"
                       />
@@ -1931,16 +2370,20 @@ export function SiteSettingsPage() {
                         className="h-11 w-11 shrink-0 rounded-2xl border border-border/70 bg-background"
                         style={{
                           backgroundColor:
-                            selectedTrack.accent_color?.trim() || 'transparent',
+                            selectedTrack.accent_color?.trim() || "transparent",
                         }}
                       />
                     </div>
                   </Field>
                   <Field label="备注">
                     <Textarea
-                      value={selectedTrack.description ?? ''}
+                      value={selectedTrack.description ?? ""}
                       onChange={(event) =>
-                        updateMusicTrack(selectedTrackIndex, 'description', event.target.value)
+                        updateMusicTrack(
+                          selectedTrackIndex,
+                          "description",
+                          event.target.value,
+                        )
                       }
                     />
                   </Field>
@@ -1951,5 +2394,5 @@ export function SiteSettingsPage() {
         </div>
       </div>
     </div>
-  )
+  );
 }
diff --git a/admin/src/pages/workers-page.tsx b/admin/src/pages/workers-page.tsx
index a779043..d6f0032 100644
--- a/admin/src/pages/workers-page.tsx
+++ b/admin/src/pages/workers-page.tsx
@@ -7,16 +7,28 @@ import {
   StopCircle,
   TimerReset,
   Workflow,
-} from 'lucide-react'
-import { startTransition, useCallback, useEffect, useMemo, useState } from 'react'
-import { toast } from 'sonner'
+} from "lucide-react";
+import {
+  startTransition,
+  useCallback,
+  useEffect,
+  useMemo,
+  useState,
+} from "react";
+import { toast } from "sonner";
 
-import { Badge } from '@/components/ui/badge'
-import { Button } from '@/components/ui/button'
-import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
-import { Input } from '@/components/ui/input'
-import { Select } from '@/components/ui/select'
-import { Skeleton } from '@/components/ui/skeleton'
+import { Badge } from "@/components/ui/badge";
+import { Button } from "@/components/ui/button";
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+} from "@/components/ui/card";
+import { Input } from "@/components/ui/input";
+import { Select } from "@/components/ui/select";
+import { Skeleton } from "@/components/ui/skeleton";
 import {
   Table,
   TableBody,
@@ -24,38 +36,39 @@ import {
   TableHead,
   TableHeader,
   TableRow,
-} from '@/components/ui/table'
-import { adminApi, ApiError } from '@/lib/api'
-import type { WorkerJobRecord, WorkerOverview } from '@/lib/types'
-import { cn } from '@/lib/utils'
-import { useSearchParams } from 'react-router-dom'
+} from "@/components/ui/table";
+import { adminApi, ApiError } from "@/lib/api";
+import { formatWorkerProgress } from "@/lib/worker-progress";
+import type { WorkerJobRecord, WorkerOverview } from "@/lib/types";
+import { cn } from "@/lib/utils";
+import { useSearchParams } from "react-router-dom";
 
 function prettyJson(value: unknown) {
   if (value === null || value === undefined) {
-    return '—'
+    return "—";
   }
 
   try {
-    return JSON.stringify(value, null, 2)
+    return JSON.stringify(value, null, 2);
   } catch {
-    return String(value)
+    return String(value);
   }
 }
 
 function statusVariant(status: string) {
   switch (status) {
-    case 'succeeded':
-      return 'success' as const
-    case 'running':
-      return 'default' as const
-    case 'queued':
-      return 'secondary' as const
-    case 'failed':
-      return 'danger' as const
-    case 'cancelled':
-      return 'warning' as const
+    case "succeeded":
+      return "success" as const;
+    case "running":
+      return "default" as const;
+    case "queued":
+      return "secondary" as const;
+    case "failed":
+      return "danger" as const;
+    case "cancelled":
+      return "warning" as const;
     default:
-      return 'outline' as const
+      return "outline" as const;
   }
 }
 
@@ -69,124 +82,145 @@ const EMPTY_OVERVIEW: WorkerOverview = {
   active_jobs: 0,
   worker_stats: [],
   catalog: [],
-}
+};
 
 export function WorkersPage() {
-  const [searchParams] = useSearchParams()
-  const [overview, setOverview] = useState<WorkerOverview>(EMPTY_OVERVIEW)
-  const [jobs, setJobs] = useState<WorkerJobRecord[]>([])
-  const [total, setTotal] = useState(0)
-  const [loading, setLoading] = useState(true)
-  const [refreshing, setRefreshing] = useState(false)
-  const [actioning, setActioning] = useState<string | null>(null)
-  const [selectedJobId, setSelectedJobId] = useState<number | null>(null)
-  const [statusFilter, setStatusFilter] = useState(searchParams.get('status') || 'all')
-  const [kindFilter, setKindFilter] = useState(searchParams.get('kind') || 'all')
-  const [workerFilter, setWorkerFilter] = useState(searchParams.get('worker') || 'all')
-  const [search, setSearch] = useState(searchParams.get('search') || '')
+  const [searchParams] = useSearchParams();
+  const [overview, setOverview] = useState<WorkerOverview>(EMPTY_OVERVIEW);
+  const [jobs, setJobs] = useState<WorkerJobRecord[]>([]);
+  const [total, setTotal] = useState(0);
+  const [loading, setLoading] = useState(true);
+  const [refreshing, setRefreshing] = useState(false);
+  const [actioning, setActioning] = useState<string | null>(null);
+  const [selectedJobId, setSelectedJobId] = useState<number | null>(null);
+  const [statusFilter, setStatusFilter] = useState(
+    searchParams.get("status") || "all",
+  );
+  const [kindFilter, setKindFilter] = useState(
+    searchParams.get("kind") || "all",
+  );
+  const [workerFilter, setWorkerFilter] = useState(
+    searchParams.get("worker") || "all",
+  );
+  const [search, setSearch] = useState(searchParams.get("search") || "");
 
   const requestedJobId = useMemo(() => {
-    const raw = Number.parseInt(searchParams.get('job') || '', 10)
-    return Number.isFinite(raw) ? raw : null
-  }, [searchParams])
+    const raw = Number.parseInt(searchParams.get("job") || "", 10);
+    return Number.isFinite(raw) ? raw : null;
+  }, [searchParams]);
 
   useEffect(() => {
-    setStatusFilter(searchParams.get('status') || 'all')
-    setKindFilter(searchParams.get('kind') || 'all')
-    setWorkerFilter(searchParams.get('worker') || 'all')
-    setSearch(searchParams.get('search') || '')
-  }, [searchParams])
+    setStatusFilter(searchParams.get("status") || "all");
+    setKindFilter(searchParams.get("kind") || "all");
+    setWorkerFilter(searchParams.get("worker") || "all");
+    setSearch(searchParams.get("search") || "");
+  }, [searchParams]);
 
-  const loadData = useCallback(async (showToast = false) => {
-    try {
-      if (showToast) {
-        setRefreshing(true)
-      }
-      const [nextOverview, nextJobs] = await Promise.all([
-        adminApi.getWorkersOverview(),
-        adminApi.listWorkerJobs({
-          status: statusFilter === 'all' ? undefined : statusFilter,
-          jobKind: kindFilter === 'all' ? undefined : kindFilter,
-          workerName: workerFilter === 'all' ? undefined : workerFilter,
-          search: search.trim() || undefined,
-          limit: 120,
-        }),
-      ])
-      let nextJobList = nextJobs.jobs
-      if (requestedJobId && !nextJobList.some((item) => item.id === requestedJobId)) {
-        try {
-          const requestedJob = await adminApi.getWorkerJob(requestedJobId)
-          nextJobList = [requestedJob, ...nextJobList]
-        } catch {
-          // ignore deep-link miss and keep current list
+  const loadData = useCallback(
+    async (showToast = false) => {
+      try {
+        if (showToast) {
+          setRefreshing(true);
         }
+        const [nextOverview, nextJobs] = await Promise.all([
+          adminApi.getWorkersOverview(),
+          adminApi.listWorkerJobs({
+            status: statusFilter === "all" ? undefined : statusFilter,
+            jobKind: kindFilter === "all" ? undefined : kindFilter,
+            workerName: workerFilter === "all" ? undefined : workerFilter,
+            search: search.trim() || undefined,
+            limit: 120,
+          }),
+        ]);
+        let nextJobList = nextJobs.jobs;
+        if (
+          requestedJobId &&
+          !nextJobList.some((item) => item.id === requestedJobId)
+        ) {
+          try {
+            const requestedJob = await adminApi.getWorkerJob(requestedJobId);
+            nextJobList = [requestedJob, ...nextJobList];
+          } catch {
+            // ignore deep-link miss and keep current list
+          }
+        }
+        startTransition(() => {
+          setOverview(nextOverview);
+          setJobs(nextJobList);
+          setTotal(nextJobs.total);
+        });
+        if (showToast) {
+          toast.success("Worker 管理面板已刷新。");
+        }
+      } catch (error) {
+        toast.error(
+          error instanceof ApiError ? error.message : "无法加载 worker 面板。",
+        );
+      } finally {
+        setLoading(false);
+        setRefreshing(false);
       }
-      startTransition(() => {
-        setOverview(nextOverview)
-        setJobs(nextJobList)
-        setTotal(nextJobs.total)
-      })
-      if (showToast) {
-        toast.success('Worker 管理面板已刷新。')
-      }
-    } catch (error) {
-      toast.error(error instanceof ApiError ? error.message : '无法加载 worker 面板。')
-    } finally {
-      setLoading(false)
-      setRefreshing(false)
-    }
-  }, [kindFilter, requestedJobId, search, statusFilter, workerFilter])
+    },
+    [kindFilter, requestedJobId, search, statusFilter, workerFilter],
+  );
 
   useEffect(() => {
-    void loadData(false)
-  }, [loadData])
+    void loadData(false);
+  }, [loadData]);
 
   useEffect(() => {
     const timer = window.setInterval(() => {
-      void loadData(false)
-    }, 5000)
+      void loadData(false);
+    }, 5000);
 
-    return () => window.clearInterval(timer)
-  }, [loadData])
+    return () => window.clearInterval(timer);
+  }, [loadData]);
 
   useEffect(() => {
     setSelectedJobId((current) => {
       if (requestedJobId) {
-        return requestedJobId
+        return requestedJobId;
       }
       if (current && jobs.some((item) => item.id === current)) {
-        return current
+        return current;
       }
-      return jobs[0]?.id ?? null
-    })
-  }, [jobs, requestedJobId])
+      return jobs[0]?.id ?? null;
+    });
+  }, [jobs, requestedJobId]);
 
   const selectedJob = useMemo(
     () => jobs.find((item) => item.id === selectedJobId) ?? null,
     [jobs, selectedJobId],
-  )
+  );
 
-  const runTask = useCallback(async (task: 'weekly' | 'monthly' | 'retry') => {
-    try {
-      setActioning(task)
-      const result =
-        task === 'retry'
-          ? await adminApi.runRetryDeliveriesWorker(80)
-          : await adminApi.runDigestWorker(task)
-      toast.success(`已入队：#${result.job.id} ${result.job.display_name ?? result.job.worker_name}`)
-      await loadData(false)
-      setSelectedJobId(result.job.id)
-    } catch (error) {
-      toast.error(error instanceof ApiError ? error.message : '任务入队失败。')
-    } finally {
-      setActioning(null)
-    }
-  }, [loadData])
+  const runTask = useCallback(
+    async (task: "weekly" | "monthly" | "retry") => {
+      try {
+        setActioning(task);
+        const result =
+          task === "retry"
+            ? await adminApi.runRetryDeliveriesWorker(80)
+            : await adminApi.runDigestWorker(task);
+        toast.success(
+          `已入队：#${result.job.id} ${result.job.display_name ?? result.job.worker_name}`,
+        );
+        await loadData(false);
+        setSelectedJobId(result.job.id);
+      } catch (error) {
+        toast.error(
+          error instanceof ApiError ? error.message : "任务入队失败。",
+        );
+      } finally {
+        setActioning(null);
+      }
+    },
+    [loadData],
+  );
 
   const workerOptions = overview.catalog.map((item) => ({
     value: item.worker_name,
     label: item.label,
-  }))
+  }));
 
   if (loading) {
     return (
@@ -194,7 +228,7 @@ export function WorkersPage() {
         <Skeleton className="h-40 rounded-3xl" />
         <Skeleton className="h-[760px] rounded-3xl" />
       </div>
-    )
+    );
   }
 
   return (
@@ -203,78 +237,123 @@ export function WorkersPage() {
         <div className="space-y-3">
           <Badge variant="secondary">Workers / Queue</Badge>
           <div>
-            <h2 className="text-3xl font-semibold tracking-tight">异步 Worker 控制台</h2>
+            <h2 className="text-3xl font-semibold tracking-tight">
+              异步 Worker 控制台
+            </h2>
             <p className="mt-2 max-w-3xl text-sm leading-7 text-muted-foreground">
-              统一查看后台下载、通知投递与 digest / 重试任务；支持筛选、查看详情、取消、重跑与手动触发。
+              统一查看后台下载、通知投递与 digest /
+              重试任务；支持筛选、查看详情、取消、重跑与手动触发。
             </p>
           </div>
         </div>
 
         <div className="flex flex-wrap items-center gap-3">
-          <Button variant="outline" onClick={() => void loadData(true)} disabled={refreshing}>
+          <Button
+            variant="outline"
+            onClick={() => void loadData(true)}
+            disabled={refreshing}
+          >
             <RefreshCcw className="h-4 w-4" />
-            {refreshing ? '刷新中...' : '刷新'}
+            {refreshing ? "刷新中..." : "刷新"}
           </Button>
           <Button
             variant="secondary"
             data-testid="workers-run-weekly"
             disabled={actioning !== null}
-            onClick={() => void runTask('weekly')}
+            onClick={() => void runTask("weekly")}
           >
             <Send className="h-4 w-4" />
-            {actioning === 'weekly' ? '入队中...' : '发送周报'}
+            {actioning === "weekly" ? "入队中..." : "发送周报"}
           </Button>
           <Button
             data-testid="workers-run-monthly"
             disabled={actioning !== null}
-            onClick={() => void runTask('monthly')}
+            onClick={() => void runTask("monthly")}
           >
             <Workflow className="h-4 w-4" />
-            {actioning === 'monthly' ? '入队中...' : '发送月报'}
+            {actioning === "monthly" ? "入队中..." : "发送月报"}
           </Button>
           <Button
             variant="outline"
             data-testid="workers-run-retry"
             disabled={actioning !== null}
-            onClick={() => void runTask('retry')}
+            onClick={() => void runTask("retry")}
           >
             <TimerReset className="h-4 w-4" />
-            {actioning === 'retry' ? '处理中...' : '重试待投递'}
+            {actioning === "retry" ? "处理中..." : "重试待投递"}
           </Button>
         </div>
       </div>
 
       <div className="grid gap-4 md:grid-cols-2 xl:grid-cols-6">
         {[
-          { label: '总任务', value: overview.total_jobs, hint: `${overview.worker_stats.length} 种 worker`, icon: SquareTerminal },
-          { label: '排队中', value: overview.queued, hint: 'queued', icon: LoaderCircle },
-          { label: '运行中', value: overview.running, hint: 'running', icon: Workflow },
-          { label: '成功', value: overview.succeeded, hint: 'succeeded', icon: Send },
-          { label: '失败', value: overview.failed, hint: 'failed', icon: RotateCcw },
-          { label: '已取消', value: overview.cancelled, hint: 'cancelled', icon: StopCircle },
+          {
+            label: "总任务",
+            value: overview.total_jobs,
+            hint: `${overview.worker_stats.length} 种 worker`,
+            icon: SquareTerminal,
+          },
+          {
+            label: "排队中",
+            value: overview.queued,
+            hint: "queued",
+            icon: LoaderCircle,
+          },
+          {
+            label: "运行中",
+            value: overview.running,
+            hint: "running",
+            icon: Workflow,
+          },
+          {
+            label: "成功",
+            value: overview.succeeded,
+            hint: "succeeded",
+            icon: Send,
+          },
+          {
+            label: "失败",
+            value: overview.failed,
+            hint: "failed",
+            icon: RotateCcw,
+          },
+          {
+            label: "已取消",
+            value: overview.cancelled,
+            hint: "cancelled",
+            icon: StopCircle,
+          },
         ].map((item) => {
-          const Icon = item.icon
+          const Icon = item.icon;
           return (
             <Card key={item.label}>
               <CardContent className="flex items-center justify-between gap-4 p-5">
                 <div>
-                  <div className="text-xs uppercase tracking-[0.22em] text-muted-foreground">{item.label}</div>
-                  <div className="mt-2 text-3xl font-semibold tracking-tight">{item.value}</div>
-                  <div className="mt-1 text-xs text-muted-foreground">{item.hint}</div>
+                  <div className="text-xs uppercase tracking-[0.22em] text-muted-foreground">
+                    {item.label}
+                  </div>
+                  <div className="mt-2 text-3xl font-semibold tracking-tight">
+                    {item.value}
+                  </div>
+                  <div className="mt-1 text-xs text-muted-foreground">
+                    {item.hint}
+                  </div>
                 </div>
                 <div className="rounded-2xl border border-primary/20 bg-primary/10 p-3 text-primary">
                   <Icon className="h-5 w-5" />
                 </div>
               </CardContent>
             </Card>
-          )
+          );
         })}
       </div>
 
       <Card>
         <CardHeader>
           <CardTitle>Worker 分类视图</CardTitle>
-          <CardDescription>快速看每类 worker / task 当前堆积、失败与最近执行情况。</CardDescription>
+          <CardDescription>
+            快速看每类 worker / task 当前堆积、失败与最近执行情况。
+          </CardDescription>
         </CardHeader>
         <CardContent className="grid gap-4 lg:grid-cols-2 2xl:grid-cols-3">
           {overview.worker_stats.map((item) => (
@@ -282,34 +361,50 @@ export function WorkersPage() {
               key={item.worker_name}
               type="button"
               className={cn(
-                'rounded-3xl border border-border/70 bg-background/50 p-4 text-left transition hover:border-primary/30 hover:bg-primary/5',
-                workerFilter === item.worker_name && 'border-primary/40 bg-primary/10',
+                "rounded-3xl border border-border/70 bg-background/50 p-4 text-left transition hover:border-primary/30 hover:bg-primary/5",
+                workerFilter === item.worker_name &&
+                  "border-primary/40 bg-primary/10",
               )}
-              onClick={() => setWorkerFilter((current) => (current === item.worker_name ? 'all' : item.worker_name))}
+              onClick={() =>
+                setWorkerFilter((current) =>
+                  current === item.worker_name ? "all" : item.worker_name,
+                )
+              }
             >
               <div className="flex items-center justify-between gap-3">
                 <div>
-                  <div className="text-sm font-medium text-foreground">{item.label}</div>
-                  <div className="mt-1 text-xs text-muted-foreground">{item.worker_name}</div>
+                  <div className="text-sm font-medium text-foreground">
+                    {item.label}
+                  </div>
+                  <div className="mt-1 text-xs text-muted-foreground">
+                    {item.worker_name}
+                  </div>
                 </div>
                 <Badge variant="outline">{item.job_kind}</Badge>
               </div>
               <div className="mt-4 grid grid-cols-5 gap-2 text-center text-xs">
                 {[
-                  ['Q', item.queued],
-                  ['R', item.running],
-                  ['OK', item.succeeded],
-                  ['ERR', item.failed],
-                  ['X', item.cancelled],
+                  ["Q", item.queued],
+                  ["R", item.running],
+                  ["OK", item.succeeded],
+                  ["ERR", item.failed],
+                  ["X", item.cancelled],
                 ].map(([label, value]) => (
-                  <div key={String(label)} className="rounded-2xl border border-border/70 px-2 py-2">
-                    <div className="text-[10px] uppercase tracking-[0.18em] text-muted-foreground">{label}</div>
-                    <div className="mt-1 text-base font-semibold text-foreground">{value}</div>
+                  <div
+                    key={String(label)}
+                    className="rounded-2xl border border-border/70 px-2 py-2"
+                  >
+                    <div className="text-[10px] uppercase tracking-[0.18em] text-muted-foreground">
+                      {label}
+                    </div>
+                    <div className="mt-1 text-base font-semibold text-foreground">
+                      {value}
+                    </div>
                   </div>
                 ))}
               </div>
               <div className="mt-3 text-xs text-muted-foreground">
-                最近任务：{item.last_job_at ?? '—'}
+                最近任务：{item.last_job_at ?? "—"}
               </div>
             </button>
           ))}
@@ -320,11 +415,16 @@ export function WorkersPage() {
         <Card>
           <CardHeader>
             <CardTitle>任务历史</CardTitle>
-            <CardDescription>当前筛选后共 {total} 条，列表保留最近 120 条任务记录。</CardDescription>
+            <CardDescription>
+              当前筛选后共 {total} 条，列表保留最近 120 条任务记录。
+            </CardDescription>
           </CardHeader>
           <CardContent className="space-y-4">
             <div className="grid gap-3 lg:grid-cols-[180px_180px_220px_1fr]">
-              <Select value={statusFilter} onChange={(event) => setStatusFilter(event.target.value)}>
+              <Select
+                value={statusFilter}
+                onChange={(event) => setStatusFilter(event.target.value)}
+              >
                 <option value="all">全部状态</option>
                 <option value="queued">queued</option>
                 <option value="running">running</option>
@@ -332,12 +432,18 @@ export function WorkersPage() {
                 <option value="failed">failed</option>
                 <option value="cancelled">cancelled</option>
               </Select>
-              <Select value={kindFilter} onChange={(event) => setKindFilter(event.target.value)}>
+              <Select
+                value={kindFilter}
+                onChange={(event) => setKindFilter(event.target.value)}
+              >
                 <option value="all">全部类型</option>
                 <option value="worker">worker</option>
                 <option value="task">task</option>
               </Select>
-              <Select value={workerFilter} onChange={(event) => setWorkerFilter(event.target.value)}>
+              <Select
+                value={workerFilter}
+                onChange={(event) => setWorkerFilter(event.target.value)}
+              >
                 <option value="all">全部 worker</option>
                 {workerOptions.map((item) => (
                   <option key={item.value} value={item.value}>
@@ -370,44 +476,64 @@ export function WorkersPage() {
                     key={item.id}
                     data-testid={`worker-job-row-${item.id}`}
                     className={cn(
-                      'cursor-pointer',
-                      selectedJobId === item.id && 'bg-primary/5',
+                      "cursor-pointer",
+                      selectedJobId === item.id && "bg-primary/5",
                     )}
                     onClick={() => setSelectedJobId(item.id)}
                   >
-                    <TableCell className="font-mono text-xs">#{item.id}</TableCell>
+                    <TableCell className="font-mono text-xs">
+                      #{item.id}
+                    </TableCell>
                     <TableCell>
                       <div className="space-y-1">
-                        <div className="font-medium text-foreground">{item.display_name ?? item.worker_name}</div>
-                        <div className="text-xs text-muted-foreground">{item.worker_name}</div>
+                        <div className="font-medium text-foreground">
+                          {item.display_name ?? item.worker_name}
+                        </div>
+                        <div className="text-xs text-muted-foreground">
+                          {item.worker_name}
+                        </div>
                       </div>
                     </TableCell>
                     <TableCell>
                       <div className="space-y-2">
-                        <Badge variant={statusVariant(item.status)}>{item.status}</Badge>
-                        {item.cancel_requested ? <div className="text-[11px] text-amber-600">cancel requested</div> : null}
+                        <Badge variant={statusVariant(item.status)}>
+                          {item.status}
+                        </Badge>
+                        {formatWorkerProgress(item) ? (
+                          <div className="text-[11px] leading-5 text-muted-foreground">
+                            {formatWorkerProgress(item)}
+                          </div>
+                        ) : null}
+                        {item.cancel_requested ? (
+                          <div className="text-[11px] text-amber-600">
+                            cancel requested
+                          </div>
+                        ) : null}
                       </div>
                     </TableCell>
                     <TableCell>
                       <div className="space-y-1 text-xs text-muted-foreground">
                         <div>{item.job_kind}</div>
-                        <div>{item.requested_by ?? 'system'}</div>
+                        <div>{item.requested_by ?? "system"}</div>
                       </div>
                     </TableCell>
                     <TableCell className="text-xs text-muted-foreground">
                       {item.related_entity_type && item.related_entity_id
                         ? `${item.related_entity_type}:${item.related_entity_id}`
-                        : '—'}
+                        : "—"}
                     </TableCell>
                     <TableCell className="text-xs text-muted-foreground">
                       <div>{item.queued_at ?? item.created_at}</div>
-                      <div>done: {item.finished_at ?? '—'}</div>
+                      <div>done: {item.finished_at ?? "—"}</div>
                     </TableCell>
                   </TableRow>
                 ))}
                 {!jobs.length ? (
                   <TableRow>
-                    <TableCell colSpan={6} className="py-10 text-center text-sm text-muted-foreground">
+                    <TableCell
+                      colSpan={6}
+                      className="py-10 text-center text-sm text-muted-foreground"
+                    >
                       当前筛选没有匹配任务。
                     </TableCell>
                   </TableRow>
@@ -420,14 +546,18 @@ export function WorkersPage() {
         <Card>
           <CardHeader>
             <CardTitle>任务详情</CardTitle>
-            <CardDescription>查看 payload / result / error，并对单个任务执行取消或重跑。</CardDescription>
+            <CardDescription>
+              查看 payload / result / error，并对单个任务执行取消或重跑。
+            </CardDescription>
           </CardHeader>
           <CardContent>
             {selectedJob ? (
               <div className="space-y-4">
                 <div className="flex flex-wrap items-center gap-2">
                   <Badge variant="outline">#{selectedJob.id}</Badge>
-                  <Badge variant={statusVariant(selectedJob.status)}>{selectedJob.status}</Badge>
+                  <Badge variant={statusVariant(selectedJob.status)}>
+                    {selectedJob.status}
+                  </Badge>
                   <Badge variant="secondary">{selectedJob.job_kind}</Badge>
                 </div>
 
@@ -435,84 +565,155 @@ export function WorkersPage() {
                   <h3 className="text-xl font-semibold tracking-tight text-foreground">
                     {selectedJob.display_name ?? selectedJob.worker_name}
                   </h3>
-                  <p className="mt-2 text-sm leading-6 text-muted-foreground">{selectedJob.worker_name}</p>
+                  <p className="mt-2 text-sm leading-6 text-muted-foreground">
+                    {selectedJob.worker_name}
+                  </p>
                 </div>
 
                 <div className="grid gap-3 sm:grid-cols-2">
                   {[
-                    ['请求人', selectedJob.requested_by ?? 'system'],
-                    ['来源', selectedJob.requested_source ?? 'system'],
-                    ['关联实体', selectedJob.related_entity_type && selectedJob.related_entity_id ? `${selectedJob.related_entity_type}:${selectedJob.related_entity_id}` : '—'],
-                    ['尝试次数', `${selectedJob.attempts_count} / ${selectedJob.max_attempts}`],
-                    ['排队时间', selectedJob.queued_at ?? selectedJob.created_at],
-                    ['开始时间', selectedJob.started_at ?? '—'],
-                    ['完成时间', selectedJob.finished_at ?? '—'],
-                    ['上游任务', selectedJob.parent_job_id ? `#${selectedJob.parent_job_id}` : '—'],
+                    ["请求人", selectedJob.requested_by ?? "system"],
+                    ["来源", selectedJob.requested_source ?? "system"],
+                    [
+                      "关联实体",
+                      selectedJob.related_entity_type &&
+                      selectedJob.related_entity_id
+                        ? `${selectedJob.related_entity_type}:${selectedJob.related_entity_id}`
+                        : "—",
+                    ],
+                    [
+                      "尝试次数",
+                      `${selectedJob.attempts_count} / ${selectedJob.max_attempts}`,
+                    ],
+                    [
+                      "排队时间",
+                      selectedJob.queued_at ?? selectedJob.created_at,
+                    ],
+                    ["开始时间", selectedJob.started_at ?? "—"],
+                    ["完成时间", selectedJob.finished_at ?? "—"],
+                    [
+                      "上游任务",
+                      selectedJob.parent_job_id
+                        ? `#${selectedJob.parent_job_id}`
+                        : "—",
+                    ],
                   ].map(([label, value]) => (
-                    <div key={String(label)} className="rounded-2xl border border-border/70 bg-background/50 px-4 py-3">
-                      <div className="text-[11px] uppercase tracking-[0.2em] text-muted-foreground">{label}</div>
-                      <div className="mt-2 text-sm text-foreground break-all">{value}</div>
+                    <div
+                      key={String(label)}
+                      className="rounded-2xl border border-border/70 bg-background/50 px-4 py-3"
+                    >
+                      <div className="text-[11px] uppercase tracking-[0.2em] text-muted-foreground">
+                        {label}
+                      </div>
+                      <div className="mt-2 text-sm text-foreground break-all">
+                        {value}
+                      </div>
                     </div>
                   ))}
                 </div>
 
+                {formatWorkerProgress(selectedJob) ? (
+                  <div className="rounded-2xl border border-border/70 bg-background/50 px-4 py-3">
+                    <div className="text-[11px] uppercase tracking-[0.2em] text-muted-foreground">
+                      进度
+                    </div>
+                    <div className="mt-2 text-sm leading-6 text-foreground">
+                      {formatWorkerProgress(selectedJob)}
+                    </div>
+                  </div>
+                ) : null}
+
                 <div className="flex flex-wrap gap-3">
                   <Button
                     variant="outline"
-                    disabled={!selectedJob.can_cancel || actioning === `cancel-${selectedJob.id}`}
+                    disabled={
+                      !selectedJob.can_cancel ||
+                      actioning === `cancel-${selectedJob.id}`
+                    }
                     data-testid="workers-cancel-job"
                     onClick={async () => {
                       try {
-                        setActioning(`cancel-${selectedJob.id}`)
-                        const result = await adminApi.cancelWorkerJob(selectedJob.id)
-                        toast.success(`任务 #${result.id} 已标记取消。`)
-                        await loadData(false)
+                        setActioning(`cancel-${selectedJob.id}`);
+                        const result = await adminApi.cancelWorkerJob(
+                          selectedJob.id,
+                        );
+                        toast.success(`任务 #${result.id} 已标记取消。`);
+                        await loadData(false);
                       } catch (error) {
-                        toast.error(error instanceof ApiError ? error.message : '取消任务失败。')
+                        toast.error(
+                          error instanceof ApiError
+                            ? error.message
+                            : "取消任务失败。",
+                        );
                       } finally {
-                        setActioning(null)
+                        setActioning(null);
                       }
                     }}
                   >
                     <StopCircle className="h-4 w-4" />
-                    {actioning === `cancel-${selectedJob.id}` ? '取消中...' : '取消任务'}
+                    {actioning === `cancel-${selectedJob.id}`
+                      ? "取消中..."
+                      : "取消任务"}
                   </Button>
                   <Button
-                    disabled={!selectedJob.can_retry || actioning === `retry-${selectedJob.id}`}
+                    disabled={
+                      !selectedJob.can_retry ||
+                      actioning === `retry-${selectedJob.id}`
+                    }
                     data-testid="workers-retry-job"
                     onClick={async () => {
                       try {
-                        setActioning(`retry-${selectedJob.id}`)
-                        const result = await adminApi.retryWorkerJob(selectedJob.id)
-                        toast.success(`已重跑，新的任务 #${result.job.id}`)
-                        await loadData(false)
-                        setSelectedJobId(result.job.id)
+                        setActioning(`retry-${selectedJob.id}`);
+                        const result = await adminApi.retryWorkerJob(
+                          selectedJob.id,
+                        );
+                        toast.success(`已重跑，新的任务 #${result.job.id}`);
+                        await loadData(false);
+                        setSelectedJobId(result.job.id);
                       } catch (error) {
-                        toast.error(error instanceof ApiError ? error.message : '重跑任务失败。')
+                        toast.error(
+                          error instanceof ApiError
+                            ? error.message
+                            : "重跑任务失败。",
+                        );
                       } finally {
-                        setActioning(null)
+                        setActioning(null);
                       }
                     }}
                   >
                     <RotateCcw className="h-4 w-4" />
-                    {actioning === `retry-${selectedJob.id}` ? '重跑中...' : '重跑任务'}
+                    {actioning === `retry-${selectedJob.id}`
+                      ? "重跑中..."
+                      : "重跑任务"}
                   </Button>
                 </div>
 
                 <div className="space-y-3">
                   <div>
-                    <div className="mb-2 text-sm font-medium text-foreground">Payload</div>
-                    <pre className="overflow-x-auto rounded-3xl border border-border/70 bg-background/60 p-4 text-xs leading-6 text-muted-foreground">{prettyJson(selectedJob.payload)}</pre>
+                    <div className="mb-2 text-sm font-medium text-foreground">
+                      Payload
+                    </div>
+                    <pre className="overflow-x-auto rounded-3xl border border-border/70 bg-background/60 p-4 text-xs leading-6 text-muted-foreground">
+                      {prettyJson(selectedJob.payload)}
+                    </pre>
                   </div>
 
                   <div>
-                    <div className="mb-2 text-sm font-medium text-foreground">Result</div>
-                    <pre className="overflow-x-auto rounded-3xl border border-border/70 bg-background/60 p-4 text-xs leading-6 text-muted-foreground">{prettyJson(selectedJob.result)}</pre>
+                    <div className="mb-2 text-sm font-medium text-foreground">
+                      Result
+                    </div>
+                    <pre className="overflow-x-auto rounded-3xl border border-border/70 bg-background/60 p-4 text-xs leading-6 text-muted-foreground">
+                      {prettyJson(selectedJob.result)}
+                    </pre>
                   </div>
 
                   <div>
-                    <div className="mb-2 text-sm font-medium text-foreground">Error</div>
-                    <pre className="overflow-x-auto rounded-3xl border border-border/70 bg-background/60 p-4 text-xs leading-6 text-muted-foreground">{selectedJob.error_text ?? '—'}</pre>
+                    <div className="mb-2 text-sm font-medium text-foreground">
+                      Error
+                    </div>
+                    <pre className="overflow-x-auto rounded-3xl border border-border/70 bg-background/60 p-4 text-xs leading-6 text-muted-foreground">
+                      {selectedJob.error_text ?? "—"}
+                    </pre>
                   </div>
                 </div>
               </div>
@@ -525,5 +726,5 @@ export function WorkersPage() {
         </Card>
       </div>
     </div>
-  )
+  );
 }