freedakgmail
53 lines
1.9 KiB
Markdown
53 lines
1.9 KiB
Markdown
# 医科高校 AI 学习中心 · 前端（三端）
|
||
|
||
基于 Next.js 14（App Router）+ TypeScript + Tailwind CSS 的三端前端，与 NestJS 后端真实联调。
|
||
|
||
## 三端
|
||
|
||
- 学生端 `/student`：学习空间、能力画像、职业规划、课程对练、临床对话对练、研究资料查询、AI 协同训练
|
||
- 导师端 `/mentor`：题目审核、成果点评、带教学生画像
|
||
- 管理端 `/admin`：技能治理、权限与合规
|
||
|
||
登录后按账号角色自动进入对应工作台；`AppShell` 做角色访问守卫，跨角色访问会被拦截。
|
||
|
||
## 与后端联调
|
||
|
||
- 所有请求走 `/api/*`，由 `next.config.mjs` 的 rewrites 代理到后端（默认 `http://localhost:3000`），避免浏览器跨域。
|
||
- 鉴权：登录/注册成功后将 JWT 存入 `localStorage`，后续请求自动附加 `Authorization: Bearer <token>`。
|
||
- 错误：后端统一错误体（`AppError.toJSON()`）由 `ApiError` 承载，UI 展示 `message`。
|
||
|
||
可用环境变量 `BACKEND_URL` 覆盖后端地址（如部署时）。
|
||
|
||
## 本地运行
|
||
|
||
```bash
|
||
# 1) 先启动后端（仓库根目录）
|
||
npm run start:dev # 监听 3000，需 .env 中 DB_ENABLED 与 PostgreSQL（可选）
|
||
|
||
# 2) 启动前端（frontend 目录）
|
||
cd frontend
|
||
npm install
|
||
npm run dev # 监听 4000
|
||
```
|
||
|
||
打开 http://localhost:4000 ，注册一个账号（可选角色：学生 / 导师 / 管理员）后即可进入对应工作台。
|
||
|
||
## 构建
|
||
|
||
```bash
|
||
npm run build && npm run start
|
||
```
|
||
|
||
## 目录
|
||
|
||
```
|
||
src/
|
||
app/ # App Router 页面（login / student / mentor / admin）
|
||
components/ # AppShell（外壳+守卫）与基础 UI 组件
|
||
lib/
|
||
api.ts # fetch 封装：鉴权头、错误解析（ApiError）
|
||
auth-context.tsx # 登录态上下文（login/register/logout/me）
|
||
services.ts # 按后端模块组织的 API 服务函数
|
||
types.ts # 与后端对齐的类型与枚举
|
||
```
|