mirror of
				https://gitee.com/hhyykk/ipms-sjy.git
				synced 2025-11-04 12:18:42 +08:00 
			
		
		
		
	
		
			
				
	
	
		
			100 lines
		
	
	
		
			1.9 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			100 lines
		
	
	
		
			1.9 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
<template>
 | 
						|
	<view class="u-calendar-header u-border-bottom">
 | 
						|
		<text
 | 
						|
			class="u-calendar-header__title"
 | 
						|
			v-if="showTitle"
 | 
						|
		>{{ title }}</text>
 | 
						|
		<text
 | 
						|
			class="u-calendar-header__subtitle"
 | 
						|
			v-if="showSubtitle"
 | 
						|
		>{{ subtitle }}</text>
 | 
						|
		<view class="u-calendar-header__weekdays">
 | 
						|
			<text class="u-calendar-header__weekdays__weekday">一</text>
 | 
						|
			<text class="u-calendar-header__weekdays__weekday">二</text>
 | 
						|
			<text class="u-calendar-header__weekdays__weekday">三</text>
 | 
						|
			<text class="u-calendar-header__weekdays__weekday">四</text>
 | 
						|
			<text class="u-calendar-header__weekdays__weekday">五</text>
 | 
						|
			<text class="u-calendar-header__weekdays__weekday">六</text>
 | 
						|
			<text class="u-calendar-header__weekdays__weekday">日</text>
 | 
						|
		</view>
 | 
						|
	</view>
 | 
						|
</template>
 | 
						|
 | 
						|
<script>
 | 
						|
	export default {
 | 
						|
		name: 'u-calendar-header',
 | 
						|
		mixins: [uni.$u.mpMixin, uni.$u.mixin],
 | 
						|
		props: {
 | 
						|
			// 标题
 | 
						|
			title: {
 | 
						|
				type: String,
 | 
						|
				default: ''
 | 
						|
			},
 | 
						|
			// 副标题
 | 
						|
			subtitle: {
 | 
						|
				type: String,
 | 
						|
				default: ''
 | 
						|
			},
 | 
						|
			// 是否显示标题
 | 
						|
			showTitle: {
 | 
						|
				type: Boolean,
 | 
						|
				default: true
 | 
						|
			},
 | 
						|
			// 是否显示副标题
 | 
						|
			showSubtitle: {
 | 
						|
				type: Boolean,
 | 
						|
				default: true
 | 
						|
			},
 | 
						|
		},
 | 
						|
		data() {
 | 
						|
			return {
 | 
						|
 | 
						|
			}
 | 
						|
		},
 | 
						|
		methods: {
 | 
						|
			name() {
 | 
						|
 | 
						|
			}
 | 
						|
		},
 | 
						|
	}
 | 
						|
</script>
 | 
						|
 | 
						|
<style lang="scss" scoped>
 | 
						|
	@import "../../libs/css/components.scss";
 | 
						|
 | 
						|
	.u-calendar-header {
 | 
						|
		padding-bottom: 4px;
 | 
						|
 | 
						|
		&__title {
 | 
						|
			font-size: 16px;
 | 
						|
			color: $u-main-color;
 | 
						|
			text-align: center;
 | 
						|
			height: 42px;
 | 
						|
			line-height: 42px;
 | 
						|
			font-weight: bold;
 | 
						|
		}
 | 
						|
 | 
						|
		&__subtitle {
 | 
						|
			font-size: 14px;
 | 
						|
			color: $u-main-color;
 | 
						|
			height: 40px;
 | 
						|
			text-align: center;
 | 
						|
			line-height: 40px;
 | 
						|
			font-weight: bold;
 | 
						|
		}
 | 
						|
 | 
						|
		&__weekdays {
 | 
						|
			@include flex;
 | 
						|
			justify-content: space-between;
 | 
						|
 | 
						|
			&__weekday {
 | 
						|
				font-size: 13px;
 | 
						|
				color: $u-main-color;
 | 
						|
				line-height: 30px;
 | 
						|
				flex: 1;
 | 
						|
				text-align: center;
 | 
						|
			}
 | 
						|
		}
 | 
						|
	}
 | 
						|
</style>
 |