...
|
...
|
@@ -2,6 +2,7 @@ |
|
|
<div class="product-item">
|
|
|
<div class="item-content" :style="itemStyle" @touchstart="onTouchStart" @touchmove="onTouchMove" @touchend="onTouchEnd">
|
|
|
<div class="tip" v-if="showTip">超出建议售价将被限制展示,建议下调至合理价格区间</div>
|
|
|
<i class="pre-sale" v-if="isPreSale"></i>
|
|
|
<div class="info">
|
|
|
<div class="left">
|
|
|
<span class="size ufo-font">{{value.goodsInfo.sizeName}}</span>
|
...
|
...
|
@@ -45,6 +46,9 @@ export default { |
|
|
showTip() {
|
|
|
return this.value.goodsInfo.price > this.value.goodsInfo.suggestMaxPrice;
|
|
|
},
|
|
|
isPreSale() {
|
|
|
return this.value.isAdvance === 'Y';
|
|
|
},
|
|
|
itemStyle() {
|
|
|
return {
|
|
|
transition: this.transition ? void 0 : 'none 0s ease 0s',
|
...
|
...
|
@@ -67,10 +71,14 @@ export default { |
|
|
},
|
|
|
methods: {
|
|
|
onNoSale() {
|
|
|
this.$emit('on-no-sale', this.value.goodsInfo);
|
|
|
this.$emit('on-no-sale', Object.assign({
|
|
|
isAdvance: this.value.isAdvance
|
|
|
}, this.value.goodsInfo));
|
|
|
},
|
|
|
onChgPrice() {
|
|
|
this.$emit('on-change-price', this.value.goodsInfo);
|
|
|
this.$emit('on-change-price', Object.assign({
|
|
|
isAdvance: this.value.isAdvance
|
|
|
}, this.value.goodsInfo));
|
|
|
},
|
|
|
onTouchStart(evt) {
|
|
|
const {clientX, clientY} = evt.touches[0];
|
...
|
...
|
@@ -145,6 +153,16 @@ export default { |
|
|
transition: transform 0.5s cubic-bezier(0.36, 0.66, 0.04, 1);
|
|
|
}
|
|
|
|
|
|
.pre-sale {
|
|
|
position: absolute;
|
|
|
top: 16px;
|
|
|
left: 10px;
|
|
|
width: 52px;
|
|
|
height: 24px;
|
|
|
background-image: url(~statics/image/order/pre-sale@3x.png);
|
|
|
background-size: cover;
|
|
|
}
|
|
|
|
|
|
.item-options {
|
|
|
position: absolute;
|
|
|
top: 0;
|
...
|
...
|
@@ -180,6 +198,7 @@ export default { |
|
|
width: 160px;
|
|
|
display: flex;
|
|
|
height: 56px;
|
|
|
margin-top: 10px;
|
|
|
align-items: flex-end;
|
|
|
|
|
|
.size {
|
...
|
...
|
|