微信小程序-退款业务

一、退款业务效果

二、退款流程

第一步：展示需要退款的订单

第二步：点击退款按钮，判断是否有需要退款的订单

第三步：获取到需要退款的订单信息

第四步：为每个需要退款的订单去调用微信退款接口

第四步：最后弹出退款情况

三、实现

退款页面（展示姓名、退款原因、金额、申请退款时间等）

<view class="container"><block wx:if="{{refundList.length!=0}}"><view class="refund-list" wx:for="{{refundList}}" wx:key=""><view class="line"></view><view class="refund-img"><text class="iconfont icon-xuanzhong1 {{item.isSelect? 'selectIcon':'noSelectIcon'}}"  data-index="{{index}}" bindtap='selectOne'></text></view><view class="refund" style="width:{{contentWid *0.6}}px"><view class="title">{{item.Show_Name}}</view><view class="result">{{item.RefuseMsg}}</view><view class="time">{{item.DhanderTime}}</view></view><view class="refund-money" style="width:{{contentWid *0.4}}px">¥{{item.refund_fee}}</view></view><view class="refund-bottom"><view class="refund-bottom-left"><view class="bottom-left-left"><text class="iconfont icon-xuanzhong1 {{selectAll==0 ? 'noSelectIcon':'selectIcon'}}"  bindtap='selectAll'></text><text class="all-select">全选</text></view><view class="bottom-left-right"><text>{{refundNum}}个退款 共{{refunfMoney}}元</text></view></view><view class="refund-bottom-right" bindtap='agree'>同意退款</view></view></block><block wx:else><view class="nolist">暂无待处理的退款信息，稍后再查看。</view></block>
</view>

获取退款待处理列表（根据活动ID查询）

  onLoad: function (options) {//获取退款待处理列表this.getRefundList();},/***获取退款待处理列表 */getRefundList: function () {let that = this//初始化全选按钮 退款数量等that.setData({selectAll: 0,refundNum: 0,refunfMoney: 0.00})let data = {Jsonstring: JSON.stringify({"Act_id": that.data.Act_id})}wx.api.api.getEventRfundList(data, function (res) {if (res.data.code == 1) {for (let i in res.data.data) {res.data.data[i].isSelect = false}that.setData({refundList: res.data.data})}})},

单个订单选择/全选操作；计算退款数量和金额

 /***单个选择 */selectOne: function (e) {let that = thislet index = e.currentTarget.dataset.index;let item = this.data.refundList[index];item.isSelect = !item.isSelect;that.setData({refundList: that.data.refundList});//计算退款数量和金额that.countNumAndSum();},/****全选 */selectAll: function () {let selectAll = this.data.selectAlllet that = thislet data = that.data.refundList//取消全选if (selectAll == 1) {for (let i in data) {data[i].isSelect = false}//点亮全选按钮that.setData({selectAll: 0})} else {//全部选中for (let i in data) {data[i].isSelect = true}that.setData({selectAll: 1})}that.setData({refundList: data})//计算退款数量和金额that.countNumAndSum();},/****计算退款数量和金额 */countNumAndSum: function () {let that = thisthat.setData({refundNum: 0,  //清空退款数量refunfMoney: 0.00,//清空金额})for (let i in that.data.refundList) {if (that.data.refundList[i].isSelect == true) {let newRefundNum = parseFloat(that.data.refundNum) + 1let newRefunfMoney = parseFloat(that.data.refunfMoney) + parseFloat(that.data.refundList[i].refund_fee)that.setData({refundNum: newRefundNum,refunfMoney: newRefunfMoney})}}//如果全部单选中 就增加全选按钮样式if (that.data.refundNum == that.data.refundList.length) {that.setData({selectAll: 1})} else {that.setData({selectAll: 0})}},

点击同意退款按钮
注意异步操作，需要等所有订单都调用完退款的接口之后，一次性弹出提示信息
可以使用回调、递归、setTimeout、promise等方法

  /***同意 */agree: function (e) {let that = this//判断是否有需要退款的订单let isRefund = ''let isRefund2 = ''for (let i in that.data.refundList) {if (that.data.refundList[i].isSelect == true) {//有退款的订单数isRefund++} else {//无退款的订单数isRefund2++}let total = isRefund + isRefund2if (total == that.data.refundList.length) {if (isRefund > 0) {//有需要退款的订单that.haveRefundList();} else {that.showTips("暂无需要退款的订单")}}}},/****有需要退款的订单 */haveRefundList: function () {let that = thislet selectLength = 0  //需要退款的数量that.setData({ errArray: [] })  //清空提示数组wx.showModal({title: '提示',content: '确定同意退款申请？',confirmColor: '#FFA404',success(res) {if (res.confirm) {let carrayNum = 0//执行个数for (let i in that.data.refundList) {if (that.data.refundList[i].isSelect == true) {selectLength++let data = {transaction_id: that.data.refundList[i].transaction_id,out_refund_no: that.data.refundList[i].out_refund_no,out_trade_no: that.data.refundList[i].out_trade_no,refund_fee: parseFloat(that.data.refundList[i].refund_fee)}wx.api.api.backMoney(data, function (res) {if (res.data.code == 1) {//接口调用成功 不区分是否能够退款成功that.data.errArray.push({name: that.data.refundList[i].Show_Name,errorMsg: res.data.data.return_msg})} else {//接口调用失败that.data.errArray.push({name: that.data.refundList[i].Show_Name,errorMsg: '退款接口调用' + res.data.msg})}carrayNum++if (carrayNum == selectLength) {let msg = ''for (let j in that.data.errArray) {msg += that.data.errArray[j].name + that.data.errArray[j].errorMsg + "\n"}that.showTips(msg)}})}}}}})},

退款成功与否，都会弹出提示框信息

  /*****提示信息 */showTips: function (msg) {let that = this;wx.showModal({title: '提示',content: msg,showCancel: false,confirmText: '我知道了',confirmColor: '#FFA404',success(res) {if (res.confirm) {//重新加载退款待处理列表that.getRefundList();}}})},

微信小程序-退款业务相关推荐

微信小程序退款功能(详解完整)
微信小程序支付->退款微信小程序退款的时候如果是线上,就会涉及到Linux读取打包后项目存放文件路径失败问题,获取不到其中的微信退款证书,在这里就需要使用流的方式进行读取路径,经大佬指点才最终 ...
微信小程序-点赞业务实现
微信小程序-点赞业务实现这里写目录标题微信小程序-点赞业务实现一.效果二.实现 1.逻辑 2.wxml 3.js 一.效果二.实现 1.逻辑 1.从登录界面时,用户数据已经缓存到本地,在on ...
微信小程序-评论业务的实现
微信小程序-评论业务的实现目录微信小程序-评论业务的实现一.效果二.实现 1.wxml 2.js 3.wxss 一.效果二.实现 1.wxml <!-- wx:index = &quo ...
.NET Core 微信小程序退款——（统一退款）
点击上方"dotNET名人堂",选择"设为星标" 用学习的姿态,步入工作的状态继上一篇".NET Core 微信小程序支付--(统一下单)后&quo ...
微信小程序退款流程详解
原创 Dr Hydra 码农参上 2020-11-29 11:00 收录于合集#微信开发技术3个在上一篇中我们介绍了微信小程序的支付流程,这一篇接着讲一下小程序的退款流程,首先看一下官方给出的介绍: ...
微信小程序退款证书
注意不是商户号中的安全控件和操作证书 http://kf.qq.com/faq/161222NneAJf161222U7fARv.html 什么是API证书?如何获取API证书? 一.什么是API证书 ...
微信小程序业务好（做）跑吗?我想做小程序代理业务
微信小程序业务好(做)跑吗 ? 说真的你得看当地市场是个什么样的环境,如果你本地商场的商家都对微信小程序不温不火,漠不关心的话,你再怎么苦口婆心,说一大堆的好处,我相信他们还是会无动于衷的,这种市场跑 ...
（附源码）springboot基于微信小程序的校园外卖系统毕业设计091024
Springboot基于微信小程序的校园外卖系统摘要随着生活质量的日益改善以及生活节奏的日益加快,人们对餐饮需求的质量以及速度也随之发生着变化.为了满足社会需求,餐饮的高质量和快节奏也渐渐使电话订 ...
springboot基于微信小程序的校园外卖系统毕业设计源码091024
Springboot基于微信小程序的校园外卖系统摘要随着生活质量的日益改善以及生活节奏的日益加快,人们对餐饮需求的质量以及速度也随之发生着变化.为了满足社会需求,餐饮的高质量和快节奏也渐渐使电话订 ...

微信小程序-退款业务

一、退款业务效果

二、退款流程

三、实现

微信小程序-退款业务相关推荐

最新文章

热门文章