收款部分布局修改

src/views/cashier/counter/receipt-pay.vue

@@ -28,15 +28,28 @@
       <div class="flex-row-center-container">
 
         <div class="flex-col-container">
-          <span>优惠活动：</span>
-          <span class="mar-t-10">会员优惠：</span>
-          <span class="mar-t-10">优惠卡券：</span>
-          <span class="md-title mar-t-10">合计优惠：</span>
-        </div>
+          <div class="flex-row-center-bet-container">
+            <div/>
+            <span>优惠活动：</span>
+          </div>
 
+          <div class="flex-row-center-bet-container mar-t-8">
+            <el-checkbox v-model="integralChecked" @change="handleIntegralChange"/>
+            <span style="margin-left: 5px">积分抵扣：</span>
+          </div>
+          <div class="flex-row-center-bet-container mar-t-10">
+            <div/>
+            <span >优惠卡券：</span>
+          </div>
+
+          <div class="flex-row-center-bet-container mar-t-10">
+            <div/>
+            <span class="md-title">合计优惠：</span>
+          </div>
+        </div>
         <div class="flex-col-container mar-l-25">
           <span>-{{actDiscountPrice}}</span>
-          <span class="mar-t-10">-{{memberDiscountPrice}}</span>
+          <span class="mar-t-10">-{{deductionPrice}}</span>
           <div class="flex-row-center-bet-container mar-t-10">
             <span>-{{couponDiscountPrice}}</span>
             <span class="select-coupon" @click="selectCoupons">选择</span>
@@ -44,27 +57,6 @@
           <span class="md-title mar-t-10">-{{totalDiscountPrice}}</span>
         </div>
 
-<!--        <div class="flex-col-container">-->
-<!--          <div class="flex-row-center-bet-container">-->
-<!--            <span>优惠活动：</span>-->
-<!--            <span class="mar-l-25">-{{actDiscountPrice}}</span>-->
-<!--          </div>-->
-<!--          <div class="flex-row-center-bet-container mar-t-10">-->
-<!--            <span>会员优惠：</span>-->
-<!--            <span>-{{memberDiscountPrice}}</span>-->
-<!--          </div>-->
-<!--          <div class="flex-row-center-bet-container mar-t-10">-->
-<!--            <span>优惠卡券：</span>-->
-<!--            <span>-{{couponDiscountPrice}}</span>-->
-<!--          </div>-->
-<!--          <div class="flex-row-center-bet-container mar-t-10">-->
-<!--            <span class="md-title">合计优惠：</span>-->
-<!--            <span class="md-title">-{{totalDiscountPrice}}</span>-->
-<!--          </div>-->
-<!--        </div>-->
-<!--        <div class="flex-col-container">-->
-<!--          <span class="select-coupon">选择</span>-->
-<!--        </div>-->
         <div class="flex-col-container mar-l-50">
           <div class="flex-row-center-bet-container">
             <span class="bg-title">应收金额：</span>
@@ -188,7 +180,7 @@ export default {
       showMemberDialog: false,
       showCouponDialog: false,
       actDiscountPrice: '0.00',
-      memberDiscountPrice: '0.00',
+      deductionPrice: '0.00',
       couponDiscountPrice: '0.00',
       totalDiscountPrice: '0.00',
       finalTotalPrice: '0.00',
@@ -200,7 +192,8 @@ export default {
       showPayWayDialog: false,
       showPayingDialog: false,
       showPayFailDialog: false,
-      showPayFinishDialog: false
+      showPayFinishDialog: false,
+      integralChecked: false
     }
   },
   props: {
@@ -218,7 +211,7 @@ export default {
         //没有数据，全部默认为0.00
         this.totalCount = 0;
         this.actDiscountPrice = '0.00'
-        this.memberDiscountPrice = '0.00'
+        this.deductionPrice = '0.00'
         this.couponDiscountPrice = '0.00'
         this.totalDiscountPrice = '0.00'
         this.finalTotalPrice = "0.00"
@@ -246,10 +239,10 @@ export default {
         this.actDiscountPrice = actDiscountPrice
         this.originTotalPrice = originTotalPrice
 
-        this.memberDiscountPrice = '0.00' //会员优惠应该在选择会员后返回？
+        this.deductionPrice = '0.00'
         this.couponDiscountPrice = '0.00' //优惠卡券满减应该是根据销售价来判断？还是销售价减去会员优价格后判断满减？
         //优惠总价(包括优惠活动扣减、会员优惠扣减、优惠卡券扣减)
-        this.totalDiscountPrice = accAdd(accAdd(this.actDiscountPrice, this.memberDiscountPrice), this.couponDiscountPrice)
+        this.totalDiscountPrice = accAdd(accAdd(this.actDiscountPrice, this.deductionPrice), this.couponDiscountPrice)
         //最终应收金额
         this.finalTotalPrice = accSubtract(this.originTotalPrice, this.totalDiscountPrice)
       }
@@ -336,10 +329,10 @@ export default {
           this.member = {
             avatar: Avatar
           }
-          //会员优惠清0，优惠卡券清0，合计优惠重新计算，应收金额重新计算
-          this.memberDiscountPrice = '0.00'
+          //积分抵扣清0，优惠卡券清0，合计优惠重新计算，应收金额重新计算
+          this.deductionPrice = '0.00'
           this.couponDiscountPrice = '0.00'
-          this.totalDiscountPrice = accAdd(accAdd(this.actDiscountPrice, this.memberDiscountPrice), this.couponDiscountPrice)
+          this.totalDiscountPrice = accAdd(accAdd(this.actDiscountPrice, this.deductionPrice), this.couponDiscountPrice)
           this.finalTotalPrice = accSubtract(this.originTotalPrice, this.totalDiscountPrice)
         });
       }
@@ -475,6 +468,15 @@ export default {
 
     onFinishPay(){
       this.$emit('onFinishPay')
+    },
+
+    handleIntegralChange(val){
+      console.log("handleIntegralChange--->", val)
+      if (val){
+        //勾选积分兑换，调计算接口
+      }else {
+        //取消勾选，充值
+      }
     }
   },
 
@@ -512,10 +514,10 @@ export default {
   justify-content: space-between;
 }
 
-.flex-row-center-bet-container{
+.flex-row-center-around-container{
   display: flex;
   flex-direction: row;
-  justify-content: space-between;
+  justify-content:space-around;
   align-items: center;
 }
 
@@ -568,6 +570,10 @@ export default {
   margin-top: 10px;
 }
 
+.mar-t-8{
+  margin-top: 7px;
+}
+
 .user-avatar{
   width: 40px;
   height: 40px;