181 lines
3.9 KiB
Vue
181 lines
3.9 KiB
Vue
<template>
|
|
<view class="content">
|
|
<view class="contentone flex-center">
|
|
<image class="contentoneimage" src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/ewm.png" mode="aspectFill"></image>
|
|
<text class="contentonetext">精选推荐</text>
|
|
</view>
|
|
<view class="contenttow flex-between">
|
|
<view class="contenttowitem" v-for="(item,index) in list" :key="index" @click="clickproduct(item)">
|
|
<image class="contenttowitemimage" :src="item.image" mode="aspectFill"></image>
|
|
<view class="contenttowitemtiter">
|
|
{{item.shopName}}|{{item.productName}}
|
|
</view>
|
|
<view class="contenttowitemone flex-between">
|
|
<view class="contenttowitemone_dingwei flex-start">
|
|
<image class="contenttowitemone_dingweiimage"
|
|
:src="item.image" mode="aspectFill"></image>
|
|
<view class="contenttowitemone_dingweinumer">
|
|
{{item.distances}}
|
|
</view>
|
|
</view>
|
|
<view class="contenttowitemone_text">
|
|
已售{{item.realSalesNumber}}
|
|
</view>
|
|
</view>
|
|
<view class="contenttowitemtow flex-start">
|
|
<view class="contenttowitemtow_one">
|
|
券后¥{{item.salePrice}}
|
|
</view>
|
|
<view class="contenttowitemtow_tow">
|
|
{{item.discount}}折
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {};
|
|
},
|
|
props: {
|
|
list: {
|
|
type: Array,
|
|
default () {
|
|
return []
|
|
}
|
|
},
|
|
opacity: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
titleshow: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
},
|
|
computed: {
|
|
HeighT() { //手机类型的尺寸
|
|
return this.$store.getters.is_BarHeight
|
|
},
|
|
},
|
|
methods: {
|
|
clickproduct(item) {
|
|
uni.pro.navigateTo('product/index', {
|
|
id:item.id
|
|
})
|
|
},
|
|
clicknavigateBack() {
|
|
uni.navigateBack()
|
|
}
|
|
}
|
|
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
page {
|
|
background: #F9F9F9;
|
|
}
|
|
|
|
.content {
|
|
padding: 0 32rpx;
|
|
|
|
.contentone {
|
|
.contentoneimage {
|
|
width: 32.12rpx;
|
|
height: 36.13rpx;
|
|
}
|
|
|
|
.contentonetext {
|
|
margin-left: 12rpx;
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 32rpx;
|
|
color: #000000;
|
|
}
|
|
}
|
|
|
|
.contenttow {
|
|
width: 100%;
|
|
|
|
.contenttowitem {
|
|
margin-top: 32rpx;
|
|
width: 316rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
|
|
|
.contenttowitemimage {
|
|
width: 100%;
|
|
height: 220rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 20rpx 20rpx 0rpx 0rpx;
|
|
}
|
|
|
|
.contenttowitemtiter {
|
|
padding: 0 20rpx;
|
|
margin-top: 8rpx;
|
|
width: 100%;
|
|
height: 72rpx;
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
color: #000000;
|
|
}
|
|
|
|
.contenttowitemone {
|
|
padding: 0 20rpx;
|
|
.contenttowitemone_dingwei {
|
|
margin-top: 6rpx;
|
|
.contenttowitemone_dingweiimage {
|
|
width: 17.9rpx;
|
|
height: 21.65rpx;
|
|
}
|
|
|
|
.contenttowitemone_dingweinumer {
|
|
margin-left: 12rpx;
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 20rpx;
|
|
color: #666666;
|
|
}
|
|
}
|
|
|
|
.contenttowitemone_text {
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 20rpx;
|
|
color: #666666;
|
|
}
|
|
}
|
|
|
|
.contenttowitemtow {
|
|
padding: 0 20rpx 8rpx 20rpx;
|
|
|
|
.contenttowitemtow_one {
|
|
margin-top: 6rpx;
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: bold;
|
|
font-size: 28rpx;
|
|
color: #FF4C11;
|
|
}
|
|
|
|
.contenttowitemtow_tow {
|
|
margin-top: 6rpx;
|
|
margin-left: 6rpx;
|
|
padding: 2rpx 14rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
|
border: 2rpx solid #FF4C11;
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 20rpx;
|
|
color: #FF4C11;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style> |