渲染时全局遮罩，不让复核

src/features/student/inspect/MarkBody.vue

@@ -1,34 +1,27 @@
 <template>
   <div class="mark-body-container tw-flex-auto tw-p-2" ref="dragContainer">
-    <a-spin
-      :spinning="rendering"
-      size="large"
-      tip="Loading..."
-      style="margin-top: 50px"
-    >
-      <div v-if="!store.currentTask" class="tw-text-center">
-        {{ store.message }}
+    <div v-if="!store.currentTask" class="tw-text-center">
+      {{ store.message }}
+    </div>
+    <div v-else :style="{ width: answerPaperScale }">
+      <div
+        v-for="(item, index) in sliceImagesWithTrackList"
+        :key="index"
+        class="single-image-container"
+        :style="{
+          width: item.width,
+        }"
+      >
+        <img :src="item.url" draggable="false" />
+        <MarkDrawTrack
+          :track-list="item.trackList"
+          :special-tag-list="item.tagList"
+          :original-image-height="item.originalImageHeight"
+          :original-image-width="item.originalImageWidth"
+        />
+        <hr class="image-seperator" />
       </div>
-      <div v-else :style="{ width: answerPaperScale }">
-        <div
-          v-for="(item, index) in sliceImagesWithTrackList"
-          :key="index"
-          class="single-image-container"
-          :style="{
-            width: item.width,
-          }"
-        >
-          <img :src="item.url" draggable="false" />
-          <MarkDrawTrack
-            :track-list="item.trackList"
-            :special-tag-list="item.tagList"
-            :original-image-height="item.originalImageHeight"
-            :original-image-width="item.originalImageWidth"
-          />
-          <hr class="image-seperator" />
-        </div>
-      </div>
-    </a-spin>
+    </div>
   </div>
 </template>
 
@@ -64,7 +57,6 @@ const { dragContainer } = dragImage();
 
 const { addTimeout } = useTimers();
 
-let rendering = ref(false);
 let sliceImagesWithTrackList: Array<SliceImage> = reactive([]);
 let maxImageWidth = 0;
 
@@ -126,7 +118,7 @@ const renderPaperAndMark = async () => {
   }
 
   try {
-    rendering.value = true;
+    store.globalMask = true;
     await processImage();
   } catch (error) {
     sliceImagesWithTrackList.splice(0);
@@ -134,8 +126,9 @@ const renderPaperAndMark = async () => {
     // 图片加载出错，自动加载下一个任务
     emit("error");
   } finally {
+    await new Promise((res) => setTimeout(res, 500));
+    store.globalMask = false;
     renderLock = false;
-    rendering.value = false;
   }
 };