Neo
b25308c3f4
## P1 数据库基础 - zqyy_app: 创建 auth/biz schema、FDW 连接 etl_feiqiu - etl_feiqiu: 创建 app schema RLS 视图、商品库存预警表 - 清理 assistant_abolish 残留数据 ## P2 ETL/DWS 扩展 - 新增 DWS 助教订单贡献度表 (dws.assistant_order_contribution) - 新增 assistant_order_contribution_task 任务及 RLS 视图 - member_consumption 增加充值字段、assistant_daily 增加处罚字段 - 更新 ODS/DWD/DWS 任务文档及业务规则文档 - 更新 consistency_checker、flow_runner、task_registry 等核心模块 ## P3 小程序鉴权系统 - 新增 xcx_auth 路由/schema（微信登录 + JWT） - 新增 wechat/role/matching/application 服务层 - zqyy_app 鉴权表迁移 + 角色权限种子数据 - auth/dependencies.py 支持小程序 JWT 鉴权 ## 文档与审计 - 新增 DOCUMENTATION-MAP 文档导航 - 新增 7 份 BD_Manual 数据库变更文档 - 更新 DDL 基线快照（etl_feiqiu 6 schema + zqyy_app auth） - 新增全栈集成审计记录、部署检查清单更新 - 新增 BACKLOG 路线图、FDW→Core 迁移计划 ## Kiro 工程化 - 新增 5 个 Spec（P1/P2/P3/全栈集成/核心业务） - 新增审计自动化脚本（agent_on_stop/build_audit_context/compliance_prescan） - 新增 6 个 Hook（合规检查/会话日志/提交审计等） - 新增 doc-map steering 文件 ## 运维与测试 - 新增 ops 脚本：迁移验证/API 健康检查/ETL 监控/集成报告 - 新增属性测试：test_dws_contribution / test_auth_system - 清理过期 export 报告文件 - 更新 .gitignore 排除规则
156 lines
5.4 KiB
Markdown
156 lines
5.4 KiB
Markdown
# apps/admin-web — 管理后台
|
||
|
||
基于 React + Vite + Ant Design 构建的 ETL 管理后台，提供任务管理、调度配置、数据查看、ETL 监控和运维控制功能。
|
||
|
||
## 技术栈
|
||
|
||
- React 19 + TypeScript
|
||
- Vite 6（构建工具）
|
||
- Ant Design 5（UI 组件库）
|
||
- Zustand 5（状态管理）
|
||
- React Router DOM 7（路由）
|
||
- Axios（HTTP 客户端）
|
||
- Day.js（日期处理）
|
||
|
||
## 目录结构
|
||
|
||
```
|
||
apps/admin-web/
|
||
├── src/
|
||
│ ├── App.tsx # 主布局 + 路由配置 + 路由守卫
|
||
│ ├── main.tsx # 应用入口
|
||
│ ├── pages/ # 8 个功能页面
|
||
│ │ ├── Login.tsx # 登录页
|
||
│ │ ├── TaskConfig.tsx # 任务配置（Flow 选择 + 任务勾选 + 参数设置）
|
||
│ │ ├── TaskManager.tsx # 任务管理（队列 + 执行历史 + 实时日志）
|
||
│ │ ├── ETLStatus.tsx # ETL 状态（游标监控 + 最近执行）
|
||
│ │ ├── DBViewer.tsx # 数据库查看器（Schema/表/列浏览 + SQL 执行）
|
||
│ │ ├── LogViewer.tsx # 日志查看器
|
||
│ │ ├── EnvConfig.tsx # 环境配置管理
|
||
│ │ └── OpsPanel.tsx # 运维面板（服务启停 + Git + 系统监控）
|
||
│ ├── components/ # 可复用组件
|
||
│ │ ├── DwdTableSelector.tsx # DWD 表选择器
|
||
│ │ ├── ErrorBoundary.tsx # 错误边界
|
||
│ │ ├── LogStream.tsx # 实时日志流组件
|
||
│ │ ├── ScheduleTab.tsx # 调度配置标签页
|
||
│ │ └── TaskSelector.tsx # 任务选择器
|
||
│ ├── api/ # API 调用层
|
||
│ │ ├── client.ts # Axios 实例（baseURL + JWT 拦截器）
|
||
│ │ ├── tasks.ts # 任务配置 API
|
||
│ │ ├── execution.ts # 任务执行 API
|
||
│ │ ├── schedules.ts # 调度管理 API
|
||
│ │ ├── etlStatus.ts # ETL 状态 API
|
||
│ │ ├── dbViewer.ts # 数据库查看器 API
|
||
│ │ ├── envConfig.ts # 环境配置 API
|
||
│ │ └── opsPanel.ts # 运维面板 API
|
||
│ ├── store/
|
||
│ │ └── authStore.ts # Zustand 认证状态（JWT 持久化 + hydrate）
|
||
│ └── types/ # TypeScript 类型定义
|
||
├── index.html # HTML 入口
|
||
├── vite.config.ts # Vite 配置
|
||
├── tsconfig.json # TypeScript 配置
|
||
└── package.json # 依赖声明
|
||
```
|
||
|
||
## 启动
|
||
|
||
```bash
|
||
cd apps/admin-web
|
||
pnpm install
|
||
pnpm dev # 启动开发服务器（默认 http://localhost:5173）
|
||
pnpm build # 生产构建
|
||
pnpm preview # 预览生产构建
|
||
```
|
||
|
||
## 页面功能
|
||
|
||
### 登录页 (`/login`)
|
||
用户名密码登录，JWT 令牌存储在 localStorage，通过 Zustand `authStore` 管理。
|
||
|
||
### 任务配置 (`/`)
|
||
ETL 任务的核心配置界面：
|
||
- 选择执行流程（7 种 Flow）
|
||
- 勾选要执行的任务（按业务域分组）
|
||
- 设置处理模式（增量/校验/全窗口）
|
||
- 配置时间窗口参数
|
||
- 实时预览生成的 CLI 命令
|
||
- 一键执行或加入队列
|
||
|
||
### 任务管理 (`/task-manager`)
|
||
- 查看执行队列（拖拽排序、删除、取消）
|
||
- 执行历史列表（状态、耗时、退出码）
|
||
- 实时日志流（WebSocket 推送）
|
||
|
||
### ETL 状态 (`/etl-status`)
|
||
- 各 ODS 表的数据游标（最后抓取时间、记录数）
|
||
- 最近 50 条执行记录
|
||
|
||
### 数据库查看器 (`/db-viewer`)
|
||
- 浏览 ETL 数据库 Schema → 表 → 列结构
|
||
- 执行只读 SQL 查询（带安全限制）
|
||
- 结果表格展示
|
||
|
||
### 日志查看器 (`/log-viewer`)
|
||
查看历史执行的完整日志输出。
|
||
|
||
### 环境配置 (`/env-config`)
|
||
查看和编辑根 `.env` 文件中的配置项（敏感值脱敏显示）。
|
||
|
||
### 运维面板 (`/ops-panel`)
|
||
- 服务状态监控（test/prod 环境的 PID、内存、CPU）
|
||
- 服务启停控制（启动/停止/重启）
|
||
- Git 状态查看和 pull 操作
|
||
- 依赖同步（`uv sync`）
|
||
- 系统资源概况（CPU、内存、磁盘）
|
||
|
||
## 认证与路由守卫
|
||
|
||
- 所有功能页面通过 `PrivateRoute` 组件保护
|
||
- 未登录自动重定向到 `/login`
|
||
- JWT 令牌通过 Axios 拦截器自动附加到请求头
|
||
- 应用启动时通过 `hydrate()` 从 localStorage 恢复认证状态
|
||
|
||
## API 层
|
||
|
||
`src/api/client.ts` 创建 Axios 实例，配置：
|
||
- `baseURL`：默认 `http://localhost:8000`
|
||
- 请求拦截器：自动附加 `Authorization: Bearer <token>`
|
||
- 响应拦截器：401 时自动清除认证状态并跳转登录
|
||
|
||
各 API 模块对应后端路由，提供类型安全的调用接口。
|
||
|
||
## 状态管理
|
||
|
||
使用 Zustand 管理全局认证状态：
|
||
- `isAuthenticated`：是否已登录
|
||
- `token` / `refreshToken`：JWT 令牌
|
||
- `login()` / `logout()` / `hydrate()`：状态操作
|
||
|
||
## 与后端的关系
|
||
|
||
管理后台通过 REST API 与 `apps/backend/` 通信：
|
||
- 开发环境：Vite 代理到 `http://localhost:8000`
|
||
- 生产环境：通过 `CORS_ORIGINS` 配置跨域
|
||
|
||
## 依赖
|
||
|
||
```json
|
||
{
|
||
"react": "^19.1.0",
|
||
"react-dom": "^19.1.0",
|
||
"react-router-dom": "^7.6.1",
|
||
"antd": "^5.24.7",
|
||
"axios": "^1.9.0",
|
||
"zustand": "^5.0.5",
|
||
"dayjs": "^1.11.19"
|
||
}
|
||
```
|
||
|
||
## Roadmap
|
||
|
||
- [ ] 用户申请审批界面（对接 `/api/xcx-auth` 审批端点）
|
||
- [ ] 数据看板页面（助教业绩、财务日报、客户分析）
|
||
- [ ] 权限管理界面（角色/权限配置）
|
||
- [ ] 暗色主题支持
|
||
- [ ] 国际化（i18n）
|