|
|
@@ -1,26 +1,33 @@
|
|
|
<template>
|
|
|
- <view class="index-product-wrapper" :class="iSshowH?'on':''" :style="'margin-top:'+mbConfig*2+'rpx;'" v-show="!isSortType">
|
|
|
+ <view class="index-product-wrapper" :class="iSshowH ? 'on' : ''" :style="'margin-top:'+mbConfig*2+'rpx;'"
|
|
|
+ v-show="!isSortType">
|
|
|
<view v-if="iSshowH">
|
|
|
- <u-tabs :list="navigationList2" @click="" lineColor="#EB4C63" :inactiveStyle="{color: '#333'}"
|
|
|
- :activeStyle="{color: '#EB4C63',fontWeight: 'bold'}"></u-tabs>
|
|
|
+ <u-tabs :list="navigationList2" @click="" lineColor="#EB4C63" :inactiveStyle="{ color: '#333' }"
|
|
|
+ :activeStyle="{ color: '#EB4C63', fontWeight: 'bold' }"></u-tabs>
|
|
|
</view>
|
|
|
<!-- 首发新品 -->
|
|
|
- <view class="list-box animated" :class='tempArr.length > 0?"fadeIn on":""'>
|
|
|
- <view class="item" v-for="(item,index) in tempArr" :key="index" @click="goDetail(item)">
|
|
|
+ <view class="list-box animated" :class='tempArr.length > 0 ? "fadeIn on" : ""'>
|
|
|
+ <view class="item" v-for="(item, index) in tempArr" :key="index" @click="goDetail(item)">
|
|
|
<view class="pictrue">
|
|
|
- <span class="pictrue_log pictrue_log_class" :style="'background-color:'+labelColor" v-if="item.activity && item.activity.type === '1'">{{$t(`秒杀`)}}</span>
|
|
|
- <span class="pictrue_log pictrue_log_class" :style="'background-color:'+labelColor" v-if="item.activity && item.activity.type === '2'">{{$t(`砍价`)}}</span>
|
|
|
- <span class="pictrue_log pictrue_log_class" :style="'background-color:'+labelColor" v-if="item.activity && item.activity.type === '3'">{{$t(`拼团`)}}</span>
|
|
|
+ <span class="pictrue_log pictrue_log_class" :style="'background-color:' + labelColor"
|
|
|
+ v-if="item.activity && item.activity.type === '1'">{{ $t(`秒杀`) }}</span>
|
|
|
+ <span class="pictrue_log pictrue_log_class" :style="'background-color:' + labelColor"
|
|
|
+ v-if="item.activity && item.activity.type === '2'">{{ $t(`砍价`) }}</span>
|
|
|
+ <span class="pictrue_log pictrue_log_class" :style="'background-color:' + labelColor"
|
|
|
+ v-if="item.activity && item.activity.type === '3'">{{ $t(`拼团`) }}</span>
|
|
|
<image :src="item.image" mode="aspectFit"></image>
|
|
|
</view>
|
|
|
<view class="text-info">
|
|
|
- <view class="title line1" v-if="titleShow">{{item.store_name}}</view>
|
|
|
- <view class="old-price" v-if="opriceShow"><text>{{$t(`￥`)}}</text>{{item.ot_price}}</view>
|
|
|
- <view class="price" :style="{color:fontColor}">
|
|
|
+ <view class="title" v-if="titleShow">
|
|
|
+ <u-text prefixIcon="bookmark" iconStyle="font-size: 16px; color:red" :lines="2" bold block size="20" :text="item.store_name"></u-text>
|
|
|
+ </view>
|
|
|
+ <view class="tags" v-if="opriceShow">赠送{{ item.ot_price }}红积分</view>
|
|
|
+ <view class="price" :style="{ color: fontColor }">
|
|
|
<view v-if="priceShow">
|
|
|
- <text>{{$t(`￥`)}}</text>{{item.price}}
|
|
|
+ <text>{{ $t(`￥`) }}</text>{{ item.price }}
|
|
|
</view>
|
|
|
- <view class="txt" :style="'border:1px solid '+labelColor+';color:'+labelColor" :class="priceShow?'':'on'" v-if="item.checkCoupon && couponShow">{{$t(`券`)}}</view>
|
|
|
+ <view class="txt" :style="'border:1px solid ' + labelColor + ';color:' + labelColor"
|
|
|
+ :class="priceShow ? '' : 'on'" v-if="item.checkCoupon && couponShow">{{ $t(`券`) }}</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
@@ -29,29 +36,29 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- export default {
|
|
|
- name: 'promotionList',
|
|
|
- props: {
|
|
|
- dataConfig: {
|
|
|
- type: Object,
|
|
|
- default: () => {}
|
|
|
- },
|
|
|
- tempArr: {
|
|
|
- type: Array,
|
|
|
- default: []
|
|
|
- },
|
|
|
- iSshowH: {
|
|
|
- type: Boolean,
|
|
|
- default: false
|
|
|
- },
|
|
|
- isSortType:{
|
|
|
- type: String | Number,
|
|
|
- default:0
|
|
|
- }
|
|
|
+export default {
|
|
|
+ name: 'promotionList',
|
|
|
+ props: {
|
|
|
+ dataConfig: {
|
|
|
+ type: Object,
|
|
|
+ default: () => { }
|
|
|
+ },
|
|
|
+ tempArr: {
|
|
|
+ type: Array,
|
|
|
+ default: []
|
|
|
+ },
|
|
|
+ iSshowH: {
|
|
|
+ type: Boolean,
|
|
|
+ default: false
|
|
|
},
|
|
|
- data() {
|
|
|
- return {
|
|
|
- navigationList2: [{
|
|
|
+ isSortType: {
|
|
|
+ type: String | Number,
|
|
|
+ default: 0
|
|
|
+ }
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ navigationList2: [{
|
|
|
name: 'Tab1',
|
|
|
}, {
|
|
|
name: 'Tab2'
|
|
|
@@ -68,328 +75,338 @@
|
|
|
}, {
|
|
|
name: 'Tab7'
|
|
|
}],
|
|
|
- ProductNavindex: 0,
|
|
|
- explosiveMoney: [
|
|
|
- {
|
|
|
- "chiild": [
|
|
|
- {
|
|
|
- "title": "标题",
|
|
|
- "val": "首发新品",
|
|
|
- "max": 4,
|
|
|
- "pla": "选填，不超过四个字"
|
|
|
- },
|
|
|
- {
|
|
|
- "title": "简介",
|
|
|
- "val": "最新出炉",
|
|
|
- "max": 4,
|
|
|
- "pla": "选填，不超过四个字"
|
|
|
- }
|
|
|
- ],
|
|
|
- "link": {
|
|
|
- "title": "链接",
|
|
|
- "activeVal": 3,
|
|
|
- "optiops": [
|
|
|
- {
|
|
|
- "type": 0,
|
|
|
- "value": 1,
|
|
|
- "label": "精品推荐"
|
|
|
- },
|
|
|
- {
|
|
|
- "type": 1,
|
|
|
- "value": 2,
|
|
|
- "label": "热门榜单"
|
|
|
- },
|
|
|
- {
|
|
|
- "type": 2,
|
|
|
- "value": 3,
|
|
|
- "label": "首发新品"
|
|
|
- },
|
|
|
- {
|
|
|
- "type": 3,
|
|
|
- "value": 4,
|
|
|
- "label": "促销单品"
|
|
|
- }
|
|
|
- ]
|
|
|
- }
|
|
|
- },
|
|
|
- {
|
|
|
- "chiild": [
|
|
|
- {
|
|
|
- "title": "标题",
|
|
|
- "val": "精品推荐",
|
|
|
- "max": 4,
|
|
|
- "pla": "选填，不超过四个字"
|
|
|
- },
|
|
|
- {
|
|
|
- "title": "简介",
|
|
|
- "val": "猜你喜欢",
|
|
|
- "max": 4,
|
|
|
- "pla": "选填，不超过四个字"
|
|
|
- }
|
|
|
- ],
|
|
|
- "link": {
|
|
|
- "title": "链接",
|
|
|
- "activeVal": 1,
|
|
|
- "optiops": [
|
|
|
- {
|
|
|
- "type": 0,
|
|
|
- "value": 1,
|
|
|
- "label": "精品推荐"
|
|
|
- },
|
|
|
- {
|
|
|
- "type": 1,
|
|
|
- "value": 2,
|
|
|
- "label": "热门榜单"
|
|
|
- },
|
|
|
- {
|
|
|
- "type": 2,
|
|
|
- "value": 3,
|
|
|
- "label": "首发新品"
|
|
|
- },
|
|
|
- {
|
|
|
- "type": 3,
|
|
|
- "value": 4,
|
|
|
- "label": "促销单品"
|
|
|
- }
|
|
|
- ]
|
|
|
- }
|
|
|
- },
|
|
|
- {
|
|
|
- "chiild": [
|
|
|
- {
|
|
|
- "title": "标题",
|
|
|
- "val": "热门榜单",
|
|
|
- "max": 4,
|
|
|
- "pla": "选填，不超过四个字"
|
|
|
- },
|
|
|
- {
|
|
|
- "title": "简介",
|
|
|
- "val": "好评如云",
|
|
|
- "max": 4,
|
|
|
- "pla": "选填，不超过四个字"
|
|
|
- }
|
|
|
- ],
|
|
|
- "link": {
|
|
|
- "title": "链接",
|
|
|
- "activeVal": 2,
|
|
|
- "optiops": [
|
|
|
- {
|
|
|
- "type": 0,
|
|
|
- "value": 1,
|
|
|
- "label": "精品推荐"
|
|
|
- },
|
|
|
- {
|
|
|
- "type": 1,
|
|
|
- "value": 2,
|
|
|
- "label": "热门榜单"
|
|
|
- },
|
|
|
- {
|
|
|
- "type": 2,
|
|
|
- "value": 3,
|
|
|
- "label": "首发新品"
|
|
|
- },
|
|
|
- {
|
|
|
- "type": 3,
|
|
|
- "value": 4,
|
|
|
- "label": "促销单品"
|
|
|
- }
|
|
|
- ]
|
|
|
- }
|
|
|
- },
|
|
|
- {
|
|
|
- "chiild": [
|
|
|
- {
|
|
|
- "title": "标题",
|
|
|
- "val": "促销单品",
|
|
|
- "max": 4,
|
|
|
- "pla": "选填，不超过四个字"
|
|
|
- },
|
|
|
- {
|
|
|
- "title": "简介",
|
|
|
- "val": "多买多销",
|
|
|
- "max": 4,
|
|
|
- "pla": "选填，不超过四个字"
|
|
|
- }
|
|
|
- ],
|
|
|
- "link": {
|
|
|
- "title": "链接",
|
|
|
- "activeVal": 4,
|
|
|
- "optiops": [
|
|
|
- {
|
|
|
- "type": 0,
|
|
|
- "value": 1,
|
|
|
- "label": "精品推荐"
|
|
|
- },
|
|
|
- {
|
|
|
- "type": 1,
|
|
|
- "value": 2,
|
|
|
- "label": "热门榜单"
|
|
|
- },
|
|
|
- {
|
|
|
- "type": 2,
|
|
|
- "value": 3,
|
|
|
- "label": "首发新品"
|
|
|
- },
|
|
|
- {
|
|
|
- "type": 3,
|
|
|
- "value": 4,
|
|
|
- "label": "促销单品"
|
|
|
- }
|
|
|
- ]
|
|
|
- }
|
|
|
- }
|
|
|
- ],
|
|
|
- numConfig: 9,
|
|
|
- // imgStyle: this.dataConfig.imgStyle.type,
|
|
|
- mbConfig: 0,
|
|
|
- themeColor: "rgba(29,176,252,1)",
|
|
|
- titleShow: true, //标题是否显示
|
|
|
- opriceShow: true, //原价是否显示
|
|
|
- priceShow: true, //价格是否显示
|
|
|
- couponShow: true,//优惠券标签是否显示
|
|
|
- titleConfig: 2, //标题位置
|
|
|
- fontColor: "rgba(253,80,47,1)",
|
|
|
- labelColor: "rgba(29,176,252,1)"
|
|
|
- };
|
|
|
- },
|
|
|
- created() {
|
|
|
+ ProductNavindex: 0,
|
|
|
+ explosiveMoney: [
|
|
|
+ {
|
|
|
+ "chiild": [
|
|
|
+ {
|
|
|
+ "title": "标题",
|
|
|
+ "val": "首发新品",
|
|
|
+ "max": 4,
|
|
|
+ "pla": "选填，不超过四个字"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "title": "简介",
|
|
|
+ "val": "最新出炉",
|
|
|
+ "max": 4,
|
|
|
+ "pla": "选填，不超过四个字"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ "link": {
|
|
|
+ "title": "链接",
|
|
|
+ "activeVal": 3,
|
|
|
+ "optiops": [
|
|
|
+ {
|
|
|
+ "type": 0,
|
|
|
+ "value": 1,
|
|
|
+ "label": "精品推荐"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "type": 1,
|
|
|
+ "value": 2,
|
|
|
+ "label": "热门榜单"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "type": 2,
|
|
|
+ "value": 3,
|
|
|
+ "label": "首发新品"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "type": 3,
|
|
|
+ "value": 4,
|
|
|
+ "label": "促销单品"
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "chiild": [
|
|
|
+ {
|
|
|
+ "title": "标题",
|
|
|
+ "val": "精品推荐",
|
|
|
+ "max": 4,
|
|
|
+ "pla": "选填，不超过四个字"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "title": "简介",
|
|
|
+ "val": "猜你喜欢",
|
|
|
+ "max": 4,
|
|
|
+ "pla": "选填，不超过四个字"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ "link": {
|
|
|
+ "title": "链接",
|
|
|
+ "activeVal": 1,
|
|
|
+ "optiops": [
|
|
|
+ {
|
|
|
+ "type": 0,
|
|
|
+ "value": 1,
|
|
|
+ "label": "精品推荐"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "type": 1,
|
|
|
+ "value": 2,
|
|
|
+ "label": "热门榜单"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "type": 2,
|
|
|
+ "value": 3,
|
|
|
+ "label": "首发新品"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "type": 3,
|
|
|
+ "value": 4,
|
|
|
+ "label": "促销单品"
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "chiild": [
|
|
|
+ {
|
|
|
+ "title": "标题",
|
|
|
+ "val": "热门榜单",
|
|
|
+ "max": 4,
|
|
|
+ "pla": "选填，不超过四个字"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "title": "简介",
|
|
|
+ "val": "好评如云",
|
|
|
+ "max": 4,
|
|
|
+ "pla": "选填，不超过四个字"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ "link": {
|
|
|
+ "title": "链接",
|
|
|
+ "activeVal": 2,
|
|
|
+ "optiops": [
|
|
|
+ {
|
|
|
+ "type": 0,
|
|
|
+ "value": 1,
|
|
|
+ "label": "精品推荐"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "type": 1,
|
|
|
+ "value": 2,
|
|
|
+ "label": "热门榜单"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "type": 2,
|
|
|
+ "value": 3,
|
|
|
+ "label": "首发新品"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "type": 3,
|
|
|
+ "value": 4,
|
|
|
+ "label": "促销单品"
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "chiild": [
|
|
|
+ {
|
|
|
+ "title": "标题",
|
|
|
+ "val": "促销单品",
|
|
|
+ "max": 4,
|
|
|
+ "pla": "选填，不超过四个字"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "title": "简介",
|
|
|
+ "val": "多买多销",
|
|
|
+ "max": 4,
|
|
|
+ "pla": "选填，不超过四个字"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ "link": {
|
|
|
+ "title": "链接",
|
|
|
+ "activeVal": 4,
|
|
|
+ "optiops": [
|
|
|
+ {
|
|
|
+ "type": 0,
|
|
|
+ "value": 1,
|
|
|
+ "label": "精品推荐"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "type": 1,
|
|
|
+ "value": 2,
|
|
|
+ "label": "热门榜单"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "type": 2,
|
|
|
+ "value": 3,
|
|
|
+ "label": "首发新品"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "type": 3,
|
|
|
+ "value": 4,
|
|
|
+ "label": "促销单品"
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ numConfig: 9,
|
|
|
+ // imgStyle: this.dataConfig.imgStyle.type,
|
|
|
+ mbConfig: 0,
|
|
|
+ themeColor: "rgba(29,176,252,1)",
|
|
|
+ titleShow: true, //标题是否显示
|
|
|
+ opriceShow: true, //原价是否显示
|
|
|
+ priceShow: true, //价格是否显示
|
|
|
+ couponShow: true,//优惠券标签是否显示
|
|
|
+ titleConfig: 2, //标题位置
|
|
|
+ fontColor: "rgba(253,80,47,1)",
|
|
|
+ labelColor: "rgba(29,176,252,1)"
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 首发新品切换
|
|
|
+ ProductNavTab(type, index) {
|
|
|
+ this.ProductNavindex = index;
|
|
|
+ this.$emit('changeTab', type);
|
|
|
},
|
|
|
- methods: {
|
|
|
- // 首发新品切换
|
|
|
- ProductNavTab(type, index) {
|
|
|
- this.ProductNavindex = index;
|
|
|
- this.$emit('changeTab', type);
|
|
|
- },
|
|
|
- goDetail(item){
|
|
|
- this.$emit('detail',item);
|
|
|
- }
|
|
|
+ goDetail(item) {
|
|
|
+ this.$emit('detail', item);
|
|
|
}
|
|
|
}
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
|
|
- .index-product-wrapper {
|
|
|
- margin: 30rpx 20rpx 0 20rpx;
|
|
|
+.index-product-wrapper {
|
|
|
+ margin: 30rpx 20rpx 0 20rpx;
|
|
|
|
|
|
- &.on {
|
|
|
- min-height: 1500rpx;
|
|
|
- }
|
|
|
+ &.on {
|
|
|
+ min-height: 1500rpx;
|
|
|
+ }
|
|
|
|
|
|
- .nav-bd {
|
|
|
+ .nav-bd {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ margin-top: 30rpx;
|
|
|
+
|
|
|
+ .item {
|
|
|
display: flex;
|
|
|
+ flex-direction: column;
|
|
|
align-items: center;
|
|
|
- margin-top: 30rpx;
|
|
|
+ justify-content: center;
|
|
|
+ width: 25%;
|
|
|
+
|
|
|
+ &.on {
|
|
|
+ border-radius: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .txt {
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #282828;
|
|
|
+ }
|
|
|
|
|
|
- .item {
|
|
|
+ .label {
|
|
|
display: flex;
|
|
|
- flex-direction: column;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
- width: 25%;
|
|
|
-
|
|
|
- &.on{
|
|
|
- border-radius: 0;
|
|
|
- }
|
|
|
+ width: 124rpx;
|
|
|
+ height: 32rpx;
|
|
|
+ margin-top: 5rpx;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #999;
|
|
|
+ border-radius: 16rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .txt {
|
|
|
- font-size: 32rpx;
|
|
|
- color: #282828;
|
|
|
- }
|
|
|
+ .list-box {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin-top: 30rpx;
|
|
|
|
|
|
- .label {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- width: 124rpx;
|
|
|
- height: 32rpx;
|
|
|
- margin-top: 5rpx;
|
|
|
- font-size: 24rpx;
|
|
|
- color: #999;
|
|
|
- border-radius: 16rpx;
|
|
|
- }
|
|
|
+ .item {
|
|
|
+ width: 345rpx;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 20rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ .pictrue_log {
|
|
|
+ width: 92rpx;
|
|
|
+ height: 44rpx;
|
|
|
+ font-size: 26rpx;
|
|
|
+ line-height: 44rpx;
|
|
|
}
|
|
|
- }
|
|
|
|
|
|
- .list-box {
|
|
|
- display: flex;
|
|
|
- flex-wrap: wrap;
|
|
|
- justify-content: space-between;
|
|
|
- margin-top: 30rpx;
|
|
|
+ image {
|
|
|
+ width: 100%;
|
|
|
+ height: 346rpx;
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
|
|
|
- .item {
|
|
|
- width: 345rpx;
|
|
|
- margin-bottom: 20rpx;
|
|
|
- background-color: #fff;
|
|
|
- border-radius: 20rpx;
|
|
|
- overflow: hidden;
|
|
|
- position: relative;
|
|
|
+ .text-info {
|
|
|
+ padding: 10rpx 20rpx 15rpx;
|
|
|
|
|
|
- .pictrue_log {
|
|
|
- width: 92rpx;
|
|
|
- height: 44rpx;
|
|
|
- font-size: 26rpx;
|
|
|
- line-height: 44rpx;
|
|
|
+ .title {
|
|
|
+ color: #222222;
|
|
|
}
|
|
|
|
|
|
- image {
|
|
|
- width: 100%;
|
|
|
- height: 346rpx;
|
|
|
- display: block;
|
|
|
+ .tags {
|
|
|
+ display: inline-block;
|
|
|
+ font-size: 20rpx;
|
|
|
+ padding: 6rpx;
|
|
|
+ background-color: #FCE9EC;
|
|
|
+ color: #EB4C63;
|
|
|
+ margin: 6rpx 0;
|
|
|
}
|
|
|
|
|
|
- .text-info {
|
|
|
- padding: 10rpx 20rpx 15rpx;
|
|
|
+ .old-price {
|
|
|
+ margin-top: 4rpx;
|
|
|
+ font-size: 26rpx;
|
|
|
+ color: #f51414;
|
|
|
+ // text-decoration: line-through;
|
|
|
|
|
|
- .title {
|
|
|
- color: #222222;
|
|
|
+ text {
|
|
|
+ margin-right: 2px;
|
|
|
+ font-size: 20rpx;
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- .old-price {
|
|
|
- margin-top: 4rpx;
|
|
|
- font-size: 26rpx;
|
|
|
- color: #AAAAAA;
|
|
|
- text-decoration: line-through;
|
|
|
+ .price {
|
|
|
+ display: flex;
|
|
|
+ align-items: flex-end;
|
|
|
+ font-size: 36rpx;
|
|
|
+ font-weight: 550;
|
|
|
|
|
|
- text {
|
|
|
- margin-right: 2px;
|
|
|
- font-size: 20rpx;
|
|
|
- }
|
|
|
+ text {
|
|
|
+ padding-bottom: 4rpx;
|
|
|
+ font-size: 26rpx;
|
|
|
+ font-weight: normal;
|
|
|
}
|
|
|
|
|
|
- .price {
|
|
|
+ .txt {
|
|
|
display: flex;
|
|
|
- align-items: flex-end;
|
|
|
- font-size: 36rpx;
|
|
|
- font-weight: 550;
|
|
|
-
|
|
|
- text {
|
|
|
- padding-bottom: 4rpx;
|
|
|
- font-size: 26rpx;
|
|
|
- font-weight: normal;
|
|
|
- }
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ width: 28rpx;
|
|
|
+ height: 28rpx;
|
|
|
+ margin-left: 15rpx;
|
|
|
+ margin-bottom: 10rpx;
|
|
|
+ border-radius: 4rpx;
|
|
|
+ font-size: 20rpx;
|
|
|
+ font-weight: normal;
|
|
|
|
|
|
- .txt {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- width: 28rpx;
|
|
|
- height: 28rpx;
|
|
|
- margin-left: 15rpx;
|
|
|
- margin-bottom: 10rpx;
|
|
|
- border-radius: 4rpx;
|
|
|
- font-size: 20rpx;
|
|
|
- font-weight: normal;
|
|
|
- &.on{
|
|
|
- margin-left: 0;
|
|
|
- }
|
|
|
+ &.on {
|
|
|
+ margin-left: 0;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- &.on {
|
|
|
- display: flex;
|
|
|
- }
|
|
|
+ &.on {
|
|
|
+ display: flex;
|
|
|
}
|
|
|
}
|
|
|
+}
|
|
|
</style>
|
yuxingxing