update:下载pdf

package.json

@@ -18,6 +18,7 @@
     "lodash": "^4.17.21",
     "query-string": "^7.0.1",
     "vue": "^2.6.14",
+    "vue-html2pdf": "^1.8.0",
     "vue-router": "^3.5.3",
     "vuex": "^3.6.2"
   },

src/modules/teacher/data/exam/views/ExamData.vue

 <template>
-  <div class="container">
-    <el-row type="flex" class="row-bg" justify="space-between" style="margin-bottom: 30px">
-      <el-col
-        ><h1 style="padding-left: 0px; font-size: 30px">
-          {{ $route.query.examination_name }} <span style="color: #c01540; font-size: 14px">*部分数据未进行评价</span>
-        </h1>
-      </el-col>
-      <el-col :span="10">
-        <el-select v-model="value" placeholder="请选择">
-          <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> </el-option>
-        </el-select>
-        <el-button type="text" style="margin-left: 30px">导出pdf</el-button>
-      </el-col>
-    </el-row>
-    <template v-if="dataInfo.paper_info">
-      <el-row :gutter="10" class="row-bg">
-        <el-col :span="8" class="col"><exam-info :dataInfo="dataInfo" /></el-col>
-        <el-col :span="8" class="col"><submission :dataInfo="dataInfo" /></el-col>
-        <el-col :span="7"><score :dataInfo="dataInfo" /></el-col>
-      </el-row>
-      <el-row :gutter="10" class="row-bg">
-        <el-col :span="12" class="col"
-          ><ScoreRanking
-            :course_id="$route.query.course_id"
-            :examination_id="$route.query.examination_id"
-            :chapter_id="$route.query.chapter_id"
-            :type="$route.query.type"
-            :dataInfo="dataInfo.need_check_num"
-        /></el-col>
-        <el-col :span="11"
-          ><TitleData
-            :course_id="$route.query.course_id"
-            :examination_id="$route.query.examination_id"
-            :chapter_id="$route.query.chapter_id"
-            :type="$route.query.type"
-            :dataInfo="dataInfo.need_check_num"
-        /></el-col>
-      </el-row>
-      <el-row :gutter="10" class="row-bg">
-        <el-col :span="8" class="col"><result :dataInfo="dataInfo" /></el-col>
-        <el-col :span="8" class="col"><score-range :dataInfo="dataInfo" /></el-col>
-        <el-col :span="7"><question-type :dataInfo="dataInfo" /></el-col>
-      </el-row>
-    </template>
-  </div>
+  <vue-html2pdf
+      pdf-format="a1"
+      :show-layout="false"
+      :float-layout="false"
+      :enable-download="true"
+      :preview-modal="false"
+      :manual-pagination="true"
+      :paginate-elements-by-height="500"
+      filename="file"
+      pdf-content-width="100%"
+      ref="html2Pdf"
+    >
+    <section slot="pdf-content">
+      <div class="container">
+        <el-row type="flex" class="row-bg" justify="space-between" style="margin-bottom: 30px">
+          <el-col
+            ><h1 style="padding-left: 0px; font-size: 30px">
+              {{ $route.query.examination_name }} <span style="color: #c01540; font-size: 14px">*部分数据未进行评价</span>
+            </h1>
+          </el-col>
+          <el-col :span="10">
+            <el-select v-model="value" placeholder="请选择">
+              <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> </el-option>
+            </el-select>
+            <el-button type="text" style="margin-left: 30px" @click="$refs.html2Pdf.generatePdf()">导出pdf</el-button>
+          </el-col>
+        </el-row>
+        <template v-if="dataInfo.paper_info">
+          <el-row :gutter="10" class="row-bg">
+            <el-col :span="8" class="col"><exam-info :dataInfo="dataInfo" /></el-col>
+            <el-col :span="8" class="col"><submission :dataInfo="dataInfo" /></el-col>
+            <el-col :span="7"><score :dataInfo="dataInfo" /></el-col>
+          </el-row>
+          <el-row :gutter="10" class="row-bg">
+            <el-col :span="12" class="col"
+              ><ScoreRanking
+                :course_id="$route.query.course_id"
+                :examination_id="$route.query.examination_id"
+                :chapter_id="$route.query.chapter_id"
+                :type="$route.query.type"
+                :dataInfo="dataInfo.need_check_num"
+            /></el-col>
+            <el-col :span="11"
+              ><TitleData
+                :course_id="$route.query.course_id"
+                :examination_id="$route.query.examination_id"
+                :chapter_id="$route.query.chapter_id"
+                :type="$route.query.type"
+                :dataInfo="dataInfo.need_check_num"
+            /></el-col>
+          </el-row>
+          <el-row :gutter="10" class="row-bg">
+            <el-col :span="8" class="col"><result :dataInfo="dataInfo" /></el-col>
+            <el-col :span="8" class="col"><score-range :dataInfo="dataInfo" /></el-col>
+            <el-col :span="7"><question-type :dataInfo="dataInfo" /></el-col>
+          </el-row>
+        </template>
+      </div>
+    </section>
+  </vue-html2pdf>
 </template>
 
 <script>
 import { getExamDataInfo } from '../api'
+import VueHtml2pdf from 'vue-html2pdf'
 import ExamInfo from '../components/ExamInfo.vue'
 import Submission from '../components/Submission.vue'
 import Score from '../components/Score.vue'
@@ -57,7 +73,7 @@ import Result from '../components/Result.vue'
 import ScoreRange from '../components/ScoreRange.vue'
 import QuestionType from '../components/QuestionType.vue'
 export default {
-  components: { ExamInfo, Submission, Score, ScoreRanking, TitleData, Result, ScoreRange, QuestionType },
+  components: { VueHtml2pdf, ExamInfo, Submission, Score, ScoreRanking, TitleData, Result, ScoreRange, QuestionType },
   data() {
     return {
       options: [

vite.config.js

@@ -15,6 +15,11 @@ export default defineConfig({
     },
     proxy: {
       '/api': 'https://project-api.ezijing.com'
+      // '/api': {
+      //   target: 'http://localhost-zy-api.ezijing.com',
+      //   changeOrigin: true,
+      //   rewrite: path => path.replace(/^\/api\/zy/, '')
+      // }
     }
   },
   resolve: {