Home Explore Help
Sign In
GYEE_R.D
/
exam
9
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

2022-10-11 update

1. 编辑导出word的模板html
2. 调整考培档案页的下方表格自适应功能
3. 调整首页底部部门/职工 图表自适应高度功能
moccus 2 years ago
parent
109fbef707
commit
18b01c943d
3 changed files with 140 additions and 10 deletions
Unified View Show Diff Stats
  1. 2 2
      exam-06173-vue/src/utils/export-word.js
  2. 5 1
      exam-06173-vue/src/views/admin/stat/total/archives.vue
  3. 133 7
      exam-06173-vue/src/views/dashboard/index.vue

+ 2 - 2
exam-06173-vue/src/utils/export-word.js
View File 

@@ -1,7 +1,7 @@
 
-const Export2Word = (element, filename = '') => {
 
+const Export2Word = (elementStr, filename = '') => {
 
   var preHtml = "<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>Export HTML To Doc</title></head><body>";
 
   var preHtml = "<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>Export HTML To Doc</title></head><body>";
 
   var postHtml = "</body></html>";
 
   var postHtml = "</body></html>";
 
-  var html = preHtml + document.getElementById(element).innerHTML + postHtml;
 
+  var html = preHtml + elementStr + postHtml;
 
 
 
   var blob = new Blob(['\ufeff', html], {
 
   var blob = new Blob(['\ufeff', html], {
 
     type: 'application/msword'
 
     type: 'application/msword'

+ 5 - 1
exam-06173-vue/src/views/admin/stat/total/archives.vue
View File 

@@ -44,7 +44,7 @@
 
           ref="archivesTableRef-bm"
 
           ref="archivesTableRef-bm"
 
           :data="bmTableData"
 
           :data="bmTableData"
 
           border
 
           border
 
-          height="250"
 
+          :height="tableHeight"
 
           style="width: 100%"
 
           style="width: 100%"
 
         >
 
         >
 
           <el-table-column fixed="left" label="名称" align="center">
 
           <el-table-column fixed="left" label="名称" align="center">
 
@@ -193,11 +193,15 @@ export default {
 
       zgTableData: [],
 
       zgTableData: [],
 
       selectDeptCode: "",
 
       selectDeptCode: "",
 
       selectDeptName: "",
 
       selectDeptName: "",
 
+      tableHeight: 280,
 
     };
 
     };
 
   },
 
   },
 
 
 
   mounted() {
 
   mounted() {
 
     this.resetDate(this.radio);
 
     this.resetDate(this.radio);
 
+    window.addEventListener('resize', () => {
 
+      this.tableHeight = (window.innerHeight - 657) <= 280 ? 280 : window.innerHeight - 657
 
+    })
 
   },
 
   },
 
 
 
   methods: {
 
   methods: {

+ 133 - 7
exam-06173-vue/src/views/dashboard/index.vue
View File 

@@ -141,12 +141,12 @@
 
 
 
       <el-tabs v-model="tabActive" @tab-click="reLayoutTable">
 
       <el-tabs v-model="tabActive" @tab-click="reLayoutTable">
 
         <el-tab-pane class="chartItem" label="部门" name="bm">
 
         <el-tab-pane class="chartItem" label="部门" name="bm">
 
-          <div id="bmPxChartDom" style="width: 48%; height: 280px"></div>
 
-          <div id="bmKsChartDom" style="width: 48%; height: 280px"></div>
 
+          <div id="bmPxChartDom" style="width: 48%; height: 30vh"></div>
 
+          <div id="bmKsChartDom" style="width: 48%; height: 30vh"></div>
 
         </el-tab-pane>
 
         </el-tab-pane>
 
         <el-tab-pane class="chartItem" label="职工" name="zg">
 
         <el-tab-pane class="chartItem" label="职工" name="zg">
 
-          <div id="zgPxChartDom" style="width: 48%; height: 280px"></div>
 
-          <div id="zgKsChartDom" style="width: 48%; height: 280px"></div>
 
+          <div id="zgPxChartDom" style="width: 48%; height: 30vh"></div>
 
+          <div id="zgKsChartDom" style="width: 48%; height: 30vh"></div>
 
         </el-tab-pane>
 
         </el-tab-pane>
 
       </el-tabs>
 
       </el-tabs>
 
     </div>
 
     </div>
 
@@ -179,13 +179,131 @@ export default {
 
       getPassedRate,
 
       getPassedRate,
 
       getUserRank,
 
       getUserRank,
 
       getUserRate,
 
       getUserRate,
 
+      chart1: null,
 
+      chart2: null,
 
+      chart3: null,
 
+      chart4: null
 
     };
 
     };
 
   },
 
   },
 
   mounted() {
 
   mounted() {
 
     this.initChart();
 
     this.initChart();
 
     this.getCttTotal();
 
     this.getCttTotal();
 
     this.getCurrentExam();
 
     this.getCurrentExam();
 
-    // exportWord('app', 'app')
 
+    setTimeout(() => {
 
+      window.addEventListener('resize', () => {
 
+        if (this.chart1 && this.chart3) {
 
+          this.chart1.getDom().style.height = (window.innerHeight - 650)> 281 ? (window.innerHeight - 650) + 'px' : '281px'
 
+          this.chart1.resize()
 
+          this.chart3.getDom().style.height = (window.innerHeight - 650)> 281 ? (window.innerHeight - 650) + 'px' : '281px'
 
+          this.chart3.resize()
 
+        }
 
+        if (this.chart2 && this.chart4) {
 
+          this.chart2.getDom().style.height = (window.innerHeight - 650)> 281 ? (window.innerHeight - 650) + 'px' : '281px'
 
+          this.chart2.resize()
 
+          this.chart4.getDom().style.height = (window.innerHeight - 650)> 281 ? (window.innerHeight - 650) + 'px' : '281px'
 
+          this.chart4.resize()
 
+        }
 
+      })
 
+    }, 1000)
 
+    const htmlStr = `<style>table {border: none;width: 100%; text-align: center;border-collapse: collapse;} tr {height: 30px;} td {border: 1px solid black;}</style><div>档案编号:</div>
 
+	<table>
 
+		<tr>
 
+			<td width="10%">姓名</td>
 
+			<td width="20%">${this.$store.state.user.realName}</td>
 
+			<td width="20%">性别</td>
 
+			<td width="20%"></td>
 
+			<td width="20%">年龄</td>
 
+			<td width="10%"></td>
 
+		</tr>
 
+		<tr>
 
+			<td>参加工作时间</td>
 
+			<td colspan="2"></td>
 
+			<td>进入公司时间</td>
 
+			<td colspan="2"></td>
 
+		</tr>
 
+		<tr>
 
+			<td>工种</td>
 
+			<td colspan="2"></td>
 
+			<td>从业资格证书</td>
 
+			<td colspan="2"></td>
 
+		</tr>
 
+		<tr>
 
+			<td colspan="6">三级安全培训记录</td>
 
+		</tr>
 
+		<tr>
 
+			<td>序号</td>
 
+			<td>培训时间</td>
 
+			<td>培训内容</td>
 
+			<td>培训级别</td>
 
+			<td>培训评价</td>
 
+			<td>备注</td>
 
+		</tr>
 
+		<tr>
 
+			<td>1</td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+		</tr>
 
+		<tr>
 
+			<td>2</td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+		</tr>
 
+		<tr>
 
+			<td>3</td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+		</tr>
 
+		<tr>
 
+			<td>4</td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+		</tr>
 
+		<tr>
 
+			<td>5</td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+		</tr>
 
+		<tr>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+		</tr>
 
+		<tr>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+		</tr>
 
+		<tr>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+			<td></td>
 
+		</tr>
 
+	</table>`
 
+    // exportWord(htmlStr, 'app')
 
   },
 
   },
 
   methods: {
 
   methods: {
 
     // 获取统计数值
 
     // 获取统计数值
 
@@ -253,7 +371,11 @@ export default {
 
         statDateR: endDate
 
         statDateR: endDate
 
       }).then((res) => {
 
       }).then((res) => {
 
         let myChart = echarts.init(pxChartDom);
 
         let myChart = echarts.init(pxChartDom);
 
-
 
+        if (tabActive === 'bm') {
 
+          this.chart1 = myChart
 
+        } else {
 
+          this.chart2 = myChart
 
+        }
 
         let option;
 
         let option;
 
 
 
         let xAxisData = [];
 
         let xAxisData = [];
 
@@ -327,7 +449,11 @@ export default {
 
         statDateR: endDate,
 
         statDateR: endDate,
 
       }).then((res) => {
 
       }).then((res) => {
 
         let myChart = echarts.init(ksChartDom);
 
         let myChart = echarts.init(ksChartDom);
 
-
 
+        if (tabActive === 'bm') {
 
+          this.chart3 = myChart
 
+        } else {
 
+          this.chart4 = myChart
 
+        }
 
         let option;
 
         let option;
 
 
 
         let xAxisData = [];
 
         let xAxisData = [];