mp_exhibitor_miniprog/components/common/u-panel/index.vue

<template>
	<view class="u-panel">
		<view class="u-panel-head">
			<view class="u-panel-title">{{ title }}</view>
			<view v-if="link" class="u-panel-link" @tap="onClickLink">
				{{ linkText || '查看更多' }} <van-icon class="van-icon" name="arrow" />
			</view>
		</view>
		<view class="u-panel-body">
			<slot></slot>
		</view>
	</view>
</template>

<script>
	export default {
		options: {
			styleIsolation: 'shared'
		},
		props: {
			title: String,
			link: String,
			linkText: String
		},
		computed: {
			style() {
			}
		},
		watch: {
		},
		data() {
			return {
			}
		},
		created() {
		},
		mounted() {
		},
		methods: {
			onClickLink() {
				this.navigateTo(this.link)
			}
		}
	}
</script>
<style lang="scss">
	.u-panel{
		padding: 24rpx 28rpx;
	}
	.u-panel-head{
		@include display-flex-between;
		margin-bottom: 26rpx;
		.u-panel-title{
			position: relative;
			padding-bottom: 20rpx;
			font-size: $fontSize5;
			font-weight: 500;
			color: #000000;
			&:after{
				@include after;
				left: 0;
				right: 0;
				bottom: 0;
				width: 34rpx;
				height: 0;
				border: 3rpx solid $buttonPrimaryColor;
				border-radius: 2rpx;
				margin: auto;
			}
		}
		.u-panel-link{
			font-size: $fontSize2;
			color: #7D7D7D;
			cursor: pointer;
		}
	}
</style>