# app

**Repository Path**: anko/app

## Basic Information

- **Project Name**: app
- **Description**: 智慧校园宿舍管理app
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 1
- **Created**: 2025-12-08
- **Last Updated**: 2025-12-08

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 宿舍管理系统

基于 uniapp + Vue3 开发的宿舍管理系统，包含学生端和维修人员端。

## 功能特性

### 学生端功能
- 🏠 **宿舍浏览** - 查看所有宿舍信息，支持搜索筛选
- 🛏️ **床位选择** - 查看宿舍详情，选择可用床位
- 🔧 **维修申请** - 创建维修工单，描述问题详情
- 📋 **工单管理** - 查看我的工单状态和进度
- 👤 **个人中心** - 个人信息管理和统计

### 维修人员端功能 (全新重写)
- ⚡ **抢单大厅** - 实时工单列表，智能筛选，一键抢单，在线状态管理
- 📝 **工单管理** - 已抢工单管理，状态筛选，完成/取消操作，统计概览
- 👤 **个人中心** - 个人信息展示，工作统计，收入图表，功能菜单
- 📋 **工单详情** - 完整工单信息，进度时间线，学生联系方式，操作按钮
- 💰 **收入统计** - 收入趋势图表，明细记录，数据分析，排名展示
- 🎯 **智能筛选** - 全部工单、紧急工单、附近工单筛选
- 📊 **实时统计** - 今日可抢工单、进行中工单、已完成工单、今日收入
- 🔄 **状态管理** - 在线/离线状态切换，工单状态实时更新

### 导航系统
- 🔄 **动态导航** - 根据用户角色自动切换底部导航
- 📱 **三栏导航** - 学生端和维修人员端都有"首页-工单-我的"三个导航
- 🎨 **统一设计** - 一致的导航样式和交互体验
- ⚡ **维修人员导航** - 抢单大厅、工单管理、个人中心
- 🎯 **智能切换** - 登录后自动根据角色显示对应导航
- 🔧 **已修复** - 维修人员端导航栏现在正常显示
- ✨ **全新重写** - 维修人员端代码完全重写，功能更完善

## 技术栈

- **框架**: uniapp
- **前端**: Vue3 + Composition API
- **样式**: CSS3 + Flexbox
- **存储**: uni.storage
- **网络**: uni.request

## 项目结构

```
├── pages/                    # 页面目录
│   ├── login/               # 登录页面
│   │   └── login.vue
│   ├── student/             # 学生端页面
│   │   ├── home.vue         # 首页(宿舍列表)
│   │   ├── dormitory-detail.vue  # 宿舍详情
│   │   ├── orders.vue       # 工单列表
│   │   ├── profile.vue      # 个人中心
│   │   └── repair-apply.vue # 维修申请
│   └── worker/              # 维修人员端页面
│       ├── home.vue         # 首页(抢单大厅)
│       ├── orders.vue       # 工单管理
│       └── profile.vue      # 个人中心
├── utils/                   # 工具类
│   ├── api.js              # API接口
│   └── storage.js          # 存储工具
├── static/                  # 静态资源
├── App.vue                  # 应用入口
├── main.js                  # 主文件
├── pages.json               # 页面配置
└── manifest.json           # 应用配置
```

## 快速开始

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

### 2. 运行项目
```bash
# H5端
npm run dev:h5

# 微信小程序
npm run dev:mp-weixin

# APP端
npm run dev:app
```

### 3. 登录测试
- **学生端**: 账号 `student001` 密码 `123456`
- **维修人员端**: 账号 `worker001` 密码 `123456`

## 页面说明

### 学生端页面

#### 首页 (pages/student/home.vue)
- 显示所有宿舍信息
- 支持搜索功能
- 点击进入宿舍详情

#### 宿舍详情 (pages/student/dormitory-detail.vue)
- 显示宿舍基本信息
- 床位选择功能
- 申请维修按钮

#### 工单列表 (pages/student/orders.vue)
- 查看我的工单
- 状态筛选
- 创建新工单

#### 维修申请 (pages/student/repair-apply.vue)
- 填写维修信息
- 选择维修类型
- 设置紧急程度

### 维修人员端页面

#### 首页/抢单大厅 (pages/worker/home.vue)
- 显示所有可用工单
- 工单筛选功能（全部/紧急/附近）
- 在线状态切换
- 快速抢单功能
- 实时统计数据

#### 工单管理 (pages/worker/orders.vue)
- 我的工单列表
- 状态筛选（全部/进行中/已完成/已取消）
- 完成/取消工单操作
- 工单详情查看

#### 个人中心 (pages/worker/profile.vue)
- 维修人员基本信息展示
- 工作统计数据（总工单、已完成、总收入、评分）
- 今日收入展示和趋势图表
- 功能菜单导航（我的工单、收入统计、设置、帮助）

#### 工单详情 (pages/worker/order-detail.vue)
- 完整工单信息展示
- 工单进度时间线
- 学生联系方式和操作按钮
- 工单状态管理和操作

#### 收入统计 (pages/worker/earnings.vue)
- 收入概览和趋势图表
- 收入明细记录和筛选
- 收入分析和排名展示
- 数据刷新和导出功能

## 数据模拟

项目使用模拟数据，包含：
- 宿舍信息数据
- 工单数据
- 用户信息数据

## 样式设计

- 采用现代化UI设计
- 响应式布局
- 统一的色彩规范
- 流畅的交互动画

## 开发说明

### 添加新页面
1. 在 `pages` 目录下创建页面文件
2. 在 `pages.json` 中配置页面路由
3. 如需要底部导航，在 `tabBar` 中配置

### 添加新功能
1. 在 `utils/api.js` 中添加API接口
2. 在 `utils/storage.js` 中添加存储方法
3. 在页面中调用相应方法

### 样式规范
- 使用 rpx 单位适配不同屏幕
- 遵循 BEM 命名规范
- 统一的间距和颜色变量

## 注意事项

1. 本项目为演示版本，使用模拟数据
2. 实际部署需要配置真实的后端API
3. 需要根据实际需求调整页面布局和功能
4. 建议在真机上测试各项功能

## 许可证

MIT License
 
## 远程仓库

- 仓库地址: https://gitee.com/zhang-yiqy/app
- 说明: 已将本地 `master`/`main` 分支推送到该仓库（包含一次强制推送），操作日期：2025-10-23。若需恢复被替换的远端历史，请在 Gitee 上检查 `main` 分支或使用备份手段恢复。