<template>
|
<view class="goods-items-container rowCen borderBox">
|
<view class="left-imagecontent defIcon">
|
<image :src="items.mainPic" mode="aspectFill"></image>
|
</view>
|
|
<view class="right-goodsinfo-container colCenBet borderBox">
|
<view class="goodsnameinfo-content rowCen">
|
<view class="typeIcon-content defIcon">
|
<image :src="items.labelImg" mode="heightFix"></image>
|
</view>
|
|
<view class="tradename">
|
{{items.dtitle}}
|
</view>
|
</view>
|
|
<view class="cardbottom-container colCenEnd">
|
<view class="discounts-container rowCen borderBox">
|
<view class="coupon-box rowCenCen" v-if="items.couponPrice>0 || items.sourceType=='wph'">
|
<view>
|
{{items.sourceType=='wph'?items.discount+'折':items.couponPrice+'元券'}}
|
</view>
|
</view>
|
<view class="back-box rowCenCen" v-if="items.fanli">
|
<view>
|
返{{items.fanli}}元
|
</view>
|
</view>
|
</view>
|
<view class="price-saleNums-container rowEnd">
|
<span class='greytxt'>券后</span>
|
<span class='rmb'>￥</span>
|
<span class='pricebox'>{{items.actualPrice}}</span>
|
</view>
|
<view class="saleNum-content" v-if="items.monthSales!=''">
|
已售{{items.monthSales}}
|
</view>
|
|
<view class="shopEnter-bar rowCen">
|
<!-- <view class="storename">
|
{{items.shopName}}
|
</view> -->
|
<!-- <view class="enterbtn rowCen">
|
<view class="enterStore">进店</view>
|
<view class="defIcon arrow">
|
<image src="../../static/images/goods/entershop.png" mode=""></image>
|
</view>
|
</view> -->
|
</view>
|
</view>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
export default {
|
props: {
|
items: Object
|
},
|
data() {
|
return {
|
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss">
|
.goods-items-container {
|
width: 100%;
|
height: 240rpx;
|
padding: 0 20rpx;
|
border-top: 1rpx solid #f5f5f5;
|
|
.left-imagecontent {
|
width: 200rpx;
|
height: 200rpx;
|
border-radius: 8rpx;
|
overflow: hidden;
|
}
|
|
.right-goodsinfo-container {
|
margin-left: 20rpx;
|
width: 480rpx;
|
height: 200rpx;
|
|
.goodsnameinfo-content {
|
width: 100%;
|
|
.typeIcon-content {
|
width: 60rpx;
|
height: 24rpx;
|
margin-right: 5rpx;
|
}
|
|
.tradename {
|
flex: 1;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
white-space: nowrap;
|
font-size: 28rpx;
|
font-weight: 500;
|
color: #333333;
|
}
|
}
|
|
.cardbottom-container {
|
width: 100%;
|
|
.price-saleNums-container {
|
width: 100%;
|
.greytxt {
|
font-size: 24rpx;
|
font-weight: 500;
|
color: #999999;
|
line-height: 34rpx;
|
}
|
|
.rmb {
|
font-size: 24rpx;
|
font-weight: 500;
|
color: #FF4242;
|
line-height: 34rpx;
|
}
|
|
.pricebox {
|
font-size: 28rpx;
|
line-height: 34rpx;
|
font-weight: bold;
|
color: #FF4242;
|
}
|
}
|
|
.discounts-container {
|
width: 100%;
|
margin-bottom: 10rpx;
|
.coupon-box {
|
height: 30rpx;
|
background: linear-gradient(255deg, #FF437E, #FF7755);
|
font-size: 24rpx;
|
font-weight: 500;
|
border-radius: 5rpx;
|
color: #FFFFFF;
|
padding: 0 10rpx;
|
margin-right: 10rpx;
|
}
|
|
.back-box {
|
padding: 0 10rpx;
|
height: 30rpx;
|
background: linear-gradient(255deg, #D674FB, #6344F9);
|
border-radius: 5rpx;
|
font-size: 24rpx;
|
font-weight: 500;
|
color: #FFFFFF;
|
}
|
}
|
|
.saleNum-content {
|
width: 100%;
|
font-size: 24rpx;
|
font-weight: 500;
|
color: #999999;
|
}
|
|
.shopEnter-bar {
|
width: 100%;
|
line-height: 34rpx;
|
|
.storename {
|
font-size: 24rpx;
|
font-weight: 500;
|
color: #999999;
|
}
|
|
.enterbtn {
|
.enterStore {
|
font-size: 20rpx;
|
font-weight: 400;
|
color: #333333;
|
margin: 0 5rpx;
|
}
|
|
.arrow {
|
width: 6rpx;
|
height: 12rpx;
|
margin-top: 4rpx;
|
}
|
}
|
}
|
}
|
}
|
}
|
</style>
|
