labsop_h5/src/view/exam/result.vue

<!--
 * @Author: wanglj wanglijie@dashoo.cn
 * @Date: 2025-03-17 13:36:58
 * @LastEditors: wanglj wanglijie@dashoo.cn
 * @LastEditTime: 2025-03-28 13:46:42
 * @FilePath: \labsop-h5\src\view\training\index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div class="app-container">
    <h4>考试结果</h4>
    <van-cell-group>
      <van-cell title="考生姓名" :value="state.form.fullName"></van-cell>
      <van-cell title="考试时间" :value="state.form.entryTime"></van-cell>
      <van-cell title="试卷总分" :value="state.form.epTotalScore"></van-cell>
      <van-cell title="得分" :value="state.form.exScore"></van-cell>
      <van-cell title="结果" :value="state.form.exScore >= state.form.passingScore ? '及格' : '不及格'"></van-cell>
      <van-cell title="用时" :value="`${useMin}分钟`"></van-cell>
    </van-cell-group>
  </div>
</template>

<script lang="ts" setup>
  import to from 'await-to-js'
  import { computed, onMounted, reactive } from 'vue'
  import { useRouter, useRoute } from 'vue-router'
  import { useTrainingApi } from '/@/api/training'
  import { formatDate } from '/@/utils/formatTime'
  import { useUserInfo } from '/@/stores/userInfo'
  import { showNotify } from 'vant'
  const props = defineProps({
    isAll: {
      type: String,
      default: '10'
    }
  })
  const trainingApi = useTrainingApi()
  const route = useRoute()
  const router = useRouter()
  const state = reactive({
    answerId: 0,
    queryParams: {
      pageNum: 1,
      pageSize: 10,
      isAll: false
    },
    form: {
      fullName: '',
      entryTime: '',
      epTotalScore: 0,
      exScore: 0,
      passingScore: 0,
      handTime: ''
    },
    loading: false,
    finished: false
  })
  const useMin = computed(() => {
    let startDate = new Date(state.form.entryTime).getTime()
    let endDate = new Date(state.form.handTime).getTime()
    let min = Math.floor(((endDate - startDate) / 1000 / 60) << 0)
    return min
  })
  const initData = async () => {
    const [err, res]: ToResponse = await to(trainingApi.getAnswerInfo({ answerId: state.answerId }))
    if (err) return
    if (res?.data) {
      state.form = res.data
    }
  }
  const dateRemoveSec = (date: any) => {
    if (date && typeof date == 'string') {
      let dateArr = []
      dateArr = date.split(':')
      return dateArr[0] + ':' + dateArr[1]
    } else {
      return '/'
    }
  }
  onMounted(() => {
    const id = route.query.id ? Number(route.query.id) : 0
    state.answerId = id
    initData()
  })
</script>

<style lang="scss" scoped>
  .app-container {
    .van-cell {
      background-color: #fff;
      margin-top: 10px;
      header {
        color: #333;
        font-size: 16px;
      }
      footer {
        color: #969799;
        margin-top: 4px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        text-align: right;
      }
      .title {
        font-weight: bold;
      }
      .inst-title {
        color: #333;
        text-align: left;
        flex: 1;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        margin-top: 4px;
      }
      .time {
        color: #f69a4d;
      }
    }
    h4 {
      height: 18px;
      line-height: 18px;
      display: flex;
      margin: 10px 0;
      span {
        font-weight: normal;
        margin-left: auto;
      }
      &::before {
        display: inline-block;
        content: '';
        width: 3px;
        height: 18px;
        background-color: #1c9bfd;
        margin-right: 4px;
        vertical-align: middle;
      }
    }
  }
</style>