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

<template>
	<view class="u-panel">
		<view class="u-panel-head display-flex-between">
			<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() {
				if (this.link.indexOf('http') === -1) {
					uni.navigateTo({
						url: this.link
					})
				}
			}
		}
	}
</script>
<style lang="scss">
	.u-panel{
		padding: 24rpx 28rpx;
	}
	.u-panel-head{
		margin-bottom: 26rpx;
		.u-panel-title{
			position: relative;
			padding-bottom: 20rpx;
			font-size: $fontSize4;
			font-weight: 500;
			color: #000000;
			&:after{
				@extend .after;
				left: 0;
				right: 0;
				bottom: 0;
				width: 34rpx;
				height: 0;
				border: 4rpx solid $buttonPrimaryColor;
				margin: auto;
			}
		}
		.u-panel-link{
			font-size: $fontSize1;
			color: #7D7D7D;
		}
	}
</style>