# 奶茶

**Repository Path**: huwei2023/milk-tea

## Basic Information

- **Project Name**: 奶茶
- **Description**: 奶茶在线点餐系统
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-01-07
- **Last Updated**: 2026-01-07

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 奶茶在线点餐系统

一个功能完整的移动端奶茶在线点餐小程序，支持用户注册登录、商品浏览、购物车管理、订单结算、支付集成、订单跟踪、个人中心和管理后台等功能。

## 技术栈

### 前端
- React 18 + TypeScript
- Vite
- Tailwind CSS
- React Router
- Zustand (状态管理)
- Axios (HTTP客户端)
- Lucide React (图标库)

### 后端
- Node.js + Express
- TypeScript
- SQLite (数据库)
- JWT (身份认证)
- bcryptjs (密码加密)
- Helmet (安全防护)
- express-rate-limit (限流)

## 功能特性

### 用户端
- ✅ 用户注册与登录
- ✅ 奶茶商品展示与分类浏览
- ✅ 商品搜索功能
- ✅ 购物车管理（添加、删除、修改数量）
- ✅ 商品自定义（杯型、糖度、冰度、配料）
- ✅ 订单结算与支付集成（微信支付、支付宝、现金）
- ✅ 订单状态跟踪
- ✅ 订单历史查询
- ✅ 个人中心（个人信息管理）

### 管理端
- ✅ 数据统计与分析
- ✅ 订单管理（查看、更新状态）
- ✅ 商品管理（增删改查）
- ✅ 销售数据可视化

### 安全性
- ✅ JWT身份认证
- ✅ 密码bcrypt加密
- ✅ HTTPS支持
- ✅ 请求限流
- ✅ SQL注入防护
- ✅ XSS防护

## 项目结构

```
奶茶在线点餐系统/
├── client/                 # 前端项目
│   ├── src/
│   │   ├── components/     # 组件
│   │   ├── contexts/       # React Context
│   │   ├── pages/          # 页面
│   │   ├── services/       # API服务
│   │   ├── types/          # TypeScript类型定义
│   │   ├── App.tsx
│   │   └── main.tsx
│   ├── package.json
│   └── vite.config.ts
├── server/                 # 后端项目
│   ├── src/
│   │   ├── middleware/     # 中间件
│   │   ├── routes/         # 路由
│   │   ├── database.ts     # 数据库配置
│   │   └── index.ts        # 入口文件
│   ├── package.json
│   └── tsconfig.json
└── package.json           # 根目录配置
```

## 安装与运行

### 1. 安装依赖

```bash
npm run install:all
```

### 2. 配置环境变量

在 `server/.env` 文件中配置：

```env
PORT=5000
NODE_ENV=development
JWT_SECRET=your-secret-key-change-this-in-production
JWT_EXPIRES_IN=7d
```

### 3. 启动开发服务器

```bash
npm run dev
```

这将同时启动前端（端口3000）和后端（端口5000）服务器。

### 4. 访问应用

- 前端: http://localhost:3000
- 后端API: http://localhost:5000

## 默认账户

### 管理员账户
- 用户名: admin
- 邮箱: admin@milktea.com
- 密码: admin123

## API接口

### 认证接口
- POST `/api/auth/login` - 用户登录
- POST `/api/auth/register` - 用户注册
- GET `/api/auth/me` - 获取当前用户信息
- PUT `/api/auth/profile` - 更新用户信息

### 商品接口
- GET `/api/products` - 获取商品列表
- GET `/api/products/:id` - 获取商品详情
- POST `/api/products` - 创建商品（管理员）
- PUT `/api/products/:id` - 更新商品（管理员）
- DELETE `/api/products/:id` - 删除商品（管理员）

### 订单接口
- GET `/api/orders` - 获取订单列表
- GET `/api/orders/:id` - 获取订单详情
- POST `/api/orders` - 创建订单
- PUT `/api/orders/:id/status` - 更新订单状态（管理员）
- PUT `/api/orders/:id/cancel` - 取消订单

### 统计接口
- GET `/api/statistics` - 获取统计数据（管理员）

## 数据库

系统使用SQLite数据库，数据库文件位于 `server/data/milktea.db`。

首次运行时会自动创建数据库表并初始化示例数据。

## 部署

### 前端部署

```bash
cd client
npm run build
```

构建产物位于 `client/dist` 目录，可以部署到任何静态文件服务器。

### 后端部署

```bash
cd server
npm run build
npm start
```

## 开发说明

### 添加新功能

1. 在 `client/src/pages` 中添加新页面
2. 在 `client/src/services/api.ts` 中添加API调用
3. 在 `server/src/routes` 中添加后端路由
4. 在 `client/src/App.tsx` 中添加路由配置

### 代码规范

- 使用TypeScript进行类型检查
- 遵循ESLint规则
- 使用Prettier格式化代码

## 许可证

MIT License