智能灌溉用户端小程序

项目概述

这是一个基于微信小程序的智能灌溉系统用户端应用，主要用于农业灌溉的智能化管理和监控。用户可以通过该应用进行灌溉控制、数据监测、模型计算等操作。

技术架构

前端技术

• 框架: 微信小程序原生框架
• UI组件库: TDesign-MiniProgram (腾讯设计语言)
• 图表绘制: Canvas 2D API
• 日期处理: Day.js
• 样式: WXSS (支持CSS3特性)

后端接口

• API基础路径: 通过全局配置管理
• 认证方式: Bearer Token
• 请求封装: 统一的request工具类
• 状态码处理: 标准化的响应状态码

项目结构

irrigate_user/
├── api/                    # API相关配置和工具
│   ├── config.js          # 环境配置
│   ├── env.js             # 环境变量
│   ├── request.js         # 请求工具类
│   └── statusCode.js      # 状态码定义
├── app.js                 # 小程序入口文件
├── app.json              # 小程序配置文件
├── app.wxss              # 全局样式文件
├── images/               # 图标和图片资源
│   ├── chart.svg         # 图表图标
│   ├── list.svg          # 列表图标
│   ├── calendar.svg      # 日历图标
│   └── ...               # 其他图标资源
├── miniprogram_npm/      # 第三方依赖包
│   └── tdesign-miniprogram/  # TDesign组件库
├── pages/                # 页面文件
│   ├── home/             # 首页
│   ├── modeCompute/      # 模型计算页面
│   ├── irrigation/       # 灌溉控制页面
│   ├── stationMonitor/   # 站点监控页面
│   └── ...               # 其他功能页面
└── utils/                # 工具函数
    ├── projectConfig.js  # 项目配置
    ├── storage.js        # 存储工具
    └── util.js           # 通用工具

核心功能模块

1. 首页 (pages/home)

• 用户信息展示
• 项目切换功能
• 功能模块导航
• 快速关阀操作

2. 模型计算 (pages/modeCompute)

• 农作物选择: 从API获取农作物列表
• 数据展示: 图表和列表两种展示模式
• 日期筛选: 支持自定义时间范围
• 蒸腾量计算: 基于ET0值的智能计算

API接口

• 农作物列表: GET /wx/mdVapor/allCropsWithYesterday
• 响应格式:
  json { "code": "0001", "content": [ { "cropId": "2025081915503200013", "cropName": "春玉米", "et0": 13.79, "factor": null, "maxTmp": null, "minTmp": null } ], "success": true }

3. 灌溉控制 (pages/irrigation)

• 灌溉计划管理
• 阀门控制
• 灌溉记录

4. 站点监控 (pages/stationMonitor)

• 实时数据监控
• 设备状态显示
• 报警信息处理

设计特色

1. 现代化UI设计

• 渐变背景和卡片式布局
• 圆角设计和阴影效果
• 统一的蓝色主题色彩 (#1890FF)

2. 交互体验优化

• 触摸反馈动画
• 平滑过渡效果
• 加载状态提示
• 错误处理机制

3. 响应式设计

• 移动端优先设计
• 自适应布局
• 触摸友好的交互区域

4. 图表可视化

• Canvas 2D绘制
• 网格背景
• 渐变填充
• 动态标签

开发规范

1. 代码风格

• 使用ES6+语法
• 统一的命名规范
• 模块化开发
• 注释完善

2. 错误处理

• 网络请求异常处理
• 用户友好的错误提示
• 日志记录和调试

3. 性能优化

• 合理的加载状态
• 数据缓存机制
• 图片资源优化

部署说明

1. 环境配置

• 开发环境: 通过 api/config.js 配置
• 生产环境: 通过全局变量动态配置

2. 构建部署

• 使用微信开发者工具
• 支持真机调试
• 支持云开发部署

3. 版本管理

• 遵循语义化版本号
• 记录功能更新日志
• 支持回滚操作

依赖管理

1. 核心依赖

• dayjs: 轻量级日期处理库
• tdesign-miniprogram: 企业级UI组件库
• echarts-for-weixin：图表控件

2. 版本要求

• 微信小程序基础库: 2.0.0+
• Node.js: 14.0.0+
• 微信开发者工具: 最新版本

开发团队

• 前端开发: 智能灌溉团队
• UI设计: 遵循TDesign设计规范
• 测试验证: 完整的测试流程

更新日志

v1.0.0 (2024-01-XX)

• 初始版本发布
• 核心功能模块完成
• 模型计算页面实现
• 完整的用户界面设计

联系方式

• 技术支持: 智能灌溉技术团队
• 问题反馈: 通过应用内反馈功能
• 文档更新: 定期维护和更新

本文档会随着项目发展持续更新，请关注最新版本。