create-weapp-vite 2.0.30 → 2.0.32

package/templates/wevu-retail/src/pages/order/order-confirm/index.vue

@@ -0,0 +1,707 @@
+<script lang="ts">
+import Toast from 'tdesign-miniprogram/toast/index';
+import { fetchSettleDetail } from '../../../services/order/orderConfirm';
+import { commitPay, wechatPayOrder } from './pay';
+import { getAddressPromise } from '../../../services/address/list';
+
+const stripeImg = `https://tdesign.gtimg.com/miniprogram/template/retail/order/stripe.png`;
+
+Page({
+  data: {
+    placeholder: '备注信息',
+    stripeImg,
+    loading: false,
+    settleDetailData: {
+      storeGoodsList: [], //正常下单商品列表
+      outOfStockGoodsList: [], //库存不足商品
+      abnormalDeliveryGoodsList: [], // 不能正常配送商品
+      inValidGoodsList: [], // 失效或者库存不足
+      limitGoodsList: [], //限购商品
+      couponList: [], //门店优惠券信息
+    }, // 获取结算页详情 data
+    orderCardList: [], // 仅用于商品卡片展示
+    couponsShow: false, // 显示优惠券的弹框
+    invoiceData: {
+      email: '', // 发票发送邮箱
+      buyerTaxNo: '', // 税号
+      invoiceType: null, // 开票类型  1：增值税专用发票； 2：增值税普通发票； 3：增值税电子发票；4：增值税卷式发票；5：区块链电子发票。
+      buyerPhone: '', //手机号
+      buyerName: '', //个人或公司名称
+      titleType: '', // 发票抬头 1-公司 2-个人
+      contentType: '', //发票内容 1-明细 2-类别
+    },
+    goodsRequestList: [],
+    userAddressReq: null,
+    popupShow: false, // 不在配送范围 失效 库存不足 商品展示弹框
+    notesPosition: 'center',
+    storeInfoList: [],
+    storeNoteIndex: 0, //当前填写备注门店index
+    promotionGoodsList: [], //当前门店商品列表(优惠券)
+    couponList: [], //当前门店所选优惠券
+    submitCouponList: [], //所有门店所选优惠券
+    currentStoreId: null, //当前优惠券storeId
+    userAddress: null,
+  },
+
+  payLock: false,
+  noteInfo: [],
+  tempNoteInfo: [],
+  onLoad(options) {
+    this.setData({
+      loading: true,
+    });
+    this.handleOptionsParams(options);
+  },
+  onShow() {
+    const invoiceData = wx.getStorageSync('invoiceData');
+    if (invoiceData) {
+      //处理发票
+      this.invoiceData = invoiceData;
+      this.setData({
+        invoiceData,
+      });
+      wx.removeStorageSync('invoiceData');
+    }
+  },
+
+  init() {
+    this.setData({
+      loading: true,
+    });
+    const { goodsRequestList } = this;
+    this.handleOptionsParams({ goodsRequestList });
+  },
+  // 处理不同情况下跳转到结算页时需要的参数
+  handleOptionsParams(options, couponList) {
+    let { goodsRequestList } = this; // 商品列表
+    let { userAddressReq } = this; // 收货地址
+
+    const storeInfoList = []; // 门店列表
+    // 如果是从地址选择页面返回，则使用地址显选择页面新选择的地址去获取结算数据
+    if (options.userAddressReq) {
+      userAddressReq = options.userAddressReq;
+    }
+    if (options.type === 'cart') {
+      // 从购物车跳转过来时，获取传入的商品列表数据
+      const goodsRequestListJson = wx.getStorageSync('order.goodsRequestList');
+      goodsRequestList = JSON.parse(goodsRequestListJson);
+    } else if (typeof options.goodsRequestList === 'string') {
+      goodsRequestList = JSON.parse(options.goodsRequestList);
+    }
+    //获取结算页请求数据列表
+    const storeMap = {};
+    goodsRequestList.forEach((goods) => {
+      if (!storeMap[goods.storeId]) {
+        storeInfoList.push({
+          storeId: goods.storeId,
+          storeName: goods.storeName,
+        });
+        storeMap[goods.storeId] = true;
+      }
+    });
+    this.goodsRequestList = goodsRequestList;
+    this.storeInfoList = storeInfoList;
+    const params = {
+      goodsRequestList,
+      storeInfoList,
+      userAddressReq,
+      couponList,
+    };
+    fetchSettleDetail(params).then(
+      (res) => {
+        this.setData({
+          loading: false,
+        });
+        this.initData(res.data);
+      },
+      () => {
+        //接口异常处理
+        this.handleError();
+      },
+    );
+  },
+  initData(resData) {
+    // 转换商品卡片显示数据
+    const data = this.handleResToGoodsCard(resData);
+    this.userAddressReq = resData.userAddress;
+
+    if (resData.userAddress) {
+      this.setData({ userAddress: resData.userAddress });
+    }
+    this.setData({ settleDetailData: data });
+    this.isInvalidOrder(data);
+  },
+
+  isInvalidOrder(data) {
+    // 失效 不在配送范围 限购的商品 提示弹窗
+    if (
+      (data.limitGoodsList && data.limitGoodsList.length > 0) ||
+      (data.abnormalDeliveryGoodsList && data.abnormalDeliveryGoodsList.length > 0) ||
+      (data.inValidGoodsList && data.inValidGoodsList.length > 0)
+    ) {
+      this.setData({ popupShow: true });
+      return true;
+    }
+    this.setData({ popupShow: false });
+    if (data.settleType === 0) {
+      return true;
+    }
+    return false;
+  },
+
+  handleError() {
+    Toast({
+      context: this,
+      selector: '#t-toast',
+      message: '结算异常, 请稍后重试',
+      duration: 2000,
+      icon: '',
+    });
+
+    setTimeout(() => {
+      wx.navigateBack();
+    }, 1500);
+    this.setData({
+      loading: false,
+    });
+  },
+  getRequestGoodsList(storeGoodsList) {
+    const filterStoreGoodsList = [];
+    storeGoodsList &&
+      storeGoodsList.forEach((store) => {
+        const { storeName } = store;
+        store.skuDetailVos &&
+          store.skuDetailVos.forEach((goods) => {
+            const data = goods;
+            data.storeName = storeName;
+            filterStoreGoodsList.push(data);
+          });
+      });
+    return filterStoreGoodsList;
+  },
+  handleGoodsRequest(goods, isOutStock = false) {
+    const { reminderStock, quantity, storeId, uid, saasId, spuId, goodsName, skuId, storeName, roomId } = goods;
+    const resQuantity = isOutStock ? reminderStock : quantity;
+    return {
+      quantity: resQuantity,
+      storeId,
+      uid,
+      saasId,
+      spuId,
+      goodsName,
+      skuId,
+      storeName,
+      roomId,
+    };
+  },
+  handleResToGoodsCard(data) {
+    // 转换数据 符合 goods-card展示
+    const orderCardList = []; // 订单卡片列表
+    const storeInfoList = [];
+    const submitCouponList = []; //使用优惠券列表;
+
+    data.storeGoodsList &&
+      data.storeGoodsList.forEach((ele) => {
+        const orderCard = {
+          id: ele.storeId,
+          storeName: ele.storeName,
+          status: 0,
+          statusDesc: '',
+          amount: ele.storeTotalPayAmount,
+          goodsList: [],
+        }; // 订单卡片
+        ele.skuDetailVos.forEach((item, index) => {
+          orderCard.goodsList.push({
+            id: index,
+            thumb: item.image,
+            title: item.goodsName,
+            specs: item.skuSpecLst.map((s) => s.specValue), // 规格列表 string[]
+            price: item.tagPrice || item.settlePrice || '0', // 优先取限时活动价
+            settlePrice: item.settlePrice,
+            titlePrefixTags: item.tagText ? [{ text: item.tagText }] : [],
+            num: item.quantity,
+            skuId: item.skuId,
+            spuId: item.spuId,
+            storeId: item.storeId,
+          });
+        });
+
+        storeInfoList.push({
+          storeId: ele.storeId,
+          storeName: ele.storeName,
+          remark: '',
+        });
+        submitCouponList.push({
+          storeId: ele.storeId,
+          couponList: ele.couponList || [],
+        });
+        this.noteInfo.push('');
+        this.tempNoteInfo.push('');
+        orderCardList.push(orderCard);
+      });
+
+    this.setData({ orderCardList, storeInfoList, submitCouponList });
+    return data;
+  },
+  onGotoAddress() {
+    /** 获取一个Promise */
+    getAddressPromise()
+      .then((address) => {
+        this.handleOptionsParams({
+          userAddressReq: { ...address, checked: true },
+        });
+      })
+      .catch(() => {});
+
+    const { userAddressReq } = this; // 收货地址
+
+    let id = '';
+
+    if (userAddressReq?.id) {
+      id = `&id=${userAddressReq.id}`;
+    }
+
+    wx.navigateTo({
+      url: `/pages/user/address/list/index?selectMode=1&isOrderSure=1${id}`,
+    });
+  },
+  onNotes(e) {
+    const { storenoteindex: storeNoteIndex } = e.currentTarget.dataset;
+    // 添加备注信息
+    this.setData({
+      dialogShow: true,
+      storeNoteIndex,
+    });
+  },
+  onInput(e) {
+    const { storeNoteIndex } = this.data;
+    this.noteInfo[storeNoteIndex] = e.detail.value;
+  },
+  onBlur() {
+    this.setData({
+      notesPosition: 'center',
+    });
+  },
+  onFocus() {
+    this.setData({
+      notesPosition: 'self',
+    });
+  },
+  onTap() {
+    this.setData({
+      placeholder: '',
+    });
+  },
+  onNoteConfirm() {
+    // 备注信息 确认按钮
+    const { storeInfoList, storeNoteIndex } = this.data;
+    this.tempNoteInfo[storeNoteIndex] = this.noteInfo[storeNoteIndex];
+    storeInfoList[storeNoteIndex].remark = this.noteInfo[storeNoteIndex];
+
+    this.setData({
+      dialogShow: false,
+      storeInfoList,
+    });
+  },
+  onNoteCancel() {
+    // 备注信息 取消按钮
+    const { storeNoteIndex } = this.data;
+    this.noteInfo[storeNoteIndex] = this.tempNoteInfo[storeNoteIndex];
+    this.setData({
+      dialogShow: false,
+    });
+  },
+
+  onSureCommit() {
+    // 商品库存不足继续结算
+    const { settleDetailData } = this.data;
+    const { outOfStockGoodsList, storeGoodsList, inValidGoodsList } = settleDetailData;
+    if ((outOfStockGoodsList && outOfStockGoodsList.length > 0) || (inValidGoodsList && storeGoodsList)) {
+      // 合并正常商品 和 库存 不足商品继续支付
+      // 过滤不必要的参数
+      const filterOutGoodsList = [];
+      outOfStockGoodsList &&
+        outOfStockGoodsList.forEach((outOfStockGoods) => {
+          const { storeName } = outOfStockGoods;
+          outOfStockGoods.unSettlementGoods.forEach((ele) => {
+            const data = ele;
+            data.quantity = ele.reminderStock;
+            data.storeName = storeName;
+            filterOutGoodsList.push(data);
+          });
+        });
+      const filterStoreGoodsList = this.getRequestGoodsList(storeGoodsList);
+      const goodsRequestList = filterOutGoodsList.concat(filterStoreGoodsList);
+      this.handleOptionsParams({ goodsRequestList });
+    }
+  },
+  // 提交订单
+  submitOrder() {
+    const { settleDetailData, userAddressReq, invoiceData, storeInfoList, submitCouponList } = this.data;
+    const { goodsRequestList } = this;
+
+    if (!userAddressReq && !settleDetailData.userAddress) {
+      Toast({
+        context: this,
+        selector: '#t-toast',
+        message: '请添加收货地址',
+        duration: 2000,
+        icon: 'help-circle',
+      });
+
+      return;
+    }
+    if (this.payLock || !settleDetailData.settleType || !settleDetailData.totalAmount) {
+      return;
+    }
+    this.payLock = true;
+    const resSubmitCouponList = this.handleCouponList(submitCouponList);
+    const params = {
+      userAddressReq: settleDetailData.userAddress || userAddressReq,
+      goodsRequestList: goodsRequestList,
+      userName: settleDetailData.userAddress.name || userAddressReq.name,
+      totalAmount: settleDetailData.totalPayAmount, //取优惠后的结算金额
+      invoiceRequest: null,
+      storeInfoList,
+      couponList: resSubmitCouponList,
+    };
+    if (invoiceData && invoiceData.email) {
+      params.invoiceRequest = invoiceData;
+    }
+    commitPay(params).then(
+      (res) => {
+        this.payLock = false;
+        const { data } = res;
+        // 提交出现 失效 不在配送范围 限购的商品 提示弹窗
+        if (this.isInvalidOrder(data)) {
+          return;
+        }
+        if (res.code === 'Success') {
+          this.handlePay(data, settleDetailData);
+        } else {
+          Toast({
+            context: this,
+            selector: '#t-toast',
+            message: res.msg || '提交订单超时，请稍后重试',
+            duration: 2000,
+            icon: '',
+          });
+          setTimeout(() => {
+            // 提交支付失败   返回购物车
+            wx.navigateBack();
+          }, 2000);
+        }
+      },
+      (err) => {
+        this.payLock = false;
+        if (err.code === 'CONTAINS_INSUFFICIENT_GOODS' || err.code === 'TOTAL_AMOUNT_DIFFERENT') {
+          Toast({
+            context: this,
+            selector: '#t-toast',
+            message: err.msg || '支付异常',
+            duration: 2000,
+            icon: '',
+          });
+          this.init();
+        } else if (err.code === 'ORDER_PAY_FAIL') {
+          Toast({
+            context: this,
+            selector: '#t-toast',
+            message: '支付失败',
+            duration: 2000,
+            icon: 'close-circle',
+          });
+          setTimeout(() => {
+            wx.redirectTo({ url: '/pages/order/order-list/index' });
+          });
+        } else if (err.code === 'ILLEGAL_CONFIG_PARAM') {
+          Toast({
+            context: this,
+            selector: '#t-toast',
+            message: '支付失败，微信支付商户号设置有误，请商家重新检查支付设置。',
+            duration: 2000,
+            icon: 'close-circle',
+          });
+          setTimeout(() => {
+            wx.redirectTo({ url: '/pages/order/order-list/index' });
+          });
+        } else {
+          Toast({
+            context: this,
+            selector: '#t-toast',
+            message: err.msg || '提交支付超时，请稍后重试',
+            duration: 2000,
+            icon: '',
+          });
+          setTimeout(() => {
+            // 提交支付失败  返回购物车
+            wx.navigateBack();
+          }, 2000);
+        }
+      },
+    );
+  },
+
+  // 处理支付
+  handlePay(data, settleDetailData) {
+    const { channel, payInfo, tradeNo, interactId, transactionId } = data;
+    const { totalAmount, totalPayAmount } = settleDetailData;
+    const payOrderInfo = {
+      payInfo: payInfo,
+      orderId: tradeNo,
+      orderAmt: totalAmount,
+      payAmt: totalPayAmount,
+      interactId: interactId,
+      tradeNo: tradeNo,
+      transactionId: transactionId,
+    };
+
+    if (channel === 'wechat') {
+      wechatPayOrder(payOrderInfo);
+    }
+  },
+
+  hide() {
+    // 隐藏 popup
+    this.setData({
+      'settleDetailData.abnormalDeliveryGoodsList': [],
+    });
+  },
+  onReceipt() {
+    // 跳转 开发票
+    const invoiceData = this.invoiceData || {};
+    wx.navigateTo({
+      url: `/pages/order/receipt/index?invoiceData=${JSON.stringify(invoiceData)}`,
+    });
+  },
+
+  onCoupons(e) {
+    const { submitCouponList, currentStoreId } = this.data;
+    const { goodsRequestList } = this;
+    const { selectedList } = e.detail;
+    const tempSubmitCouponList = submitCouponList.map((storeCoupon) => {
+      return {
+        couponList: storeCoupon.storeId === currentStoreId ? selectedList : storeCoupon.couponList,
+      };
+    });
+    const resSubmitCouponList = this.handleCouponList(tempSubmitCouponList);
+    //确定选择优惠券
+    this.handleOptionsParams({ goodsRequestList }, resSubmitCouponList);
+    this.setData({ couponsShow: false });
+  },
+  onOpenCoupons(e) {
+    const { storeid } = e.currentTarget.dataset;
+    this.setData({
+      couponsShow: true,
+      currentStoreId: storeid,
+    });
+  },
+
+  handleCouponList(storeCouponList) {
+    //处理门店优惠券   转换成接口需要
+    if (!storeCouponList) return [];
+    const resSubmitCouponList = [];
+    storeCouponList.forEach((ele) => {
+      resSubmitCouponList.push(...ele.couponList);
+    });
+    return resSubmitCouponList;
+  },
+
+  onGoodsNumChange(e) {
+    const {
+      detail: { value },
+      currentTarget: {
+        dataset: { goods },
+      },
+    } = e;
+    const index = this.goodsRequestList.findIndex(
+      ({ storeId, spuId, skuId }) => goods.storeId === storeId && goods.spuId === spuId && goods.skuId === skuId,
+    );
+    if (index >= 0) {
+      // eslint-disable-next-line no-confusing-arrow
+      const goodsRequestList = this.goodsRequestList.map((item, i) =>
+        i === index ? { ...item, quantity: value } : item,
+      );
+      this.handleOptionsParams({ goodsRequestList });
+    }
+  },
+
+  onPopupChange() {
+    this.setData({
+      popupShow: !this.data.popupShow,
+    });
+  },
+});
+</script>
+
+<template>
+<wxs module="order" src="./order.wxs" />
+
+<wxs module="handleInvoice" src="./handleInvoice.wxs" />
+<wxs module="getNotes" src="./getNotes.wxs" />
+<view class="order-sure [box-sizing:border-box] [background:#f6f6f6] [padding:24rpx_0_calc(env(safe-area-inset-bottom)_+_136rpx)] [min-height:100vh] [&_.wx-pay-cover]:[position:fixed] [&_.wx-pay-cover]:[left:0] [&_.wx-pay-cover]:[bottom:0] [&_.wx-pay-cover]:[right:0] [&_.wx-pay-cover]:[z-index:10] [&_.wx-pay-cover]:[background:#fff] [&_.wx-pay-cover]:[height:112rpx] [&_.wx-pay-cover]:[padding-bottom:env(safe-area-inset-bottom)] [&_.wx-pay-cover_.wx-pay]:[width:100%] [&_.wx-pay-cover_.wx-pay]:[height:100rpx] [&_.wx-pay-cover_.wx-pay]:[box-sizing:border-box] [&_.wx-pay-cover_.wx-pay]:[padding:0rpx_32rpx] [&_.wx-pay-cover_.wx-pay]:[display:flex] [&_.wx-pay-cover_.wx-pay]:[justify-content:space-between] [&_.wx-pay-cover_.wx-pay]:[align-items:center] [&_.wx-pay-cover_.wx-pay_.price]:[color:#fa4126] [&_.wx-pay-cover_.wx-pay_.price]:[font-weight:bold] [&_.wx-pay-cover_.wx-pay_.price]:[font-size:63rpx] [&_.wx-pay-cover_.wx-pay_.price]:[line-height:88rpx] [&_.wx-pay-cover_.wx-pay_.submit-btn]:[height:80rpx] [&_.wx-pay-cover_.wx-pay_.submit-btn]:[width:240rpx] [&_.wx-pay-cover_.wx-pay_.submit-btn]:[border-radius:40rpx] [&_.wx-pay-cover_.wx-pay_.submit-btn]:[background-color:#fa4126] [&_.wx-pay-cover_.wx-pay_.submit-btn]:[color:#ffffff] [&_.wx-pay-cover_.wx-pay_.submit-btn]:[line-height:80rpx] [&_.wx-pay-cover_.wx-pay_.submit-btn]:[font-weight:bold] [&_.wx-pay-cover_.wx-pay_.submit-btn]:[font-size:28rpx] [&_.wx-pay-cover_.wx-pay_.submit-btn]:[text-align:center] [&_.wx-pay-cover_.wx-pay_.btn-gray]:[background:#cccccc] [&_.pay-detail]:[background-color:#ffffff] [&_.pay-detail]:[padding:16rpx_32rpx] [&_.pay-detail]:[width:100%] [&_.pay-detail]:[box-sizing:border-box] [&_.pay-detail_.pay-item]:[width:100%] [&_.pay-detail_.pay-item]:[height:72rpx] [&_.pay-detail_.pay-item]:[display:flex] [&_.pay-detail_.pay-item]:[align-items:center] [&_.pay-detail_.pay-item]:[justify-content:space-between] [&_.pay-detail_.pay-item]:[font-size:26rpx] [&_.pay-detail_.pay-item]:[line-height:36rpx] [&_.pay-detail_.pay-item]:[color:#666666] [&_.pay-detail_.pay-item_.pay-item__right]:[color:#333333] [&_.pay-detail_.pay-item_.pay-item__right]:[font-size:24rpx] [&_.pay-detail_.pay-item_.pay-item__right]:[display:flex] [&_.pay-detail_.pay-item_.pay-item__right]:[align-items:center] [&_.pay-detail_.pay-item_.pay-item__right]:[justify-content:flex-end] [&_.pay-detail_.pay-item_.pay-item__right]:[max-width:400rpx] [&_.pay-detail_.pay-item_.pay-item__right_.pay-remark]:[display:-webkit-box] [&_.pay-detail_.pay-item_.pay-item__right_.pay-remark]:[-webkit-box-orient:vertical] [&_.pay-detail_.pay-item_.pay-item__right_.pay-remark]:[-webkit-line-clamp:2] [&_.pay-detail_.pay-item_.pay-item__right_.pay-remark]:[max-width:400rpx] [&_.pay-detail_.pay-item_.pay-item__right_.pay-remark]:[text-overflow:ellipsis] [&_.pay-detail_.pay-item_.pay-item__right_.pay-remark]:[overflow:hidden] [&_.pay-detail_.pay-item_.font-bold]:[font-weight:bold] [&_.pay-detail_.pay-item_.primary]:[color:#fa4126] [&_.add-notes_.dialog__message]:[border-radius:8rpx] [&_.amount-wrapper]:[width:100%] [&_.amount-wrapper]:[box-sizing:border-box] [&_.amount-wrapper]:[background-color:#ffffff] [&_.amount-wrapper]:[padding:0rpx_32rpx] [&_.amount-wrapper]:[height:96rpx] [&_.pay-amount]:[width:100%] [&_.pay-amount]:[height:96rpx] [&_.pay-amount]:[display:flex] [&_.pay-amount]:[align-items:center] [&_.pay-amount]:[justify-content:flex-end] [&_.pay-amount]:[font-size:28rpx] [&_.pay-amount]:[color:#333333] [&_.pay-amount]:[position:relative] [&_.pay-amount_.order-num]:[color:#999999] [&_.pay-amount_.order-num]:[padding-right:8rpx] [&_.pay-amount_.total-price]:[font-size:36rpx] [&_.pay-amount_.total-price]:[color:#fa4126] [&_.pay-amount_.total-price]:[font-weight:bold] [&_.pay-amount_.total-price]:[padding-left:8rpx]" wx:if="{{!loading}}">
+  <address-card addressData="{{userAddress}}" bind:addclick="onGotoAddress" bind:addressclick="onGotoAddress" />
+  <view
+    class="order-wrapper [&_.store-wrapper]:[width:100%] [&_.store-wrapper]:[height:96rpx] [&_.store-wrapper]:[box-sizing:border-box] [&_.store-wrapper]:[padding:0_32rpx] [&_.store-wrapper]:[display:flex] [&_.store-wrapper]:[align-items:center] [&_.store-wrapper]:[font-size:28rpx] [&_.store-wrapper]:[line-height:40rpx] [&_.store-wrapper]:[color:#333333] [&_.store-wrapper]:[background-color:#ffffff] [&_.store-wrapper_.store-logo]:[margin-right:16rpx] [&_.goods-wrapper]:[width:100%] [&_.goods-wrapper]:[box-sizing:border-box] [&_.goods-wrapper]:[padding:16rpx_32rpx] [&_.goods-wrapper]:[display:flex] [&_.goods-wrapper]:[align-items:flex-start] [&_.goods-wrapper]:[justify-content:space-between] [&_.goods-wrapper]:[font-size:24rpx] [&_.goods-wrapper]:[line-height:32rpx] [&_.goods-wrapper]:[color:#999999] [&_.goods-wrapper]:[background-color:#ffffff]"
+    wx:for="{{settleDetailData.storeGoodsList}}"
+    wx:for-item="stores"
+    wx:for-index="storeIndex"
+    wx:key="storeIndex"
+  >
+    <view class="store-wrapper">
+      <t-icon prefix="wr" size="40rpx" color="#333333" name="store" class="store-logo" />
+      {{stores.storeName}}
+    </view>
+    <view
+      wx:if="{{orderCardList[storeIndex].goodsList.length > 0}}"
+      wx:for="{{orderCardList[storeIndex].goodsList}}"
+      wx:for-item="goods"
+      wx:for-index="gIndex"
+      wx:key="id"
+      class="goods-wrapper [&_.goods-image]:[width:176rpx] [&_.goods-image]:[height:176rpx] [&_.goods-image]:[border-radius:8rpx] [&_.goods-image]:[overflow:hidden] [&_.goods-image]:[margin-right:16rpx] [&_.goods-content]:[flex:1] [&_.goods-content_.goods-title]:[display:-webkit-box] [&_.goods-content_.goods-title]:[-webkit-box-orient:vertical] [&_.goods-content_.goods-title]:[-webkit-line-clamp:2] [&_.goods-content_.goods-title]:[overflow:hidden] [&_.goods-content_.goods-title]:[text-overflow:ellipsis] [&_.goods-content_.goods-title]:[font-size:28rpx] [&_.goods-content_.goods-title]:[line-height:40rpx] [&_.goods-content_.goods-title]:[margin-bottom:12rpx] [&_.goods-content_.goods-title]:[color:#333333] [&_.goods-content_.goods-title]:[margin-right:16rpx] [&_.goods-right]:[min-width:128rpx] [&_.goods-right]:[display:flex] [&_.goods-right]:[flex-direction:column] [&_.goods-right]:[align-items:flex-end]"
+    >
+      <t-image src="{{goods.thumb}}" t-class="goods-image" mode="aspectFill" />
+      <view class="goods-content">
+        <view class="goods-title">{{goods.title}}</view>
+        <view>{{goods.specs}}</view>
+      </view>
+      <view class="goods-right [&_.goods-price]:[color:#333333] [&_.goods-price]:[font-size:32rpx] [&_.goods-price]:[line-height:48rpx] [&_.goods-price]:[font-weight:bold] [&_.goods-price]:[margin-bottom:16rpx] [&_.goods-num]:[text-align:right]">
+        <price wr-class="goods-price" price="{{goods.price}}" fill="{{true}}" decimalSmaller />
+        <view class="goods-num">x{{goods.num}}</view>
+      </view>
+    </view>
+  </view>
+  <view class="pay-detail">
+    <view class="pay-item">
+      <text>商品总额</text>
+      <price
+        fill
+        decimalSmaller
+        wr-class="pay-item__right font-bold"
+        price="{{settleDetailData.totalSalePrice || '0'}}"
+      />
+    </view>
+    <view class="pay-item">
+      <text>运费</text>
+      <view class="pay-item__right font-bold">
+        <block wx:if="{{settleDetailData.totalDeliveryFee && settleDetailData.totalDeliveryFee != 0}}">
+          +
+          <price fill decimalSmaller price="{{settleDetailData.totalDeliveryFee}}" />
+        </block>
+        <text wx:else>免运费</text>
+      </view>
+    </view>
+    <view class="pay-item">
+      <text>活动优惠</text>
+      <view class="pay-item__right primary font-bold">
+        -
+        <price fill price="{{settleDetailData.totalPromotionAmount || 0}}" />
+      </view>
+    </view>
+    <view class="pay-item">
+      <text>优惠券</text>
+      <view
+        class="pay-item__right"
+        data-storeid="{{settleDetailData.storeGoodsList[0].storeId}}"
+        catchtap="onOpenCoupons"
+      >
+        <block wx:if="{{submitCouponList.length}}">
+          <block wx:if="{{settleDetailData.totalCouponAmount && settleDetailData.totalCouponAmount !== '0'}}">
+            -<price fill decimalSmaller price="{{settleDetailData.totalCouponAmount}}" />
+          </block>
+          <block wx:else>选择优惠券</block>
+        </block>
+        <text wx:else>无可用</text>
+        <t-icon name="chevron-right" size="32rpx" color="#BBBBBB" />
+      </view>
+    </view>
+    <view class="pay-item" wx:if="{{settleDetailData.invoiceSupport}}">
+      <text>发票</text>
+      <view class="pay-item__right" catchtap="onReceipt">
+        <text>{{handleInvoice(invoiceData)}}</text>
+        <t-icon name="chevron-right" size="32rpx" color="#BBBBBB" />
+      </view>
+    </view>
+    <view class="pay-item">
+      <text>订单备注</text>
+      <view class="pay-item__right" data-storenoteindex="{{0}}" catchtap="onNotes">
+        <text class="pay-remark"
+          >{{getNotes(storeInfoList, 0) ? getNotes(storeInfoList, 0) :'选填，建议先和商家沟通确认'}}</text
+        >
+        <t-icon name="chevron-right" size="32rpx" color="#BBBBBB" />
+      </view>
+    </view>
+  </view>
+  <view class="amount-wrapper">
+    <view class="pay-amount">
+      <text class="order-num">共{{settleDetailData.totalGoodsCount}}件</text>
+      <text>小计</text>
+      <price class="total-price" price="{{settleDetailData.totalPayAmount}}" fill="{{false}}" decimalSmaller />
+    </view>
+  </view>
+  <view class="wx-pay-cover">
+    <view class="wx-pay">
+      <price decimalSmaller fill class="price" price="{{settleDetailData.totalPayAmount || '0'}}" />
+      <view class="submit-btn {{ settleDetailData.settleType === 1 ? '':'btn-gray'}}" bindtap="submitOrder">
+        提交订单
+      </view>
+    </view>
+  </view>
+  <t-dialog
+    t-class="add-notes [&_.t-textarea__placeholder]:[color:#aeb3b7] [&_.add-notes__textarea__font]:[font-size:26rpx] [&_.add-notes__textarea]:[margin-top:32rpx]"
+    title="填写备注信息"
+    visible="{{dialogShow}}"
+    confirm-btn="确认"
+    cancel-btn="取消"
+    t-class-content="add-notes__content"
+    t-class-confirm="dialog__button-confirm"
+    t-class-cancel="dialog__button-cancel"
+    bindconfirm="onNoteConfirm"
+    bindcancel="onNoteCancel"
+  >
+    <t-textarea
+      slot="content"
+      focus="{{dialogShow}}"
+      class="notes"
+      t-class="add-notes__textarea"
+      value="{{storeInfoList[storeNoteIndex] && storeInfoList[storeNoteIndex].remark}}"
+      placeholder="备注信息"
+      t-class-textarea="add-notes__textarea__font"
+      bindfocus="onFocus"
+      bindblur="onBlur"
+      bindchange="onInput"
+      maxlength="{{50}}"
+    />
+  </t-dialog>
+  <t-popup visible="{{popupShow}}" placement="bottom" bind:visible-change="onPopupChange">
+    <no-goods slot="content" bind:change="onSureCommit" settleDetailData="{{settleDetailData}}" />
+  </t-popup>
+  <select-coupons
+    bind:sure="onCoupons"
+    storeId="{{currentStoreId}}"
+    orderSureCouponList="{{couponList}}"
+    promotionGoodsList="{{promotionGoodsList}}"
+    couponsShow="{{couponsShow}}"
+  />
+</view>
+<t-toast id="t-toast" />
+<t-dialog id="t-dialog" />
+</template>
+
+<json>
+{
+  "navigationBarTitleText": "订单确认",
+  "usingComponents": {
+    "t-popup": "tdesign-miniprogram/popup/popup",
+    "t-toast": "tdesign-miniprogram/toast/toast",
+    "t-icon": "tdesign-miniprogram/icon/icon",
+    "t-cell": "tdesign-miniprogram/cell/cell",
+    "t-dialog": "tdesign-miniprogram/dialog/dialog",
+    "t-textarea": "tdesign-miniprogram/textarea/textarea",
+    "price": "/components/price/index",
+    "select-coupons": "../components/selectCoupons/selectCoupons",
+    "no-goods": "../components/noGoods/noGoods",
+    "t-image": "/components/webp-image/index",
+    "address-card": "./components/address-card/index"
+  }
+}</json>