Refactor(商品详情):规格是否无库存通过接口查询

2024-09-24 15:20:31 +08:00
parent 787b2eada4
commit 1915394b27
3 changed files with 387 additions and 356 deletions
@@ -25,6 +25,15 @@ export function getProductDetail(id, data) {
    });
 }

+/*
+ * 商品规格选中
+ * */
+export function getProductSkuBySelected(id, data) {
+    return request.get("api/product/getSkuBySelected/" + id, data, {
+        login: true
+    });
+}
+
 /*
 * 商品分销二维码
 * */
@@ -19,21 +19,25 @@
        <view class="iconfont icon-guanbi" @click="closeAttr"></view>
      </view>
      <view class="productWinList">
-        <view class="item" v-for="(item, indexw) in attr.productAttr" :key="indexw">
+        <view
+          class="item"
+          v-for="(item, index) in attr.productAttr"
+          :key="index"
+        >
          <view class="title">{{ item.attrName }}</view>
          <view class="listn acea-row v12-justify-start">
            <view
-              v-for="(itemn, indexn) in item.attrValue"
-              :key="indexn"
+              v-for="(subItem, subIndex) in item.attrValue"
+              :key="subIndex"
              :class="{
-                'actived': item.index == indexn,
-                'disabled': getAttrItemData(itemn.attr).stock === 0
+                'actived': item.index == subIndex,
+                'disabled': !subItem.canUsed
              }"
              class="itemn v12-radius-40"
-              @click="tapAttr(indexw, indexn, itemn)"
+              @click="tapAttr(index, subIndex, subItem)"
            >
-              {{ itemn.attr }}
-                <text v-if="getAttrItemData(itemn.attr).stock === 0" class="less-tag" style="color: #fff !important;">缺货</text>
+              {{ subItem.attr }}
+              <text v-if="!subItem.canUsed" class="less-tag" style="color: #fff !important;">缺货</text>
            </view>
          </view>
        </view>
@@ -88,56 +92,42 @@ export default {
    }
  },
  methods: {
-	  previewImg:function(imgUrl){
+	  previewImg(imgUrl) {
 		  uni.previewImage({
 		  	urls:[imgUrl]
 		  })
 	  },
-    closeAttr: function() {
+    closeAttr() {
      this.$emit("changeFun", { action: "changeattr", value: false })
    },
-    CartNumDes: function() {
+    CartNumDes() {
      this.$emit("changeFun", { action: "ChangeCartNum", value: false })
    },
-    CartNumAdd: function() {
+    CartNumAdd() {
      this.$emit("changeFun", { action: "ChangeCartNum", value: 1 })
    },
-    getAttrItemData(attr) {
-      let result = {
-        stock: 0
-      }
-      if (this.attr.productAttr.length === 1) {
-        this.productValueArr.map(item => {
-          if (item.attrItemkey === attr) {
-            result = item
-          }
-        })
-      } else {
-        result.stock = 1
-      }
-      return result
-    },
-    tapAttr: function(indexw, indexn, itemn) {
-      if (this.getAttrItemData(itemn.attr).stock === 0) {
+    tapAttr(index, subIndex, subItem) {
+      // 缺货的点击了没效果
+      if (!subItem.canUsed) {
        return
      }
      // 修改商品规格不生效的原因：
      // H5端下面写法，attr更新，但是除H5外其他端不支持，
      // 尽量避免下面的骚写法，不要在子组件内更新props
      // 这里修改是为了能获取到被选中的属性
-      this.attr.productAttr[indexw].index = indexn
+      this.attr.productAttr[index].index = subIndex
      const value = this.getCheckedValue().sort().join(",")
      this.$emit("changeFun", {
        action: "ChangeAttr",
        value: {
          value,
-          indexw,
-          indexn
+          index,
+          subIndex
        }
      })
    },
    // 获取被选中属性
-    getCheckedValue: function() {
+    getCheckedValue() {
      const productAttr = this.attr.productAttr
      const value = []
      for (let i = 0; i < productAttr.length; i++) {
@@ -451,10 +451,11 @@
        </view>
        
        <ProductWindow
-          v-on:changeFun="changeFun"
+          v-if="productValueArr.length > 0"
          :attr="attr"
          :product-value-arr="productValueArr"
          :cartNum="cart_num"
+          @changeFun="changeFun"
        />
        <ServiceWin ref="serviceWin" :info="storeInfo.guarantee" />
        <StorePoster v-on:setPosterImageStatus="setPosterImageStatus" :posterImageStatus="posterImageStatus"
@@ -482,29 +483,47 @@
 </template>

 <script>
-import ProductConSwiper from "@/components/ProductConSwiper";
-import UserEvaluation from "@/components/UserEvaluation";
-import ProductWindow from "@/components/ProductWindow";
-import StorePoster from "@/components/StorePoster";
-import ShareInfo from "@/components/ShareInfo";
-import CountDown from "@/components/CountDown";
-import ServiceWin from "@/components/ServiceWin";
-import {getCartCount, getProductCode, getProductDetail, postCartAdd} from "@/api/store";
-import {userBindParent} from "@/api/user";
-import {handleQrCode, isWeixin} from "@/utils";
-import {getHomeData} from "@/api/public";
-import {getDailyGoods, getPreSale, getYxStoreSeckill} from "@/api/goods";
-import {mapGetters} from "vuex";
-import {diffDay, formatDateTime} from "@/utils/index";
-import {getCurAddress, getLocation, getUrlParam} from "@/utils/common.js";
-import cookie from "@/utils/store/cookie";
-import {famousGoodsShareImage, secKillGoodsShareImage} from "@/api/share";
-import CouponsPopup from "@/components/CouponsPopup.vue"
-import {addProduct, checkProduct, removeProduct} from "@/api/favorite";
+import ProductConSwiper from '@/components/ProductConSwiper'
+import UserEvaluation from '@/components/UserEvaluation'
+import ProductWindow from '@/components/ProductWindow'
+import StorePoster from '@/components/StorePoster'
+import ShareInfo from '@/components/ShareInfo'
+import CountDown from '@/components/CountDown'
+import ServiceWin from '@/components/ServiceWin'
+import {
+  getCartCount,
+  getProductCode,
+  getProductDetail,
+  postCartAdd,
+  getProductSkuBySelected
+} from '@/api/store'
+import { userBindParent } from '@/api/user'
+import { handleQrCode, isWeixin } from '@/utils'
+import { getHomeData } from '@/api/public'
+import {
+  getDailyGoods,
+  getPreSale,
+  getYxStoreSeckill
+} from '@/api/goods'
+import { mapGetters } from 'vuex'
+import { diffDay, formatDateTime } from '@/utils/index'
+import {
+  getCurAddress,
+  getLocation,
+  getUrlParam
+} from '@/utils/common.js'
+import cookie from '@/utils/store/cookie'
+import { famousGoodsShareImage, secKillGoodsShareImage } from '@/api/share'
+import CouponsPopup from '@/components/CouponsPopup.vue'
+import {
+  addProduct,
+  checkProduct,
+  removeProduct
+} from '@/api/favorite'
 import { pageListenMixins } from '@/mixins/pageListenMixins'

 export default {
-  name: "GoodsCon",
+  name: 'GoodsCon',
  components: {
    CountDown,
    ProductConSwiper,
@@ -518,16 +537,17 @@ export default {
  mixins: [pageListenMixins],
  data: function () {
    return {
-      isProductInfoExpand: true, //商品信息是否展开
+      // 商品信息是否展开
+      isProductInfoExpand: true,
      shareInfoStatus: false,
      weixinStatus: false,
      mapShow: false,
-      mapKey: "",
+      mapKey: '',
      posterData: {
-        image: "",
-        title: "",
-        price: "",
-        code: ""
+        image: '',
+        title: '',
+        price: '',
+        code: ''
      },
      posterImageStatus: false,
      animated: false,
@@ -540,22 +560,23 @@ export default {
        productAttr: [],
        productSelect: {}
      },
-      isOpen: false, //是否打开属性组件
+      // 是否打开属性组件
+      isOpen: false,
      productValueArr: [],
      id: null,
      partnerId: null,
      activityId: 0, // v4 add
-      source: "", // v4 add
+      source: '', // v4 add
      preInfo: {},
      killInfo: {},
      dayInfo: {},
      storeInfo: {},
      couponList: {},
-      attrTxt: "请选择",
-      attrValue: "",
+      attrTxt: '请选择',
+      attrValue: '',
      cart_num: 1, // 购买数量
-      replyCount: "",
-      replyChance: "",
+      replyCount: '',
+      replyChance: '',
      reply: [],
      priceName: 0,
      CartCount: 0,
@@ -563,7 +584,7 @@ export default {
      banner: [{}, {}],
      swiperRecommend: {
        pagination: {
-          el: ".swiper-pagination",
+          el: '.swiper-pagination',
          clickable: true
        },
        autoplay: false,
@@ -575,8 +596,8 @@ export default {
      goodList: [],
      systemStore: {},
      qqmapsdk: null,
-      productConClass: "product-con",
-      tempName: "",
+      productConClass: 'product-con',
+      tempName: '',
      merBestProducts: [],
      buyNotice: null,
      isWenwan: 0,
@@ -592,19 +613,18 @@ export default {
      qualifications: []
    }
  },
-  computed: mapGetters(["isLogin", "location", "userInfo"]),
+  computed: mapGetters(['isLogin', 'location', 'userInfo']),
  onShareAppMessage() {
    return new Promise(async (resolve, reject) => {
      let result;
-      let params = `?id=${this.id}&partnerId=${this.userInfo.uid}`;
+      let params = `?id=${this.id}&partnerId=${this.userInfo.uid}`
      if (this.source === 'famous') {
-        result = await famousGoodsShareImage(this.id);
+        result = await famousGoodsShareImage(this.id)
      }
      if (this.source === 'kill') {
-        result = await secKillGoodsShareImage(this.activityId);
+        result = await secKillGoodsShareImage(this.activityId)
        params += `&activityId=${this.activityId}`
      }
-
      if (result?.status === 200) {
        resolve({
          title: this.storeInfo.storeName,
@@ -620,12 +640,11 @@ export default {
      }
    })
  },
-  onLoad: function (options) {
+  onLoad(options) {
    // test data
-    console.log("getLaunchOptionsSync", uni.getLaunchOptionsSync());
-    console.log("getEnterOptionsSync", uni.getEnterOptionsSync());
+    console.log("getLaunchOptionsSync", uni.getLaunchOptionsSync())
+    console.log("getEnterOptionsSync", uni.getEnterOptionsSync())
    uni.removeStorageSync('couponId')
-
    const from = options.from
    const id = options.id
    switch (from) {
@@ -669,28 +688,27 @@ export default {
        this.pageKeyId = `product_from_common_productId_${id}`
        break
    }
-
-    let url = handleQrCode();
+    const url = handleQrCode()
    if (url && url.productId) {
-      this.id = url.productId;
+      this.id = url.productId
    } else if (options.id) {
-      this.id = options.id || null;
-      this.partnerId = options.partnerId || null;
-      this.activityId = this._route.query.activityId;
-      this.source = this._route.query.from || "";
+      this.id = options.id || null
+      this.partnerId = options.partnerId || null
+      this.activityId = this._route.query.activityId
+      this.source = this._route.query.from || ''
    } else {
-      let obj = uni.getEnterOptionsSync();
+      const obj = uni.getEnterOptionsSync()
      if (options.scene != null || obj.query.scene != null) {
-        let query = options ? decodeURIComponent(options.scene) : decodeURIComponent(obj.query.scene);
-        this.id = getUrlParam(query, "id") || null;
-        this.partnerId = getUrlParam(query, "partnerId") || null;
+        const query = options ? decodeURIComponent(options.scene) : decodeURIComponent(obj.query.scene)
+        this.id = getUrlParam(query, 'id') || null
+        this.partnerId = getUrlParam(query, 'partnerId') || null
      }
    }
-    if (this.partnerId) cookie.set("spread", this.partnerId);
+    if (this.partnerId) cookie.set('spread', this.partnerId)

    // 已登录状态的扫码进入绑定一下上级
    if (url != null && url.spread != null) {
-      let urlSpread = parseInt(url.spread);
+      const urlSpread = parseInt(url.spread);
      if (!Number.isNaN(urlSpread)) {
        //绑定上级
        userBindParent({
@@ -702,23 +720,19 @@ export default {
        })
      }
    }
-
-    setTimeout(() => {
-      this.productCon();
-      this.fetchCompanyDatea();
-
+    this.productCon()
+    this.fetchCompanyDatea()
    switch (this.source) {
      case "pre":
-          this.getPreInfo();
-          break;
+        this.getPreInfo()
+        break
      case "kill":
-          this.getKillInfo();
-          break;
+        this.getKillInfo()
+        break
      case "day":
-          this.getDayInfo();
-          break;
+        this.getDayInfo()
+        break
    }
-    }, 500)
  },
  onShow() {
    this.getMapData()
@@ -726,9 +740,9 @@ export default {
  watch: {
    posterImageStatus(status) {
      if (status) {
-        this.productConClass = "noscroll product-con";
+        this.productConClass = 'noscroll product-con'
      } else {
-        this.productConClass = "product-con";
+        this.productConClass = 'product-con'
      }
    },
    attr: {
@@ -749,7 +763,7 @@ export default {
        qualifications: this.qualifications
      }
      uni.navigateTo({
-        url:'/pages/shop/GoodsCon/qualifications?mer=' + JSON.stringify(merInfo),
+        url: '/pages/shop/GoodsCon/qualifications?mer=' + JSON.stringify(merInfo)
      })
    },
    goRoom() {
@@ -767,7 +781,7 @@ export default {
        url: `/pkg_common/views/room?id=${this.storeInfo.merId}&name=${this.storeInfo.merName}&params=${JSON.stringify(params)}`
      })
    },
-    goodsDetail: function (item) {
+    goodsDetail(item) {
      this.$yrouter.push({
        path: '/pages/shop/GoodsCon/index',
        query: {
@@ -776,34 +790,31 @@ export default {
      })
    },
    async getMapData() {
-      let location = uni.getStorageSync("location");
-
+      let location = uni.getStorageSync('location')
      if (location.length === 0) {
-        const map = await getLocation();
+        const map = await getLocation()
        if (map.length > 1) {
-          const {latitude, longitude} = map[1];
-          let address = await getCurAddress(latitude, longitude);
-          address = address[1].data.result.ad_info;
-          location = address.province + address.city + address.district;
+          const {latitude, longitude} = map[1]
+          let address = await getCurAddress(latitude, longitude)
+          address = address[1].data.result.ad_info
+          location = address.province + address.city + address.district
        }
      }
-
-      this.postAddress = location;
+      this.postAddress = location
    },
    // 获取当前位置经纬度
    handleLoacation(toast) {
-      let that = this;
+      const that = this
      uni.getLocation({
        type: 'gcj02',
        success: async (res) => {
          // 获取到经纬度后根据实际业务做处理，下面业务逻辑仅供参考
-
          const map = await getLocation();
          if (map.length > 1) {
-            const {latitude, longitude} = map[1];
-            let address = await getCurAddress(latitude, longitude);
-            address = address[1].data.result.ad_info;
-            that.postAddress = address.province + address.city + address.district;
+            const {latitude, longitude} = map[1]
+            let address = await getCurAddress(latitude, longitude)
+            address = address[1].data.result.ad_info
+            that.postAddress = address.province + address.city + address.district
          }
        },
        fail: err => {
@@ -883,44 +894,44 @@ export default {
    },
    changeExEnd() {
      if (this.exSliceEnd === 3) {
-        this.exSliceEnd = this.storeInfo.exPropertiesData.length;
+        this.exSliceEnd = this.storeInfo.exPropertiesData.length
      } else {
-        this.exSliceEnd = 3;
+        this.exSliceEnd = 3
      }
    },
    // v4 预售
    getPreInfo() {
      getPreSale(this.activityId).then(({ data }) => {
-        var now = new Date().getTime();
-        var nowStr = formatDateTime(now, 'yyyy-MM-dd');
+        const now = new Date().getTime();
+        const nowStr = formatDateTime(now, 'yyyy-MM-dd');
        data.surplus = diffDay(nowStr, data.stopTime.substring(0, 10))
-        this.preInfo = data;
-        this.handleAttr(data);
+        this.preInfo = data
+        this.handleAttr(data)
      }).catch(err => console.warn("err=", err))
    },
    // v4 秒杀
    getKillInfo() {
      getYxStoreSeckill(this.activityId).then(({ data }) => {
-        let stopTime = data.storeInfo.stopTime;
-        let stopDate = new Date(stopTime.replace(/-/g, "/"));
-        data.stop = Math.floor(stopDate.getTime() / 1000);
+        const stopTime = data.storeInfo.stopTime
+        const stopDate = new Date(stopTime.replace(/-/g, "/"))
+        data.stop = Math.floor(stopDate.getTime() / 1000)
        this.killInfo = data
-        this.handleAttr(data);
+        this.handleAttr(data)
      }).catch(err => console.warn("err=", err))
    },
    // v4 每日特价
    getDayInfo() {
      getDailyGoods(this.activityId).then(({ data }) => {
-        let stopTime = data.stopTime;
-        let stopDate = new Date(stopTime.replace(/-/g, "/"));
-        data.stop = Math.floor(stopDate.getTime() / 1000);
+        const stopTime = data.stopTime
+        const stopDate = new Date(stopTime.replace(/-/g, "/"))
+        data.stop = Math.floor(stopDate.getTime() / 1000)
        this.dayInfo = data
-        this.handleAttr(data);
+        this.handleAttr(data)
      }).catch(err => console.warn("err=", err))
    },
    // 关联商品规格
    handleAttr(data) {
-      this.$set(this.attr, "productAttr", data.productAttr)
+      this.$set(this.attr, 'productAttr', data.productAttr)
      this.productValueArr = []
      for (const key in data.productValue) {
        this.productValueArr.push({
@@ -930,66 +941,66 @@ export default {
      }
      this.DefaultSelect()
    },
-    fetchCompanyDatea: function () {
-      var that = this;
+    fetchCompanyDatea() {
+      const that = this
      getHomeData().then(res => {
        that.buyNotice = res.data.buyNotice.replace(
            /\<img/gi,
            '<img style="max-width:100%;height:auto;"'
-        );
-      });
+        )
+      })
    },
    force2Decimal(v) {
-      return this.$force2Decimal(v);
+      return this.$force2Decimal(v)
    },
    goShoppingCart() {
-      this.$yrouter.switchTab("/pages/cart");
+      this.$yrouter.switchTab('/pages/cart')
    },
    goStoreList() {
      this.$yrouter.push({
-        path: "/pages/shop/StoreList/index"
-      });
+        path: '/pages/shop/StoreList/index'
+      })
    },
    goEvaluateList(id) {
      this.$yrouter.push({
-        path: "/pages/shop/EvaluateList/index",
+        path: '/pages/shop/EvaluateList/index',
        query: {
          id
        }
-      });
+      })
    },
    // 2022/9/28 add
    goStore() {
      this.$yrouter.push({
-        path: "/pagesInn/inn/innHome",
+        path: '/pagesInn/inn/innHome',
        query: {
          id: this.systemStore.id
        }
-      });
+      })
    },
-    showChang: function (data) {
+    showChang(data) {
      this.$yrouter.push({
-        path: "/pages/map/index",
+        path: '/pages/map/index',
        query: data
-      });
+      })
    },
-    setShareInfoStatus: function () {
-      this.shareInfoStatus = !this.shareInfoStatus;
-      this.posters = false;
+    setShareInfoStatus() {
+      this.shareInfoStatus = !this.shareInfoStatus
+      this.posters = false
    },
-    shareCode: function () {
-      var that = this;
+    shareCode() {
+      const that = this
      getProductCode(that.id).then(res => {
-        that.posterData.code = res.data.code;
-        that.listenerActionSheet();
-      });
+        that.posterData.code = res.data.code
+        that.listenerActionSheet()
+      })
    },
-    setPosterImageStatus: function () {
-      this.posterImageStatus = !this.posterImageStatus;
-      this.posters = false;
+    setPosterImageStatus() {
+      this.posterImageStatus = !this.posterImageStatus
+      this.posters = false
    },
    // 产品详情接口
-    productCon: function () {
+    productCon() {
      const from = this.location
      if (this.$deviceType == 'app') {
        from.from = 'app'
@@ -1016,6 +1027,12 @@ export default {
              ...data.productValue[key]
            })
          }
+          // 初始化认为所有的规格都是可以选的
+          this.attr.productAttr.map(item => {
+            item.attrValue.map(subItem => {
+              subItem.canUsed = true
+            })
+          })
        }
        this.attr.defaultSku = data.defaultSku
        this.attr.defaultSkuIndex = data.defaultSkuIndex
@@ -1069,7 +1086,6 @@ export default {
        this.$set(this, 'goodList', goodArray)
        this.DefaultSelect()
        this.getCartCount()
-
        // 动态配置share
        this.$set(this, 'share', {
          title: this.storeInfo.storeName,
@@ -1097,14 +1113,13 @@ export default {
      })
      return result
    },
-    //默认选中属性；
-    DefaultSelect: function () {
+    // 默认选中属性
+    DefaultSelect() {
      const productAttr = this.attr.productAttr
      for (let i = 0; i < productAttr.length; i++) {
-        this.$set(productAttr[i], "index", this.attr.defaultSkuIndex[i]);
+        this.$set(productAttr[i], "index", this.attr.defaultSkuIndex[i])
      }
-
-      const skuKey = this.attr.defaultSku?.join(',')
+      const skuKey = (this.attr.defaultSku || []).join(',')
      if (!skuKey) {
        return
      }
@@ -1112,267 +1127,284 @@ export default {
      if (productSelect && productAttr.length) {
        this.$set(
          this.attr.productSelect,
-            "store_name",
+          'store_name',
          this.storeInfo.storeName
-        );
-        this.$set(this.attr.productSelect, "image", productSelect.image);
-        this.$set(this.attr.productSelect, "price", productSelect.price);
-        this.$set(this.attr.productSelect, "otPrice", productSelect.otPrice);
-        this.$set(this.attr.productSelect, "stock", productSelect.stock);
-        this.$set(this.attr.productSelect, "unique", productSelect.unique);
-        this.$set(this.attr.productSelect, "cart_num", 1);
-        // this.$set(this, "attrValue", value.sort().join(","));
-        this.$set(this, "attrValue", skuKey);
-        this.$set(this, "attrTxt", "已选择");
+        )
+        this.$set(this.attr.productSelect, 'image', productSelect.image)
+        this.$set(this.attr.productSelect, 'price', productSelect.price)
+        this.$set(this.attr.productSelect, 'otPrice', productSelect.otPrice)
+        this.$set(this.attr.productSelect, 'stock', productSelect.stock)
+        this.$set(this.attr.productSelect, 'unique', productSelect.unique)
+        this.$set(this.attr.productSelect, 'cart_num', 1)
+        // this.$set(this, 'attrValue', value.sort().join(','))
+        this.$set(this, 'attrValue', skuKey)
+        this.$set(this, 'attrTxt', '已选择')
+        this.getSkuActiveStatus(skuKey)
      } else if (!productSelect && productAttr.length) {
        this.$set(
          this.attr.productSelect,
-            "store_name",
+          'store_name',
          this.storeInfo.storeName
-        );
-        this.$set(this.attr.productSelect, "image", this.storeInfo.image);
-        this.$set(this.attr.productSelect, "price", this.storeInfo.price);
-        this.$set(this.attr.productSelect, "otPrice", this.storeInfo.otPrice);
-        this.$set(this.attr.productSelect, "stock", 0);
-        this.$set(this.attr.productSelect, "unique", "");
-        this.$set(this.attr.productSelect, "cart_num", 0);
-        this.$set(this, "attrValue", "");
-        this.$set(this, "attrTxt", "请选择");
+        )
+        this.$set(this.attr.productSelect, 'image', this.storeInfo.image)
+        this.$set(this.attr.productSelect, 'price', this.storeInfo.price)
+        this.$set(this.attr.productSelect, 'otPrice', this.storeInfo.otPrice)
+        this.$set(this.attr.productSelect, 'stock', 0)
+        this.$set(this.attr.productSelect, 'unique', '')
+        this.$set(this.attr.productSelect, 'cart_num', 0)
+        this.$set(this, 'attrValue', '')
+        this.$set(this, 'attrTxt', '请选择')
      } else if (!productSelect && !productAttr.length) {
        this.$set(
          this.attr.productSelect,
-            "store_name",
+          'store_name',
          this.storeInfo.storeName
-        );
-        this.$set(this.attr.productSelect, "image", this.storeInfo.image);
-        this.$set(this.attr.productSelect, "price", this.storeInfo.price);
-        this.$set(this.attr.productSelect, "otPrice", this.storeInfo.otPrice);
-        this.$set(this.attr.productSelect, "stock", this.storeInfo.stock);
+        )
+        this.$set(this.attr.productSelect, 'image', this.storeInfo.image)
+        this.$set(this.attr.productSelect, 'price', this.storeInfo.price)
+        this.$set(this.attr.productSelect, 'otPrice', this.storeInfo.otPrice)
+        this.$set(this.attr.productSelect, 'stock', this.storeInfo.stock)
        this.$set(
          this.attr.productSelect,
-            "unique",
-            this.storeInfo.unique || ""
-        );
-        this.$set(this.attr.productSelect, "cart_num", 1);
-        this.$set(this, "attrValue", "");
-        this.$set(this, "attrTxt", "请选择");
+          'unique',
+          this.storeInfo.unique || ''
+        )
+        this.$set(this.attr.productSelect, 'cart_num', 1)
+        this.$set(this, 'attrValue', '')
+        this.$set(this, 'attrTxt', '请选择')
      }
    },
-    //购物车；
-    ChangeCartNum: function (changeValue) {
+    // 购物车
+    ChangeCartNum(changeValue) {
      // changeValue:是否 加|减
      // 获取当前变动属性
-      const productSelect = this.getAttrItemData(this.attrValue);
+      const productSelect = this.getAttrItemData(this.attrValue)
      // 如果没有属性,赋值给商品默认库存
      if (productSelect === undefined && !this.attr.productAttr.length) {
-        productSelect = this.attr.productSelect;
+        productSelect = this.attr.productSelect
      }
-      //无属性值即库存为0；不存在加减；
-      if (productSelect === undefined) return;
-      let stock = productSelect.stock || 0;
-      let num = this.attr.productSelect;
+      // 无属性值即库存为0；不存在加减
+      if (productSelect === undefined) return
+      let stock = productSelect.stock || 0
+      let num = this.attr.productSelect
      if (changeValue) {
-        num.cart_num++;
+        num.cart_num++
        if (num.cart_num > stock) {
          if(stock < 1) {
-            this.$set(this.attr.productSelect, "cart_num", 1);
-            this.$set(this, "cart_num", 1);
+            this.$set(this.attr.productSelect, 'cart_num', 1)
+            this.$set(this, 'cart_num', 1)
          } else {
-            this.$set(this.attr.productSelect, "cart_num", stock);
-            this.$set(this, "cart_num", stock);
+            this.$set(this.attr.productSelect, 'cart_num', stock)
+            this.$set(this, 'cart_num', stock)
          }
        } else {
          if (num.cart_num < 1) {
-            this.$set(this.attr.productSelect, "cart_num", 1);
-            this.$set(this, "cart_num", 1);
+            this.$set(this.attr.productSelect, 'cart_num', 1)
+            this.$set(this, 'cart_num', 1)
          } else {
-            this.$set(this.attr.productSelect, "cart_num", num.cart_num);
-            this.$set(this, "cart_num", num.cart_num);
+            this.$set(this.attr.productSelect, 'cart_num', num.cart_num)
+            this.$set(this, 'cart_num', num.cart_num)
          }
        }
      } else {
-        num.cart_num--;
+        num.cart_num--
        if (num.cart_num < 1) {
-          this.$set(this.attr.productSelect, "cart_num", 1);
-          this.$set(this, "cart_num", 1);
+          this.$set(this.attr.productSelect, 'cart_num', 1)
+          this.$set(this, 'cart_num', 1)
        } else {
-          this.$set(this.attr.productSelect, "cart_num", num.cart_num);
-          this.$set(this, "cart_num", num.cart_num);
+          this.$set(this.attr.productSelect, 'cart_num', num.cart_num)
+          this.$set(this, 'cart_num', num.cart_num)
        }
      }
    },
-    //将父级向子集多次传送的函数合二为一；
-    changeFun: function (opt) {
-      if (typeof opt !== "object") opt = {};
-      let action = opt.action || "";
-      let value = opt.value === undefined ? "" : opt.value;
+    // 将父级向子集多次传送的函数合二为一
+    changeFun(opt) {
+      if (typeof opt !== 'object') opt = {}
+      let action = opt.action || ''
+      let value = opt.value === undefined ? '' : opt.value
      this.cart_num = 1
-      this[action] && this[action](value);
+      this[action] && this[action](value)
    },
-
-    //打开属性插件；
-    selecAttrTap: function () {
-      this.attr.cartAttr = true;
-      this.isOpen = true;
+    // 打开属性插件
+    selecAttrTap() {
+      this.attr.cartAttr = true
+      this.isOpen = true
    },
-    changeattr: function (msg) {
-
+    changeattr(msg) {
      // 修改了规格
-      this.attr.cartAttr = msg;
-      this.isOpen = false;
+      this.attr.cartAttr = msg
+      this.isOpen = false
    },
-    //选择属性；
-    ChangeAttr: function (res) {
+    // 选择属性
+    ChangeAttr(res) {
+      const value = res.value
      // 修改了规格
-      let productSelect = this.getAttrItemData(res.value)
+      let productSelect = this.getAttrItemData(value)
      if (productSelect) {
-        this.attr.productAttr[res.indexw].index = res.indexn;
-        this.$set(this.attr.productSelect, "image", productSelect.image);
-        this.$set(this.attr.productSelect, "price", productSelect.price);
-        this.$set(this.attr.productSelect, "otPrice", productSelect.otPrice);
-        this.$set(this.attr.productSelect, "stock", productSelect.stock);
-        this.$set(this.attr.productSelect, "unique", productSelect.unique);
-        this.$set(this.attr.productSelect, "cart_num", 1);
-        this.$set(this, "attrValue", res.value);
-        this.$set(this, "attrTxt", "已选择");
+        this.attr.productAttr[res.index].index = res.subIndex
+        this.$set(this.attr.productSelect, 'image', productSelect.image)
+        this.$set(this.attr.productSelect, 'price', productSelect.price)
+        this.$set(this.attr.productSelect, 'otPrice', productSelect.otPrice)
+        this.$set(this.attr.productSelect, 'stock', productSelect.stock)
+        this.$set(this.attr.productSelect, 'unique', productSelect.unique)
+        this.$set(this.attr.productSelect, 'cart_num', 1)
+        this.$set(this, 'attrValue', value)
+        this.$set(this, 'attrTxt', '已选择')
+        this.getSkuActiveStatus(value)
      } else {
-        this.$set(this.attr.productSelect, "image", this.storeInfo.image);
-        this.$set(this.attr.productSelect, "price", this.storeInfo.price);
-        this.$set(this.attr.productSelect, "otPrice", this.storeInfo.otPrice);
-        this.$set(this.attr.productSelect, "stock", 0);
-        this.$set(this.attr.productSelect, "unique", "");
-        this.$set(this.attr.productSelect, "cart_num", 0);
-        this.$set(this, "attrValue", "");
-        this.$set(this, "attrTxt", "请选择");
+        this.$set(this.attr.productSelect, 'image', this.storeInfo.image)
+        this.$set(this.attr.productSelect, 'price', this.storeInfo.price)
+        this.$set(this.attr.productSelect, 'otPrice', this.storeInfo.otPrice)
+        this.$set(this.attr.productSelect, 'stock', 0)
+        this.$set(this.attr.productSelect, 'unique', '')
+        this.$set(this.attr.productSelect, 'cart_num', 0)
+        this.$set(this, 'attrValue', '')
+        this.$set(this, 'attrTxt', '请选择')
      }
    },
+    // 获取规格组是否能点击(右上角是否有缺货标识)
+    getSkuActiveStatus(selectedSku) {
+      getProductSkuBySelected(this.id, { selectedSku }).then(res => {
+        const { success, data } = res
+        if (success) {
+          for (const key in data) {
+            if (data[key]) {
+              this.attr.productAttr.map(item => {
+                if (item.attrName === key) {
+                  item.attrValue.map(subItem => {
+                    data[key].map(dataItem => {
+                      if (dataItem.sku === subItem.attr) {
+                        subItem.canUsed = dataItem.canUsed
+                      }
+                    })
+                  })
+                }
+              })
+            }
+          }
+        }
+      })
+    },
    // 点击加入购物车按钮
-    joinCart: function () {
+    joinCart() {
      if ((this.attr.productSelect.stock === 0 && this.attr.cartAttr) || this.storeInfo.stock === 0) {
        return
      }
      // 0=加入购物车
-      this.goCat(0);
+      this.goCat(0)
    },
-    //立即购买；
-    tapBuy: function () {
+    // 立即购买
+    tapBuy() {
      if ((this.attr.productSelect.stock === 0 && this.attr.cartAttr) || this.storeInfo.stock === 0) {
        return
      }
      // 1=直接购买
-      this.goCat(1);
+      this.goCat(1)
    },
-    // 加入购物车；
-    goCat: function (news) {
-      let that = this,
-          productSelect = this.getAttrItemData(this.attrValue)
+    // 加入购物车
+    goCat(news) {
+      const that = this
+      const productSelect = this.getAttrItemData(this.attrValue)
      // 打开属性
      if (that.attrValue) {
        // 默认选中了属性，但是没有打开过属性弹窗还是自动打开让用户查看默认选中的属性
-        that.attr.cartAttr = !that.isOpen ? true : false;
+        that.attr.cartAttr = !that.isOpen ? true : false
      } else {
-        if (that.isOpen) that.attr.cartAttr = true;
-        else that.attr.cartAttr = !that.attr.cartAttr;
+        if (that.isOpen) that.attr.cartAttr = true
+        else that.attr.cartAttr = !that.attr.cartAttr
      }
-
      // 只有关闭属性弹窗时进行加入购物车
      if (that.attr.cartAttr === true && that.isOpen === false) {
-        return (that.isOpen = true);
+        return (that.isOpen = true)
      }
-
      // 如果有属性,没有选择,提示用户选择
      if (
        (that.attr.productAttr.length &&
-              productSelect === undefined &&
-              that.isOpen === true) || productSelect.stock === 0
+          productSelect === undefined && that.isOpen === true
+        ) || productSelect.stock === 0
      ) {
        uni.showToast({
          title: "产品库存不足，请选择其他商品",
          icon: "none",
          duration: 5000
-        });
-        return;
+        })
+        return
      }
-
-      let q = {
+      const q = {
        productId: that.id,
        cartNum: that.attr.productSelect.cart_num,
        new: news,
        uniqueId: that.attr.productSelect !== undefined ?
            that.attr.productSelect.unique : ""
-      };
-
+      }
      // v4 新增活动ID
      switch (this.source) {
        case "pre":
          q.preSaleId = Number(this.activityId)
-          break;
+          break
        case "kill":
          q.secKillId = Number(this.activityId)
-          break;
+          break
        case "day":
          q.dailyGoodsId = Number(this.activityId)
-          break;
+          break
      }
-
-      postCartAdd(q)
-          .then(function (res) {
-            that.isOpen = false;
-            that.attr.cartAttr = false;
+      postCartAdd(q).then(function (res) {
+        that.isOpen = false
+        that.attr.cartAttr = false
        if (news) {
          that.$yrouter.push({
            path: "/pages/order/OrderSubmission/index",
            query: {
              id: res.data.cartId
            }
-              });
+          })
        } else {
          uni.showToast({
            title: "添加购物车成功",
            icon: "success",
            duration: 2000,
            complete: () => {
-                  that.getCartCount(true);
-                }
-              });
+              that.getCartCount(true)
            }
          })
-          .catch(error => {
+        }
+      }).catch(error => {
        that.isOpen = false;
        uni.showToast({
          title: error.msg,
          icon: "none",
          duration: 5000
-            });
-          });
+        })
+      })
    },
    // 获取购物车数量
    getCartCount: function (isAnima) {
-      let that = this;
-      const isLogin = that.isLogin;
+      const that = this
+      const isLogin = that.isLogin
      if (isLogin) {
        getCartCount({
          numType: 0
        }).then(res => {
-          that.CartCount = res.data.count;
+          that.CartCount = res.data.count
          //加入购物车后重置属性
          if (isAnima) {
-            that.animated = true;
+            that.animated = true
            setTimeout(function () {
-              that.animated = false;
-            }, 500);
+              that.animated = false
+            }, 500)
          }
-        });
+        })
      }
    },
-    listenerActionSheet: function () {
+    listenerActionSheet() {
      if (isWeixin() === true) {
-        this.weixinStatus = true;
+        this.weixinStatus = true
      }
-      this.posters = true;
+      this.posters = true
    },
-    listenerActionClose: function () {
-      this.posters = false;
+    listenerActionClose() {
+      this.posters = false
    },
    // v9-2
    changeCoupons() {