194 lines
4.3 KiB
Vue
194 lines
4.3 KiB
Vue
<template>
|
|
<view class="">
|
|
<view class="theretowcontent flex-between">
|
|
<view class="theretowcontent_item flex-colum" v-for="(item,index) in list" :key="index"
|
|
@click="clickmemberinfos(item)">
|
|
<view :class="index == 0?'theretowcontent_item_one':'theretowcontent_item_ones'">
|
|
{{item.title}}
|
|
</view>
|
|
<view :class="index == 0?'theretowcontent_item_tow':'theretowcontent_item_tows'">
|
|
￥{{item.price}}/<text>{{item.frequ}}次</text>
|
|
</view>
|
|
<view :class="index == 0?'theretowcontent_item_there':'theretowcontent_item_theres'">
|
|
({{item.show}})
|
|
</view>
|
|
<view :class="index == 0?'theretowcontent_item_box':'theretowcontent_item_boxs'">
|
|
{{item.is_user_sec == '0'?'购买':'加购'}}
|
|
</view>
|
|
<image class="theretowcontent_item_image" :src="item.img" mode="aspectFill"></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {}
|
|
},
|
|
props: {
|
|
list: {
|
|
type: Array,
|
|
default () {
|
|
return []
|
|
}
|
|
},
|
|
data: {
|
|
type: Number,
|
|
default: 0
|
|
},
|
|
|
|
},
|
|
methods: {
|
|
clickmemberinfos(e) { //购买会员卡
|
|
if (e.is_user_sec == 0) {
|
|
uni.pro.navigateTo('my/member/memberinfos', {
|
|
id: e.id,
|
|
})
|
|
// async toworder() { //会员卡
|
|
// let res = await this.api.userreceivebalancecar({
|
|
// store_id: uni.cache.get('store_id') // 判断显示哪家的作品
|
|
// })
|
|
// uni.showToast({
|
|
// title: '领取成功',
|
|
// icon: 'none'
|
|
// });
|
|
// setTimeout(() => {
|
|
// uni.pro.navigateTo('my/member/index')
|
|
// }, 1500);
|
|
// },
|
|
} else {
|
|
uni.pro.navigateTo('my/member/memberinfo', {
|
|
id: e.id,
|
|
})
|
|
}
|
|
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.theretowcontent {
|
|
width: 100%;
|
|
padding: 24rpx 32rpx;
|
|
|
|
.theretowcontent_item {
|
|
padding: 16rpx;
|
|
width: 48%;
|
|
border-radius: 10rpx;
|
|
justify-content: flex-start;
|
|
align-items: flex-start;
|
|
position: relative;
|
|
z-index: 10;
|
|
|
|
.theretowcontent_item_one {
|
|
width: 55%;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
font-size: 32rpx;
|
|
font-family: PingFang SC-Bold, PingFang SC;
|
|
font-weight: bold;
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
.theretowcontent_item_ones {
|
|
width: 55%;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
font-size: 32rpx;
|
|
font-family: PingFang SC-Bold, PingFang SC;
|
|
font-weight: bold;
|
|
color: #422A07;
|
|
}
|
|
|
|
.theretowcontent_item_tow {
|
|
margin-top: 20rpx;
|
|
font-size: 28rpx;
|
|
font-family: Roboto-Regular, Roboto;
|
|
font-weight: 400;
|
|
color: #FFFFFF;
|
|
|
|
text {
|
|
font-size: 20rpx;
|
|
}
|
|
}
|
|
|
|
.theretowcontent_item_tows {
|
|
margin-top: 20rpx;
|
|
font-family: Roboto-Regular, Roboto;
|
|
font-weight: 400;
|
|
color: #422A07;
|
|
font-size: 28rpx;
|
|
|
|
text {
|
|
font-size: 20rpx;
|
|
}
|
|
}
|
|
|
|
.theretowcontent_item_there {
|
|
margin-top: 6rpx;
|
|
font-size: 20rpx;
|
|
width: 100%;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #D1CECE;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
.theretowcontent_item_theres {
|
|
margin-top: 6rpx;
|
|
font-size: 20rpx;
|
|
overflow: hidden;
|
|
width: 100%;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #422A07;
|
|
}
|
|
|
|
.theretowcontent_item_box {
|
|
position: absolute;
|
|
top: 20rpx;
|
|
right: 16rpx;
|
|
padding: 6rpx 26rpx;
|
|
font-size: 24rpx;
|
|
font-family: Roboto-Bold, Roboto;
|
|
font-weight: bold;
|
|
color: #FFFFFF;
|
|
background: linear-gradient(180deg, rgba(255, 255, 255, 0.73) 0%, rgba(128, 128, 128, 0.73) 100%);
|
|
box-shadow: 0px 6px 12rpx 2rpx rgba(49, 47, 47, 0.85);
|
|
border-radius: 20rpx;
|
|
}
|
|
|
|
.theretowcontent_item_boxs {
|
|
position: absolute;
|
|
top: 20rpx;
|
|
right: 16rpx;
|
|
padding: 6rpx 26rpx;
|
|
font-size: 24rpx;
|
|
font-family: Roboto-Bold, Roboto;
|
|
font-weight: bold;
|
|
color: #F6AE5B;
|
|
background: linear-gradient(180deg, #F9F9F9 0%, #FADAB5 100%);
|
|
box-shadow: 0px 6rpx 12rpx 2px rgba(226, 172, 110, 0.55);
|
|
border-radius: 20rpx;
|
|
}
|
|
|
|
.theretowcontent_item_image {
|
|
border-radius: 16rpx;
|
|
position: absolute;
|
|
width: 100%;
|
|
top: 0;
|
|
left: 0;
|
|
z-index: -1;
|
|
height: 100%;
|
|
}
|
|
}
|
|
}
|
|
</style> |