From 1915394b278d23b151ff10849c5b6c5360e16afe Mon Sep 17 00:00:00 2001
From: lifizer <913626195@qq.com>
Date: Tue, 24 Sep 2024 15:20:31 +0800
Subject: [PATCH] =?UTF-8?q?Refactor(=E5=95=86=E5=93=81=E8=AF=A6=E6=83=85):?=
 =?UTF-8?q?=E8=A7=84=E6=A0=BC=E6=98=AF=E5=90=A6=E6=97=A0=E5=BA=93=E5=AD=98?=
 =?UTF-8?q?=E9=80=9A=E8=BF=87=E6=8E=A5=E5=8F=A3=E6=9F=A5=E8=AF=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 api/store.js                  |   9 +
 components/ProductWindow.vue  |  56 ++-
 pages/shop/GoodsCon/index.vue | 678 ++++++++++++++++++----------------
 3 files changed, 387 insertions(+), 356 deletions(-)

diff --git a/api/store.js b/api/store.js
index cc981d5..55a6e35 100644
--- a/api/store.js
+++ b/api/store.js
@@ -25,6 +25,15 @@ export function getProductDetail(id, data) {
     });
 }
 
+/*
+ * 商品规格选中
+ * */
+export function getProductSkuBySelected(id, data) {
+    return request.get("api/product/getSkuBySelected/" + id, data, {
+        login: true
+    });
+}
+
 /*
  * 商品分销二维码
  * */
diff --git a/components/ProductWindow.vue b/components/ProductWindow.vue
index 7726c75..a4b50ef 100644
--- a/components/ProductWindow.vue
+++ b/components/ProductWindow.vue
@@ -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++) {
diff --git a/pages/shop/GoodsCon/index.vue b/pages/shop/GoodsCon/index.vue
index 5227a94..cda6184 100644
--- a/pages/shop/GoodsCon/index.vue
+++ b/pages/shop/GoodsCon/index.vue
@@ -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: "",
-      cart_num: 1, //购买数量
-      replyCount: "",
-      replyChance: "",
+      attrTxt: '请选择',
+      attrValue: '',
+      cart_num: 1, // 购买数量
+      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();
-
-      switch (this.source) {
-        case "pre":
-          this.getPreInfo();
-          break;
-        case "kill":
-          this.getKillInfo();
-          break;
-        case "day":
-          this.getDayInfo();
-          break;
-      }
-    }, 500)
+    this.productCon()
+    this.fetchCompanyDatea()
+    switch (this.source) {
+      case "pre":
+        this.getPreInfo()
+        break
+      case "kill":
+        this.getKillInfo()
+        break
+      case "day":
+        this.getDayInfo()
+        break
+    }
   },
   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 => {
@@ -816,7 +827,7 @@ export default {
             this.$u.toast('您已拒绝授权，相关功能会无法使用！')
             return
           }
-          //用户已授权，但是获取地理位置失败，提示用户去系统设置中打开定位
+          // 用户已授权，但是获取地理位置失败，提示用户去系统设置中打开定位
           uni.showModal({
             title: '提示',
             content: '请在系统设置中打开定位服务，重新进入小程序！'
@@ -826,7 +837,7 @@ export default {
     },
     // 定位获取位置信息授权逻辑
     getAddress() {
-      //wx.getSetting是获取用户授权的信息的，除了应用在位置信息授权还能应用在用户信息授权等等
+      // wx.getSetting是获取用户授权的信息的，除了应用在位置信息授权还能应用在用户信息授权等等
       uni.getSetting({
         success: res => {
           // true说明已经授权，如果还拿不到定位信息，说明用户的手机没开启定位功能
@@ -859,7 +870,7 @@ export default {
                     success: dataAu => {
                       if (dataAu.authSetting['scope.userLocation'] === true) {
                         this.$u.toast('授权成功!')
-                        //再次授权，调用getLocationt的API
+                        // 再次授权，调用getLocationt的API
                         this.handleLoacation(false)
                       } else {
                         // this.isLocation = false
@@ -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,282 +1113,298 @@ 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
       }
       const productSelect = this.getAttrItemData(skuKey)
       if (productSelect && productAttr.length) {
         this.$set(
-            this.attr.productSelect,
-            "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.attr.productSelect,
+          '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.getSkuActiveStatus(skuKey)
       } else if (!productSelect && productAttr.length) {
         this.$set(
-            this.attr.productSelect,
-            "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.attr.productSelect,
+          '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', '请选择')
       } else if (!productSelect && !productAttr.length) {
         this.$set(
-            this.attr.productSelect,
-            "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.attr.productSelect,
+          '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,
-            "unique",
-            this.storeInfo.unique || ""
-        );
-        this.$set(this.attr.productSelect, "cart_num", 1);
-        this.$set(this, "attrValue", "");
-        this.$set(this, "attrTxt", "请选择");
+          this.attr.productSelect,
+          'unique',
+          this.storeInfo.unique || ''
+        )
+        this.$set(this.attr.productSelect, 'cart_num', 1)
+        this.$set(this, 'attrValue', '')
+        this.$set(this, 'attrTxt', '请选择')
       }
     },
-    //购物车；
-    ChangeCartNum: function (changeValue) {
-      //changeValue:是否 加|减
-      //获取当前变动属性
-      const productSelect = this.getAttrItemData(this.attrValue);
-      //如果没有属性,赋值给商品默认库存
+    // 购物车
+    ChangeCartNum(changeValue) {
+      // changeValue:是否 加|减
+      // 获取当前变动属性
+      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', '请选择')
       }
     },
-    //  点击加入购物车按钮
-    joinCart: function () {
+    // 获取规格组是否能点击(右上角是否有缺货标识)
+    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() {
       if ((this.attr.productSelect.stock === 0 && this.attr.cartAttr) || this.storeInfo.stock === 0) {
         return
       }
-      //0=加入购物车
-      this.goCat(0);
+      // 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);
+      // 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
+        (that.attr.productAttr.length &&
+          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;
-            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);
-                }
-              });
+      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
             }
           })
-          .catch(error => {
-            that.isOpen = false;
-            uni.showToast({
-              title: error.msg,
-              icon: "none",
-              duration: 5000
-            });
-          });
+        } else {
+          uni.showToast({
+            title: "添加购物车成功",
+            icon: "success",
+            duration: 2000,
+            complete: () => {
+              that.getCartCount(true)
+            }
+          })
+        }
+      }).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() {