Feat(规格):UI调整(已完成)
This commit is contained in:
@@ -6,12 +6,15 @@
|
|||||||
<image :src="attr.productSelect.image" class="image" />
|
<image :src="attr.productSelect.image" class="image" />
|
||||||
</view>
|
</view>
|
||||||
<view class="text">
|
<view class="text">
|
||||||
<view class="line1">{{ attr.productSelect.store_name }}</view>
|
<view class="money font-color-lightred v12-font-">
|
||||||
<view class="money font-color-lightred">
|
|
||||||
¥
|
¥
|
||||||
<text class="num">{{ attr.productSelect.price }}</text>
|
<text class="num v12-font-40">{{ attr.productSelect.price }}</text>
|
||||||
<text class="stock">库存: {{ attr.productSelect.stock }}</text>
|
<text class="v12-ml-2 v12-font-weight-300 v12-font-22" style="color: #BBBBBB; text-decoration: line-through;">¥</text>
|
||||||
|
<text class="v12-mr-2 v12-font-weight-300 v12-font-22" style="color: #BBBBBB; text-decoration: line-through;">{{ attr.productSelect.otPrice }}</text>
|
||||||
|
<text class="v12-white-text v12-red v12-font-22 v12-radius-40 v12-px-1 v12-font-weight-400">会员价</text>
|
||||||
|
<!-- <text class="stock">库存: {{ attr.productSelect.stock }}</text> -->
|
||||||
</view>
|
</view>
|
||||||
|
<view class="more-t">{{ attr.productSelect.store_name }}</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="iconfont icon-guanbi" @click="closeAttr"></view>
|
<view class="iconfont icon-guanbi" @click="closeAttr"></view>
|
||||||
</view>
|
</view>
|
||||||
@@ -23,28 +26,29 @@
|
|||||||
v-for="(itemn, indexn) in item.attrValue"
|
v-for="(itemn, indexn) in item.attrValue"
|
||||||
:key="indexn"
|
:key="indexn"
|
||||||
:class="{
|
:class="{
|
||||||
'on': item.index == indexn,
|
'actived': item.index == indexn,
|
||||||
'disabled': getAttrItemData(itemn.attr).stock === 0
|
'disabled': getAttrItemData(itemn.attr).stock === 0
|
||||||
}"
|
}"
|
||||||
class="itemn"
|
class="itemn v12-radius-40"
|
||||||
@click="tapAttr(indexw, indexn, itemn)"
|
@click="tapAttr(indexw, indexn, itemn)"
|
||||||
>
|
>
|
||||||
{{ itemn.attr }}
|
{{ itemn.attr }}
|
||||||
<text
|
<text v-if="getAttrItemData(itemn.attr).stock === 0" class="less-tag">缺货</text>
|
||||||
v-if="getAttrItemData(itemn.attr).stock === 0"
|
|
||||||
class="tag"
|
|
||||||
>缺货</text>
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="cart">
|
<view class="cart v12-justify-between v12-align-center">
|
||||||
<view class="title">数量</view>
|
<view class="titlev12-dark-text f12-font-32">购买数量</view>
|
||||||
<view class="carnum acea-row row-left">
|
<view class="carnum acea-row row-left">
|
||||||
<view class="item reduce" :class="cartNum <= 1 ? 'on' : ''" @click="CartNumDes">-</view>
|
<view style="border-radius: 40rpx 0rpx 0rpx 40rpx" class="cart-btn item reduce v12-font-36 v12-font-bold v12-white-text v12-dark1 v12-dark1-border" :class="cartNum <= 1 ? 'on' : ''" @click="CartNumDes">-</view>
|
||||||
<view class="item num">{{ cartNum }}</view>
|
<view class="item v12-font-36 v12-font-bold v12-dark-text
|
||||||
|
|
||||||
|
|
||||||
|
cart-btn">{{ cartNum }}</view>
|
||||||
<view
|
<view
|
||||||
class="item plus"
|
style="border-radius:0 40rpx 40rpx 0"
|
||||||
|
class="item plus v12-font-bold v12-white-text v12-primary v12-primary-border v12-font-36 cart-btn"
|
||||||
:class="
|
:class="
|
||||||
cartNum >= attr.productSelect.stock
|
cartNum >= attr.productSelect.stock
|
||||||
? 'on'
|
? 'on'
|
||||||
@@ -141,3 +145,29 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
<style scope>
|
||||||
|
.money{
|
||||||
|
margin-top: 0 !important
|
||||||
|
}
|
||||||
|
.actived{
|
||||||
|
border-color: #C52733 !important;
|
||||||
|
color: #fff !important;
|
||||||
|
background: #C52733
|
||||||
|
}
|
||||||
|
.cart-btn{
|
||||||
|
height:52rpx !important;
|
||||||
|
width:52rpx !important
|
||||||
|
}
|
||||||
|
.less-tag{
|
||||||
|
position: absolute;
|
||||||
|
background: #FF5562;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
height: 38rpx;
|
||||||
|
line-height: 38rpx;
|
||||||
|
right: -18px;
|
||||||
|
top: -12px;
|
||||||
|
padding: 0 3px;
|
||||||
|
font-size: 24rpx;
|
||||||
|
font-weight:400
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
Reference in New Issue
Block a user