<template>
	<view>
		<uni-list>
		    <!-- 垂直排列，无略缩图，主标题+副标题显示 -->
		    <uni-list-item direction="column" :key="item.id" v-for="(item, index) in examList">
		        <template v-slot:header>
		            <view class="uni-title">{{item.name}}</view>
		        </template>
		        <template v-slot:body>
		            <view class="uni-list-box">
		                <view class="uni-content">
		                    <view class="uni-title-sub uni-ellipsis-2">开启时间: {{item.open_time}}至{{item.close_time}}</view>
		                    <view class="uni-note">考试机会: {{item.chance}}次</view>
		                </view>
		            </view>
		        </template>
		        <template v-slot:footer>
		            <view class="uni-footer">
						<u-button size="mini" type="primary" @click="attendExam(item)">我要参加</u-button>
						<u-button size="mini" type="info">成绩排名</u-button>
		            </view>
		        </template>
		    </uni-list-item>
		</uni-list>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				query:{
					page: 1
				},
				examList: []
			}
		},
		onLoad() {
			this.getExamList();
		},
		methods: {
			getExamList(){
				this.$u.api.getExamList(this.query).then(res=>{
					this.examList = res.data.results
				})
			},
			attendExam(val){
				console.log(val)
				uni.setStorageSync('currentExam', val)
				uni.navigateTo({
					url:"/pages/exam/preview"
				})
			}
		}
	}
</script>

<style>

</style>
