Sfoglia il codice sorgente

feat: 添加导出题库 Word 文档功能

xieyong 1 settimana fa
parent
commit
4c0a6701d8

+ 10 - 0
src/api/questionBank/questionBank.js

@@ -59,3 +59,13 @@ export async function deleteQuestion(questionId) {
   }
   return Promise.reject(new Error(res.data.message));
 }
+
+/**
+ * 导出题库 Word 文档
+ */
+export async function exportWord(params) {
+  const res = await request.post('/ehs/questionBank/export', params, {
+    responseType: 'blob'
+  });
+  return res.data;
+}

+ 96 - 2
src/views/safetyExam/questionBank/index.vue

@@ -47,6 +47,12 @@
                   @click="handleEdit(row)"
                   >编辑</el-link
                 >
+                <el-link
+                  type="primary"
+                  :underline="false"
+                  @click="handleExport(row)"
+                  >导出</el-link
+                >
                 <el-link
                   type="danger"
                   :underline="false"
@@ -60,6 +66,42 @@
 
         <!-- 维护试题弹窗 -->
         <maintenance ref="maintenanceRef" @reload="$refs.table.reload()" />
+
+        <!-- 导出Word选项弹窗 -->
+        <ele-modal
+          :visible.sync="exportDialogVisible"
+          title="导出题库Word文档"
+          width="420px"
+          append-to-body
+          :close-on-click-modal="false"
+          @close="resetExportForm"
+        >
+          <el-form
+            ref="exportForm"
+            :model="exportForm"
+            label-width="100px"
+            class="export-form"
+          >
+            <el-form-item label="题库名称:">
+              <span class="export-bank-name">{{ exportForm.bankName }}</span>
+            </el-form-item>
+            <el-form-item label="导出内容:">
+              <el-radio-group v-model="exportForm.includeAnswerAndExplanation">
+                <el-radio :label="false">仅试题</el-radio>
+                <el-radio :label="true">含答案与题目详解</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-form>
+          <template v-slot:footer>
+            <el-button @click="exportDialogVisible = false">取消</el-button>
+            <el-button
+              type="primary"
+              :loading="exportLoading"
+              @click="confirmExport"
+              >开始导出</el-button
+            >
+          </template>
+        </ele-modal>
       </div>
     </el-card>
   </div>
@@ -68,7 +110,8 @@
 <script>
   import maintenance from './maintenance.vue';
   import tabMixins from '@/mixins/tableColumnsMixin';
-  import { getList, remove } from '@/api/questionBank/questionBank.js';
+  import { getList, remove, exportWord } from '@/api/questionBank/questionBank.js';
+  import { download } from '@/utils/file';
   export default {
     components: {
       maintenance
@@ -112,7 +155,14 @@
             slot: 'action'
           }
         ],
-        cacheKeyUrl: 'ehs-questionBank-list'
+        cacheKeyUrl: 'ehs-questionBank-list',
+        exportDialogVisible: false,
+        exportLoading: false,
+        exportForm: {
+          bankId: '',
+          bankName: '',
+          includeAnswerAndExplanation: false
+        }
       };
     },
     computed: {
@@ -176,6 +226,42 @@
           })
           .catch(() => {});
       },
+      // 导出Word
+      handleExport(row) {
+        this.exportForm = {
+          bankId: row.id,
+          bankName: row.questionBankName || '',
+          includeAnswerAndExplanation: false
+        };
+        this.exportDialogVisible = true;
+      },
+      // 重置导出表单
+      resetExportForm() {
+        this.exportForm = {
+          bankId: '',
+          bankName: '',
+          includeAnswerAndExplanation: false
+        };
+        this.exportLoading = false;
+      },
+      // 确认导出
+      async confirmExport() {
+        this.exportLoading = true;
+        try {
+          const blob = await exportWord({
+            questionBankId: this.exportForm.bankId,
+            includeAnswerAndExplanation: this.exportForm
+              .includeAnswerAndExplanation
+          });
+          const filename = `${this.exportForm.bankName || '题库'}.docx`;
+          download(blob, filename);
+          this.exportDialogVisible = false;
+        } catch (error) {
+          this.$message.error(error.message || '导出失败');
+        } finally {
+          this.exportLoading = false;
+        }
+      },
       // 搜索
       handleSearch(where) {
         this.$refs.table.reload({ page: 1, where });
@@ -220,4 +306,12 @@
       font-size: 12px;
     }
   }
+
+  .export-form {
+    padding-top: 10px;
+
+    .export-bank-name {
+      color: #303133;
+    }
+  }
 </style>