🏅 第三十届田径运动会管理系统

澳门濠江中学 · 全流程数位化管理平台

🌟 项目缘起

澳门濠江中学每年举办田径运动会，涉及数十个比赛项目、数百名参赛学生、繁复的报名审核和赛程编排。传统纸笔方式效率低、易出错。本系统将运动会筹备全流程数位化，涵盖在线报名、赛程编排、成绩管理、公告通知等功能。

✨ 核心功能

🏠 首页大屏

开幕倒计时：精确到秒，目标时间 2026年10月22日 8:00，独立于后端 API 自主运行
数据看板：参赛人数、项目总量、报名人次、成绩条数实时展示，数字滚动动画
赛事总览：三个信息卡片并列——赛事列表、最新公告、最新成绩
风景视差：自然山脉背景图，background-attachment: fixed 营造深度感
右侧边栏：报名须知、快捷入口、数据摘要

🏃 赛事项目管理

20 个比赛项目覆盖田径运动会全部常规赛事：

类别	项目	数量
径赛	100米、200米、400米、800米、1500米	5项
田赛	跳远、跳高、实心球、垒球	4项
接力	4×100米接力、4×400米接力、课程接力	3项
集体	拔河、广播体操、集体跳绳等	3项
其他	跨栏、三级跳远等	5项

每个项目支持配置：ABCDE五组 × 男女分组 × 人数上限 × 比赛规则 × 场地分配。

📝 在线报名

性别智能匹配：系统根据项目性别限制（男子/女子/混合）自动过滤可选项目
报名上限保护：每人限报 3 个项目，超出提示
重复检测：同一项目不可重复报名
审核流程：提交 → 管理员审核 → 通过/驳回 → 站内通知
状态追踪：学生端实时查看报名状态（待审核/已通过/已驳回）

📅 赛程编排（双模式）

智能编排模式：

根据报名人数、场地容量、时间窗口三维度自动生成赛程
自动检测场地冲突、时间重叠
一键生成完整赛程表

手动精调模式：

支持逐条修改时间、场地、场次顺序
保存时自动冲突检测
发布后即时推送至所有学生端

🏆 成绩管理

双通道录入：手动逐条输入 + Excel 批量导入
自动排名：径赛按时间升序，田赛按成绩降序，支持并列处理
奖项自动匹配：
- 一等奖（前 15%）
- 二等奖（15%-30%）
- 三等奖（30%-50%）
- 优秀奖（50%-100%）
成绩公示：三级逐层展开 —— 组别(A/B/C/D/E) → 性别(男/女) → 项目
数据导出：Excel (.xlsx) / CSV 格式

📊 数据统计

班级排名：按获奖数量降序排列
年级对比：各年级参赛率、获奖率对比
项目分布：环形图展示径赛/田赛/接力/集体分布
报名热度：各项目报名人数柱状图
可视化图表：Chart.js 驱动，支持柱状图、环形图、饼图
报表导出：所有统计均支持 Excel/CSV 导出

📢 公告通知

分类标签：赛事公告 · 报名通知 · 成绩发布 · 紧急通知
置顶功能：重要公告始终显示在列表顶部
弹窗查看：点击弹出完整内容，支持已读跟踪
自动推送：管理员关键操作（审核报名、发布赛程、公示成绩）自动触发通知

通知触发机制：

管理员操作	通知对象
发布/编辑赛事	所有学生
审核报名（通过/驳回）	对应学生
发布赛程	所有参赛学生
发布成绩	所有学生

🗣️ 交流论坛

发帖：富文本编辑器（加粗/斜体/列表/链接），分类选择，标签系统
图片上传：支持拖拽/点击上传，最多 5 张，JPG/PNG/GIF/WebP，单张 ≤10MB
图片审核：学生上传图片需管理员审核后公开显示；管理员上传直接通过
图片查看：点击图片全屏灯箱，黑色半透明背景，支持 ESC 关闭
附件上传：支持文件附件，最多 4 个
回覆审核：学生回覆需管理员审核后方可公开
社交互动：点赞（收藏）、举报、浏览计数
管理功能：删帖、删回覆、审核回覆、审核/驳回/删除图片

🤖 AI 智能助手「小濠」

基于 DeepSeek V4 Flash 大语言模型，注入濠江中学完整知识库：

知识注入：建校历史、校训、师资、设施、历届运动会佳绩
实时数据：当前报名人数、待审核数量、已发布赛程等
上下文记忆：每用户独立会话历史，支持多轮追问
全领域问答：赛事咨询、成绩查询、编程帮助、数学计算
亲切风格：支持粤语口语 + emoji，如同与学长学姐对话

🔍 全站搜索

全场景覆盖：用户、赛事、公告、成绩、帖子、精彩瞬间
高级筛选：院系/班级、参赛项目、年级、日期范围
搜索历史：本地存储最近搜索关键词
快捷建议：输入时即时显示搜索建议

👥 好友系统

好友申请：发送/接收/同意/拒绝全流程
备注名：支持设置好友备注
状态追踪：在线状态、好友关系状态

👤 用户管理

8 位管理员：1 超级管理员 + 7 管理员，权限矩阵控制
批量导入：Excel 导入学生账号，自动生成统一格式邮箱
角色权限：学生/管理员/超级管理员三级，精确到操作级别
头像上传：支持文件选择与剪贴板粘贴（80×80 压缩）

🎨 设计风格

整体采用濠江中学校徽的红色主调（#A80000），深灰辅色，金色点缀。布局为左主右辅不对称双栏结构。直角边框取代圆角，呼应运动竞技的硬朗感。

🔧 技术架构

五层架构

┌─────────────────────────────────────────────┐
│  前端展示层                                   │
│  HTML5 · CSS3 · Vanilla JS · Chart.js        │
│  ScrollReveal · Font Awesome · SheetJS       │
├─────────────────────────────────────────────┤
│  后端服务层                                   │
│  Node.js · Express 4.x · JWT · bcryptjs      │
│  Multer · Helmet · Rate Limit · SVG Captcha  │
├─────────────────────────────────────────────┤
│  数据持久层                                   │
│  SQL.js (SQLite) · 即时持久化 · 14张表        │
│  参数化查询 · 事务支持                         │
├─────────────────────────────────────────────┤
│  AI 能力层                                    │
│  DeepSeek V4 Flash · Web Audio API            │
│  知识库注入 · 上下文记忆                        │
├─────────────────────────────────────────────┤
│  部署运维层                                   │
│  GitHub · Ngrok · Railway · 本地 Node.js      │
│  跨平台 (Windows / macOS / Linux)             │
└─────────────────────────────────────────────┘

核心依赖

包名	用途
express	Web 框架
sql.js	浏览器端 SQLite 引擎
jsonwebtoken	JWT 令牌签发与验证
bcryptjs	密码哈希（10轮加盐）

☁️ 云数据库

已提供本地 SQLite 到云端 PostgreSQL 的迁移脚本
已提供云端连通性检查脚本与 JSON 备份脚本
已提供服务启动时的本地数据库自动快照备份
详细步骤见 docs/cloud-database.md | multer | 文件上传（头像/论坛图片/附件） | | helmet | HTTP 安全头 | | express-rate-limit | API 速率限制 | | svg-captcha | 图形验证码生成 | | xlsx | Excel 导入导出 |

🗄️ 数据库设计

14 张核心数据表，覆盖全业务流程：

表名	说明	关键字段
users	用户表（636条）	id, username, password, realname, role, grade, class, gender, avatar
events	赛事项目表（20条）	id, name, category, group, gender, max_participants, rules
registrations	报名记录表（1884条）	id, user_id, event_id, status (pending/approved/rejected)
results	成绩表（1884条）	id, user_id, event_id, result_value, rank, award_level
schedules	赛程表（20条）	id, event_id, date, time, venue, checkin_time, status
announcements	公告表	id, title, content, category, is_pinned
forum_posts	论坛帖子表	id, user_id, title, content, images, image_status, tags, category
forum_replies	论坛回覆表	id, post_id, user_id, content, status
forum_likes	点赞表	id, post_id, user_id
forum_favorites	收藏表	id, post_id, user_id
forum_reports	举报表	id, post_id, user_id, reason
admin_logs	操作日志表	id, admin_id, action, target, detail
notifications	通知表	id, user_id, title, content, is_read
settings	系统配置表	id, key, value

🔒 安全体系

七层纵深防护，层层递进：

层级	机制	说明
第1层	Helmet 安全头	11个HTTP安全响应头：XSS防护、点击劫持防护、MIME嗅探防护
第2层	速率限制	全站 500次/15分钟；登录 8次/15分钟；超限返回 429
第3层	JWT 认证	24小时过期，每个API请求携带令牌验证身份与角色
第4层	Bcrypt 密码哈希	10轮加盐哈希，5次错误锁定30分钟
第5层	SVG 验证码	5分钟有效期，随机生成图形验证码
第6层	数据库安全	禁止URL访问，参数化查询防注入，.env 不纳入版本控制
第7层	审计日志	管理员全操作记录，精确追溯操作人/时间/内容

角色权限矩阵

权限	学生	管理员	超级管理员
浏览赛事/成绩/赛程	✓	✓	✓
在线报名参赛	✓	✗	✗
论坛发帖/回覆	✓	✓	✓
发布公告	✗	✓	✓
管理赛事/赛程	✗	✓	✓
录入/编辑成绩	✗	✓	✓
用户管理/权限分配	✗	✗	✓
系统配置/日志审计	✗	✗	✓

🎮 交互设计

8 项典藏级交互效果：

效果	实现方式	说明
✨ 流光按钮	CSS @keyframes + transform	hover 白色光条扫过 + 弹性缩放
🎴 3D 透视卡片	mousemove → perspective rotateX/Y	鼠标跟踪旋转 ±12°
📜 滚动揭幕	Intersection Observer + stagger	元素入视口时淡入上移
🎯 自定义光标	SVG cursor + JS 位置跟踪	磁性跟随 + hover 放大
📊 数字滚动	requestAnimationFrame + easeOutBounce	从0滚至目标值
🎵 背景音乐	双通道（AudioElement + Web Audio API）	Passion原声 + 合成降级
🌊 涟漪按钮	mousedown → radial gradient spread	点击水波纹扩散
🔄 下拉刷新	touch 事件 + 指示器动画	全页面支持

📂 项目结构

sports-meet/
├── server.js                   # Express 入口（CSP/Helmet/CORS/限流/静态服务）
├── package.json                # 项目配置与依赖
├── database/
│   ├── init.js                 # SQLite 初始化 + 14张表 + 种子数据（628学生/20项目/1884报名/1884成绩）
│   └── sports_meet.db          # SQLite 数据库文件（即时持久化）
├── middleware/
│   └── auth.js                 # JWT 认证中间件 + 角色权限校验
├── utils/
│   └── notify.js               # 站内通知推送工具
├── routes/
│   ├── auth.js                 # 登录/注册/验证码/密码重置/快捷登录
│   ├── public.js               # 公共API（赛事查询/成绩公示/公告浏览）
│   ├── admin.js                # 管理员API（仪表盘/用户/赛事/报名/赛程/成绩/公告/日志）
│   ├── student.js              # 学生API（报名/个人中心/通知/头像/成绩/赛程）
│   └── forum.js                # 论坛API（帖子/回覆/点赞/收藏/举报/审核）+ AI助手路由
├── public/
│   ├── index.html              # SPA 主页面
│   ├── css/
│   │   └── style.css           # 全局样式（~1160行，响应式，3D效果，灯箱）
│   ├── js/
│   │   ├── app.js              # 路由导航/弹窗/Toast/搜索/好友/倒计时/下拉刷新
│   │   ├── api.js              # API 封装层（认证/公共/管理/学生/论坛/AI）
│   │   ├── auth.js             # 登录注册交互
│   │   ├── admin.js            # 管理后台（8个功能标签）
│   │   ├── student.js          # 学生个人中心
│   │   ├── forum.js            # 论坛前端 + 图片上传预览 + 全屏灯箱 + AI聊天
│   │   └── interactions.js     # ScrollReveal/自定义光标/回顶/计数器/涟漪
│   └── uploads/
│       ├── avatars/            # 用户头像
│       └── forum/              # 论坛上传图片
├── ppt_v2.js                   # PPT 生成脚本 v2（10页）
├── ppt_v3.js                   # PPT 生成脚本 v3（31页 Google 风格）
└── README.md

🚀 快速开始

# 克隆仓库
git clone https://github.com/linjie20091027-a11y/sports-meet.git
cd sports-meet

# 安装依赖
npm install

# 启动服务器
node server.js

浏览器访问 http://localhost:3000

默认账号

⚠️ 安全警告：以下为开发演示账号，密码已在 README 公开。部署到生产环境前，务必修改所有默认密码！

角色	邮箱	密码
超级管理员	admin@hkms.hktedu.com	admin123
管理员	系统管理员@hkms.hktedu.com 等	admin123
学生	学号@hkms.hktedu.com（628 个）	123456

管理后台

登录管理员账号后，在导航栏点击「管理后台」进入，包含 8 个功能标签：

仪表盘 — 实时数据概览
用户管理 — 学生/管理员增删改查
赛事管理 — 20个项目维护
报名管理 — 审核/驳回/批量操作
赛程编排 — 智能+手动双模式
成绩录入 — 手动+Excel批量导入
公告通知 — 分类/置顶/发布
操作日志 — 全操作审计

📈 数据统计

指标	数值
参赛学生	628 人
班级数量	61 个
年级范围	初一至高三（ABCDE五组）
比赛项目	20 个
报名记录	1,884 条
成绩数据	1,884 条
管理员	8 人
数据库表	14 张
API 端点	100+ 个
CSS 代码	~1160 行
JS 代码	~6000+ 行

📋 开发历程

v3.x（当前版本）

✅ 论坛图片上传 + 管理员审核/删除
✅ 图片全屏灯箱查看
✅ 下拉刷新（全站）
✅ 回复区紧凑化（可滚动）
✅ 弹窗内容滚动（不遮挡按钮）
✅ PPT v3（31页 Google 发布会风格）

v2.x

✅ 全站搜索（用户/赛事/公告/成绩/帖子）
✅ 好友系统（申请/同意/拒绝/备注）
✅ 论坛点赞/收藏/举报
✅ 论坛回覆审核
✅ 管理后台论坛管理
✅ 通知详情与附件
✅ AI 助手「小濠」
✅ 背景音乐双通道
✅ 3D 透视卡片

v1.x

✅ 基础架构：Express + SQL.js
✅ 用户认证：JWT + bcrypt + 验证码
✅ 管理员后台（8模块）
✅ 学生门户（报名/成绩/赛程）
✅ 成绩三级展开
✅ 公告弹窗查看
✅ Excel 导入导出
✅ 安全防护（7层）

v4.x（最新开发版）

✅ 🤖 AI 智能内容审核系统 — 双重引擎护航
- DeepSeek V4 Pro：论坛文字自动审核，检测辱骂、色情、广告、霸凌、隐私泄露
- 豆包 (Volcengine Ark)：精彩瞬间 + 论坛图片自动审核，识别低俗/暴力/广告二维码
- 管理端开关控制，审核结果实时推送到 AI 审核日志页面
- 违规内容自动标记待审核/已驳回，AI 通过则自动过审
✅ 📸 精彩瞬间 6 格轮播：前 5 格 4 秒自动轮播，第 6 格一键多图上传（最多 9 张）
✅ 🔐 权限修复：误设 admin 的学生账号已恢复 student 角色，API Key 仅限管理员设置
✅ 📋 AI 审核日志页面：管理端新增独立标签页，按时间线展示所有审核记录
- 文字审核：发帖人姓名 + 帖子内容 + AI 判定 + 违规原因
- 图片审核：上传者姓名 + 图片预览 + 豆包审核结果
✅ 📄 赛程 PDF 导出：AI 智能编排后一键生成 A4 横向 PDF（pdfkit）
✅ 🎨 顶部导航栏优化：标题永不换行 + 三级响应式 + Admin 权限修复

👥 贡献者

GitHub	提交	角色	核心贡献领域
linjie20091027-a11y	100	项目创始人 · 全栈架构师	系统架构搭建、AI 审核双引擎（DeepSeek + 豆包）、首页精彩瞬间 6 格轮播、论坛系统、典藏交互效果（3D 卡片/光标/涟漪/滚动揭幕）、管理后台 11 模块、Docker/PM2/Nginx 部署运维、635 名用户种子数据
whe047319-tech	43	前端交互 · 数据可视化	报名流程审核链路、数据统计环形图/热度图、论坛 AI 审核接入、年级班级弹窗管理、校徽更换、导航栏优化、检录提醒、通知系统修复
ljingxi154-code	34	后端开发 · 数据架构	奖项名称全栈重命名+数据迁移、成绩 ABCDE 五组冠军展示、性别报名限制校验、首页三区重构（赛事/公告/冠军卡片）、搜索功能重构、精彩瞬间轮播、interactions.js/css 缓存修复
noah200910070082-dotcom	26	全栈开发 · 云端架构	教师端 workspace + workflow、云数据库迁移工具包、统一用户权限体系（UAP）、全场景搜索升级、好友系统、运动组排序统一

📊 206+ commits · 4 位核心开发者 · 100+ API 端点 · 14 张数据表 · 32 个源文件 · 3,000+ 行 JS

⚠️ 已知技术债

项	说明	优先级
sql.js → better-sqlite3	当前用浏览器端 SQLite 跑 Node 后端，应换为原生 C 绑定（性能提升 10x+）	高
admin.js 拆分	单文件 3600+ 行 vanilla JS，应拆为模块或迁移到 React/Vue	高
CSP 不安全策略	`unsafe-inline` / `unsafe-eval` 因内联样式暂保留，前端迁移后收紧	中
前端框架迁移	全站字符串拼接 HTML，无组件化、无状态管理	中
默认密码	demo 账号密码明文，部署前务必修改（见 README 安全警告）	高

🙏 特别致谢

感谢 FAI 老师的悉心指导与鼎力支持！

在本项目的开发过程中，FAI 老师以深厚的专业素养和丰富的教学经验，为整个团队提供了关键性的技术指导和项目管理建议。从系统架构的顶层设计到每一个交互细节的打磨，从数据库规范化到 AI 审核模型的选型与调优，FAI 老师的每一次点拨都让我们茅塞顿开、受益匪浅。

感谢 FAI 老师在本项目开发过程中的技术指导和建议，从系统架构、数据库设计到 AI 审核模型选型，老师的专业意见让项目少走了很多弯路。

📄 开源协议

本项目采用 MIT License 开源。

_{「忠诚、勤奋、求实、创新」—— 澳门濠江中学校训

Rua do Comandante João Belo, Macau

第三十届田径运动会 · 2026年10月22日

Made with ❤️ by 濠江中学运动管理开发团队

Contributors: linjie20091027-a11y · whe047319-tech · ljingxi154-code · Noah

Special thanks to FAI 老师}

Name		Name	Last commit message	Last commit date
config		config
database		database
docs		docs
lib		lib
middleware		middleware
prisma		prisma
public		public
routes		routes
scripts		scripts
utils		utils
.env.example		.env.example
.gitignore		.gitignore
README.md		README.md
ROADMAP.md		ROADMAP.md
add_students.js		add_students.js
debug_db.js		debug_db.js
fix_db.js		fix_db.js
package-lock.json		package-lock.json
package.json		package.json
server.js		server.js
test_all.js		test_all.js

Latest commit

History

Folders and files

Repository files navigation