更新学生打印证书

package.json

@@ -8,7 +8,7 @@
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
-    "@antv/g2plot": "^1.1.6",
+    "@antv/g2plot": "^1.1.7",
     "@fullcalendar/core": "^4.3.1",
     "@fullcalendar/daygrid": "^4.3.0",
     "@fullcalendar/interaction": "^4.3.0",

src/views/student/certCard.vue

@@ -2,10 +2,15 @@
   <div id="certCard">
     <el-row>
       <el-col :span="24">
-        <el-col :span="24">
-          <el-button type="primary" size="mini" @click="toTest()">打印证书</el-button>
+        <el-col :span="24" class="btn">
+          <el-button type="primary" size="mini" @click="print">生成打印文件</el-button>
+          <el-button v-if="url" type="success" size="mini" @click="openPdf">
+            打开生成文件
+          </el-button>
+        </el-col>
+        <el-col :span="24" class="list">
+          <data-table :fields="fields" :data="list" :total="total" :opera="opera" :usePage="false"></data-table>
         </el-col>
-        <test :list="list"></test>
         <!-- <el-col :span="24" ref="print">
           <el-col :span="24" class="list" v-for="(item, index) in list" :key="index">
             <p>
@@ -36,24 +41,79 @@
 </template>
 
 <script>
+import _ from 'lodash';
 import printTemplate from 'print-template';
-import test from '../train-plan/parts/test';
+import dataTable from '@frame/components/filter-page-table';
 import { mapState, createNamespacedHelpers } from 'vuex';
 export default {
   name: 'certCard',
   props: {
-    list: null,
+    list: { type: Array, default: () => [] },
+    total: null,
+  },
+  components: {
+    dataTable,
   },
-  components: { test },
   data: function() {
     return {
+      url: '',
+      template: null,
       zhengshu: require('@/assets/zhengshu.jpg'),
+      opera: [],
+      fields: [
+        { label: '姓名', prop: 'name' },
+        { label: '学校名称', prop: 'school_name' },
+        { label: '院系', prop: 'faculty' },
+        { label: '专业', prop: 'major' },
+        { label: '职务', prop: 'job' },
+        { label: '是否优秀', prop: 'is_fine', format: i => (i === '0' ? '否' : i === '1' ? '是' : '无资格') },
+      ],
     };
   },
-  created() {},
+  created() {
+    this.init();
+  },
   methods: {
-    toPrint() {
-      this.$print(this.$refs.print);
+    init() {
+      this.template = new printTemplate();
+      this.template.push({
+        name: 'expressDelivery1',
+        unit: 'mm',
+        size: [210, 297],
+        fixed: [{ type: 'image', x: 0, y: 0, default: this.zhengshu, width: 210, height: 297 }],
+        data: {
+          school_name: { type: 'text', x: 15, y: 15, fontSize: 3.5 },
+          entry_year: { type: 'text', x: 56, y: 55, fontSize: 3.5 },
+          major: { type: 'text', x: 107, y: 105, fontSize: 3.5 },
+          name: { type: 'text', x: 158, y: 155, fontSize: 3.5 },
+          termname: { type: 'text', x: 15, y: 255, fontSize: 3.5 },
+          cernum: { type: 'text', x: 100, y: 250, fontSize: 3.5 },
+        },
+      });
+    },
+    openPdf() {
+      let link = document.createElement('a');
+      link.href = this.url;
+      link.target = '_blank';
+      link.click();
+    },
+    print() {
+      let data = [];
+      this.url = null;
+      let duplicate = _.cloneDeep(this.list);
+      duplicate = duplicate.map(i => {
+        i.cernum = `2020${i.termname}${i.classname}`;
+        return i;
+      });
+      // this.template.print('expressDelivery1', [duplicate[0]]).then(pdf => {
+      this.template.print('expressDelivery1', [duplicate[0], duplicate[1]]).then(pdf => {
+        if (pdf) {
+          this.$message.success('生成成功');
+          this.url = pdf.output('bloburi', { filename: '证书' });
+        } else {
+          this.$message.warring('生成失败');
+        }
+      });
     },
   },
   computed: {
@@ -69,11 +129,7 @@ export default {
 </script>
 
 <style lang="less" scoped>
-.list {
-  height: 710px;
-  background-image: url(/img/zhengshu.bc829b8f.jpg);
-  background-size: 100% 100%;
-  background-repeat: no-repeat;
-  width: 100%;
+.btn {
+  margin: 0 0 15px 0;
 }
 </style>

src/views/train-plan/print.vue

@@ -37,7 +37,7 @@
       <name-card v-loading="loading" :list="studList"></name-card>
     </detail-frame>
     <detail-frame title="打印证书" v-if="view == 'certList'" :returns="toReturns">
-      <cert-card :list="studList"></cert-card>
+      <cert-card :list="studList" :total="studTotal"></cert-card>
     </detail-frame>
     <detail-frame title="学生报道表" v-if="view == 'signList'" :returns="toReturns">
       <sign-list v-loading="loading" :list="studList"></sign-list>
@@ -105,6 +105,7 @@ export default {
       classList: [],
       //打印数据
       studList: [],
+      studTotal: 0,
       classInfo: {},
       lth: [], //table表头
       ltr: [], //table y轴
@@ -181,7 +182,10 @@ export default {
     async certList({ data }) {
       let { _id: classid } = data;
       let res = await this.getStudentList({ classid });
-      if (this.$checkRes(res)) this.$set(this, `studList`, res.data);
+      if (this.$checkRes(res)) {
+        this.$set(this, `studList`, res.data);
+        this.$set(this, `studTotal`, res.total);
+      }
       this.view = 'certList';
     },
     async getRemarkParts(data) {