68 lines
1.2 KiB
Vue
68 lines
1.2 KiB
Vue
<template>
|
|
<view class="list-main bgF" :style="{ marginTop: mTop, marginBottom: mBot }" @tap="jumpPage">
|
|
<image :src="imgUrl" mode="scaleToFill" />
|
|
<view class="main-info" :class="[isBorder]">
|
|
{{ title }}
|
|
<image src="/static/iconImg/right-arrow.svg" mode="scaleToFill" />
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
const props = defineProps({
|
|
mTop: {
|
|
type: String,
|
|
default: "0",
|
|
},
|
|
imgUrl: {
|
|
type: String,
|
|
},
|
|
title: {
|
|
type: String,
|
|
},
|
|
url: {
|
|
type: String,
|
|
},
|
|
isBorder: {
|
|
type: String,
|
|
},
|
|
})
|
|
const jumpPage = () => {
|
|
uni.navigateTo({
|
|
url: props.url,
|
|
})
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.list-main {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
height: 110rpx;
|
|
font-size: 33rpx;
|
|
image {
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
// margin: 0 50rpx 0 0;
|
|
margin-left: 50rpx;
|
|
margin-right: 30rpx;
|
|
}
|
|
.main-info {
|
|
flex: 1;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
height: 100%;
|
|
border-bottom: 1rpx solid #e5e5e5;
|
|
|
|
image {
|
|
margin-right: 50rpx;
|
|
}
|
|
}
|
|
}
|
|
.isBorder {
|
|
border: none !important;
|
|
}
|
|
</style>
|