|
|
<!DOCTYPE html>
|
|
|
<html>
|
|
|
|
|
|
<head>
|
|
|
<meta charset="utf-8">
|
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
|
|
|
<meta name="apple-mobile-web-app-capable" content="yes">
|
|
|
<meta name="apple-mobile-web-app-status-bar-style" content="black">
|
|
|
<title>知识答题</title>
|
|
|
|
|
|
<!--标准mui.css-->
|
|
|
<link rel="stylesheet" href="../css/mui.min.css">
|
|
|
<!--App自定义的css-->
|
|
|
<link rel="stylesheet" type="text/css" href="../css/app.css" />
|
|
|
<style>
|
|
|
.flex-container {
|
|
|
display: -webkit-box;
|
|
|
display: -webkit-flex;
|
|
|
display: flex;
|
|
|
-webkit-flex-flow: row wrap;
|
|
|
/* justify-content: space-between; */
|
|
|
text-align: center;
|
|
|
}
|
|
|
|
|
|
.mui-content-padded {
|
|
|
padding: 10px;
|
|
|
}
|
|
|
|
|
|
.mui-content-padded a {
|
|
|
margin: 8px;
|
|
|
width: 35px;
|
|
|
height: 35px;
|
|
|
display: flex;
|
|
|
justify-content: center;
|
|
|
align-items: center;
|
|
|
background-color: #fff;
|
|
|
border: 1px solid #ddd;
|
|
|
border-radius: 25px;
|
|
|
background-clip: padding-box;
|
|
|
}
|
|
|
|
|
|
.legend {
|
|
|
display: flex;
|
|
|
justify-content: space-around;
|
|
|
align-items: center;
|
|
|
}
|
|
|
|
|
|
.legend a {
|
|
|
margin: 10px;
|
|
|
width: 20px;
|
|
|
height: 20px;
|
|
|
display: flex;
|
|
|
justify-content: center;
|
|
|
align-items: center;
|
|
|
background-color: #fff;
|
|
|
border: 1px solid #ddd;
|
|
|
border-radius: 25px;
|
|
|
background-clip: padding-box;
|
|
|
}
|
|
|
|
|
|
.legend span {
|
|
|
font-size: 14px;
|
|
|
}
|
|
|
|
|
|
.mui-content-padded a .mui-icon {
|
|
|
margin-top: 12px;
|
|
|
}
|
|
|
|
|
|
.mui-spinner,
|
|
|
.mui-spinner-white {
|
|
|
margin-top: 12px
|
|
|
}
|
|
|
|
|
|
.active .mui-spinner-indicator {
|
|
|
background: #007AFF;
|
|
|
}
|
|
|
|
|
|
.mui-content a {
|
|
|
color: #8F8F94;
|
|
|
}
|
|
|
|
|
|
.mui-content a.wrong {
|
|
|
color: #fff;
|
|
|
border: 1px solid #e74c3c;
|
|
|
background-color: #e74c3c;
|
|
|
}
|
|
|
|
|
|
.mui-content a.right {
|
|
|
color: #fff;
|
|
|
border: 1px solid #27ae60;
|
|
|
background-color: #27ae60;
|
|
|
}
|
|
|
|
|
|
body {
|
|
|
background-image: url("../images/bg_img.png");
|
|
|
}
|
|
|
|
|
|
.star {
|
|
|
position: absolute;
|
|
|
top: 3px;
|
|
|
left: 50%;
|
|
|
transform: translate(-50%, -50%);
|
|
|
width: 40px;
|
|
|
height: 40px;
|
|
|
}
|
|
|
|
|
|
.num {
|
|
|
position: absolute;
|
|
|
top: 3px;
|
|
|
left: 50%;
|
|
|
transform: translate(-50%, -50%);
|
|
|
color: #FFF5E1;
|
|
|
font-weight: bolder;
|
|
|
font-size: 16px;
|
|
|
}
|
|
|
|
|
|
.mui-card-header::after {
|
|
|
display: none !important;
|
|
|
}
|
|
|
|
|
|
.mui-input-row.mui-left::after {
|
|
|
display: none !important;
|
|
|
}
|
|
|
|
|
|
.mui-input-group::after {
|
|
|
display: none !important;
|
|
|
}
|
|
|
|
|
|
/* .mui-card-footer::before {
|
|
|
display: none !important;
|
|
|
} */
|
|
|
|
|
|
</style>
|
|
|
</head>
|
|
|
|
|
|
<body>
|
|
|
<!-- <header class="mui-bar mui-bar-nav" style="height: 70px;text-align: center;font-size: 14px;font-weight:bolder;">
|
|
|
<div style="margin-top: 3px;">“学深悟透担使命，踔厉奋发建新功”</div>
|
|
|
<div>长春市教育局学习贯彻习近平新时代中国特色社会主义思想</div>
|
|
|
<div>知识答题活动</div>
|
|
|
</header> -->
|
|
|
|
|
|
<div class="mui-content" style="margin-top: 25px;">
|
|
|
<div class="mui-card">
|
|
|
<div class="mui-card-content" style="background-color: #FFF5E1;">
|
|
|
<div class="mui-content-padded" id="answers">
|
|
|
|
|
|
|
|
|
<script id="answersTemplate" type="text/x-jsrender">
|
|
|
<p style="text-align: center;color: #E5AA7A;font-size: 18px;font-weight: bold;">本次成绩</p>
|
|
|
<p style="text-align: center;font-size: 12px;">交卷时间：{{:end_time}} </p>
|
|
|
<p style="text-align: center;font-size: 16px;">得分：<span style="color: red;font-weight: bold;font-size: 20px;">{{:sum}}</span> 分
|
|
|
     用时：<span style="color: red;font-weight: bold;font-size: 20px;">{{:ys}}</span></p>
|
|
|
<div class="flex-container" >
|
|
|
{{for list}}
|
|
|
{{if flag == 0}}
|
|
|
<a>{{:order_id}}</a>
|
|
|
{{else flag == 1}}
|
|
|
<a class="right">{{:order_id}}</a>
|
|
|
{{else }}
|
|
|
<a class="wrong">{{:order_id}}</a>
|
|
|
{{/if}}
|
|
|
|
|
|
{{/for}}
|
|
|
</div>
|
|
|
</script>
|
|
|
</div>
|
|
|
<div class="legend">
|
|
|
<div class="legend"><a></a><span>未做</span></div>
|
|
|
<div class="legend"><a class="right"></a><span>正确</span></div>
|
|
|
<div class="legend"><a class="wrong"></a><span>错误</span></div>
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="mui-card" id="examinfo" style="background-color: #FFF5E1;margin-top: 25px;"></div>
|
|
|
<script id="myTemplate" type="text/x-jsrender">
|
|
|
<img class="star" style="filter: drop-shadow(0px 1px 2px #576574)" src="../images/tihao.svg">
|
|
|
<div class="num">{{:order_id}}</div>
|
|
|
<div class="mui-card-header" style="font-size:18px;line-height: 1.8;padding-top: 25px;"><font style="color:#DD524D;">[{{:type_name}}]</font> {{:content}}</div>
|
|
|
<div class="mui-card-content" style="font-size:16px">
|
|
|
<div class="mui-card-content-inner mui-input-group" style="background-color: #FFF5E1;padding-bottom: 15px;">
|
|
|
{{for xuanxiang}}
|
|
|
<div class="mui-input-row mui-left">
|
|
|
<label style="width:100%;margin-left:10px">{{:key}}. {{:value}}</label>
|
|
|
</div>
|
|
|
{{/for}}
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="mui-card-footer" >
|
|
|
|
|
|
{{if flag == 1}}
|
|
|
<span>考生答案：<span style="color:#27ae60;">{{:reply}}</span></span>
|
|
|
<span class="mui-icon mui-icon-checkmarkempty" style="color:#27ae60;"></span>
|
|
|
{{else}}
|
|
|
<span>考生答案：<span style="color:#e74c3c;">{{:reply}}</span></span>
|
|
|
<span class="mui-icon mui-icon-closeempty" style="color:#e74c3c;"></span>
|
|
|
{{/if}}
|
|
|
<span style="margin-left:50px">正确答案：<span style="color:#27ae60;">{{:answer}}</span></span>
|
|
|
</div>
|
|
|
<!-- <div class="mui-card-footer">解析：{{:memo}}</div> -->
|
|
|
</script>
|
|
|
</div>
|
|
|
|
|
|
<script src="../js/jquery.min.js"></script>
|
|
|
<script src="../js/mui.min.js"></script>
|
|
|
<script src="../js/jsrender.min.js"></script>
|
|
|
<script>
|
|
|
$(function () {
|
|
|
|
|
|
//获取答题卡信息
|
|
|
getAnswerSheet();
|
|
|
|
|
|
mui(".mui-content").on("tap", "a", function () {
|
|
|
orderId = this.textContent;
|
|
|
getQuestionInfo(this.textContent);
|
|
|
})
|
|
|
|
|
|
|
|
|
// 根据题号获取题的信息
|
|
|
function getQuestionInfo(orderId) {
|
|
|
$.ajax({
|
|
|
url: "/FengHuang/exam/getQuestion?order_id=" + orderId + "&finish=1",
|
|
|
async: false,
|
|
|
type: 'GET',
|
|
|
success: function (res) {
|
|
|
var template = $.templates('#myTemplate');
|
|
|
var htmlOutput = template.render(res);
|
|
|
$('#examinfo').html(htmlOutput);
|
|
|
}
|
|
|
});
|
|
|
};
|
|
|
|
|
|
// 获取答题卡信息
|
|
|
function getAnswerSheet() {
|
|
|
$.ajax({
|
|
|
url: "/FengHuang/exam/getPersonAllInfoAfterJiaoJuan",
|
|
|
async: false,
|
|
|
type: 'GET',
|
|
|
success: function (res) {
|
|
|
var template = $.templates('#answersTemplate');
|
|
|
var htmlOutput = template.render(res);
|
|
|
$('#answers').html(htmlOutput);
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</script>
|
|
|
</body>
|
|
|
|
|
|
</html> |
