<template>
	<view class="endBG">
		<view class="topTitle">
			<view><image style="height: 48rpx;width: 167rpx;" src="@/static/goods.png" mode=""></image></view>
			<view>你完成了错题练习</view>
		</view>
		<view class="content">
			<view class="leftcen">
				<view class="leftT">{{ ((correct / allIndex) * 100).toFixed(0) }}%</view>
				<view class="leftC">正确率</view>
				<view class="leftB">不含简答/案例题</view>
			</view>
			<view class="rightcen">
				<view class="rightT">
					<view class="rightleftIcon">
						<span style="color: rgb(35,214,145);font-size: 48rpx;margin-right: 28rpx;">✔</span>
						<span>正确题数</span>
					</view>
					<view class="rightRigthIcon" style="color: rgb(35,214,145);font-size: 48rpx;font-weight: 500;">{{ correct }}</view>
				</view>
				<view class="rightT">
					<view class="rightleftIcon">
						<span style="color: rgb(225,38,38);font-size: 48rpx;margin-right: 28rpx;">✖</span>
						<span>错误题数</span>
					</view>
					<view class="rightRigthIcon" style="color: rgb(225,38,38);font-size: 48rpx;font-weight: 500;">{{ error }}</view>
				</view>
			</view>
		</view>
		<view class="footer">
			<view class="btns" @click="jumpError">错题解析</view>
			<view class="btns" @click="allJump">全部解析</view>
			<view class="btns" @click="backUp">继续练习</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			allIndex: 0,
			correct: 0,
			error: 0,
			bankSectionId: null,
			examId: null,
			errorArrayList: ''
		};
	},
	onLoad(options) {
		this.allIndex = options.allIndex;
		this.correct = options.correct;
		this.error = options.error;
		this.errorArrayList = options.errorArrayList;
		this.bankSectionId = options.bankSectionId;
		this.examId = options.examId;
		console.log(this.errorArrayList);
	},
	methods: {
		backUp() {
			uni.navigateBack({
				delta: 1
			});
		},
		jumpError() {
			var self = this;
			this.$navTo.togo('/pages2/bank/Parsing', {
				errorArrayList: self.errorArrayList,
				bankSectionId: self.bankSectionId,
				examId: self.examId
			});
		},
		allJump(){
			var self = this;
			this.$navTo.togo('/pages2/bank/Parsing', {
				bankSectionId: self.bankSectionId,
				examId: self.examId,
				allItem: true
			});
		}
	}
};
</script>
<style>
::-webkit-scrollbar {
	width: 0;
	height: 0;
	color: transparent;
}
</style>
<style scope>
.topTitle {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin: 70rpx 0rpx;
	color: #333333;
	font-size: 36rpx;
	font-weight: 500;
}
.content {
	display: flex;
	align-items: center;
	height: 182rpx;
}
.content > .leftcen {
	width: 242rpx;
	background-color: #f6f7f9;
	border-radius: 32rpx;
	height: 100%;
	margin-right: 23rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.content > .leftcen > .leftT {
	margin-top: 15rpx;
	font-size: 60rpx;
	font-weight: 800;
	color: #32467b;
}
.content > .leftcen > .leftC {
	color: #333333;
	font-size: 32rpx;
	margin-bottom: 6rpx;
}
.content > .leftcen > .leftB {
	color: #999999;
	font-size: 24rpx;
}
.content > .rightcen {
	flex: 1;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.content > .rightcen > .rightT {
	padding: 0rpx 35rpx 0rpx 45rpx;
	display: flex;
	align-items: center;
	font-size: 30rpx;
	height: 80rpx;
	border-radius: 32rpx;
	background-color: #f6f7f9;
	justify-content: space-between;
}
.rightleftIcon {
	display: flex;
	align-items: center;
}
.footer {
	display: flex;
	justify-content: space-around;
	align-items: center;
	margin-top: 42rpx;
}
.footer > .btns {
	width: 200rpx;
	height: 80rpx;
	line-height: 80rpx;
	text-align: center;
	border-radius: 32rpx;
	background-color: #f6f7f9;
	font-size: 32rpx;
	color: #333;
	font-weight: 500;
}
.endBG {
	padding: 0rpx 32rpx;
}
page {
	background: #ffffff;
}
</style>
