You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

209 lines
6.4 KiB

2 years ago
<!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">
<!--标准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 {
2 years ago
margin: 8px;
2 years ago
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.already {
color: #fff;
border: 1px solid #E73A30;
background-color: #E73A30;
}
</style>
</head>
<body>
2 years ago
<div class="mui-content">
<div class="mui-card">
<div class="mui-card-content">
<div class="mui-content-padded">
<p style="text-align: center;color: red;font-size: 16px;">本次成绩</p>
<p style="text-align: center;font-size: 16px;">得分100分 用时1小时36分05秒</p>
<div class="flex-container" id="answers"></div>
<script id="answersTemplate" type="text/x-jsrender">
{{for list}}
<a>{{:order_id}}</a>
{{/for}}
</script>
</div>
<!-- <div class="legend">
<div class="legend"><a class="already"></a><span>已做</span></div>
<div class="legend"><a></a><span>未做</span></div>
</div> -->
<p style="text-align: center;">开始时间2023-05-06 13:45:10 </p>
<p style="text-align: center;">交卷时间2023-05-06 13:45:10 </p>
</div>
</div>
2 years ago
2 years ago
2 years ago
<div class="mui-card" id="examinfo"></div>
<script id="myTemplate" type="text/x-jsrender">
<div class="mui-card-header" style="font-size:18px;line-height: 1.8;">{{:order_id}}、<font style="color:#E73A30;">[{{:type_name}}]</font>&nbsp{{:content}}</div>
<div class="mui-card-content" style="font-size:16px">
<div class="mui-card-content-inner mui-input-group">
{{for xuanxiang}}
<div class="mui-input-row mui-left">
<label style="width:100%;margin-left:10px">{{:key}}. {{:value}}</label>
2 years ago
</div>
2 years ago
{{/for}}
2 years ago
</div>
</div>
2 years ago
<div class="mui-card-footer">
<span>考生答案:A</span><span class="mui-icon mui-icon-closeempty" style="color:red"></span>
<span>正确答案:B</span>
</div>
</script>
2 years ago
</div>
<script src="../js/jquery.min.js"></script>
<script src="../js/jquery.cookie.min.js"></script>
<script src="../js/mui.min.js"></script>
<script src="../js/jsrender.min.js"></script>
<script>
$(function () {
var orderId = 1;
if ($.cookie('order_id')) {
orderId = $.cookie('order_id');
} else {
$.cookie('order_id', orderId, { path: '/' });
2 years ago
}
2 years ago
//获取题的信息
getQuestionInfo(orderId);
//获取答题卡信息
getAnswerSheet();
2 years ago
2 years ago
2 years ago
2 years ago
mui(".mui-content").on("tap", "a", function () {
2 years ago
console.log("123");
2 years ago
orderId = this.textContent;
getQuestionInfo(this.textContent);
2 years ago
2 years ago
})
// 根据题号获取题的信息
function getQuestionInfo(orderId) {
$.ajax({
url: "/FengHuang/exam/getQuestion?order_id=" + orderId,
async: false,
type: 'GET',
success: function (res) {
var template = $.templates('#myTemplate');
var htmlOutput = template.render(res);
$('#examinfo').html(htmlOutput);
}
});
};
// 获取答题卡信息
function getAnswerSheet() {
$.ajax({
2 years ago
url: "/FengHuang/exam/getPersonAllInfoAfterJiaoJuan",
2 years ago
async: false,
type: 'GET',
success: function (res) {
var template = $.templates('#answersTemplate');
var htmlOutput = template.render(res);
$('#answers').html(htmlOutput);
}
});
}
2 years ago
2 years ago
2 years ago
2 years ago
});
</script>
</body>
</html>