# 值班助手小程序 - 使用说明

## 项目介绍
值班助手是一个基于微信小程序的值班管理应用，使用 TDesign 组件库构建。

## 技术栈
- 微信小程序原生框架
- TDesign 微信小程序组件库

## 安装步骤

### 1. 安装依赖
```bash
npm install
```

### 2. 在微信开发者工具中配置
1. 打开微信开发者工具
2. 导入项目（选择本项目目录）
3. 在工具栏点击 `工具` -> `构建 npm`
4. 构建成功后，勾选 `将 JS 编译成 ES5`

### 3. 添加底部导航图标
需要在 `images` 目录下添加以下图标文件（PNG格式）：
- `home.png` - 首页图标（未选中）
- `home-active.png` - 首页图标（选中）
- `mine.png` - 我的图标（未选中）
- `mine-active.png` - 我的图标（选中）

### 4. 添加默认头像
在 `images` 目录下添加 `default-avatar.png` 作为默认头像图片

## 项目结构

```
attendant-wechat/
├── app.js                 # 小程序主入口
├── app.json              # 小程序全局配置
├── app.wxss              # 小程序全局样式
├── sitemap.json          # 站点地图配置
├── package.json          # 项目依赖配置
├── project.config.json   # 项目配置文件
├── pages/                # 页面目录
│   ├── index/           # 首页
│   │   ├── index.wxml   # 页面结构
│   │   ├── index.wxss   # 页面样式
│   │   ├── index.js     # 页面逻辑
│   │   └── index.json   # 页面配置
│   └── mine/            # 我的页面
│       ├── mine.wxml    # 页面结构
│       ├── mine.wxss    # 页面样式
│       ├── mine.js      # 页面逻辑
│       └── mine.json    # 页面配置
└── images/              # 图片资源目录
    ├── home.png         # 首页图标
    ├── home-active.png  # 首页图标（选中）
    ├── mine.png         # 我的图标
    ├── mine-active.png  # 我的图标（选中）
    └── default-avatar.png # 默认头像
```

## 页面说明

### 首页 (pages/index)
- 欢迎卡片：显示应用名称和欢迎语
- 快捷功能：今日值班、值班表、值班记录
- 统计信息：显示值班相关统计数据

### 我的 (pages/mine)
- 用户信息卡片：显示用户头像和昵称
- 功能菜单：个人信息、我的值班、值班统计、设置、帮助与反馈、关于
- 退出登录：退出当前账号

## 使用的 TDesign 组件
- `t-button`: 按钮组件
- `t-cell`: 单元格组件
- `t-cell-group`: 单元格组组件
- `t-icon`: 图标组件
- `t-avatar`: 头像组件
- `t-card`: 卡片组件
- `t-divider`: 分割线组件
- `t-badge`: 徽标组件

## 注意事项
1. 确保微信开发者工具的基础库版本 >= 2.12.0
2. 安装依赖后必须执行"构建 npm"操作
3. 建议在真机上测试，部分功能可能与模拟器有差异
4. 图标文件尺寸建议：未选中状态 81x81px，选中状态 81x81px

## 下一步开发建议
1. 实现用户登录功能
2. 对接后端 API，获取真实的值班数据
3. 添加数据缓存机制，提升用户体验
4. 实现消息通知功能
5. 添加数据导出功能