Skip to content

E
eduline
Commit c2bb31d0 by 陈超
Options

A

parent 355c9925
Showing with 1055 additions and 0 deletions
apps/exams/Tpl/default/Index/examsresult_w3g_old.html 0 → 100644
<!DOCTYPE html>
<include file="__THEME__/public_header_w3g"/>
<link rel="stylesheet" type="text/css" href="{$Think.APPS_URL}/exams/_static/css/public.css">
<link rel="stylesheet" type="text/css" href="{$Think.APPS_URL}/exams/_static/icon/iconfont.css">
<link rel="stylesheet" type="text/css" href="{$Think.APPS_URL}/exams/_static/css/public_header_footer_media.css">
<link rel="stylesheet" type="text/css" href="{$Think.APPS_URL}/exams/_static/css/exam_2.0.css">
<style type="text/css">
.static-exam dl .operation .analysis{display: block;}
</style>
<div class="min-height-wrap">
<div class="cstlayer exams_top">
<div class="cstlayer-header">
<a href="{:U('home/Home/exams')}"><i class="icon icon-zuojiantou"></i></a>
<h3>{$paper.exams_paper_title}</h3>
</div>
<div class="cstlayer-content">{$answerData.score|default='0'}</div>
<p class="cstlayer-txt"></p><!--本卷平均分{$avg.avg|default='0'}分，超过{$avg.transcend_rate}的人-->
<php>if($answerData['exams_mode'] != 3 && $answerData['exams_mode'] != 4){</php>
<a href="{:U('exams/index/examsroom',['paper_id'=>$paper['exams_paper_id'],'joinType'=>$answerData['exams_mode']])}" class="add-eaxm">再次挑战</a>
<php>}else if($answerData['exams_mode'] == 4){</php>
<a href="{:U('exams/Index/wrongExamsroom',['joinType'=>1,'paper_id'=>$paper['exams_paper_id'],'temp'=>$answerData['exams_users_id'],'is_highwrong'=>1])}" class="add-eaxm">再次挑战</a>
<php>}else{</php>
<a href="{:U('exams/Index/wrongExamsroom',['joinType'=>1,'paper_id'=>$paper['exams_paper_id'],'temp'=>$answerData['pid']])}" class="add-eaxm">再次挑战</a>
<php>}</php>
<dl class="business-card">
<dt>排名<h1>{$rank.now.rank|default='1'}</h1></dt>
<dd>
<a href="javascript:void(0);"><img src="{:getUserFace($mid)}" /></a>
<span>
<h4>{:getUsername($mid)}</h4>
<b>用时 <em>{:floor($answerData['anser_time']/60)}'{:$answerData['anser_time'] % 60}</em></b><b>得分 <em>{$answerData.score|default='0'}</em></b>
</span>
</dd>
</dl>
</div>
<!--排名表-->
<table class="ranking-all exams_top">
<tr>
<th>排名</th>
<th></th>
<th>用时</th>
<th>得分</th>
</tr>
<volist name="rank.list" id="item">
<tr>
<td><h6>{$i}</h6></td>
<td><a href="{:U('home/UserShow/index',['uid'=>$item['uid']])}"><img src="{:getUserFace($item['uid'])}"></a><small>{:getUsername($item['uid'])}</small></td>
<td><em>{:floor($item['anser_time']/60)}'{:$item['anser_time'] % 60}</em></td>
<td><h6>{$item.score|default="0"}</h6></td>
</tr>
</volist>
</table>
<!--footer解析-->
<div class="error-box-go exams_top">
<a href="javascript:;" data-type="all" class="show_analysis">全部解析</a>
<a href="javascript:;" data-type="wrong" class="show_analysis">错题解析</a>
</div>
<div class="exam-header exams_questions clearfix">
<div class="back-date">
<i class="icon icon-fanhui1" style="display: none;"></i>
</div>
<div class="view-stop">
<a href="javascript:;" id="show-answer-card"><i class="icon icon-datiqia"></i></a>
</div>
</div>
<!--解析题卡分为全部解析 or 错题解析-->
<div class="answer-card" style="display: none;">
<php>$question_num = 1;</php>
<volist name="paper_options.options_type" id="options_type">
<php>
if(!$paper_options['options_questions_data'][$options_type['question_type']]){
break;
}
</php>
<dl>
<dt><h6>{$options_type.type_info.question_type_title}</h6></dt>
<dd>
<volist name="paper_options['options_questions_data'][$options_type['question_type']]" id="question">
<php>if($_GET['joinType'] == 3 && !in_array($question['exams_question_id'],$inQuestions)) continue;</php>
<a id="card{$question_num}" href="javascript:;" data-question_num="{$question_num}" class="go_question <php>if(in_array($question['exams_question_id'],$wrongList)){</php>err<php>}</php>">{$question_num}</a>
<php>$question_num++;</php>
</volist>
</dd>
</dl>
</volist>
</div>
<div class="static-exam exams_questions">
<php>$question_num = 1;</php>
<volist name="paper_options.options_type" id="options_type">
<switch name="options_type.question_type_key">
<case value="radio|judge|multiselect">
<!-- 单选题 -->
<volist name="paper_options['options_questions_data'][$options_type['question_type']]" id="question">
<php>if($_GET['joinType'] == 3 && !in_array($question['exams_question_id'],$inQuestions)) continue;</php>
<dl <php>if(in_array($question['exams_question_id'],$wrongList)){</php>class="wrong"<php>}</php> id="ex{$question_num}" data-type="{$options_type.question_type_key}" data-question_num="{$question_num}">
<dt>
<h5><small>{$question_num}</small>/{$answerData['right_count']+$answerData['wrong_count']}<!-- {$paper_options.questions_count} --><strong>{$options_type.type_info.question_type_title}</strong></h5>
<h3>{$question.content}</h3>
</dt>
<dd>
<volist name="question.answer_options" id="answer">
<div class="answer_box">
<p data-answer="{$key}"><em>{$key}</em>{$answer}</p>
</div>
</volist>
</dd>
<a href="javascript:;" data-question_num="{$question_num}" class="next next_question">下一题</a>
<div class="operation">
<!--答案解析-->
<php>
$content = isset($answerData['content'][$question['exams_question_id']]) ? $answerData['content'][$question['exams_question_id']] : [];
</php>
<div class="analysis">
<table class="analysis-pic">
<td>
<h6>正确答案</h6>
<abbr><volist name="question.answer_true_option" id="answer_true">{$answer_true}</volist></abbr>
</td>
<td>
<h6>我的答案</h6>
<em><php>if(!$content){</php>未作答<php>}</php><volist name="content" id="ans">{$ans|default='未作答'}</volist></em>
</td>
</table>
<div class="analysis-txt">
<h6>解析</h6>
<p>{$question.analyze}</p>
</div>
</div>
</div>
<div class="collect_hidden">
<php>if($question['is_collect'] == 1){</php>
<i data-question_num="{$question_num}" data-question_id="{$question.exams_question_id}" data-action="0" class="icon icon-shoucang2" style="color:#F7B659;"></i>
<php>}else{</php>
<i data-question_num="{$question_num}" data-question_id="{$question.exams_question_id}" data-action="1" class="icon icon-shoucang2"></i>
<php>}</php>
</div>
</dl>
<php>$question_num++;</php>
</volist>
</case>
<case value="completion">
<!-- 填空题 -->
<volist name="paper_options['options_questions_data'][$options_type['question_type']]" id="question">
<php>if($_GET['joinType'] == 3 && !in_array($question['exams_question_id'],$inQuestions)) continue;</php>
<dl <php>if(in_array($question['exams_question_id'],$wrongList)){</php>class="wrong"<php>}</php> id="ex{$question_num}" data-type="{$options_type.question_type_key}" data-question_num="{$question_num}">
<dt>
<h5><small>{$question_num}</small>/{$answerData['right_count']+$answerData['wrong_count']}<!-- {$paper_options.questions_count} --><strong>{$options_type.type_info.question_type_title}</strong></h5>
<h3>{$question.content}</h3>
</dt>
<dd>
<php>
$content = isset($answerData['content'][$question['exams_question_id']]) ? $answerData['content'][$question['exams_question_id']] : [];
</php>
<volist name="question.answer_true_option" id="answer">
<label>{$i}、<input type="text" class="anserItem" <php>if($content){</php>value="{$content[$i-1]}"<php>}</php>></label>
</volist>
</dd>
<a href="javascript:;" data-question_num="{$question_num}" class="next next_question">下一题</a>
<div class="operation">
<!--答案解析-->
<div class="analysis">
<div class="analysis-pic">
<h5>正确答案</h5>
<ul>
<volist name="question.answer_true_option" id="answer_true">
<li>{$i}、{$answer_true}</li>
</volist>
</ul>
</div>
<div class="analysis-txt">
<h6>解析</h6>
<p>{$question.analyze}</p>
</div>
</div>
</div>
<div class="collect_hidden">
<php>if($question['is_collect'] == 1){</php>
<i data-question_num="{$question_num}" data-question_id="{$question.exams_question_id}" data-action="0" class="icon icon-shoucang2" style="color:#F7B659;"></i>
<php>}else{</php>
<i data-question_num="{$question_num}" data-question_id="{$question.exams_question_id}" data-action="1" class="icon icon-shoucang2"></i>
<php>}</php>
</div>
</dl>
<php>$question_num++;</php>
</volist>
</case>
<case value="essays">
<!-- 简述题-->
<volist name="paper_options['options_questions_data'][$options_type['question_type']]" id="question">
<php>if($_GET['joinType'] == 3 && !in_array($question['exams_question_id'],$inQuestions)) continue;</php>
<dl <php>if(in_array($question['exams_question_id'],$wrongList)){</php>class="wrong"<php>}</php> id="ex{$question_num}" data-type="{$options_type.question_type_key}" data-question_num="{$question_num}">
<dt>
<h5><small>{$question_num}</small>/{$answerData['right_count']+$answerData['wrong_count']}<!-- {$paper_options.questions_count} --><strong>{$options_type.type_info.question_type_title}</strong></h5>
<h3>{$question.content}</h3>
</dt>
<dd>
<php>
$content = isset($answerData['content'][$question['exams_question_id']]) ? $answerData['content'][$question['exams_question_id']] : [];
</php>
<textarea class="anserItem">{$content[0]|default=''}</textarea>
</dd>
<a href="javascript:;" data-question_num="{$question_num}" class="next next_question">下一题</a>
<div class="operation">
<!--答案解析-->
<div class="analysis">
<div class="analysis-txt">
<h6>解析</h6>
<p>{$question.analyze}</p>
</div>
</div>
</div>
<div class="collect_hidden">
<php>if($question['is_collect'] == 1){</php>
<i data-question_num="{$question_num}" data-question_id="{$question.exams_question_id}" data-action="0" class="icon icon-shoucang2" style="color:#F7B659;"></i>
<php>}else{</php>
<i data-question_num="{$question_num}" data-question_id="{$question.exams_question_id}" data-action="1" class="icon icon-shoucang2"></i>
<php>}</php>
</div>
</dl>
<php>$question_num++;</php>
</volist>
</case>
</switch>
</dl>
</volist>
</div>
</div>
<!--&lt;!&ndash; 统计代码&ndash;&gt;-->
<div id="site_analytics_code" style="display:none;">
{$site.site_analytics_code|base64_decode}
</div>
<eq name='site.site_online_count' value='1'>
<script src="{:SITE_URL}/online_check.php?uid={$mid}&uname={$user.uname}&mod={:MODULE_NAME}&app={:APP_NAME}&act={:ACTION_NAME}&action=trace"></script>
</eq>
<script src="__THEMEW3G__/js/script.js"></script>
</div>
</body>
</html>
<script src="{$Think.APPS_URL}/exams/_static/js/public_header_footer_media.js"></script>
<script type="text/javascript">
$(function(){
// 显示的解析类型
window.type = 1;
// 下一题
$(".next_question,.go_question").click(function(){
if($(this).hasClass("go_question")){
var question_num = parseInt($(this).data("question_num"));
}else if(window.type == 2){
// 获取下一个错题
var next_obj = $(this).parents("dl").nextAll(".wrong").first();
var question_num = next_obj.length > 0 ? next_obj.data("question_num") : 0;
}else{
var question_num = parseInt($(this).data("question_num")) + 1;
}
$(".answer-card").hide();
if($("#ex"+question_num).length > 0){
$("#ex"+question_num).show().siblings().hide();
}else{
ui.confirm('已经是最后一题了,是否返回第一题？', {
yes: function () {
if(window.type == 2){
$(".static-exam .wrong").first().show().siblings().hide();
}else{
$("#ex1").show().siblings().hide();
}
question_num = 1;
}
});
}
// 添加搜藏标识
var html = $("#ex"+question_num).find(".collect_hidden").html();
$(".exam-header .view-stop>i").remove();
$(".exam-header .view-stop a").before(html);
if(question_num <= 1){
$(".back-date i").hide();
}else{
$(".back-date i").show();
}
$(".static-exam,.footer").show();
});
/** 查看解析 **/
$(".show_analysis").click(function(){
var type = $(this).data("type");
$(".static-exam dl").hide();
if(type == 'wrong'){
$(".static-exam .wrong").first().show();
window.type = 2;
// 添加搜藏标识
var html = $(".static-exam .wrong").first().find(".collect_hidden").html();
}else{
$(".static-exam dl").first().show();
window.type = 1;
// 添加搜藏标识
var html = $(".static-exam dl").first().find(".collect_hidden").html();
}
$(".exam-header .view-stop>i").remove();
$(".exam-header .view-stop a").before(html);
$(".exams_questions").show();
$(".exams_top").hide();
});
// 显示答题面板
$("#show-answer-card").click(function(){
if($(".answer-card").is(":hidden")){
$(".static-exam,.footer").hide();
$(".answer-card").show();
}else{
$(".static-exam,.footer").show();
$(".answer-card").hide();
}
});
/** 返回前一题 **/
$(".back-date i").click(function(){
if(window.type == 2){
// 获取下一个错题
var prev_obj = $(".static-exam dl:visible").prev(".wrong");
var question_num = prev_obj.length > 0 ? prev_obj.data("question_num") : 0;
}else{
var question_num = $(".static-exam dl:visible").data("question_num") - 1;
}
if(question_num <= 1){
if(window.type == 2){
$(".static-exam .wrong").first().show().siblings().hide();
}else{
$("#ex1").show().siblings().hide();
}
$(".back-date i").hide();
// 添加搜藏标识
var html = $(".static-exam dl").first().find(".collect_hidden").html();
$(".exam-header .view-stop>i").remove();
$(".exam-header .view-stop a").before(html);
}else{
if($("#ex"+question_num).length > 0){
$("#ex"+question_num).show().siblings().hide();
$(".back-date i").show();
// 添加搜藏标识
var html = $("#ex"+question_num).find(".collect_hidden").html();
$(".exam-header .view-stop>i").remove();
$(".exam-header .view-stop a").before(html);
}
}
});
// 搜藏
$(".exam-header .view-stop>i").die("click").live("click",function(){
var _this = $(this);
var action = _this.data('action');
var question_id = _this.data('question_id');
// 后台
$.post(U('exams/Index/collect'),{action:action,source_id:question_id},function(res){
if(typeof(res) != 'object'){
try{
var res = JSON.parse(res);
}catch(e){
ui.error("处理异常,请重新尝试");
return false;
}
}
if(res.status == 1){
if(action == 1){
_this.css("color","#F7B659");
_this.data('action',0);
var question_num = _this.data("question_num");
var collect_hidden = $("#ex"+question_num).find(".collect_hidden i");
collect_hidden.css("color","#F7B659");
collect_hidden.attr('data-action',0);
}else{
// 取消收藏
_this.css("color","#888");
_this.data('action',1);
var question_num = _this.data("question_num");
var collect_hidden = $("#ex"+question_num).find(".collect_hidden i");
collect_hidden.css("color","#888");
collect_hidden.attr('data-action',1);
}
return true;
}else{
ui.error(res.message);
return false;
}
});
});
});
</script>
\ No newline at end of file
apps/exams/Tpl/default/Index/examsroom_w3g_new.html 0 → 100644
<include file="__THEME__/public_header_w3g" />
<style type="text/css">
/*比较多用到的*/
.box {
display: flex;
display: -webkit-flex;
align-items: center;
}
.boxCn {
display: flex !important;
display: -webkit-flex;
align-items: center;
justify-content: center !important;
}
.flex1 {
flex: 1;
}
/*遮罩层*/
.mask {
position: fixed !important;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.5);
transition: all .3s ease-in-out;
z-index: 8;
}
.popUp {
background-color: #FFFFFF;
z-index: 10;
width: 16.875rem;
border-radius: 0.5rem;
overflow: hidden;
position: fixed;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.popUp_title {
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
font-size: 1.125rem;
height: 1.5625rem;
line-height: 1.5625rem;
margin-top: 0.9375rem;
padding: 0 1rem;
box-sizing: border-box;
text-align: center;
}
.popUp_content {
padding: 1rem 1rem;
box-sizing: border-box;
text-align: center;
font-size: 0.875rem;
color: #333333;
}
.popUp_btns {
border-top: 1px solid #eeeeee;
}
.popUp_btn {
flex: 1;
text-align: center;
line-height: 3.125rem;
height: 3.125rem;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
font-size: 1rem;
box-sizing: border-box;
background-color: #FFFFFF;
}
.popUp_btn0 {
color: #999999;
border-right: 1px solid #eeeeee;
}
.popUp_btn1 {
color: #65C000;
}
/*jixu*/
.stopBox {
width: 100%;
position: fixed;
top: 50%;
left: 50%;
z-index: 10;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.stopBtn {
width: 10rem;
height: 3rem;
line-height: 3rem;
display: block;
margin: 2rem auto;
color: #FFFFFF;
font-size: 1rem;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
box-sizing: border-box;
text-align: center;
border-radius: 1.5rem;
}
.stopBtn_on {
background-color: #A3E460;
}
.stopBtn_out {
border: 1px solid rgba(204, 204, 204, 1);
}
body {
background-color: #fff;
}
.testPaperTop {
height: 2.25rem;
padding: 0 0.75rem;
box-sizing: border-box;
border-bottom: 1px solid #F5F5F5;
width: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 1;
background-color: #FFFFFF;
}
.testPaperTop_time {
font-size: 0.75rem
}
.testPaperTop_da {
font-size: 0.75rem;
color: #999999;
}
.testPaperTop_pau {
margin-left: 1.875rem;
width: 0.75rem;
height: 0.75rem;
}
.testPaperBotm {
padding: 0.75rem 0.75rem 0.75rem;
box-sizing: border-box;
margin-top: 2.25rem;
}
.testPaperNum {
margin-right: 0.75rem;
color: #999999;
font-size: 0.75rem;
}
.testPaperLei {
font-size: 0.75rem;
color: #333333;
}
.testPaperColl {
width: 1rem;
height: 1rem;
}
.testPaperInfo {
margin-top: 0.5rem;
font-size: 1rem;
line-height: 1.875rem;
color: #333333;
}
.testPaperAnswer {
margin-top: 1rem;
align-items: flex-start;
}
.testPaperAnswer_num {
display: inline-block;
width: 2.25rem;
height: 2.25rem;
border-radius: 100%;
border: 1px solid rgba(163, 228, 96, 1);
text-align: center;
line-height: 2.25rem;
color: #65C000;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
font-size: 0.875rem;
margin-right: 0.75rem;
}
.testPaperAnswer_numAt {
background-color: #A3E460;
color: #FFFFFF;
}
.testPaperAnswer_desc {
line-height: 1.25rem;
margin: 0;
}
.testPaperBtns {
justify-content: space-between;
padding: 3rem 0.75rem 1rem;
box-sizing: border-box;
width: 100%;
}
.testPaperBtn {
width: 10rem;
height: 3rem;
line-height: 3rem;
text-align: center;
border: 1px solid rgba(163, 228, 96, 1);
border-radius: 1.5rem;
box-sizing: border-box;
font-size: 1rem;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #65C000;
}
.testPaperBtn1 {
color: #FFFFFF;
background: rgba(163, 228, 96, 1);
}
.testPaperJiedaPage {
padding: 0 0.75rem;
box-sizing: border-box;
}
.testPaperJiedaBox {
padding: 1rem 0;
}
.testPaperJiedaBtn {
color: #65C000;
font-size: 0.875rem;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
}
.testPaperJiedaBtn_icon {
margin-left: 0.5rem;
width: 0.75rem;
height: 0.75rem;
}
.testPaperAnswers {
padding: 0.5rem 0 0.25rem;
}
.testPaperAnswer {
padding: 0.5rem 0;
color: #333333;
font-size: 1rem;
margin: 0;
}
.testPaperAnswer_n {
color: #65C000;
}
.testPaperAnswer_e {
color: red;
}
.testPaperAnswer_infoBox {
padding: 0.1875rem 0.75rem 0.75rem;
box-sizing: border-box;
border-top: 1px solid #f5f5f5;
}
.testPaperAnswer_infoTitle {
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #333333;
font-size: 1rem;
padding: 0.75rem 0 0.75rem 0.75rem;
box-sizing: border-box;
position: relative;
margin: 0;
}
.testPaperAnswer_infoTitle::before {
content: "";
position: absolute;
left: 0;
top: 50%;
width: 4px;
height: 4px;
border-radius: 100%;
background-color: #A3E460;
margin-top: -2px;
}
.testPaperAnswer_info {
color: #333333;
font-size: 1rem;
line-height: 1.875rem;
}
</style>
<div id="app">
<div class="testPaperTop box">
<p class="testPaperTop_time flex1">{{countDown}}</p>
<span class="testPaperTop_da">答题卡</span>
<img @click="onCounting" class="testPaperTop_pau" :src="counting ? '__THEME__/img/pau.png' : '__THEME__/img/right_arrow.png'">
</div>
<div class="testPaperBotm">
<div class="box">
<span class="testPaperNum">{{current}}/{{totalQuestion}}</span>
<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 == 1" @click="onCollect(0)" class="testPaperColl" src="__THEME__/img/share_star.png">
</div>
<template v-if="showChoiceQuestion">
<div v-html="currentQuestion.content" class="testPaperInfo"></div>
<ul>
<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>
<div v-html="opt.value" class="testPaperAnswer_desc flex1" style="margin-top: 0.625rem;"></div>
</li>
</ul>
</template>
</div>
<div v-if="current == 1" class="testPaperBtns boxCn">
<p @click="onNextQuestion" class="testPaperBtn testPaperBtn1" style="width: 15rem;">下一题</p>
</div>
<div v-if="current > 1" class="testPaperBtns box">
<p @click="onPreviousQuestion" class="testPaperBtn">上一题</p>
<p @click="onNextQuestion" class="testPaperBtn testPaperBtn1">下一题 / 交卷</p>
</div>
<!-- 解析 -->
<div class="testPaperJiedaPage">
<div class="box testPaperJiedaBox">
<span @click="expand = !expand" class="testPaperJiedaBtn box">{{expand ? '收起解析' : '查看解析'}}<img class="testPaperJiedaBtn_icon" src="__THEME__/img/openBtn.png"></span>
</div>
<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 currentMyOptions" :key="index" :class="answer.right ? 'testPaperAnswer_n' : 'testPaperAnswer_e'">{{answer.key}}</span></li>
</ul>
<div v-if="expand" class="testPaperAnswer_infoBox">
<p class="testPaperAnswer_infoTitle">解析</p>
<div v-html="currentAnalyze" class="testPaperAnswer_info">
</div>
</div>
</div>
<!-- 交卷 -->
<div class="mask" v-if="showFinish">
<div class="popUp">
<p class="popUp_title">提示</p>
<div class="popUp_content">是否交卷并退出考试？</div>
<div class="popUp_btns box">
<span @click="onCancel" class="popUp_btn popUp_btn0 flex1">取消</span>
<span @click="onSure" class="popUp_btn popUp_btn1 flex1">确定</span>
</div>
</div>
</div>
<!-- 暂停 -->
<div class="mask" v-if="showPause">
<div class="stopBox">
<span @click="onContinue" class="stopBtn stopBtn_on">继续</span>
<span @click="onQuit" class="stopBtn stopBtn_out">退出</span>
</div>
</div>
</div>
<include file="__THEME__/public_footer_w3g" />
<script type="text/javascript">
new Vue({
el: "#app",
data: function() {
return {
info: {},
temp: {},
current: 1,
paperOptions: {},
counting: true,
countDown: "00:00:00",
timeConsumed: 0,
expand: false,
showPause: false,
showFinish: false,
//选项
currentOptions: [],
finished: []
}
},
computed: {
totalQuestion: function() {
let count = 0
let data = this.paperOptions.options_questions_data
this.paperOptions.options_type.forEach( r => {
count += data[r.question_type].length
})
return count
},
currentTypeIndex: function() {
let count = 0
let data = this.paperOptions.options_questions_data
let current = this.current
for(let i = 0; i < this.paperOptions.options_type.length; i++) {
let r = this.paperOptions.options_type[i]
let next = count + data[r.question_type].length
if(current > count && current <= next) {
return i
} else {
count = next
}
}
},
currentQuestions: function() {
let optionType = this.currentQuestionType
let questionType = optionType.question_type
let questionData = this.paperOptions.options_questions_data
let questions = questionData[questionType]
return questions
},
currentQuestionType: function() {
return this.paperOptions.options_type[this.currentTypeIndex]
},
currentQuestionTypeName: function() {
return this.currentQuestionType.type_info.question_type_title
},
currentQuestionTypeKey: function() {
return this.currentQuestionType.question_type_key
},
currentQuestion: function() {
let count = 0
let data = this.paperOptions.options_questions_data
let current = this.current
for(let i = 0; i < this.paperOptions.options_type.length; i++) {
let r = this.paperOptions.options_type[i]
let next = count + data[r.question_type].length
if(current > count && current <= next) {
return data[r.question_type][current - count - 1]
} else {
count = next
}
}
},
//选择题答案
currentRightOptions: function() {
return this.currentQuestion.answer_true_option
},
//我的答案
currentMyOptions: function() {
let cur = this.currentRightOptions
return this.currentOptions.filter( r => { return r.selected }).map( r => {
return {
right: cur.hx_indexOf( k => { return k == r.key }) != -1,
key: r.key
}
})
},
//解析
currentAnalyze: function() {
return this.currentQuestion.analyze
},
//Helper
showChoiceQuestion: function() {
let key = this.currentQuestionTypeKey
return key == 'radio' || key == 'multiselect' || key == 'judge'
}
},
created: function() {
this.info = {:json_encode($paper)};
this.temp = {:json_encode($tempData)};
this.paperOptions = {:json_encode($paper_options)};
this.initAnswerMode()
this.doCountDown()
console.log(this.info)
console.log(this.temp)
console.log(this.paperOptions)
},
watch: {
current: function(o, n) {
this.initAnswerMode()
}
},
methods: {
initAnswerMode: function() {
let q = this.currentQuestionTypeKey
switch(q) {
case "radio":
this.currentOptions = []
let Q = this.currentQuestion
let old = this.finished.hx_firstOf( r => { return r.qId == Q.exams_question_id })
for(let k in Q.answer_options) {
let value = Q.answer_options[k]
let select = old ? old.option == k : false
this.currentOptions.push({
key: k,
value: value,
selected: select
})
}
break
}
},
recordData: function() {
return {
paperId: this.info.exams_paper_id,
timeConsumed: this.timeConsumed,
questionIndex: this.current,
finished: this.finished
}
},
doCountDown: function() {
if(!this.counting) {
return
}
if(this.info.reply_time) {
let time = this.info.reply_time * 60 - this.timeConsumed
if(time <= 0) {
this.showFinish = true
} else {
let hours = Math.floor(time / 3600)
let minutes = Math.floor((time % 3600) / 60)
let seconds = Math.round(time % 60)
this.countDown = (hours < 10 ? '0' + hours : hours) + ":" + (minutes < 10 ? '0' + minutes : minutes) + ":" + (seconds < 10 ? '0' + seconds : seconds)
setTimeout(this.doCountDown, 1000)
this.timeConsumed += 1
}
} else {
this.countDown = "不限时"
}
},
onCollect: function(collect) {
let that = this
$.post(U('exams/Index/collect'), {
action: collect,
source_id: that.currentQuestion.exams_question_id
}, function(res) {
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 => {
r.selected = opt.key == r.key
})
}
},
onCounting: function() {
if(this.counting) {
this.counting = false
this.showPause = true
} else {
this.counting = true
this.doCountDown()
}
},
onContinue: function() {
this.showPause = false
this.onCounting()
},
onQuit: function() {
this.showPause = false
this.saveProgress()
},
onCancel: function() {
this.showFinish = false
window.history.back()
},
onSure: function() {
this.showFinish = false
this.submitPaper()
},
onNextQuestion: function() {
if(this.current < this.totalQuestion) {
this.cacheQuestion()
this.current += 1
} else {
let that = this
ui.confirm("已经是最后一题了,是否交卷?", { // 是否返回第一题
yes: function() {
that.submitPaper()
}
})
}
},
onPreviousQuestion: function() {
if(this.current > 1) {
this.current -= 1
}
},
cacheQuestion: function() {
let q = this.currentQuestion
let mode = this.finished.hx_firstOf( r => { return r.qId == q.exams_question_id })
if(mode) {
switch(this.currentQuestionTypeKey) {
case "radio":
let my = this.currentMyOptions
if(my.length > 0) {
mode.option = my[0].key
}
break
}
} else {
switch(this.currentQuestionTypeKey) {
case "radio":
let my = this.currentMyOptions
if(my.length > 0) {
this.finished.push({
qId: q.exams_question_id,
option: my[0].key
})
}
break
}
}
},
//Request
saveProgress: function() {
let that = this
let param = {
paper_id: that.info.exams_paper_id
}
},
submitPaper: function() {
}
}
})
</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