<template>
	<view>
		<uni-list>
			<uni-list-item v-for="item in list" :key="item.id" @click="goDetail(item.id)" :clickable="true" link style="padding: 10upx;">
				<!-- 自定义 body -->
				<template slot="body" style="display: block;width: 100%;">
					<view class="infoHead" style="">
						<view>
							<text style="font-weight: bold;">{{item.exam_name}}</text>
							<text v-if="item.name.indexOf('(补)') != -1">(补)</text>
						</view>
						<span style="font-size: 26upx;">总分：{{item.total_score}}分</span>
					</view>
					<view class="infoLine">
						<span>耗时：
							<span style="color:#e47d25;">{{item.took_format}}</span>
							</span>
					</view>
					<view class="infoLine">
						<text>提交时间：{{item.create_time}}</text>
					</view>
					<view class="infoLine">
						<span>本次得分：
							<span class='scoreClass'>{{item.score}}</span>
							分</span>
					</view>
				</template>
			</uni-list-item>
		</uni-list>
		<view class="loadingText">{{loadingText}}</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				listQuery: {
					page: 1,
					page_size: 20
				},
				list: [],
				loadingText: '加载中...'
			}
		},
		methods: {
			getList() {
				var that = this
				that.$u.api.examRecord(that.listQuery).then(res => {
					uni.stopPullDownRefresh()
					uni.setNavigationBarTitle({
						title: res.data.count + '条考试记录'
					})
					if (that.listQuery.page == 1) {
						if (res.data.results.length == 0) {
							that.loadingText = '暂无考试记录'
						} else {
							that.loadingText = ''
							that.list = res.data.results
						}
					} else {
						that.loadingText = ''
						that.list = that.list.concat(res.data.results)
					}
				}).catch(res => {
					uni.stopPullDownRefresh()
					if (res.code == 404) {
						that.loadingText = '到底了'
					}
				})
			},
			goDetail(id) {
				uni.showLoading({
					title:"正在获取考试详情",
				})
				this.$u.api.examRecordDetail(id).then(res=>{
					uni.hideLoading()
					uni.setStorageSync('currentExam', res.data)
					if (res.data.questions_.length>0){
						uni.navigateTo({
							url:'/pages/exam/detail?examrecord='+id
						})
					}
					else{
						uni.showToast({
							title:'获取失败',
							icon:'none'
						})
						return
					}
				}).catch(e=>{
				})
			}
		},
		onLoad() {
			this.listQuery.page = 1
			this.getList()
		},
		onPullDownRefresh() {
			this.listQuery.page = 1
			this.getList()
		},
		onReachBottom() {
			this.listQuery.page = this.listQuery.page + 1
			this.getList()
		}

	}
</script>

<style lang='scss'>
	page {
		background-color: $u-bg-color;

	}
	.infoHead{
		display: flex;
		justify-content: space-between;
		height: 64upx;
		line-height: 60upx;
	}
	.infoLine{
		color:gray;
		font-size: 28upx;
		height: 40upx;
		line-height: 40upx;
	}
	.scoreClass{
		color:#2581e4;
		font-weight: bold;
		font-size: 34upx;
	}
	.loadingText{
		color:gray;
		text-align: center;
		margin-top:20upx
	}
</style>
