|
@@ -1,28 +1,64 @@
|
|
|
<template>
|
|
|
<m-nav-bar title="考试结果" />
|
|
|
- <div class="result-box">
|
|
|
+ <div class="result-box" v-if="testResult">
|
|
|
<img class="img" src="/img/考试合格.png" />
|
|
|
<span class="text">恭喜你,测试通过~</span>
|
|
|
- <div class="fraction-box"><span class="fraction">98</span>分</div>
|
|
|
+ <div class="fraction-box">
|
|
|
+ <span class="fraction">{{ props.userTestData.testScores }}</span
|
|
|
+ >分
|
|
|
+ </div>
|
|
|
<span class="hint">(满分:100;合格:90)</span>
|
|
|
- <span class="time">用时:0分2秒</span>
|
|
|
+ <span class="time">用时:{{ useTime }}</span>
|
|
|
<span class="evaluation"
|
|
|
>天赋异禀、骨骼惊奇,想来是百年难得一见的考试奇才。</span
|
|
|
>
|
|
|
- <div class="btn-box">
|
|
|
- <m-button class="btn1" text="错题重做" />
|
|
|
- <m-button class="btn2" text="重新测试" />
|
|
|
+ </div>
|
|
|
+ <div class="result-box" v-else>
|
|
|
+ <img class="img" src="/img/考试不合格.png" />
|
|
|
+ <span class="text">抱歉,测试未通过~</span>
|
|
|
+ <div class="fraction-box">
|
|
|
+ <span class="fraction">{{ props.userTestData.testScores }}</span
|
|
|
+ >分
|
|
|
</div>
|
|
|
+ <span class="hint">(满分:100;合格:90)</span>
|
|
|
+ <span class="time">用时:{{ useTime }}</span>
|
|
|
+ <span class="evaluation"
|
|
|
+ >学车之路,任重而道远!路漫漫其修远兮,吾将上下而求索。</span
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <div class="btn-box">
|
|
|
+ <m-button class="btn1" text="错题重做" />
|
|
|
+ <m-button class="btn2" text="重新测试" />
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script setup lang="ts">
|
|
|
-import { defineEmits } from "vue";
|
|
|
+import { defineEmits, defineProps, computed } from "vue";
|
|
|
+import dayjs from "dayjs";
|
|
|
+import { createTestScores } from "@/api";
|
|
|
+import { useRoute } from "vue-router";
|
|
|
+
|
|
|
+const props = defineProps(["userTestData"]);
|
|
|
+
|
|
|
+//是否通过考试
|
|
|
+const testResult = computed(() => {
|
|
|
+ return props.userTestData.testScores >= 90;
|
|
|
+});
|
|
|
+//用时多久
|
|
|
+const useTime = computed(() => {
|
|
|
+ return dayjs(props.userTestData.useTime).format("mm分ss秒");
|
|
|
+});
|
|
|
|
|
|
-const emits = defineEmits(["next"]);
|
|
|
-const gotoTest = () => {
|
|
|
- emits("next");
|
|
|
-};
|
|
|
+const { query } = useRoute();
|
|
|
+
|
|
|
+//提交考试成绩
|
|
|
+createTestScores({
|
|
|
+ type: query.vehicle as string,
|
|
|
+ kskm: query.name as string,
|
|
|
+ score: props.userTestData.testScores,
|
|
|
+}).then((res) => {
|
|
|
+ console.log(res);
|
|
|
+});
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
@@ -79,23 +115,23 @@ const gotoTest = () => {
|
|
|
color: #5c6066;
|
|
|
line-height: 23px;
|
|
|
}
|
|
|
- .btn-box {
|
|
|
- margin-top: 45px;
|
|
|
- width: 230px;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- color: #ffffff;
|
|
|
- font-size: 15px;
|
|
|
- font-family: PingFang SC;
|
|
|
- font-weight: 400;
|
|
|
- line-height: 23px;
|
|
|
- .btn1 {
|
|
|
- background-color: #498ef5;
|
|
|
- }
|
|
|
- .btn2 {
|
|
|
- background-color: #01c18d;
|
|
|
- }
|
|
|
+}
|
|
|
+.btn-box {
|
|
|
+ margin: 45px auto;
|
|
|
+ width: 230px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ color: #ffffff;
|
|
|
+ font-size: 15px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ line-height: 23px;
|
|
|
+ .btn1 {
|
|
|
+ background-color: #498ef5;
|
|
|
+ }
|
|
|
+ .btn2 {
|
|
|
+ background-color: #01c18d;
|
|
|
}
|
|
|
}
|
|
|
</style>
|