xhkjedu
/
schoolReportPDF
ウォッチ 8
スター 0
フォーク 0
コード 課題 0 プルリクエスト 0 リリース 0 Wiki アクティビティ
ソースを参照

类名分块

wzl_h
guozhongbo 2年前
親
e4e985dcb9
コミット
3afc17ae23
3個のファイルの変更、49行の追加、11行の削除
分割表示 差分情報を表示
  1. 22
    4
      css/section_1.css
  2. 3
    3
      js/index.js
  3. 24
    4
      sections/section_1.html

+ 22
- 4
css/section_1.css ファイルの表示 

@@ -2,7 +2,7 @@
2 2 
   height: 20mm;
3 3 
   margin-bottom: 5mm;
4 4 
 }
5 
-.section_item{
5 
+.section1 .section_item{
6 6 
   width: 26mm;
7 7 
   background-color: #f5f7f9;
8 8 
   border-radius: 3mm;
 
@@ -15,20 +15,38 @@
15 15 
 .section_item:nth-last-child(1){
16 16 
   margin-right: 0;
17 17 
 }
18 
-.item_num{
18 
+.section1 .item_num{
19 19 
   height: 5mm;
20 20 
   font-size: 3mm;
21 21 
   color: #999999;
22 22 
   text-align: center;
23 23 
   margin-bottom: 2mm;
24 24 
 }
25 
-.item_num>span{
25 
+.section1 .item_num>span{
26 26 
   font-size: 5mm;
27 27 
   color: #ff6b00;
28 
+  margin-right: 1mm;
28 29 
 }
29 
-.item_title{
30 
+.section1 .item_title{
30 31 
   text-align: center;
31 32 
   height: 4mm;
32 33 
   font-size: 4mm;
33 34 
   color: #333333;
35 
+}
36 
+.echarts_result{
37 
+  margin-bottom: 4mm;
38 
+    padding: 3mm;
39 
+    background-color: #F5F7F9;
40 
+}
41 
+.echarts_result_content>span {
42 
+    display: inline-block;
43 
+    margin-right: 2mm;
44 
+    width: 2mm;
45 
+    height: 2mm;
46 
+    border-radius: 50%;
47 
+}
48 
+.echarts_result_content {
49 
+    margin-top: 3mm;
50 
+    padding: 3mm;
51 
+    background-color: #fff;
34 52 
 }

+ 3
- 3
js/index.js ファイルの表示 

@@ -1,8 +1,8 @@
1 1 
 $(function () {
2 2 
   let loadHtmlArr = [
3 
-    "cover",
4 
-    // "catalog",
5 
-    "preface",
3 
+    // "cover",
4 
+    // // "catalog",
5 
+    // "preface",
6 6 
     "section_1",
7 7 
     "section_2",
8 8 
     "section_3",

+ 24
- 4
sections/section_1.html ファイルの表示 

@@ -8,7 +8,7 @@
8 8 
     <link rel="stylesheet" href="./css/section_1.css" />
9 9 
   </head>
10 10 
   <body>
11 
-    <div class="page_root">
11 
+    <div class="page_root section1">
12 12 
       <h1 class="section_title_1">第一章 考试概况</h1>
13 13 
       <div class="abstract_box">
14 14 
         <div class="abstract_left">

@@ -57,10 +57,30 @@
57 57 
       <h3 class="section_title_3">
58 58 
         2.1 各科满分、最高分、最低分、平均分对比分析
59 59 
       </h3>
60 
-      <h4 class="section_title_4">
61 
-        2.1.1 各科满分、最高分、最低分、平均分对比分析
62 
-      </h4>
60 
+      <div id="subjectEcharts" style="margin: 0 4mm 4mm; height: 71mm"></div>
61 
+      <div class="echarts_result">
62 
+        <div>上图统计结果表示：</div>
63 
+        <div class="echarts_result_content">
64 
+          <span style="background-color: #ff5d41"></span>满分人数最多科目：英语
65 
+        </div>
66 
+      </div>
67 
+    </div>
68 
+    <div class="page_root section1">
69 
+      <h3 class="section_title_3">
70 
+        2.1 各科优秀率、良好率、及格率、低分率对比分析
71 
+      </h3>
72 
+      <div id="subjectEcharts" style="margin: 0 4mm 4mm; height: 80mm"></div>
73 
+      <div class="echarts_result">
74 
+        <div>上图统计结果表示：</div>
75 
+        <div class="echarts_result_content">
76 
+          <span style="background-color: #ff5d41"></span>优秀率最高的科目：英语
77 
+        </div>
78 
+        <div class="echarts_result_content">
79 
+          <span style="background-color: #ff5d41"></span>优秀率最高的科目：英语
80 
+        </div>
81 
+      </div>
63 82 
     </div>
83 
+    <div class="page_root section1"></div>
64 84 
     <script src="../js/section_1.js"></script>
65 85 
   </body>
66 86 
 </html>

書き込み プレビュー
読み込み中…
キャンセル
保存