云起云市场_国内正版独立SaaS抖音QQ微信百度支付宝小程序软件应用交易服务市场商店平台

 找回密码
 立即注册
查看: 3.5K|回复: 7

微信加油H5系统源码 — 附近油站导航、在线支付、三级分...

[复制链接]

微信加油H5系统源码 — 附近油站导航、在线支付、三级分...

[复制链接]

  1. 微信加油H5系统源码 — 附近油站导航、在线支付、三级分销佣金、管理后台一站式解决方案
复制代码



  1. ---

  2. # 团油快电系统 -- 功能详细说明

  3. ## 一、项目整体

  4. 本系统是一个面向微信生态的能源服务平台,采用三层架构:面向普通用户的手机端H5页面、面向管理员的Web后台管理系统、以及提供接口服务的Node.js后端。系统通过对接能链开放平台的加油API,将油站查询与在线支付能力整合到微信场景中,同时构建了会员体系与分销佣金机制。

  5. 数据库方面,系统使用了十一张数据表,涵盖用户、油站、油品价格、油枪、订单、分销佣金、提现记录、管理员、系统配置、用户反馈、公告和Banner广告图。

  6. ---

  7. ## 二、用户端功能(手机H5页面)

  8. ### 1. 登录注册

  9. 用户通过手机号和密码注册账号。注册时系统自动生成六位邀请码。登录时系统校验手机号是否有效、密码是否正确,通过后生成JWT令牌返回给前端。用户信息包括手机号、昵称、头像、VIP等级、VIP过期时间和邀请码。

  10. ### 2. 首页与油站发现

  11. 首页顶部展示轮播图广告和导航图标(如附近油站、优惠活动、加油指引等入口),下方展示公告列表。页面核心是基于定位的附近油站列表,显示每个油站的品牌标签(中石化、中石油、壳牌)、名称、地址、距离和参考油价。支持按距离、价格、品牌等条件排序筛选。

  12. ### 3. 油站详情与加油下单

  13. 点击油站卡片进入详情页,以渐变色头部卡片展示油站品牌、名称、地址、营业时间和联系电话。下方展示油站设施标签(如便利店、洗车、卫生间)和油品价格列表(92号、95号、98号),每项标注标准价和VIP专属价。用户可选择油品后看到可用油枪列表(空闲、使用中、维护中三种状态)。加油金额支持两种输入方式:直接输入金额,或输入升数系统自动计算金额。快速金额按钮提供100、200、300、500四个选项。

  14. 提交订单时,系统先通过能链API获取认证令牌,再调用能链接口创建订单并构建H5支付跳转链接,同时将订单同步保存到本地数据库。用户确认后跳转到能链支付页面完成付款。

  15. 油站详情页右上角有两个按钮:星标收藏按钮(点击切换收藏状态,黄色高亮表示已收藏)和分享按钮(点击弹出分享引导弹窗,微信内引导用户点击右上角菜单分享,微信外提供复制链接功能)。每次进入详情页自动记录浏览历史到本地存储。

  16. ### 4. 订单管理

  17. 订单列表页面展示用户的所有加油订单,每张订单卡片包含订单号、油站名称和品牌、油品类型、金额、创建时间和状态标签(待支付、支付中、已完成、已取消)。支持按状态筛选。点击订单进入详情页查看完整信息。

  18. ### 5. 个人中心

  19. 个人中心顶部以渐变色头部展示用户头像、昵称和手机号,下方统计区显示全部订单数量和累计佣金。菜单列表包括:我的订单(跳转订单列表)、分销中心、我的收藏、浏览历史、意见反馈、设置和关于我们。

  20. 我的收藏:以弹窗形式展示已收藏的油站列表,每个油站显示品牌标签、名称、地址和收藏时间。点击可跳转油站详情,可单独删除或一键清空。

  21. 浏览历史:同样以弹窗展示近期浏览的油站记录,自动去重,保留近五十条,每条显示名称、地址和浏览日期,支持一键清空。

  22. 意见反馈:用户可选择反馈类型(功能建议、问题反馈、其他)并填写内容提交,管理员可在后台查看和回复。

  23. 设置弹窗提供消息通知和位置服务的开关选项。关于我们弹窗展示应用版本和简介信息。底部有退出登录按钮。

  24. ### 6. 分销中心

  25. 分销中心采用审批制访问控制。用户首次访问时,如果未申请或申请被拒绝,页面仅显示申请入口和状态提示。提交申请时可选择分销等级(一级、二级、三级),填写真实姓名和手机号,并可上传收款码图片。

  26. 审批通过后,用户可查看完整的佣金统计面板,包括累计佣金、可提现佣金和冻结佣金。邀请码区域展示个人邀请码并生成二维码供他人扫码注册。邀请好友列表显示已邀请用户的昵称、手机号(脱敏显示)和注册时间。

  27. 提现功能:用户选择提现金额(不少于100元)和提现方式(微信、支付宝),上传收款码图片后提交申请。提现申请进入待审核状态,管理员审核通过后变为已打款。提现记录列表展示每次提现的金额、方式、状态和时间。

  28. 分销关系基于用户的父子层级结构:每个用户注册时可填写邀请码绑定上级,上级获得一级分销佣金(3%),上上级获得二级分销佣金(1%)。

  29. ---

  30. ## 三、管理后台功能

  31. 管理后台需管理员账号登录后使用,所有接口均校验管理员角色权限。左侧导航栏包含以下功能页面。

  32. ### 1. 仪表盘

  33. 展示系统核心数据概览,包括总用户数、总订单数、今日订单数、总佣金等统计指标。

  34. ### 2. 用户管理

  35. 以表格展示所有注册用户列表,列包含ID、手机号、昵称、VIP等级、邀请码、上级ID、状态和注册时间。支持编辑用户信息(昵称、状态),启用或禁用用户账号,以及删除用户。

  36. ### 3. 油站管理

  37. 油站列表表格展示油站ID、名称、品牌、地址、电话、营业时间和状态。支持新增油站(填写外部油站ID、名称、品牌、经纬度等)、编辑油站基本信息、删除油站。编辑弹窗中可修改各油品类型的标准价格和VIP价格。

  38. ### 4. 订单管理

  39. 展示所有用户的加油订单,列包含订单ID、用户信息、油站名称、油品类型、金额、状态和时间。支持按状态筛选。点击详情查看订单完整信息。待支付或支付中的订单可由管理员执行取消操作。

  40. ### 5. 提现管理

  41. 展示所有用户的提现申请列表,列包含ID、用户手机号、昵称、提现金额、提现方式(微信/支付宝/银行卡)、账户信息、收款码图片(点击可放大预览)、状态标签和申请时间。支持按状态筛选。待审核状态的申请可执行通过或拒绝操作,已通过状态的申请可标记为已打款。审核拒绝后佣金自动退回用户可提现余额。

  42. ### 6. 分销申请管理

  43. 展示用户提交的分销员申请列表,列包含申请人信息、申请等级、真实姓名、联系电话、备注、收款码图片、申请时间和当前状态。管理员可审批通过或拒绝申请,通过后更新用户的分销员状态和等级。

  44. ### 7. 系统配置

  45. 分为两个标签页:

  46. 接口参数设置:以分类折叠面板展示微信配置(AppID、密钥、Token、消息加解密密钥)、微信支付配置(商户号、API密钥、证书序列号、支付回调地址)、分销比例(佣金池比例、一二三级分销比例)、地图配置和能链API对接配置(应用标识、密钥、渠道编号、接口地址、回调地址)。所有配置支持直接编辑保存。

  47. 全部配置项:以表格形式展示数据库中所有配置记录,支持按配置键或描述搜索筛选。每条配置标注管理来源--绿色标签表示该配置由"接口参数设置"页面统一管理,灰色标签表示手动设置的配置项。可直接编辑任意配置。

  48. ### 8. 公告管理

  49. 管理系统公告,公告内容支持富文本编辑器。列表展示标题、内容摘要、发布时间和发布状态。支持新增、编辑和删除公告。已发布的公告会显示在用户端首页。

  50. ### 9. Banner管理

  51. 管理首页展示的轮播图、广告图和导航项。列表展示每个Banner的类型(轮播图/广告图/导航项,以不同颜色标签区分)、标题、预览图、排序序号、显示状态和创建时间。

  52. 编辑弹窗支持三种类型:轮播图和广告图需要上传图片(支持点击更换,限制JPG/PNG/GIF/WebP格式,不大于5MB),可填写跳转链接;导航项类型不需要图片,通过可视图标网格选择器选取图标(提供二十余个常用图标和若干表情符号),点击即可选中并有实时预览。所有类型均支持设置排序序号和显示/隐藏开关。

  53. ### 10. 反馈管理

  54. 展示用户提交的意见反馈,列表包含反馈人信息、反馈类型(功能建议/问题反馈/其他)、内容和提交时间。支持按状态筛选。管理员可对反馈进行回复,回复后状态变为已回复。

  55. ---

  56. ## 四、外部API对接

  57. 系统与能链开放平台进行了完整对接,实现以下核心流程:

  58. 1. 用户令牌获取:使用用户手机号调用能链接口获取认证令牌,令牌有效期两小时,过期自动刷新。
  59. 2. 油站查询:调用能链附近油站接口,传入经纬度和查询半径获取周边油站数据。
  60. 3. 订单创建:调用能链下单接口,传入油站编号、油枪号、油品编号和金额,获取能链订单号。
  61. 4. H5支付:通过认证码构建能链H5收银台支付链接,用户在微信浏览器中完成支付。
  62. 5. 支付回调:能链在支付完成后回调系统接口通知支付结果,系统更新本地订单状态和分销佣金。

  63. 签名机制采用MD5算法:将请求参数按字母排序拼接后追加密钥,取MD5大写作为签名。接口请求需携带应用标识和时间戳。

  64. ---

  65. ## 五、权限与安全

  66. 用户端采用JWT令牌认证,所有接口(除登录注册外)均需携带Authorization请求头。管理员接口额外校验角色为admin。密码使用bcrypt加密存储。手机号在列表展示时中间四位脱敏显示。

  67. ---
  68. 基于代码分析,这个项目的独特卖点是:**真实对接能链团油API的微信加油H5完整系统 + 三级分销 + 管理后台**。

  69. ---

  70. **SEO标题:**

  71. 微信加油H5系统源码 — 附近油站导航、在线支付、三级分销佣金、管理后台一站式解决方案

  72. ---

  73. **备选标题(根据投放场景选用):**

  74. 1. 加油站微信H5商城源码 对接能链团油API 支持分销提现
  75. 2. 油站导流变现系统源码 微信H5加油支付 三级分销
  76. 3. 微信加油小程序源码替代方案 H5在线支付油站管理系统
复制代码




上一篇:H5直播系统源码 主播观众小助手三端分离 直播间弹幕互动...
回复

使用道具 举报

你好棒!!
回复

使用道具 举报

ww*** 昨天 12:08 | 显示全部楼层
支持!!!
回复

使用道具 举报

不错!!
回复

使用道具 举报

支持!!!
回复

使用道具 举报

已加客服
回复

使用道具 举报

你历害!!
回复

使用道具 举报

沙发!!
回复

使用道具 举报

高级模式
B Color Image Link Quote Code Smilies |上传

本版积分规则

加载中0.088304

QQ|小黑屋|云起SaaS | 鲁ICP备15033450号-1 劰载中...|网站地图

GMT+8, 2026-6-15 02:11 , Processed in 0.138144 second(s), 26 queries .

Copyright © 菏泽云起网络科技有限公司.

快速回复 返回顶部 返回列表