← 返回Demo导航
✨ 小程序概述
本小程序为能源科技充电桩管理系统的移动端用户应用,提供完整的充电服务体验。用户可通过微信小程序快速登录、查找充电站点、进行充电操作、查看订单历史和申请发票。
📋 核心功能模块
🔐 用户认证
支持微信授权登录和手机号登录,安全快速的身份验证。
🗺️ 站点查询
首页展示推荐站点,支持附近站点搜索和收藏功能。
🔋 充电管理
扫码充电、实时进度展示、充电状态查看、停止充电等完整操作。
📊 订单管理
查看所有充电订单、订单详情、支付记录、订单评价。
💰 钱包系统
余额查看、充值功能、交易流水、优惠券管理。
📱 个人中心
用户信息管理、设置修改、帮助反馈、账户注销。
📁 项目结构
/charging/miniapp/
├── pages/ # 页面目录
│ ├── login/ # 登录页
│ ├── index/ # 首页(站点列表)
│ ├── charge/ # 充电页
│ ├── order/ # 订单列表
│ ├── order-detail/ # 订单详情
│ ├── wallet/ # 钱包
│ └── mine/ # 个人中心
├── components/ # 公共组件
├── api/ # API服务
│ ├── userApi.js # 用户接口
│ ├── siteApi.js # 站点接口
│ ├── chargeApi.js # 充电接口
│ ├── orderApi.js # 订单接口
│ └── couponApi.js # 优惠券接口
├── utils/ # 工具函数
│ ├── storage.js # 本地存储
│ ├── request.js # 网络请求
│ └── util.js # 通用工具
├── app.js # 应用入口
├── app.json # 应用配置
└── app.wxss # 全局样式
🎯 页面流程
登录页 (Login)
↓ (微信授权)
首页 (Index) - 站点列表 & 搜索
├─ 查看站点详情
├─ 收藏站点
└─ 扫码充电 → 充电页 (Charge)
├─ 实时进度展示
├─ 设备状态
├─ 停止充电
└─ 充电完成
订单页 (Order) - 查看历史订单
├─ 订单详情 (Order Detail)
├─ 支付状态
├─ 评价订单
└─ 下载发票
钱包页 (Wallet) - 余额和充值
├─ 查看交易流水
└─ 充值功能
个人中心 (Mine) - 用户信息
├─ 编辑个人资料
├─ 收藏管理
└─ 账户设置
📌 演示说明:
• 本小程序为功能演示版本,后端API接口由微服务架构提供
• 实际部署时需要配置微信支付、地图服务等第三方接口
• 所有接口均遵循 RESTful 规范,前后端分离架构
• 支持离线缓存,优化移动网络体验
🚀 快速开始
# 1. 下载微信开发者工具
访问: https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html
# 2. 导入小程序项目
项目目录: /Users/xiege/WorkBuddy/charging/miniapp/
# 3. 配置AppID
编辑 app.json,填入微信小程序AppID
# 4. 配置API服务器地址
编辑 api/ 目录中的文件,配置后端服务器地址
例: https://api.example.com:8080
# 5. 预览或上传
使用开发者工具进行预览、测试或上传发布
📊 关键数据说明
- 用户认证:支持微信授权和手机号两种方式登录
- 站点搜索:支持按名称搜索和按距离排序(基于GPS定位)
- 充电计费:根据时间段(谷/平/峰/尖)自动计算,支持分阶段定价
- 订单管理:支持订单查询、支付、评价、发票申请等完整流程
- 钱包系统:支持充值、提现、流水查询、优惠券等功能
- 消息推送:充电提醒、支付通知、优惠券到期提醒等
📱 小程序Demo正在加载中...
由于小程序是原生开发,需使用微信开发者工具预览。
此页面仅为功能介绍。
← 返回Demo导航