<template>
	<view class="">
		<view class="app">
			<view class="items" v-if="list.length>0">
				<view class="item" v-for="(item,index) in list">
					<view class="title">
						<view class="text">
							{{item.title}}
						</view>
						<view class="image">
							<image src="../../static/jinbi.png" mode=""></image>
							<span v-if="item.examFee&&item.examFee>=0">
								{{item.examFee}}
							</span>
							<span v-else>
								0
							</span>
						</view>
					</view>
					<view class="time" style="margin-top: 20rpx;">
						考试费用：{{item.examFee}}
					</view>
					<view class="time">
						考试日期：{{item.startDate}}至{{item.endDate}}
					</view>
					<view class="time">
						考试时间：{{item.startTime}}至{{item.endTime}}
					</view>
					<view class="time">
						考试时长：{{item.totalTime}}分钟
					</view>
					<view class="time">
						考试类型：{{item.examType==1?"模拟考试":""}}
						{{item.examType==2?"正式考试":""}}
						{{item.examType==3?"补考":""}}
					</view>
					<view class="time" style="color: #EA706A;font-weight:600">
						考试成绩：{{item.maxScore}}
					</view>
					<view class="time">
						试卷总分：{{item.totalScore}}
					</view>
					<view class="time">
						考试人员：{{user.name}}
					</view>
					<view class="time">
						身份证：{{user.cardNo}}
					</view>
					<view class="time">
						手机号：{{user.phone}}
					</view>
				</view>
			</view>
			<view v-else class="" style="margin-top: 100rpx;">
				<u-empty text="暂无历史考试成绩" mode="list" icon-size='240' font-size='32'></u-empty>
			</view>
			<u-toast ref="uToast" />
		</view>
	</view>
</template>

<script>
	import {
		paging
	} from '@/api/HistoryExam/index.js'
	export default {
		data() {
			return {
				user: uni.getStorageSync('examh5user'),
				list: [], //项目list
				total: 0,
			}
		},
		methods: {
			//考试报名
			signup() {
				uni.navigateTo({
					url: "/pages/addexam/addexam"
				})
			},
			//list请求
			info() {
				paging({
					examType: 0,
					current: 1,
					size: 200,
				}).then(res => {
					this.list = res.data.records
				})
			},
		},
		onLoad() {},
		onShow() {
			this.info();
		},
		onReachBottom() { //下滑加载
			if (this.list.length >= this.total) {} else {}
		},
		onPullDownRefresh() { //下拉刷新
			this.info();
			setTimeout(() => {
				uni.stopPullDownRefresh();
			}, 1000);
		},
	}
</script>

<style lang="scss">
	.navbar-right {
		color: #fff;
		padding-right: 20rpx;
	}

	.app {
		padding: 0;

		.items {
			width: 96%;
			margin: 20rpx auto;

			.item {
				margin: 10rpx auto;
				background-color: #fff;
				box-shadow: 0rpx 9rpx 31rpx 9rpx rgba(0, 0, 0, 0.03);
				border-radius: 5rpx;
				padding: 10rpx;
				width: 100%;
				position: relative;
				color: #333333;
				font-size: 30rpx;
				padding-bottom: 60rpx;

				.time {
					font-size: 30rpx;
				}

				.title {
					line-height: 100rpx;
					border-bottom: 1rpx solid #E6E6E6;
					font-size: 38rpx;
					color: #333333;
					position: relative;
					height: 100rpx;

					.text {
						height: 100%;
						overflow: hidden; //超出的文本隐藏
						display: -webkit-box;
						-webkit-line-clamp: 1; // 超出多少行
						-webkit-box-orient: vertical;
						width: calc(100% - 170rpx);
					}

					.image {
						position: absolute;
						right: 0%;
						top: 50%;
						transform: translateY(-50%);
						display: inline-block;
						font-size: 30rpx;
						color: #EA706A;

						span {
							display: inline-block;
							width: 100rpx;
						}

						image {
							transform: translateY(20%);
							width: 40rpx;
							height: 40rpx;
							padding-right: 10rpx;
						}
					}
				}
			}
		}
	}
</style>