|
|
@@ -0,0 +1,473 @@
|
|
|
+<template>
|
|
|
+ <view class="phone-kaoshi-page">
|
|
|
+ <!-- 导航区域 -->
|
|
|
+ <view class="icon-title-navBar-box">
|
|
|
+ <view @click="handleBack" class="nav-bar-icon"></view>
|
|
|
+ <text class="nav-bar-title">{{data.ksName}}</text>
|
|
|
+ </view>
|
|
|
+ <!-- 第一行 -->
|
|
|
+ <view class="kaoshi-page-title">
|
|
|
+ <view v-if="activeSt" class="title-types">{{stTypes[activeSt.stTypeId]}}</view>
|
|
|
+ <view>100分钟</view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
+ <view class="kaoshi-shiti-content">
|
|
|
+ <!-- 内容区域 -->
|
|
|
+ <!-- 试题区域 -->
|
|
|
+ <view v-if="activeSt">
|
|
|
+ <template v-if="activeSt.stTypeId == 1">
|
|
|
+ <!-- 单选 -->
|
|
|
+ <danxuan :question="activeSt" :key="activeSt.stId"></danxuan>
|
|
|
+ </template>
|
|
|
+ <template v-if="activeSt.stTypeId == 2" >
|
|
|
+ <!-- 多选 -->
|
|
|
+ <duoxuan :question="activeSt" :key="activeSt.stId"></duoxuan>
|
|
|
+ </template>
|
|
|
+ <template v-if="activeSt.stTypeId == 3">
|
|
|
+ <!-- 判断 -->
|
|
|
+ <panduan :question="activeSt" :key="activeSt.stId"></panduan>
|
|
|
+ </template>
|
|
|
+ <template v-if="activeSt.stTypeId == 4">
|
|
|
+ <!-- 填空 -->
|
|
|
+ <tiankong :question="activeSt" :key="activeSt.stId"></tiankong>
|
|
|
+ </template>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="kaoshi-bottom-box">
|
|
|
+ <button class="phone-green-btn bj-btn" hover-class="none" type="default" size="mini" @click="handleBiaoji">标记</button>
|
|
|
+ <view @click="showAnswerCard" class="shiti-num-box">
|
|
|
+ <icon class="shiti-num-icon"></icon>
|
|
|
+ <text class="active-num">{{activeSt ? activeSt.onlyNum: 0}}</text>/<text>{{data.StListForSearch.length}}</text>
|
|
|
+ </view>
|
|
|
+ <button class="phone-white-btn jx-btn" hover-class="none" type="default" size="mini" @click="handleCheckJiexi">解析</button>
|
|
|
+ </view>
|
|
|
+ <template v-if="activeSt">
|
|
|
+ <button type="default" size="mini" hover-class="none" class="phone-green-btn ks-btn-prev" @click="handlePrev" v-if="!isFistStId">上一题</button>
|
|
|
+ <button type="default" size="mini" hover-class="none"class="phone-green-btn ks-btn-next" @click="handleNext" v-if="!isLastStId">下一题</button>
|
|
|
+ <button type="default" size="mini" hover-class="none"class="phone-green-btn ks-btn-next" @click="handleBack" v-if="isLastStId">交卷</button>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <!-- 答题卡 -->
|
|
|
+ <uni-popup ref="popupRef" background-color="#fff" :is-mask-click="false" :mask-click="false">
|
|
|
+ <view class="answer-card-popup">
|
|
|
+ <view class="icon-title-bjcolor-navBar-box">
|
|
|
+ <view @click="handlePopupBack" class="nav-bar-icon"> </view>
|
|
|
+ <text class="nav-bar-title">答题卡</text>
|
|
|
+ </view>
|
|
|
+ <view class="answer-card-content" v-for="(paragraph,paragraphIndex) in questionData" :key="paragraphIndex">
|
|
|
+ <view class="paragraph-title">
|
|
|
+ {{paragraph.name}}
|
|
|
+ </view>
|
|
|
+ <view class="paragraph-qa" v-for="(qa,qaIndex) in paragraph.qas" :key="qaIndex"
|
|
|
+ :class="getQaClass(qa)" @click="answerCardItemClick(qa)">{{qa.onlyNum}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </uni-popup>
|
|
|
+ <!--
|
|
|
+ // 倒计时
|
|
|
+ <view v-if="!!data.endSecond">
|
|
|
+ <text>考试倒计时:</text>
|
|
|
+ <uni-countdown :show-day="false" :second="1000" @timeup="onTimeUp" :start="startCountDown"></uni-countdown>
|
|
|
+ </view>
|
|
|
+ -->
|
|
|
+ <!-- 答案解析 -->
|
|
|
+ <scoreAndAnswerVue ref="scoreAnswerRef"></scoreAndAnswerVue>
|
|
|
+ <scoreAndAnswerAdminTiankong ref="scoreAnswerTkRef"></scoreAndAnswerAdminTiankong>
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+ import {
|
|
|
+ ref,
|
|
|
+ reactive,
|
|
|
+ computed,
|
|
|
+ watch
|
|
|
+ } from "vue";
|
|
|
+ import {
|
|
|
+ onLoad
|
|
|
+ } from "@dcloudio/uni-app";
|
|
|
+ import * as ksApi from "@/api/kaoshi.js"
|
|
|
+ import danxuan from "@/components/questions/danxuan.vue";
|
|
|
+ import duoxuan from "@/components/questions/duoxuan.vue";
|
|
|
+ import tiankong from "@/components/questions/tiankong.vue";
|
|
|
+ import panduan from "@/components/questions/panduan.vue";
|
|
|
+ import scoreAndAnswerVue from "@/components/scoreAndAnswer/scoreAndAnswerAdmin.vue";
|
|
|
+ import {useQuestionTools} from "@/components/questions/useQuestionTools.js";
|
|
|
+ import scoreAndAnswerAdminTiankong from "@/components/scoreAndAnswer/scoreAndAnswerAdminTiankong.vue";
|
|
|
+ const {
|
|
|
+ checkDanxuanReply,
|
|
|
+ checkDuoxuanReply,
|
|
|
+ checkPanduanReply,
|
|
|
+ checkTiankongReply,
|
|
|
+ getLetterByIndex
|
|
|
+ } = useQuestionTools();
|
|
|
+
|
|
|
+ const stTypes = {
|
|
|
+ 1: '单选题',
|
|
|
+ 2: '多选题',
|
|
|
+ 3: '判断题',
|
|
|
+ 4: '填空题',
|
|
|
+ }
|
|
|
+
|
|
|
+ const popupRef = ref(null)
|
|
|
+ const scoreAnswerRef = ref(null)
|
|
|
+ const scoreAnswerTkRef = ref(null)
|
|
|
+
|
|
|
+ const startCountDown = ref(false);
|
|
|
+
|
|
|
+ const data = reactive({
|
|
|
+ ksId: null,
|
|
|
+ ksName: '',
|
|
|
+ stTotal: 0,
|
|
|
+ stScore: 0,
|
|
|
+ biaoji: null,
|
|
|
+ endSecond: 0,
|
|
|
+ pageSize: 0,
|
|
|
+ toggleScreenFlag: 0,
|
|
|
+ toggleScreenSecond: 0,
|
|
|
+ zhuapai: 0,
|
|
|
+ duanluo: [],
|
|
|
+ markDB: [],
|
|
|
+ StListForSearch: [],
|
|
|
+ })
|
|
|
+
|
|
|
+ const questionData = ref([]);
|
|
|
+
|
|
|
+ const progress = reactive({
|
|
|
+ dlIndex: 0,
|
|
|
+ dtIndex: 0
|
|
|
+ })
|
|
|
+
|
|
|
+ watch(() => data.duanluo, (newVal) => {
|
|
|
+ // 计算已答试题数量
|
|
|
+ }, {
|
|
|
+ deep: true
|
|
|
+ })
|
|
|
+
|
|
|
+ const activeSt = computed(() => {
|
|
|
+ if (questionData.value.length) {
|
|
|
+ return questionData.value.length && questionData.value[progress.dlIndex].qas[progress.dtIndex];
|
|
|
+ } else {
|
|
|
+ return null
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ const isFistStId = computed(() => {
|
|
|
+ if (data.StListForSearch.length) {
|
|
|
+ return data.StListForSearch[0].stId == activeSt.value.stId
|
|
|
+ } else {
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ });
|
|
|
+ const isLastStId = computed(() => {
|
|
|
+ if (data.StListForSearch.length) {
|
|
|
+ return data.StListForSearch[data.StListForSearch.length - 1].stId == activeSt.value.stId
|
|
|
+ } else {
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ onLoad((option) => {
|
|
|
+ data.ksId = option.ksId;
|
|
|
+ initKaoshi();
|
|
|
+ })
|
|
|
+
|
|
|
+ function getQaClass(qa) {
|
|
|
+ if (qa.marked && qa.marked === true) {
|
|
|
+ return 'paragraph-qa-block-mark';
|
|
|
+ } else {
|
|
|
+ if (qa.stTypeId == 1) {
|
|
|
+ if (checkDanxuanReply(qa)) {
|
|
|
+ return 'paragraph-qa-block-done';
|
|
|
+ } else {
|
|
|
+ return 'paragraph-qa-block-init';
|
|
|
+ }
|
|
|
+ } else if (qa.stTypeId == 2) {
|
|
|
+ if (checkDuoxuanReply(qa)) {
|
|
|
+ return 'paragraph-qa-block-done';
|
|
|
+ } else {
|
|
|
+ return 'paragraph-qa-block-init';
|
|
|
+ }
|
|
|
+ } else if (qa.stTypeId == 3) {
|
|
|
+ if (checkPanduanReply(qa)) {
|
|
|
+ return 'paragraph-qa-block-done';
|
|
|
+ } else {
|
|
|
+ return 'paragraph-qa-block-init';
|
|
|
+ }
|
|
|
+ } else if (qa.stTypeId == 4) {
|
|
|
+ if (checkTiankongReply(qa)) {
|
|
|
+ return 'paragraph-qa-block-done';
|
|
|
+ } else {
|
|
|
+ return 'paragraph-qa-block-init';
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ function skipQuestion(dlIndex, dtIndex) {
|
|
|
+ progress.dlIndex = dlIndex;
|
|
|
+ progress.dtIndex = dtIndex;
|
|
|
+ handlePopupBack()
|
|
|
+ }
|
|
|
+
|
|
|
+ function answerCardItemClick(qa) {
|
|
|
+ const actQa = data.StListForSearch.find(item => item.stId == qa.stId);
|
|
|
+ skipQuestion(actQa.dlIndex, actQa.dtIndex)
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ function handleBack() {
|
|
|
+ uni.redirectTo({
|
|
|
+ url: "/pages/admin/Kaoshi/list"
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ function onTimeUp() {
|
|
|
+ console.log('end')
|
|
|
+ }
|
|
|
+
|
|
|
+ function showAnswerCard() {
|
|
|
+ popupRef.value.open('bottom')
|
|
|
+ }
|
|
|
+
|
|
|
+ function handlePopupBack() {
|
|
|
+ popupRef.value.close()
|
|
|
+ }
|
|
|
+
|
|
|
+ function handlePrev() {
|
|
|
+ const qa = data.StListForSearch.find(item => item.stId == activeSt.value.stId);
|
|
|
+ const index = qa.num - 1;
|
|
|
+ if (index > 0) {
|
|
|
+ const result = data.StListForSearch[index - 1];
|
|
|
+ progress.dlIndex = result.dlIndex;
|
|
|
+ progress.dtIndex = result.dtIndex
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ function handleNext() {
|
|
|
+ const qa = data.StListForSearch.find(item => item.stId == activeSt.value.stId);
|
|
|
+ const index = qa.num - 1;
|
|
|
+ if (index < data.StListForSearch.length) {
|
|
|
+ const result = data.StListForSearch[index + 1];
|
|
|
+ progress.dlIndex = result.dlIndex;
|
|
|
+ progress.dtIndex = result.dtIndex
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ function formatDuanluoList(dlData) {
|
|
|
+ let uIndex = 0; // 试题num
|
|
|
+ let iDuanluo = 0; // 段落num
|
|
|
+ let result = [];
|
|
|
+ for (const duanluo of data.duanluo) {
|
|
|
+ let paragraph = {
|
|
|
+ qas: [],
|
|
|
+ };
|
|
|
+ paragraph.name = duanluo.name;
|
|
|
+
|
|
|
+ let iQa = 0; // 当前试题序号
|
|
|
+ let order = 0; // 当前题型中第几题
|
|
|
+ for (const iDanxuan of duanluo.danxuan) {
|
|
|
+ iDanxuan.type = 'danxuan';
|
|
|
+ iDanxuan.marked = false;
|
|
|
+ iDanxuan.onlyNum = uIndex + 1;
|
|
|
+ iDanxuan.order = order;
|
|
|
+ iDanxuan.iQa = iQa;
|
|
|
+ iDanxuan.reply = iDanxuan.result;
|
|
|
+ paragraph.qas.push(iDanxuan);
|
|
|
+ uIndex++;
|
|
|
+ order++;
|
|
|
+ iQa++;
|
|
|
+
|
|
|
+ data.StListForSearch.push({
|
|
|
+ stId: iDanxuan.stId,
|
|
|
+ paragraphName: paragraph.name,
|
|
|
+ dlIndex: iDuanluo,
|
|
|
+ dtIndex: iDanxuan.iQa,
|
|
|
+ num: iDanxuan.onlyNum
|
|
|
+ })
|
|
|
+ }
|
|
|
+ order = 0;
|
|
|
+ for (const iDuoxuan of duanluo.duoxuan) {
|
|
|
+ iDuoxuan.type = 'duoxuan';
|
|
|
+ iDuoxuan.marked = false;
|
|
|
+ iDuoxuan.onlyNum = uIndex + 1;
|
|
|
+ iDuoxuan.order = order;
|
|
|
+ paragraph.qas.push(iDuoxuan);
|
|
|
+ iDuoxuan.reply = iDuoxuan.result;
|
|
|
+ iDuoxuan.iQa = iQa;
|
|
|
+ uIndex++;
|
|
|
+ order++;
|
|
|
+ iQa++;
|
|
|
+
|
|
|
+ data.StListForSearch.push({
|
|
|
+ stId: iDuoxuan.stId,
|
|
|
+ paragraphName: paragraph.name,
|
|
|
+ dlIndex: iDuanluo,
|
|
|
+ dtIndex: iDuoxuan.iQa,
|
|
|
+ num: iDuoxuan.onlyNum
|
|
|
+ })
|
|
|
+ }
|
|
|
+ order = 0;
|
|
|
+ for (const iPanduan of duanluo.panduan) {
|
|
|
+ iPanduan.type = 'panduan';
|
|
|
+ iPanduan.marked = false;
|
|
|
+ iPanduan.onlyNum = uIndex + 1;
|
|
|
+ iPanduan.order = order;
|
|
|
+ paragraph.qas.push(iPanduan);
|
|
|
+ iPanduan.reply = iPanduan.result;
|
|
|
+ iPanduan.iQa = iQa;
|
|
|
+ uIndex++;
|
|
|
+ order++;
|
|
|
+ iQa++;
|
|
|
+
|
|
|
+ data.StListForSearch.push({
|
|
|
+ stId: iPanduan.stId,
|
|
|
+ paragraphName: paragraph.name,
|
|
|
+ dlIndex: iDuanluo,
|
|
|
+ dtIndex: iPanduan.iQa,
|
|
|
+ num: iPanduan.onlyNum
|
|
|
+ })
|
|
|
+ }
|
|
|
+ order = 0;
|
|
|
+ for (const iTiankong of duanluo.tiankong) {
|
|
|
+ iTiankong.type = 'tiankong';
|
|
|
+ iTiankong.marked = false;
|
|
|
+ iTiankong.onlyNum = uIndex + 1;
|
|
|
+ iTiankong.order = order;
|
|
|
+ paragraph.qas.push(iTiankong);
|
|
|
+ iTiankong.reply = iTiankong.result.map(item => item[0]);
|
|
|
+ iTiankong.iQa = iQa;
|
|
|
+ uIndex++;
|
|
|
+ order++;
|
|
|
+ iQa++;
|
|
|
+
|
|
|
+ data.StListForSearch.push({
|
|
|
+ stId: iTiankong.stId,
|
|
|
+ paragraphName: paragraph.name,
|
|
|
+ dlIndex: iDuanluo,
|
|
|
+ dtIndex: iTiankong.iQa,
|
|
|
+ num: iTiankong.onlyNum
|
|
|
+ })
|
|
|
+ }
|
|
|
+ iDuanluo++;
|
|
|
+ questionData.value.push(paragraph)
|
|
|
+
|
|
|
+ console.log(questionData.value)
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ function handleBiaoji() {
|
|
|
+ activeSt.value.marked = !activeSt.value.marked;
|
|
|
+ }
|
|
|
+
|
|
|
+ function handleCheckJiexi() {
|
|
|
+ const qa = activeSt.value ;
|
|
|
+ let score = qa.score;
|
|
|
+ let reply = '';
|
|
|
+ let result = '';
|
|
|
+ let answer = qa.answer;
|
|
|
+ if (qa.stTypeId == 1) {
|
|
|
+ // 单选题
|
|
|
+ if (qa.reply && qa.reply.trim() !== '') {
|
|
|
+ reply = getLetterByIndex(qa.reply)
|
|
|
+ } else {
|
|
|
+ reply = '未答'
|
|
|
+ }
|
|
|
+
|
|
|
+ if (qa.result) {
|
|
|
+ result = getLetterByIndex(qa.result)
|
|
|
+ } else {
|
|
|
+ result = '无答案'
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (qa.stTypeId == 2) {
|
|
|
+ // 多选题
|
|
|
+
|
|
|
+ if (qa.reply && qa.reply.length) {
|
|
|
+ reply = qa.reply.map(item => {
|
|
|
+ if (item.trim()) {
|
|
|
+ return getLetterByIndex(item.trim())
|
|
|
+ }
|
|
|
+ }).join(',')
|
|
|
+ } else {
|
|
|
+ reply = '未答'
|
|
|
+ }
|
|
|
+ if (qa.result) {
|
|
|
+ result = qa.result.map(item => {
|
|
|
+ if (item.trim()) {
|
|
|
+ return getLetterByIndex(item.trim())
|
|
|
+ }
|
|
|
+ }).join(',')
|
|
|
+ } else {
|
|
|
+ result = '无答案'
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (qa.stTypeId == 3) {
|
|
|
+ // 判断题
|
|
|
+ if (qa.reply == 0) {
|
|
|
+ reply = '错误'
|
|
|
+ }else if (qa.reply == 1) {
|
|
|
+ reply = '正确'
|
|
|
+ }
|
|
|
+ if (qa.result == 0) {
|
|
|
+ result = '错误'
|
|
|
+ }else if (qa.result == 1) {
|
|
|
+ result = '正确'
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (qa.stTypeId == 4) {
|
|
|
+ let reply = qa.reply || [];
|
|
|
+ let result =qa.result || [];
|
|
|
+ // 填空题
|
|
|
+ scoreAnswerTkRef.value.showPopup({score,reply,result,answer})
|
|
|
+ } else {
|
|
|
+ scoreAnswerRef.value.showPopup({
|
|
|
+ score,reply,result,answer
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ function initKaoshi() {
|
|
|
+ ksApi.getKaoshiInfo({
|
|
|
+ ksId: data.ksId
|
|
|
+ }).then(res => {
|
|
|
+ const {
|
|
|
+ ksId,
|
|
|
+ ksName,
|
|
|
+ stTotal,
|
|
|
+ stScore,
|
|
|
+ biaoji,
|
|
|
+ endSecond,
|
|
|
+ pageSize,
|
|
|
+ toggleScreenFlag,
|
|
|
+ toggleScreenSecond,
|
|
|
+ zhuapai,
|
|
|
+ duanluoList
|
|
|
+ } = res.data;
|
|
|
+ data.ksId = ksId;
|
|
|
+ data.ksName = ksName;
|
|
|
+ data.stTotal = stTotal;
|
|
|
+ data.stScore = stScore;
|
|
|
+ data.biaoji = biaoji;
|
|
|
+ data.endSecond = endSecond;
|
|
|
+ data.pageSize = pageSize;
|
|
|
+ data.toggleScreenFlag = toggleScreenFlag;
|
|
|
+ data.toggleScreenSecond = toggleScreenSecond;
|
|
|
+ data.zhuapai = zhuapai;
|
|
|
+ data.duanluo = duanluoList;
|
|
|
+ formatDuanluoList(data.duanluo);
|
|
|
+ uni.setNavigationBarTitle({
|
|
|
+ title: data.ksName
|
|
|
+ });
|
|
|
+ startCountDown.value = true;
|
|
|
+ })
|
|
|
+ }
|
|
|
+</script>
|
wangxy