feat(cms): 添加 CMS 内容管理系统与 Admin 管理后台

- 新增 Prisma + SQLite 数据库模型 (Category, Content, Media, User 等) - 新增 Admin 管理后台 (认证、内容管理、媒体管理) - 新增 CMS API 路由 (CRUD, 草稿/发布, 重新验证) - 新增 CMS 内容版本的历史归档页面 - 新增 components/cms 内容渲染组件 - 新增 components/admin 管理后台 UI 组件 - 更新 Contact API 路由
2026-07-07 06:53:58 +08:00
parent 829d83522c
commit b5245f9aa2
87 changed files with 25659 additions and 0 deletions
@@ -0,0 +1,93 @@
+'use client';
+
+import { useEffect, useState } from 'react';
+import { useRouter } from 'next/navigation';
+import { useAuth } from '@/components/admin/auth-context';
+import { adminApi } from '@/lib/admin-api';
+import { FileText, Briefcase, Box, Layers, Image, BarChart3, Newspaper, Settings } from 'lucide-react';
+
+const modelCards = [
+  { code: 'news', name: '新闻资讯', icon: Newspaper, color: 'bg-blue-50 text-blue-600' },
+  { code: 'case-study', name: '案例研究', icon: Briefcase, color: 'bg-amber-50 text-amber-600' },
+  { code: 'service', name: '服务管理', icon: Settings, color: 'bg-green-50 text-green-600' },
+  { code: 'product', name: '产品管理', icon: Box, color: 'bg-purple-50 text-purple-600' },
+  { code: 'solution', name: '解决方案', icon: Layers, color: 'bg-teal-50 text-teal-600' },
+  { code: 'hero-banner', name: 'Hero Banner', icon: Image, color: 'bg-rose-50 text-rose-600' },
+  { code: 'stat-item', name: '数据指标', icon: BarChart3, color: 'bg-indigo-50 text-indigo-600' },
+];
+
+export default function AdminDashboardPage() {
+  const { user, loading } = useAuth();
+  const router = useRouter();
+  const [stats, setStats] = useState({ models: 0, items: 0, zones: 0 });
+  const [fetching, setFetching] = useState(true);
+
+  useEffect(() => {
+    if (!loading && !user) {
+      router.push('/admin/login');
+      return;
+    }
+    if (user) {
+      adminApi.getStats().then((s) => setStats(s)).catch(console.error).finally(() => setFetching(false));
+    }
+  }, [user, loading, router]);
+
+  if (loading || (!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">
+      <div>
+        <h1 className="text-xl font-bold text-gray-900">仪表盘</h1>
+        <p className="text-sm text-gray-500 mt-1">欢迎回来，{user?.nickname || user?.username}</p>
+      </div>
+
+      {/* Stats */}
+      <div className="grid grid-cols-1 sm:grid-cols-3 gap-4">
+        {[
+          { label: '内容模型', value: stats.models, icon: FileText },
+          { label: '内容条目', value: stats.items, icon: Layers },
+          { label: '页面区域', value: stats.zones, icon: Briefcase },
+        ].map((stat) => (
+          <div key={stat.label} className="bg-white rounded-lg border border-gray-200 p-4">
+            <div className="flex items-center justify-between">
+              <div>
+                <p className="text-sm text-gray-500">{stat.label}</p>
+                <p className="text-2xl font-bold text-gray-900 mt-1">
+                  {fetching ? '-' : stat.value}
+                </p>
+              </div>
+              <div className="w-10 h-10 rounded-lg bg-gray-100 flex items-center justify-center">
+                <stat.icon className="w-5 h-5 text-gray-600" />
+              </div>
+            </div>
+          </div>
+        ))}
+      </div>
+
+      {/* Quick links */}
+      <div className="bg-white rounded-lg border border-gray-200 p-6">
+        <h2 className="text-sm font-semibold text-gray-900 mb-4">内容管理</h2>
+        <div className="grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-3">
+          {modelCards.map((card) => (
+            <button
+              key={card.code}
+              onClick={() => router.push(`/admin/content/${card.code}`)}
+              className="flex flex-col items-center gap-2 p-4 rounded-lg border border-gray-200 hover:border-gray-300 hover:bg-gray-50 transition-colors text-center"
+            >
+              <div className={`w-10 h-10 rounded-lg ${card.color} flex items-center justify-center`}>
+                <card.icon className="w-5 h-5" />
+              </div>
+              <span className="text-xs font-medium text-gray-700">{card.name}</span>
+            </button>
+          ))}
+        </div>
+      </div>
+    </div>
+  );
+}