# 条款页面 - 有场的条款和条件

## 功能概述

条款页面展示完整的《有场的条款和条件》内容，用户需要仔细阅读并同意后才能继续使用平台服务。

## 🎨 设计特点

### 视觉设计
- **背景图片**：使用与登录页面相同的运动主题背景图片
- **状态栏**：完全还原 iPhone 状态栏样式
- **导航栏**：白色圆角导航栏，包含返回按钮和页面标题
- **内容布局**：清晰的标题、简介和详细内容层次

### 交互设计
- **内容滚动**：支持长内容滚动浏览
- **返回导航**：点击返回按钮回到上一页
- **同意按钮**：底部确认按钮，表示已阅读并同意

## 📱 页面结构

```
TermsPage
├── 背景图片层
│   ├── 运动背景图片
│   └── 渐变遮罩层
├── 状态栏
│   ├── 时间显示 (9:41)
│   └── 状态图标 (信号/WiFi/电池)
├── 导航栏
│   ├── 返回按钮
│   ├── 页面标题
│   └── 占位符
├── 主要内容
│   ├── 条款标题
│   ├── 条款简介
│   ├── 条款详细内容
│   └── 底部按钮
└── 底部指示器
```

## 🚀 功能特性

### 内容展示
- **条款标题**：醒目的标题显示
- **条款简介**：简洁的条款概述
- **详细内容**：完整的条款条款内容
- **格式保持**：保持原有的段落和编号格式

### 用户交互
- **内容滚动**：支持长内容滚动
- **返回功能**：返回上一页面
- **同意确认**：确认已阅读并同意条款

## 📋 条款内容

本页面包含完整的《有场的条款和条件》，涵盖以下十个主要部分：

### 1. 服务内容
- 活动发布、报名、聊天室沟通、活动提醒等服务
- 不提供教练或场地销售服务，仅作为信息发布和社交媒介

### 2. 用户注册与权限
- 真实信息要求，不得冒用他人身份
- 违规信息处理权利

### 3. 活动发布与报名
- 信息真实性要求
- 沟通和变更建议

### 4. 权责声明
- 免责条款说明
- 保险建议
- 第三方交易责任

### 5. 费用与退款
- 服务费说明
- 退款规则

### 6. 用户行为规范
- 准时参加承诺
- 禁止违规内容

### 7. 隐私与信息保护
- 信息收集用途
- 个人信息管理

### 8. 协议修改与终止
- 修改通知机制
- 违规处理措施

### 9. 争议解决
- 法律适用
- 争议解决方式

### 10. 其他条款
- 协议完整性
- 条款有效性

## 🛠 技术实现

### 组件结构
- **状态栏组件**：显示时间和系统状态
- **导航栏组件**：返回按钮和页面标题
- **内容组件**：条款内容的展示
- **按钮组件**：同意确认按钮

### 样式特色
- **毛玻璃效果**：`backdrop-filter: blur(32px)`
- **渐变背景**：与登录页面保持一致
- **响应式设计**：适配不同屏幕尺寸
- **滚动优化**：流畅的内容滚动体验

## 📂 文件结构

```
src/pages/login/terms/
├── index.tsx           # 条款页面组件
├── index.scss          # 页面样式
├── index.config.ts     # 页面配置
└── README.md          # 说明文档
```

## 🔧 配置说明

### 页面配置
```typescript
export default definePageConfig({
  navigationBarTitleText: '条款和条件',
  navigationBarBackgroundColor:'#FAFAFA',
  navigationBarTextStyle: 'black',
  backgroundColor: '#f5f5f5',
  enablePullDownRefresh: false,
  disableScroll: false
})
```

## 🔄 页面跳转

### 进入方式
- 从登录页面点击协议链接进入
- 从验证码页面点击协议链接进入

### 退出方式
- 点击返回按钮返回上一页
- 点击"我已阅读并同意"按钮返回上一页

## 📱 测试说明

### 功能测试
1. **内容显示测试**
   - 条款标题正确显示
   - 条款内容完整展示
   - 格式保持正确

2. **交互测试**
   - 返回按钮功能正常
   - 同意按钮功能正常
   - 内容滚动流畅

3. **样式测试**
   - 不同屏幕尺寸适配
   - 背景图片显示正确
   - 文字可读性良好

## 🎯 后续优化

### 功能扩展
1. **条款版本管理**
   - 条款更新历史
   - 版本对比功能
   - 更新通知机制

2. **用户协议管理**
   - 协议同意记录
   - 协议更新提醒
   - 个性化协议内容

3. **多语言支持**
   - 英文版本
   - 其他语言版本
   - 语言切换功能

### 用户体验优化
1. **阅读体验**
   - 字体大小调节
   - 夜间模式
   - 书签功能

2. **内容导航**
   - 目录导航
   - 快速跳转
   - 搜索功能