# 🔐 注册登录系统使用指南

## ✨ 系统概述

智慧农业生产管理系统已集成完整的用户认证授权功能，支持：
- ✅ 用户注册与登录
- ✅ 双重认证方式（密码登录 + 手机验证码登录）
- ✅ 图形验证码防护
- ✅ 会话管理与Token自动刷新
- ✅ 登录日志记录（时间、IP、设备信息）
- ✅ 安全退出登录
- ✅ 权限动态分配

---

## 🚀 功能特性

### 1. **用户注册** 📝

**注册入口**: 点击登录页面底部"立即注册"

**必填信息**:
- 用户名（3-20个字符，仅字母、数字、下划线）
- 真实姓名（2-20个字符）
- 手机号（11位手机号）
- 短信验证码
- 密码（至少6位）
- 确认密码
- 图形验证码

**可选信息**:
- 邮箱

**注册流程**:
1. 填写基本信息
2. 点击"发送验证码"获取手机验证码
3. 输入验证码和图形验证码
4. 点击"立即注册"
5. 注册成功后自动登录系统

**信息校验**:
- ✅ 用户名唯一性验证
- ✅ 手机号唯一性验证
- ✅ 密码强度验证
- ✅ 实时表单验证
- ✅ 手机号格式验证

---

### 2. **用户登录** 🔑

#### **方式一：密码登录**

- 用户名 + 密码
- 图形验证码

**测试账号**:
```
账号1：admin / admin123（系统管理员）
账号2：zhangsan / zhang123（普通用户）
```

#### **方式二：手机号登录**

- 手机号 + 短信验证码
- 图形验证码

**测试手机号**:
```
手机1：13800138000（admin）
手机2：13800138001（zhangsan）
测试验证码：123456
```

---

### 3. **安全机制** 🛡️

#### **图形验证码**
- 随机4位字符
- 点击图片或刷新按钮可更换
- 防止暴力破解

#### **会话管理**
- Token有效期：24小时
- 自动刷新机制
- 过期后自动登出

#### **登录日志**
系统自动记录：
- 登录时间
- 登录IP地址
- 设备信息（设备类型、浏览器、操作系统）
- 登录方式（密码/手机号）
- 登录状态（成功/失败）

#### **数据加密**
- Token加密存储
- 密码加密传输（实际部署时）
- LocalStorage安全存储

---

### 4. **用户权限** 👥

#### **角色类型**

**系统管理员（admin）**:
- 权限：`*`（全部权限）
- 可访问所有功能模块
- 可管理用户和系统配置

**部门经理（manager）**:
- 权限：`machinery:*`, `field:*`, `operation:*`
- 可访问农机、地块、农事模块
- 受限访问其他模块

**普通用户（user）**:
- 权限：`machinery:view`, `field:view`, `operation:view`
- 仅查看权限
- 无法修改和删除

---

### 5. **退出登录** 🚪

**退出方式**:
1. 点击右上角用户头像
2. 选择"退出登录"
3. 系统清除所有会话信息

**清除内容**:
- ✅ Token
- ✅ RefreshToken
- ✅ 用户信息
- ✅ 登录时间
- ✅ Session ID

---

## 📊 系统架构

### **认证流程**

```
┌─────────┐
│ 用户访问 │
└────┬────┘
     │
     ▼
┌─────────────┐    未登录    ┌──────────┐
│ 检查登录状态 │──────────────>│ 登录页面 │
└─────────────┘              └────┬─────┘
     │                            │
  已登录                      登录成功
     │                            │
     ▼                            ▼
┌─────────────┐              ┌──────────┐
│ 检查Token   │<─────────────│ 生成Token│
└─────┬───────┘              └──────────┘
      │
   有效/刷新
      │
      ▼
┌─────────────┐
│ 进入主系统  │
└─────────────┘
```

### **技术组件**

#### **1. AuthContext** (认证上下文)
- 全局状态管理
- 用户信息存储
- Token管理
- 登录/登出方法

#### **2. Login组件**
- 双重登录方式
- 图形验证码
- 表单验证
- 错误提示

#### **3. Register组件**
- 用户注册表单
- 实时验证
- 手机验证码
- 自动登录

#### **4. CaptchaInput组件**
- 图形验证码生成
- Canvas绘制
- 随机刷新

#### **5. authStorage** (存储管理)
- Mock用户数据库
- 密码验证
- 手机号验证
- Token生成
- 登录记录

---

## 🎯 使用示例

### **场景1：新用户注册**

```typescript
// 用户填写注册表单
{
  username: 'lisi',
  realName: '李四',
  phone: '13900139000',
  code: '123456',        // 手机验证码
  password: 'lisi123',
  confirmPassword: 'lisi123',
  email: 'lisi@example.com',
  captcha: 'AB12'        // 图形验证码
}

// 系统验证
1. 检查用户名是否已存在 ✓
2. 检查手机号是否已注册 ✓
3. 验证手机验证码 ✓
4. 验证密码强度 ✓
5. 创建用户账号 ✓
6. 自动登录系统 ✓
```

### **场景2：密码登录**

```typescript
// 用户输入
{
  username: 'admin',
  password: 'admin123',
  captcha: 'XY56'
}

// 系统处理
1. 验证图形验证码 ✓
2. 查找用户 ✓
3. 验证密码 ✓
4. 生成Token ✓
5. 记录登录日志 ✓
6. 更新最后登录信息 ✓
7. 进入系统 ✓
```

### **场景3：手机号登录**

```typescript
// 用户输入
{
  phone: '13800138000',
  code: '123456',
  captcha: 'MN89'
}

// 系统处理
1. 验证手机号格式 ✓
2. 验证图形验证码 ✓
3. 验证短信验证码 ✓
4. 查找用户 ✓
5. 生成Token ✓
6. 记录登录日志 ✓
7. 进入系统 ✓
```

---

## 🔒 安全最佳实践

### **开发环境（当前）**
- ✅ Mock数据库
- ✅ LocalStorage存储
- ✅ 测试验证码固定为123456
- ✅ 密码明文存储（仅测试）

### **生产环境（建议）**
- 🔐 使用真实数据库
- 🔐 密码bcrypt加密
- 🔐 HTTPS加密传输
- 🔐 真实短信服务
- 🔐 HttpOnly Cookie存储Token
- 🔐 CSRF防护
- 🔐 验证码有效期管理
- 🔐 登录失败次数限制
- 🔐 IP黑名单机制

---

## 📱 界面展示

### **登录页面**
- 🎨 绿色农业主题
- 🎨 渐变背景
- 🎨 双Tab切换（密码/手机号）
- 🎨 图形验证码
- 🎨 安全提示

### **注册页面**
- 📝 完整表单验证
- 📝 实时错误提示
- 📝 密码强度提示
- 📝 注册说明

### **用户菜单**
- 👤 用户头像
- 👤 基本信息展示
- 👤 个人中心入口
- 👤 退出登录

---

## 🎉 快速开始

### **1. 测试登录**
```
访问系统 → 使用测试账号登录 → 进入主系统
```

### **2. 测试注册**
```
访问系统 → 点击"立即注册" → 填写信息 → 获取验证码 → 注册成功
```

### **3. 测试登出**
```
进入系统 → 点击右上角用户名 → 选择"退出登录"
```

---

## 🆘 常见问题

**Q: 忘记密码怎么办？**
A: 当前版本暂不支持密码找回，请联系管理员重置。

**Q: 验证码收不到？**
A: 测试环境使用固定验证码：123456

**Q: 为什么会自动退出？**
A: Token有效期为24小时，过期后会自动退出。

**Q: 可以同时登录多个设备吗？**
A: 可以，每个设备独立维护会话。

**Q: 如何查看登录记录？**
A: 管理员可在"中心配置管理 → 日志管理 → 登录日志"查看。

---

## 📞 技术支持

- 📧 邮箱：support@agriculture.com
- 📱 电话：400-xxx-xxxx
- 💬 在线客服：工作日 9:00-18:00

---

**系统版本**: v1.0.0  
**更新日期**: 2024-10-15  
**文档作者**: 智慧农业开发团队