questionbankvue3/pages/exercises/examSubjiect1/examSubjiect1.vue

<template>
	<view class="content">
		<up-navbar leftText=" " :leftIconColor="'#fff'" :safeAreaInsetTop="true" :autoBack="true" title="我的学习"
			:bgColor="'transparent'" :titleStyle="{color: '#fff'}">
			<template #right>
				<view class="cjd" @click="$goPage('/pages/exercises/examSubjiect1/examResultsOne')">
					成绩单
				</view>
			</template>
		</up-navbar>
		<view class="padding">
			<view class="useInfo flex">
				<view class="avatar">
					<image src="" mode=""></image>
				</view>
				<view class="rightBox">
					<view class="name">{{ phone }}</view>
					<view class="p" v-if="info.highScore">
						<text>最高分数：{{ info.highScore }}</text>
						<text>用时：{{ info.useTimes }} 分钟 </text>
					</view>
				</view>
			</view>

			<view class="card">
				<view class="text">考试车型：{{ usecarStore.carInfo.carTypeName}}</view>
				<view class="text">考试时间：{{ info.totalExamTime}}分钟（ {{ info.totalCount }}题）</view>
				<view class="text">合格标准：{{ info.score }}分及格（满分{{ info.funllScore }}分）</view>
				<view class="text">出题规则：{{info.questionRule}}</view>
				<view class="text">计分规则：{{info.deductPointsRule}}</view>
			</view>
			<view class="btnBox">
				<oneBtn text="开始模拟考试" @click="$goPage(`/pages/exercises/brushQuestions/examQuestions?totalExamTime=${info.totalExamTime}&score=${info.score}`)"></oneBtn>
			</view>
		</view>

	</view>
</template>

<script setup>
	import { ref } from 'vue'
	import { questionExam} from '@/config/api.js'
	import carStore from '@/store/modules/car.js'
	let usecarStore = carStore()
	
	import {
		onShow,
	} from "@dcloudio/uni-app"
	
	let phone = uni.getStorageSync('loginInfo')?.phone
	let info = ref({})
	async function questionExamFn() {
		const {data:res} = await questionExam({stepType: usecarStore.carInfo.stepType, carType: usecarStore.carInfo.carType})
		let arr = res.useTime.split(':')
		res.useTimes =arr[0] +':'+ arr[1].substring(0, 2)
		info.value = res
	}
	onShow(()=>{
		questionExamFn()
	})
</script>

<style lang="scss" scoped>
	.content {
		width: 100%;
		min-height: 100vh;
		padding: 100rpx 0rpx 30rpx 0rpx;
		background: url('../../../static/images/topbg.png') #F6F7FA no-repeat;
		background-size: 100% 410rpx;
		.cjd {
			color: #fff;
		}
		.useInfo {
			padding: 30rpx 0;

			.avatar {
				width: 140rpx;
				height: 140rpx;
				overflow: hidden;
				border-radius: 50%;
				background: url('../../../static/images/avatarbg.png') no-repeat;
				background-size: 100% 100%;
				image {
					display: block;
					width: 100%;
					height: 100%;
				}
			}

			.rightBox {
				flex: 1;
				width: 0;
				padding-left: 30rpx;

				.name {
					font-size: 36rpx;
					color: #FFFFFF;
					font-weight: 500;
				}

				.p {
					padding-top: 30rpx;

					text {
						font-weight: 500;
						font-size: 28rpx;
						color: #FFFFFF;
						margin-right: 40rpx;
					}
				}
			}
		}

		.card {
			background: #FFFFFF;
			border-radius: 20rpx;
			padding: 20rpx 30rpx;

			.text {
				padding: 10rpx 0;
				font-weight: 500;
				font-size: 28rpx;
				color: #333333;
			}
		}

		.btnBox {
			padding: 100rpx 50rpx;
			width: 100%;
		}
	}
</style>