Fix(商品/订单):[#1021]商品详情页购买时选择优惠券，点击“立即购买”后已显示扣除优惠金额，但点开提交订单页面的优惠券时，优惠券未勾选

2024-03-29 23:23:39 +08:00
parent 6eedbfd240
commit 78f1c7b3b6
4 changed files with 122 additions and 76 deletions
@@ -1,18 +1,32 @@
 <template>
  <view class="components-coupons">
-    <image class="coupons__cover" :src="data.image" mode="widthFix"/>
-
+    <image
+      :src="data.image"
+      class="coupons__cover"
+      mode="widthFix"
+    />
    <view class="coupons__section flex jc-between ai-center">
      <view>有效期至：
        <text>{{ data.endTime }}</text>
      </view>
-      <view class="coupons__tag coupons__tag-expire" v-if="data.status===2">已到期</view>
-      <view class="coupons__tag" @click="goGoods()" v-if="data.status===0 && !radioModel">去使用</view>
+      <view
+        v-if="data.status===2"
+        class="coupons__tag coupons__tag-expire"
+      >已到期</view>
+      <view
+        v-if="data.status === 0 && !radioModel"
+        class="coupons__tag"
+        @click="goGoods()"
+      >去使用</view>
      <view @click="selectCoupon">
-        <radio :value="data.id" :checked="data.checked" color="#FF564A" v-if="radioModel && data.status===0"/>
+        <radio
+          v-if="radioModel && data.status === 0"
+          :value="data.id"
+          :checked="data.checked"
+          color="#FF564A"
+        />
      </view>
    </view>
-
    <view class="coupons__rules">
      <view class="coupons__rules-title" @click="changeRules()">使用规则
        <image :class="{'open':isOpen}" :src="webUrl+'/20231125220409665027.png'" mode="scaleToFill"/>
@@ -31,7 +45,13 @@
 export default {
  name: "Coupons",
  props: {
-    data: Object,
+    data: {
+      type: Object,
+      default: () => {
+        return {}
+      }
+    },
+    // 是否显示选择框
    radioModel: {
      type: Boolean,
      default: false
@@ -52,8 +72,7 @@ export default {
      this.isOpen = !this.isOpen
    },
    goGoods() {
-      uni.switchTab({url: '/pages/home/landMark'})
-      // this.$global.navToGoods(this.data.productId)
+      uni.switchTab({ url: '/pages/home/landMark' })
    },
    selectCoupon() {
      if (!this.radioModel) return
@@ -2,20 +2,41 @@
  <view class="popup-coupons">
    <view class="popup-box">
      <view class="popup-title bold tc">选择优惠券</view>
-      <SubSection :current="current" :can-use="canUse" :not-use="notUse" radioModel @change="changeNav"/>
-
+      <SubSection
+        :current="current"
+        :can-use="canUse"
+        :not-use="notUse"
+        radio-model
+        @change="changeNav"
+      />
      <view class="list-box">
-        <view style="margin-bottom: 20rpx" v-for="(item,index) in list" :key="index">
-          <Coupons :data="item" radioModel @change="selectCoupon"/>
+        <view
+          v-for="(item, index) in list"
+          :key="index"
+          style="margin-bottom: 20rpx"
+        >
+          <Coupons
+            :data="item"
+            radio-model
+            @change="selectCoupon"
+          />
        </view>
-
-        <view class="tc" v-if="list.length===0">
+        <view
+          v-if="list.length === 0"
+          class="tc"
+        >
          <image class="zero-coupons" :src="webUrl+'/20231201201733142658.png'" mode="scaleToFill"/>
        </view>
      </view>
    </view>
    <button disabled></button>
-    <view class="btn-done bold flex jc-center ai-center" :class="{'btn-disabled':current===1}" @click="setCoupon" v-if="current===0">确定
+    <view
+      v-if="current === 0"
+      :class="{ 'btn-disabled': current === 1 }"
+      class="btn-done bold flex jc-center ai-center"
+      @click="setCoupon"
+    >
+      确定
    </view>
  </view>
 </template>
@@ -26,16 +47,26 @@ import Coupons from '@/components/Coupons.vue'

 export default {
  name: 'CouponsPopup',
-  components: {SubSection, Coupons},
+  components: { SubSection, Coupons },
  props: {
    twoList: {
      type: Object,
-      default: {}
+      default: {
+        usable: [],
+        unusable: []
+      }
+    }
+  },
+  data() {
+    return {
+      webUrl: this.$VUE_APP_RESOURCES_URL,
+      current: 0,
+      couponId: uni.getStorageSync('couponId') || 0
    }
  },
  computed: {
    list() {
-      let temp = this.current === 0 ? this.twoList['usable'] : this.twoList['unusable']
+      const temp = this.current === 0 ? this.twoList['usable'] : this.twoList['unusable']
      return this.$global.deepClone(temp)
    },
    canUse() {
@@ -45,44 +76,20 @@ export default {
      return this.twoList['unusable'].length
    }
  },
-  watch: {
-    current() {
-      this.selectCoupon(this.couponId)
-    }
-  },
-  data() {
-    return {
-      webUrl: this.$VUE_APP_RESOURCES_URL,
-      current: 0,
-      couponId: 0
-    }
-  },
-  mounted() {
-    this.couponId = uni.getStorageSync('couponId') || 0
-    this.selectCoupon(this.couponId)
-  },
  methods: {
    changeNav(index) {
      this.current = index
    },
    selectCoupon(id) {
-      const isCancel = this.couponId === id
-      this.couponId = isCancel ? 0 : id
-
-      this.list?.forEach(item => {
-        if (!isCancel) {
-          item.checked = id === item.id
-        } else {
-          item.checked = false
-        }
+      this.couponId = id
+      this.list.map(item => {
+        item.checked = id === item.id
      })
    },
    setCoupon() {
      if (this.current === 1) return
-      // if (this.couponId !== 0) {
-        uni.setStorageSync('couponId', this.couponId)
-      // }
-      this.$emit('close')
+      uni.setStorageSync('couponId', this.couponId)
+      this.$emit('change')
    }
  }
 }
@@ -185,8 +185,18 @@
    </view>

    <!-- v9 优惠券开始 -->
-    <u-popup :show="show" :round="10" mode="bottom" closeOnClickOverlay @close="changeCoupons">
-      <CouponsPopup :two-list="couponList" @close="changeCoupons" v-if="couponList.usable"/>
+    <u-popup
+      :show="show"
+      :round="10"
+      mode="bottom"
+      close-on-click-overlay
+      @close="changeCoupons"
+    >
+      <CouponsPopup
+        v-if="couponList.usable.length > 0"
+        :two-list="couponList"
+        @change="changeCoupons"
+      />
    </u-popup>
    <!-- v9 优惠券结束 -->

@@ -272,8 +282,11 @@ export default {
      lotteryRecordId:'',
      payPassword: null,
      // v9-2
-      couponList: {},
-      couponId: 0,
+      couponList: {
+        unusable: [],
+        usable: []
+      },
+      couponId: uni.getStorageSync('couponId') || 0,
      couponIndex: -1,
      show: false
    };
@@ -354,35 +367,42 @@ export default {
      });
    },
    getCartInfo() {
-      var that = this;
-      // const cartIds = this.$yroute.query.id;
-      if (!that.cartid && !that.lotteryRecordId) {
+      const _this = this
+      if (!_this.cartid && !_this.lotteryRecordId) {
        uni.showToast({
          title: "参数有误",
          icon: "none",
          duration: 2000
-        });
-        return this.$yrouter.back();
+        })
+        return this.$yrouter.back()
      }
-      postOrderConfirm(that.cartid,that.lotteryRecordId)
-          .then(res => {
-            that.offlinePayStatus = res.data.offline_pay_status;
-            that.orderGroupInfo = res.data;
-            that.deduction = res.data.deduction;
-            that.couponList = res.data.couponList
-            that.addressInfo = res.data.addressInfo || {};
-            that.systemStore = res.data.systemStore || {};
-            that.storeSelfMention = res.data.storeSelfMention;
-            that.couponId = uni.getStorageSync('couponId') || 0
-            that.computedPrice()
+      postOrderConfirm(_this.cartid,_this.lotteryRecordId).then(res => {
+        const { data } = res
+        _this.offlinePayStatus = data.offline_pay_status
+        _this.orderGroupInfo = data
+        _this.deduction = data.deduction
+        _this.couponList = data.couponList
+        if (_this.couponId > 0) {
+          _this.couponList['usable'].map((item, index) => {
+            if (item.id === _this.couponId) {
+              item.checked = true
+              _this.couponIndex = index
+            } else {
+              item.checked = false
+            }
          })
-          .catch(err => {
-            uni.showToast({
-              title: err.msg,
-              icon: "none",
-              duration: 2000
-            });
-          });
+        }
+        _this.addressInfo = data.addressInfo || {}
+        _this.systemStore = data.systemStore || {}
+        _this.storeSelfMention = data.storeSelfMention
+        _this.computedPrice()
+      }).catch(err => {
+        uni.showToast({
+          title: err.msg,
+          icon: "none",
+          duration: 2000
+        })
+      })
    },
    addressTap: function () {
      //改用跳转页面方式
@@ -202,7 +202,7 @@

        <!-- v9 优惠券开始 -->
        <u-popup :show="show" :round="10" mode="bottom" closeOnClickOverlay @close="changeCoupons()">
-          <CouponsPopup :two-list="couponList" @close="changeCoupons"/>
+          <CouponsPopup :two-list="couponList" @change="changeCoupons"/>
        </u-popup>
        <!-- v9 优惠券结束 -->