## 项目概述

本项目是一个手机保修激活查询验机报告查询小工具，严格按照微信小程序开发规范创建

## 项目结构

```

.

├── app.js                 # 小程序入口文件

├── app.json               # 全局配置文件

├── app.wxss               # 全局样式文件

├── sitemap.json           # 小程序收录配置

├── pages                  # 页面目录

│   ├── index              # 首页

│   │   ├── index.js       # 首页逻辑

│   │   ├── index.json     # 首页配置

│   │   ├── index.wxml     # 首页结构

│   │   └── index.wxss     # 首页样式

│   ├── query              # 查询页

│   │   ├── query.js       # 查询页逻辑

│   │   ├── query.json     # 查询页配置

│   │   ├── query.wxml     # 查询页结构

│   │   └── query.wxss     # 查询页样式

│   └── report             # 报告页

│       ├── report.js      # 报告页逻辑

│       ├── report.json    # 报告页配置

│       ├── report.wxml    # 报告页结构

│       └── report.wxss    # 报告页样式

├── utils                  # 工具类目录

│   └── util.js            # 工具函数

└── README.md              # 项目说明文档

```

## 功能特点

### 1. 首页 (index)

- 提供微信登录功能

- 展示小程序标题和简介

- 导航至查询页面

- 使用蓝色渐变背景，营造科技感

### 2. 查询页 (query)

- 输入苹果设备序列号进行查询（8-12位字母和数字组合）

- 序列号格式验证功能

- 查询结果显示在当前页面，避免自动跳转

- 提供"查看详细报告"按钮，用户可主动选择查看详情

- 使用紫色渐变背景，与功能主题相呼应

### 3. 报告页 (report)

- 展示详细的验机报告

- 包含设备基本信息、保修详情、验机总结

- 详细分类展示验机项：硬件检测、软件检测、网络检测、外观检测

- 提供序列号复制功能

- 使用粉色渐变背景，营造专业报告感

## 技术实现

### 验证机制

- 序列号格式验证（8-12位字母和数字组合）

- 输入非空验证

- 错误提示机制

### 用户体验优化

- 使用Unicode emoji图标，减少包体积

- 响应式布局适配不同屏幕尺寸

- 页面背景全屏显示，视觉统一

- 按钮文字居中布局，提升视觉统一性

- 查询结果在当前页面展示，用户可自主选择是否查看详情

### 数据结构

查询结果包含以下详细信息：

- 基本信息：序列号、产品名称、保修状态、激活日期、到期日期等

- 设备信息：型号、颜色、存储、版本、地区等

- 验机总结：整体结果、验机日期、验机师等

- 详细验机项：硬件、软件、网络、外观四大类检测

### 样式设计

- 使用渐变色彩背景提升视觉体验

- 统一的页面布局和组件样式

- 顶部导航栏与页面背景风格协调

- Flex布局实现元素居中对齐

## 用户交互流程

1. 用户进入首页，可选择微信登录

2. 点击"开始查询"进入查询页面

3. 输入苹果设备序列号并提交查询

4. 在当前页面查看基本查询结果

5. 如需详细了解，点击"查看详细报告"跳转到报告页面

6. 在报告页面可查看完整的验机报告和各项检测详情

## 项目规范

- 严格遵循微信小程序开发规范

- 页面结构包括首页、查询页和报告页

- 所有页面都遵循微信小程序的目录结构和文件命名规范

- 顶部导航栏与页面背景风格保持一致

这个手机保修查询小工具功能完整、界面美观、用户体验良好，能够满足用户查询苹果设备保修信息和验机报告的需求。