payProject/pages/confirmProjectOrder/confirmProjectOrder.wxml

<!--pages/orderDetailsProject/orderDetailsProject.wxml-->
<wxs src="./../../utils/wxsUtil.wxs" module="wxsUtil" />

<view class="content">

  <view class="line-spc"></view>

  <view class="border-content">
    <view class="title-line">
      <view class="title-left">预约门店:</view>
      <view class="title-content">{{orderDetails.store_name}}</view>
      <view class="inLocations" style="font-size:28rpx">
        <image class="inLocationImage" src="/images/location-to.png"></image>
        <view class="inLocationDistance">
          距离您<text>{{wxsUtil.getDistance(lat1,lng1,orderDetails.latitude,orderDetails.longitude)}}</text>Km
        </view>
      </view>
    </view>

    <view class="title-line1">
      <view class="title-left">门店地址:</view>
      <view class="title-value">{{orderDetails.address}}</view>
    </view>
  </view>

  <view class="border-content">
    <view class="title-line">
      <view class="title-left">美容时间:</view>
      <view class="title-content">{{orderDetails.order_time}}<text></text></view>
    </view>

  </view>

  <view class="border-content flex-column">

    <!-- <view class="project-list"> -->
    <view class="peoject-list-title">共<text>{{orderDetails.project_list.length}}</text>个项目</view>
    <!-- </view> -->

    <view class="project-content" wx:for="{{orderDetails.project_list}}" wx:key='index'>
      <image class="project-content-img" src="{{item.cover_url}}"></image>
      <view class="project-content-right">
        <view class="item-right-time">
          <!-- <view class="item-right-title">{{item.name}}</view> -->
          <view class="item-right-title">{{item.name}}</view>
          <view class="item-right-title-time">¥<text>{{item.price}}</text></view>
        </view>
        <view class="item-project-add" hidden="{{item.product_name?false:true}}">
          +{{item.product_name}}</view>
        <view class="item-project-house">{{item.device_name}}({{item.room}}){{item.use_time}}分钟</view>
        <!-- <view class="item-project-add">+润百颜精华</view> -->
      </view>
    </view>
  </view>


  <view class="border-content">
    <view class="line-title-coup">
      <view class="coup-title">预约费用</view>
      <view class="coup-value">¥{{orderDetails.price}}</view>
    </view>

    <view class="coup-select" catchtap="showCard">
      <image class="coup-select-img" src="/images/card.png"></image>
      <view class="coup-select-title">次卡</view>
      <view class="coup-select-tag" wx:if="{{card_data.length>0}}">已选择次卡</view>
      <view class="spc-in"></view>
      <image class="right-black" src="/images/list-ker-right.png"></image>
    </view>
    <view class="coup-item" wx:for="{{selectCardProjectList}}" wx:key='index'>
      <view class="coup-item-left">{{item.name}}</view>
      <view class="coup-item-right">-¥{{item.price}}</view>
    </view>

    <view class="coup-select" catchtap="showCoup">
      <image class="coup-select-img" src="/images/icon_order_coupon.png"></image>
      <view class="coup-select-title">优惠券</view>
      <view class="coup-select-tag" wx:if="{{isSelectCoup.length>0}}">已选推荐优惠</view>
      <view class="spc-in"></view>
      <image class="right-black" src="/images/list-ker-right.png"></image>
    </view>

    <view class="coup-item" wx:for="{{isSelectCoup}}" wx:key='index'>
      <view class="coup-item-left">{{item.name}}</view>
      <view class="ellipsis coup-item-right" hidden="{{item.type==4?false:true}}">抵扣{{item.projectName}}</view>
      <view class="coup-item-right" hidden="{{item.type==3?false:true}}">抵扣全部项目(除升级包)</view>
      <view class="coup-item-right" hidden="{{item.type==2?false:true}}">¥{{item.price}}</view>
      <view class="coup-item-right" hidden="{{item.type==1?false:true}}">¥{{item.price}}</view>
      <!-- <view class="coup-item-right" hidden="{{item.type==1?false:true}}">¥{{item.price}}</view> -->
      <view class="coup-item-right" hidden="{{item.type == 0?false:true}}">-¥{{item.price}}</view>
    </view>

    <view class="coup-select">
      <image class="coup-select-img" src="/images/display.png"></image>
      <view class="coup-select-title">折扣优惠</view>
      <view class="spc-in"></view>
      <view class="color-price">-¥{{priceSet}}</view>
    </view>
    <view wx:if="{{level!=0}}" class="coup-box">
      <view class="coup-box-title">权益折扣</view>
        <view class="spc-in">
      </view>
      <!-- <view class="color-price">-¥{{priceSet}}</view> -->
      <view class="coup-box-title">余额支付享受{{tolevel}}折优惠</view>
      </view>
    <view class="line-show"></view>

    <view class="need-pay-money">
      <view class="need-pay-title">合计</view>
      <view class="need-pay-totalmoney"><text>¥</text>{{showMoney}}</view>
    </view>

  </view>


  <view class="border-content">
    <view class="title-line">
      <view class="title-left">订单编号:</view>
      <view class="not-flex">{{orderDetails.order_sn}}</view>
      <view class="copy" catchtap="onCopy" data-no="{{orderDetails.order_sn}}">复制</view>
    </view>
    <view class="title-line">
      <view class="title-left">预约时间:</view>
      <view class="title-content-flex">{{orderDetails.order_time}}</view>
    </view>
    <!-- <view class="title-line">
    <view class="title-left">支付时间</view>
    <view class="title-content-flex">2021-12-03 10:00</view>
  </view> -->

  </view>

  <view style="width:20px;height:100px"></view>

</view>

<view class="btm-content">
  <view class="btm-line" catchtap="payNow">立即支付</view>
</view>

<wux-popup class="popup-radius" position="bottom" catchtouchmove="true" visible="{{ visible }}" bind:close="onClose">
  <view class="coupon-popup">
    <view class="top flex-align-center need-show-line">
      <text style="text-align: center;">我的优惠券</text>
      <image src="/images/icon_20.png" class="close-img" bindtap="onCancelCoupon" />
    </view>
    <scroll-view scroll-y>
      <view class="list">

        <view class="component-coupon-item flex-justify-center flex-column {{1 == 1 ? '' : 'invalid' }} marginTop"
          wx:for="{{productDiscount}}" wx:key='index'>
          <view class="coupon-item-mark">{{marks[item.type]}}</view>
          <view class="coupon-item-content" catchtap="checkSelect" data-index="{{index}}">
            <view class="coupon-item-money">
              <view class="coupon-item-money-detail flex-row justify-between" style="margin-top: 30rpx;"
                wx:if="{{item.type == 3 || item.type == 4}}">
                <text class="yuan" style="font-size: 44rpx">全免</text>
              </view>
              <view class="coupon-item-money-detail flex-row justify-between {{item.type == 2 ? 'line2' : ''}}" wx:else>
                <text class="currency">¥</text>
                <text class="yuan">{{item.price}}</text>
                <!-- <text class="fen">.00</text> -->
              </view>
              <text class="coupon-item-limit-text ellipsis" wx:if="{{item.type == 2}}">满{{item.full_price}}元可用</text>
            </view>
            <view class="coupon-item-title flex-col justify-between flex1">
              <text class="ellipsis">{{item.coupon_name}}</text>
              <text class="coupon-time ellipsis">有效期{{item.ex_time}}</text>
            </view>
            <view wx:if="{{!source&&couponStatus==0}}" class="coupon-item-btn1 flex-col justify-center align-center"
              catchtap="checkSelect" data-index="{{index}}">
              去使用
            </view>
            <view wx:elif="{{1==1}}" class="coupon-item-btn2 flex-col justify-center align-center"
              catchtap="checkSelect" data-index="{{index}}">
              <image src="{{item.isSelect ? '/images/icon_17.png' : '/images/icon_16.png'}}"></image>
            </view>
          </view>
          <!-- 0待使用，1已使用，2已过期 -->
          <image class="coupon-item-status-icon" wx:if="{{couponStatus == 1 || couponStatus == 2}}"
            src="{{couponStatus == 1 ? '/images/my/icon_coupon_used.png' : '/images/my/icon_coupon_expired.png'}}">
          </image>
          <view class="coupon-item-line flex-col"></view>
          <view class="coupon-item-rules flex-row flex-center" bindtap="clickRuleText" data-index="{{index}}">
            <text
              class="coupon-item-rules-text {{showRuleText==index ? ' rules-show ' : ' ellipsis '}}">{{item.coupon_desc}}</text>
            <view class="flex-center" style="justify-content: flex-end;">
              <image style="{{showRuleText==index ? 'transform: rotate(180deg);' : ''}}"
                src="{{couponStatus == 0 ? '/images/icon_arrow_2.png' : '/images/icon_arrow_gray.png'}}"></image>
            </view>
          </view>
        </view>


        <!-- <coupon-item class="coupon-item" wx:for="{{ productDiscount }}" item="{{item}}" wx:key="index"
          data-index="{{index}}" source="checkbox" couponStatus="{{item.status}}" checkStatus="{{CouPonIndex[index]}}"
          bind:check="onCouponChange"></coupon-item> -->
        <view class="btm-text">--已经到底了--</view>
      </view>
    </scroll-view>
    <view class="coupon-popup-btm flex-center">
      <view class="coupon-popup-btm-btn flex-center" bindtap="onConfirmCoupon">确认</view>
    </view>
  </view>
</wux-popup>

<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>{{ level?pay_methon==2?levelPrice:showMoney:showMoney }}</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" style="margin-bottom: 15rpx;">
      <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 wx:if="{{level!=0}}" class="coup-box-title" style="text-align: left; margin-left: 90rpx;">权益优惠减¥{{toLevelPrice}}</view>
    <view class="coupon-popup-btm flex-center">
      <view class="coupon-popup-btm-btn flex-center" bindtap="paybtm">支付</view>
    </view>
  </view>
</wux-popup>

<wux-popup class="popup-radius" position="bottom" catchtouchmove="true" visible="{{ visibleCard }}" bind:close="onCloseCard">
  <view class="coupon-popup">
    <view class="top flex-align-center need-show-line">
      <text style="text-align: center;">我的次卡</text>
      <image src="/images/icon_20.png" class="close-img" bindtap="onCancelCard" />
    </view>
    <scroll-view scroll-y>
      <view class="list cardList">
        <view class="content">
          <view class="conItem" wx:for="{{cardList}}" wx:key="index" bindtap="jumpCard" data-id="{{item.id}}">
            <view class="leftLine"></view>
            <view class="right">
              <view class="titleFrequency">
                <view class="title">{{item.name}}</view>
                <view class="frequency">
                  <text class="usedTimes">{{item.used_num}}</text>
                  <text class="totalFrequency">/{{item.total_num}}</text>
                </view>

              </view>
              <view class="beOverdueToUse {{item.day == '' ? 'hideRight' : ''}}">
                <view class="beOverdue {{item.day == '' ? 'hide' : ''}}">
                  <text class="beOverdueItem">还有</text>
                  <text class="beOverdueItem {{item.day < 15 ? 'tips' : ''}}">{{item.day}}天</text>
                  <text class="beOverdueItem">({{item.expir_date}})过期</text>
                </view>
                <view class="cardImgCon" bindtap="cardSel" data-item = "{{item}}" data-index="{{index}}">
                  <image class="cardImg" src="{{item.isSelectCard ? '/images/icon_17.png' : '/images/icon_16.png'}}"></image>
                </view>
              </view>
            </view>
            <view class="cardBg">
              <image src="/images/cardBg.png"></image>
            </view>
          </view>
        </view>
        <view class="btm-text">--已经到底了--</view>
      </view>
    </scroll-view>
    <view class="coupon-popup-btm flex-center">
      <view class="coupon-popup-btm-btn flex-center" bindtap="onConfirmCard">确认</view>
    </view>
  </view>
</wux-popup>