<template>
  <scroll-view scroll-y="true" class="scroll-Y">
    <wx-points-commit ref="wxPointsCommit"></wx-points-commit>

    <checkbox-group @change="checkboxChange">
      <view class="container" v-if="false"
        ><!--todo: 杭州首停不显示暂时根据groupId写死-->
        <view class="item">
          <view class="title">首停优惠</view>
          <view class="content"
            >首停减免{{ parkInfoEntity.parkHour }}小时。可优惠{{
              firstParkDiscountFee
            }}元</view
          >
        </view>
        <checkbox
          value="firstPark"
          color="#fff"
          :checked="isCheck('firstPark')"
        />
      </view>

      <view class="container" v-if="parkInfoEntity.memberLevelReduce">
        <view class="item">
          <view class="title">会员等级减免</view>
          <view class="content"
            >{{ memberDiscount.memberOrderdesc || '' }}减免{{
              memberDiscount.reduceContent || 0
            }}小时。可优惠{{ memberDiscountFee || 0 }}元</view
          >
        </view>
        <checkbox
          value="member"
          color="#fff"
          :disabled="
            (!isCheck('member') && isDiscountDisabled) ||
            isMemberDiscountDisabled ||
            memberDiscount.reduceContent <= 0
          "
          :checked="isCheck('member')"
        />
        <view class="member-discount-info" v-if="isMemberDiscountDisabled"
          >当日已使用</view
        >
      </view>
      <view class="container" v-if="isShowReduceDiscount">
        <view class="item">
          <view class="title">消费减免</view>
          <!-- <view class="content" v-if="parkInfoEntity.parkMallCode === 1 && parkInfoEntity.expirationDate">{{reduceDiscountMessage}}</view> -->
          <view class="content" v-if="parkInfoEntity.parkMallCode !== 1">{{
            todayReduceDiscountMessage
          }}</view>
          <uni-number-box
            v-if="parkInfoEntity.isSplit === 0 && maxReduceDiscount > 0"
            :min="1"
            :max="maxReduceDiscount"
            v-model="reduceHours"
            @input="reducesChange"
          ></uni-number-box>
        </view>
        <checkbox
          value="reduces"
          color="#fff"
          :disabled="
            (!isCheck('reduces') && isDiscountDisabled) ||
            !reducesDiscount.recuceContent
          "
          :checked="isCheck('reduces')"
        />
      </view>
      <view class="flewx">
        <view class="flewx-content"
          >应付<text
            style="color: red; font-size: 32rpx; padding-left: 20rpx"
            >{{ actualFee | currency }}</text
          >
          元
          <text style="color: #8d8d8d; padding-left: 30rpx; font-size: 28rpx"
            >已优惠{{ discountFee | currency }}元</text
          ></view
        >
        <view
          :class="{
            flewx_index3: true,
            blue_flewx_index3: custTypeId === 1,
            green_flewx_index3: custTypeId === 2,
            'btn-disabled': !parkInfo.servicefee,
          }"
          @click="confirm"
          >确定</view
        >
      </view>
    </checkbox-group>
  </scroll-view>
</template>

<script>
import { mapState } from 'vuex';
import uniNumberBox from '@/components/uni-number-box/uni-number-box.vue';
const app = getApp();
export default {
  components: { uniNumberBox },
  onLoad() {
    // 纸质优惠券
    if (uni.getStorageSync('paperCouponInfo')) {
      this.paperCouponFee =
        uni.getStorageSync('paperCouponInfo').paperDiscountFee || 0;
    }
    // 电子券
    if (uni.getStorageSync('couponInfo')) {
      this.couponFee = uni.getStorageSync('couponInfo').couponfee || 0;
    }
    this.servicefee = uni.getStorageSync('servicefee'); // 应缴金额
    this.parkDiscountTotal = uni.getStorageSync('parkingTotal'); // 总停车优惠
    // 重置优惠 防止二次叠加
    this.discountTotal = uni.getStorageSync('discountTotal');
    if (this.discountTotal) {
      this.parkDiscountTotal.feeCopy -= this.discountTotal.fee;
    }

    this.parkFee = JSON.parse(uni.getStorageSync('parkFee'));
    this.parkInfoEntity = this.parkFee.parkInfoEntity;
    this.parkInfoEntity.useReduceTime = this.parkInfoEntity.useReduceTime
      ? this.parkInfoEntity.useReduceTime
      : 0; // 已用优惠时长
    this.parkInfoEntity.remainReduceTime =
      this.parkInfoEntity.remainReduceTime > 0
        ? this.parkInfoEntity.remainReduceTime
        : 0; // 剩余可用优惠时长
    this.parkMallCode = this.parkInfoEntity.parkMallCode;
    // 浦东每次上限处理
    if (
      this.parkMallCode === 1 &&
      this.parkInfoEntity.remainReduceTime >
        this.parkInfoEntity.maxonetimediscount
    ) {
      this.parkInfoEntity.remainReduceTime =
        this.parkInfoEntity.maxonetimediscount;
    }

    // 沈阳上限处理
    if (this.parkMallCode === 4 || this.parkMallCode === 6) {
      this.parkInfoEntity.remainReduceTime =
        this.parkInfoEntity.maxOneDayHour -
        this.parkInfoEntity.ticketandMemeberGradeAndConsumeUseHour;
      if (this.couponFee) {
        this.parkInfoEntity.remainReduceTime -=
          this.couponFee / this.parkInfoEntity.needmoney;
      }
    }

    // 上限金额
    this.maxonetimediscountFee =
      this.parkInfoEntity.maxonetimediscount * this.parkInfoEntity.needmoney;
    this.maxonedaydiscountFee =
      (this.parkInfoEntity.maxOneDayHour -
        this.parkInfoEntity.ticketandMemeberGradeAndConsumeUseHour) *
        this.parkInfoEntity.needmoney || 0;
    if (this.maxonedaydiscountFee < 0) {
      this.maxonedaydiscountFee = 0;
    }

    // 会员优惠
    if (
      this.parkFee.parkMemberOrderReducesEntityList &&
      this.parkFee.parkMemberOrderReducesEntityList[0]
    ) {
      this.memberDiscount = this.parkFee.parkMemberOrderReducesEntityList[0];
    }

    // 消费减免
    if (
      this.parkFee.parkConsumeReducesEntityList &&
      this.parkFee.parkConsumeReducesEntityList.length
    ) {
      this.reducesDiscount = this.parkFee.parkConsumeReducesEntityList[0];
    } else {
      this.reducesDiscount = { consumerLimit: 0, recuceContent: 0 };
    }

    // 消费减免可拆分上限
    this.maxReduceDiscount = this.reducesDiscount.recuceContent;
    if (this.maxReduceDiscount > this.parkInfoEntity.remainReduceTime) {
      this.maxReduceDiscount = this.parkInfoEntity.remainReduceTime;
    }
    this.reduceHours = this.maxReduceDiscount;

    // 反显处理
    if (this.discountTotal.consumeFee) {
      this.reduceHours =
        this.discountTotal.consumeFee / this.parkInfoEntity.needmoney || 0;
    }
    const checkedList = uni.getStorageSync('checkedList');
    if (checkedList && checkedList.length) {
      this.checkedList = checkedList;
    } /* else {
			if (this.memberDiscount.reduceContent > 0) {
				// 浦东上限控制
				if (this.parkMallCode === 1) {
					if (!this.crossMessage()) {
						this.checkedList = ['member'];
						this.maxReduceDiscount = this.parkInfoEntity.remainReduceTime - this.memberDiscount.reduceContent - (this.discountTotal.time || 0);
						this.reduceHours = this.maxReduceDiscount;
					}
				} else {
					this.checkedList = ['member'];
				}
			} else {
				if (this.parkMallCode === 1) {
					if (!this.isCheck('reduces')) {
						this.maxReduceDiscount = this.parkInfoEntity.remainReduceTime - (this.parkDiscountTotal.time || 0);
						this.reduceHours = this.maxReduceDiscount;
					}
				}
			}
		}*/
    // 浦东上限控制
    if (
      this.parkMallCode === 1 ||
      this.parkMallCode === 4 ||
      this.parkMallCode === 6
    ) {
      if (this.discountTotal.memberGradeFee) {
        this.maxReduceDiscount =
          this.parkInfoEntity.remainReduceTime -
          this.discountTotal.memberGradeFee / this.parkInfoEntity.needmoney;
        if (
          (this.parkMallCode === 4 || this.parkMallCode === 6) &&
          this.maxReduceDiscount > this.reducesDiscount.recuceContent
        ) {
          this.maxReduceDiscount = this.reducesDiscount.recuceContent;
        }
      }
      this.reduceHours = this.maxReduceDiscount;
      if (this.crossMessage()) {
        if (this.isCheck('reduces')) {
          this.maxReduceDiscount = this.reduceHours;
        } else {
          this.maxReduceDiscount = 0;
          this.reduceHours = 0;
        }
      } else {
        if (!this.isCheck('reduces')) {
          this.reduceHours = this.maxReduceDiscount;
        }
      }
    }

    // 会员优惠每天只可使用一次
    if (this.parkInfoEntity.memberLevelFlag == 1) {
      this.isMemberDiscountDisabled = true;
      const memberIndex = this.checkedList.indexOf('member');
      if (memberIndex !== -1) {
        this.checkedList.splice(memberIndex, 1);
      }
    }

    // 超限提示
    this.crossMessage();
  },
  data() {
    return {
      parkFee: {}, // 停车规则信息及优惠信息
      parkInfoEntity: {}, // 停车规则信息
      memberDiscount: {}, // 会员优惠
      isMemberDiscountDisabled: false, // 会员等级减免是否可用(当天仅限使用一次)
      isDiscountDisabled: false, // 浦东减免是否超限
      reducesDiscount: {}, // 消费优惠
      checkedList: [], // 已选优惠列表
      firstPark: 0, // 首停减免金额
      member: 0, // 会员优惠金额
      reduces: 0, // 消费减免金额
      reduceHours: 0, // 消费减免拆分时长
      maxReduceDiscount: 0, // 消费减免规则最大优惠
      servicefee: 0, // 应缴金额
      parkDiscountTotal: {}, // 总停车优惠
      discountTotal: {}, // 首停、会员、消费优惠合计
      groupId: app.globalData.groupId,
      maxonetimediscountFee: 0, // 每次优惠上限金额
      maxonedaydiscountFee: 0, // 每天优惠上限金额
      parkMallCode: 1, // 0静安 1浦东 2杭州 3北京 4沈阳 5深圳 6天津
      paperCouponFee: 0, // 纸质优惠金额
      couponFee: 0, // 电子券优惠金额
    };
  },
  computed: {
    // 是否显示消费减免
    isShowReduceDiscount() {
      if (
        this.parkInfoEntity.parkMallCode === 0 ||
        this.parkInfoEntity.parkMallCode === 1
      ) {
        return (
          this.parkInfoEntity.consumeReduce &&
          this.reducesDiscount.consumerLimit
        );
      }
      return this.parkInfoEntity.consumeReduce;
    },
    // 首停减免金额
    firstParkDiscountFee() {
      return this.parkInfoEntity.parkHour * this.parkInfoEntity.needmoney;
    },
    // 会员减免金额
    memberDiscountFee() {
      return this.memberDiscount.reduceContent * this.parkInfoEntity.needmoney;
    },
    // 消费减免金额
    reducesDiscountFee() {
      return this.reduceHours * this.parkInfoEntity.needmoney;
    },
    // 浦东有效期内消费提示
    reduceDiscountMessage() {
      return (
        this.parkInfoEntity.expirationDate +
        '日内消费了' +
        this.parkInfoEntity.totalAmont +
        '元，已使用' +
        parseInt(
          this.parkInfoEntity.useConsumeFee / this.parkInfoEntity.needmoney
        ) +
        '小时满减抵扣。'
      );
    },
    // 消费减免(拆分部分)提示文本
    reduceSplitMessage() {
      if (this.parkInfoEntity.isSplit === 0) {
        return `选择${this.reduceHours}小时，`;
      }
      return '';
    },
    // 当日消费提示
    todayReduceDiscountMessage() {
      if (
        this.parkInfoEntity.remainReduceTime ||
        this.parkInfoEntity.maxOneDayHour -
          this.parkInfoEntity.ticketandMemeberGradeAndConsumeUseHour
      ) {
        if (this.reducesDiscount.consumerLimit) {
          if (this.parkMallCode === 0) {
            return `今日可减免${this.reducesDiscount.recuceContent}小时`;
          }
          // 沈阳提示信息
          if (this.parkMallCode === 4 || this.parkMallCode === 6) {
            return `未达上限时今日可减免${this.reducesDiscount.recuceContent}小时`;
          }
          if (
            this.reducesDiscount.recuceContent >
            this.parkInfoEntity.remainReduceTime
          ) {
            return `消费已满${this.reducesDiscount.consumerLimit}元，减免${this.reducesDiscount.recuceContent}小时。超出优惠上限，可减免${this.maxReduceDiscount}小时，${this.reduceSplitMessage}可优惠${this.reducesDiscountFee}元`;
          }
          return `消费已满${this.reducesDiscount.consumerLimit}元，减免${this.reducesDiscount.recuceContent}小时。${this.reduceSplitMessage}可优惠${this.reducesDiscountFee}元`;
        }
        return '消费金额未达到最低优惠要求';
      }
      if (this.parkInfoEntity.dateReduceUpperliLimit) {
        return `您今日消费减免已达${this.parkInfoEntity.dateReduceUpperliLimit}小时上限`;
      }
    },
    // 选择优惠数量
    checkedTotal() {
      return this.checkedList.length;
    },
    // 首停、会员、消费优惠总计金额
    totalFee() {
      this.first = 0;
      this.member = 0;
      this.reduces = 0;
      let total = 0;
      this.checkedList.forEach((item) => {
        this[item] = this[item + 'DiscountFee'];
        total += this[item + 'DiscountFee'];
      });
      return total;
    },
    // 首停、会员、消费优惠总计时长
    totalTime() {
      return this.totalFee / this.parkInfoEntity.needmoney;
    },
    // 实际支付金额
    actualFee() {
      const fee = this.servicefee - this.discountFee;
      return fee > 0 ? fee : 0;
    },
    // 已优惠金额
    discountFee() {
      let total = this.parkDiscountTotal.feeCopy + this.totalFee;
      // 超出上限按上限计算
      if (this.parkMallCode === 1) {
        if (total - this.paperCouponFee > this.maxonetimediscountFee) {
          total = this.maxonetimediscountFee + this.paperCouponFee;
        }
      }
      if (this.parkMallCode === 4 || this.parkMallCode === 6) {
        if (
          total - this.paperCouponFee - this.parkDiscountTotal.bonusfee >
          this.maxonedaydiscountFee
        ) {
          total =
            this.maxonedaydiscountFee +
            this.parkDiscountTotal.bonusfee +
            this.paperCouponFee;
        }
      }
      return total;
    },
    ...mapState({
      custTypeId: (state) => state.custTypeId,
    }),
  },
  methods: {
    // 选择回调
    checkboxChange(e) {
      console.log('checkboxChange');
      console.log('paperCouponFee------>', this.paperCouponFee);
      this.checkedList = e.detail.value;
      // 浦东上限控制
      if (this.parkMallCode === 1) {
        if (this.isCheck('member')) {
          this.maxReduceDiscount =
            this.parkInfoEntity.remainReduceTime -
            (this.discountFee - this.paperCouponFee - this.reduces) /
              this.parkInfoEntity.needmoney;
          this.reduceHours = this.maxReduceDiscount;
        } else {
          if (this.isCheck('reduces')) {
            this.maxReduceDiscount =
              this.parkInfoEntity.remainReduceTime -
              (this.discountFee - this.paperCouponFee - this.reduces) /
                this.parkInfoEntity.needmoney;
          } else {
            this.maxReduceDiscount =
              this.parkInfoEntity.remainReduceTime -
              (this.discountFee - this.paperCouponFee) /
                this.parkInfoEntity.needmoney;
            this.reduceHours = this.maxReduceDiscount;
          }
        }
      }
      // 沈阳上限控制
      if (this.parkMallCode === 4 || this.parkMallCode === 6) {
        if (this.isCheck('member')) {
          this.maxReduceDiscount =
            this.parkInfoEntity.remainReduceTime -
            this.memberDiscount.reduceContent;
          if (this.maxReduceDiscount < 0) {
            this.maxReduceDiscount = 0;
          }
          if (this.maxReduceDiscount > this.reducesDiscount.recuceContent) {
            this.maxReduceDiscount = this.reducesDiscount.recuceContent;
          }
          this.reduceHours = this.maxReduceDiscount;
        } else {
          this.maxReduceDiscount = this.parkInfoEntity.remainReduceTime;
          if (this.maxReduceDiscount > this.reducesDiscount.recuceContent) {
            this.maxReduceDiscount = this.reducesDiscount.recuceContent;
          }
          this.reduceHours = this.maxReduceDiscount;
        }
      }
      this.crossMessage();
    },

    // 是否选中
    isCheck(val) {
      return this.checkedList.findIndex((e) => e == val) !== -1;
    },

    // 计数器回调
    reducesChange() {
      console.log('reducesChange');
      if (this.isCheck('reduces')) {
        this.crossMessage();
      }
    },

    // 超限提示
    crossMessage() {
      let totalFee = this.parkDiscountTotal.feeCopy;
      const remainReduceFee =
        this.parkInfoEntity.remainReduceTime * this.parkInfoEntity.needmoney;
      // if (this.discountTotal && this.discountTotal.fee !== 0) {
      // 	totalFee += this.totalFee - this.discountTotal.fee;
      // } else {
      // 	totalFee += this.totalFee;
      // }
      totalFee += this.totalFee;
      // 浦东每次总优惠上限
      this.isDiscountDisabled = false;
      if (
        this.parkMallCode === 1 &&
        totalFee - this.paperCouponFee >= this.maxonetimediscountFee
      ) {
        this.isDiscountDisabled = true;
        return uni.showToast({
          title: `超出抵扣上限,每次最高可抵扣${this.parkInfoEntity.maxonetimediscount}小时`,
          icon: 'none',
        });
      }
      // 沈阳超限处理(maxonedaydiscountFee 会员、消费、电子券减免)
      if (
        (this.parkMallCode === 4 || this.parkMallCode === 6) &&
        totalFee - this.paperCouponFee - this.parkDiscountTotal.bonusfee >=
          this.maxonedaydiscountFee
      ) {
        this.isDiscountDisabled = true;
        return uni.showToast({
          title: `(会员等级、消费、电子券)每日最高可抵扣${this.parkInfoEntity.maxOneDayHour}小时`,
          icon: 'none',
        });
      }
      // 消费每天优惠上限(非浦东、沈阳)
      if (
        this.parkMallCode !== 1 &&
        this.parkMallCode !== 4 &&
        this.parkMallCode !== 6 &&
        this.reduces > remainReduceFee
      ) {
        this.reduces = remainReduceFee;
        return uni.showToast({
          title: `超出抵扣上限,消费减免每天最高可抵扣${this.parkInfoEntity.dateReduceUpperliLimit}小时,可使用${this.parkInfoEntity.remainReduceTime}小时`,
          icon: 'none',
        });
      }
    },

    // 确认
    confirm() {
      // 计算单价
      const cost =
        this.reducesDiscount.consumerLimit / this.reducesDiscount.recuceContent;
      // 算出消费减免在哪个档
      let useConsumeFee = 0;
      if (this.reduces) {
        if (this.parkInfoEntity.isSplit === 0) {
          useConsumeFee = this.reduceHours * cost;
        } else {
          useConsumeFee = this.reducesDiscount.consumerLimit;
        }
      }
      uni.setStorageSync('checkedList', this.checkedList);
      uni.setStorageSync('checkedTotal', this.checkedTotal);
      uni.setStorageSync('discountTotal', {
        firstParkFee: this.firstPark,
        memberGradeFee: this.member,
        consumeFee: this.reduces,
        useConsumeFee: useConsumeFee,
        time: this.totalTime,
        fee: this.totalFee,
      });
      uni.navigateBack();
    },
  },
};
</script>

<style lang="less" scoped>
@import '../../styles/common.less';
.scroll-Y {
  width: 100%;
  display: flex;
  flex-direction: column;
  height: 100vh;
  background: #f1f1f1;
}
.container {
  background-color: #fff;
  width: 650rpx;
  margin: 25rpx 30rpx;
  padding-left: 40rpx;
  border-radius: 10rpx;
  display: flex;
  align-items: center;
  line-height: 70rpx;
  position: relative;
  .item {
    width: 570rpx;
    padding: 20rpx 0;
    .title {
      font-size: 34rpx;
    }
    .content {
      font-size: 28rpx;
      color: #989898;
    }
  }
  .member-discount-info {
    font-size: 20rpx;
    position: absolute;
    right: 12rpx;
    bottom: 0;
    color: #989898;
  }
  .page_img {
    width: 49rpx;
    height: 49rpx;
    border: 1rpx solid #e6e6e6;
    border-radius: 50%;
    overflow: hidden;
    image {
      width: 50rpx;
      height: 50rpx;
      margin-left: -1rpx;
    }
  }
}
.flewx {
  width: 100%;
  height: 100rpx;
  background-color: #fff;
  position: fixed;
  bottom: 0;
  font-size: 30rpx;
  display: flex;
  align-items: center;
  justify-content: space-around;
  // padding-bottom: constant(safe-area-inset-bottom);
  // padding-bottom: env(safe-area-inset-bottom);
  padding-bottom: 20rpx;
  .flewx-content {
    position: absolute;
    left: 16px;
  }
  .flewx_index3 {
    width: 150rpx;
    height: 70rpx;
    border-radius: 50rpx;
    text-align: center;
    font-size: 28rpx;
    line-height: 70rpx;
    color: #fff;
    background-image: linear-gradient(to right, #7e4fa1, #433c7f);
    box-shadow: 2px 3px 5px #888888;
    position: absolute;
    right: 16px;
  }
  .blue_flewx_index3 {
    .color-background-color('blue');
  }
  .green_flewx_index3 {
    .color-background-color('green');
  }
}
/deep/ checkbox .wx-checkbox-input.wx-checkbox-input-checked {
  background-color: red !important;
  border-radius: 50% !important;
  border: 1px solid red;
}
/deep/ checkbox .wx-checkbox-input {
  border-radius: 50% !important;
}
</style>
