diff --git a/assets/css/goods.less b/assets/css/goods.less
index 8c575ba..ed2ccdf 100644
--- a/assets/css/goods.less
+++ b/assets/css/goods.less
@@ -25,7 +25,7 @@
}
.goods-section {
- margin: 24rpx;
+ margin: 0 24upx 24upx 24upx;
padding: 30rpx 24rpx;
border-radius: 20rpx;
background: #fff;
@@ -103,6 +103,15 @@
color: #333;
font-size: 30rpx;
}
+ .store-btn {
+ display: flex;
+ padding: 12upx;
+ border-radius: 6upx;
+ color: #fff;
+ line-height: 20upx;
+ font-size: 24rpx;
+ background-color: #FF564A;
+ }
.value {
color: #666;
diff --git a/assets/css/style.less b/assets/css/style.less
index ac3e47d..49368cf 100644
--- a/assets/css/style.less
+++ b/assets/css/style.less
@@ -646,6 +646,7 @@ page {
}
.product-window .productWinList .item .listn .itemn {
+ position: relative;
border: 1px solid #bbb;
font-size: 0.26*100rpx;
color: #282828;
@@ -659,6 +660,23 @@ page {
background-color: #eb3729;
border-color: #eb3729;
}
+.product-window .productWinList .item .listn .itemn.disabled {
+ color: #333;
+ background-color: #F1F1F1;
+ border-color: #F1F1F1;
+}
+.product-window .productWinList .item .listn .itemn.disabled .tag {
+ position: absolute;
+ top: -18upx;
+ right: -18upx;
+ height: 28upx;
+ padding: 0 6upx;
+ border-radius: 6upx;
+ color: #fff;
+ line-height: 28upx;
+ font-size: 10px;
+ background-color: #FD5749;
+}
.product-window .cart {
margin-top: 0.36*100rpx;
diff --git a/components/ProductWindow.vue b/components/ProductWindow.vue
index a0b1065..4d7f731 100644
--- a/components/ProductWindow.vue
+++ b/components/ProductWindow.vue
@@ -20,12 +20,21 @@
{{ item.attrName }}
{{ itemn.attr }}
+ :class="{
+ 'on': item.index == indexn,
+ 'disabled': productValue[itemn.attr].stock === 0
+ }"
+ class="itemn"
+ @click="tapAttr(indexw, indexn, itemn)"
+ >
+ {{ itemn.attr }}
+ 缺货
+
@@ -57,6 +66,10 @@ export default {
type: Object,
default: () => {}
},
+ productValue: {
+ type: Object,
+ default: () => {}
+ },
cartNum: {
type: Number,
default: () => 1
@@ -80,7 +93,10 @@ export default {
CartNumAdd: function() {
this.$emit("changeFun", { action: "ChangeCartNum", value: 1 });
},
- tapAttr: function(indexw, indexn) {
+ tapAttr: function(indexw, indexn, itemn) {
+ if (this.productValue[itemn.attr].stock === 0) {
+ return
+ }
// 修改商品规格不生效的原因:
// H5端下面写法,attr更新,但是除H5外其他端不支持,
// 尽量避免下面的骚写法,不要在子组件内更新props
diff --git a/pages/shop/GoodsCon/index.vue b/pages/shop/GoodsCon/index.vue
index 635ee0a..ea02c39 100644
--- a/pages/shop/GoodsCon/index.vue
+++ b/pages/shop/GoodsCon/index.vue
@@ -292,8 +292,11 @@
{{ systemStore.name }}
- 进店逛逛
-
+
+ 进店逛逛
@@ -437,17 +440,36 @@
-
- 加入购物车
+
+
+ 加入购物车
- 立即购买
+
+ 立即购买
-
+
@@ -1175,13 +1197,13 @@ export default {
},
// 点击加入购物车按钮
joinCart: function () {
- if (this.isOpen === true && this.attr.productSelect.stock === 0) return;
+ if (this.attr.productSelect.stock === 0) return;
//0=加入购物车
this.goCat(0);
},
//立即购买;
tapBuy: function () {
- if (this.isOpen === true && this.attr.productSelect.stock === 0) return;
+ if (this.attr.productSelect.stock === 0) return;
// 1=直接购买
this.goCat(1);
},
@@ -1580,8 +1602,8 @@ export default {
}
.btn-car-disabled {
- border: 2rpx solid #D0D0D0;
- color: #D0D0D0;
+ border: 2rpx solid #707070;
+ color: #707070;
}
.btn-buy {
@@ -1594,7 +1616,7 @@ export default {
}
.btn-buy-disabled {
- background: #D0D0D0;
+ background: #9D9D9D;
}
}