Fix(商品):[#1015]规格改为包含小数点的名称后，无法操作

components/ProductWindow.vue

@@ -24,14 +24,14 @@
               :key="indexn"
               :class="{
                 'on': item.index == indexn,
-                'disabled': productValue[itemn.attr].stock === 0
+                'disabled': getAttrItemData(itemn.attr).stock === 0
               }"
               class="itemn"
               @click="tapAttr(indexw, indexn, itemn)"
             >
               {{ itemn.attr }}
               <text
-                v-if="productValue[itemn.attr].stock === 0"
+                v-if="getAttrItemData(itemn.attr).stock === 0"
                 class="tag"
               >缺货</text>
             </view>
@@ -71,6 +71,12 @@ export default {
       type: String,
       default: '{}'
     },
+    productValueArr: {
+      type: Array,
+      default: () => {
+        return []
+      }
+    },
     cartNum: {
       type: Number,
       default: () => 1
@@ -91,12 +97,18 @@ export default {
     CartNumAdd: function() {
       this.$emit("changeFun", { action: "ChangeCartNum", value: 1 })
     },
-    tapAttr: function(indexw, indexn, itemn) {
+    getAttrItemData(attr) {
-      const productValue = JSON.parse(this.productValueStr || '{}')
+      let result = {}
-      if (productValue[itemn.attr]) {
+      this.productValueArr.map(item => {
-        if (productValue[itemn.attr].stock === 0) {
+        if (item.attrItemkey === attr) {
-          return
+          result = item
         }
+      })
+      return result
+    },
+    tapAttr: function(indexw, indexn, itemn) {
+      if (this.getAttrItemData(itemn.attr).stock === 0) {
+        return
       }
       // 修改商品规格不生效的原因：
       // H5端下面写法，attr更新，但是除H5外其他端不支持，

pages/shop/GoodsCon/index.vue

@@ -23,41 +23,12 @@
               <text style="color: #999999;font-size: 24rpx;text-decoration: line-through;">
                 {{ attr.productSelect.otPrice }}
               </text>
-              <!--              <block v-if="Object.values(productValue).length>1">-->
-              <!--                <text class="num">￥{{ priceRangeStr(productValue) }}</text>-->
-              <!--                <text style="color: #999999;font-size: 24rpx;">￥</text>-->
-              <!--                <text-->
-              <!--                    style="color: #999999;font-size: 24rpx;text-decoration: line-through;">-->
-              <!--                  {{ minMaxOtPrice(productValue).min }}-->
-              <!--                </text>-->
-              <!--                <text style="color: #999999;font-size: 24rpx;">-</text>-->
-              <!--                <text style="color: #999999;font-size: 24rpx;">￥</text>-->
-              <!--                <text-->
-              <!--                    style="color: #999999;font-size: 24rpx;text-decoration: line-through;">-->
-              <!--                  {{ minMaxOtPrice(productValue).max }}-->
-              <!--                </text>-->
-              <!--              </block>-->
-              <!--              <block v-else>-->
-              <!--                <text class="num"-->
-              <!--                      v-if="storeInfo.vipPrice && storeInfo.vipPrice > 0">￥{{ force2Decimal(storeInfo.vipPrice) }}-->
-              <!--                </text>-->
-              <!--                <text v-else class="num">￥{{ force2Decimal(storeInfo.price) }}</text>-->
-              <!--                <text style="text-decoration: line-through;color: #999999;font-size: 24rpx;"-->
-              <!--                      v-if="storeInfo.otPrice && storeInfo.otPrice>0">￥{{ force2Decimal(storeInfo.otPrice) }}-->
-              <!--                </text>-->
-              <!--              </block>-->
               <text v-if="storeInfo.vipPrice && storeInfo.vipPrice > 0" class="vip-price-tag">已享受会员价格</text>
             </view>
             <view style="flex-shrink:0;" class="acea-row row-middle" @click="listenerActionSheet">
               <image :src="webUrl+'/20210806121714655368.png'" mode="" style="width: 36rpx;height: 36rpx;"></image>
             </view>
           </view>
-          <!-- 文玩 -->
-          <!--          <view class="wenwan-info flex jc-between ai-center" v-if="isWenwan===1">-->
-          <!--            <text>产地:{{ storeInfo.origin }}</text>-->
-          <!--            <text>单位:{{ storeInfo.unitName }}</text>-->
-          <!--            <text>规格:{{ storeInfo.storeInfo }}</text>-->
-          <!--          </view>-->
         </view>
 
         <!-- v4 特产 -->
@@ -76,31 +47,6 @@
                   {{ attr.productSelect.otPrice }}
                 </text>
               </view>
-              <!--              <block v-if="Object.values(productValue).length>1">-->
-              <!--                <view class="money font-color-lightred acea-row row-middle">-->
-              <!--                  <text class="num">￥{{ priceRangeStr(productValue) }}</text>-->
-              <!--                  <text style="color: #999999;font-size: 24rpx;">￥</text>-->
-              <!--                  <text-->
-              <!--                      style="color: #999999;font-size: 24rpx;text-decoration: line-through;">-->
-              <!--                    {{ minMaxOtPrice(productValue).min }}-->
-              <!--                  </text>-->
-              <!--                  <text style="color: #999999;font-size: 24rpx;">-</text>-->
-              <!--                  <text style="color: #999999;font-size: 24rpx;">￥</text>-->
-              <!--                  <text-->
-              <!--                      style="color: #999999;font-size: 24rpx;text-decoration: line-through;">-->
-              <!--                    {{ minMaxOtPrice(productValue).max }}-->
-              <!--                  </text>-->
-              <!--                </view>-->
-              <!--              </block>-->
-              <!--              <block v-else>-->
-              <!--                <text class="price"-->
-              <!--                      v-if="storeInfo.vipPrice && storeInfo.vipPrice > 0">￥{{ force2Decimal(storeInfo.vipPrice) }}-->
-              <!--                </text>-->
-              <!--                <text v-else class="price">￥{{ force2Decimal(storeInfo.price) }}</text>-->
-              <!--                <text style="text-decoration: line-through;color: #A5A5A5;font-size: 22rpx;"-->
-              <!--                      v-if="storeInfo.otPrice && storeInfo.otPrice>0">￥{{ force2Decimal(storeInfo.otPrice) }}-->
-              <!--                </text>-->
-              <!--              </block>-->
               <text v-if="storeInfo.origin" class="vip-price-tag">{{ storeInfo.origin }}</text>
             </view>
 
@@ -266,32 +212,6 @@
           </view>
         </view>
         <!-- v6服务项目结束 -->
-
-        <!-- 门店信息开始 -->
-        <!--        <view class="shop-info" v-if="systemStore">-->
-        <!--          <view class="title flex jc-between ai-center">-->
-        <!--            <view class="flex ai-center">-->
-        <!--              <image class="icon-shop" :src="webUrl+'/20210806122617026592.png'"/>-->
-        <!--              <text class="tip">门店信息</text>-->
-        <!--            </view>-->
-        <!--            <text class="font-color-lightred" @click="goStore">进入店铺</text>-->
-        <!--          </view>-->
-
-        <!--          <view class="flex" @click="showChang(systemStore)">-->
-        <!--            <image class="cover flex-0" :src="systemStore.image"/>-->
-        <!--            <view class="flex flex-col jc-between" style="width: 100%;">-->
-        <!--              <view class="flex jc-between ai-center">-->
-        <!--                <text class="name">{{ systemStore.name }}</text>-->
-        <!--                <text class="distance" v-if="systemStore.distance != null">距离{{ systemStore.distance }}千米</text>-->
-        <!--              </view>-->
-        <!--              <view class="flex jc-between ai-center">-->
-        <!--                <view class="address one-t">{{ systemStore.address }}</view>-->
-        <!--                <image class="icon-pos flex-0" :src="webUrl+'/20220903142929759087.png'"/>-->
-        <!--              </view>-->
-        <!--            </view>-->
-        <!--          </view>-->
-        <!--        </view>-->
-
         <view class="store-section goods-section" v-if="systemStore">
           <view class="flex jc-between ai-center">
             <view class="title bold flex ai-center">
@@ -357,48 +277,8 @@
         </view>
         <!-- 用户评价结束 -->
 
-        <!-- 商品信息开始 -->
-        <!-- <view class="product-info acea-row row-column" style="flex-wrap: nowrap;">
-		  <view class="product-info-item acea-row row-between" style="border-bottom: none;">
-			  <view class="product-item-title" style="font-size: 32rpx;color: #080F1A;font-weight: bold;">商品信息</view>
-			  <view class="product-item-value" @click="toggleProductInfo">
-				  <uni-icons :type="isProductInfoExpand?'arrowdown':'arrowup'"></uni-icons>
-			  </view>
-		  </view>
-
-		  <block v-if="isProductInfoExpand">
-			  <view class="product-info-item acea-row row-between">
-			  			  <view class="product-item-title">销量</view>
-			  			  <view class="product-item-value">{{storeInfo.sales}}{{storeInfo.unitName||''}}</view>
-			  </view>
-			  <view class="product-info-item acea-row row-between">
-			  			  <view class="product-item-title">库存</view>
-			  			  <view class="product-item-value">{{storeInfo.stock||0}}{{storeInfo.unitName||''}}</view>
-			  </view>
-
-			  <view v-if="systemStore" class="product-info-item acea-row row-between">
-			  			  <view class="product-item-title">店铺</view>
-			  			  <view class="product-item-value acea-row row-middle" style="flex-wrap: nowrap;">
-						  <image :src="systemStore.image" mode="" style="width: 40rpx;height: 40rpx;border-radius: 50%;flex-shrink: 0;"></image>
-						  {{systemStore.name||''}}
-						  </view>
-			  </view>
-			  <view v-if="systemStore" class="product-info-item acea-row row-between">
-			  			  <view class="product-item-title">地址</view>
-			  			  <view class="product-item-value">{{systemStore.address||''}}</view>
-			  </view>
-			  <view class="product-info-item acea-row row-between">
-			  			  <view class="product-item-title">距离</view>
-			  			  <view class="product-item-value">{{systemStore.distance}}km</view>
-			  </view>
-		  </block>
-	  </view> -->
-        <!-- 商品信息结束 -->
-
         <!-- 商品详情开始 -->
         <view class="product-intro" style="margin-top: 24rpx">
-          <!-- 原模块 -->
-          <!--          <view class="conter" v-html="storeInfo.description" ></view>-->
           <rich-text :nodes="storeInfo.description" v-if="source!='pre' && source!='day'"/>
           <!-- v4 预售详情 -->
           <rich-text :nodes="preInfo.description" v-if="source==='pre'"/>
@@ -475,7 +355,7 @@
         <ProductWindow
           v-on:changeFun="changeFun"
           :attr="attr"
-          :product-value-str="JSON.stringify(productValue)"
+          :product-value-arr="productValueArr"
           :cartNum="cart_num"
         />
         <StorePoster v-on:setPosterImageStatus="setPosterImageStatus" :posterImageStatus="posterImageStatus"
@@ -558,7 +438,7 @@ export default {
         productSelect: {}
       },
       isOpen: false, //是否打开属性组件
-      productValue: {},
+      productValueArr: [],
       id: null,
       partnerId: null,
       activityId: 0, // v4 add
@@ -838,9 +718,7 @@ export default {
     },
     // v4 预售
     getPreInfo() {
-      getPreSale(this.activityId).then(({
+      getPreSale(this.activityId).then(({ data }) => {
-                                          data
-                                        }) => {
         var now = new Date().getTime();
         var nowStr = formatDateTime(now, 'yyyy-MM-dd');
         data.surplus = diffDay(nowStr, data.stopTime.substring(0, 10))
@@ -850,9 +728,7 @@ export default {
     },
     // v4 秒杀
     getKillInfo() {
-      getYxStoreSeckill(this.activityId).then(({
+      getYxStoreSeckill(this.activityId).then(({ data }) => {
-                                                 data
-                                               }) => {
         let stopTime = data.storeInfo.stopTime;
         let stopDate = new Date(stopTime.replace(/-/g, "/"));
         data.stop = Math.floor(stopDate.getTime() / 1000);
@@ -862,9 +738,7 @@ export default {
     },
     // v4 每日特价
     getDayInfo() {
-      getDailyGoods(this.activityId).then(({
+      getDailyGoods(this.activityId).then(({ data }) => {
-                                             data
-                                           }) => {
         let stopTime = data.stopTime;
         let stopDate = new Date(stopTime.replace(/-/g, "/"));
         data.stop = Math.floor(stopDate.getTime() / 1000);
@@ -874,40 +748,15 @@ export default {
     },
     // 关联商品规格
     handleAttr(data) {
-      this.$set(this.attr, "productAttr", data.productAttr);
+      this.$set(this.attr, "productAttr", data.productAttr)
-      this.$set(this, "productValue", data.productValue);
+      this.productValueArr = []
-      this.DefaultSelect();
+      for (const key in data.productValue) {
-    },
+        this.productValueArr.push({
-
+          attrItemkey: key,
-    priceRangeStr: function (prices) {
+          ...data.productValue[key]
-      var ret = '';
+        })
-      var maxPrice = 0;
-      var minPrice = Object.values(prices)[0].price;
-
-      Object.values(prices).forEach((item) => {
-        minPrice = Math.min(minPrice, item.price);
-        maxPrice = Math.max(maxPrice, item.price);
-      })
-      if (maxPrice >= 0 && minPrice >= 0) {
-        if (maxPrice > minPrice) {
-          ret = minPrice + '-' + maxPrice;
-        } else if (maxPrice == minPrice) {
-          ret = minPrice;
-        }
-      }
-      return ret;
-    },
-    minMaxOtPrice: function (prices) {
-      var maxPrice = Object.values(prices)[0].otPrice;
-      var minPrice = Object.values(prices)[0].otPrice;
-      Object.values(prices).forEach((item) => {
-        minPrice = Math.min(minPrice, item.otPrice);
-        maxPrice = Math.max(maxPrice, item.otPrice);
-      })
-      return {
-        min: minPrice,
-        max: maxPrice
       }
+      this.DefaultSelect()
     },
     fetchCompanyDatea: function () {
       var that = this;
@@ -921,17 +770,9 @@ export default {
     force2Decimal(v) {
       return this.$force2Decimal(v);
     },
-    toggleProductInfo() {
-      this.isProductInfoExpand = !this.isProductInfoExpand;
-    },
     goShoppingCart() {
       this.$yrouter.switchTab("/pages/cart");
     },
-    goCustomerList() {
-      this.$yrouter.push({
-        path: "/pages/user/CustomerList/index"
-      });
-    },
     goStoreList() {
       this.$yrouter.push({
         path: "/pages/shop/StoreList/index"
@@ -977,105 +818,108 @@ export default {
     },
     //产品详情接口；
     productCon: function () {
-      let that = this;
+      const from = this.location
-      let from = this.location;
+      if (this.$deviceType == 'app') {
-      if (this.$deviceType == "app") {
+        from.from = 'app'
-        from.from = "app";
       }
-      if (that.source === 'kill') {
+      if (this.source === 'kill') {
-        from.seckillId = that.activityId
+        from.seckillId = this.activityId
       }
-
       uni.showLoading({
-        title: "加载中",
+        title: '加载中',
         mask: true
-      });
+      })
-      getProductDetail(that.id, from)
+      getProductDetail(this.id, from).then(res => {
-          .then(res => {
+        const { data } = res
-            // 会造成两个style属性，并且生效的是后一个
+        this.$set(this, 'storeInfo', data.storeInfo)
-            // res.data.storeInfo.description = res.data.storeInfo.description.replace(
+        this.isWenwan = data.isWenwan
-            //     /\<img/gi,
+        // 给 attr 赋值，将请求回来的规格赋值给 attr
-            //     '<img style="display:block;max-width:100%;height:auto;"'
+        if (this.source === '' || this.source === 'famous') {
-            // );
+          this.$set(this.attr, 'productAttr', data.productAttr)
-            that.$set(that, "storeInfo", res.data.storeInfo);
+          this.productValueArr = []
-            that.isWenwan = res.data.isWenwan;
+          for (const key in data.productValue) {
+            this.productValueArr.push({
+              attrItemkey: key,
+              ...data.productValue[key]
+            })
+          }
+        }
+        this.attr.defaultSku = data.defaultSku
+        this.attr.defaultSkuIndex = data.defaultSkuIndex
 
-            // 给 attr 赋值，将请求回来的规格赋值给 attr
+        data.couponList['unusable']?.map(item => item.status = 2)
-            if (this.source === "" || this.source === 'famous') {
+        this.$set(this, 'couponList', data.couponList)
-              that.$set(that.attr, "productAttr", res.data.productAttr);
+        this.$set(this, 'replyCount', data.replyCount)
-              that.$set(that, "productValue", res.data.productValue);
+        this.$set(this, 'replyChance', data.replyChance)
-            }
+        this.reply = data.reply ? [data.reply] : []
-            that.attr.defaultSku = res.data.defaultSku
+        this.$set(this, 'reply', this.reply)
-            that.attr.defaultSkuIndex = res.data.defaultSkuIndex
+        this.$set(this, 'priceName', data.priceName)
+        this.$set(this, 'tempName', data.tempName)
+        this.$set(this, 'merBestProducts', data.merBestProducts)
+        this.posterData.image = this.storeInfo.image
+        if (this.storeInfo.storeName.length > 30) {
+          this.posterData.title = this.storeInfo.storeName.substring(0, 30) + '...'
+        } else {
+          this.posterData.title = this.storeInfo.storeName
+        }
+        this.posterData.price = this.storeInfo.price
+        this.posterData.code = this.storeInfo.codeBase
+        this.systemStore = data.systemStore
+        const good_list = data.goodList || []
+        const goodArray = []
+        const count = Math.ceil(good_list.length / 6)
+        for (let i = 0; i < count; i++) {
+          const list = good_list.slice(i * 6, 6)
+          if (list.length) {
+            goodArray.push({
+              list: list
+            })
+          }
+        }
+        this.mapKay = data.mapKay
+        this.$set(this, 'goodList', goodArray)
+        this.DefaultSelect()
+        this.getCartCount()
 
-            res.data.couponList['unusable']?.map(item => item.status = 2)
+        // 动态配置share
-            that.$set(that, 'couponList', res.data.couponList)
+        this.$set(this, 'share', {
-            that.$set(that, "replyCount", res.data.replyCount);
+          title: this.storeInfo.storeName,
-            that.$set(that, "replyChance", res.data.replyChance);
+          path: '/pages/shop/GoodsCon/index?id=' + this.id,
-            that.reply = res.data.reply ? [res.data.reply] : [];
+          imageUrl: this.storeInfo.image,
-            that.$set(that, "reply", that.reply);
+          desc: '',
-            that.$set(that, "priceName", res.data.priceName);
+          content: ''
-            that.$set(that, "tempName", res.data.tempName);
+        })
-            that.$set(that, "merBestProducts", res.data.merBestProducts);
+      }).catch(err => {
-            that.posterData.image = that.storeInfo.image;
+        uni.showToast({
-            if (that.storeInfo.storeName.length > 30) {
+          title: err.msg || err.response.data.msg || err.response.data.message,
-              that.posterData.title =
+          icon: 'none',
-                  that.storeInfo.storeName.substring(0, 30) + "...";
+          duration: 2000
-            } else {
+        })
-              that.posterData.title = that.storeInfo.storeName;
+      }).finally(() => {
-            }
+        uni.hideLoading()
-            that.posterData.price = that.storeInfo.price;
+      })
-            that.posterData.code = that.storeInfo.codeBase;
+    },
-            that.systemStore = res.data.systemStore;
+    getAttrItemData(attr) {
-            let good_list = res.data.goodList || [];
+      let result = {}
-            let goodArray = [];
+      this.productValueArr.map(item => {
-            let count = Math.ceil(good_list.length / 6);
+        if (item.attrItemkey === attr) {
-            for (let i = 0; i < count; i++) {
+          result = item
-              var list = good_list.slice(i * 6, 6);
+        }
-              if (list.length)
+      })
-                goodArray.push({
+      return result
-                  list: list
-                });
-            }
-            that.mapKay = res.data.mapKay;
-            that.$set(that, "goodList", goodArray);
-            that.DefaultSelect();
-            that.getCartCount();
-
-            //动态配置share
-            that.$set(that, "share", {
-              title: that.storeInfo.storeName,
-              path: '/pages/shop/GoodsCon/index?id=' + that.id,
-              imageUrl: that.storeInfo.image,
-              desc: '',
-              content: ''
-            });
-
-          })
-          .catch(err => {
-            uni.showToast({
-              title: err.msg || err.response.data.msg || err.response.data.message,
-              icon: "none",
-              duration: 2000
-            });
-          })
-          .finally(() => {
-            uni.hideLoading();
-          });
     },
     //默认选中属性；
     DefaultSelect: function () {
-      let productAttr = this.attr.productAttr;
+      const productAttr = this.attr.productAttr
-      let value = [];
       for (let i = 0; i < productAttr.length; i++) {
         this.$set(productAttr[i], "index", this.attr.defaultSkuIndex[i]);
-        value.push(productAttr[i].attrValueArr[1]);
       }
-      //sort();排序函数:数字-英文-汉字；
-      // let productSelect = this.productValue[value.sort().join(",")];
 
       const skuKey = this.attr.defaultSku?.join(',')
-      let productSelect = this.productValue[skuKey]
+      if (!skuKey) {
+        return
+      }
+      const productSelect = this.getAttrItemData(skuKey)
       if (productSelect && productAttr.length) {
         this.$set(
             this.attr.productSelect,
@@ -1129,7 +973,7 @@ export default {
     ChangeCartNum: function (changeValue) {
       //changeValue:是否 加|减
       //获取当前变动属性
-      let productSelect = this.productValue[this.attrValue];
+      const productSelect = this.getAttrItemData(this.attrValue);
       //如果没有属性,赋值给商品默认库存
       if (productSelect === undefined && !this.attr.productAttr.length) {
         productSelect = this.attr.productSelect;
@@ -1180,7 +1024,7 @@ export default {
     //选择属性；
     ChangeAttr: function (res) {
       // 修改了规格
-      let productSelect = this.productValue[res.value];
+      let productSelect = this.getAttrItemData(res.value)
       if (productSelect) {
         this.attr.productAttr[res.indexw].index = res.indexn;
         this.$set(this.attr.productSelect, "image", productSelect.image);
@@ -1217,7 +1061,7 @@ export default {
     // 加入购物车；
     goCat: function (news) {
       let that = this,
-          productSelect = that.productValue[this.attrValue];
+          productSelect = this.getAttrItemData(this.attrValue)
       //打开属性
       if (that.attrValue) {
         //默认选中了属性，但是没有打开过属性弹窗还是自动打开让用户查看默认选中的属性