Skip to content

E
eduline
Commit ef14369e by 冷斌
Options

fix bug

parent 0a295ce1
Showing with 719 additions and 722 deletions
apps/exams/Tpl/default/Index/examsroom_w3g.html
<include file="__THEME__/public_header_w3g" /> <include file="__THEME__/public_header_w3g" />
<style type="text/css"> <style type="text/css">
/*比较多用到的*/ /*比较多用到的*/
.box { .box {
display: flex; display: flex;
display: -webkit-flex; display: -webkit-flex;
align-items: center; align-items: center;
} }
.boxCn { .boxCn {
display: flex !important; display: flex !important;
display: -webkit-flex; display: -webkit-flex;
align-items: center; align-items: center;
justify-content: center !important; justify-content: center !important;
} }
.flex1 { .flex1 {
flex: 1; flex: 1;
} }
/*遮罩层*/ /*遮罩层*/
.mask { .mask {
position: fixed !important; position: fixed !important;
top: 0; top: 0;
left: 0; left: 0;
right: 0; right: 0;
bottom: 0; bottom: 0;
background: rgba(0, 0, 0, 0.5); background: rgba(0, 0, 0, 0.5);
transition: all .3s ease-in-out; transition: all .3s ease-in-out;
z-index: 8; z-index: 8;
} }
.popUp { .popUp {
background-color: #FFFFFF; background-color: #FFFFFF;
z-index: 10; z-index: 10;
width: 16.875rem; width: 16.875rem;
border-radius: 0.5rem; border-radius: 0.5rem;
overflow: hidden; overflow: hidden;
position: fixed; position: fixed;
top: 50%; top: 50%;
left: 50%; left: 50%;
-webkit-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%);
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
} }
.popUp_title { .popUp_title {
font-family: PingFangSC-Semibold, PingFang SC; font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600; font-weight: 600;
font-size: 1.125rem; font-size: 1.125rem;
height: 1.5625rem; height: 1.5625rem;
line-height: 1.5625rem; line-height: 1.5625rem;
margin-top: 0.9375rem; margin-top: 0.9375rem;
padding: 0 1rem; padding: 0 1rem;
box-sizing: border-box; box-sizing: border-box;
text-align: center; text-align: center;
} }
.popUp_content { .popUp_content {
padding: 1rem 1rem; padding: 1rem 1rem;
box-sizing: border-box; box-sizing: border-box;
text-align: center; text-align: center;
font-size: 0.875rem; font-size: 0.875rem;
color: #333333; color: #333333;
} }
.popUp_btns { .popUp_btns {
border-top: 1px solid #eeeeee; border-top: 1px solid #eeeeee;
} }
.popUp_btn { .popUp_btn {
flex: 1; flex: 1;
text-align: center; text-align: center;
line-height: 3.125rem; line-height: 3.125rem;
height: 3.125rem; height: 3.125rem;
font-family: PingFangSC-Semibold, PingFang SC; font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600; font-weight: 600;
font-size: 1rem; font-size: 1rem;
box-sizing: border-box; box-sizing: border-box;
background-color: #FFFFFF; background-color: #FFFFFF;
} }
.popUp_btn0 { .popUp_btn0 {
color: #999999; color: #999999;
border-right: 1px solid #eeeeee; border-right: 1px solid #eeeeee;
} }
.popUp_btn1 { .popUp_btn1 {
color: #65C000; color: #65C000;
} }
/*jixu*/ /*jixu*/
.stopBox { .stopBox {
width: 100%; width: 100%;
position: fixed; position: fixed;
top: 50%; top: 50%;
left: 50%; left: 50%;
z-index: 10; z-index: 10;
-webkit-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%);
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
} }
.stopBtn { .stopBtn {
width: 10rem; width: 10rem;
height: 3rem; height: 3rem;
line-height: 3rem; line-height: 3rem;
display: block; display: block;
margin: 2rem auto; margin: 2rem auto;
color: #FFFFFF; color: #FFFFFF;
font-size: 1rem; font-size: 1rem;
font-family: PingFangSC-Semibold, PingFang SC; font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600; font-weight: 600;
box-sizing: border-box; box-sizing: border-box;
text-align: center; text-align: center;
border-radius: 1.5rem; border-radius: 1.5rem;
} }
.stopBtn_on { .stopBtn_on {
background-color: #A3E460; background-color: #A3E460;
} }
.stopBtn_out { .stopBtn_out {
border: 1px solid rgba(204, 204, 204, 1); border: 1px solid rgba(204, 204, 204, 1);
} }
body { body {
background-color: #fff; background-color: #fff;
} }
.testPaperTop { .testPaperTop {
height: 2.25rem; height: 2.25rem;
padding: 0 0.75rem; padding: 0 0.75rem;
box-sizing: border-box; box-sizing: border-box;
border-bottom: 1px solid #F5F5F5; border-bottom: 1px solid #F5F5F5;
width: 100%; width: 100%;
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
z-index: 1; z-index: 1;
background-color: #FFFFFF; background-color: #FFFFFF;
} }
.testPaperTop_time { .testPaperTop_time {
font-size: 0.75rem font-size: 0.75rem
} }
.testPaperTop_da { .testPaperTop_da {
font-size: 0.75rem; font-size: 0.75rem;
color: #999999; color: #999999;
} }
.testPaperTop_pau { .testPaperTop_pau {
margin-left: 1.875rem; margin-left: 1.875rem;
width: 0.75rem; width: 0.75rem;
height: 0.75rem; height: 0.75rem;
} }
.testPaperBotm { .testPaperBotm {
padding: 0.75rem 0.75rem 0.75rem; padding: 0.75rem 0.75rem 0.75rem;
box-sizing: border-box; box-sizing: border-box;
margin-top: 2.25rem; margin-top: 2.25rem;
} }
.testPaperNum { .testPaperNum {
margin-right: 0.75rem; margin-right: 0.75rem;
color: #999999; color: #999999;
font-size: 0.75rem; font-size: 0.75rem;
} }
.testPaperLei { .testPaperLei {
font-size: 0.75rem; font-size: 0.75rem;
color: #333333; color: #333333;
} }
.testPaperColl { .testPaperColl {
width: 1rem; width: 1rem;
height: 1rem; height: 1rem;
} }
.testPaperInfo { .testPaperInfo {
margin-top: 0.5rem; margin-top: 0.5rem;
font-size: 1rem; font-size: 1rem;
line-height: 1.875rem; line-height: 1.875rem;
color: #333333; color: #333333;
} }
.testPaperAnswer { .testPaperAnswer {
margin-top: 1rem; margin-top: 1rem;
align-items: flex-start; align-items: flex-start;
} }
.testPaperAnswer_num { .testPaperAnswer_num {
display: inline-block; display: inline-block;
width: 2.25rem; width: 2.25rem;
height: 2.25rem; height: 2.25rem;
border-radius: 100%; border-radius: 100%;
border: 1px solid rgba(163, 228, 96, 1); border: 1px solid rgba(163, 228, 96, 1);
text-align: center; text-align: center;
line-height: 2.25rem; line-height: 2.25rem;
color: #65C000; color: #65C000;
font-family: PingFangSC-Semibold, PingFang SC; font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600; font-weight: 600;
font-size: 0.875rem; font-size: 0.875rem;
margin-right: 0.75rem; margin-right: 0.75rem;
} }
.testPaperAnswer_numAt { .testPaperAnswer_numAt {
background-color: #A3E460; background-color: #A3E460;
color: #FFFFFF; color: #FFFFFF;
} }
.testPaperAnswer_desc { .testPaperAnswer_desc {
line-height: 1.25rem; line-height: 1.25rem;
margin: 0; margin: 0;
} }
.testPaperBtns { .testPaperBtns {
justify-content: space-between; justify-content: space-between;
padding: 3rem 0.75rem 1rem; padding: 3rem 0.75rem 1rem;
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;
} }
.testPaperBtn { .testPaperBtn {
width: 10rem; width: 10rem;
height: 3rem; height: 3rem;
line-height: 3rem; line-height: 3rem;
text-align: center; text-align: center;
border: 1px solid rgba(163, 228, 96, 1); border: 1px solid rgba(163, 228, 96, 1);
border-radius: 1.5rem; border-radius: 1.5rem;
box-sizing: border-box; box-sizing: border-box;
font-size: 1rem; font-size: 1rem;
font-family: PingFangSC-Semibold, PingFang SC; font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600; font-weight: 600;
color: #65C000; color: #65C000;
} }
.testPaperBtn1 { .testPaperBtn1 {
color: #FFFFFF; color: #FFFFFF;
background: rgba(163, 228, 96, 1); background: rgba(163, 228, 96, 1);
} }
.testPaperJiedaPage { .testPaperJiedaPage {
padding: 0 0.75rem; padding: 0 0.75rem;
box-sizing: border-box; box-sizing: border-box;
} }
.testPaperJiedaBox { .testPaperJiedaBox {
padding: 1rem 0; padding: 1rem 0;
} }
.testPaperJiedaBtn { .testPaperJiedaBtn {
color: #65C000; color: #65C000;
font-size: 0.875rem; font-size: 0.875rem;
font-family: PingFangSC-Semibold, PingFang SC; font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600; font-weight: 600;
} }
.testPaperJiedaBtn_icon { .testPaperJiedaBtn_icon {
margin-left: 0.5rem; margin-left: 0.5rem;
width: 0.75rem; width: 0.75rem;
height: 0.75rem; height: 0.75rem;
} }
.testPaperAnswers { .testPaperAnswers {
padding: 0.5rem 0 0.25rem; padding: 0.5rem 0 0.25rem;
} }
.testPaperAnswer { .testPaperAnswer {
padding: 0.5rem 0; padding: 0.5rem 0;
color: #333333; color: #333333;
font-size: 1rem; font-size: 1rem;
margin: 0; margin: 0;
} }
.testPaperAnswer_n { .testPaperAnswer_n {
color: #65C000; color: #65C000;
} }
.testPaperAnswer_e { .testPaperAnswer_e {
color: red; color: red;
} }
.testPaperAnswer_infoBox { .testPaperAnswer_infoBox {
padding: 0.1875rem 0.75rem 0.75rem; padding: 0.1875rem 0.75rem 0.75rem;
box-sizing: border-box; box-sizing: border-box;
border-top: 1px solid #f5f5f5; border-top: 1px solid #f5f5f5;
} }
.testPaperAnswer_infoTitle { .testPaperAnswer_infoTitle {
font-family: PingFangSC-Semibold, PingFang SC; font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600; font-weight: 600;
color: #333333; color: #333333;
font-size: 1rem; font-size: 1rem;
padding: 0.75rem 0 0.75rem 0.75rem; padding: 0.75rem 0 0.75rem 0.75rem;
box-sizing: border-box; box-sizing: border-box;
position: relative; position: relative;
margin: 0; margin: 0;
} }
.testPaperAnswer_infoTitle::before { .testPaperAnswer_infoTitle::before {
content: ""; content: "";
position: absolute; position: absolute;
left: 0; left: 0;
top: 50%; top: 50%;
width: 4px; width: 4px;
height: 4px; height: 4px;
border-radius: 100%; border-radius: 100%;
background-color: #A3E460; background-color: #A3E460;
margin-top: -2px; margin-top: -2px;
} }
.testPaperAnswer_info { .testPaperAnswer_info {
color: #333333; color: #333333;
font-size: 1rem; font-size: 1rem;
line-height: 1.875rem; line-height: 1.875rem;
} }
</style> </style>
<div id="app"> <div id="app">
<div class="testPaperTop box"> <div v-show="!review" class="testPaperTop box">
<p class="testPaperTop_time flex1">{{countDown}}</p> <p class="testPaperTop_time flex1">{{countDown}}</p>
<span v-show="!review" class="testPaperTop_da">答题卡</span> <span class="testPaperTop_da">答题卡</span>
<img v-show="!review" @click="onCounting" class="testPaperTop_pau" :src="counting ? '__THEME__/img/pau.png' : '__THEME__/img/right_arrow.png'"> <img @click="onCounting" class="testPaperTop_pau" :src="counting ? '__THEME__/img/pau.png' : '__THEME__/img/right_arrow.png'">
</div> </div>
<div class="testPaperBotm"> <div class="testPaperBotm">
<div class="box"> <div class="box">
<span class="testPaperNum">{{current}}/{{totalQuestion}}</span> <span class="testPaperNum">{{current}}/{{totalQuestion}}</span>
<p class="testPaperLei flex1">（{{currentQuestionTypeName}}）</p> <p class="testPaperLei flex1">（{{currentQuestionTypeName}}）</p>
<img v-if="currentQuestion.is_collect == 0" @click="onCollect(1)" class="testPaperColl" src="__THEME__/img/share_unstar.png"> <img v-if="currentQuestion.is_collect == 0" @click="onCollect(1)" class="testPaperColl" src="__THEME__/img/share_unstar.png">
<img v-if="currentQuestion.is_collect == 1" @click="onCollect(0)" class="testPaperColl" src="__THEME__/img/share_star.png"> <img v-if="currentQuestion.is_collect == 1" @click="onCollect(0)" class="testPaperColl" src="__THEME__/img/share_star.png">
</div> </div>
<template v-if="showChoiceQuestion"> <template v-if="showChoiceQuestion">
<div v-html="currentQuestion.content" class="testPaperInfo"></div> <div v-html="currentQuestion.content" class="testPaperInfo"></div>
<ul> <ul>
<li v-for="(opt, index) in currentOptions" :key="index" class="testPaperAnswer box"> <li v-for="(opt, index) in currentOptions" :key="index" class="testPaperAnswer box">
<span @click="onChoose(opt)" class="testPaperAnswer_num" :class="opt.selected ? 'testPaperAnswer_numAt' : ''">{{opt.key}}</span> <span @click="onChoose(opt)" class="testPaperAnswer_num" :class="opt.selected ? 'testPaperAnswer_numAt' : ''">{{opt.key}}</span>
<div v-html="opt.value" class="testPaperAnswer_desc flex1" style="margin-top: 0.625rem;"></div> <div v-html="opt.value" class="testPaperAnswer_desc flex1" style="margin-top: 0.625rem;"></div>
</li> </li>
</ul> </ul>
</template> </template>
</div> </div>
<div v-if="current == 1" class="testPaperBtns boxCn"> <div v-if="current == 1" class="testPaperBtns boxCn">
<p @click="onNextQuestion" class="testPaperBtn testPaperBtn1" style="width: 15rem;">下一题</p> <p @click="onNextQuestion" class="testPaperBtn testPaperBtn1" style="width: 15rem;">下一题</p>
</div> </div>
<div v-if="current > 1" class="testPaperBtns box"> <div v-if="current > 1" class="testPaperBtns box">
<p @click="onPreviousQuestion" class="testPaperBtn">上一题</p> <p @click="onPreviousQuestion" class="testPaperBtn">上一题</p>
<p @click="onNextQuestion" class="testPaperBtn testPaperBtn1">{{nextButton}}</p> <p @click="onNextQuestion" class="testPaperBtn testPaperBtn1">{{nextButton}}</p>
</div> </div>
<!-- 解析 --> <!-- 解析 -->
<div class="testPaperJiedaPage"> <div class="testPaperJiedaPage">
<div class="box testPaperJiedaBox"> <div class="box testPaperJiedaBox">
<span @click="expand = !expand" class="testPaperJiedaBtn box">{{expand ? '收起解析' : '查看解析'}}<img class="testPaperJiedaBtn_icon" src="__THEME__/img/openBtn.png"></span> <span @click="expand = !expand" class="testPaperJiedaBtn box">{{expand ? '收起解析' : '查看解析'}}<img class="testPaperJiedaBtn_icon" src="__THEME__/img/openBtn.png"></span>
</div> </div>
<ul v-if="expand" class="testPaperAnswers"> <ul v-if="expand" class="testPaperAnswers">
<li class="testPaperAnswer">正确答案：<span v-for="(answer, index) in currentRightOptions" :key="index" class="testPaperAnswer_n">{{answer}}</span></li> <li class="testPaperAnswer">正确答案：<span v-for="(answer, index) in currentRightOptions" :key="index" class="testPaperAnswer_n">{{answer}}</span></li>
<li class="testPaperAnswer">我的答案：<span v-for="(answer, index) in currentMyOptions" :key="index" :class="answer.right ? 'testPaperAnswer_n' : 'testPaperAnswer_e'">{{answer.key}}</span></li> <li class="testPaperAnswer">我的答案：<span v-for="(answer, index) in currentMyOptions" :key="index" :class="answer.right ? 'testPaperAnswer_n' : 'testPaperAnswer_e'">{{answer.key}}</span></li>
</ul> </ul>
<div v-if="expand" class="testPaperAnswer_infoBox"> <div v-if="expand" class="testPaperAnswer_infoBox">
<p class="testPaperAnswer_infoTitle">解析</p> <p class="testPaperAnswer_infoTitle">解析</p>
<div v-html="currentAnalyze" class="testPaperAnswer_info"> <div v-html="currentAnalyze" class="testPaperAnswer_info">
</div> </div>
</div> </div>
</div> </div>
<!-- 交卷 --> <!-- 交卷 -->
<div class="mask" v-if="showFinish"> <div class="mask" v-if="showFinish">
<div class="popUp"> <div class="popUp">
<p class="popUp_title">提示</p> <p class="popUp_title">提示</p>
<div class="popUp_content">是否交卷并退出考试？</div> <div class="popUp_content">是否交卷并退出考试？</div>
<div class="popUp_btns box"> <div class="popUp_btns box">
<span @click="onCancel" class="popUp_btn popUp_btn0 flex1">取消</span> <span @click="onCancel" class="popUp_btn popUp_btn0 flex1">取消</span>
<span @click="onSure" class="popUp_btn popUp_btn1 flex1">确定</span> <span @click="onSure" class="popUp_btn popUp_btn1 flex1">确定</span>
</div> </div>
</div> </div>
</div> </div>
<!-- 暂停 --> <!-- 暂停 -->
<div class="mask" v-if="showPause"> <div class="mask" v-if="showPause">
<div class="stopBox"> <div class="stopBox">
<span @click="onContinue" class="stopBtn stopBtn_on">继续</span> <span @click="onContinue" class="stopBtn stopBtn_on">继续</span>
<span @click="onQuit" class="stopBtn stopBtn_out">退出</span> <span @click="onQuit" class="stopBtn stopBtn_out">退出</span>
</div> </div>
</div> </div>
</div> </div>
<include file="__THEME__/public_footer_w3g" /> <include file="__THEME__/public_footer_w3g" />
<script type="text/javascript"> <script type="text/javascript">
new Vue({ new Vue({
el: "#app", el: "#app",
data: function() { data: function() {
return { return {
info: {}, info: {},
temp: {}, temp: {},
current: 1, current: 1,
paperOptions: {}, paperOptions: {},
counting: true, counting: true,
review: false, review: false,
countDown: "00:00:00", countDown: "00:00:00",
timeConsumed: 0, timeConsumed: 0,
expand: false, expand: false,
showPause: false, showPause: false,
showFinish: false, showFinish: false,
//选项 //选项
currentOptions: [], currentOptions: [],
finished: [] finished: []
} }
}, },
computed: { computed: {
//computed //computed
nextButton: function() { nextButton: function() {
if(this.review) { if(this.review) {
return this.current == this.totalQuestion ? '返回' : '下一题' return this.current == this.totalQuestion ? '返回' : '下一题'
} else { } else {
return this.current == this.totalQuestion ? '交卷' : '下一题' return this.current == this.totalQuestion ? '交卷' : '下一题'
} }
}, },
totalQuestion: function() { totalQuestion: function() {
let count = 0 let count = 0
let data = this.paperOptions.options_questions_data let data = this.paperOptions.options_questions_data
this.paperOptions.options_type.forEach( r => { this.paperOptions.options_type.forEach( r => {
count += data[r.question_type].length count += data[r.question_type].length
}) })
return count return count
}, },
currentTypeIndex: function() { currentTypeIndex: function() {
let count = 0 let count = 0
let data = this.paperOptions.options_questions_data let data = this.paperOptions.options_questions_data
let current = this.current let current = this.current
for(let i = 0; i < this.paperOptions.options_type.length; i++) { for(let i = 0; i < this.paperOptions.options_type.length; i++) {
let r = this.paperOptions.options_type[i] let r = this.paperOptions.options_type[i]
let next = count + data[r.question_type].length let next = count + data[r.question_type].length
if(current > count && current <= next) { if(current > count && current <= next) {
return i return i
} else { } else {
count = next count = next
} }
} }
}, },
currentQuestions: function() { currentQuestions: function() {
let optionType = this.currentQuestionType let optionType = this.currentQuestionType
let questionType = optionType.question_type let questionType = optionType.question_type
let questionData = this.paperOptions.options_questions_data let questionData = this.paperOptions.options_questions_data
let questions = questionData[questionType] let questions = questionData[questionType]
return questions return questions
}, },
currentQuestionType: function() { currentQuestionType: function() {
return this.paperOptions.options_type[this.currentTypeIndex] return this.paperOptions.options_type[this.currentTypeIndex]
}, },
currentQuestionTypeName: function() { currentQuestionTypeName: function() {
return this.currentQuestionType.type_info.question_type_title return this.currentQuestionType.type_info.question_type_title
}, },
currentQuestionTypeKey: function() { currentQuestionTypeKey: function() {
return this.currentQuestionType.question_type_key return this.currentQuestionType.question_type_key
}, },
currentQuestion: function() { currentQuestion: function() {
let count = 0 let count = 0
let data = this.paperOptions.options_questions_data let data = this.paperOptions.options_questions_data
let current = this.current let current = this.current
for(let i = 0; i < this.paperOptions.options_type.length; i++) { for(let i = 0; i < this.paperOptions.options_type.length; i++) {
let r = this.paperOptions.options_type[i] let r = this.paperOptions.options_type[i]
let next = count + data[r.question_type].length let next = count + data[r.question_type].length
if(current > count && current <= next) { if(current > count && current <= next) {
return data[r.question_type][current - count - 1] return data[r.question_type][current - count - 1]
} else { } else {
count = next count = next
} }
} }
}, },
//选择题答案 //选择题答案
currentRightOptions: function() { currentRightOptions: function() {
return this.currentQuestion.answer_true_option return this.currentQuestion.answer_true_option
}, },
//我的答案 //我的答案
currentMyOptions: function() { currentMyOptions: function() {
let cur = this.currentRightOptions let cur = this.currentRightOptions
return this.currentOptions.filter( r => { return r.selected }).map( r => { return this.currentOptions.filter( r => { return r.selected }).map( r => {
return { return {
right: cur.hx_indexOf( k => { return k == r.key }) != -1, right: cur.hx_indexOf( k => { return k == r.key }) != -1,
key: r.key key: r.key
} }
}) })
}, },
//解析 //解析
currentAnalyze: function() { currentAnalyze: function() {
return this.currentQuestion.analyze return this.currentQuestion.analyze
}, },
//Helper //Helper
showChoiceQuestion: function() { showChoiceQuestion: function() {
let key = this.currentQuestionTypeKey let key = this.currentQuestionTypeKey
return key == 'radio' || key == 'multiselect' || key == 'judge' return key == 'radio' || key == 'multiselect' || key == 'judge'
} }
}, },
created: function() { created: function() {
this.info = {:json_encode($paper)}; this.info = {:json_encode($paper)};
this.temp = {:json_encode($tempData)}; this.temp = {:json_encode($tempData)};
this.paperOptions = {:json_encode($paper_options)}; this.paperOptions = {:json_encode($paper_options)};
this.review = "{$review}" this.review = "{$review}"
this.initAnswerMode() this.initAnswerMode()
this.doCountDown() this.doCountDown()
if(this.review) { if(this.review) {
this.countDown = this.computeTime(this.info.reply_time * 60) this.countDown = ""
this.expand = true this.expand = true
} }
console.log("Review = " + this.review) console.log("Review = " + this.review)
console.log(this.info) console.log(this.info)
console.log(this.temp) console.log(this.temp)
console.log(this.paperOptions) console.log(this.paperOptions)
}, },
watch: { watch: {
current: function(o, n) { current: function(o, n) {
this.initAnswerMode() this.initAnswerMode()
} }
}, },
methods: { methods: {
initAnswerMode: function() { initAnswerMode: function() {
let q = this.currentQuestionTypeKey let q = this.currentQuestionTypeKey
switch(q) { switch(q) {
case "radio": case "radio":
this.currentOptions = [] this.currentOptions = []
let Q = this.currentQuestion let Q = this.currentQuestion
let old = this.finished.hx_firstOf( r => { return r.qId == Q.exams_question_id }) let old = this.finished.hx_firstOf( r => { return r.qId == Q.exams_question_id })
for(let k in Q.answer_options) { for(let k in Q.answer_options) {
let value = Q.answer_options[k] let value = Q.answer_options[k]
let select = old ? old.option == k : false let select = old ? old.option == k : false
this.currentOptions.push({ this.currentOptions.push({
key: k, key: k,
value: value, value: value,
selected: select selected: select
}) })
} }
break break
} }
}, },
recordData: function() { recordData: function() {
return { return {
paperId: this.info.exams_paper_id, paperId: this.info.exams_paper_id,
timeConsumed: this.timeConsumed, timeConsumed: this.timeConsumed,
questionIndex: this.current, questionIndex: this.current,
finished: this.finished finished: this.finished
} }
}, },
computeTime: function(time) { doCountDown: function() {
let hours = Math.floor(time / 3600) if(!this.counting || this.review) {
let minutes = Math.floor((time % 3600) / 60) return
let seconds = Math.round(time % 60) }
return (hours < 10 ? '0' + hours : hours) + ":" + (minutes < 10 ? '0' + minutes : minutes) + ":" + (seconds < 10 ? '0' + seconds : seconds) if(this.info.reply_time) {
}, let time = this.info.reply_time * 60 - this.timeConsumed
doCountDown: function() { if(time <= 0) {
if(!this.counting || this.review) { this.showFinish = true
return } else {
} let hours = Math.floor(time / 3600)
if(this.info.reply_time) { let minutes = Math.floor((time % 3600) / 60)
let time = this.info.reply_time * 60 - this.timeConsumed let seconds = Math.round(time % 60)
if(time <= 0) { this.countDown = (hours < 10 ? '0' + hours : hours) + ":" + (minutes < 10 ? '0' + minutes : minutes) + ":" + (seconds < 10 ? '0' + seconds : seconds)
this.showFinish = true setTimeout(this.doCountDown, 1000)
} else { this.timeConsumed += 1
this.countDown = this.computeTime(time) }
setTimeout(this.doCountDown, 1000) } else {
this.timeConsumed += 1 this.countDown = "不限时"
} }
} else { },
this.countDown = "不限时" onCollect: function(collect) {
} let that = this
}, $.post(U('exams/Index/collect'), {
onCollect: function(collect) { action: collect,
let that = this source_id: that.currentQuestion.exams_question_id
$.post(U('exams/Index/collect'), { }, function(res) {
action: collect, let r = JSON.parse(res)
source_id: that.currentQuestion.exams_question_id if(r.status == 1) {
}, function(res) { that.currentQuestion.is_collect = collect
let r = JSON.parse(res) }
if(r.status == 1) { })
that.currentQuestion.is_collect = collect },
} onChoose: function(opt) {
}) if(this.currentQuestionTypeKey == 'radio') {
}, this.currentOptions.forEach( r => {
onChoose: function(opt) { r.selected = opt.key == r.key
if(this.currentQuestionTypeKey == 'radio') { })
this.currentOptions.forEach( r => { }
r.selected = opt.key == r.key },
}) onCounting: function() {
} if(this.counting) {
}, this.counting = false
onCounting: function() { this.showPause = true
if(this.counting) { } else {
this.counting = false this.counting = true
this.showPause = true this.doCountDown()
} else { }
this.counting = true },
this.doCountDown() onContinue: function() {
} this.showPause = false
}, this.onCounting()
onContinue: function() { },
this.showPause = false onQuit: function() {
this.onCounting() this.showPause = false
}, this.saveProgress()
onQuit: function() { },
this.showPause = false onCancel: function() {
this.saveProgress() this.showFinish = false
}, window.history.back()
onCancel: function() { },
this.showFinish = false onSure: function() {
window.history.back() this.showFinish = false
}, this.submitPaper()
onSure: function() { },
this.showFinish = false onNextQuestion: function() {
this.submitPaper() if(this.current < this.totalQuestion) {
}, this.cacheQuestion()
onNextQuestion: function() { if(!this.review) {
if(this.current < this.totalQuestion) { this.expand = false
this.cacheQuestion() }
if(!this.review) { this.current += 1
this.expand = false } else {
} if(!this.review) {
this.current += 1 this.showFinish = true
} else { } else {
if(!this.review) { window.history.back()
this.showFinish = true }
} else { }
window.history.back() },
} onPreviousQuestion: function() {
} if(this.current > 1) {
}, this.current -= 1
onPreviousQuestion: function() { }
if(this.current > 1) { },
this.current -= 1 cacheQuestion: function() {
} if(this.review) {
}, return
cacheQuestion: function() { }
if(this.review) { let q = this.currentQuestion
return let mode = this.finished.hx_firstOf( r => { return r.qId == q.exams_question_id })
} if(mode) {
let q = this.currentQuestion switch(this.currentQuestionTypeKey) {
let mode = this.finished.hx_firstOf( r => { return r.qId == q.exams_question_id }) case "radio":
if(mode) { let my = this.currentMyOptions
switch(this.currentQuestionTypeKey) { if(my.length > 0) {
case "radio": mode.option = my[0].key
let my = this.currentMyOptions }
if(my.length > 0) { break
mode.option = my[0].key }
} } else {
break switch(this.currentQuestionTypeKey) {
} case "radio":
} else { let my = this.currentMyOptions
switch(this.currentQuestionTypeKey) { if(my.length > 0) {
case "radio": this.finished.push({
let my = this.currentMyOptions qId: q.exams_question_id,
if(my.length > 0) { option: my[0].key,
this.finished.push({ key: "radio"
qId: q.exams_question_id, })
option: my[0].key, }
key: "radio" break
}) }
} }
break },
} //Request
} //Collect Params
}, collectParam: function() {
//Request let that = this
//Collect Params let time = that.info.reply_time * 60 - that.timeConsumed
collectParam: function() { let param = {
let that = this anser_time: that.timeConsumed,
let time = that.info.reply_time * 60 - that.timeConsumed exams_mode: 1,
let param = { paper_id: that.info.exams_paper_id,
anser_time: that.timeConsumed, ch_id: "{$_GET['s_id']}",
exams_mode: 1, view_url: "{$_GET['view']}",
paper_id: that.info.exams_paper_id, is_timeout: time <= 0 ? 1 : 0,
ch_id: "{$_GET['s_id']}", paper_options_id: that.paperOptions.exams_paper_options_id,
view_url: "{$_GET['view']}", }
is_timeout: time <= 0 ? 1 : 0, that.finished.forEach( r => {
paper_options_id: that.paperOptions.exams_paper_options_id, let key = 'user_answer[' + r.qId + ']'
} switch(r.key) {
that.finished.forEach( r => { case "radio":
let key = 'user_answer[' + r.qId + ']' param[key] = r.option
switch(r.key) { break
case "radio": }
param[key] = r.option })
break return param
} },
}) saveProgress: function() {
return param let that = this
}, that.cacheQuestion()
saveProgress: function() { let param = this.collectParam()
let that = this $.post(
that.cacheQuestion() U('exams/Index/doProgressExams'),
let param = this.collectParam() param,
$.post( function(res) {
U('exams/Index/doProgressExams'), if (typeof(res) != 'object') {
param, try {
function(res) { let res = JSON.parse(res)
if (typeof(res) != 'object') { } catch (e) {
try { ui.error("处理异常,请重新尝试")
let res = JSON.parse(res) }
} catch (e) { }
ui.error("处理异常,请重新尝试") if (res.status == 1) {
} ui.success(res.data.info)
} window.location.href = res.data.jumpurl
if (res.status == 1) { } else {
ui.success(res.data.info) ui.error(res.message)
window.location.href = res.data.jumpurl }
} else { })
ui.error(res.message) },
} submitPaper: function() {
}, 'json') let that = this
}, that.cacheQuestion()
submitPaper: function() { let param = this.collectParam()
let that = this $.post(
that.cacheQuestion() U('exams/Index/doHaddleExams'),
let param = this.collectParam() param,
$.post( function(r) {
U('exams/Index/doHaddleExams'), let res = JSON.parse(r)
param, if (res.status == 1) {
function(r) { ui.success(res.data.info)
let res = JSON.parse(r) window.location.href = res.data.jumpurl
if (res.status == 1) { } else {
ui.success(res.data.info) ui.error(res.message)
window.location.href = res.data.jumpurl }
} else { })
ui.error(res.message) }
} }
}) })
}
}
})
</script> </script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment