...
|
...
|
@@ -7,7 +7,7 @@ |
|
|
<div class="product-info">
|
|
|
<p class="product-name">{{product.productName}}</p>
|
|
|
<div class="price">
|
|
|
¥{{product.salesPrice}}
|
|
|
<span>¥{{product.salesPrice}}</span>
|
|
|
<div class="btn-right btn-buy hover-opacity">
|
|
|
<span class="iconfont icon-cart"></span>购买
|
|
|
</div>
|
...
|
...
|
@@ -18,9 +18,7 @@ |
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import {createNamespacedHelpers} from 'vuex';
|
|
|
import YAS from 'utils/yas-constants';
|
|
|
const {mapActions} = createNamespacedHelpers('product');
|
|
|
|
|
|
export default {
|
|
|
name: 'ProductGroupItem',
|
...
|
...
|
@@ -58,57 +56,6 @@ export default { |
|
|
},
|
|
|
},
|
|
|
methods: {
|
|
|
...mapActions(['postProductFav']),
|
|
|
async onFav() {
|
|
|
if (this.share) {
|
|
|
return this.$links.toDownloadApp();
|
|
|
}
|
|
|
if (this.posting) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
this.posting = true;
|
|
|
const favorite = !this.favorite;
|
|
|
|
|
|
const result = await this.postProductFav({
|
|
|
productId: this.product.productId,
|
|
|
productSkn: this.product.productSkn,
|
|
|
favorite,
|
|
|
productType: this.product.productType
|
|
|
});
|
|
|
|
|
|
this.posting = false;
|
|
|
|
|
|
if (result.code === 200) {
|
|
|
if (favorite) {
|
|
|
this.prompt = this.$grassPrompt({
|
|
|
img: this.product.productImage,
|
|
|
title: '收藏成功',
|
|
|
desc: '可在 [我的-商品收藏] 页面查看',
|
|
|
onClick: () => {
|
|
|
this.$yoho.goPage('go.fav', {
|
|
|
favType: 0
|
|
|
});
|
|
|
}
|
|
|
}, 3000);
|
|
|
} else {
|
|
|
this.prompt && this.prompt.hide();
|
|
|
this.$createToast({
|
|
|
txt: '取消收藏成功',
|
|
|
type: 'success',
|
|
|
time: 1000
|
|
|
}).show();
|
|
|
}
|
|
|
|
|
|
this.favorite = favorite;
|
|
|
} else {
|
|
|
this.$createToast({
|
|
|
txt: result.message || '服务器开小差了',
|
|
|
type: 'warn',
|
|
|
time: 1000
|
|
|
}).show();
|
|
|
}
|
|
|
},
|
|
|
onClick(e) {
|
|
|
if (e.timeStamp - this._lastTime < 1200) {
|
|
|
return;
|
...
|
...
|
@@ -150,15 +97,13 @@ export default { |
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
.product-item {
|
|
|
margin-top: 20px;
|
|
|
margin-right: 20px;
|
|
|
margin-left: 30px;
|
|
|
height: 180px;
|
|
|
width: 580px;
|
|
|
background-color: #fff;
|
|
|
box-shadow: 0 5px 10px 0 rgba(107, 95, 95, 0.2);
|
|
|
border: 1px solid #f0f0f0;
|
|
|
display: inline-block;
|
|
|
padding: 10px 20px;
|
|
|
white-space: initial;
|
|
|
|
|
|
&:last-child {
|
...
|
...
|
@@ -172,14 +117,15 @@ export default { |
|
|
|
|
|
.product-content {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
|
|
|
.product-image {
|
|
|
width: 136px;
|
|
|
height: 180px;
|
|
|
margin-top: -30px;
|
|
|
}
|
|
|
|
|
|
.product-info {
|
...
|
...
|
@@ -189,25 +135,31 @@ export default { |
|
|
.product-name {
|
|
|
font-size: 24px;
|
|
|
color: #9b9b9b;
|
|
|
letter-spacing: -0.25PX;
|
|
|
height: 104px;
|
|
|
display: flex;
|
|
|
align-content: center;
|
|
|
height: 68px;
|
|
|
padding-right: 10px;
|
|
|
margin-bottom: 30px;
|
|
|
text-overflow: ellipsis;
|
|
|
display: -webkit-box;
|
|
|
-webkit-line-clamp: 2;
|
|
|
line-clamp: 2;
|
|
|
-webkit-box-orient: vertical;
|
|
|
overflow: hidden;
|
|
|
|
|
|
}
|
|
|
|
|
|
.price {
|
|
|
font-size: 32px;
|
|
|
color: #d0021b;
|
|
|
letter-spacing: -0.34PX;
|
|
|
font-size: 28px;
|
|
|
color: #222;
|
|
|
font-weight: 500;
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
align-items: center;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.btn-right {
|
|
|
float: right;
|
|
|
margin-right: -40px;
|
|
|
width: 120px;
|
|
|
height: 50px;
|
|
|
padding: 0;
|
|
|
font-size: 24px;
|
|
|
background-size: contain;
|
|
|
display: flex;
|
...
|
...
|
@@ -218,7 +170,7 @@ export default { |
|
|
}
|
|
|
|
|
|
.btn-buy {
|
|
|
background-color: #ce0a24;
|
|
|
background-color: #222;
|
|
|
|
|
|
.iconfont {
|
|
|
font-size: 30px;
|
...
|
...
|
|