feat: 关联试卷

src/modules/print/components/ModifyPlanPaper.vue

@@ -74,7 +74,7 @@
                     v-for="item in paperTypes"
                     :key="item"
                     :value="item"
-                    :label="item"
+                    :label="`卷${item}`"
                   ></el-option>
                 </el-select>
               </el-form-item>
@@ -104,36 +104,56 @@
         提示：多卷型试卷由于会绑定一个答题卡模板，因此试卷结构必须相同。多卷型试卷之间客观题要求试题内容相同，可允许大题内的小题题序不同。
       </p>
       <table class="table">
+        <colgroup>
+          <col width="80" />
+          <col width="60" />
+          <col width="300" />
+          <col />
+        </colgroup>
         <tr>
+          <th>备用卷</th>
           <th>卷型</th>
           <th>试卷</th>
           <th>答题卡</th>
         </tr>
-        <tr v-for="(attachment, index) in paperAttachments" :key="index">
-          <td>{{ attachment.name }}卷</td>
-          <td>
-            <el-button
-              type="text"
-              class="btn-primary"
-              @click="toViewAttachment(attachment)"
-              title="点击查看试卷"
+        <template v-for="(paperAttachment, pindex) in paperAttachments">
+          <tr
+            v-for="(attachment, index) in paperAttachment.paperAttachmentIds"
+            :key="`${pindex}-${index}`"
+          >
+            <td
+              v-if="index === 0"
+              :rowspan="paperAttachment.paperAttachmentIds.length"
             >
-              <i
-                class="icon icon-download mr-1"
-                v-if="attachment.attachmentId"
-              ></i
-              >{{ attachment.filename }}
-            </el-button>
-          </td>
-          <td>
-            <el-button
-              type="text"
-              class="btn-primary"
-              @click="toViewCard(attachment)"
-              >查看答题卡</el-button
-            >
-          </td>
-        </tr>
+              卷{{ paperAttachment.serialNumber }}
+            </td>
+            <td>
+              <span>{{ attachment.name }}</span>
+            </td>
+            <td>
+              <el-button
+                type="text"
+                class="btn-primary"
+                @click="toViewAttachment(attachment)"
+                title="点击查看试卷"
+              >
+                <i
+                  class="icon icon-download mr-1"
+                  v-if="attachment.attachmentId"
+                ></i
+                >{{ attachment.filename }}
+              </el-button>
+            </td>
+            <td>
+              <el-button
+                type="text"
+                class="btn-primary"
+                @click="toViewCard(attachment)"
+                >查看答题卡</el-button
+              >
+            </td>
+          </tr>
+        </template>
       </table>
 
       <div slot="footer">
@@ -144,6 +164,13 @@
       </div>
     </el-dialog>
 
+    <!-- card-preview-dialog -->
+    <card-preview-dialog
+      ref="CardPreviewDialog"
+      :card-id="curAttachment.cardId"
+      show-watermark
+    ></card-preview-dialog>
+
     <!-- PreviewAttachment -->
     <preview-attachment
       ref="PreviewAttachment"
@@ -160,6 +187,7 @@ import { taskApplyDetail } from "../../exam/api";
 import { attachmentPreview } from "../../login/api";
 import PreviewAttachment from "@/components/PreviewAttachment.vue";
 import PreviewFile from "@/components/PreviewFile.vue";
+import CardPreviewDialog from "../../card/components/CardPreviewDialog.vue";
 
 const initModalForm = {
   id: null,
@@ -170,7 +198,7 @@ const initModalForm = {
 
 export default {
   name: "modify-plan-paper",
-  components: { PreviewAttachment, PreviewFile },
+  components: { PreviewAttachment, PreviewFile, CardPreviewDialog },
   props: {
     instance: {
       type: Object,
@@ -204,6 +232,7 @@ export default {
           },
         ],
       },
+      curAttachment: {},
       // attachmentId preview
       attachmentIds: [],
       // preview file
@@ -216,9 +245,18 @@ export default {
   methods: {
     async getAttachments() {
       const data = await taskApplyDetail(this.instance.id);
-      this.paperAttachments = data.paperAttachmentIds
-        ? JSON.parse(data.paperAttachmentIds)
-        : [];
+      this.paperAttachments = (data.examTaskDetailList || []).map((item) => {
+        const paperAttachmentIds = item.paperAttachmentIds
+          ? JSON.parse(item.paperAttachmentIds)
+          : [];
+        paperAttachmentIds.forEach((aitem) => {
+          aitem.serialNumber = item.serialNumber;
+        });
+        return {
+          ...item,
+          paperAttachmentIds,
+        };
+      });
       this.cardId = data.cardId;
     },
     // async getPaperTypes() {
@@ -293,15 +331,8 @@ export default {
       this.$refs.PreviewAttachment.open();
     },
     toViewCard(attachment) {
-      window.open(
-        this.getRouterPath({
-          name: "CardPreview",
-          params: {
-            cardId: attachment.cardId,
-            viewType: "view",
-          },
-        })
-      );
+      this.curAttachment = { ...attachment };
+      this.$refs.CardPreviewDialog.open();
     },
     async submit() {
       const valid = await this.$refs.modalFormComp.validate().catch(() => {});