|
|
@@ -5,214 +5,112 @@
|
|
|
background-color="#000"
|
|
|
:opacity="opacity">
|
|
|
<template slot="default">
|
|
|
- <svg-icon icon-class="ies5logo2" class="loader-icon" />
|
|
|
- <span class="aclassoneloading">Student</span>
|
|
|
+ <svg-icon icon-class="loader" class="loader-icon" />
|
|
|
+ <div class="aclassoneloading">Loading...</div>
|
|
|
</template>
|
|
|
</loading>
|
|
|
-
|
|
|
<div v-if="WarmMessageisOpen" class="warmMessage">
|
|
|
- <div class="messageCard animate__animated animate__fadeInDown">
|
|
|
+ <div class="messageCard">
|
|
|
<!---中途離開測驗之提示框---->
|
|
|
<div class="messageCardContent1" v-if="showMessageNum == 1">
|
|
|
- <h3>{{ $t("studentWeb.exam.testpop.exitQuizhint") }}</h3>
|
|
|
+ <h3>離開測驗提示</h3>
|
|
|
<svg-icon icon-class="logoutComfirm" class="logoutComfirmIcon" />
|
|
|
<p>
|
|
|
- {{ $t("studentWeb.exam.testpop.exitQuizhintDes") }}
|
|
|
+ 系統檢測您尚未「交卷」，如您選擇「確定」，
|
|
|
+ <br />則目前作答將不保存，下次需重新測驗。
|
|
|
</p>
|
|
|
- <button class="messageCardBtn" @click="closeWarmMessage()">
|
|
|
- {{ $t("studentWeb.exam.testpop.cancel") }}
|
|
|
- </button>
|
|
|
- <button class="messageCardBtn" @click="closetest()">
|
|
|
- {{ $t("studentWeb.exam.testpop.ok") }}
|
|
|
- </button>
|
|
|
+ <button class="messageCardBtn" @click="closeWarmMessage()">取消</button>
|
|
|
+ <button class="messageCardBtn" @click="closetest()">確定</button>
|
|
|
</div>
|
|
|
<!---每題都完成到最後一題交卷之提示框---->
|
|
|
<div class="messageCardContent2" v-if="showMessageNum == 2">
|
|
|
- <h3>{{ $t("studentWeb.exam.testpop.submitQuizhint") }}</h3>
|
|
|
+ <h3>交卷提示</h3>
|
|
|
<svg-icon icon-class="finshedTest" class="handOnImg" />
|
|
|
|
|
|
- <p>{{ $t("studentWeb.exam.testpop.submitQuizhintDes1") }}</p>
|
|
|
- <button class="messageCardBtn" @click="closeWarmMessage()">
|
|
|
- {{ $t("studentWeb.exam.testpop.check") }}
|
|
|
- </button>
|
|
|
- <button class="messageCardBtn" @click="closetest()">
|
|
|
- {{ $t("studentWeb.exam.testpop.okSubmit") }}
|
|
|
- </button>
|
|
|
+ <p>系統檢測目前您已全數作答完成，確定交卷嗎？</p>
|
|
|
+ <button class="messageCardBtn" @click="closeWarmMessage()">否，需再檢查</button>
|
|
|
+ <button class="messageCardBtn" @click="closetest()">確定交卷</button>
|
|
|
</div>
|
|
|
<!---有題目沒完成就交卷之提示框---->
|
|
|
<div class="messageCardContent3" v-if="showMessageNum == 3">
|
|
|
- <h3>{{ $t("studentWeb.exam.testpop.submitQuizhint") }}</h3>
|
|
|
+ <h3>交卷提示</h3>
|
|
|
<svg-icon icon-class="unfinishedTest" class="handOnImg" />
|
|
|
- <p v-if="this.$store.getters.getCurrentLaguage == 'tw'">
|
|
|
+ <p>
|
|
|
目前您有
|
|
|
- <span style="color: rgb(250, 100, 0); font-weight: 900">{{ undo }}題 未作答 (詳如答案卡)</span>，確定交卷嗎？
|
|
|
- </p>
|
|
|
- <p v-if="this.$store.getters.getCurrentLaguage == 'en'">
|
|
|
- Currently you have
|
|
|
- <span style="color: rgb(250, 100, 0); font-weight: 900"> {{ undo }} unanswered questions ( Detailed as answer sheet )
|
|
|
- </span>, are you sure to submmit ?
|
|
|
+ <span style="color:rgb(250, 100, 0);font-weight:900">{{ undo }}題 未作答 (詳如答案卡)</span>，確定交卷嗎？
|
|
|
</p>
|
|
|
- <button class="messageCardBtn" @click="closeWarmMessage()">
|
|
|
- {{ $t("studentWeb.exam.testpop.check") }}
|
|
|
- </button>
|
|
|
- <button class="messageCardBtn" @click="closetest()">
|
|
|
- {{ $t("studentWeb.exam.testpop.okSubmit") }}
|
|
|
- </button>
|
|
|
+ <button class="messageCardBtn" @click="closeWarmMessage()">否，需再檢查</button>
|
|
|
+ <button class="messageCardBtn" @click="closetest()">確定交卷</button>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
<div class="testTitle">
|
|
|
- <span class="logoutIcon"
|
|
|
- @click="openWarmMessage(1)">
|
|
|
- <svg-icon icon-class="logout" />
|
|
|
- </span>
|
|
|
- <span class="logoutIcon"
|
|
|
- @click="closetest()"
|
|
|
- v-if="this.$store.getters.getItemTitle.isDone == true">
|
|
|
+ <span class="logoutIcon" @click="openWarmMessage(1)">
|
|
|
<svg-icon icon-class="logout" />
|
|
|
</span>
|
|
|
- <span class="testTitleText">
|
|
|
- {{ $t("studentWeb.exam.testpop.title") }}
|
|
|
- <span class="testTitleTextContent">：{{ this.$store.getters.getItemTitle.name }}</span>
|
|
|
- </span>
|
|
|
- <span class="practice-mode"
|
|
|
- v-if="this.$store.getters.getItemTitle.isDone == true">
|
|
|
- {{ $t("studentWeb.exam.testpop.practiceMode") }}
|
|
|
- </span>
|
|
|
-
|
|
|
+ <span class="testTitleText">評量：{{ $store.getters.getItemTitle.name }}</span>
|
|
|
<div class="myProgressBar">
|
|
|
- <span class="myTestProgresstitle"
|
|
|
- :class="{
|
|
|
- myTestProgresstitleEn:
|
|
|
- this.$store.getters.getCurrentLaguage == 'en',
|
|
|
- }">{{ $t("studentWeb.exam.testpop.completion") }}</span>
|
|
|
- <div class="myTestProgressContent"
|
|
|
- :style="{ width: (10 - undo) * 10 + '%' }"></div>
|
|
|
- <div class="myTestProgress"></div>
|
|
|
+ <span class="myTestProgresstitle">完成度</span>
|
|
|
+ <Progress style="margin-top:15px" :percent="Math.ceil((($store.getters.getPaperInfo.item.length - undo)/$store.getters.getPaperInfo.item.length)*100)" />
|
|
|
+ <!-- <span class="myTestProgressNum">{{ ($store.getters.getPaperInfo.item.length - undo)/$store.getters.getPaperInfo.item.length * 100 + " % " }}</span>
|
|
|
+ <div class="myTestProgressContent" :style="{ width: Math.ceil((($store.getters.getPaperInfo.item.length - undo)/$store.getters.getPaperInfo.item.length)*100) + '%' }"></div>
|
|
|
+ <div class="myTestProgress"></div> -->
|
|
|
</div>
|
|
|
- <!--下拉選單-->
|
|
|
-
|
|
|
|
|
|
-
|
|
|
- <Dropdown v-if="this.$store.getters.getItemTitle.isDone == true"
|
|
|
- class="ques-filter">
|
|
|
- <a href="javascript:void(0)"
|
|
|
- class="filter-text"
|
|
|
- :class="{ 'filter-only':currentFilterQuestion == 'wrong' || currentFilterQuestion == 'noAns', }">
|
|
|
- <span v-if="currentFilterQuestion == 'all'">
|
|
|
- {{ $t("studentWeb.exam.testpop.all") }}
|
|
|
- </span>
|
|
|
- <span v-if="currentFilterQuestion == 'wrong'">{{ $t("studentWeb.exam.testpop.onlywrong") }}</span>
|
|
|
- {{ $t("studentWeb.exam.testpop.questions") }}
|
|
|
- <Icon type="ios-arrow-down"></Icon>
|
|
|
- </a>
|
|
|
- <DropdownMenu slot="list">
|
|
|
- <div @click="filterQuestion('all')">
|
|
|
- <DropdownItem>
|
|
|
- {{ $t("studentWeb.exam.testpop.all") }}
|
|
|
- {{ $t("studentWeb.exam.testpop.questions") }}
|
|
|
- </DropdownItem>
|
|
|
- </div>
|
|
|
- <div @click="filterQuestion('wrong')">
|
|
|
- <DropdownItem>
|
|
|
- {{ $t("studentWeb.exam.testpop.onlywrong") }}
|
|
|
- {{ $t("studentWeb.exam.testpop.questions") }}
|
|
|
- </DropdownItem>
|
|
|
- </div>
|
|
|
- </DropdownMenu>
|
|
|
- </Dropdown>
|
|
|
- <button class="submitBtn"
|
|
|
- @click="openWarmMessage(2)"
|
|
|
- :class="{ hintClick: hintHandon() }">
|
|
|
- {{ $t("studentWeb.exam.testpop.submitted") }}
|
|
|
- </button>
|
|
|
- <!--<button
|
|
|
- v-if="this.$store.getters.getItemTitle.isDone == true"
|
|
|
- class="submitBtn"
|
|
|
- @click="showAns()"
|
|
|
- >
|
|
|
- <span v-if="showtheAnsTable == false">{{ $t("studentWeb.exam.testpop.showAns")}}</span>
|
|
|
- <span v-if="showtheAnsTable == true">{{ $t("studentWeb.exam.testpop.hideAns")}}</span>
|
|
|
- </button>-->
|
|
|
+ <button class="submitBtn" @click="openWarmMessage(2)" :class="{ hintClick: hintHandon() }">交卷</button>
|
|
|
</div>
|
|
|
-
|
|
|
<Row :gutter="30">
|
|
|
<i-col class="questionArea"
|
|
|
:xs="24"
|
|
|
:sm="24"
|
|
|
- :md="24"
|
|
|
- :lg="getQuestionData(currentQuestionNo).qType != '填充' ? 17 : 24">
|
|
|
+ :md="12"
|
|
|
+ :lg="getQuestionData(currentQuestionNo).type == 'compose' ? 17 : 24">
|
|
|
<div class="questionContent">
|
|
|
- <div class="hintwrap">
|
|
|
- <span class="hintIcon">
|
|
|
- <svg-icon icon-class="hint" />
|
|
|
- </span>
|
|
|
- </div>
|
|
|
- <div class="hint-content animate__animated animate__pulse">
|
|
|
- <div class="triangle"></div>
|
|
|
- <ul class="hint-content-list">
|
|
|
- <p>{{ $t("studentWeb.exam.testpop.hint") }}</p>
|
|
|
- <li class="hint-list-item"
|
|
|
- v-if="getQuestionData(currentQuestionNo).point.length > 0"
|
|
|
- v-for="(item, index) in getQuestionData(currentQuestionNo).point"
|
|
|
- :key="index">
|
|
|
- {{ item.value }}
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- </div>
|
|
|
- <div class="questionType">
|
|
|
- {{ getTestType(getQuestionData(currentQuestionNo).type)}}
|
|
|
- </div>
|
|
|
- <!--//题目渲染-->
|
|
|
+ <span class="hintwrap">
|
|
|
+ <Tooltip :content="'提示'" theme="light" placement="left">
|
|
|
+ <span class="hintIcon">
|
|
|
+ <svg-icon icon-class="hint" />
|
|
|
+ </span>
|
|
|
+ </Tooltip>
|
|
|
+ </span>
|
|
|
+
|
|
|
+ <div class="questionType">{{ getTestType(getQuestionData(currentQuestionNo).type)}}</div>
|
|
|
+
|
|
|
<div class="questioDes">
|
|
|
<div style="display:flex">
|
|
|
<span>{{ currentQuestionNo +1 }}.</span>
|
|
|
- <div v-html="getQuestionData(currentQuestionNo).question"></div>
|
|
|
+ <div v-html="getQuestionData(currentQuestionNo).question"></div>
|
|
|
</div>
|
|
|
<!--填充題輸入匡-->
|
|
|
- <input v-if="getQuestionData(currentQuestionNo).qType == '填充'"
|
|
|
+ <input v-if="getQuestionData(currentQuestionNo).type == 'compose'"
|
|
|
type="text"
|
|
|
v-model="checkers[currentQuestionNo][0]"
|
|
|
required
|
|
|
minlength="3"
|
|
|
maxlength="5" />
|
|
|
|
|
|
- <input v-if="getQuestionData(currentQuestionNo).qType == '填充'"
|
|
|
+ <input v-if="getQuestionData(currentQuestionNo).type == 'compose'"
|
|
|
type="text"
|
|
|
v-model="checkers[currentQuestionNo][1]"
|
|
|
required
|
|
|
minlength="3"
|
|
|
maxlength="5" />
|
|
|
|
|
|
- <input v-if="getQuestionData(currentQuestionNo).qType == '填充'"
|
|
|
+ <input v-if="getQuestionData(currentQuestionNo).type == 'compose'"
|
|
|
type="text"
|
|
|
v-model="checkers[currentQuestionNo][2]"
|
|
|
required
|
|
|
minlength="3"
|
|
|
maxlength="5" />
|
|
|
</div>
|
|
|
- <br />
|
|
|
- <!--<img class="questionDesImg"
|
|
|
- :src="getQuestionData(currentQuestionNo).qImg1"
|
|
|
- alt />
|
|
|
- <img class="questionDesImg"
|
|
|
- :src="getQuestionData(currentQuestionNo).qImg2"
|
|
|
- alt />-->
|
|
|
- <br />
|
|
|
-
|
|
|
-
|
|
|
|
|
|
- <!--答案卡-->
|
|
|
<div class="md-ansSheetGroup">
|
|
|
<h4>{{ $t("studentWeb.exam.testpop.myAnswerSheet") }}</h4>
|
|
|
<table class="ansSheet">
|
|
|
<tr>
|
|
|
<th class="rightAnstitle">{{ $t("studentWeb.exam.testpop.qNo") }}</th>
|
|
|
- <th v-for="(item,index) in paperData.stuAns"
|
|
|
+ <th v-for="(item,index) in checkers.length"
|
|
|
:key="index"
|
|
|
class="ansSheetQno"
|
|
|
@click="gototheQues(index)">
|
|
|
@@ -221,7 +119,7 @@
|
|
|
</tr>
|
|
|
<tr>
|
|
|
<td class="anstext">{{ $t("studentWeb.exam.testpop.myAns") }}</td>
|
|
|
- <td v-for="(item, index) in paperData.stuAns"
|
|
|
+ <td v-for="(item, index) in checkers"
|
|
|
:key="index">
|
|
|
<div v-if="item == ''">
|
|
|
<br />
|
|
|
@@ -235,8 +133,7 @@
|
|
|
</div>
|
|
|
<div class="anstext"
|
|
|
v-if="item.length >= 0 && Array.isArray(item)"
|
|
|
- :class="{'wrong-ans':
|
|
|
- showtheAnsTable == true && item.toString() != 'A,B,C'}">
|
|
|
+ :class="{'wrong-ans':showtheAnsTable == true && item.toString() != 'A,B,C'}">
|
|
|
<span v-for="(sub, index) in item" :key="index">
|
|
|
{{ sub }}
|
|
|
<span v-if="index + 1 != item.length">,</span>
|
|
|
@@ -244,361 +141,199 @@
|
|
|
</div>
|
|
|
</td>
|
|
|
</tr>
|
|
|
- <tr v-if="showtheAnsTable == true">
|
|
|
- <td class="rightAnstitle">
|
|
|
- {{ $t("studentWeb.exam.testpop.correction") }}
|
|
|
- </td>
|
|
|
- <td v-for="index in 10"
|
|
|
- v-show="
|
|
|
- currentFilterQuestion == 'wrong'
|
|
|
- ? wrongAnsQno.includes(index + 1) == true
|
|
|
- : true
|
|
|
- "
|
|
|
- :key="index"
|
|
|
- class="rightAnstext">
|
|
|
- A, B, C
|
|
|
- </td>
|
|
|
- </tr>
|
|
|
+
|
|
|
</table>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!--切換頁-->
|
|
|
- <div class="pageCtl2"
|
|
|
- v-if="getQuestionData(currentQuestionNo).qType == '填充'">
|
|
|
- <button @click="preQ()"
|
|
|
- v-if="
|
|
|
- (currentFilterQuestion == 'all' && currentQuestionNo != 0) ||
|
|
|
- (currentFilterQuestion == 'wrong' && currentQuestionNo != 1)
|
|
|
- ">
|
|
|
- <Icon type="ios-arrow-back" />{{$t("studentWeb.exam.testpop.previous")}}
|
|
|
+ <div class="pageCtl2" v-if="getQuestionData(currentQuestionNo).type == 'compose'">
|
|
|
+ <button @click="preQ()" v-if="currentQuestionNo != 0">
|
|
|
+ <Icon type="ios-arrow-back" />上一題
|
|
|
</button>
|
|
|
<!--span>第{{currentQuestionNo+1}}題</span-->
|
|
|
<!--span>{{ this.$store.getters.getCurrentPhase+1 }}/3</span-->
|
|
|
<button @click="nextQ()"
|
|
|
- v-if="
|
|
|
- (currentFilterQuestion == 'all' && currentQuestionNo != 9) ||
|
|
|
- (currentFilterQuestion == 'wrong' && currentQuestionNo != 7)
|
|
|
- "
|
|
|
- :class="{
|
|
|
- hintClick:
|
|
|
- currentQuestionNo != 9 && checkers[currentQuestionNo] != '',
|
|
|
- }">
|
|
|
- {{ $t("studentWeb.exam.testpop.next") }}
|
|
|
+ v-if="currentQuestionNo != ($store.getters.getPaperInfo.item.length-1)"
|
|
|
+ :class="{ hintClick: currentQuestionNo != ($store.getters.getPaperInfo.item.length-1) && checkers[currentQuestionNo] != '', }">
|
|
|
+ 下一題
|
|
|
<Icon type="ios-arrow-forward" />
|
|
|
</button>
|
|
|
</div>
|
|
|
</div>
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- <!--答案卡-->
|
|
|
- <!--<div style="margin-top: 10%"
|
|
|
- class="sm-ansSheetGroup"
|
|
|
- v-if="getQuestionData(currentQuestionNo).qType == '填充'">
|
|
|
- <h4>{{ $t("studentWeb.exam.testpop.myAnswerSheet") }}</h4>
|
|
|
- <table class="ansSheet">
|
|
|
- <tr>
|
|
|
- <th v-for="index in checkers.length"
|
|
|
- :key="index"
|
|
|
- @click="gototheQues(index)">
|
|
|
- {{ index }}
|
|
|
- </th>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td v-for="(item, index) in checkers" :key="index">
|
|
|
- <div v-if="item == ''">
|
|
|
- <br />
|
|
|
- </div>
|
|
|
- <div class="anstext" v-if="item != '' && !Array.isArray(item)">
|
|
|
- {{ item }}
|
|
|
- </div>
|
|
|
- <div class="anstext"
|
|
|
- v-if=" Array.isArray(item)">
|
|
|
- <span v-for="(sub, index) in item" :key="index">
|
|
|
- {{ sub }}
|
|
|
- <span v-if="index + 1 != item.length">,</span>
|
|
|
- </span>
|
|
|
- </div>
|
|
|
- </td>
|
|
|
- </tr>
|
|
|
- <tr v-if="showtheAnsTable == true">
|
|
|
- <td v-for="index in 10"
|
|
|
- v-show="
|
|
|
- currentFilterQuestion == 'wrong'
|
|
|
- ? wrongAnsQno.includes(index + 1) == true
|
|
|
- : true
|
|
|
- "
|
|
|
- :key="index"
|
|
|
- class="rightAnstext">
|
|
|
- A, B, C
|
|
|
- </td>
|
|
|
- </tr>
|
|
|
- </table>
|
|
|
- </div>-->
|
|
|
</i-col>
|
|
|
<i-col class="ansArea"
|
|
|
:xs="24"
|
|
|
:sm="24"
|
|
|
- :md="24"
|
|
|
- :lg="7">
|
|
|
+ :md="12"
|
|
|
+ :lg="7"
|
|
|
+ v-if="getQuestionData(currentQuestionNo).type != 'compose'">
|
|
|
<div class="checkAnswer">
|
|
|
- <div class="questionNo">
|
|
|
- 第{{ currentQuestionNo + 1 }}題 我的答案是：
|
|
|
- </div>
|
|
|
- <!--<div class="questionNo"
|
|
|
- v-if="this.$store.getters.getCurrentLaguage == 'en'">
|
|
|
- No.{{ currentQuestionNo + 1 }} My Answeris：
|
|
|
- </div>-->
|
|
|
- <!--<div v-if="getQuestionData(currentQuestionNo).qType == '判斷'"
|
|
|
- align="center">
|
|
|
+ <div class="questionNo">第{{ currentQuestionNo + 1 }}題 我的答案是：</div>
|
|
|
+ <div v-if="getQuestionData(currentQuestionNo).type == 'judge'" align="center">
|
|
|
<label class="testBtn yesNoBtn">
|
|
|
- <input type="radio"
|
|
|
- value="Ｏ"
|
|
|
- v-model="checkers[currentQuestionNo]" />
|
|
|
+ <input type="radio" value="Ｏ" v-model="checkers[currentQuestionNo]" />
|
|
|
<div class="testbg">○</div>
|
|
|
</label>
|
|
|
<label class="testBtn yesNoBtn">
|
|
|
- <input type="radio"
|
|
|
- value="X"
|
|
|
- v-model="checkers[currentQuestionNo]" />
|
|
|
+ <input type="radio" value="X" v-model="checkers[currentQuestionNo]" />
|
|
|
<div class="testbg">
|
|
|
<Icon type="md-close" />
|
|
|
</div>
|
|
|
</label>
|
|
|
<br />
|
|
|
- </div>-->
|
|
|
-
|
|
|
- <div v-if="getQuestionData(currentQuestionNo).type == 'single'">
|
|
|
- <label class="testBtn"
|
|
|
- v-for="(item, index) in getQuestionData(currentQuestionNo).option"
|
|
|
- :key="index">
|
|
|
- <input :type="qtypeOption(currentQuestionNo)"
|
|
|
- :value="paperData.stuAns[currentQuestionNo]"
|
|
|
- v-model="checkers[currentQuestionNo]"
|
|
|
- @click="getAns(currentQuestionNo,index)"
|
|
|
- />
|
|
|
- <div class="testbg">
|
|
|
- <Row :gutter="10">
|
|
|
- <i-col :xs="8" :sm="8" :md="8" :lg="8">
|
|
|
- </i-col>
|
|
|
- <i-col :xs="16" :sm="16" :md="16" :lg="16">
|
|
|
- <p class="testtext">
|
|
|
- <div style="display:flex">
|
|
|
- <span>{{ item.code }}.</span>
|
|
|
- <div style="margin-left:10px;" v-html="item.value"></div>
|
|
|
- </div>
|
|
|
- </p>
|
|
|
- </i-col>
|
|
|
- </Row>
|
|
|
- <div style="clear: both"></div>
|
|
|
- </div>
|
|
|
- </label>
|
|
|
- <div></div>
|
|
|
</div>
|
|
|
|
|
|
+ <!-- <div
|
|
|
+ v-if="
|
|
|
+ getQuestionData(currentQuestionNo).haveImgAns == false &&
|
|
|
+ getQuestionData(currentQuestionNo).qType != '判斷'
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <label
|
|
|
+ class="testBtn"
|
|
|
+ v-for="(item, index) in getQuestionData(currentQuestionNo)
|
|
|
+ .ansDesc"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
+ <input
|
|
|
+ :type="qtypeOption(currentQuestionNo)"
|
|
|
+ :value="getQuestionData(currentQuestionNo).ansOptions[index]"
|
|
|
+ v-model="checkers[currentQuestionNo]"
|
|
|
+ />
|
|
|
+ <div class="testbg">
|
|
|
+ {{ getQuestionData(currentQuestionNo).ansOptions[index] }}.{{
|
|
|
+ item
|
|
|
+ }}
|
|
|
+ </div>
|
|
|
+ </label>
|
|
|
+ </div> -->
|
|
|
|
|
|
- <div v-if="getQuestionData(currentQuestionNo).type == 'multiple'">
|
|
|
+ <div v-if=" getQuestionData(currentQuestionNo).qType != 'judge' ">
|
|
|
<label class="testBtn"
|
|
|
v-for="(item, index) in getQuestionData(currentQuestionNo).option"
|
|
|
:key="index">
|
|
|
<input :type="qtypeOption(currentQuestionNo)"
|
|
|
- :value="paperData.stuAns[currentQuestionNo]"
|
|
|
- v-model="checkers[currentQuestionNo]"
|
|
|
- @click="getAns(currentQuestionNo,index)"
|
|
|
- />
|
|
|
+ :value="getQuestionData(currentQuestionNo).option[index].code"
|
|
|
+ v-model="checkers[currentQuestionNo]" />
|
|
|
<div class="testbg">
|
|
|
<Row :gutter="10">
|
|
|
<i-col :xs="8" :sm="8" :md="8" :lg="8">
|
|
|
+ <!-- <Img
|
|
|
+ class="testbgImg"
|
|
|
+ :src="getQuestionData(currentQuestionNo).qImg1 + [index]"
|
|
|
+ /> -->
|
|
|
</i-col>
|
|
|
<i-col :xs="16" :sm="16" :md="16" :lg="16">
|
|
|
- <p class="testtext">
|
|
|
+ <p class="testtext" >
|
|
|
<div style="display:flex">
|
|
|
- <span>{{ item.code }}.</span>
|
|
|
- <div style="margin-left:10px;" v-html="item.value"></div>
|
|
|
+ <span>{{ getQuestionData(currentQuestionNo).option[index].code }}.</span>
|
|
|
+ <div v-html="item.value"></div>
|
|
|
</div>
|
|
|
+
|
|
|
</p>
|
|
|
</i-col>
|
|
|
</Row>
|
|
|
- <div style="clear: both"></div>
|
|
|
+
|
|
|
+ <div style="clear:both"></div>
|
|
|
</div>
|
|
|
</label>
|
|
|
+
|
|
|
<div></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<!--切換頁-->
|
|
|
<div class="pageCtl2">
|
|
|
- <button @click="preQ()"
|
|
|
- v-if="
|
|
|
- (currentFilterQuestion == 'all' && currentQuestionNo != 0) ||
|
|
|
- (currentFilterQuestion == 'wrong' && currentQuestionNo != 1)
|
|
|
- ">
|
|
|
- <Icon type="ios-arrow-back" />
|
|
|
- {{ $t("studentWeb.exam.testpop.previous") }}
|
|
|
+ <button @click="preQ()" v-if="currentQuestionNo != 0">
|
|
|
+ <Icon type="ios-arrow-back" />上一題
|
|
|
</button>
|
|
|
<!--span>第{{currentQuestionNo+1}}題</span-->
|
|
|
<!--span>{{ this.$store.getters.getCurrentPhase+1 }}/3</span-->
|
|
|
<button @click="nextQ()"
|
|
|
- v-if="
|
|
|
- (currentFilterQuestion == 'all' && currentQuestionNo != 9) ||
|
|
|
- (currentFilterQuestion == 'wrong' && currentQuestionNo != 7)
|
|
|
- "
|
|
|
- :class="{
|
|
|
- hintClick:
|
|
|
- currentQuestionNo != 9 && checkers[currentQuestionNo] != '',
|
|
|
- }">
|
|
|
- {{ $t("studentWeb.exam.testpop.next") }}
|
|
|
+ v-if="currentQuestionNo != ($store.getters.getPaperInfo.item.length-1)"
|
|
|
+ :class="{ hintClick:currentQuestionNo != ($store.getters.getPaperInfo.item.length-1) && checkers[currentQuestionNo] != ''}">
|
|
|
+ 下一題
|
|
|
<Icon type="ios-arrow-forward" />
|
|
|
</button>
|
|
|
</div>
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- <!--答案卡-->
|
|
|
- <!--<div style="margin-top: 10%" class="sm-ansSheetGroup">
|
|
|
- <h4>{{ $t("studentWeb.exam.testpop.myAnswerSheet") }}</h4>
|
|
|
- <table class="ansSheet">
|
|
|
- <tr>
|
|
|
- <th v-for="index in checkers.length"
|
|
|
- :key="index"
|
|
|
- @click="gototheQues(index)">
|
|
|
- {{ index }}
|
|
|
- </th>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td v-for="(item, index) in checkers" :key="index">
|
|
|
- <div v-if="item == ''">
|
|
|
- <br />
|
|
|
- </div>
|
|
|
- <div class="anstext" v-if="item != '' && !Array.isArray(item)">
|
|
|
- {{ item }}
|
|
|
- </div>
|
|
|
- <div class="anstext"
|
|
|
- v-if="item.length >= 0 && Array.isArray(item)">
|
|
|
- <span v-for="(sub, index) in item" :key="index">
|
|
|
- {{ sub }}
|
|
|
- <span v-if="index + 1 != item.length">,</span>
|
|
|
- </span>
|
|
|
- </div>
|
|
|
- </td>
|
|
|
- </tr>
|
|
|
- <tr v-if="showtheAnsTable == true">
|
|
|
- <td v-for="index in 10"
|
|
|
- v-show="
|
|
|
- currentFilterQuestion == 'wrong'
|
|
|
- ? wrongAnsQno.includes(index + 1) == true
|
|
|
- : true
|
|
|
- "
|
|
|
- :key="index"
|
|
|
- class="rightAnstext">
|
|
|
- A, B, C
|
|
|
- </td>
|
|
|
- </tr>
|
|
|
- </table>
|
|
|
- </div>-->
|
|
|
</i-col>
|
|
|
</Row>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- import { Random } from "mockjs";
|
|
|
import Loading from "vue-loading-overlay";
|
|
|
import "vue-loading-overlay/dist/vue-loading.css";
|
|
|
-
|
|
|
export default {
|
|
|
name: "LessonTestPop",
|
|
|
components: {
|
|
|
Loading,
|
|
|
},
|
|
|
created() {
|
|
|
- //for (var i = 0; i < 10; i++) {
|
|
|
- // this.checkers == this.checkers.push([]);
|
|
|
- //}
|
|
|
- //this.WarmMessageisOpen = true;
|
|
|
- //this.showMessageNum = 0;
|
|
|
+ console.log(this.$store.getters.getPaperInfo.item.length)
|
|
|
this.getPaper()
|
|
|
+ this.WarmMessageisOpen = false;
|
|
|
+ this.showMessageNum = 0;
|
|
|
+ },
|
|
|
+ props: {
|
|
|
+ papers: {
|
|
|
+ type: Object,
|
|
|
+ default:()=> {
|
|
|
+ return {}
|
|
|
+ }
|
|
|
+ }
|
|
|
},
|
|
|
-
|
|
|
data() {
|
|
|
return {
|
|
|
//loading畫面
|
|
|
- wrongAnsQno: [2, 5, 7, 8],
|
|
|
ishideHint: false,
|
|
|
isLoading: false,
|
|
|
fullPage: true,
|
|
|
opacity: 0.6,
|
|
|
//loading畫面
|
|
|
showMessageNum: 0,
|
|
|
+ showtheAnsTable: false,
|
|
|
WarmMessageisOpen: false,
|
|
|
checkers: [],
|
|
|
currentQuestionNo: 0,
|
|
|
undo: 0,
|
|
|
- currentFilterQuestion: "all",
|
|
|
- showtheAnsTable: false,
|
|
|
- paperInfo: {},
|
|
|
paperData: {},
|
|
|
testType: [
|
|
|
{
|
|
|
label: "单选题",
|
|
|
- value:"single"
|
|
|
+ value: "single"
|
|
|
},
|
|
|
{
|
|
|
label: "多选题",
|
|
|
- value:"multiple"
|
|
|
+ value: "multiple"
|
|
|
},
|
|
|
{
|
|
|
label: "判断题",
|
|
|
- value:"judge"
|
|
|
+ value: "judge"
|
|
|
},
|
|
|
{
|
|
|
label: "填空题",
|
|
|
- value:"complete"
|
|
|
+ value: "complete"
|
|
|
},
|
|
|
{
|
|
|
label: "问答题",
|
|
|
- value:"subjective"
|
|
|
+ value: "subjective"
|
|
|
},
|
|
|
{
|
|
|
label: "综合题",
|
|
|
- value:"compose"
|
|
|
+ value: "compose"
|
|
|
},
|
|
|
]
|
|
|
+
|
|
|
};
|
|
|
},
|
|
|
methods: {
|
|
|
- async getPaper() {
|
|
|
+ getPaper() {
|
|
|
let paper = this.$store.getters.getCurrentSubject
|
|
|
- this.paperData = {}
|
|
|
- this.paperInfo = {}
|
|
|
- if (paper.blob !== undefined && paper.blob !== "") {
|
|
|
- this.paperData = paper
|
|
|
- let key = paper.code.split('-')
|
|
|
- let code = {
|
|
|
- scope: paper.scope,
|
|
|
- code: key[(key.length - 1)],
|
|
|
- blob: paper.blob
|
|
|
- }
|
|
|
- this.paperInfo = await this.$evTools.getStuPaper(code)
|
|
|
- for (var i = 0; i < this.paperInfo.item.length; i++) {
|
|
|
- this.checkers == this.checkers.push([]);
|
|
|
- }
|
|
|
- console.log(this.paperInfo)
|
|
|
- console.log(this.paperData)
|
|
|
- }
|
|
|
- },
|
|
|
- getAns(data, index) {
|
|
|
- console.log(this.$store.getters.getPaperInfo)
|
|
|
- console.log(this.paperData.stuAns[data])
|
|
|
- if (this.paperInfo.item[data].type != "multiple") {
|
|
|
- this.paperData.stuAns[data].length = 0
|
|
|
- }
|
|
|
- if (index) {
|
|
|
- this.paperData.stuAns[data].push(this.paperInfo.item[data].option[index].code)
|
|
|
- }
|
|
|
- console.log(this.paperData.stuAns)
|
|
|
+ this.paperData = { ...paper }
|
|
|
+ console.log(paper)
|
|
|
},
|
|
|
getTestType(data) {
|
|
|
for (let item of this.testType) {
|
|
|
@@ -607,41 +342,19 @@
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
- transQtypetoEn(Qtype) {
|
|
|
- if (localStorage.getItem("lang") == "en") {
|
|
|
- if (Qtype == "單選") {
|
|
|
- return "single";
|
|
|
- } else if (Qtype == "多選") {
|
|
|
- return "multiple";
|
|
|
- } else if (Qtype == "判斷") {
|
|
|
- return "True/False";
|
|
|
- } else if (Qtype == "填充") {
|
|
|
- return "Fill in the blank";
|
|
|
- } else return;
|
|
|
- } else return Qtype;
|
|
|
- },
|
|
|
- Randomhint() {
|
|
|
- let hints = [];
|
|
|
- for (let i = 0; i <= Math.floor(Math.random() * 2) + 1; i++) {
|
|
|
- hints.push(Random.ctitle(8, 15));
|
|
|
- }
|
|
|
- return hints;
|
|
|
- },
|
|
|
- showAns() {
|
|
|
- this.showtheAnsTable = !this.showtheAnsTable;
|
|
|
- },
|
|
|
- filterQuestion(status) {
|
|
|
- this.currentFilterQuestion = status;
|
|
|
- if (this.currentFilterQuestion == "wrong") {
|
|
|
- this.currentQuestionNo = this.wrongAnsQno[0] - 1; //如果只需練習錯的題目，由錯題的第一題開始秀
|
|
|
- } else this.currentQuestionNo = 0;
|
|
|
- },
|
|
|
getQuestionData: function (qNum) {
|
|
|
- return this.paperInfo.item[qNum];
|
|
|
+ if (this.$store.getters.getPaperInfo.item[qNum]) {
|
|
|
+ return this.$store.getters.getPaperInfo.item[qNum];
|
|
|
+ } else {
|
|
|
+ return {
|
|
|
+ type:''
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
},
|
|
|
hintHandon() {
|
|
|
var undoQuestion = 0;
|
|
|
- for (var i = 0; i <= 9; i++) {
|
|
|
+ for (var i = 0; i <= this.$store.getters.getPaperInfo.item.length-1; i++) {
|
|
|
if (this.checkers[i] == "") {
|
|
|
undoQuestion++;
|
|
|
}
|
|
|
@@ -652,9 +365,7 @@
|
|
|
else return true;
|
|
|
},
|
|
|
qtypeOption: function (currentQuestionNo) {
|
|
|
-
|
|
|
- console.log(currentQuestionNo)
|
|
|
- if (this.paperInfo.item[currentQuestionNo].type == "multiple") {
|
|
|
+ if (this.getQuestionData(currentQuestionNo).type == "multiple") {
|
|
|
return "checkbox";
|
|
|
} else return "radio";
|
|
|
},
|
|
|
@@ -662,39 +373,17 @@
|
|
|
this.currentQuestionNo = index - 1;
|
|
|
},
|
|
|
preQ() {
|
|
|
- console.log(
|
|
|
- "目前陣列位置:" + this.wrongAnsQno.indexOf(this.currentQuestionNo + 1)
|
|
|
- );
|
|
|
- let currentWrongQIndex = this.wrongAnsQno.indexOf(
|
|
|
- this.currentQuestionNo + 1
|
|
|
- );
|
|
|
- if (this.currentFilterQuestion == "wrong") {
|
|
|
- if (this.currentQuestionNo > 0) {
|
|
|
- this.currentQuestionNo = this.wrongAnsQno[currentWrongQIndex - 1] - 1;
|
|
|
- }
|
|
|
- } else {
|
|
|
- if (this.currentQuestionNo > 0) this.currentQuestionNo--;
|
|
|
- }
|
|
|
+ if (this.currentQuestionNo > 0) this.currentQuestionNo--;
|
|
|
},
|
|
|
nextQ() {
|
|
|
- let currentWrongQIndex = this.wrongAnsQno.indexOf(
|
|
|
- this.currentQuestionNo + 1
|
|
|
- );
|
|
|
- if (this.currentFilterQuestion == "wrong") {
|
|
|
- if (
|
|
|
- this.currentQuestionNo <=
|
|
|
- this.wrongAnsQno[this.wrongAnsQno.length - 1]
|
|
|
- ) {
|
|
|
- this.currentQuestionNo = this.wrongAnsQno[currentWrongQIndex + 1] - 1;
|
|
|
- }
|
|
|
- } else if (this.currentQuestionNo < 9) this.currentQuestionNo++;
|
|
|
+ if (this.currentQuestionNo < (this.$store.getters.getPaperInfo.item.length-1)) this.currentQuestionNo++;
|
|
|
},
|
|
|
openWarmMessage: function (showMessageNum) {
|
|
|
this.WarmMessageisOpen = true;
|
|
|
if (showMessageNum == 1) {
|
|
|
this.showMessageNum = showMessageNum;
|
|
|
} else if (showMessageNum == 2) {
|
|
|
- for (var i = 0; i <= 9; i++) {
|
|
|
+ for (var i = 0; i <= this.$store.getters.getPaperInfo.item.length; i++) {
|
|
|
if (this.checkers[i] == "") {
|
|
|
this.showMessageNum = 3;
|
|
|
break;
|
|
|
@@ -713,56 +402,72 @@
|
|
|
closeWarmMessage: function () {
|
|
|
this.WarmMessageisOpen = false;
|
|
|
},
|
|
|
-
|
|
|
closetest: function () {
|
|
|
this.WarmMessageisOpen = false;
|
|
|
- this.showtheAnsTable = false;
|
|
|
- if (this.paperData.stuAns.length) {
|
|
|
- let len = 0
|
|
|
- for (let item of this.paperData.stuAns) {
|
|
|
- if (item.length !== 0) {
|
|
|
- len++
|
|
|
- }
|
|
|
- }
|
|
|
- if (len = this.paperInfo.item.length) {
|
|
|
- this.summit();
|
|
|
- } else{
|
|
|
- this.$Message.warning('请完成作答再提交！')
|
|
|
- }
|
|
|
- }
|
|
|
+ this.doAjax();
|
|
|
+
|
|
|
+ if (this.showMessageNum == 2) {
|
|
|
+ let multiSubject = ["國文", "英文", "數學"];
|
|
|
+ console.log(
|
|
|
+ "完成測驗",
|
|
|
+ this.$store.getters.getCurrentSubject,
|
|
|
+ multiSubject.includes(this.$store.getters.getCurrentSubject)
|
|
|
+ );
|
|
|
+
|
|
|
+ // if (
|
|
|
+ // multiSubject.includes(this.$store.getters.getCurrentSubject) == false
|
|
|
+ // ) {
|
|
|
+ // this.$store.commit(
|
|
|
+ // "SavefinishedItemID",
|
|
|
+ // this.$store.getters.getItemTitle.eventID
|
|
|
+ // );
|
|
|
+ // }
|
|
|
+ // if (
|
|
|
+ // multiSubject.includes(this.$store.getters.getCurrentSubject) == true
|
|
|
+ // ) {
|
|
|
+ // this.$store.commit(
|
|
|
+ // "SavefinishedSubject",
|
|
|
+ // this.$store.getters.getCurrentSubject
|
|
|
+ // );
|
|
|
+ // if (
|
|
|
+ // this.$store.getters.getCurrentfinishedSubject.length ==
|
|
|
+ // multiSubject.length
|
|
|
+ // ) {
|
|
|
+ // this.$store.commit(
|
|
|
+ // "SavefinishedItemID",
|
|
|
+ // this.$store.getters.getItemTitle.eventID
|
|
|
+ // );
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ }
|
|
|
},
|
|
|
- summit() {
|
|
|
+ doAjax() {
|
|
|
this.isLoading = true;
|
|
|
|
|
|
- let req = {
|
|
|
- id: this.$store.getters.getPaperInfo.id,
|
|
|
- answer: this.paperData.stuAns,
|
|
|
- studentId:this.$store.state.userInfo.sub,
|
|
|
- classId: this.$store.state.user.studentProfile.classinfo.id,
|
|
|
- subjectId: this.paperInfo.subjectId,
|
|
|
- multipleRule: this.paperData.multipleRule,
|
|
|
- paperId: this.paperData.paperId,
|
|
|
- school: this.paperInfo.code
|
|
|
- }
|
|
|
- this.$api.studentWeb.SaveStuExamPaper(req).then(res => {
|
|
|
- if (res) {
|
|
|
- this.$Message.success('作答信息提交成功！')
|
|
|
- setTimeout(() => {
|
|
|
- this.$store.commit("ToggleLessonTestPopWithSubject", "");
|
|
|
- this.isLoading = false;
|
|
|
- }, 2000);
|
|
|
- }
|
|
|
- }, err =>{
|
|
|
- this.$Message.warning('作答信息保存失败！')
|
|
|
- setTimeout(() => {
|
|
|
- this.isLoading = false;
|
|
|
- }, 1000);
|
|
|
- })
|
|
|
+ // simulate AJAX
|
|
|
+ setTimeout(() => {
|
|
|
+ this.$store.commit("ToggleLessonTestPopWithSubject", "");
|
|
|
+ this.isLoading = false;
|
|
|
+ }, 3000);
|
|
|
},
|
|
|
},
|
|
|
+ watch: {
|
|
|
+ papers: {
|
|
|
+ handler(newV, oldV) {
|
|
|
+ if (newV.item.length) {
|
|
|
+ this.checkers.length = 0
|
|
|
+ console.log(newV)
|
|
|
+ for (let i = 0; i < newV.item.length; i++) {
|
|
|
+ this.checkers == this.checkers.push([]);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ deep: true
|
|
|
+ },
|
|
|
+ }
|
|
|
};
|
|
|
</script>
|
|
|
|
|
|
-<style>
|
|
|
+<style scoped>
|
|
|
@import "~@/assets/student-web/component_styles/lesson-testpop.css";
|
|
|
</style>
|
zhousheng