智慧校园考试-班级报告
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.

section_4.js 5.9KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204
  1. $(function () {
  2. function initviolationEcharts(list) {
  3. var itemStyle = {
  4. normal: {
  5. label: {
  6. show: true, //开启显示数值
  7. position: "top" //数值在上方显示
  8. }
  9. }
  10. };
  11. var num = [],
  12. xAxis_data = [];
  13. var curlegend = ["违纪人数"];
  14. var curclass = {
  15. num: 0,
  16. classname: ""
  17. };
  18. $.each(list.wjkm, function (idx, item) {
  19. if (item.num > curclass.num) {
  20. curclass = {
  21. num: item.num,
  22. classname: item.subjectname
  23. };
  24. }
  25. num.push(item.num);
  26. xAxis_data.push(item.subjectname);
  27. });
  28. $(".section_4 .subjectviolationMaxNum").text(curclass.classname);
  29. var curseries = [
  30. {
  31. name: "违纪人数",
  32. type: "bar",
  33. barWidth: $.UnitUtil.mm2px(5),
  34. // 柱状图最小高度
  35. barMinHeight: $.UnitUtil.mm2px(2),
  36. barGap: 0,
  37. data: num,
  38. itemStyle: itemStyle
  39. }
  40. ];
  41. var option = {
  42. animation: false,
  43. color: ["#5C99FF", "#FF5F56", "#5EC5C8", "#f1982b"],
  44. title: {
  45. text: "人",
  46. x: "left",
  47. y: "top",
  48. textStyle: {
  49. color: "#5F6E82",
  50. fontSize: $.UnitUtil.mm2px(3),
  51. fontWeight: 500
  52. }
  53. },
  54. legend: {
  55. itemWidth: $.UnitUtil.mm2px(2),
  56. itemHeight: $.UnitUtil.mm2px(2),
  57. top: "bottom",
  58. data: curlegend
  59. },
  60. grid: {
  61. top: $.UnitUtil.mm2px(10),
  62. left: 0,
  63. right: 0,
  64. bottom: $.UnitUtil.mm2px(8),
  65. containLabel: true
  66. },
  67. xAxis: [
  68. {
  69. type: "category",
  70. data: xAxis_data,
  71. axisLabel: {
  72. color: "#5F6E82" //更改坐标轴文字颜色
  73. },
  74. axisTick: {
  75. alignWithLabel: true
  76. },
  77. boundaryGap: true,
  78. triggerEvent: true,
  79. axisLine: {
  80. show: true, //是否显示轴线
  81. lineStyle: {
  82. color: "#DADADA" //刻度线的颜色
  83. }
  84. }
  85. }
  86. ],
  87. yAxis: [
  88. {
  89. type: "value",
  90. axisTick: {
  91. show: false //刻度
  92. },
  93. axisLine: {
  94. show: false, //是否显示轴线
  95. lineStyle: {
  96. color: "#DADADA" //刻度线的颜色
  97. }
  98. },
  99. splitLine: {
  100. //网格线
  101. lineStyle: {
  102. type: "dotted" //设置网格线类型 dotted:虚线 solid:实线
  103. },
  104. show: true //隐藏或显示
  105. },
  106. axisLabel: {
  107. color: "#5F6E82" //更改坐标轴文字颜色
  108. }
  109. }
  110. ],
  111. series: curseries
  112. };
  113. var myEcharts = echarts.init(
  114. document.querySelector(".section_4 #violationEcharts")
  115. );
  116. myEcharts.clear();
  117. myEcharts.setOption(option);
  118. showviolationtable(list);
  119. }
  120. function showviolationtable(list) {
  121. var table = {},
  122. goodTableHeadTr1Html =
  123. '<th colspan="2">考试信息</th><th colspan="' +
  124. list.wjkm.length +
  125. '">科目信息</th>',
  126. goodTableHeadTr2Html = "<th>姓名</th><th>账号</th>",
  127. trHtml = "";
  128. var surplusheight = pageheight - ($(".section_4 .violationheight").height()); //本页剩余高度
  129. var henght = 62.5; //表头62.5 一行高27.5
  130. var pagedaba = {
  131. 0: ""
  132. }, page = 0;
  133. var maxstu = {
  134. num: 0,
  135. username:""
  136. }
  137. var pagesheight = {
  138. 0:0
  139. }
  140. $.each(list.wjkm, function (idx, item) {
  141. goodTableHeadTr2Html += "<th>" + item.subjectname + "</th>";
  142. });
  143. $.each(list.wjfx, function (idx, item) {
  144. henght += 27.5;
  145. pagesheight[page] = 62.5+henght;
  146. if (page == 0 && (henght > surplusheight || surplusheight - henght < 27.5)) {
  147. // 加第一页
  148. page++
  149. henght = 0;
  150. pagedaba[page] = "";
  151. }
  152. if (henght > pageheight && surplusheight - henght < 27.5) {
  153. page++
  154. henght = 0;
  155. pagedaba[page] = "";
  156. console.log(page);
  157. }
  158. item.subjectjson = item.subjectjson ? JSON.parse(item.subjectjson) : [];
  159. var subject_num = {};
  160. pagedaba[page] += "<tr><td>" + item.username + "</td><td>" + item.loginname + "</td>";
  161. var num = 0;
  162. $.each(item.subjectjson, function (idx, item) {
  163. num += item.num;
  164. subject_num[item.subjectid] = item.num || 0;
  165. })
  166. if (num > maxstu.num) {
  167. maxstu = {
  168. num: num,
  169. username:item.username
  170. }
  171. } else if (num == maxstu.num){
  172. maxstu.username+='、'+item.username
  173. }
  174. $.each(list.wjkm,function (idx, item){
  175. pagedaba[page] += "<td>" + (subject_num[item.subjectid]|| 0) + "</td>";
  176. })
  177. });
  178. console.log(pagesheight);
  179. console.log(maxstu);
  180. var maxstuhtml = '<div class="echarts_result"><div>上图统计结果表示:</div><div class="echarts_result_content"><span class="dot bg_5699FF"></span>违纪行为最多的学生:'+maxstu.username +'</div></div>';
  181. for (var i = 0; i <= page; i++){
  182. table[i] = '<table border="1" class="my_table"><thead><tr class="goodTableHeadTr1">' +
  183. goodTableHeadTr1Html +
  184. '</tr><tr class="goodTableHeadTr2">' +
  185. goodTableHeadTr2Html +
  186. '</tr></thead><tbody class="goodTableTbody">' +
  187. pagedaba[i] +
  188. "</tbody></table>";
  189. if (i != 0) {
  190. //添加分页
  191. $(".page_"+ (i-1)+".section_4").after(
  192. '<div class="page_root section_4'+' page_'+i+'"></div>'
  193. );
  194. $(".page_root.section_4"+'.page_'+i).html(table[i]);
  195. }
  196. }
  197. $(".section_4 .stuViolationtable").html(table[0]);
  198. }
  199. var parameter = $(".section_4_html_root").data("page-params");
  200. parameter = JSON.parse(parameter);
  201. initviolationEcharts(parameter);
  202. console.log(parameter);
  203. });