exam_history.html 7.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>试卷列表</title>
  6. <link rel="apple-touch-icon" href="apple-touch-icon.png">
  7. <meta name="viewport" content="initial-scale=1.0, maximum-scale=1, user-scalable=no">
  8. <link rel="icon" href="favicon.ico" type="image/x-icon"/>
  9. <script>
  10. window.addEventListener('resize', setHtmlFontSize)
  11. setHtmlFontSize();
  12. function setHtmlFontSize() {
  13. // 根据屏幕的宽度来改变根元素的字体大小的值
  14. // 当前屏幕 / 标准的375屏幕 求得你当前屏幕是标准屏幕的多少倍 * 标准屏幕根元素的字体大小
  15. // 当前屏幕的宽度 / 375 * 100
  16. // 假如当前750/375 = 2 * 100 == 200px
  17. // 1. 当前屏幕的宽度
  18. var windowWidth = document.documentElement.offsetWidth;
  19. // 限制最大屏幕 和最小屏幕
  20. if (windowWidth > 1200) {
  21. document.querySelector('html').style.fontSize = 10 + 'px';
  22. return;
  23. } else if (windowWidth > 750) {
  24. windowWidth = 750;
  25. } else if (windowWidth < 375) {
  26. windowWidth = 375;
  27. }
  28. //2. 标准屏幕的宽度
  29. var StandardWidth = 375;
  30. // 标准屏幕的html的字体大小
  31. var StandardHtmlFontSize = 10;
  32. //3. 当前屏幕需要设置的根元素的字体大小
  33. var htmlFontSize = windowWidth / StandardWidth * StandardHtmlFontSize;
  34. //4. 把当前计算的html 字体大小设置到页面的html元素上就可以
  35. document.querySelector('html').style.fontSize = htmlFontSize + 'px';
  36. }
  37. </script>
  38. <style>
  39. html, body {
  40. font-size: 1.6rem;
  41. }
  42. html, body {
  43. padding: 0;
  44. margin: 0;
  45. width: 100%;
  46. height: 100%;
  47. background: #fff;
  48. }
  49. #app {
  50. position: relative;
  51. height: 100%;
  52. max-width: 500px;
  53. }
  54. #app .van-cell {
  55. font-size: 1.6rem;
  56. }
  57. .header {
  58. width: 100%;
  59. height: 4.6rem;
  60. position: fixed;
  61. z-index: 1000;
  62. }
  63. .clear-header {
  64. width: 100%;
  65. height: 6rem;
  66. }
  67. [v-cloak] {
  68. display: none;
  69. }
  70. </style>
  71. </head>
  72. <body>
  73. <div id="app" v-cloak>
  74. <div class="header" v-if="user != 1">
  75. <van-nav-bar left-text="返回" left-arrow @click-left="onClickLeft">
  76. <div slot="title">
  77. <span v-if="num == 1">正式考试记录</span>
  78. <span v-if="num == 2">模拟考试记录</span>
  79. </div>
  80. </van-nav-bar>
  81. </div>
  82. <div class="clear-header" v-if="user != 1">
  83. </div>
  84. <div style="padding-bottom: 5rem" v-if="myList.length > 0">
  85. <van-cell-group>
  86. <van-cell v-for="(item,index) in myList" @click="goPageFn(item)" :key="index" :title="item.paperName">
  87. <div slot="default">
  88. <span style="color: green" v-if="item.totalMark >= item.passScore">{{item.totalMark}}分</span>
  89. <span style="color: red" v-if="item.totalMark < item.passScore">{{item.totalMark}}分</span>
  90. </div>
  91. <div slot="label" style="display: flex;justify-content: space-between">
  92. <p>{{item.createdTime}}</p>
  93. </div>
  94. </van-cell>
  95. </van-cell-group>
  96. </div>
  97. <div v-if="myList.length < 1">
  98. <p style="margin: 0 auto;text-align: center;margin-top: 5rem;color: #aaa">暂无数据</p>
  99. </div>
  100. </div>
  101. <script type="text/javascript" src="../../../assets/libs/layui/layui.js"></script>
  102. <script src="../../../assets/module/vue.js"></script>
  103. <script src="../../../assets/libs/jquery/jquery-3.2.1.min.js"></script>
  104. <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vant@2.2/lib/index.css">
  105. <script src="https://cdn.jsdelivr.net/npm/vant@2.2/lib/vant.min.js"></script>
  106. <script type="text/javascript" src="../../../assets/js/common.js?v=312"></script>
  107. <script>
  108. function getUrlParam(name) {
  109. var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
  110. //如果地址栏中出现中文则进行编码
  111. var r = encodeURI(window.location.search).substr(1).match(reg);
  112. if (r != null) {
  113. //将中文编码的字符重新变成中文
  114. return decodeURI(unescape(r[2]));
  115. }
  116. return null;
  117. }
  118. var postId = getUrlParam("postId");
  119. new Vue({
  120. el: "#app",
  121. data: {
  122. num: 1,
  123. user: '',
  124. limit: 1000,
  125. count: 1,
  126. myList: [],
  127. },
  128. mounted() {
  129. this.num = this.getQueryVariable('num');
  130. this.user = this.getQueryVariable('user');
  131. //获取试卷记录列表
  132. this.recordqueryFn();
  133. },
  134. methods: {
  135. getQueryVariable(variable) {
  136. var query = window.location.search.substring(1);
  137. var vars = query.split("&");
  138. for (var i = 0; i < vars.length; i++) {
  139. var pair = vars[i].split("=");
  140. if (pair[0] == variable) {
  141. return pair[1];
  142. }
  143. }
  144. return (false);
  145. },
  146. //获取试卷记录列表
  147. recordqueryFn() {
  148. let _this = this;
  149. layui.use(['uParas', 'admin'], () => {
  150. let admin = layui.admin;
  151. let uParas = layui.uParas;
  152. let url = uParas.baseUrl + '/ol/userTestPaper/record/query';
  153. let paperId = '';
  154. if (this.num == 2) {
  155. paperId = this.getQueryVariable('paperId');
  156. }
  157. $.ajax({
  158. type: 'get',
  159. url: url,
  160. data: {
  161. page: 1,
  162. limit: this.limit,
  163. paperId: paperId,
  164. status: this.num,
  165. },
  166. headers: {
  167. 'accept': 'application/json, text/javascript, */*; q=0.01',
  168. 'Authorization': localStorage.getItem('atoken')
  169. },
  170. success: function (res) {
  171. console.log(res);
  172. _this.myList = res.data;
  173. },
  174. });
  175. })
  176. },
  177. goPageFn(item) {
  178. if (this.user == 1) {
  179. let zindex = $(window.parent.document).find('.layui-layer-iframe').css('z-index');
  180. $(window.parent.document).find('.layui-layer-iframe').css({
  181. zIndex: zindex,
  182. width: '90%',
  183. height: '90%',
  184. position: 'absolute',
  185. top: '40px',
  186. left: '50px',
  187. })
  188. }
  189. location.href = './detail.html?recordId=' + item.recordId;
  190. },
  191. onClickLeft() {
  192. window.history.back(-1);
  193. },
  194. }
  195. })
  196. </script>
  197. </body>
  198. </html>