mabaoDoctor/pages/scheduling/year_Scheduling.vue

<!-- 年视图 -->
<template style="background-color:#FFF ;">
	<view style="width: 100%;height: 100%;background-color:#FFF ;">
		<view style="height: 40rpx;"></view>
		<view style="margin: 0 40rpx ;">
			<view style="font-size: 50rpx;font-weight: 500;margin-bottom: 30rpx;display: flex;justify-content: space-around;">
				<u-icon name="arrow-left" @click="reduce"></u-icon>
				<text>{{year}}年</text>
				<u-icon name="arrow-right" @click="plus"></u-icon>
			</view>
			<!-- 月 -->
			<view v-if="load" class="flex justify-center align-center" style="height: 80vh;">
				<u-loading mode="circle" size="50"></u-loading>
			</view>

			<view v-else>
				<u-grid :col="3" :border="false" align="center">
					<u-grid-item v-for="item,index in time" :key="index" @click="jumpMonth(index)">
						<view style="font-size: 40rpx;width: 100%;">{{item.title}}</view>
						<view style="height: 280rpx;">
							<u-grid :col="7" style="font-size: 20rpx;" :border="false">
								<u-grid-item>日</u-grid-item>
								<u-grid-item>一</u-grid-item>
								<u-grid-item>二</u-grid-item>
								<u-grid-item>三</u-grid-item>
								<u-grid-item>四</u-grid-item>
								<u-grid-item>五</u-grid-item>
								<u-grid-item>六</u-grid-item>
								<u-grid-item v-for="mitem,mindex in item.month" :key="mindex">{{mitem.text}}</u-grid-item>
							</u-grid>
						</view>
					</u-grid-item>
				</u-grid>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		onLoad() {
			this.load = true
			this.getNowTime()
			this.setWeek()
			this.$nextTick(function() {
				this.getweek()
				this.load = false
			})

		},
		data() {
			return {
				load: true, //加载列表展示
				year: 0,
				nowYear:0,
				month: 0,
				time: [{
						title: '',
						month: []
					},
					{
						title: '',
						month: []
					},
					{
						title: '',
						month: []
					},
					{
						title: '',
						month: []
					},
					{
						title: '',
						month: []
					},
					{
						title: '',
						month: []
					},
					{
						title: '',
						month: []
					},
					{
						title: '',
						month: []
					},
					{
						title: '',
						month: []
					},
					{
						title: '',
						month: []
					},
					{
						title: '',
						month: []
					},
					{
						title: '',
						month: []
					},
				],
			}
		},
		methods: {
			/**
			 * 拿到当前年
			 * */
			getNowTime() {
				var d = new Date();
				this.year = d.getFullYear()
				this.nowYear = d.getFullYear()
				this.month = d.getMonth() //实际上1月值为0,配合下面下标判断,不加1
			},
			/**
			 * 给所有数据加月
			 * */
			setWeek() {
				for (let w = 0; w < 12; w++) {
					this.time[w].title = (w + 1) + '月'
				}
				console.log(this.time)
			},
			/**
			 * 拿到这年到一月一号的数据
			 * */
			getweek() {
				let startYear = this.year; //开始年
				let startMonth = 1; //开始月
				let startDay = 1; //开始的日
				let oneDayTime = 24 * 60 * 60 * 1000; //固定数据 一天的时长
				for (let a = 0; a < 12; a++) {
					var date = new Date()
					date.setFullYear(this.year, a, 1); //今年每个月的一号
					for (let b = 0; b < date.getDay(); b++) {
						this.time[a].month.push({
							text: ""
						})
					}
					date.setFullYear(this.year, a + 1, 0); //查看这个月有几天
					// console.log(date.getDate())
					for (let c = 0; c < date.getDate(); c++) {
						this.time[a].month.push({
							text: c + 1
						})
					}
				}
			},
			/**
			 * 加年数
			 * */
			plus() {
				this.time.map(val => {
					val.month.splice(0, val.month.length)
				})
				this.year++
				this.setWeek()
				this.getweek()

			},
			/**
			 * 减年数
			 * */
			reduce() {
				if(this.year==2020){
					uni.showToast({
						icon:'none',
						title:'无法跳转'
					})
				}else{
					this.time.map(val => {
					val.month.splice(0, val.month.length)
				})
				this.year--
				this.setWeek()
				this.getweek()
				}
				

			},
			/**
			 * 跳转
			 * */
			jumpMonth(index) {
				console.log(this.year,index)
				if (!(index < this.month)) {
					let pages = getCurrentPages();
					let prevPage = pages[pages.length - 2];
					console.log(pages)
					console.log(prevPage)
					console.log(prevPage.$vm.year)
					console.log(prevPage.$vm.month)
					prevPage.$vm.year = this.year;
					prevPage.$vm.month = index ;
					prevPage.$vm.load = true;
					uni.navigateBack({
						delta: 1
					})
				} else {
					if(this.year>this.nowYear){
						let pages = getCurrentPages();
						let prevPage = pages[pages.length - 2];
						prevPage.$vm.year = this.year;
						prevPage.$vm.month = index ;
						prevPage.$vm.load = true;
						uni.navigateBack({
							delta: 1
						})
					}else{
					uni.showToast({
						icon:'none',
						title:'只能选择'+(this.month+1)+'月以后的日期'+this.year+this.nowYear
					})
					}
				}
			}
		}
	}
</script>

<style>
</style>