yimei_spa/pages/orderDetail/orderDetail.wxml

<wxs module="tool" src="../../app.wxs" />
<view class="margin item-radius flex-column" style="padding: 20rpx 24rpx;" wx:if="{{ showTips }}">
  <text style="font-size: 36rpx;font-family: PingFangSC-Semibold, PingFang SC;font-weight: 600;">{{tips['status_' + detail.status][0]}}</text>
  <text style="font-size: 24rpx;color: #666666;margin: 30rpx 0 12rpx;">{{tips['status_' + detail.status][1]}}</text>
  <view wx:if="{{detail.status == 0}}" class="flex flex-align-center">
    <text style="font-size: 24rpx;color: #666666;">请在</text>
    <text style="font-size: 36rpx;font-family: PingFangSC-Medium, PingFang SC;font-weight: 500;">{{time}}</text>
    <text style="font-size: 24rpx;color: #666666;">内完成付款</text>
  </view>
</view>
<!-- <view class="order-top flex-column flex-center">
  <block wx:if="{{detail.status >= 0}}">
    <image src="/images/my/order_status_{{detail.status}}.png"></image>
    <text class="state">{{status[detail.status]}}</text>
    <block wx:if="{{ detail.status == 0 }}">
      <text>请在{{time}}秒内完成付款</text>
      <text>逾期未付款，订单将自动取消</text>
    </block>
    <block wx:if="{{detail.status == 1}}">
      <text>您的预约单已生效，请准时到店体验。</text>
      <text></text>
    </block>
    <block wx:if="{{detail.status == 2}}">
      <text>加单/退费请联系相关工作人员~</text>
    </block>
    <block wx:if="{{detail.status == 3}}">
      <text>欢迎下次光临！</text>
    </block>
  </block>
  <block wx:else>
    <image src="/images/my/order_status_-1.png"></image>
    <text class="state">已取消</text>
  </block>

</view> -->
<view class="item margin item-radius current{{current}}">
  <view class="item-top flex-align-center ">
    <text class="flex1 ellipsis" style="font-size: 36rpx;">{{detail.project_name}}</text>
    <text class="state" wx:if="{{detail.status == 0}}">待付款</text>
    <text class="state" wx:if="{{detail.status == 1}}">已预约</text>
    <text class="state" wx:if="{{detail.status == 2}}">进行中</text>
    <text class="state" wx:if="{{detail.status == 3}}">已结算</text>
    <text class="state" wx:if="{{detail.status == -1}}">已取消</text>
  </view>
  <view class="item-content flex">
    <image class="img" src="{{detail.cover_url}}"></image>
    <view class="content flex-column">
      <view class="content-text-box flex">
        <text style="color:#999;">预约店铺：</text>
        <text class="flex1 ellipsis">{{detail.store_name}}</text>
      </view>
      <view class="content-text-box flex">
        <text style="color:#999;">预约时间：</text>
        <text class="flex1 ellipsis">{{tool.replaceStr(detail.order_day)}} {{tool.replaceStr(detail.order_time)}}</text>
      </view>
      <view class="content-text-box flex">
        <text style="color:#999;">使用设备：</text>
        <text class="flex1 ellipsis">{{detail.device_name}}</text>
      </view>
      <!-- <text class="ellipsis">预约店铺：{{detail.store_name}}</text>
      <view class="flex">
        <text style="font-size:28rpx;color: #333333;">预约时间：</text>
        <text class="time">{{tool.replaceStr(detail.order_day)}} {{tool.replaceStr(detail.order_time)}}</text>
      </view> -->
      <!-- <text style="font-size: 14px;color: #333333;">预约时间：{{detail.order_day}} {{detail.order_time}}</text> -->
      <!-- <text style="font-size: 14px;color: #666666;">设备：{{detail.device_name}}</text> -->
    </view>
  </view>
  <view class="item-btn flex-align-center">
    <text style="font-size: 28rpx;color: #999;">预约费用：</text>
    <text style="font-size: 36rpx;margin-right:28rpx;">¥{{detail.original_price}}</text>
  </view>
</view>
<view class="item margin item-radius" wx:for="{{detail.products}}" wx:key="index">
  <view class="item-top flex-align-center ">
    <text class="flex1 ellipsis" style="font-size: 36rpx;">{{item.product_name}}</text>
    <text class="state" wx:if="{{item.status == 0}}">待付款</text>
    <text class="state" wx:if="{{item.status == -2}}">退款中</text>
    <text class="state" wx:if="{{item.status == -3}}">已退款</text>
    <text class="state" wx:if="{{item.status == -1}}">已取消</text>
  </view>
  <view class="item-content flex">
    <image class="img" src="{{item.cover_url}}"></image>
    <view class="content flex-column">
      <view class="content-text-box flex">
        <text style="color:#999;">预约店铺：</text>
        <text class="flex1 ellipsis">{{detail.store_name}}</text>
      </view>
      <view class="content-text-box flex">
        <text style="color:#999;">预约时间：</text>
        <text class="flex1 ellipsis">{{tool.replaceStr(detail.order_day)}} {{tool.replaceStr(detail.order_time)}}</text>
      </view>
      <view class="content-text-box flex">
        <text style="color:#999;">使用设备：</text>
        <text class="flex1 ellipsis">{{detail.device_name}}</text>
      </view>
    </view>
  </view>
  <view class="item-btn flex-align-center">
    <text style="font-size: 28rpx;color: #999;">预约费用：</text>
    <text style="font-size: 36rpx;margin-right:28rpx;">¥{{item.price}}</text>
  </view>
  <view wx:if="{{item.status == 1}}" class="item-btn flex-align-center" style="height: 100rpx; margin-top: -40rpx;">
    <text class="flex-center product-refund-btn" bindtap="onRefundProjectProductOrder" data-item="{{item}}">仅产品退款</text>
  </view>
</view>
<view class="margin order-info flex-column flex-justify-center item-radius ">
  <view class="num flex">
    <text class="ellipsis" style="margin-right: 16rpx;">订单编号：{{detail.order_sn}}</text>
    <view class="copy" bindtap="onCopyOrderNum" data-num="{{detail.order_sn}}">复制</view>
  </view>
  <text class="time">下单时间：{{detail.create_time}}</text>
  <text class="text" wx:if="{{detail.pay_time}}">支付时间：{{detail.pay_time}}</text>
  <text class="text">支付方式：在线支付</text>
</view>
<view class="margin order-sum item-radius ">
  <view class="top">
    <view class="text flex">
      <text class="flex1" style="font-size:28rpx;color:#999">预约费用：</text>
      <text style="font-size:28rpx;font-family: PingFang-SC-Medium, PingFang-SC;font-weight: 500;color:#333">¥{{detail.total_original_price}}</text>
    </view>
    <view class="text flex" wx:if="{{detail.discount_type==2}}">
      <view class="coupon flex flex1 flex-align-center">
        <text style="font-size:28rpx;color:#999">优惠券：</text>
        <view class="coupon-text flex-center">已选推荐优惠</view>
      </view>
      <text style="font-size:28rpx;font-family: PingFang-SC-Medium, PingFang-SC;font-weight: 500;color:#333">-¥{{detail.discount}}</text>
    </view>
    <!-- <view class="text flex" wx:if="{{detail.discount_type==1}}"> -->
    <view class="text flex" hidden="{{true}}">
      <text class="flex1" style="font-size:28rpx;color:#999">会员抵扣：</text>
      <text style="font-size:28rpx;font-family: PingFang-SC-Medium, PingFang-SC;font-weight: 500;color:#333">-¥{{detail.discount}}</text>
    </view>
  </view>
  <view class="bottom flex-align-center">
    <text style="font-size: 28rpx;color: #999">合计：</text>
    <text style="font-size: 36rpx;color: #333;margin-right:28rpx;">¥{{detail.total_price}}</text>
  </view>
</view>
<view style="height:170rpx;"></view>
<view class="buy flex-align-center" wx:if="{{ detail.status == 0 || detail.status == 1}}">
  <view class="btn cancel-btn flex-center" bindtap="onCancelOrder" wx:if="{{ detail.status == 0 }}">
    取消订单
  </view>
  <view class="btn cancel-btn flex-center" bindtap="onRefundOrder" wx:if="{{ detail.status == 1 }}">
    申请退款
  </view>
  <view class="btn use-btn flex-center" bindtap="onPay" wx:if="{{ detail.status == 0 }}"></view>
</view>

<wux-popup class="popup-radius" position="bottom" catchtouchmove="true" visible="{{ payNow }}" bind:close="onClosePay">
    <view class="coupon-popup payType">
      <view class="top flex-align-center">
        <text style="text-align: center;"></text>
        <image src="/images/icon_20.png" class="close-img" bindtap="onClosePay" />
      </view>

      <view class="moneyShow"><text>￥</text>{{ detail.total_price }}</view>

      <view class="select-pay-methon" catchtap="pay_methonw">
        <image class="pay-img" src="/images/wx_pay.png"></image>
        <view class="pay-title">微信支付</view>
        <!-- <view class="pay-money"><text>￥</text>800</view> -->
        <image class="select-activity" src="{{pay_methon==1?'/images/icon_13.png':'/images/icon_12.png'}}"></image>
      </view>

      <view class="select-pay-methon" catchtap="pay_methonc">
        <image class="pay-img" src="/images/joli_pay.png"></image>
        <view class="pay-title">储值支付</view>
        <view class="pay-money"><text>￥</text>{{inserllAmount}}</view>
        <image class="select-activity" src="{{pay_methon==2?'/images/icon_13.png':'/images/icon_12.png'}}"></image>
      </view>

      <view class="coupon-popup-btm flex-center">
        <view class="coupon-popup-btm-btn flex-center" bindtap="payNow">支付</view>
      </view>
    </view>
  </wux-popup>