feat: 下载提示

src/modules/card/api.js

@@ -14,6 +14,32 @@ export const saveCard = (datas, config = {}) => {
     return $post("/api/admin/exam/card/save", datas, config);
   }
 };
+
+export const saveCard1 = (datas, config = {}) => {
+  const formData = new FormData();
+  for (const key in datas) {
+    const val = datas[key];
+    if (key === "content") {
+      formData.append(
+        key,
+        new File([val], `${Date.now()}.json`, { type: "text/json" })
+      );
+    } else if (key === "htmlContent") {
+      formData.append(
+        key,
+        new File([val], `${Date.now()}.html`, { type: "text/html" })
+      );
+    } else {
+      formData.append(key, val);
+    }
+  }
+
+  if (datas.type === "GENERIC") {
+    return $post("/api/admin/exam/card/save_generic", formData, config);
+  } else {
+    return $post("/api/admin/exam/card/save", formData, config);
+  }
+};
 export const copyCard = (cardId, courseId) => {
   return $postParam("/api/admin/exam/card/copy", { id: cardId, courseId });
 };

src/modules/course/components/CourseDocumentDetail.vue

@@ -161,6 +161,40 @@
       </div>
       <div slot="footer"></div>
     </el-dialog>
+
+    <!-- tool download tips -->
+    <el-dialog
+      class="tool-tips-dialog"
+      :visible.sync="toolTipsDialogVisible"
+      width="600px"
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+      :show-close="false"
+      append-to-body
+    >
+      <div class="tool-tips">
+        <p>
+          <span>下载学生答卷原图或轨迹图，需要调用下载工具下载，点击</span>
+          <span class="color-primary">“下载”</span>
+          <span>后浏览器弹窗需要点击</span>
+          <span class="color-primary">“允许”</span>
+          <span>或</span>
+          <span class="color-primary">“打开”</span>
+          <span>，</span>
+          <span class="color-danger"
+            >并且使用过程中禁止关闭浏览器及知学知考网页</span
+          >
+          <span>，如下提示：</span>
+        </p>
+        <img src="@/assets/images/tool-tips.jpg" alt="操作提示" />
+      </div>
+
+      <div class="tool-footer">
+        <el-button type="primary" @click="confirmToolDownload">下载</el-button>
+      </div>
+      <div slot="title"></div>
+      <div slot="footer"></div>
+    </el-dialog>
   </div>
 </template>
 
@@ -226,6 +260,8 @@ export default {
       // paper view
       paperViewDialogVisible: false,
       papers: [],
+      // tool tips
+      toolTipsDialogVisible: false,
     };
   },
   mounted() {
@@ -348,6 +384,11 @@ export default {
       this.$message.success("下载成功！");
     },
     toToolDownload() {
+      this.toolTipsDialogVisible = true;
+    },
+    confirmToolDownload() {
+      this.toolTipsDialogVisible = false;
+
       const url = getDownloadURLScheme({
         semesterId: this.course.semesterId,
         examId: this.course.examId,
@@ -399,3 +440,41 @@ export default {
   },
 };
 </script>
+
+<style lang="scss">
+.tool-tips-dialog {
+  .el-dialog__header,
+  .el-dialog__footer {
+    display: none;
+  }
+  .el-dialog__body {
+    padding: 40px;
+  }
+  .tool-tips {
+    p {
+      margin-bottom: 10px;
+      line-height: 24px;
+      font-size: 16px;
+    }
+    span[class^="color"] {
+      font-weight: 600;
+    }
+
+    img {
+      display: block;
+      width: 100%;
+      height: auto;
+      border-radius: 5px;
+      box-shadow: 0 0 5px 3px #eee;
+    }
+  }
+  .tool-footer {
+    text-align: center;
+    margin-top: 20px;
+
+    .el-button {
+      width: 100px;
+    }
+  }
+}
+</style>