c2f2fed82c7fe37d85dac5fc1e716c80ac4ea9ef
加班记录: - 加班人默认回显当前用户且不可改 - 列表加创建日期列 - 移除编辑功能(创建即提交,仅可删除) - 提交时校验结束>开始 版本列表: - 移除顶部 9 个状态 tab + 表格状态列 - 仅保留搜索、项目、优先级筛选 项目列表: - 行内显示进度未达 100% 的版本(与版本页同源算法) - 新增 lib/version-progress.ts 抽出公共进度计算 角色权限: - RoleItem 加 permissions 字段 - 新建 lib/permissions.ts: 14 组 37 个权限点 + 默认 5 角色映射 + hasPermission - 角色表单内嵌权限矩阵(主模块 4 件套 + Tab 二档 + Bug Tab 4 档)+ 全选/反选/仅查看快捷 - 新建 components/auth/Guard.tsx: RouteGuard + PermissionGuard + useHasPermission + AccessDenied - Sidebar 菜单按 view 权限过滤 - 7 个主路由(products/projects/versions/requirements/overtime/admin/members/roles)包 RouteGuard - 版本详情 Tab 按 view 权限过滤,自动跳转到第一个有权限的 Tab - 默认未登录/无角色按只读最严格 - 超管 role-admin: ['*'] 通配符,permissions 不可改 通用: - 新建 components/FieldError.tsx 统一表单错误文案 - PlanTab 提交时校验结束>开始 Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
FTB 项目管理系统
基于 Next.js + NestJS 的项目管理系统,包含产品管理、项目管理、版本管理、需求管理、加班记录、成员/角色管理等模块。
环境要求
| 工具 | 版本 | 说明 |
|---|---|---|
| Node.js | >= 18.x | 推荐 20.x LTS |
| pnpm | >= 9.4.0 | 包管理器 |
| Git | >= 2.x | 版本控制 |
后端(可选)还需要 PostgreSQL >= 15 和 Redis >= 7,目前前端独立运行不依赖后端。
安装 Node.js 和 pnpm
# Windows - 下载安装包
# https://nodejs.org/en/download
# 安装 pnpm
npm install -g pnpm@9.4.0
快速开始
# 1. 克隆项目
git clone https://github.com/chengnianbai/ftb-project-management.git
cd ftb-project-management
# 2. 安装依赖
pnpm install
# 3. 启动前端开发服务器
cd apps/web
npx next dev -p 3000
# 4. 打开浏览器
# http://localhost:3000
项目结构
ftb-project-management/
├── apps/
│ ├── web/ # 前端 (Next.js 14 + React 18)
│ │ ├── app/ # 页面路由
│ │ │ ├── products/ # 产品管理
│ │ │ ├── projects/ # 项目管理
│ │ │ ├── versions/ # 版本管理
│ │ │ ├── requirements/ # 需求管理
│ │ │ ├── overtime/ # 加班记录
│ │ │ └── admin/ # 管理(成员/角色)
│ │ ├── components/ # 通用组件
│ │ ├── stores/ # Zustand 状态管理
│ │ └── lib/ # 类型定义/工具函数
│ └── server/ # 后端 (NestJS 10, 暂未启用)
│ ├── src/
│ └── prisma/ # 数据库 Schema
├── packages/
│ └── shared/ # 共享类型
├── package.json # Monorepo 根配置
├── pnpm-workspace.yaml # pnpm workspace
└── turbo.json # Turborepo 配置
技术栈
前端
- Next.js 14 (App Router)
- React 18
- TypeScript 5.5
- Tailwind CSS
- Zustand (状态管理)
- Lucide React (图标)
后端(暂未启用)
- NestJS 10
- Prisma (ORM)
- PostgreSQL
工程化
- pnpm workspace (Monorepo)
- Turborepo (任务编排)
功能模块
| 模块 | 路径 | 状态 |
|---|---|---|
| 产品管理 | /products | 已完成 |
| 项目管理 | /projects | 已完成 |
| 版本管理 | /versions | 已完成 |
| 需求管理 | /requirements | 已完成 |
| 加班记录 | /overtime | 已完成 |
| 成员管理 | /admin/members | 已完成 |
| 角色管理 | /admin/roles | 已完成 |
数据存储
当前阶段所有数据存储在浏览器 localStorage 中(Mock 模式),无需数据库即可体验完整功能。后续接入后端 API 后切换为数据库持久化。
常用命令
# 前端开发
cd apps/web && npx next dev -p 3000
# TypeScript 类型检查
cd apps/web && npx tsc --noEmit
# 全量构建
pnpm build
后端启动(可选)
如果需要启动后端 API:
# 1. 安装 PostgreSQL 并创建数据库
createdb ftb_pm
# 2. 配置环境变量
cd apps/server
cp .env.example .env
# 编辑 .env 设置 DATABASE_URL
# 3. 初始化数据库
npx prisma migrate dev
# 4. 启动
npm run dev
# 后端运行在 http://localhost:3001
Description
Languages
TypeScript
95.5%
JavaScript
4.4%