uniapp 电商app支付倒计时处理

62 篇文章 0 订阅

电商app支付倒计时
所有电商app支付页面都是有倒计时的,一来可以促进消费,二来可以减少恶意减库存的问题发生。
因为创建订单的时候,除了预售的商品外,实际销售的商品是需要减库存的。


一般的电商app倒计时都是30分钟或者45分钟的。

如果在此页面没有进行付款或者付款失败,则此订单会进入到待付款页面中,在那个页面还是可以进行二次支付的。此时的倒计时会延续之前的倒计时时间。如果倒计时到了0,则此订单默认为交易失败,订单关闭。

此处的解决方法如下:

创建订单时,默认是30分钟倒计时。
创建订单成功后,如果未支付状态,则后台接口需要返回一个时间戳时间,在此时间戳的时间基础上进行倒计时处理。
onLoad(options) {
    // 这个expirationTime是从待支付列表中点击支付按钮传递过来的时间戳参数
    this.expirationTime = options.expirationTime;
    // 如果没有这个时间戳参数,则代表是从创建订单的时候进入的此支付页面,默认为4500000时间。
    var result = 45000000;
    if(options.expirationTime){
        var now=new Date();
        var end=new Date(options.expirationTime); 
        // 用当前的时间与时间戳时间比较,如果到了时间戳时间,则代表倒计时结束,交易失败。
        if(end-now > 45000000){
            result=45000000;
        }else{
            result=Math.floor(end-now);
        }
    }
    this.runBack(result);
},
methods:{
runBack(cm) {
 if (cm > 0) {
    cm > 60000? 
    (this.rocallTime =(new Date(cm).getMinutes() < 10? "0" + new Date(cm).getMinutes(): new Date(cm).getMinutes()) + ":" + (new Date(cm).getSeconds() < 10? "0" + new Date(cm).getSeconds(): new Date(cm).getSeconds()))
    : 
    (this.rocallTime ="00:" +(new Date(cm).getSeconds() < 10 ? "0" + new Date(cm).getSeconds(): new Date(cm).getSeconds()));
    let _msThis = this;
    // 此处是一个递归,调用时间计时器函数,一秒时间减少一秒,一秒后继续调用当前函数,这就是函数的递归。
    setTimeout(function() {
      cm -= 1000;
      _msThis.runBack(cm);
    }, 1000);
  } else {
      this.ispay = false
  }
},
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35

————————————————
版权声明:本文为CSDN博主「yehaocheng520」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/yehaocheng520/article/details/108995871

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值