<template>
	<view>
		<u-navbar :title="detail.className"></u-navbar>

		<view class="main">
			<u-cell-group>
				<u-cell-item title="校区" :value="detail.schoolName" :arrow="false">
				</u-cell-item>
				<u-cell-item v-if="detail.courseStart!=null && detail.courseEnd!=null" title="开课/结课日期"
					:value="detail.courseStart+'至'+detail.courseEnd" :arrow="false">
				</u-cell-item>
				<u-cell-item title="上课时间" :value="detail.courseDate+' '+detail.coursePeriods" :arrow="false">
				</u-cell-item>
				<u-cell-item v-if="detail.courseAmount!=null && detail.freeAmount!=null" title="课次"
					:value="detail.courseAmount+detail.freeAmount+'次'" :arrow="false">
				</u-cell-item>
				<u-cell-item title="上课教室" :value="detail.classroomName" :arrow="false">
				</u-cell-item>
				<u-cell-item title="学员总数" :value="detail.studentCount+'人'" :arrow="false">
				</u-cell-item>
				<u-cell-item class="teacher" title="任课老师" :value="detail.teacherNames"
					@click="gotoUrl('pages/youth/teacherHomepage/teacherHomepage?id=' + detail.courseTeachers)"></u-cell-item>
			</u-cell-group>
		</view>

		<view class="main">
			<u-cell-group>
				<u-cell-item title="打卡签到" :value="rollcallLogs.rollcall" :arrow="false"></u-cell-item>
				<u-cell-item v-if="rollcallLogs.rollcallTime" title="签到时间" :value="rollcallLogs.rollcallTime"  :arrow="false"></u-cell-item>
			</u-cell-group>
		</view>

		<!-- <view class="bottom" v-if="rollcallLogs != null">
			<button style="background-color: #DBDBDB" v-if="rollcallLogs.rollcallResult == '1'" disabled>
				已上课
			</button>
			<button style="background-color: #DBDBDB" v-if="rollcallLogs.rollcallResult == '2'" disabled>
				已请假
			</button>
		</view> -->
		<!-- <view class="bottom" v-else>
			<button @click="askForLeave">请假</button>
		</view> -->
	</view>
</template>

<script>
	import * as classScheduleApi from '@/apis/youth/classSchedule.js'

	export default {
		data() {
			return {
				studentId: '',
				scheduleId: '',
				detail: {},
				rollcallLogs: {
					rollcall: '',
					rollcallResult: '',
					rollcallTime: ''
				}
			}
		},
		onLoad(op) {
			if (op.id) {
				this.scheduleId = op.id;
				if (this.carhelp.getNsStudentId()) {
					this.studentId = this.carhelp.getNsStudentId().studentId;
					this.getCourseDetail();
				}
			}
		},
		methods: {
			askForLeave() {
				
			},
			getCourseDetail() {
				uni.showLoading({
					title: "加载中",
					mask: true,
				})
				classScheduleApi.getScheduleDtl({
					studentId: this.studentId,
					scheduleId: this.scheduleId
				}).then((response) => {
					uni.hideLoading();
					this.detail = response.data.scheduleDtl;
					if(response.data.rollcallLogs != null) {
						this.rollcallLogs = response.data.rollcallLogs;
						var date = new Date(response.data.rollcallLogs.rollcallTime);
						var hour = date.getHours();
						var minute = date.getMinutes();
						var second = date.getSeconds();
						if(hour < 10) {
							hour = '0' + hour;
						}
						if(minute < 10) {
							minute = '0' + minute;
						}
						if(second < 10) {
							second = '0' + second;
						}
						// this.rollcallLogs.rollcallTime = hour + ':' + minute + ':' + second;
						this.rollcallLogs.rollcallTime = ''
					}
				}).catch(error => {
					uni.showToast({
						title: error,
						icon: "none"
					})
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	page {
		padding-bottom: 150px;
	}

	.main {
		background-color: #fff;
		margin-bottom: 10px;
	}

	/deep/.u-cell_title {
		color: rgba(119, 119, 119, 1);
	}

	/deep/.u-cell__value {
		color: #333333;
	}

	.teacher {
		/deep/.u-cell__value {
			color: #00BAC8;
		}
	}

	.bottom {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		padding: 10px 0;
		background-color: #fff;

		button {
			border-radius: 50px;
			background-color: rgba(13, 186, 199, 1);
		 color: rgba(255, 255, 255, 1);
			font-size: 16px;
			line-height: 40px;
			width: 91.4%;
		}
	}
</style>
