<template>
	<view style="width: 90vh;margin: auto;padding-bottom: 25px;">
		<uni-section>
			<uni-card class="box-card" style="background-color:#f0fff3; " v-if="exams.length===0&&!enter">
				<uni-row>

					<uni-col :span="4">
					</uni-col>
					<uni-col :span="16">
						<h1>当前无题库，若网络超时请刷新</h1>
						<br>
					</uni-col>
				</uni-row>
			</uni-card>

			<view v-if="exams.length>0&&!enter" v-for="o in exams" :key="o">
				<uni-card style="background-color:#f0fff3; " class="box-card" v-if="exams.length>1">
					<uni-row class="allceter">
						<uni-col :span="12" style="font-size: 20px;">
							{{ '题库名称:  '}}<strong>{{o.title }}</strong>
						</uni-col>
						<uni-col :span="6">
							<uni-tag :text="o. state_dictText" type="success" />
						</uni-col>
						<uni-col :span="6">
							<button type="primary" @click="enterExam(o.id)">开始练习</button>
						</uni-col>
					</uni-row>
					<l-divider color="#251e75" />
					<uni-row>
						<uni-col :span="20"><strong>详情:</strong>{{o.questionRemark}}</uni-col>
						<!-- <uni-col :span="6"></uni-col>
						<uni-col :span="6"></uni-col> -->
						<uni-col :span="4"><strong>总数量:</strong>{{o.num}}</uni-col>
					</uni-row>
				</uni-card>


			</view>
		</uni-section>
		
	</view>
	<view style="width: 80vh;margin: auto;padding-bottom: 30px;">
		<view style="text-align: center;width: 300px;margin: auto;">
			<button type="primary" @click="infoExit()" v-if="exams.length>1&&!enter">退出
			</button>
		</view>
	</view>
</template>

<script>
	import {
		exit,
		request,
		getRepositoryList,
		getExamCreateExam,
		getExamOnlineExam,
		getExamQueryById,
		getExamListExamIn,
		getRepositoryById
	} from '../../examJs/examRequest';
	import {
		toExamStart,
		redirectTo,
	} from '../../examJs/examRoute.js'
	import screenfull from "screenfull";
	export default {
		name: 'examInfo',
		data() {
			return {
				isLoading: true,
				exams: [],
				enter: false,
				exam: {
					id: 1,
					message: ["点击开始考试后将自动开始练习，请遵守考场纪律诚信考试。", "考试试题，共3题。",
						"艺术类监测试卷分音乐和美术两个学科，其中音乐和美术各15分钟共计30分钟答卷时间，每一学科超时后将自动提交试卷。"
					],
					Paper: []
				},
				user: {
					grade: "五年级"
				}
			}
		},
		mounted() {
			redirectTo()
			this.user = JSON.parse(sessionStorage.getItem("user"))
			getRepositoryList({
				pageNo: 1,
				pageSize: 80
			}).then((data) => {
				this.exams = data.data.result.records
			}).catch(xhr => {
				console.log(xhr);
			});
		},

		methods: {
			// 开始练习
			enterExam(index) {
				sessionStorage.setItem('repositoryId',index)
				toExamStart()
			},
			// 退出
			infoExit() {
				exit()
			},
		}
	}
</script>
<style scoped lang="scss">
	.text {
		padding-top: 15px;
		text-align: left;
		font-size: 14px;
	}

	.item {
		margin-bottom: 18px;
	}

	.clearfix:before,
	.clearfix:after {
		display: table;
		content: "";
	}

	.clearfix:after {
		clear: both
	}

	.box-card {
		margin: 20px auto auto;
		width: 100%;
		height: 11vh;
		min-height: 110px;
		max-height: 200px;
	}

	.allceter {
		display: flex;
		align-items: center;
		height: 50px;
	}

	.userInfo {
		display: inline-block;
		width: 15vh;
		min-width: 150px;
	}
</style>