<view class="page">
  <view class="topTitle">
    <view style="margin:0 auto;margin-top:38rpx;">
      <image mode="aspectFit" style="width:53rpx;height:53rpx;margin-right:26rpx;float:left;" src="/images/icon_success.png"/>
      <view style="height:53rpx;display:flex;">
        <text>支付成功</text>
      </view>
    </view>
  </view>
  <view class="payInfo">
    <image mode="aspectFit" style="width:624rpx;height:430rpx;" src="/images/bg_print_paper.png"/>
    <view style="position:absolute;left:0rpx;top:0rpx;width:624rpx;height:430rpx;">
      <view class="orderPrice">
        <text style="float:left;">订单总额</text>
        <text style="font-weight:bold;float:right;">￥{{orderPriceYuan}}</text>
      </view>
      <view class="discount">
        <text style="float:left;">商家优惠</text>
        <text style="font-weight:bold;float:right;">-￥{{couponPriceYuan}}</text>
      </view>
      <view class="payPrice">
        <text style="float:left;" decode=true>共计 {{totalCount}} 件&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;实付：</text>
        <text style="font-weight:bold;float:right;color:#F72911;">￥{{payPriceYuan}}</text>
      </view>
    </view>
  </view>
  <view class="printLoading">
    <view hidden="{{!isShowPrinting}}">
      <i-spin></i-spin>
    </view>
    <view style="position:absolute;width:100%;height:100%;left:0rpx;top:0rpx;color:#000000;font-weight:bold;">
      <view style="display: absolute;margin:0 auto;align-content: center;align-items: center;text-align:center;line-height:186rpx;">
        <text>{{printerStatus}}</text>
      </view>
    </view>
  </view>
  <view class="voucher" hidden="{{!isShowCoupon}}">
    <image mode="aspectFit" style="width:100%;height:229rpx;" src="/images/bg_coupon.png"/>
    <view style="display: absolute;position: absolute;left:0rpx;top:0rpx;width:209rpx;height:229rpx;">
      <view style="position: absolute;color:#ffffff;left:10rpx;top:103rpx;font-size:43rpx;">
        <text >￥</text>
      </view>
      <view style="position: absolute;color:#ffffff;text-align:center;left:68rpx;font-weight:bold;top:80rpx;font-size:66rpx;">
        <text>{{couponPriceYuan}}</text>
      </view>
      <view style="position: absolute;color:#ffffff;text-align:center;left:23rpx;top:145rpx;font-size:23rpx;">
        <text>{{couponHint}}</text>
      </view>
    </view>
    <view style="position: absolute;left:209rpx;top:0rpx;width:453rpx;height:229rpx;">
      <view style="position: absolute;color:#ffffff;left:32rpx;top:32rpx;font-size:34rpx;width:352rpx;">
        <text >{{couponName}}</text>
      </view>
      <view style="position: absolute;color:#ffffff;left:32rpx;bottom:32rpx;font-size:34rpx;width:352rpx;">
        <text >{{couponDateDuration}}</text>
      </view>
    </view>
  </view>
</view>