Admin New (F006)

重构后的管理后台 — 替代老的 renren-cloud-admin,渐进式双前端策略。

外网访问 (W5.x.x+3.5):

• 主入口 (frp): http://direv.cloud:8080/admin/ (快 2-60x vs Tailscale)
• 备用 (Tailscale): http://100.111.84.16:3000/admin/
• 详细: 项目根目录 FRP-接入快速参考.md

任何架构变更必须先看 ARCHITECTURE.md 再改代码。

启动

# 安装依赖
npm install

# Dev (端口 3001,proxy /api 到 gateway:8080)
npm run dev

# Build
npm run build

# Type check
npm run type-check

访问:

• Dev: http://localhost:3001/admin/
• Prod: http://100.111.84.16:3000/admin/(待 nginx 配置)

4 套主题

切主题:顶栏"主题"按钮,或登录页底部 4 个色点。

主题	主色	触发
科技蓝(默认)	#2563EB	data-theme="tech-blue"
中国红	#DC2626	data-theme="red"
Notion 紫	#5645D4	data-theme="purple"
暗夜黑	#0F172A	data-theme="dark"

新增主题:改 src/theme/themes.scss + src/theme/presets.ts 两处即可。

当前进度 (W1 D1 末)

• 项目骨架(Vite + Vue 3 + TS + Pinia + Element Plus)
• 4 套主题系统(tokens + themes + presets)
• ThemePicker 顶栏组件
• AppLayout 主布局(顶栏 + 侧边栏 + 内容区)
• LoginView 登录页(渐变 + 主题切换)
• DashboardView 数据看板(mock 数据)
• Vite proxy /api → gateway:8080
• D2: 登录接真实 OAuth2(axios + 路由守卫) — 明日
• D3: 菜单从后端拉
• D4: 看板接真实 API
• D5: nginx 部署到 /admin/

目录结构(按 ARCHITECTURE.md)

src/
├── theme/         # 主题系统(独立子模块)
├── layout/        # 布局(AppLayout 已迁移至 components/AppLayout)
├── modules/       # 业务模块(每个独立)
│   ├── auth/      # 登录
│   └── dashboard/ # 数据看板
├── components/    # 跨模块组件
│   ├── AppLayout/
│   └── ThemePicker/
├── stores/        # Pinia (theme/user/menu)
├── api/           # HTTP 封装(W2 接入)
├── router/        # 路由 + 守卫
├── composables/   # 可复用逻辑(预留)
├── directives/    # 全局指令(预留)
├── styles/        # 全局样式
└── utils/         # 工具函数