基于 Vue 3 + Node.js + Express + MySQL + MongoDB 的全栈社区团购管理系统
这是一个完整的社区团购管理平台，包含团长端管理后台、居民端购物平台和后端 API 服务。系统采用前后端分离架构，支持商品管理、订单处理、佣金结算、数据统计等功能。
- 👨💼 团长端: 商品管理、订单处理、居民管理、佣金统计、数据看板
- 👤 居民端: 商品浏览、购物车、订单管理、个人中心
- 🔐 权限管理: JWT 身份认证、角色权限控制
- 📊 数据统计: 销售趋势、订单统计、热销商品分析
- 💰 佣金系统: 自动计算佣金、佣金明细查询
- 📱 响应式设计: 支持多端访问
- 框架: Vue 3 + Vite
- UI 库: Element Plus
- 状态管理: Pinia
- 路由: Vue Router 4
- HTTP 客户端: Axios
- 样式: SCSS
- 运行环境: Node.js
- Web 框架: Express
- 数据库 ORM/ODM: Sequelize (MySQL) + Mongoose (MongoDB)
- 身份认证: JWT + bcryptjs
- 文件上传: Multer
- 环境配置: dotenv
- MySQL: 核心业务数据（用户、商品、订单、佣金）
- MongoDB: 日志和统计数据（登录日志、操作日志、库存日志）
node192/
├── bin/ # 启动脚本目录
│ ├── start-captain.bat # 启动团长端前端 (Windows)
│ ├── start-captain.sh # 启动团长端前端 (Linux/Mac)
│ ├── start-resident.bat # 启动居民端前端 (Windows)
│ ├── start-resident.sh # 启动居民端前端 (Linux/Mac)
│ ├── start-server.bat # 启动后端服务器 (Windows)
│ ├── start-server.sh # 启动后端服务器 (Linux/Mac)
│ ├── init-db.bat # 初始化数据库 (Windows)
│ ├── init-db.sh # 初始化数据库 (Linux/Mac)
│ ├── deploy.bat # Git 部署 (Windows)
│ ├── deploy.sh # Git 部署 (Linux/Mac)
│ ├── ignore.bat # Git 清理 (Windows)
│ ├── ignore.sh # Git 清理 (Linux/Mac)
│ ├── test-api.bat # API 测试 (Windows)
│ └── test-api.sh # API 测试 (Linux/Mac)
│
├── client-captain/ # 团长端前端 (端口: 5173)
│ ├── src/
│ │ ├── views/ # 页面组件
│ │ ├── components/ # 公共组件
│ │ ├── stores/ # Pinia 状态管理
│ │ ├── router/ # 路由配置
│ │ ├── utils/ # 工具函数
│ │ └── api/ # API 接口
│ ├── package.json
│ ├── vite.config.js
│ └── README.md # 团长端文档
│
├── client-resident/ # 居民端前端 (端口: 5174)
│ ├── src/
│ │ ├── views/ # 页面组件
│ │ ├── components/ # 公共组件
│ │ ├── stores/ # Pinia 状态管理
│ │ ├── router/ # 路由配置
│ │ ├── utils/ # 工具函数
│ │ └── api/ # API 接口
│ ├── package.json
│ ├── vite.config.js
│ └── README.md # 居民端文档
│
├── server/ # 后端服务 (端口: 3000)
│ ├── src/
│ │ ├── config/ # 数据库配置
│ │ ├── models/ # 数据模型
│ │ │ ├── mysql/ # MySQL 模型 (8个)
│ │ │ └── mongodb/ # MongoDB 模型 (6个)
│ │ ├── middleware/ # 中间件
│ │ ├── services/ # 业务逻辑层
│ │ ├── controllers/ # 控制器层
│ │ ├── routes/ # 路由层
│ │ └── utils/ # 工具函数
│ ├── uploads/ # 文件上传目录
│ ├── app.js # 应用入口
│ ├── package.json
│ ├── .env # 环境变量配置
│ └── README.md # 后端文档
│
├── server-test/ # 服务端 API 自动化测试
│ ├── 00-环境变量.http # 测试环境配置
│ ├── 01-认证模块.http # 认证接口测试
│ ├── 02-商品分类模块.http # 分类接口测试
│ ├── 03-商品管理模块.http # 商品接口测试
│ ├── 04-购物车模块.http # 购物车接口测试
│ ├── 05-订单模块.http # 订单接口测试
│ ├── 06-居民管理模块.http # 居民管理接口测试
│ ├── 07-佣金统计模块.http # 佣金统计接口测试
│ ├── 08-消息通知模块.http # 消息通知接口测试
│ ├── 09-数据看板模块.http # 数据看板接口测试
│ ├── 10-文件上传模块.http # 文件上传接口测试
│ ├── test-runner.js # 自动化测试运行器
│ ├── test-report.json # JSON 格式测试报告
│ ├── test-report.html # HTML 格式测试报告
│ ├── package.json
│ ├── README.md # 测试使用文档
│ └── TEST-README.md # 测试脚本文档
│
├── server-init/ # 数据库初始化工具
│ ├── init-dev.js # 初始化脚本
│ ├── db.config.env # 数据库配置
│ ├── package.json
│ └── README.md # 数据库初始化文档
│
├── manage.bat # Windows 管理控制台
├── manage.sh # Linux/Mac 管理控制台
└── README.md # 本文档
- Node.js: >= 16.0.0
- MySQL: >= 5.7
- MongoDB: >= 4.0
- npm 或 yarn
git clone <repository-url>
cd node192编辑 server-init/db.config.env 文件，配置你的数据库连接信息：
# MySQL 配置
MYSQL_HOST=localhost
MYSQL_PORT=3306
MYSQL_USER=root
MYSQL_PASSWORD=your_password
# MongoDB 配置
MONGO_HOST=localhost
MONGO_PORT=27017
MONGO_DB_NAME=kiro_basket_logs使用管理脚本初始化数据库：
Windows:
manage.bat
# 选择选项 4：初始化数据库Linux/Mac:
./manage.sh
# 选择选项 4：初始化数据库或直接运行初始化脚本：
Windows:
bin\init-db.batLinux/Mac:
./bin/init-db.sh编辑 server/.env 文件：
# MySQL 配置
MYSQL_HOST=localhost
MYSQL_PORT=3306
MYSQL_USER=root
MYSQL_PASSWORD=your_password
MYSQL_DATABASE=kiro_basket
# MongoDB 配置
MONGO_URI=mongodb://localhost:27017/kiro_basket_logs
# JWT 配置
JWT_SECRET=your_jwt_secret_key
JWT_EXPIRES_IN=7d
# 服务器配置
PORT=3000
NODE_ENV=developmentWindows:
manage.batLinux/Mac:
./manage.sh然后选择对应的选项：
- 0: 🚢 部署到 Git（默认）
- 1: 🚀 启动后端服务器
- 2: 👨💼 启动团长端前端
- 3: 👤 启动居民端前端
- 4: 🗄️ 初始化数据库
- 5: 🧹 清理 Git 跟踪
- 6: 🚪 退出
启动后端服务器:
# Windows
bin\start-server.bat
# Linux/Mac
./bin/start-server.sh启动团长端前端:
# Windows
bin\start-captain.bat
# Linux/Mac
./bin/start-captain.sh启动居民端前端:
# Windows
bin\start-resident.bat
# Linux/Mac
./bin/start-resident.sh后端服务器:
cd server
npm install
npm run dev团长端前端:
cd client-captain
npm install
npm run dev居民端前端:
cd client-resident
npm install
npm run dev启动成功后，访问以下地址：
| 服务 | 地址 | 说明 |
|---|---|---|
| 后端 API | http://localhost:3000/api | RESTful API 服务 |
| 团长端 | http://localhost:5173 | 团长管理后台 |
| 居民端 | http://localhost:5174 | 居民购物平台 |
| 健康检查 | http://localhost:3000/health | 服务状态检查 |
- 认证: POST
/captain/login- 团长登录 - 分类管理: GET/POST/PUT/DELETE
/captain/categories - 商品管理: GET/POST/PUT/DELETE/PATCH
/captain/products - 订单管理: GET/PATCH
/captain/orders - 居民管理: GET
/captain/residents - 佣金统计: GET
/captain/commission - 消息通知: GET/PATCH/DELETE
/captain/notifications - 数据看板: GET
/captain/dashboard
- 认证: POST
/resident/register, POST/resident/login - 商品浏览: GET
/resident/products, GET/resident/categories - 购物车: GET/POST/PUT/DELETE
/resident/cart - 订单管理: GET/POST/PATCH
/resident/orders - 个人信息: GET/PUT
/resident/profile
- 文件上传: POST
/api/upload - 健康检查: GET
/health
详细 API 文档请查看：
项目提供了完整的 API 自动化测试套件，位于 server-test/ 目录：
# 进入测试目录
cd server-test
# 安装测试依赖
npm install
# 运行自动化测试
npm test
# 生成 HTML 测试报告
npm run test:report测试覆盖：
- ✅ 11 个测试模块（认证、商品、订单、购物车等）
- ✅ 77 个测试用例
- ✅ 自动化 Token 管理
- ✅ JSON + HTML 双格式报告
- ✅ 彩色控制台输出
详细测试文档请查看：API 测试文档
- captains - 团长信息表
- residents - 居民信息表
- categories - 商品分类表
- products - 商品信息表
- orders - 订单表
- order_items - 订单明细表
- commissions - 佣金记录表
- carts - 购物车表
- login_logs - 登录日志
- stock_logs - 库存变动日志
- notifications - 系统通知
- order_status_logs - 订单状态变更日志
- dashboard_stats - 数据统计
- operation_logs - 操作日志
详细数据库文档请查看：数据库初始化文档
初始化数据库后，可以使用以下测试账号登录系统。所有账号的默认密码均为：123456
访问团长端：http://localhost:5173
| 用户名 | 密码 | 手机号 | 说明 |
|---|---|---|---|
| admin | 123456 | 13800138000 | 管理员账号 |
访问居民端：http://localhost:5174
| 用户名 | 密码 | 手机号 | 姓名 | 地址 |
|---|---|---|---|---|
| zhangsan | 123456 | 13900139001 | 张三 | 1号楼101室 |
| lisi | 123456 | 13900139002 | 李四 | 1号楼102室 |
| wangwu | 123456 | 13900139003 | 王五 | 2号楼201室 |
| zhaoliu | 123456 | 13900139004 | 赵六 | 2号楼202室 |
| sunqi | 123456 | 13900139005 | 孙七 | 3号楼301室 |
注意：
- 这些是测试账号，仅供开发和演示使用
- 生产环境部署前请务必修改或删除这些默认账号
- 居民端也支持新用户注册功能
- 后端: 在
server/src/中添加模型、服务、控制器和路由 - 前端: 在对应的
client-*/src/中添加页面、组件和 API 调用 - 更新文档: 更新对应的 README.md 文件
- 使用 ESLint 进行代码检查
- 遵循 Vue 3 Composition API 风格
- 后端使用 RESTful API 规范
- 统一的错误处理和响应格式
master- 主分支，用于生产环境develop- 开发分支feature/*- 功能分支bugfix/*- 修复分支
1. 无法连接数据库
- 检查 MySQL 和 MongoDB 服务是否运行
- 验证配置文件中的连接信息
- 确认数据库用户权限
2. 端口被占用
- 修改对应的配置文件更改端口
- 或关闭占用端口的进程
3. 依赖安装失败
- 尝试清除缓存：
npm cache clean --force - 删除
node_modules和package-lock.json后重新安装 - 使用国内镜像：
npm config set registry https://registry.npmmirror.com
4. Token 验证失败
- 检查
JWT_SECRET配置 - 确认请求头中携带正确的 Token
- 检查 Token 是否过期
更多问题请查看各子项目的 README 文档。
# 团长端
cd client-captain
npm run build
# 将 dist 目录部署到服务器
# 居民端
cd client-resident
npm run build
# 将 dist 目录部署到服务器cd server
npm install --production
NODE_ENV=production npm start建议使用 PM2 进行进程管理：
npm install -g pm2
pm2 start app.js --name "community-server"本项目仅供学习和研究使用。
开发时间: 2024-12-18 技术栈: Vue 3 + Element Plus + Node.js + Express + MySQL + MongoDB