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

This commit is contained in:
lifizer
2024-03-30 13:02:38 +08:00
parent bc64e2a737
commit 96a439a8df
2 changed files with 123 additions and 267 deletions
+19 -7
View File
@@ -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) {
const productValue = JSON.parse(this.productValueStr || '{}')
if (productValue[itemn.attr]) {
if (productValue[itemn.attr].stock === 0) {
return
getAttrItemData(attr) {
let result = {}
this.productValueArr.map(item => {
if (item.attrItemkey === attr) {
result = item
}
})
return result
},
tapAttr: function(indexw, indexn, itemn) {
if (this.getAttrItemData(itemn.attr).stock === 0) {
return
}
// 修改商品规格不生效的原因:
// H5端下面写法,attr更新,但是除H5外其他端不支持,
+104 -260
View File
@@ -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(({
data
}) => {
getPreSale(this.activityId).then(({ 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(({
data
}) => {
getYxStoreSeckill(this.activityId).then(({ 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(({
data
}) => {
getDailyGoods(this.activityId).then(({ 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, "productValue", data.productValue);
this.DefaultSelect();
},
priceRangeStr: function (prices) {
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.$set(this.attr, "productAttr", data.productAttr)
this.productValueArr = []
for (const key in data.productValue) {
this.productValueArr.push({
attrItemkey: key,
...data.productValue[key]
})
}
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;
let from = this.location;
if (this.$deviceType == "app") {
from.from = "app";
const from = this.location
if (this.$deviceType == 'app') {
from.from = 'app'
}
if (that.source === 'kill') {
from.seckillId = that.activityId
if (this.source === 'kill') {
from.seckillId = this.activityId
}
uni.showLoading({
title: "加载中",
title: '加载中',
mask: true
});
getProductDetail(that.id, from)
.then(res => {
// 会造成两个style属性,并且生效的是后一个
// res.data.storeInfo.description = res.data.storeInfo.description.replace(
// /\<img/gi,
// '<img style="display:block;max-width:100%;height:auto;"'
// );
that.$set(that, "storeInfo", res.data.storeInfo);
that.isWenwan = res.data.isWenwan;
})
getProductDetail(this.id, from).then(res => {
const { data } = res
this.$set(this, 'storeInfo', data.storeInfo)
this.isWenwan = data.isWenwan
// 给 attr 赋值,将请求回来的规格赋值给 attr
if (this.source === '' || this.source === 'famous') {
this.$set(this.attr, 'productAttr', data.productAttr)
this.productValueArr = []
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
if (this.source === "" || this.source === 'famous') {
that.$set(that.attr, "productAttr", res.data.productAttr);
that.$set(that, "productValue", res.data.productValue);
}
that.attr.defaultSku = res.data.defaultSku
that.attr.defaultSkuIndex = res.data.defaultSkuIndex
data.couponList['unusable']?.map(item => item.status = 2)
this.$set(this, 'couponList', data.couponList)
this.$set(this, 'replyCount', data.replyCount)
this.$set(this, 'replyChance', data.replyChance)
this.reply = data.reply ? [data.reply] : []
this.$set(this, 'reply', this.reply)
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)
that.$set(that, 'couponList', res.data.couponList)
that.$set(that, "replyCount", res.data.replyCount);
that.$set(that, "replyChance", res.data.replyChance);
that.reply = res.data.reply ? [res.data.reply] : [];
that.$set(that, "reply", that.reply);
that.$set(that, "priceName", res.data.priceName);
that.$set(that, "tempName", res.data.tempName);
that.$set(that, "merBestProducts", res.data.merBestProducts);
that.posterData.image = that.storeInfo.image;
if (that.storeInfo.storeName.length > 30) {
that.posterData.title =
that.storeInfo.storeName.substring(0, 30) + "...";
} else {
that.posterData.title = that.storeInfo.storeName;
}
that.posterData.price = that.storeInfo.price;
that.posterData.code = that.storeInfo.codeBase;
that.systemStore = res.data.systemStore;
let good_list = res.data.goodList || [];
let goodArray = [];
let count = Math.ceil(good_list.length / 6);
for (let i = 0; i < count; i++) {
var list = good_list.slice(i * 6, 6);
if (list.length)
goodArray.push({
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();
});
// 动态配置share
this.$set(this, 'share', {
title: this.storeInfo.storeName,
path: '/pages/shop/GoodsCon/index?id=' + this.id,
imageUrl: this.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()
})
},
getAttrItemData(attr) {
let result = {}
this.productValueArr.map(item => {
if (item.attrItemkey === attr) {
result = item
}
})
return result
},
//默认选中属性;
DefaultSelect: function () {
let productAttr = this.attr.productAttr;
let value = [];
const productAttr = this.attr.productAttr
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) {
//默认选中了属性,但是没有打开过属性弹窗还是自动打开让用户查看默认选中的属性