appointment_weapp/pages/index/components/recommend/index.vue

95 lines
1.7 KiB
Vue

<template>
<view class="index">
<view class="onecontenttowone flex-start">
<view class="onecontenttowone_one">
{{title}}
</view>
</view>
<view class="indexbox flex-between">
<image class="indexboxone" @click="eeInfoseries(list[0].mother_id)" :src="list[0].mother_img" mode="widthFix"></image>
<view class="flex-colum-start">
<image class="indexboxtow" @click="eeInfoseries(list[1].mother_id)" :src="list[1].mother_img" mode="widthFix"></image>
<image class="indexboxthere" @click="eeInfoseries(list[2].mother_id)" :src="list[2].mother_img" mode="widthFix"></image>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {}
},
props: {
list: {
type: Array,
default () {
return []
}
},
title: {
type: String,
default: '银收客'
},
},
methods: {
eeInfoseries(e) {
uni.pro.navigateTo('mall/series', {
id: e.id,
})
},
}
}
</script>
<style lang="scss">
.index {
width: 100%;
padding: 32rpx 32rpx 0 32rpx;
.onecontenttowone::before {
content: '';
display: inline-block;
width: 4rpx;
height: 20rpx;
background: var(--bg-color-buttonone);
border-radius: 4rpx;
}
.onecontenttowone {
.onecontenttowone_one {
margin-left: 8rpx;
font-size: 32rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: bold;
color: #1A1A1A;
}
}
.indexbox {
margin-top: 24rpx;
.indexboxone {
width: 336rpx;
height: 400rpx;
}
.flex-colum-start {
justify-content: space-between;
height: 400rpx;
.indexboxtow {
width: 334rpx;
height: 188rpx;
}
.indexboxthere {
margin-top: 28rpx;
width: 334rpx;
height: 188rpx;
}
}
}
}
</style>