init

src/views/BatchData/components/ShowBatchData.vue

@@ -8,6 +8,12 @@
       append-to-body
       @close="$emit('update:isShow', false)"
     >
+      <template #title>
+        <div class="title-panel">
+          <p>{{ $route.meta.title }}</p>
+          <el-button icon="el-icon-download" type="primary" size="small" circle @click="exportTable"></el-button>
+        </div>
+      </template>
       <section class="drawer-container">
         <h3 class="title">{{ detail.aspiration ? detail.aspiration.title : '' }}</h3>
 
@@ -27,7 +33,11 @@
             <vxe-column title="名称" field="batchSubs.batchSubSchools.specialties.value"></vxe-column>
           </vxe-colgroup>
           <vxe-colgroup title="其他专业是否服从">
-            <vxe-column title="（是/否）" field=""></vxe-column>
+            <vxe-column title="（是/否）" field="">
+              <template #default="{ row }">
+                {{ row.batchSubs.hasOwnProperty("notShowSpecialtyObey") ? "-" : (row.batchSubs.specialtyObey ? "是" : "否") }}
+              </template>
+            </vxe-column>
           </vxe-colgroup>
         </vxe-table>
       </section>
@@ -63,6 +73,14 @@ export default {
     },
   },
   methods: {
+    exportTable() {
+      const $table = this.$refs.table
+      if ($table) {
+        $table.exportData({
+          type: 'xlsx'
+        })
+      }
+    },
     formatData(arr) {
       const transformedArray = [];
       arr.forEach(batch => {
@@ -135,6 +153,8 @@ export default {
     mergeCells() {
       let mergeCells = [];
       let c1rowspan = 1;
+      let c2rowspan = 1;
+      let c3rowspan = 1;
 
       for (let i = 1; i < this.list.length; i++) {
         const item = this.list[i];
@@ -154,6 +174,54 @@ export default {
             row: i - (c1rowspan - 1), col: 0, rowspan: c1rowspan, colspan: 1
           });
         }
+
+        if (item.batchSubs.batchSubId === prevItem.batchSubs.batchSubId) {
+          c2rowspan++;
+        } else {
+          mergeCells.push({
+            row: i - c2rowspan, col: 1, rowspan: c2rowspan, colspan: 1
+          });
+          c2rowspan = 1;
+        }
+
+        if (i === this.list.length - 1 && item.batchSubs.batchSubId === prevItem.batchSubs.batchSubId) {
+          mergeCells.push({
+            row: i - (c2rowspan - 1), col: 1, rowspan: c2rowspan, colspan: 1
+          });
+        }
+
+        if (item.batchSubs.batchSubSchools.batchSubSchoolId === prevItem.batchSubs.batchSubSchools.batchSubSchoolId) {
+          c3rowspan++;
+        } else {
+          mergeCells.push({
+            row: i - c3rowspan, col: 2, rowspan: c3rowspan, colspan: 1
+          });
+          mergeCells.push({
+            row: i - c3rowspan, col: 3, rowspan: c3rowspan, colspan: 1
+          });
+          mergeCells.push({
+            row: i - c3rowspan, col: 4, rowspan: c3rowspan, colspan: 1
+          });
+          mergeCells.push({
+            row: i - c3rowspan, col: 8, rowspan: c3rowspan, colspan: 1
+          });
+          c3rowspan = 1;
+        }
+
+        if (i === this.list.length - 1 && item.batchSubs.batchSubSchools.batchSubSchoolId === prevItem.batchSubs.batchSubSchools.batchSubSchoolId) {
+          mergeCells.push({
+            row: i - (c3rowspan - 1), col: 2, rowspan: c3rowspan, colspan: 1
+          });
+          mergeCells.push({
+            row: i - (c3rowspan - 1), col: 3, rowspan: c3rowspan, colspan: 1
+          });
+          mergeCells.push({
+            row: i - (c3rowspan - 1), col: 4, rowspan: c3rowspan, colspan: 1
+          });
+          mergeCells.push({
+            row: i - (c3rowspan - 1), col: 8, rowspan: c3rowspan, colspan: 1
+          });
+        }
       }
 
       console.log(mergeCells);
@@ -176,4 +244,10 @@ export default {
 .title {
   text-align: center;
 }
+.title-panel {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding-right: 2vw;
+}
 </style>