前言

本教程是基于 “apifm-wxapi” 模块,教你快速实现小程序开发,所以你可能需要先了解以下知识点:

《创建 HelloWorld 项目》
《使用 “apifm-wxapi” 快速开发小程序》
《免费注册开通后台,获得专属域名》

本案例,需要用户登录后才能操作,也就是说需要 token 授权,请先了解:

《微信小程序登录获取openid及三方token》

为方便测试,请先登录后台,“用户资产管理” 中给你的测试用户增加可用余额,继而可以完整体验支付押金流程:

《在现有小程序上增加资金模块(查看资产、查看资金流水)》

启用 “押金管理” 模块

登录 “第一步” 注册的后台,左侧菜单 --> 工厂设置 --> 模块管理

找到 “押金管理” 模块,点击 “启用模块” ,然后 F5 刷新一下后台界面,你将可以看到新的菜单: “押金管理” ;

押金管理

功能介绍

  1. 使用场景有如共享单车、桶装水的空桶押金等等都可以使用本功能快速实现;
  2. 用户自主支付需要的押金,在后期可随时申请退回;
  3. 支付的押金以冻结资产的形式体现,用户的总资产不变;

小程序界面:

押金管理demo

<button type="primary" bindtap="goRegist"> 注册 / 登录 </button>
<button type="warn" bindtap="depositList"> 读取所有的押金记录 </button>
<button type="warn" bindtap="payDeposit"> 支付押金 </button>
<button type="warn" bindtap="depositInfo"> 押金详情 </button>
<button type="warn" bindtap="depositBackApply"> 申请退还押金 </button>

小程序代码:

const WXAPI = require('apifm-wxapi')
WXAPI.init('gooking')Page({data: {},onLoad: function (options) {},onShow: function () {},goRegist() {wx.navigateTo({url: '/pages/auth/index'})},depositList() {const loginToken = wx.getStorageSync('loginToken')if (!loginToken) {wx.showToast({title: '请先登录',icon: 'none'})return}WXAPI.depositList({token: loginToken.token}).then(res => {console.log(res)if (res.code == 0) {wx.showToast({title: '读取成功',icon: 'success'})} else {wx.showToast({title: res.msg,icon: 'none'})}})},payDeposit() {const loginToken = wx.getStorageSync('loginToken')if (!loginToken) {wx.showToast({title: '请先登录',icon: 'none'})return}WXAPI.payDeposit({token: loginToken.token,amount: 98,remark: '测试'}).then(res => {console.log(res)if (res.code == 0) {wx.showToast({title: '支付成功',icon: 'success'})} else {wx.showToast({title: res.msg,icon: 'none'})}})},depositInfo() {const depositLogId = 23 // 读取押金记录中的押金IDconst loginToken = wx.getStorageSync('loginToken')if (!loginToken) {wx.showToast({title: '请先登录',icon: 'none'})return}WXAPI.depositInfo(loginToken.token, depositLogId).then(res => {console.log(res)if (res.code == 0) {wx.showToast({title: '读取成功',icon: 'success'})} else {wx.showToast({title: res.msg,icon: 'none'})}})},depositBackApply() {const depositLogId = 23 // 读取押金记录中的押金IDconst loginToken = wx.getStorageSync('loginToken')if (!loginToken) {wx.showToast({title: '请先登录',icon: 'none'})return}WXAPI.depositBackApply(loginToken.token, depositLogId).then(res => {console.log(res)if (res.code == 0) {wx.showToast({title: '申请成功,等待处理',icon: 'success'})} else {wx.showToast({title: res.msg,icon: 'none'})}})},
})

WXAPI.init('gooking') 这句代码是将你的小程序链接到你的后台,其中 gooking 这个是你的专属域名(请查看前言中关于专属域名的章节说明);

完成!

押金的任何变动(设计到资金的变化)都会反应在资金明细中,你可以回顾以下章节,查看资金流水记录:

《在现有小程序上增加资金模块(查看资产、查看资金流水》

押金记录列表分页、更多筛选条件、支付押金时候提交更多的参数以及扩展属性使用,你可以查看下述接口文档:

《api接口文档》

不用后端编程,只要你有好的 idea ,就能快速实现!

期待你的进步!
感谢!

微信小程序实现押金管理(支付押金、申请退还押金、押金明细)相关推荐

  1. 基于微信小程序的相关管理系统设计与实现开题报告的思路及方法

    今天主要谈一下计算机科学相关专业同学的选题的思路及方法. 毕业设计选题选没选好就像各位走出校园踏进社会的一道坎,跨过这道坎是很关键的,而有些同学却犯了难,把本应该简单的问题复杂化了.为什么这样讲呢?之 ...

  2. 微信小程序----全局状态管理 (便于全局埋点等操作)

    说明 由于我是一个有着一颗玻璃心的博主,导致在2018年后博客很少更新.原因是由于我的分享并没有解决到部分人的问题,而导致被骂了.当时这颗玻璃心就碎了,所以这两年以来很是消极,博客很少更新.这里给那些 ...

  3. 微信小程序中使用JSAPI支付

    微信小程序中使用JSAPI支付 在微信小程序中使用微信支付api[wx.requestPayment]需要传递以下字段 如何获取支付所需要的值 在微信小程序中使用微信支付api[wx.requestP ...

  4. 微信小程序服务商下子商户支付下单接口

    微信小程序服务商下子商户支付下单流程 调用方法 <?php namespace app\index\controller; class WeixinPay extends Base { prot ...

  5. 微信小程序的考勤管理Demo,包括前后端及数据库等内容

    这是一个微信小程序的考勤管理Demo,包括前后端及数据库等内容.如有错误或建议,欢迎指出. 前端:微信小程序框架 后端:koa框架基于express的新一代框架 文件:url80.ctfile.com ...

  6. 基于安卓/android/微信小程序的流动人口管理移动APP#计算机毕业设计

    项目介绍 通过利用信息化管理技术对社区流动人口状况进行汇总分析,对流动人口数量.年龄结构.流动方向.经营情况.计划生育情况以及在本区分布情况.投资情况等数据进行系统分析,开发一套符合当地社区的流动人口 ...

  7. 微信小程序的路由管理

    微信小程序的路由管理 有两种路由触发模式 可以通过标签的方式触发 在vue里的是: 在小程序里: (他的接收则是在另外一个页面的onload生命周期中接收) 可以通过编程式触发 在vue里呢:他是通过 ...

  8. 基于安卓/android/微信小程序的课堂管理助手系统(作业管理,在线点名,在线答疑)app-#计算机毕业设计

    项目介绍 随着我国教育的发展和移动终端的不断普及.传统的课堂管理已经不能够满足当前快速发展的大学生的需要.为了能够与时俱进,我们通过安卓开发了本次基于手机的课堂管理助手.系统分为管理人员,学生和教师三 ...

  9. 微信小程序上线订单管理功能:实现订单管理、售后维权一体化

    [TechWeb]3月13日消息,微信小程序正式上线订单管理功能,可支持用户统一查看小程序交易订单并进行管理. 如今在小程序"云逛街"早已成了微信用户的新潮流.为了方便用户对小程序 ...

  10. 基于微信小程序的宿舍管理平台

    基于微信小程序的学生宿舍管理系统功能说明 小程序端:针对学生端的功能有每日签到,查看近七日和近30日的签到情况,并且统计学生应到次数,实际签到次数,缺勤次数的功能,还有查看公告,寝室设备报修,个人中心 ...

最新文章

  1. JQuery模拟网页中自定义鼠标右键菜单
  2. java 反射获取泛型,用反射获取Java中的泛型参数的类型
  3. Linq入门博客系列地址http://www.cnblogs.com/lifepoem/category/330218.html
  4. ALV列(Column)换到行(Row) 之 列上限不固定篇
  5. ZYNQ学习(1) —— 基础开发流程
  6. hbase 使用lzo_带你快速上手HBase | HBase列族优化
  7. 轻量级java web实践-6(框架源码-4)
  8. Freemarker输出$和html标签等特殊符号
  9. 【多目标优化求解】基于matlab粒子群算法求解智能微电网多目标优化问题【含Matlab源码 383期】
  10. visio2019怎么对图片加箭头标注,Visio设置图片作为背景
  11. STC系列51单片机延时程序汇总
  12. 拼多多API接口介绍
  13. Error 403 No valid crumb was included in the request 报错解决 容器化jenkins关闭CSRF
  14. 网上教务评教管理系统(教学评价系统)
  15. 双十一健身运动装备有哪些值得买?运动好物推荐分享
  16. APP爬虫开发环境准备
  17. gcc编译程序的过程
  18. 征途手机版服务器维护,征途手机版手游开服表_征途手机版手游开服时间表_新服新区预告_第一手游网...
  19. 【链表】Banana带你一起学链表,看了不吃亏,看了不上当!!!
  20. java身份证号码验证算法

热门文章

  1. Elasticsearch之 cerebro 安装配置详细使用
  2. 在百度地图上展示dwg/dxf
  3. “日历提醒app”程序说明文档
  4. 推送本地镜像到docker私有仓库
  5. [渝粤教育] 商丘职业技术学院 Java Web应用程序开发 参考 资料
  6. Javaweb ajax实现分页
  7. markdown排版常用
  8. 弘辽科技:拼多多没出单改销量吗?拼多多如何提高销量?
  9. 实验三+070+胡阳洋
  10. Android Studio连接不到MuMu模拟器;