试卷pdf直接下载

src/modules/paper-export/router/index.js

@@ -28,7 +28,7 @@ export const otherRoutes = [
       ),
   },
   {
-    path: "/paper-template/build/:paperId",
+    path: "/paper-template/build/:paperId/:viewType?",
     name: "PaperTemplateBuild",
     component: () =>
       import(

src/modules/paper-export/views/PaperTemplateBuild.vue

@@ -1,11 +1,20 @@
 <template>
   <div class="paper-template-build">
     <div class="paper-template-build-body">
-      <div class="box-justify margin_top_10">
-        <el-button type="primary" @click="toDownload">下载试卷</el-button>
+      <div class="margin_top_10">
+        <el-select
+          v-model="seqMode"
+          class="margin-right-10"
+          @change="seqModeChange"
+        >
+          <el-option value="MODE1" label="单题型连续"></el-option>
+          <el-option value="MODE2" label="客观题整体连续"></el-option>
+          <el-option value="MODE3" label="按大题独立"></el-option>
+          <el-option value="MODE5" label="整卷连续"></el-option>
+        </el-select>
         <el-select
           v-model="curPaperTemp"
-          class="size-select"
+          class="margin-right-10"
           placeholder="请选择"
           value-key="id"
           @change="paperTempChange"
@@ -18,6 +27,7 @@
           >
           </el-option>
         </el-select>
+        <el-button type="primary" @click="toDownload">下载试卷</el-button>
       </div>
       <paper-template-view
         ref="PaperTemplateView"
@@ -62,6 +72,8 @@ export default {
   data() {
     return {
       paperId: this.$route.params.paperId,
+      viewType: this.$route.params.viewType,
+      seqMode: "MODE1",
       renderStructList: [],
       pages: [],
       paperJson: {},
@@ -75,13 +87,83 @@ export default {
     };
   },
   mounted() {
+    if (this.viewType === "frame") {
+      this.initFrame();
+      return;
+    }
     this.initData();
   },
   methods: {
+    async initFrame() {
+      try {
+        const paperSet = window.parent.paperSet;
+        if (!paperSet) {
+          this.emitFrameResult(false, "数据缺失");
+          return;
+        }
+
+        this.seqMode = paperSet.seqMode;
+        this.curPaperTemp = paperSet.paperTemp;
+
+        await this.getPaperJson();
+
+        let paperTempJson = this.curPaperTemp.content
+          ? JSON.parse(this.curPaperTemp.content)
+          : { pages: [] };
+        this.paperTempJson = paperTempJson;
+        this.pages = paperTempJson.pages;
+        this.updaterFieldInfo();
+      } catch (error) {
+        this.emitFrameResult(false, "数据错误");
+      }
+
+      this.$nextTick(async () => {
+        try {
+          this.maxColumnWidth =
+            document.getElementById("column-0-0").offsetWidth;
+          this.maxColumnHeight =
+            document.getElementById("column-0-0").offsetHeight;
+          this.parseRenderStructList();
+          this.buildPrePages();
+        } catch (error) {
+          this.emitFrameResult(false, "构建错误");
+        }
+
+        const loadRes = await this.waitAllImgLoaded().catch(() => {});
+        if (!loadRes) {
+          this.emitFrameResult(false, "数据缓存错误");
+          return;
+        }
+        this.$nextTick(() => {
+          try {
+            this.buildReleasePages();
+            this.emitFrameResult(true, "", this.getPreviewTemp());
+          } catch (error) {
+            this.emitFrameResult(false, "构建pdf错误");
+          }
+        });
+      });
+    },
+    emitFrameResult(success = true, errorMsg = "", htmlCont = "") {
+      window.parent &&
+        window.parent.submitPaperTemp &&
+        window.parent.submitPaperTemp({
+          success,
+          errorMsg,
+          htmlCont,
+          templateId: this.curPaperTemp.id,
+        });
+    },
     async initData() {
       await this.getPaperJson();
       await this.getPaperTempList();
 
+      if (!this.paperTempList.length) {
+        this.$message.error("导出模板缺失！");
+        return;
+      }
+      this.paperTempChange(this.paperTempList[0]);
+
       // test--->
       // this.paperJson = paperJson;
       // this.paperTempJson = paperTempJson;
@@ -91,7 +173,10 @@ export default {
       // });
     },
     async getPaperJson() {
-      const res = await paperDetailInfoApi(this.paperId);
+      const res = await paperDetailInfoApi({
+        paperId: this.paperId,
+        seqMode: this.seqMode,
+      });
       this.paperJson = res.data;
       this.fieldData = {
         paperName: res.data.name,
@@ -100,17 +185,18 @@ export default {
         rootOrgName: res.data.rootOrgName,
       };
     },
+    async seqModeChange() {
+      await this.getPaperJson();
+      this.$nextTick(() => {
+        this.buildData();
+      });
+    },
     async getPaperTempList() {
       const res = await paperTemplateListApi("PAPER_EXPORT");
       this.paperTempList = res.data;
-      if (!this.paperTempList.length) {
-        this.$message.error("导出模板缺失！");
-        return Promise.reject();
-      }
-      this.paperTempChange(this.paperTempList[0]);
     },
     paperTempChange(paperTemp) {
-      console.log(paperTemp);
+      // console.log(paperTemp);
       this.curPaperTemp = paperTemp;
       let paperTempJson = paperTemp.content
         ? JSON.parse(paperTemp.content)
@@ -548,7 +634,7 @@ export default {
         imgUrls.push(...this.getRichJsonImgUrls(item.content));
       });
 
-      console.log(imgUrls);
+      // console.log(imgUrls);
 
       if (!imgUrls.length) return Promise.resolve(true);
       const imgLoads = imgUrls.map((item) => this.loadImg(item));

src/modules/paper/api.js

@@ -28,8 +28,14 @@ export const questionGroupStructListApi = (datas) => {
 // };
 
 // edit paper
-export const paperDetailInfoApi = (paperId) => {
-  return $httpWithMsg.get(`${QUESTION_API}/paper/${paperId}`, {});
+export const paperDetailInfoApi = ({ paperId, seqMode }) => {
+  return $httpWithMsg.post(
+    `${QUESTION_API}/paper/data`,
+    {},
+    {
+      params: { paperId, seqMode },
+    }
+  );
 };
 export const paperSaveApi = (paper) => {
   return $httpWithMsg.post(`${QUESTION_API}/paper`, paper);

src/modules/questions/views/GenPaper.vue

@@ -260,7 +260,7 @@
         <el-form-item label="导出内容">
           <el-radio-group
             v-model="exportModel.exportContent"
-            @change="getTemplates('')"
+            @change="exportContentChange"
           >
             <el-radio label="PAPER">试卷</el-radio>
             <el-radio label="ANSWER">答案</el-radio>
@@ -277,14 +277,35 @@
             <el-radio label="MODE5">整卷连续</el-radio>
           </el-radio-group>
         </el-form-item>
-        <el-form-item v-if="showSeqMode()" label="模板">
+        <el-form-item
+          v-if="exportModel.exportContent === 'PAPER'"
+          label="试卷模板"
+        >
+          <el-select
+            v-model="curPaperTemp"
+            placeholder="请选择试卷模板"
+            value-key="id"
+          >
+            <el-option
+              v-for="item in paperTempList"
+              :key="item.id"
+              :label="item.name"
+              :value="item"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item
+          v-if="exportModel.exportContent === 'ANSWER'"
+          label="答案模板"
+        >
           <el-select
             v-model="exportModel.templateId"
             filterable
             :remote-method="getTemplates"
             remote
             clearable
-            placeholder="请选择"
+            placeholder="请选择答案模板"
             @clear="getTemplates('')"
           >
             <el-option
@@ -298,7 +319,12 @@
         </el-form-item>
       </el-form>
       <div slot="footer">
-        <el-button type="primary" @click="exportPaperInfo">开始导出</el-button>
+        <el-button
+          type="primary"
+          :loading="downloading"
+          @click="exportPaperInfo"
+          >开始导出</el-button
+        >
       </div>
     </el-dialog>
 
@@ -370,6 +396,11 @@
         >
       </div>
     </el-dialog>
+
+    <!-- paper-view-frame -->
+    <div v-if="paperPreviewUrl" class="design-preview-frame">
+      <iframe :src="paperPreviewUrl" frameborder="0"></iframe>
+    </div>
   </section>
 </template>
 
@@ -377,6 +408,11 @@
 import { QUESTION_API } from "@/constants/constants";
 import { LEVEL_TYPE, PUBLICITY_LIST } from "../constants/constants";
 import { mapState } from "vuex";
+import { downloadByApi } from "@/plugins/download";
+import {
+  paperTemplateListApi,
+  paperPdfDownloadApi,
+} from "../../paper-export/api";
 
 export default {
   data() {
@@ -443,6 +479,11 @@ export default {
       rules: {
         examId: [{ required: true, message: "请输入名称", trigger: "change" }],
       },
+      // pdf download
+      paperPreviewUrl: "",
+      downloading: false,
+      curPaperTemp: null,
+      paperTempList: [],
     };
   },
   computed: {
@@ -481,8 +522,22 @@ export default {
   },
   created() {
     this.initVue();
+    this.registWindowSubmit();
+  },
+  beforeDestroy() {
+    delete window.submitPaperTemp;
   },
   methods: {
+    exportContentChange(val) {
+      if (val === "PAPER") {
+        this.getPaperTempList();
+        return;
+      }
+      if (val === "ANSWER") {
+        this.getTemplates("");
+        return;
+      }
+    },
     getTemplates(name) {
       this.exportModel.templateId = "";
       var url = QUESTION_API + "/exportTemplate/page/1/20";
@@ -807,6 +862,19 @@ export default {
     },
     //导出试卷，答案，机考数据包
     exportPaperInfo() {
+      // 下载pdf
+      if (this.exportModel.exportContent === "PAPER") {
+        if (!this.curPaperTemp) {
+          this.$notify({
+            message: "请选择试卷模板",
+            type: "error",
+          });
+          return;
+        }
+        this.toDownloadPaperPdf();
+        return;
+      }
+
       if (
         !this.exportModel.exportContent ||
         this.exportModel.exportContent == ""
@@ -921,6 +989,66 @@ export default {
       this.getCourses(this.formSearch.courseName);
       this.searchGenPaper();
     },
+    // download paper pdf
+    async getPaperTempList() {
+      if (this.paperTempList.length) return;
+      const res = await paperTemplateListApi("PAPER_EXPORT");
+      this.paperTempList = res.data;
+    },
+    toDownloadPaperPdf() {
+      if (this.downloading) return;
+      this.downloading = true;
+      window.paperSet = {
+        paperTemp: this.curPaperTemp,
+        seqMode: this.exportModel.seqMode,
+      };
+      const url = this.getRouterPath({
+        name: "PaperTemplateBuild",
+        params: {
+          paperId: this.exportModel.id,
+          viewType: "frame",
+        },
+        query: {
+          t: Date.now(),
+        },
+      });
+
+      // console.log(url);
+      this.paperPreviewUrl = url;
+    },
+    registWindowSubmit() {
+      window.submitPaperTemp = async ({
+        success,
+        errorMsg,
+        htmlCont,
+        templateId,
+      }) => {
+        if (!success) {
+          this.downloading = false;
+          delete window.paperSet;
+          this.paperPreviewUrl = "";
+          this.$message.error(errorMsg);
+          this.exportDialog = false;
+          return;
+        }
+        this.paperPreviewUrl = "";
+
+        const res = await downloadByApi(() => {
+          return paperPdfDownloadApi({
+            content: htmlCont,
+            templateId,
+          });
+        }).catch((e) => {
+          this.$message.error(e || "下载失败，请重新尝试！");
+        });
+        this.exportDialog = false;
+        this.downloading = false;
+
+        if (!res) return;
+        this.$message.success("下载成功！");
+        delete window.paperSet;
+      };
+    },
   },
 };
 </script>