<template>
	<div>
		<!-- 主体内容 -->
		<div class="main">
			<!-- 左侧 -->
			<div class="main-left">
				<!-- 班级情况 -->
				<div class="class-left-one">
					<div class="baby-left-content">
						<div class="class-left-title">
							<img src="../../static/img/home/flower.png" >
							<img src="../../static/img/home/flower.png" >
							<div class="pultitle">班级情况</div>
						</div>
						<div class="baby-content-box">
							<div class="class-situation class-item-box">中二班</div>
							<!-- 班级老师 -->
							<div class="class-item-box">
								<div class="teather-title">班级老师</div>
								<div class="teather-box">
									<div v-for="(item,index) in teatherArr" :key="index">
										<img :src="item.headImg" >
										<span>{{item.name}}</span>
									</div>
								</div>
							</div>
							<!-- 当前活动 -->
							<div class="class-item-box" style="height: 210px;">
								<div class="teather-title">当前活动</div>
								<div class="class-active">
									<label>13:00-15:00</label>
									<label>户外体育</label>
								</div>
							</div>
							<!-- 当前活动 -->
							<div class="class-item-box" style="height: 210px;">
								<div class="teather-title">当前活动</div>
								<div class="class-active">
									<label>13:00-15:00</label>
									<label>户外体育</label>
								</div>
							</div>
							<!-- 当前活动 -->
							<div class="class-item-box" style="height: 210px;">
								<div class="teather-title">当前活动</div>
								<div class="class-active">
									<label>13:00-15:00</label>
									<label>户外体育</label>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<!-- 右侧 -->
			<div class="class-main-right">
				<div class="class-left-title">
					<div class="pultitle">宝宝课表第{{weekNum}}周（{{dateTime}}）</div>
				</div>
				<div class="baby-content-box">
					<div class="time-title-box">
						<div v-for="(item,index) in kebiaoArr" :key="index">{{item}}</div>
					</div>
					<template v-if="isNothing">
						<div class="tiam-data-box" v-for="(item,index) in dataArr" :key="index">
							<div class="time-left" :style="{background:['#C3AEFF','#F1D470','#FF9393'][index]}">{{item.Ampm}}</div>
							<div style="width: 100%;">
								<div class="time-right-box" v-for="(itemt,indext) in item.Content" :key="indext">
									<div class="time-item clips1" style="border-radius: 10px 0 0 10px;display: flex;">
										<div></div>
										<div>{{itemt.TimePart}}</div>
									</div>
									<div class="clips1 time-item">{{itemt.Week1Name}}</div>
									<div class="clips1 time-item">{{itemt.Week2Name}}</div>
									<div class="clips1 time-item">{{itemt.Week3Name}}</div>
									<div class="clips1 time-item">{{itemt.Week4Name}}</div>
									<div class="clips1 time-item">{{itemt.Week5Name}}</div>
								</div>
							</div>
						</div>
					</template>
				</div>
			</div>
		</div>
	</div>
</template>
<script>
	export default {
		name: 'babyActivity',
		data() {
			return {
				weekNum:0,
				dateTime:'2021年12月28日',
				teatherArr:[
					{name:'张芳芳',headImg:require('../../static/img/seconds/tu-01.png')},
					{name:'张芳芳',headImg:require('../../static/img/seconds/tu-01.png')},
					{name:'张芳芳',headImg:require('../../static/img/seconds/tu-01.png')},
					{name:'张芳芳',headImg:require('../../static/img/seconds/tu-01.png')},
					{name:'张芳芳',headImg:require('../../static/img/seconds/tu-01.png')},
				],
				kebiaoArr:['时间','星期一','星期二','星期三','星期四','星期五'],
				dataArr:[],
				isNothing:false
			}
		},
		methods: {
			async getbabycourseEv() {
				let data = await this.$axios({
					// 调用 serviceAPI
					url: this.$https.getbabycourse,
					methods: "get",
					params: {
						EquipmentID: "yaohaotest001",
					},
				});
				let newData = data.data.data;
				// 第几周
				this.weekNum = newData[0].NowWeekNo;
				// 时间
				let newTime = newData[0].NowDate.slice(0,10).split('/');
				this.dateTime = `${newTime[2]}年${newTime[1]}月${newTime[0]}日`;
				// 一周安排
				this.dataArr = newData[0].WeekData;
				if(this.dataArr.length) this.isNothing = true;
			},
			async getbabynowtimecourseEv() {
				let data = await this.$axios({
					// 调用 serviceAPI
					url: this.$https.getbabynowtimecourse,
					methods: "get",
					params: {
						EquipmentID: "yaohaotest001",
					},
				});
				console.log(data.data.data);
			},
			
		},
		mounted() {
			// 查看一周的宝宝课表
			this.getbabycourseEv();
			// 查看当前课程及下节课内容
			this.getbabynowtimecourseEv();
		}
	}
</script>
