qingcheng-xiaochengxu/pages/course/courseOrderList/courseOrderList.js

import { baseUrl } from "../../../request";

// pages/course/courseOrderList/courseOrderList.js
Page({
  data: {
    orderList: [],              // 后端返回的订单列表
    hasModalShown: false,   // 弹框只显示一次
    isMaskVisible: false
  },

  onLoad(options) {
    this.fetchOrders();
  },
  onHide() {
    clearInterval(this._timer);
  },
  onUnload() {
    clearInterval(this._timer);
  },
  onShow() {
    this.fetchOrders()
  },

  // 拉取后端接口
  fetchOrders() {
    wx.request({
      url: baseUrl + '/courseOrder/query/list',  // 替换为真实接口
      method: 'POST',
      header: {
        Authorization: wx.getStorageSync('token')
      },
      success: res => {
        console.log('课程订单列表---->',res.data.data);
        if (res.data.code === 1) {
          const now = Date.now();
          let list = res.data.data.map(item => {
            // 计算从 createTime 到 now 剩余秒数
            const createMs = new Date(item.createTime.replace(/-/g,'/')).getTime();
            let diff = Math.floor((createMs + 15*60*1000 - now) / 1000);

            // 只有“待支付”才需要倒计时、过期置“交易取消”
            if (item.orderStatus === '待支付') {
              if (diff <= 0) {
                item.orderStatus = '交易取消';
                diff = 0;
                // 首次检测到过期就弹框
                if (!this.data.hasModalShown) {
                  wx.showModal({
                    title: '提示',
                    content: '订单超时未支付，已取消',
                    showCancel: false
                  });
                  this.setData({ hasModalShown: true });
                }
              }
              item.countDown = diff;
              const m = Math.floor(diff / 60);
              const s = diff % 60;
              item.countDownStr = `${m}分${s < 10 ? '0'+s : s}秒`;
            } else {
              item.countDown = 0;
              item.countDownStr = '';
            }
            return item;
          });

          this.setData({ orderList: list }, () => {
            // 初始处理完后启动全局定时器
            this.startTimer();
          });

        } else {
          wx.showToast({ title: res.data.message || '获取失败', icon: 'none' });
        }
      },
      fail: () => {
        wx.showToast({ title: '网络错误', icon: 'none' });
      }
    });
  },

  // 每秒更新所有待支付订单的倒计时
  startTimer() {
     // ← 新增：如果已有定时器，先清掉它
     if (this._timer) {
      clearInterval(this._timer);
    }
    this._timer = setInterval(() => {
      const updated = this.data.orderList.map(item => {
        if (item.orderStatus === '待支付' && item.countDown > 0) {
          const cd = item.countDown - 1;
          item.countDown = cd;
          const m = Math.floor(cd / 60);
          const s = cd % 60;
          item.countDownStr = `${m}分${s < 10 ? '0'+s : s}秒`;

          if (cd <= 0) {
            item.orderStatus = '交易取消';
            item.countDownStr = '';
            if (!this.data.hasModalShown) {
              wx.showModal({
                title: '提示',
                content: '订单超时未支付，已取消',
                showCancel: false
              });
              this.setData({ hasModalShown: true });
            }
          }
        }
        return item;
      });
      this.setData({ orderList: updated });
    }, 1000);
  },

  showIsPayModal(e) {
    const orderId = e.currentTarget.dataset.orderId;
    wx.showModal({
      title: '下单成功',
      content: '您确定要支付吗？',
      cancelText: '取消',
      confirmText: '确定',
      success: (res) => {
        if (res.confirm) {
          this.payOrder(orderId);
        } else if (res.cancel) {
          this.setData({ isMaskVisible: false });
        }
      },
      fail: () => {
        wx.hideLoading();
        wx.showToast({
          title: '网络错误，下单失败',
          icon: 'none'
        });
      }
    });
  },
  payOrder(orderId) {
    // 同样先显示遮罩
 this.setData({ isMaskVisible: true });
   wx.showLoading({ title: '支付中...'});
   wx.request({
     url: baseUrl + '/courseOrder/payment',
     method: 'POST',
     header: { Authorization: wx.getStorageSync('token') },
     data: { id: orderId},
     success: res => {
       wx.hideLoading();
       if (res.data.code === 1) {
         // 支付成功，跳转详情页
         wx.redirectTo({
           url: `/pages/course/orderDetail/orderDetail?id=${orderId}`,
           success: res => {
               // 先把遮罩关掉
               this.setData({ isMaskVisible: false });
           }
         });
       } else {
         this.setData({ isMaskVisible: false });
         wx.showToast({ title: res.data.message || '支付失败', icon: 'none' });
       }
     },
     fail: () => {
       wx.hideLoading();
       this.setData({ isMaskVisible: false });
       wx.showToast({ title: '网络错误，支付失败', icon: 'none' });
     }
   });
 },

  // 跳转订单详情
  gotoOrderDetail(e) {
    const orderId = e.currentTarget.dataset.id;
    wx.navigateTo({
      url: `/pages/course/orderDetail/orderDetail?id=${orderId}`,
    })
  },

  // 取消订单
  cancelOrder(e) {
    // console.log(e);
    const id = e.currentTarget.dataset.id;
    wx.showModal({
      title: '取消订单',
      content: '是否要取消订单？',
      success: res => {
        if (res.confirm) {
          wx.request({
            url: baseUrl + "/courseOrder/cancel",
            method: 'POST',
            data: { courseId: id },
            header: { Authorization: wx.getStorageSync('token') },
            success: () => this.fetchOrders()
          });
        }
      }
    });
  }

});