fix(cms): resolve admin dogfood findings on auth, content editing, and UX

修复 CMS / Admin 后台 dogfood 专项测试发现的阻塞性与体验性问题： - 登录后无限重定向（Secure Cookie + Edge Runtime JWT 兼容） - 内容新增/编辑保存 400/500（默认不加密请求体、自动生成唯一 slug） - 编辑时提交 status 导致验证错误 - 原生 confirm 阻塞自动化测试，改为 AlertDialog - 表单字段可访问性（id/htmlFor/fieldset） - JSON 数组标签字段新增 TagInput 组件 - 操作反馈统一使用 Sonner Toast - 后台隐藏营销 Cookie 横幅 - 媒体库空状态优化添加 dogfood-cms-regression 与 dogfood-cms-output 报告、截图及工作流路由测试。
2026-07-25 08:03:06 +08:00
parent f6f5766bb9
commit d9c0e5f2c1
48 changed files with 1445 additions and 106 deletions
@@ -0,0 +1,69 @@
+# Dogfood Report: Novalon CMS / Admin 后台修复后回归测试
+
+| Field | Value |
+|-------|-------|
+| **Date** | 2026-07-25 |
+| **App URL** | http://localhost:3000 |
+| **Session** | novalon-cms-regression |
+| **Scope** | CMS / Admin 后台核心流程：登录、内容（新闻）CRUD、页面区域配置、媒体库、角色权限、退出登录 |
+
+## Summary
+
+本次回归测试基于 CMS 专项 dogfood 发现的 2 个阻塞性问题 + 5 个体验性问题修复后进行，验证所有修复项是否生效、核心管理流程是否可正常使用。
+
+| Severity | Count |
+|----------|-------|
+| Critical | 0 |
+| High | 0 |
+| Medium | 0 |
+| Low | 0 |
+| **Total** | **0** |
+
+## Regression Checklist
+
+| # | Step | Expected | Result | Screenshot |
+|---|------|----------|--------|------------|
+| 1 | 访问 `/admin/login` | 登录页正常加载，无营销 Cookie 横幅 | ✅ 通过 | [01-login-page.png](screenshots/01-login-page.png) |
+| 2 | 使用 admin / admin123 登录 | 登录成功并跳转仪表盘 | ✅ 通过 | [02-dashboard.png](screenshots/02-dashboard.png) |
+| 3 | 进入新闻资讯列表 | 列表加载正常 | ✅ 通过 | [03-news-list.png](screenshots/03-news-list.png) |
+| 4 | 点击新增新闻并填写表单 | 创建表单加载，字段标签可访问 | ✅ 通过 | [04-news-create-form.png](screenshots/04-news-create-form.png) |
+| 5 | 提交创建 | 显示成功 Toast，无 400/500 | ✅ 通过 | [05-news-create-success.png](screenshots/05-news-create-success.png) |
+| 6 | 返回列表查看新创建记录 | 列表中出现新记录 | ✅ 通过 | [06-news-after-save-eval.png](screenshots/06-news-after-save-eval.png) |
+| 7 | 搜索新闻标题 | 搜索结果正确 | ✅ 通过 | [07-news-search.png](screenshots/07-news-search.png) |
+| 8 | 编辑新闻标题 | 编辑表单加载，字段标签可访问 | ✅ 通过 | [08-news-edit-form.png](screenshots/08-news-edit-form.png) |
+| 9 | 保存第一次编辑 | 显示保存成功 Toast | ✅ 通过 | [09-news-edit-success.png](screenshots/09-news-edit-success.png) |
+| 10 | 再次编辑标题 | 列表与编辑页数据一致 | ✅ 通过 | [10-news-edit-success-2.png](screenshots/10-news-edit-success-2.png) |
+| 11 | 打开删除确认对话框 | 显示自定义 AlertDialog（非原生 confirm） | ✅ 通过 | [11-news-delete-dialog.png](screenshots/11-news-delete-dialog.png) |
+| 12 | 确认删除 | 删除成功并显示 Toast，列表无该记录 | ✅ 通过 | [12-news-delete-success.png](screenshots/12-news-delete-success.png) |
+| 13 | 进入页面区域配置 | 区域列表加载正常 | ✅ 通过 | [13-zones-page.png](screenshots/13-zones-page.png) |
+| 14 | 点击编辑首页 Hero Banner | 编辑抽屉/表单打开 | ✅ 通过 | [14-zones-edit.png](screenshots/14-zones-edit.png) / [15-zones-edit-form.png](screenshots/15-zones-edit-form.png) |
+| 15 | 保存区域配置 | 显示保存成功 Toast | ✅ 通过 | [16-zones-save-success.png](screenshots/16-zones-save-success.png) |
+| 16 | 进入媒体库 | 空状态提示友好，提供上传入口 | ✅ 通过 | [17-media-empty.png](screenshots/17-media-empty.png) |
+| 17 | 进入角色权限页 | 权限矩阵加载正常 | ✅ 通过 | [18-roles-page.png](screenshots/18-roles-page.png) |
+| 18 | 保存权限配置 | 显示保存成功 Toast | ✅ 通过 | [19-roles-save-success.png](screenshots/19-roles-save-success.png) |
+| 19 | 退出登录 | 成功退出并返回登录页 | ✅ 通过 | [20-logout.png](screenshots/20-logout.png) |
+
+## Issues
+
+未发现新问题。
+
+## 修复验证说明
+
+| 原问题 | 修复点 | 回归验证结果 |
+|--------|--------|--------------|
+| 登录后无限重定向回登录页 | `src/lib/auth.ts` 根据请求协议动态设置 `Secure` Cookie；`src/middleware.ts` 改用 Web Crypto API 兼容 Edge Runtime | ✅ 登录成功并正常跳转 |
+| 内容新增/编辑保存 400 | `src/lib/admin-api.ts` 默认不加密请求体，仅显式 `encrypt: true` 时加密 | ✅ 创建/编辑均保存成功 |
+| 内容创建 500（slug 冲突） | `src/app/api/admin/items/route.ts` 自动生成唯一 slug | ✅ 创建成功 |
+| 编辑时提交 status 导致错误 | 编辑请求移除 `status` 字段 | ✅ 编辑保存成功 |
+| 删除使用原生 confirm 阻塞自动化 | `src/app/admin/content/[modelCode]/page.tsx` 改用 AlertDialog | ✅ 可正常删除 |
+| 表单字段可访问性不足 | `src/app/admin/content/[modelCode]/[itemId]/page.tsx` 添加 id/htmlFor/fieldset | ✅ 表单结构正确 |
+| 标签字段渲染异常 | 新增 `TagInput` 组件处理 JSON 数组字段 | ✅ 标签输入正常 |
+| 操作无 Toast 反馈 | 编辑/区域/角色/媒体库页面统一使用 Sonner toast | ✅ 保存/删除均有反馈 |
+| 后台显示营销 Cookie 横幅 | `CookieConsent.tsx` 判断 `/admin` 路由并隐藏 | ✅ 登录页无横幅 |
+| 媒体库空状态简陋 | `src/app/admin/media/page.tsx` 优化空状态设计 | ✅ 空状态友好 |
+
+## Console / Network Notes
+
+- 测试期间 API 响应正常：登录、内容 CRUD、区域保存、权限保存均返回 200/201。
+- 未观察到阻断性控制台错误。
+- 仅出现 Next.js 开发模式提示：`Detected scroll-behavior: smooth`，属于非阻断性开发提示。
@@ -4,7 +4,8 @@ import { useEffect, useState } from 'react';
 import { useRouter, useParams } from 'next/navigation';
 import { useAuth } from '@/components/admin/auth-context';
 import { adminApi } from '@/lib/admin-api';
-import { ArrowLeft, Save } from 'lucide-react';
+import { toast } from '@/components/ui/sonner';
+import { ArrowLeft, Save, X } from 'lucide-react';

 const MODEL_LABELS: Record<string, string> = {
  news: '新闻资讯',
@@ -35,6 +36,78 @@ interface ModelData {
  fields: FieldDef[];
 }

+function TagInput({
+  id,
+  value,
+  onChange,
+  placeholder,
+}: {
+  id: string;
+  value: unknown;
+  onChange: (tags: string[]) => void;
+  placeholder?: string;
+}) {
+  const tags = Array.isArray(value) ? value.filter((t): t is string => typeof t === 'string') : [];
+  const [input, setInput] = useState('');
+
+  const addTag = () => {
+    const raw = input.trim();
+    if (!raw) return;
+    const newTags = raw.split(/[,，]/).map((t) => t.trim()).filter(Boolean);
+    if (newTags.length === 0) return;
+    const merged = [...new Set([...tags, ...newTags])];
+    onChange(merged);
+    setInput('');
+  };
+
+  const removeTag = (tag: string) => {
+    onChange(tags.filter((t) => t !== tag));
+  };
+
+  const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
+    if (e.key === 'Enter') {
+      e.preventDefault();
+      addTag();
+    }
+    if (e.key === 'Backspace' && !input && tags.length > 0) {
+      onChange(tags.slice(0, -1));
+    }
+  };
+
+  return (
+    <div
+      id={id}
+      className="w-full min-h-[42px] px-3 py-2 border border-gray-300 rounded-lg text-sm focus-within:outline-none focus-within:ring-2 focus-within:ring-gray-900 focus-within:border-transparent flex flex-wrap gap-2"
+    >
+      {tags.map((tag) => (
+        <span
+          key={tag}
+          className="inline-flex items-center gap-1 bg-gray-100 text-gray-700 px-2 py-0.5 rounded text-xs"
+        >
+          {tag}
+          <button
+            type="button"
+            onClick={() => removeTag(tag)}
+            className="text-gray-400 hover:text-gray-600"
+            aria-label={`移除标签 ${tag}`}
+          >
+            <X className="w-3 h-3" />
+          </button>
+        </span>
+      ))}
+      <input
+        type="text"
+        value={input}
+        onChange={(e) => setInput(e.target.value)}
+        onKeyDown={handleKeyDown}
+        onBlur={addTag}
+        placeholder={tags.length === 0 ? placeholder || '输入标签，按回车添加' : ''}
+        className="flex-1 min-w-[120px] outline-none bg-transparent text-sm"
+      />
+    </div>
+  );
+}
+
 export default function ContentEditorPage() {
  const params = useParams();
  const modelCode = params.modelCode as string;
@@ -105,7 +178,7 @@ export default function ContentEditorPage() {

  const handleSave = async () => {
    if (!title.trim()) {
-      alert('请输入标题');
+      toast.error('请输入标题');
      return;
    }

@@ -122,17 +195,21 @@ export default function ContentEditorPage() {
          status,
          data: formData,
        });
+        toast.success(`${modelLabel}创建成功`);
      } else {
+        // 编辑时不提交 status，状态变更需通过工作流接口处理
        await adminApi.updateItem(itemId, {
          title: title.trim(),
          slug: slug.trim() || undefined,
-          status,
          data: formData,
        });
+        toast.success(`${modelLabel}保存成功`);
      }
      router.push(`/admin/content/${modelCode}`);
    } catch (err) {
-      setError(err instanceof Error ? err.message : '保存失败');
+      const message = err instanceof Error ? err.message : '保存失败';
+      setError(message);
+      toast.error(message);
      setSaving(false);
    }
  };
@@ -145,7 +222,7 @@ export default function ContentEditorPage() {
      case 'text':
        return (
          <div key={key}>
-            <label className="block text-sm font-medium text-gray-700 mb-1">
+            <label htmlFor={key} className="block text-sm font-medium text-gray-700 mb-1">
              {field.label}
              {field.required && <span className="text-red-500 ml-1">*</span>}
            </label>
@@ -153,6 +230,7 @@ export default function ContentEditorPage() {
              <p className="text-xs text-gray-400 mb-1.5">{field.description}</p>
            )}
            <input
+              id={key}
              type="text"
              value={(value as string) || ''}
              onChange={(e) => handleFieldChange(field.name, e.target.value)}
@@ -165,7 +243,7 @@ export default function ContentEditorPage() {
      case 'textarea':
        return (
          <div key={key}>
-            <label className="block text-sm font-medium text-gray-700 mb-1">
+            <label htmlFor={key} className="block text-sm font-medium text-gray-700 mb-1">
              {field.label}
              {field.required && <span className="text-red-500 ml-1">*</span>}
            </label>
@@ -173,6 +251,7 @@ export default function ContentEditorPage() {
              <p className="text-xs text-gray-400 mb-1.5">{field.description}</p>
            )}
            <textarea
+              id={key}
              value={(value as string) || ''}
              onChange={(e) => handleFieldChange(field.name, e.target.value)}
              placeholder={field.placeholder}
@@ -185,11 +264,12 @@ export default function ContentEditorPage() {
      case 'number':
        return (
          <div key={key}>
-            <label className="block text-sm font-medium text-gray-700 mb-1">
+            <label htmlFor={key} className="block text-sm font-medium text-gray-700 mb-1">
              {field.label}
              {field.required && <span className="text-red-500 ml-1">*</span>}
            </label>
            <input
+              id={key}
              type="number"
              value={(value as number) ?? ''}
              onChange={(e) => handleFieldChange(field.name, parseFloat(e.target.value) || 0)}
@@ -202,12 +282,13 @@ export default function ContentEditorPage() {
        return (
          <div key={key} className="flex items-center gap-3">
            <input
+              id={key}
              type="checkbox"
              checked={!!value}
              onChange={(e) => handleFieldChange(field.name, e.target.checked)}
              className="w-4 h-4 rounded border-gray-300 text-gray-900 focus:ring-gray-900"
            />
-            <label className="text-sm font-medium text-gray-700">{field.label}</label>
+            <label htmlFor={key} className="text-sm font-medium text-gray-700">{field.label}</label>
            {field.description && (
              <span className="text-xs text-gray-400">{field.description}</span>
            )}
@@ -218,10 +299,11 @@ export default function ContentEditorPage() {
      case 'dropdown':
        return (
          <div key={key}>
-            <label className="block text-sm font-medium text-gray-700 mb-1">
+            <label htmlFor={key} className="block text-sm font-medium text-gray-700 mb-1">
              {field.label}
            </label>
            <select
+              id={key}
              value={(value as string) || ''}
              onChange={(e) => handleFieldChange(field.name, e.target.value)}
              className="w-full px-3 py-2 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-900 focus:border-transparent"
@@ -236,13 +318,33 @@ export default function ContentEditorPage() {
          </div>
        );

+      case 'json':
+        return (
+          <div key={key}>
+            <label htmlFor={key} className="block text-sm font-medium text-gray-700 mb-1">
+              {field.label}
+              {field.required && <span className="text-red-500 ml-1">*</span>}
+            </label>
+            {field.description && (
+              <p className="text-xs text-gray-400 mb-1.5">{field.description}</p>
+            )}
+            <TagInput
+              id={key}
+              value={value}
+              onChange={(tags) => handleFieldChange(field.name, tags)}
+              placeholder={field.placeholder}
+            />
+          </div>
+        );
+
      case 'image':
        return (
          <div key={key}>
-            <label className="block text-sm font-medium text-gray-700 mb-1">
+            <label htmlFor={key} className="block text-sm font-medium text-gray-700 mb-1">
              {field.label}
            </label>
            <input
+              id={key}
              type="text"
              value={(value as string) || ''}
              onChange={(e) => handleFieldChange(field.name, e.target.value)}
@@ -262,21 +364,22 @@ export default function ContentEditorPage() {
      case 'array':
      case 'object':
        return (
-          <div key={key} className="border border-gray-200 rounded-lg p-4">
-            <label className="block text-sm font-medium text-gray-700 mb-3">
+          <fieldset key={key} className="border border-gray-200 rounded-lg p-4">
+            <legend className="text-sm font-medium text-gray-700 mb-3 px-1">
              {field.label}
-            </label>
+            </legend>
            {field.fields?.map((subField) => renderField(subField, `${field.name}.`))}
-          </div>
+          </fieldset>
        );

      default:
        return (
          <div key={key}>
-            <label className="block text-sm font-medium text-gray-700 mb-1">
+            <label htmlFor={key} className="block text-sm font-medium text-gray-700 mb-1">
              {field.label}
            </label>
            <input
+              id={key}
              type="text"
              value={(value as string) || ''}
              onChange={(e) => handleFieldChange(field.name, e.target.value)}
@@ -333,10 +436,11 @@ export default function ContentEditorPage() {
      <div className="bg-white rounded-lg border border-gray-200 p-6 space-y-5">
        {/* 标题 */}
        <div>
-          <label className="block text-sm font-medium text-gray-700 mb-1">
+          <label htmlFor="title" className="block text-sm font-medium text-gray-700 mb-1">
            标题 <span className="text-red-500">*</span>
          </label>
          <input
+            id="title"
            type="text"
            value={title}
            onChange={(e) => setTitle(e.target.value)}
@@ -347,8 +451,9 @@ export default function ContentEditorPage() {

        {/* Slug */}
        <div>
-          <label className="block text-sm font-medium text-gray-700 mb-1">Slug</label>
+          <label htmlFor="slug" className="block text-sm font-medium text-gray-700 mb-1">Slug</label>
          <input
+            id="slug"
            type="text"
            value={slug}
            onChange={(e) => setSlug(e.target.value)}
@@ -359,8 +464,9 @@ export default function ContentEditorPage() {

        {/* 状态 */}
        <div>
-          <label className="block text-sm font-medium text-gray-700 mb-1">状态</label>
+          <label htmlFor="status" className="block text-sm font-medium text-gray-700 mb-1">状态</label>
          <select
+            id="status"
            value={status}
            onChange={(e) => setStatus(e.target.value)}
            className="w-full px-3 py-2 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-900 focus:border-transparent"
@@ -4,6 +4,17 @@ import { useEffect, useState, useCallback } from 'react';
 import { useRouter, useParams } from 'next/navigation';
 import { useAuth } from '@/components/admin/auth-context';
 import { adminApi } from '@/lib/admin-api';
+import { toast } from '@/components/ui/sonner';
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+} from '@/components/ui/alert-dialog';
 import { Plus, Edit, Trash2, Search, ChevronLeft, ChevronRight } from 'lucide-react';

 const MODEL_LABELS: Record<string, string> = {
@@ -39,6 +50,8 @@ export default function ContentListPage() {
  const [search, setSearch] = useState('');
  const [loading, setLoading] = useState(true);
  const [error, setError] = useState('');
+  const [deleteDialogOpen, setDeleteDialogOpen] = useState(false);
+  const [pendingDeleteId, setPendingDeleteId] = useState<string | null>(null);
  const pageSize = 10;

  const modelLabel = MODEL_LABELS[modelCode] || modelCode;
@@ -71,13 +84,23 @@ export default function ContentListPage() {
    if (user) fetchItems();
  }, [user, authLoading, router, fetchItems]);

-  const handleDelete = async (id: string) => {
-    if (!confirm('确定要删除此内容吗？')) return;
+  const openDeleteDialog = (id: string) => {
+    setPendingDeleteId(id);
+    setDeleteDialogOpen(true);
+  };
+
+  const handleConfirmDelete = async () => {
+    if (!pendingDeleteId) return;
    try {
-      await adminApi.deleteItem(id);
+      await adminApi.deleteItem(pendingDeleteId);
+      toast.success('删除成功');
      fetchItems();
    } catch (err) {
-      alert(err instanceof Error ? err.message : '删除失败');
+      const message = err instanceof Error ? err.message : '删除失败';
+      toast.error(message);
+    } finally {
+      setPendingDeleteId(null);
+      setDeleteDialogOpen(false);
    }
  };

@@ -194,7 +217,7 @@ export default function ContentListPage() {
                          <Edit className="w-4 h-4" />
                        </button>
                        <button
-                          onClick={() => handleDelete(item.id)}
+                          onClick={() => openDeleteDialog(item.id)}
                          className="p-1.5 rounded hover:bg-red-50 text-gray-400 hover:text-red-500 transition-colors"
                          title="删除"
                        >
@@ -234,6 +257,27 @@ export default function ContentListPage() {
          </div>
        )}
      </div>
+
+      {/* Delete confirmation dialog */}
+      <AlertDialog open={deleteDialogOpen} onOpenChange={setDeleteDialogOpen}>
+        <AlertDialogContent>
+          <AlertDialogHeader>
+            <AlertDialogTitle>确认删除</AlertDialogTitle>
+            <AlertDialogDescription>
+              此操作不可撤销，确定要删除这条{modelLabel}吗？
+            </AlertDialogDescription>
+          </AlertDialogHeader>
+          <AlertDialogFooter>
+            <AlertDialogCancel onClick={() => setPendingDeleteId(null)}>取消</AlertDialogCancel>
+            <AlertDialogAction
+              onClick={handleConfirmDelete}
+              className="bg-red-600 hover:bg-red-700 text-white"
+            >
+              删除
+            </AlertDialogAction>
+          </AlertDialogFooter>
+        </AlertDialogContent>
+      </AlertDialog>
    </div>
  );
 }
@@ -4,6 +4,17 @@ import { useEffect, useState, useRef } from 'react';
 import { useRouter } from 'next/navigation';
 import { useAuth } from '@/components/admin/auth-context';
 import { adminApi } from '@/lib/admin-api';
+import { toast } from '@/components/ui/sonner';
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+} from '@/components/ui/alert-dialog';
 import { Upload, Trash2, Copy, Check, Image, File } from 'lucide-react';

 interface MediaItem {
@@ -22,6 +33,8 @@ export default function MediaPage() {
  const [loading, setLoading] = useState(true);
  const [uploading, setUploading] = useState(false);
  const [copiedId, setCopiedId] = useState<string | null>(null);
+  const [deleteDialogOpen, setDeleteDialogOpen] = useState(false);
+  const [pendingDeleteId, setPendingDeleteId] = useState<string | null>(null);
  const fileInputRef = useRef<HTMLInputElement>(null);

  const fetchMedia = async () => {
@@ -51,22 +64,34 @@ export default function MediaPage() {
    setUploading(true);
    try {
      await adminApi.uploadMedia(file);
+      toast.success('文件上传成功');
      await fetchMedia();
    } catch (err) {
-      alert(err instanceof Error ? err.message : '上传失败');
+      const message = err instanceof Error ? err.message : '上传失败';
+      toast.error(message);
    } finally {
      setUploading(false);
      if (fileInputRef.current) fileInputRef.current.value = '';
    }
  };

-  const handleDelete = async (id: string) => {
-    if (!confirm('确定要删除此文件吗？')) return;
+  const openDeleteDialog = (id: string) => {
+    setPendingDeleteId(id);
+    setDeleteDialogOpen(true);
+  };
+
+  const handleConfirmDelete = async () => {
+    if (!pendingDeleteId) return;
    try {
-      await adminApi.deleteMedia(id);
+      await adminApi.deleteMedia(pendingDeleteId);
+      toast.success('文件删除成功');
      await fetchMedia();
    } catch (err) {
-      alert(err instanceof Error ? err.message : '删除失败');
+      const message = err instanceof Error ? err.message : '删除失败';
+      toast.error(message);
+    } finally {
+      setPendingDeleteId(null);
+      setDeleteDialogOpen(false);
    }
  };

@@ -154,7 +179,7 @@ export default function MediaPage() {
                复制
              </button>
              <button
-                onClick={() => handleDelete(item.id)}
+                onClick={() => openDeleteDialog(item.id)}
                className="flex-1 flex items-center justify-center gap-1 py-1.5 text-xs text-gray-500 hover:bg-red-50 hover:text-red-500 transition-colors"
                title="删除"
              >
@@ -167,11 +192,44 @@ export default function MediaPage() {
      </div>

      {items.length === 0 && !loading && (
-        <div className="text-center py-12 text-gray-400">
-          <Image className="w-12 h-12 mx-auto mb-3 opacity-30" />
-          <p>暂无文件，点击上方按钮上传</p>
+        <div className="text-center py-16 bg-white rounded-lg border border-dashed border-gray-300">
+          <Image className="w-12 h-12 mx-auto mb-4 text-gray-300" />
+          <h3 className="text-sm font-medium text-gray-900 mb-1">暂无媒体文件</h3>
+          <p className="text-sm text-gray-500 mb-4">上传图片、文档等资源，即可在内容编辑中使用</p>
+          <label className="inline-flex items-center gap-2 bg-gray-900 text-white rounded-lg px-4 py-2 text-sm font-medium hover:bg-gray-800 cursor-pointer transition-colors">
+            <Upload className="w-4 h-4" />
+            上传文件
+            <input
+              ref={fileInputRef}
+              type="file"
+              onChange={handleUpload}
+              className="hidden"
+              accept="image/*,.pdf,.doc,.docx,.xls,.xlsx,.ppt,.pptx,.zip"
+            />
+          </label>
        </div>
      )}
+
+      {/* Delete confirmation dialog */}
+      <AlertDialog open={deleteDialogOpen} onOpenChange={setDeleteDialogOpen}>
+        <AlertDialogContent>
+          <AlertDialogHeader>
+            <AlertDialogTitle>确认删除</AlertDialogTitle>
+            <AlertDialogDescription>
+              此操作不可撤销，确定要删除该媒体文件吗？
+            </AlertDialogDescription>
+          </AlertDialogHeader>
+          <AlertDialogFooter>
+            <AlertDialogCancel onClick={() => setPendingDeleteId(null)}>取消</AlertDialogCancel>
+            <AlertDialogAction
+              onClick={handleConfirmDelete}
+              className="bg-red-600 hover:bg-red-700 text-white"
+            >
+              删除
+            </AlertDialogAction>
+          </AlertDialogFooter>
+        </AlertDialogContent>
+      </AlertDialog>
    </div>
  );
 }
@@ -0,0 +1,276 @@
+'use client';
+
+import { useEffect, useState, useCallback } from 'react';
+import { useRouter } from 'next/navigation';
+import { useAuth } from '@/components/admin/auth-context';
+import { adminApi } from '@/lib/admin-api';
+import { toast } from '@/components/ui/sonner';
+import { Shield, Check, X, Save, Loader2, Lock } from 'lucide-react';
+
+interface Role {
+  code: string;
+  name: string;
+  builtin: boolean;
+}
+
+interface Model {
+  code: string;
+  name: string;
+}
+
+type PermissionAction = 'create' | 'read' | 'update' | 'delete' | 'publish';
+
+const ACTION_LABELS: Record<PermissionAction, string> = {
+  create: '创建',
+  read: '查看',
+  update: '编辑',
+  delete: '删除',
+  publish: '发布/审核',
+};
+
+const ACTION_ORDER: PermissionAction[] = ['create', 'read', 'update', 'delete', 'publish'];
+
+export default function RolesPage() {
+  const { user, loading: authLoading } = useAuth();
+  const router = useRouter();
+
+  const [roles, setRoles] = useState<Role[]>([]);
+  const [models, setModels] = useState<Model[]>([]);
+  const [permissions, setPermissions] = useState<Set<string>>(new Set());
+  const [selectedRole, setSelectedRole] = useState<string>('');
+  const [loading, setLoading] = useState(true);
+  const [saving, setSaving] = useState(false);
+  const [error, setError] = useState('');
+
+  const fetchRoles = useCallback(async () => {
+    setLoading(true);
+    setError('');
+    try {
+      const data = await adminApi.getRoles();
+      setRoles(data.roles || []);
+      setModels(data.models || []);
+
+      const permSet = new Set<string>();
+      (data.permissions || []).forEach((p) => {
+        permSet.add(`${p.roleCode}:${p.modelCode}:${p.action}`);
+      });
+      setPermissions(permSet);
+
+      if (data.roles?.length > 0 && !selectedRole) {
+        // 默认选中第一个非 super_admin 角色，方便配置
+        const defaultRole = data.roles.find((r) => r.code !== 'super_admin') || data.roles[0];
+        if (defaultRole) {
+          setSelectedRole(defaultRole.code);
+        }
+      }
+    } catch (err) {
+      setError(err instanceof Error ? err.message : '加载失败');
+    } finally {
+      setLoading(false);
+    }
+  }, [selectedRole]);
+
+  useEffect(() => {
+    if (!authLoading && !user) {
+      router.push('/admin/login');
+      return;
+    }
+    if (user) fetchRoles();
+  }, [user, authLoading, router, fetchRoles]);
+
+  const selectedRoleInfo = roles.find((r) => r.code === selectedRole);
+  const isEditable = selectedRoleInfo && selectedRoleInfo.code !== 'super_admin';
+
+  const togglePermission = (modelCode: string, action: PermissionAction) => {
+    if (!isEditable) return;
+    const key = `${selectedRole}:${modelCode}:${action}`;
+    setPermissions((prev) => {
+      const next = new Set(prev);
+      if (next.has(key)) {
+        next.delete(key);
+      } else {
+        next.add(key);
+      }
+      return next;
+    });
+  };
+
+  const hasPermission = (roleCode: string, modelCode: string, action: PermissionAction) => {
+    return permissions.has(`${roleCode}:${modelCode}:${action}`);
+  };
+
+  const handleSave = async () => {
+    if (!isEditable) return;
+    setSaving(true);
+    setError('');
+    try {
+      const rolePerms: Array<{ modelCode: string; action: PermissionAction }> = [];
+      models.forEach((m) => {
+        ACTION_ORDER.forEach((action) => {
+          if (hasPermission(selectedRole, m.code, action)) {
+            rolePerms.push({ modelCode: m.code, action });
+          }
+        });
+      });
+
+      await adminApi.updateRolePermissions(selectedRole, rolePerms);
+      toast.success('权限已保存');
+    } catch (err) {
+      const message = err instanceof Error ? err.message : '保存失败';
+      setError(message);
+      toast.error(message);
+    } finally {
+      setSaving(false);
+    }
+  };
+
+  if (authLoading || (!user && typeof window !== 'undefined')) {
+    return (
+      <div className="flex items-center justify-center h-64">
+        <div className="animate-spin w-8 h-8 border-2 border-gray-900 border-t-transparent rounded-full" />
+      </div>
+    );
+  }
+
+  return (
+    <div className="space-y-6">
+      {/* Header */}
+      <div className="flex items-center justify-between">
+        <div>
+          <h1 className="text-xl font-bold text-gray-900">角色权限</h1>
+          <p className="text-sm text-gray-500 mt-1">按角色配置内容模型的操作权限</p>
+        </div>
+        {isEditable && (
+          <button
+            onClick={handleSave}
+            disabled={saving}
+            className="flex items-center gap-2 bg-gray-900 text-white rounded-lg px-4 py-2 text-sm font-medium hover:bg-gray-800 transition-colors disabled:opacity-60 disabled:cursor-not-allowed"
+          >
+            {saving ? <Loader2 className="w-4 h-4 animate-spin" /> : <Save className="w-4 h-4" />}
+            保存权限
+          </button>
+        )}
+      </div>
+
+      {/* Alerts */}
+      {error && (
+        <div className="bg-red-50 border border-red-200 text-red-700 rounded-lg px-4 py-3 text-sm">
+          {error}
+        </div>
+      )}
+
+      <div className="grid grid-cols-1 lg:grid-cols-4 gap-6">
+        {/* Role list */}
+        <div className="bg-white rounded-lg border border-gray-200 overflow-hidden lg:col-span-1">
+          <div className="px-4 py-3 border-b border-gray-200 bg-gray-50">
+            <h2 className="text-sm font-semibold text-gray-900 flex items-center gap-2">
+              <Shield className="w-4 h-4" />
+              角色列表
+            </h2>
+          </div>
+          <div className="divide-y divide-gray-100">
+            {loading ? (
+              <div className="p-8 flex justify-center">
+                <div className="animate-spin w-6 h-6 border-2 border-gray-300 border-t-gray-900 rounded-full" />
+              </div>
+            ) : roles.length === 0 ? (
+              <div className="p-8 text-center text-sm text-gray-400">暂无角色</div>
+            ) : (
+              roles.map((role) => (
+                <button
+                      key={role.code}
+                      onClick={() => setSelectedRole(role.code)}
+                      className={`w-full text-left px-4 py-3 flex items-center justify-between hover:bg-gray-50 transition-colors ${
+                        selectedRole === role.code ? 'bg-gray-50' : ''
+                      }`}
+                    >
+                  <div>
+                    <p className={`text-sm font-medium ${selectedRole === role.code ? 'text-gray-900' : 'text-gray-700'}`}>
+                      {role.name}
+                    </p>
+                    <p className="text-xs text-gray-400 mt-0.5">{role.code}</p>
+                  </div>
+                  {role.code === 'super_admin' && (
+                    <Lock className="w-4 h-4 text-gray-400" />
+                  )}
+                </button>
+              ))
+            )}
+          </div>
+        </div>
+
+        {/* Permission matrix */}
+        <div className="bg-white rounded-lg border border-gray-200 overflow-hidden lg:col-span-3">
+          <div className="px-4 py-3 border-b border-gray-200 bg-gray-50 flex items-center justify-between">
+            <h2 className="text-sm font-semibold text-gray-900">
+              {selectedRoleInfo ? `${selectedRoleInfo.name} 权限矩阵` : '权限矩阵'}
+            </h2>
+            {selectedRoleInfo?.code === 'super_admin' && (
+              <span className="text-xs text-gray-500 flex items-center gap-1">
+                <Lock className="w-3 h-3" />
+                内置超级管理员拥有所有权限，不可修改
+              </span>
+            )}
+          </div>
+
+          {!selectedRoleInfo || models.length === 0 ? (
+            <div className="p-12 text-center text-sm text-gray-400">暂无数据</div>
+          ) : (
+            <div className="overflow-x-auto">
+              <table className="w-full min-w-[640px]">
+                <thead>
+                  <tr className="border-b border-gray-200">
+                    <th className="text-left px-4 py-3 text-xs font-medium text-gray-500 uppercase sticky left-0 bg-white min-w-[160px]">
+                      内容模型
+                    </th>
+                    {ACTION_ORDER.map((action) => (
+                      <th
+                        key={action}
+                        className="text-center px-2 py-3 text-xs font-medium text-gray-500 uppercase w-[1%] whitespace-nowrap"
+                      >
+                        {ACTION_LABELS[action]}
+                      </th>
+                    ))}
+                  </tr>
+                </thead>
+                <tbody className="divide-y divide-gray-100">
+                  {models.map((model) => (
+                    <tr key={model.code} className="hover:bg-gray-50 transition-colors">
+                      <td className="px-4 py-3 sticky left-0 bg-white">
+                        <p className="text-sm font-medium text-gray-900">{model.name}</p>
+                        <code className="text-xs text-gray-400">{model.code}</code>
+                      </td>
+                      {ACTION_ORDER.map((action) => {
+                        const enabled = hasPermission(selectedRole, model.code, action);
+                        return (
+                          <td key={action} className="px-2 py-3 text-center">
+                            <button
+                              onClick={() => togglePermission(model.code, action)}
+                              disabled={!isEditable}
+                              className={`inline-flex items-center justify-center w-8 h-8 rounded-md transition-colors ${
+                                enabled
+                                  ? 'bg-gray-900 text-white'
+                                  : 'bg-gray-100 text-gray-300'
+                              } ${
+                                isEditable
+                                  ? 'hover:opacity-80 cursor-pointer'
+                                  : 'cursor-not-allowed'
+                              }`}
+                              title={enabled ? '已授权' : '未授权'}
+                            >
+                              {enabled ? <Check className="w-4 h-4" /> : <X className="w-4 h-4" />}
+                            </button>
+                          </td>
+                        );
+                      })}
+                    </tr>
+                  ))}
+                </tbody>
+              </table>
+            </div>
+          )}
+        </div>
+      </div>
+    </div>
+  );
+}
@@ -4,6 +4,7 @@ import { useEffect, useState } from 'react';
 import { useRouter } from 'next/navigation';
 import { useAuth } from '@/components/admin/auth-context';
 import { adminApi } from '@/lib/admin-api';
+import { toast } from '@/components/ui/sonner';
 import { Save } from 'lucide-react';

 interface ZoneItem {
@@ -58,11 +59,13 @@ export default function ZonesPage() {
        settings: editingZone.settings,
      });
      setEditingZone(null);
+      toast.success('页面区域保存成功');
      // 重新加载
      const res = await adminApi.getZones();
      setZones((res as Zone[]) || []);
    } catch (err) {
-      alert(err instanceof Error ? err.message : '保存失败');
+      const message = err instanceof Error ? err.message : '保存失败';
+      toast.error(message);
    } finally {
      setSaving(false);
    }
@@ -0,0 +1,169 @@
+import { describe, it, expect, jest, beforeEach } from '@jest/globals';
+import { NextRequest } from 'next/server';
+
+// ─── Mock @/lib/db ────────────────────────────────────────────────────────
+const mockContentItemFindUnique = jest.fn<(args: unknown) => Promise<unknown | null>>();
+const mockContentItemFindUniqueOrThrow = jest.fn<(args: unknown) => Promise<unknown>>();
+
+jest.mock('@/lib/db', () => ({
+  prisma: {
+    contentItem: {
+      findUnique: mockContentItemFindUnique,
+      findUniqueOrThrow: mockContentItemFindUniqueOrThrow,
+    },
+  },
+}));
+
+// ─── Mock workflow service ────────────────────────────────────────────────
+const mockSubmitForReview = jest.fn<(itemId: string, user: unknown) => Promise<unknown>>();
+const mockApprove = jest.fn<(itemId: string, user: unknown) => Promise<unknown>>();
+const mockReject = jest.fn<(itemId: string, user: unknown, reason?: string) => Promise<unknown>>();
+const mockArchive = jest.fn<(itemId: string, user: unknown) => Promise<unknown>>();
+
+jest.mock('@/lib/cms/workflow', () => ({
+  submitForReview: mockSubmitForReview,
+  approve: mockApprove,
+  reject: mockReject,
+  archive: mockArchive,
+}));
+
+// ─── Mock permissions ─────────────────────────────────────────────────────
+const mockRequirePermission = jest.fn<
+  (request: NextRequest, modelCode: string, action: string) => Promise<unknown>
+>();
+
+jest.mock('@/lib/permissions', () => ({
+  requirePermission: mockRequirePermission,
+}));
+
+jest.unmock('./route');
+
+import { POST } from './route';
+
+function createMockRequest(body: Record<string, unknown>): NextRequest {
+  return {
+    json: async () => body,
+  } as unknown as NextRequest;
+}
+
+function mockAuthorized(action: 'update' | 'publish' = 'update') {
+  mockRequirePermission.mockResolvedValue({
+    user: { userId: 'user-1', username: 'editor', role: action === 'publish' ? 'reviewer' : 'editor' },
+  });
+}
+
+const mockItem = {
+  id: 'item-1',
+  modelId: 'model-1',
+  modelCode: 'news',
+  title: '测试新闻',
+  slug: 'test-news',
+  locale: 'zh-CN',
+  status: 'draft',
+  data: '{}',
+  version: 1,
+  sortOrder: 0,
+  createdBy: 'editor',
+  updatedBy: 'editor',
+  createdAt: new Date('2026-01-01'),
+  updatedAt: new Date('2026-01-01'),
+};
+
+const mockUpdatedItem = { ...mockItem, status: 'review', version: 2 };
+
+beforeEach(() => {
+  jest.clearAllMocks();
+  mockContentItemFindUnique.mockResolvedValue(mockItem);
+  mockContentItemFindUniqueOrThrow.mockResolvedValue(mockUpdatedItem);
+});
+
+describe('POST /api/admin/items/[id]/workflow', () => {
+  it('returns 400 when action is missing', async () => {
+    mockAuthorized();
+    const request = createMockRequest({});
+    const response = await POST(request, { params: Promise.resolve({ id: 'item-1' }) });
+    const body = await response.json();
+
+    expect(response.status).toBe(400);
+    expect(body.error).toBe('缺少 action 参数');
+  });
+
+  it('returns 400 for invalid action', async () => {
+    mockAuthorized();
+    const request = createMockRequest({ action: 'publish' });
+    const response = await POST(request, { params: Promise.resolve({ id: 'item-1' }) });
+    const body = await response.json();
+
+    expect(response.status).toBe(400);
+    expect(body.error).toContain('非法的 action');
+  });
+
+  it('returns 404 when item not found', async () => {
+    mockAuthorized();
+    mockContentItemFindUnique.mockResolvedValue(null);
+    const request = createMockRequest({ action: 'submit' });
+    const response = await POST(request, { params: Promise.resolve({ id: 'missing' }) });
+    const body = await response.json();
+
+    expect(response.status).toBe(404);
+    expect(body.error).toBe('内容不存在');
+  });
+
+  it('submit requires update permission', async () => {
+    mockAuthorized('update');
+    const request = createMockRequest({ action: 'submit' });
+    const response = await POST(request, { params: Promise.resolve({ id: 'item-1' }) });
+
+    expect(response.status).toBe(200);
+    expect(mockSubmitForReview).toHaveBeenCalledWith(
+      'item-1',
+      expect.objectContaining({ username: 'editor' })
+    );
+    expect(mockRequirePermission).toHaveBeenCalledWith(
+      request,
+      'news',
+      'update'
+    );
+  });
+
+  it('approve requires publish permission', async () => {
+    mockAuthorized('publish');
+    const request = createMockRequest({ action: 'approve' });
+    const response = await POST(request, { params: Promise.resolve({ id: 'item-1' }) });
+
+    expect(response.status).toBe(200);
+    expect(mockApprove).toHaveBeenCalledWith(
+      'item-1',
+      expect.objectContaining({ username: 'editor' })
+    );
+    expect(mockRequirePermission).toHaveBeenCalledWith(
+      request,
+      'news',
+      'publish'
+    );
+  });
+
+  it('reject passes reason to workflow service', async () => {
+    mockAuthorized('publish');
+    const request = createMockRequest({ action: 'reject', reason: '需要修改' });
+    const response = await POST(request, { params: Promise.resolve({ id: 'item-1' }) });
+
+    expect(response.status).toBe(200);
+    expect(mockReject).toHaveBeenCalledWith(
+      'item-1',
+      expect.objectContaining({ username: 'editor' }),
+      '需要修改'
+    );
+  });
+
+  it('returns validation error on illegal transition', async () => {
+    mockAuthorized('publish');
+    mockApprove.mockRejectedValue(new Error('当前状态 draft 不允许审核通过'));
+    const request = createMockRequest({ action: 'approve' });
+    const response = await POST(request, { params: Promise.resolve({ id: 'item-1' }) });
+    const body = await response.json();
+
+    expect(response.status).toBe(400);
+    expect(body.error).toBe('当前状态 draft 不允许审核通过');
+  });
+});
@@ -0,0 +1,93 @@
+import { NextRequest } from 'next/server';
+import { prisma } from '@/lib/db';
+import { requirePermission } from '@/lib/permissions';
+import {
+  submitForReview,
+  approve,
+  reject,
+  archive,
+  type WorkflowAction,
+} from '@/lib/cms/workflow';
+import {
+  success,
+  notFound,
+  validationError,
+  internalError,
+  forbidden,
+} from '@/lib/api-response';
+
+function parseItem(item: { data: string; [key: string]: unknown }) {
+  return { ...item, data: JSON.parse(item.data as string) };
+}
+
+interface WorkflowBody {
+  action: WorkflowAction;
+  reason?: string;
+}
+
+const ACTION_PERMISSION: Record<WorkflowAction, 'update' | 'publish'> = {
+  submit: 'update',
+  approve: 'publish',
+  reject: 'publish',
+  archive: 'publish',
+};
+
+export async function POST(
+  request: NextRequest,
+  { params }: { params: Promise<{ id: string }> }
+) {
+  const { id } = await params;
+
+  try {
+    const body = (await request.json()) as WorkflowBody;
+    const { action, reason } = body;
+
+    if (!action) {
+      return validationError('缺少 action 参数');
+    }
+
+    if (!['submit', 'approve', 'reject', 'archive'].includes(action)) {
+      return validationError(`非法的 action: ${action}`);
+    }
+
+    const existing = await prisma.contentItem.findUnique({ where: { id } });
+    if (!existing) return notFound('内容不存在');
+
+    const requiredAction = ACTION_PERMISSION[action];
+    const permission = await requirePermission(request, existing.modelCode, requiredAction);
+    if ('response' in permission) return permission.response;
+
+    const user = { userId: permission.user.userId, username: permission.user.username };
+
+    switch (action) {
+      case 'submit':
+        await submitForReview(id, user);
+        break;
+      case 'approve':
+        await approve(id, user);
+        break;
+      case 'reject':
+        await reject(id, user, reason);
+        break;
+      case 'archive':
+        await archive(id, user);
+        break;
+    }
+
+    return success(parseItem(await prisma.contentItem.findUniqueOrThrow({ where: { id } })));
+  } catch (error) {
+    if (error instanceof Error) {
+      if (error.message.includes('内容不存在')) {
+        return notFound(error.message);
+      }
+      if (error.message.includes('当前状态') || error.message.includes('不允许')) {
+        return validationError(error.message);
+      }
+      if (error.message.includes('无权限')) {
+        return forbidden(error.message);
+      }
+    }
+    console.error('Workflow error:', error);
+    return internalError();
+  }
+}
@@ -0,0 +1,361 @@
+import { describe, it, expect, jest, beforeEach } from '@jest/globals';
+import { NextRequest } from 'next/server';
+
+// ─── Mock @/lib/db ────────────────────────────────────────────────────────
+const mockContentItemFindMany = jest.fn<(args: unknown) => Promise<unknown[]>>();
+const mockContentItemCount = jest.fn<(args: unknown) => Promise<number>>();
+const mockContentItemFindFirst = jest.fn<(args: unknown) => Promise<unknown | null>>();
+const mockContentItemFindUnique = jest.fn<(args: unknown) => Promise<unknown | null>>();
+const mockContentItemCreate = jest.fn<(args: unknown) => Promise<unknown>>();
+const mockContentItemUpdate = jest.fn<(args: unknown) => Promise<unknown>>();
+const mockContentItemDelete = jest.fn<(args: unknown) => Promise<unknown>>();
+const mockAuditLogCreate = jest.fn<(args: unknown) => Promise<unknown>>();
+
+jest.mock('@/lib/db', () => ({
+  prisma: {
+    contentItem: {
+      findMany: mockContentItemFindMany,
+      count: mockContentItemCount,
+      findFirst: mockContentItemFindFirst,
+      findUnique: mockContentItemFindUnique,
+      create: mockContentItemCreate,
+      update: mockContentItemUpdate,
+      delete: mockContentItemDelete,
+    },
+    auditLog: {
+      create: mockAuditLogCreate,
+    },
+  },
+}));
+
+// ─── Mock permissions ─────────────────────────────────────────────────────
+const mockRequirePermission = jest.fn<
+  (request: NextRequest, modelCode: string, action: string) => Promise<unknown>
+>();
+
+jest.mock('@/lib/permissions', () => ({
+  requirePermission: mockRequirePermission,
+}));
+
+jest.unmock('./route');
+
+import { GET, POST, PUT, DELETE } from './route';
+
+function createMockRequest(options: {
+  url?: string;
+  json?: () => Promise<Record<string, unknown>>;
+}): NextRequest {
+  return {
+    url: options.url || 'http://localhost/api/admin/items',
+    json: options.json || (async () => ({})),
+  } as unknown as NextRequest;
+}
+
+function mockAuthorized() {
+  mockRequirePermission.mockResolvedValue({
+    user: { userId: 'user-1', username: 'editor', role: 'content_editor' },
+  });
+}
+
+function mockUnauthorized() {
+  mockRequirePermission.mockResolvedValue({
+    response: new Response(JSON.stringify({ error: '未授权' }), { status: 401 }),
+  });
+}
+
+function mockForbidden() {
+  mockRequirePermission.mockResolvedValue({
+    response: new Response(JSON.stringify({ error: '无权限' }), { status: 403 }),
+  });
+}
+
+const mockItem = {
+  id: 'item-1',
+  modelId: 'model-1',
+  modelCode: 'news',
+  title: '测试新闻',
+  slug: 'test-news',
+  locale: 'zh-CN',
+  status: 'draft',
+  data: JSON.stringify({ body: 'hello' }),
+  version: 1,
+  sortOrder: 0,
+  createdBy: 'editor',
+  updatedBy: 'editor',
+  createdAt: new Date('2026-01-01'),
+  updatedAt: new Date('2026-01-01'),
+  publishedAt: null,
+};
+
+beforeEach(() => {
+  jest.clearAllMocks();
+  mockContentItemFindMany.mockResolvedValue([mockItem]);
+  mockContentItemCount.mockResolvedValue(1);
+  mockContentItemFindFirst.mockResolvedValue(null);
+  mockContentItemFindUnique.mockResolvedValue(mockItem);
+  mockContentItemCreate.mockResolvedValue(mockItem);
+  mockContentItemUpdate.mockResolvedValue(mockItem);
+  mockContentItemDelete.mockResolvedValue(undefined);
+  mockAuditLogCreate.mockResolvedValue({ id: 'log-1' });
+});
+
+describe('/api/admin/items', () => {
+  describe('GET', () => {
+    it('returns 401 when not authenticated', async () => {
+      mockUnauthorized();
+      const response = await GET(createMockRequest({}));
+      expect(response.status).toBe(401);
+    });
+
+    it('returns 403 when authenticated but unauthorized', async () => {
+      mockForbidden();
+      const response = await GET(createMockRequest({}));
+      expect(response.status).toBe(403);
+    });
+
+    it('returns paginated item list', async () => {
+      mockAuthorized();
+      const response = await GET(createMockRequest({ url: 'http://localhost/api/admin/items?page=1&pageSize=10' }));
+      const body = await response.json();
+
+      expect(response.status).toBe(200);
+      expect(body.items).toHaveLength(1);
+      expect(body.total).toBe(1);
+      expect(body.page).toBe(1);
+      expect(body.totalPages).toBe(1);
+      expect(body.items[0]).toMatchObject({
+        id: 'item-1',
+        title: '测试新闻',
+        data: { body: 'hello' },
+      });
+    });
+
+    it('filters by modelCode and status', async () => {
+      mockAuthorized();
+      await GET(createMockRequest({ url: 'http://localhost/api/admin/items?modelCode=news&status=published' }));
+
+      expect(mockContentItemFindMany).toHaveBeenCalledWith(
+        expect.objectContaining({
+          where: { modelCode: 'news', status: 'published' },
+        })
+      );
+      expect(mockRequirePermission).toHaveBeenCalledWith(
+        expect.anything(),
+        'news',
+        'read'
+      );
+    });
+
+    it('applies search filter', async () => {
+      mockAuthorized();
+      await GET(createMockRequest({ url: 'http://localhost/api/admin/items?search=测试' }));
+
+      expect(mockContentItemFindMany).toHaveBeenCalledWith(
+        expect.objectContaining({
+          where: expect.objectContaining({
+            OR: [
+              { title: { contains: '测试' } },
+              { slug: { contains: '测试' } },
+            ],
+          }),
+        })
+      );
+    });
+  });
+
+  describe('POST', () => {
+    it('returns 401 when not authenticated', async () => {
+      mockUnauthorized();
+      const response = await POST(createMockRequest({
+        json: async () => ({ modelId: 'model-1', modelCode: 'news', title: '新闻' }),
+      }));
+      expect(response.status).toBe(401);
+    });
+
+    it('returns 400 when required fields missing', async () => {
+      mockAuthorized();
+      const response = await POST(createMockRequest({ json: async () => ({ title: '仅标题' }) }));
+      const body = await response.json();
+
+      expect(response.status).toBe(400);
+      expect(body.error).toContain('缺少必填字段');
+    });
+
+    it('returns 400 when slug already exists', async () => {
+      mockAuthorized();
+      mockContentItemFindFirst.mockResolvedValue({ id: 'other', slug: 'test-news' });
+
+      const response = await POST(createMockRequest({
+        json: async () => ({
+          modelId: 'model-1',
+          modelCode: 'news',
+          title: '新新闻',
+          slug: 'test-news',
+        }),
+      }));
+      const body = await response.json();
+
+      expect(response.status).toBe(400);
+      expect(body.error).toContain('已存在');
+    });
+
+    it('creates item and audit log', async () => {
+      mockAuthorized();
+      const response = await POST(createMockRequest({
+        json: async () => ({
+          modelId: 'model-1',
+          modelCode: 'news',
+          title: '新新闻',
+          slug: 'new-news',
+          data: { body: 'content' },
+          status: 'published',
+          sortOrder: 1,
+        }),
+      }));
+      const body = await response.json();
+
+      expect(response.status).toBe(201);
+      expect(body.title).toBe('测试新闻');
+      expect(mockContentItemCreate).toHaveBeenCalledWith(
+        expect.objectContaining({
+          data: expect.objectContaining({
+            modelId: 'model-1',
+            modelCode: 'news',
+            title: '新新闻',
+            slug: 'new-news',
+            status: 'published',
+            sortOrder: 1,
+            publishedAt: expect.any(Date),
+          }),
+        })
+      );
+      expect(mockAuditLogCreate).toHaveBeenCalledWith(
+        expect.objectContaining({
+          data: expect.objectContaining({
+            module: 'item',
+            action: 'create',
+            operator: 'editor',
+          }),
+        })
+      );
+    });
+  });
+
+  describe('PUT', () => {
+    it('returns 400 when id missing', async () => {
+      mockAuthorized();
+      const response = await PUT(createMockRequest({ url: 'http://localhost/api/admin/items', json: async () => ({}) }));
+      const body = await response.json();
+
+      expect(response.status).toBe(400);
+      expect(body.error).toBe('缺少 ID');
+    });
+
+    it('returns 404 when item not found', async () => {
+      mockAuthorized();
+      mockContentItemFindUnique.mockResolvedValue(null);
+      const response = await PUT(createMockRequest({
+        url: 'http://localhost/api/admin/items?id=missing',
+        json: async () => ({ title: '更新' }),
+      }));
+
+      expect(response.status).toBe(404);
+    });
+
+    it('rejects status update through PUT', async () => {
+      mockAuthorized();
+      const response = await PUT(createMockRequest({
+        url: 'http://localhost/api/admin/items?id=item-1',
+        json: async () => ({ status: 'published' }),
+      }));
+      const body = await response.json();
+
+      expect(response.status).toBe(400);
+      expect(body.error).toContain('状态变更');
+    });
+
+    it('returns 400 when slug duplicated', async () => {
+      mockAuthorized();
+      mockContentItemFindFirst.mockResolvedValue({ id: 'other', slug: 'duplicated' });
+
+      const response = await PUT(createMockRequest({
+        url: 'http://localhost/api/admin/items?id=item-1',
+        json: async () => ({ slug: 'duplicated' }),
+      }));
+      const body = await response.json();
+
+      expect(response.status).toBe(400);
+      expect(body.error).toContain('已存在');
+    });
+
+    it('updates item and increments version', async () => {
+      mockAuthorized();
+      const response = await PUT(createMockRequest({
+        url: 'http://localhost/api/admin/items?id=item-1',
+        json: async () => ({ title: '更新标题', data: { body: 'new' }, sortOrder: 2 }),
+      }));
+      await response.json();
+
+      expect(response.status).toBe(200);
+      expect(mockContentItemUpdate).toHaveBeenCalledWith(
+        expect.objectContaining({
+          where: { id: 'item-1' },
+          data: expect.objectContaining({
+            title: '更新标题',
+            data: JSON.stringify({ body: 'new' }),
+            sortOrder: 2,
+            version: { increment: 1 },
+            updatedBy: 'editor',
+          }),
+        })
+      );
+      expect(mockAuditLogCreate).toHaveBeenCalledWith(
+        expect.objectContaining({
+          data: expect.objectContaining({
+            module: 'item',
+            action: 'update',
+            operator: 'editor',
+          }),
+        })
+      );
+    });
+  });
+
+  describe('DELETE', () => {
+    it('returns 400 when id missing', async () => {
+      mockAuthorized();
+      const response = await DELETE(createMockRequest({ url: 'http://localhost/api/admin/items' }));
+      const body = await response.json();
+
+      expect(response.status).toBe(400);
+      expect(body.error).toBe('缺少 ID');
+    });
+
+    it('returns 404 when item not found', async () => {
+      mockAuthorized();
+      mockContentItemFindUnique.mockResolvedValue(null);
+      const response = await DELETE(createMockRequest({ url: 'http://localhost/api/admin/items?id=missing' }));
+
+      expect(response.status).toBe(404);
+    });
+
+    it('deletes item and audit log', async () => {
+      mockAuthorized();
+      const response = await DELETE(createMockRequest({ url: 'http://localhost/api/admin/items?id=item-1' }));
+      const body = await response.json();
+
+      expect(response.status).toBe(200);
+      expect(body.message).toBe('删除成功');
+      expect(mockContentItemDelete).toHaveBeenCalledWith({ where: { id: 'item-1' } });
+      expect(mockAuditLogCreate).toHaveBeenCalledWith(
+        expect.objectContaining({
+          data: expect.objectContaining({
+            module: 'item',
+            action: 'delete',
+            operator: 'editor',
+          }),
+        })
+      );
+    });
+  });
+});
@@ -1,9 +1,8 @@
 import { NextRequest } from 'next/server';
 import { prisma } from '@/lib/db';
-import { authenticateRequest } from '@/lib/auth';
+import { requirePermission } from '@/lib/permissions';
 import {
  success,
-  unauthorized,
  notFound,
  validationError,
  internalError,
@@ -13,14 +12,49 @@ function parseItem(item: { data: string; [key: string]: unknown }) {
  return { ...item, data: JSON.parse(item.data as string) };
 }

+/**
+ * 生成 URL 友好的唯一 slug。
+ * 优先基于标题生成；若标题无法提取有效字符，则回退到 modelCode + 时间戳。
+ * 末尾追加时间戳 + 随机后缀以保证唯一性，避免并发或重复标题导致冲突。
+ */
+function generateSlug(modelCode: string, title: string): string {
+  const base = title
+    .toLowerCase()
+    .replace(/[^a-z0-9\u4e00-\u9fa5]+/g, '-')
+    .replace(/^-+|-+$/g, '')
+    .slice(0, 50);
+  const suffix = `${Date.now()}-${Math.random().toString(36).slice(2, 8)}`;
+  return base ? `${base}-${suffix}` : `${modelCode}-${suffix}`;
+}
+
+async function ensureUniqueSlug(
+  modelCode: string,
+  title: string,
+  excludeId?: string
+): Promise<string> {
+  let slug = generateSlug(modelCode, title);
+  let attempts = 0;
+  while (attempts < 5) {
+    const existing = await prisma.contentItem.findFirst({
+      where: { modelCode, slug, ...(excludeId ? { id: { not: excludeId } } : {}) },
+    });
+    if (!existing) return slug;
+    slug = generateSlug(modelCode, `${title}-${Math.random().toString(36).slice(2, 6)}`);
+    attempts++;
+  }
+  return slug;
+}
+
 // GET /api/admin/items - 获取内容列表
 export async function GET(request: NextRequest) {
-  const payload = authenticateRequest(request);
-  if (!payload) return unauthorized();
+  const { searchParams } = new URL(request.url);
+  const modelCode = searchParams.get('modelCode');
+
+  const permissionModelCode = modelCode || 'content-item';
+  const permission = await requirePermission(request, permissionModelCode, 'read');
+  if ('response' in permission) return permission.response;

  try {
-    const { searchParams } = new URL(request.url);
-    const modelCode = searchParams.get('modelCode');
    const status = searchParams.get('status');
    const search = searchParams.get('search');
    const page = parseInt(searchParams.get('page') || '1');
@@ -61,9 +95,6 @@ export async function GET(request: NextRequest) {

 // POST /api/admin/items - 创建内容
 export async function POST(request: NextRequest) {
-  const payload = authenticateRequest(request);
-  if (!payload) return unauthorized();
-
  try {
    const body = await request.json();
    const { modelId, modelCode, title, slug, data, status, sortOrder } = body;
@@ -72,7 +103,14 @@ export async function POST(request: NextRequest) {
      return validationError('缺少必填字段：modelId, modelCode, title');
    }

-    // 检查 slug 唯一性
+    const permission = await requirePermission(request, modelCode, 'create');
+    if ('response' in permission) return permission.response;
+
+    // 未提供 slug 时自动生成唯一 slug；提供时检查唯一性
+    const finalSlug = slug
+      ? slug
+      : await ensureUniqueSlug(modelCode, title);
+
    if (slug) {
      const existing = await prisma.contentItem.findFirst({
        where: { modelCode, slug },
@@ -87,12 +125,12 @@ export async function POST(request: NextRequest) {
        modelId,
        modelCode,
        title,
-        slug: slug || '',
+        slug: finalSlug,
        status: status || 'draft',
        data: JSON.stringify(data || {}),
        sortOrder: sortOrder || 0,
-        createdBy: payload.username,
-        updatedBy: payload.username,
+        createdBy: permission.user.username,
+        updatedBy: permission.user.username,
        publishedAt: status === 'published' ? new Date() : null,
      },
    });
@@ -103,7 +141,7 @@ export async function POST(request: NextRequest) {
        module: 'item',
        targetId: item.id,
        action: 'create',
-        operator: payload.username,
+        operator: permission.user.username,
        afterData: JSON.stringify(item),
      },
    });
@@ -117,17 +155,17 @@ export async function POST(request: NextRequest) {

 // PUT /api/admin/items/[id] - 更新内容
 export async function PUT(request: NextRequest) {
-  const payload = authenticateRequest(request);
-  if (!payload) return unauthorized();
+  const { searchParams } = new URL(request.url);
+  const id = searchParams.get('id');
+  if (!id) return validationError('缺少 ID');
+
+  const existing = await prisma.contentItem.findUnique({ where: { id } });
+  if (!existing) return notFound('内容不存在');
+
+  const permission = await requirePermission(request, existing.modelCode, 'update');
+  if ('response' in permission) return permission.response;

  try {
-    const { searchParams } = new URL(request.url);
-    const id = searchParams.get('id');
-    if (!id) return validationError('缺少 ID');
-
-    const existing = await prisma.contentItem.findUnique({ where: { id } });
-    if (!existing) return notFound('内容不存在');
-
    const body = await request.json();
    const { title, slug, data, status, sortOrder } = body;

@@ -141,19 +179,21 @@ export async function PUT(request: NextRequest) {
      }
    }

+    // 状态流转必须通过 /api/admin/items/[id]/workflow 进行
+    if (status !== undefined) {
+      return validationError('状态变更请使用 /api/admin/items/[id]/workflow 接口');
+    }
+
    const updateData: Record<string, unknown> = {
-      updatedBy: payload.username,
+      updatedBy: permission.user.username,
      updatedAt: new Date(),
+      // 任何内容更新都视为新版本
+      version: { increment: 1 },
    };
    if (title !== undefined) updateData.title = title;
-    if (slug !== undefined) updateData.slug = slug;
+    // slug 为空字符串时保留原值，避免触发唯一约束冲突
+    if (slug !== undefined && slug !== '') updateData.slug = slug;
    if (data !== undefined) updateData.data = JSON.stringify(data);
-    if (status !== undefined) {
-      updateData.status = status;
-      if (status === 'published' && existing.status !== 'published') {
-        updateData.publishedAt = new Date();
-      }
-    }
    if (sortOrder !== undefined) updateData.sortOrder = sortOrder;

    const item = await prisma.contentItem.update({
@@ -167,7 +207,7 @@ export async function PUT(request: NextRequest) {
        module: 'item',
        targetId: id,
        action: 'update',
-        operator: payload.username,
+        operator: permission.user.username,
        beforeData: JSON.stringify(existing),
        afterData: JSON.stringify(item),
      },
@@ -182,17 +222,17 @@ export async function PUT(request: NextRequest) {

 // DELETE /api/admin/items/[id] - 删除内容
 export async function DELETE(request: NextRequest) {
-  const payload = authenticateRequest(request);
-  if (!payload) return unauthorized();
+  const { searchParams } = new URL(request.url);
+  const id = searchParams.get('id');
+  if (!id) return validationError('缺少 ID');
+
+  const existing = await prisma.contentItem.findUnique({ where: { id } });
+  if (!existing) return notFound('内容不存在');
+
+  const permission = await requirePermission(request, existing.modelCode, 'delete');
+  if ('response' in permission) return permission.response;

  try {
-    const { searchParams } = new URL(request.url);
-    const id = searchParams.get('id');
-    if (!id) return validationError('缺少 ID');
-
-    const existing = await prisma.contentItem.findUnique({ where: { id } });
-    if (!existing) return notFound('内容不存在');
-
    await prisma.contentItem.delete({ where: { id } });

    await prisma.auditLog.create({
@@ -200,7 +240,7 @@ export async function DELETE(request: NextRequest) {
        module: 'item',
        targetId: id,
        action: 'delete',
-        operator: payload.username,
+        operator: permission.user.username,
        beforeData: JSON.stringify(existing),
      },
    });
@@ -15,8 +15,14 @@ const LEGACY_CONSENT_KEY = 'ga_consent';

 let hasConsentBeenHandled = false;

+function isAdminRoute(): boolean {
+  if (typeof window === 'undefined') {return false;}
+  return window.location.pathname.startsWith('/admin');
+}
+
 function getInitialShowConsent(): boolean {
  if (typeof window === 'undefined') {return false;}
+  if (isAdminRoute()) {return false;}
  if (hasConsentBeenHandled) {return false;}
  const stored = getStoredPreferences();
  if (stored) {return false;}
@@ -36,6 +42,11 @@ export function CookieConsent() {
    if (consentCheckedRef.current) {return;}
    consentCheckedRef.current = true;

+    if (isAdminRoute()) {
+      hasConsentBeenHandled = true;
+      return;
+    }
+
    const stored = getStoredPreferences();
    if (stored) {
      hasConsentBeenHandled = true;
@@ -265,6 +276,7 @@ export function CookieConsent() {
 export function CookieSettingsButton() {
  const [isVisible] = useState(() => {
    if (typeof window === 'undefined') {return false;}
+    if (isAdminRoute()) {return false;}
    return !!getStoredPreferences();
  });

@@ -13,7 +13,8 @@ class AdminApiClient {
    options: RequestInit & { encrypt?: boolean } = {},
  ): Promise<T> {
    const token = this.getToken();
-    const shouldEncrypt = options.encrypt !== false && token;
+    // 当前服务端 API 未实现请求体解密，默认不加密；如需加密，调用方显式传入 encrypt: true。
+    const shouldEncrypt = options.encrypt === true && token;

    const headers: Record<string, string> = {
      ...(options.headers as Record<string, string>),
@@ -173,6 +174,21 @@ class AdminApiClient {
      zones: Array.isArray(zones) ? zones.length : 0,
    };
  }
+
+  async getRoles() {
+    return this.request<{
+      roles: Array<{ code: string; name: string; builtin: boolean }>;
+      permissions: Array<{ roleCode: string; modelCode: string; action: string }>;
+      models: Array<{ code: string; name: string }>;
+    }>('/api/admin/roles');
+  }
+
+  async updateRolePermissions(roleCode: string, permissions: Array<{ modelCode: string; action: string }>) {
+    return this.request<{ roleCode: string; permissions: string[] }>('/api/admin/roles', {
+      method: 'PUT',
+      body: JSON.stringify({ roleCode, permissions }),
+    });
+  }
 }

 export const adminApi = new AdminApiClient();
@@ -2,11 +2,19 @@ import jwt from 'jsonwebtoken';
 import bcrypt from 'bcryptjs';
 import { type NextRequest } from 'next/server';

-const JWT_SECRET = process.env.JWT_SECRET || 'novalon-cms-secret-key-2024';
-const JWT_REFRESH_SECRET = process.env.JWT_REFRESH_SECRET || 'novalon-cms-refresh-secret-2024';
+const JWT_SECRET = process.env.JWT_SECRET;
+const JWT_REFRESH_SECRET = process.env.JWT_REFRESH_SECRET;
 const TOKEN_EXPIRY = '24h';
 const REFRESH_TOKEN_EXPIRY = '7d';

+if (!JWT_SECRET || !JWT_REFRESH_SECRET) {
+  throw new Error(
+    'JWT_SECRET and JWT_REFRESH_SECRET must be set in environment variables. ' +
+    'Do not run the application with default or empty secrets.'
+  );
+}
+
+
 export interface JwtPayload {
  userId: string;
  username: string;
@@ -26,17 +34,17 @@ export async function verifyPassword(password: string, hash: string): Promise<bo
 // ============ Token 工具 ============

 export function generateTokens(payload: JwtPayload): { accessToken: string; refreshToken: string } {
-  const accessToken = jwt.sign(payload, JWT_SECRET, { expiresIn: TOKEN_EXPIRY });
-  const refreshToken = jwt.sign(payload, JWT_REFRESH_SECRET, { expiresIn: REFRESH_TOKEN_EXPIRY });
+  const accessToken = jwt.sign(payload, JWT_SECRET!, { expiresIn: TOKEN_EXPIRY });
+  const refreshToken = jwt.sign(payload, JWT_REFRESH_SECRET!, { expiresIn: REFRESH_TOKEN_EXPIRY });
  return { accessToken, refreshToken };
 }

 export function verifyAccessToken(token: string): JwtPayload {
-  return jwt.verify(token, JWT_SECRET) as JwtPayload;
+  return jwt.verify(token, JWT_SECRET!) as JwtPayload;
 }

 export function verifyRefreshToken(token: string): JwtPayload {
-  return jwt.verify(token, JWT_REFRESH_SECRET) as JwtPayload;
+  return jwt.verify(token, JWT_REFRESH_SECRET!) as JwtPayload;
 }

 // ============ 请求认证 ============
@@ -61,24 +69,27 @@ export function authenticateRequest(request: NextRequest): JwtPayload | null {

 // ============ Cookie 工具 ============

-export function setTokenCookie(response: Response, accessToken: string, refreshToken: string): void {
-  response.headers.set(
-    'Set-Cookie',
-    `novalon_token=${accessToken}; Path=/; HttpOnly; SameSite=Lax; Max-Age=86400`
-  );
-  response.headers.append(
-    'Set-Cookie',
-    `novalon_refresh=${refreshToken}; Path=/; HttpOnly; SameSite=Lax; Max-Age=604800`
-  );
+function buildCookie(name: string, value: string, maxAge: number, secure = false): string {
+  const secureFlag = secure ? '; Secure' : '';
+  return `${name}=${value}; Path=/; HttpOnly; SameSite=Lax${secureFlag}; Max-Age=${maxAge}`;
 }

-export function clearTokenCookie(response: Response): void {
-  response.headers.set(
-    'Set-Cookie',
-    `novalon_token=; Path=/; HttpOnly; SameSite=Lax; Max-Age=0`
-  );
-  response.headers.append(
-    'Set-Cookie',
-    `novalon_refresh=; Path=/; HttpOnly; SameSite=Lax; Max-Age=0`
-  );
+/**
+ * 设置认证 cookie。
+ * @param secure 是否添加 Secure 标志。应根据当前请求协议决定（https 为 true），
+ *               避免在本地 http 预览/开发环境设置 Secure 导致浏览器拒绝保存 cookie。
+ */
+export function setTokenCookie(
+  response: Response,
+  accessToken: string,
+  refreshToken: string,
+  secure = false,
+): void {
+  response.headers.set('Set-Cookie', buildCookie('novalon_token', accessToken, 86400, secure));
+  response.headers.append('Set-Cookie', buildCookie('novalon_refresh', refreshToken, 604800, secure));
+}
+
+export function clearTokenCookie(response: Response, secure = false): void {
+  response.headers.set('Set-Cookie', buildCookie('novalon_token', '', 0, secure));
+  response.headers.append('Set-Cookie', buildCookie('novalon_refresh', '', 0, secure));
 }
@@ -1,17 +1,98 @@
 import { NextRequest, NextResponse } from 'next/server';

-export function middleware(request: NextRequest) {
+interface JwtPayload {
+  userId: string;
+  username: string;
+  role: string;
+  exp?: number;
+}
+
+// ============ Edge-compatible JWT 验证 ============
+// Next.js Middleware 运行在 Edge Runtime，不能依赖 jsonwebtoken 的 Node crypto。
+// 这里使用 Web Crypto API 实现 HS256 签名验证，与 API 路由中的 jsonwebtoken 共享同一密钥。
+
+function base64urlToBuffer(value: string): Uint8Array {
+  const base64 = value.replace(/-/g, '+').replace(/_/g, '/').padEnd(value.length + ((4 - (value.length % 4)) % 4), '=');
+  const binary = atob(base64);
+  const bytes = new Uint8Array(binary.length);
+  for (let i = 0; i < binary.length; i++) {
+    bytes[i] = binary.charCodeAt(i);
+  }
+  return bytes;
+}
+
+function bufferToBase64url(buffer: ArrayBuffer): string {
+  const bytes = new Uint8Array(buffer);
+  let binary = '';
+  for (let i = 0; i < bytes.byteLength; i++) {
+    binary += String.fromCharCode(bytes[i]!);
+  }
+  return btoa(binary).replace(/\+/g, '-').replace(/\//g, '_').replace(/=+$/, '');
+}
+
+async function verifyAccessTokenEdge(token: string): Promise<JwtPayload> {
+  const secret = process.env.JWT_SECRET;
+  if (!secret) {
+    throw new Error('JWT_SECRET is not configured');
+  }
+
+  const [headerB64, payloadB64, signatureB64] = token.split('.');
+  if (!headerB64 || !payloadB64 || !signatureB64) {
+    throw new Error('Malformed token');
+  }
+
+  const encoder = new TextEncoder();
+  const key = await crypto.subtle.importKey(
+    'raw',
+    encoder.encode(secret),
+    { name: 'HMAC', hash: 'SHA-256' },
+    false,
+    ['sign'],
+  );
+
+  const signature = await crypto.subtle.sign('HMAC', key, encoder.encode(`${headerB64}.${payloadB64}`));
+  const expectedSignature = bufferToBase64url(signature);
+
+  if (expectedSignature !== signatureB64) {
+    throw new Error('Invalid token signature');
+  }
+
+  const payload = JSON.parse(new TextDecoder().decode(base64urlToBuffer(payloadB64))) as JwtPayload & { exp?: number };
+  if (payload.exp && payload.exp * 1000 < Date.now()) {
+    throw new Error('Token expired');
+  }
+
+  return payload;
+}
+
+// ============ Middleware ============
+
+function redirectToLogin(request: NextRequest, pathname: string): NextResponse {
+  const loginUrl = new URL('/admin/login', request.url);
+  loginUrl.searchParams.set('redirect', pathname);
+  return NextResponse.redirect(loginUrl);
+}
+
+export async function middleware(request: NextRequest) {
  const { pathname } = request.nextUrl;

  // 只处理 /admin 路由（除了登录页和 API 路由）
  if (pathname.startsWith('/admin') && !pathname.startsWith('/admin/login') && !pathname.startsWith('/api/')) {
    const token = request.cookies.get('novalon_token')?.value;
    const authHeader = request.headers.get('authorization');
+    const bearerToken = authHeader?.startsWith('Bearer ') ? authHeader.slice(7) : null;
+    const accessToken = token || bearerToken;

-    // 如果 cookie 和 header 都没有 token，重定向到登录页
-    if (!token && !authHeader) {
-      // 允许客户端组件处理认证（因为 AuthProvider 在客户端也会检查 localStorage）
-      return NextResponse.next();
+    // 未提供令牌时重定向到登录页
+    if (!accessToken) {
+      return redirectToLogin(request, pathname);
+    }
+
+    // 验证令牌有效性
+    try {
+      await verifyAccessTokenEdge(accessToken);
+    } catch {
+      return redirectToLogin(request, pathname);
    }
  }

@@ -20,4 +101,4 @@ export function middleware(request: NextRequest) {

 export const config = {
  matcher: ['/admin/:path*'],
-};
+};