需求变更:Web 服务端不再使用 Docker,改为直接运行在 Linux 上的网站。 - 移除 deploy/docker-compose.yml、web-server/Dockerfile、 web-server/admin/Dockerfile、web-server/.dockerignore - 新增 deploy/install.sh:建服务用户与目录 → 装运行期依赖 → 迁移 → 注册 systemd 服务 → 配置 nginx 站点 → 健康检查,一键完成 - 新增 deploy/systemd/opendance-api.service:ProtectSystem=strict 等 安全加固,ReadWritePaths 限定为上传目录 - 新增 deploy/nginx/opendance.conf:同站点托管管理端静态资源 + 反代 /api /health /static,client_max_body_size 512m,SPA 回退 - 新增 deploy/uninstall.sh:默认保留数据,--purge 才删除 - 新增配置项 HOST(AppConfig.bindHost):原生部署下 Node 只监听 127.0.0.1,不直接对外暴露,实测外部 IP 不可达 - 同步更新 contracts/rest-api.yaml、DSH.md、project.yaml、README.txt、 tasks/008、tasks/010 与发布打包脚本
1.8 KiB
1.8 KiB
T-WEB-008 歌曲管理界面
- 状态:done
- 依赖:T-WEB-003
目标
React 管理端的歌曲管理页面:列表、检索、新建/编辑、音频上传与试听、删除。
load
DSH.md
contracts/rest-api.yaml # 锚点:#/paths/~1api~1songs、#/components/schemas/Song
contracts/data-models.md # 锚点:§2 Song
web-server/admin/src/**
web-server/admin/package.json
交付物
web-server/admin/(React 18 + Vite + TypeScript):
| 路径 | 说明 |
|---|---|
src/pages/SongsPage.tsx |
歌曲列表 + 分页 + 检索(q / status / artist) |
src/components/SongForm* |
新建/编辑表单,含来源五元组 |
src/api/client.ts |
fetch 封装;非 2xx 抛 ApiError,兼容 Nest 的 message: string[] |
src/api/types.ts |
与契约对齐的 TypeScript 类型 |
src/styles.css |
无 UI 框架,纯 CSS |
页面能力
- 分页表格 + 关键词/状态/歌手过滤
- 新建与编辑:曲名、歌手、专辑、语言、时长(秒输入 → 毫秒提交)、BPM、 难度 1–5、标签(逗号分隔)、状态、来源五元组
- 音频上传(
POST /api/songs/:id/audio,字段名file)与<audio controls>试听 - 删除需二次确认(软删除)
- 客户端校验:曲名/歌手与来源五项必填,
sourceUrl必须以http开头 - 加载中 / 空列表 / 请求失败三态均有明确反馈,绝不出现白屏
验收
cd web-server/admin
npm run build # tsc -b && vite build 必须成功
构建与运行
- 开发:
npm run dev(5173,/api与/health代理到localhost:3000) - 生产:
npm run build产物由 nginx 直接托管在同一站点的根路径下,/api反代到本机 Node 进程(见deploy/nginx/opendance.conf) VITE_API_BASE可覆盖 API 基地址;留空表示同源