# wx_charge

**Repository Path**: gsjengineer/wx_charge

## Basic Information

- **Project Name**: wx_charge
- **Description**: 加油、话费充值 ai生成的微信小程序demo.
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-03-03
- **Last Updated**: 2026-03-03

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 便民服务微信小程序（演示版）

这是一个可直接用 **微信开发者工具** 打开的便民服务小程序示例，按需求实现了：

- 底部常驻导航：**首页 / 加油 / 话费 / 订单 / 我的**
- 首页：搜索、入口卡片、优惠活动、快捷客服/FAQ
- 加油：城市切换、油价展示、油站列表、一键加油（模拟支付）
- 话费：手机号、固定面额+自定义金额、运营商识别、优惠展示（模拟支付）
- 订单：列表筛选、搜索、支付/取消/删除、订单详情
- 我的：授权登录、手机号绑定（占位）、入口聚合
- 客服对话：全局悬浮入口、FAQ 智能回复、订单卡片咨询

## 如何运行

1. 打开微信开发者工具
2. 选择「导入项目」
3. 项目目录选择本仓库根目录：`D:\WorkPlace\wx`
4. AppID 选择「测试号」或使用默认的 `touristappid`
5. 点击「编译」

## 目录结构

- `project.config.json`：开发者工具项目配置
- `miniprogram/`：小程序代码
  - `app.json / app.js / app.wxss`
  - `custom-tab-bar/`：自定义底部 TabBar
  - `components/chat-fab/`：全局悬浮客服入口
  - `pages/home`：首页
  - `pages/fuel`：加油
  - `pages/phone`：话费充值
  - `pages/orders`：订单列表
  - `pages/order-detail`：订单详情
  - `pages/my`：个人中心
  - `pages/chat`：客服对话
  - `pages/faq`：常见问题
  - `utils/store.js`：本地订单/未读等存储（演示版）
  - `utils/mockData.js`：油价/油站/活动模拟数据

## 接入真实支付/充值（你后续要上线时）

演示版里支付使用 `wx.showModal` 模拟，不会真实扣款；正式版需替换为后端下单后调用 `wx.requestPayment`。

要接入真实流程，一般需要：

- 你自己的后端：创建订单、调用微信支付下单（获取 prepay 信息）、回调验签
- 你的后端对接加油服务商/话费充值渠道：支付成功后发起服务、查询状态
- 小程序端：拿到后端返回的支付参数后调用 `wx.requestPayment`

如果你告诉我：
- 你的后端语言/框架（Java/Spring、Node/Nest、PHP、Go…）
- 是否使用微信支付（商户号是否已开通）
- 充值渠道（自有/第三方）

我可以把这个演示版升级成可对接真实后端的版本（含接口定义、签名校验、订单状态轮询等）。