From 6607dd287ba4202831f9c39bbb4b50ffb32cf8a1 Mon Sep 17 00:00:00 2001
From: yujialong <479214531@qq.com>
Date: Thu, 3 Jun 2021 14:23:08 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AF=BC=E5=87=BA=E5=AE=9E=E9=AA=8C=E6=8A=A5?=
 =?UTF-8?q?=E5=91=8A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package-lock.json                          | 130 +++++++++++++++++++++
 package.json                               |   2 +
 src/components/page/Dashboard.vue          |   2 +-
 src/components/page/Experiment.vue         |   2 +-
 src/components/page/ExperimentAss.vue      |   2 +-
 src/components/page/ExperimentTeach.vue    |   2 +-
 src/components/page/ExperimentVir.vue      |   2 +-
 src/components/page/ShowExperiment.vue     |  48 ++++++++
 src/components/page/Student.vue            |   2 +-
 src/components/page/classExperimentAss.vue |   2 +-
 10 files changed, 187 insertions(+), 7 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index c6b41d1..ea001da 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -820,6 +820,24 @@
         }
       }
     },
+    "@babel/runtime-corejs3": {
+      "version": "7.14.0",
+      "resolved": "https://registry.npmjs.org/@babel/runtime-corejs3/-/runtime-corejs3-7.14.0.tgz",
+      "integrity": "sha512-0R0HTZWHLk6G8jIk0FtoX+AatCtKnswS98VhXwGImFc759PJRp4Tru0PQYZofyijTFUr+gT8Mu7sgXVJLQ0ceg==",
+      "optional": true,
+      "requires": {
+        "core-js-pure": "^3.0.0",
+        "regenerator-runtime": "^0.13.4"
+      },
+      "dependencies": {
+        "regenerator-runtime": {
+          "version": "0.13.7",
+          "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.7.tgz",
+          "integrity": "sha512-a54FxoJDIr27pgf7IgeQGxmqUNYrcV338lf/6gH456HZ/PhX+5BcwHXG9ajESmwe6WRO0tAzRUrRmNONWgkrew==",
+          "optional": true
+        }
+      }
+    },
     "@babel/template": {
       "version": "7.7.4",
       "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.7.4.tgz",
@@ -1048,6 +1066,12 @@
       "integrity": "sha512-ce5d3q03Ex0sy4R14722Rmt6MT07Ua+k4FwDfdcToYJcMKNtRVQvJ6JCAPdAmAnbRb6CsX6aYb9m96NGod9uTw==",
       "dev": true
     },
+    "@types/raf": {
+      "version": "3.4.0",
+      "resolved": "https://registry.npmjs.org/@types/raf/-/raf-3.4.0.tgz",
+      "integrity": "sha512-taW5/WYqo36N7V39oYyHP9Ipfd5pNFvGTIQsNGj86xV88YQ7GnI30/yMfKDF7Zgin0m3e+ikX88FvImnK4RjGw==",
+      "optional": true
+    },
     "@vue/babel-helper-vue-jsx-merge-props": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.0.0.tgz",
@@ -2156,6 +2180,11 @@
         }
       }
     },
+    "base64-arraybuffer": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/base64-arraybuffer/-/base64-arraybuffer-0.2.0.tgz",
+      "integrity": "sha512-7emyCsu1/xiBXgQZrscw/8KPRT44I4Yq9Pe6EGs3aPRTsWuggML1/1DTuZUuIaJPIm1FTDUVXl4x/yW8s0kQDQ=="
+    },
     "base64-js": {
       "version": "1.3.1",
       "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.3.1.tgz",
@@ -2440,6 +2469,11 @@
         "node-releases": "^1.1.41"
       }
     },
+    "btoa": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/btoa/-/btoa-1.2.1.tgz",
+      "integrity": "sha512-SB4/MIGlsiVkMcHmT+pSmIPoNDoHg+7cMzmt3Uxt628MTz2487DKSqK/fuhFBrkuqrYv5UCEnACpF4dTFNKc/g=="
+    },
     "buffer": {
       "version": "4.9.2",
       "resolved": "https://registry.npmjs.org/buffer/-/buffer-4.9.2.tgz",
@@ -2611,6 +2645,20 @@
       "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001012.tgz",
       "integrity": "sha512-7RR4Uh04t9K1uYRWzOJmzplgEOAXbfK72oVNokCdMzA67trrhPzy93ahKk1AWHiA0c58tD2P+NHqxrA8FZ+Trg=="
     },
+    "canvg": {
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/canvg/-/canvg-3.0.7.tgz",
+      "integrity": "sha512-4sq6iL5Q4VOXS3PL1BapiXIZItpxYyANVzsAKpTPS5oq4u3SKbGfUcbZh2gdLCQ3jWpG/y5wRkMlBBAJhXeiZA==",
+      "optional": true,
+      "requires": {
+        "@babel/runtime-corejs3": "^7.9.6",
+        "@types/raf": "^3.4.0",
+        "raf": "^3.4.1",
+        "rgbcolor": "^1.0.1",
+        "stackblur-canvas": "^2.0.0",
+        "svg-pathdata": "^5.0.5"
+      }
+    },
     "case-sensitive-paths-webpack-plugin": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/case-sensitive-paths-webpack-plugin/-/case-sensitive-paths-webpack-plugin-2.2.0.tgz",
@@ -3262,6 +3310,12 @@
       "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.10.tgz",
       "integrity": "sha512-I39t74+4t+zau64EN1fE5v2W31Adtc/REhzWN+gWRRXg6WH5qAsZm62DHpQ1+Yhe4047T55jvzz7MUqF/dBBlA=="
     },
+    "core-js-pure": {
+      "version": "3.13.1",
+      "resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.13.1.tgz",
+      "integrity": "sha512-wVlh0IAi2t1iOEh16y4u1TRk6ubd4KvLE8dlMi+3QUI6SfKphQUh7tAwihGGSQ8affxEXpVIPpOdf9kjR4v4Pw==",
+      "optional": true
+    },
     "core-util-is": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
@@ -3395,6 +3449,14 @@
         "timsort": "^0.3.0"
       }
     },
+    "css-line-break": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/css-line-break/-/css-line-break-1.1.1.tgz",
+      "integrity": "sha512-1feNVaM4Fyzdj4mKPIQNL2n70MmuYzAXZ1aytlROFX1JsOo070OsugwGjj7nl6jnDJWHDM8zRZswkmeYVWZJQA==",
+      "requires": {
+        "base64-arraybuffer": "^0.2.0"
+      }
+    },
     "css-loader": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-1.0.1.tgz",
@@ -4062,6 +4124,12 @@
         "domelementtype": "1"
       }
     },
+    "dompurify": {
+      "version": "2.2.9",
+      "resolved": "https://registry.npmjs.org/dompurify/-/dompurify-2.2.9.tgz",
+      "integrity": "sha512-+9MqacuigMIZ+1+EwoEltogyWGFTJZWU3258Rupxs+2CGs4H914G9er6pZbsme/bvb5L67o2rade9n21e4RW/w==",
+      "optional": true
+    },
     "domutils": {
       "version": "1.7.0",
       "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.7.0.tgz",
@@ -4796,6 +4864,11 @@
         "websocket-driver": ">=0.5.1"
       }
     },
+    "fflate": {
+      "version": "0.4.8",
+      "resolved": "https://registry.npmjs.org/fflate/-/fflate-0.4.8.tgz",
+      "integrity": "sha512-FJqqoDBR00Mdj9ppamLa/Y7vxm+PRmNWA67N846RvsoYVMKB4q3y/de5PA7gUmRMYK/8CMz2GDZQmCRN1wBcWA=="
+    },
     "figgy-pudding": {
       "version": "3.5.1",
       "resolved": "https://registry.npmjs.org/figgy-pudding/-/figgy-pudding-3.5.1.tgz",
@@ -6878,6 +6951,14 @@
         }
       }
     },
+    "html2canvas": {
+      "version": "1.0.0-rc.7",
+      "resolved": "https://registry.npmjs.org/html2canvas/-/html2canvas-1.0.0-rc.7.tgz",
+      "integrity": "sha512-yvPNZGejB2KOyKleZspjK/NruXVQuowu8NnV2HYG7gW7ytzl+umffbtUI62v2dCHQLDdsK6HIDtyJZ0W3neerA==",
+      "requires": {
+        "css-line-break": "1.1.1"
+      }
+    },
     "htmlparser2": {
       "version": "3.10.1",
       "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.10.1.tgz",
@@ -7625,6 +7706,28 @@
         "graceful-fs": "^4.1.6"
       }
     },
+    "jspdf": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/jspdf/-/jspdf-2.3.1.tgz",
+      "integrity": "sha512-1vp0USP1mQi1h7NKpwxjFgQkJ5ncZvtH858aLpycUc/M+r/RpWJT8PixAU7Cw/3fPd4fpC8eB/Bj42LnsR21YQ==",
+      "requires": {
+        "atob": "^2.1.2",
+        "btoa": "^1.2.1",
+        "canvg": "^3.0.6",
+        "core-js": "^3.6.0",
+        "dompurify": "^2.2.0",
+        "fflate": "^0.4.8",
+        "html2canvas": "^1.0.0-rc.5"
+      },
+      "dependencies": {
+        "core-js": {
+          "version": "3.13.1",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.13.1.tgz",
+          "integrity": "sha512-JqveUc4igkqwStL2RTRn/EPFGBOfEZHxJl/8ej1mXJR75V3go2mFF4bmUYkEIT1rveHKnkUlcJX/c+f1TyIovQ==",
+          "optional": true
+        }
+      }
+    },
     "jsprim": {
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.1.tgz",
@@ -10287,6 +10390,15 @@
         "fast-diff": "1.1.2"
       }
     },
+    "raf": {
+      "version": "3.4.1",
+      "resolved": "https://registry.npmjs.org/raf/-/raf-3.4.1.tgz",
+      "integrity": "sha512-Sq4CW4QhwOHE8ucn6J34MqtZCeWFP2aQSmrlroYgqAV1PjStIhJXxYuTgUIfkEk7zTLjmIjLmU5q+fbD1NnOJA==",
+      "optional": true,
+      "requires": {
+        "performance-now": "^2.1.0"
+      }
+    },
     "randombytes": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz",
@@ -10765,6 +10877,12 @@
       "integrity": "sha1-QzdOLiyglosO8VI0YLfXMP8i7rM=",
       "dev": true
     },
+    "rgbcolor": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/rgbcolor/-/rgbcolor-1.0.1.tgz",
+      "integrity": "sha1-1lBezbMEplldom+ktDMHMGd1lF0=",
+      "optional": true
+    },
     "rimraf": {
       "version": "2.7.1",
       "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
@@ -11618,6 +11736,12 @@
       "integrity": "sha512-ji9qxRnOVfcuLDySj9qzhGSEFVobyt1kIOSkj1qZzYLzq7Tos/oUUWvotUPQLlrsidqsK6tBH89Bc9kL5zHA6w==",
       "dev": true
     },
+    "stackblur-canvas": {
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/stackblur-canvas/-/stackblur-canvas-2.5.0.tgz",
+      "integrity": "sha512-EeNzTVfj+1In7aSLPKDD03F/ly4RxEuF/EX0YcOG0cKoPXs+SLZxDawQbexQDBzwROs4VKLWTOaZQlZkGBFEIQ==",
+      "optional": true
+    },
     "stackframe": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/stackframe/-/stackframe-1.1.0.tgz",
@@ -11855,6 +11979,12 @@
         "has-flag": "^3.0.0"
       }
     },
+    "svg-pathdata": {
+      "version": "5.0.5",
+      "resolved": "https://registry.npmjs.org/svg-pathdata/-/svg-pathdata-5.0.5.tgz",
+      "integrity": "sha512-TAAvLNSE3fEhyl/Da19JWfMAdhSXTYeviXsLSoDT1UM76ADj5ndwAPX1FKQEgB/gFMPavOy6tOqfalXKUiXrow==",
+      "optional": true
+    },
     "svg-tags": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/svg-tags/-/svg-tags-1.0.0.tgz",
diff --git a/package.json b/package.json
index 73eac07..ba06e83 100644
--- a/package.json
+++ b/package.json
@@ -13,6 +13,8 @@
     "echarts": "^4.9.0",
     "element-theme": "^2.0.1",
     "element-ui": "^2.13.0",
+    "html2canvas": "^1.0.0-rc.7",
+    "jspdf": "^2.3.1",
     "lodash": "^4.17.20",
     "mavon-editor": "^2.6.17",
     "postcss-px2rem": "^0.3.0",
diff --git a/src/components/page/Dashboard.vue b/src/components/page/Dashboard.vue
index d6249f9..66e39da 100644
--- a/src/components/page/Dashboard.vue
+++ b/src/components/page/Dashboard.vue
@@ -64,7 +64,7 @@
                                         </p>
                                         <p class="mat10">
                                             <span>创建时间：</span>
-                                            <span class="list-text">{{item.createTime}}日</span>
+                                            <span class="list-text">{{item.createTime}}</span>
                                         </p>
                                         <p class="mat10">
                                             <span>所属年份：</span>
diff --git a/src/components/page/Experiment.vue b/src/components/page/Experiment.vue
index 4c49a5c..84de78e 100644
--- a/src/components/page/Experiment.vue
+++ b/src/components/page/Experiment.vue
@@ -42,8 +42,8 @@
                     
                 </div>
                 <div>
+                    <el-button type="primary" size="small" @click="exportData">导出成绩列表</el-button>
                     <el-button type="primary" size="small" @click="delAllData">批量删除</el-button>
-                    <el-button type="primary" size="small" @click="exportData">导出</el-button>
                 </div>
             </div>
             <el-table :data="listData" class="table" ref="table" stripe header-align="center" @selection-change="handleSelectionChange" row-key="reportId">
diff --git a/src/components/page/ExperimentAss.vue b/src/components/page/ExperimentAss.vue
index d4efb98..c881a79 100644
--- a/src/components/page/ExperimentAss.vue
+++ b/src/components/page/ExperimentAss.vue
@@ -34,8 +34,8 @@
         <el-card shadow="hover" class="mgb20">
             <div class="flex-between mgb20">
                 <div>
+                    <el-button type="primary" size="small" @click="exportData">导出成绩列表</el-button>
                     <el-button type="primary" size="small" @click="delAllData">批量删除</el-button>
-                    <el-button type="primary" size="small" @click="exportData">导出</el-button>
                 </div>
                 <div>
                     <el-input placeholder="请输入学校/学生姓名" prefix-icon="el-icon-search" v-model="keyword" clearable></el-input>
diff --git a/src/components/page/ExperimentTeach.vue b/src/components/page/ExperimentTeach.vue
index c110e0c..6a8a390 100644
--- a/src/components/page/ExperimentTeach.vue
+++ b/src/components/page/ExperimentTeach.vue
@@ -42,8 +42,8 @@
                     
                 </div>
                 <div>
+                    <el-button type="primary" size="small" @click="exportData">导出成绩列表</el-button>
                     <el-button type="primary" size="small" @click="delAllData">批量删除</el-button>
-                    <el-button type="primary" size="small" @click="exportData">导出</el-button>
                 </div>
             </div>
             <el-table :data="listData" class="table" ref="table" stripe header-align="center" @selection-change="handleSelectionChange" row-key="reportId">
diff --git a/src/components/page/ExperimentVir.vue b/src/components/page/ExperimentVir.vue
index eba5b42..4887f59 100644
--- a/src/components/page/ExperimentVir.vue
+++ b/src/components/page/ExperimentVir.vue
@@ -42,8 +42,8 @@
                     
                 </div>
                 <div>
+                    <el-button type="primary" size="small" @click="exportData">导出成绩列表</el-button>
                     <el-button type="primary" size="small" @click="delAllData">批量删除</el-button>
-                    <el-button type="primary" size="small" @click="exportData">导出</el-button>
                 </div>
             </div>
             <el-table :data="listData" class="table" ref="table" stripe header-align="center" @selection-change="handleSelectionChange" row-key="id">
diff --git a/src/components/page/ShowExperiment.vue b/src/components/page/ShowExperiment.vue
index 9223aa0..cbf8714 100644
--- a/src/components/page/ShowExperiment.vue
+++ b/src/components/page/ShowExperiment.vue
@@ -11,6 +11,10 @@
                         </div>
                         <div v-if="edit">
                             <el-button type="primary" size="small" round v-preventReClick @click="saveAdd('form')">发布成绩</el-button>
+                            <el-button type="primary" size="small" round @click="exportPage">导出实验报告</el-button>
+                        </div>
+                        <div v-else>
+                            <el-button type="primary" size="small" round @click="exportPage">导出实验报告</el-button>
                         </div>
                     </div>              
                 </el-card>
@@ -226,6 +230,9 @@
 </template>
 
 <script>
+    import { Loading } from 'element-ui'
+    import html2Canvas from 'html2canvas'
+    import JsPDF from 'jspdf'
     export default {
         data (){
             return {
@@ -463,6 +470,47 @@
                     this.$message.error(res.errmessage)
                 }
             },
+            exportPage(){
+                this.loading = true
+                this.loadIns = Loading.service({
+                    background: 'rgba(255,255,255,.6)'
+                })
+                document.querySelector('#pdfDom').scrollTop = 0
+                var title = this.title;
+                let dom = document.querySelector('#pdfDom')
+                setTimeout(() => {
+                    html2Canvas(dom, {
+                        height: dom.scrollHeight,
+                        allowTaint: true,
+                    }).then((canvas) => {
+                        let contentWidth = canvas.width
+                        let contentHeight = canvas.height
+                        let pageHeight = contentWidth / 592.28 * 841.89
+                        let leftHeight = contentHeight
+                        let position = 0
+                        let imgWidth = 595.28
+                        let imgHeight = 592.28 / contentWidth * contentHeight
+                        let pageData = canvas.toDataURL('image/jpeg', 1.0)
+                        let PDF = new JsPDF('', 'pt', 'a4')
+                        if (leftHeight < pageHeight) {
+                            PDF.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight)
+                        } else {
+                            while (leftHeight > 0) {
+                                PDF.addImage(pageData, 'JPEG', 0, position, imgWidth, imgHeight)
+                                leftHeight -= pageHeight
+                                position -= 841.89
+                                if (leftHeight > 0) {
+                                    PDF.addPage()
+                                }
+                            }
+                        }
+                        this.loadIns.close()
+                        this.loading = false
+                        PDF.save(title + '.pdf')
+                    }
+                    )
+                },1000)
+            },
             saveAdd(){
                 if(this.overTotal) return this.$message.error('得分不得大于该考核点分值')
                 this.$post(`${this.api.selectSignature}?reportId=${this.id}&id=${this.signId}`).then(res => {}).catch(res => {})
diff --git a/src/components/page/Student.vue b/src/components/page/Student.vue
index 061ae56..aa03935 100644
--- a/src/components/page/Student.vue
+++ b/src/components/page/Student.vue
@@ -358,7 +358,7 @@ export default {
                         data: schoolList.reverse(),
                     },
                     series: [{
-                        data: frequencyList,
+                        data: frequencyList.reverse(),
                         type: 'bar',
                         smooth: true,
                         color: ['#8191fd']
diff --git a/src/components/page/classExperimentAss.vue b/src/components/page/classExperimentAss.vue
index 0b938d8..397397b 100644
--- a/src/components/page/classExperimentAss.vue
+++ b/src/components/page/classExperimentAss.vue
@@ -34,8 +34,8 @@
         <el-card shadow="hover" class="mgb20">
             <div class="flex-between mgb20">
                 <div>
+                    <el-button type="primary" size="small" @click="exportData">导出成绩列表</el-button>
                     <el-button type="primary" size="small" @click="delAllData">批量删除</el-button>
-                    <el-button type="primary" size="small" @click="exportData">导出</el-button>
                 </div>
                 <div>
                     <el-input placeholder="请输入学校/学生姓名" prefix-icon="el-icon-search" v-model="keyword" clearable></el-input>