全局遮盖后，无需试卷部分渲染遮盖

src/features/mark/CommonMarkBody.vue

@@ -1,50 +1,53 @@
 <template>
-  <div class="mark-body-container tw-flex-auto tw-p-2" ref="dragContainer">
-    <a-spin
+  <div
+    class="mark-body-container tw-flex-auto tw-p-2 tw-relative"
+    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
+        style="
+          top: 0px;
+          right: 0;
+          position: absolute;
+          color: red;
+          pointer-events: none;
+          font-size: 30px;
+          z-index: 1000;
+        "
+      >
+        {{ markStatus }}
       </div>
-      <div v-else :style="{ width: answerPaperScale }">
-        <div
-          style="
-            top: -10px;
-            right: 0;
-            position: absolute;
-            color: red;
-            pointer-events: none;
-            font-size: 30px;
-            z-index: 1000;
-          "
-        >
-          {{ markStatus }}
-        </div>
-        <div
-          v-for="(item, index) in sliceImagesWithTrackList"
-          :key="index"
-          class="single-image-container"
-        >
-          <img
-            :src="item.url"
-            @click="(event) => innerMakeTrack(event, item)"
-            draggable="false"
-          />
-          <MarkDrawTrack
-            :track-list="item.trackList"
-            :special-tag-list="item.tagList"
-            :original-image="item.originalImage"
-            :slice-image="item.sliceImage"
-            :dx="item.dx"
-            :dy="item.dy"
-          />
-          <hr class="image-seperator" />
-        </div>
+      <div
+        v-for="(item, index) in sliceImagesWithTrackList"
+        :key="index"
+        class="single-image-container"
+      >
+        <img
+          :src="item.url"
+          @click="(event) => innerMakeTrack(event, item)"
+          draggable="false"
+        />
+        <MarkDrawTrack
+          :track-list="item.trackList"
+          :special-tag-list="item.tagList"
+          :original-image="item.originalImage"
+          :slice-image="item.sliceImage"
+          :dx="item.dx"
+          :dy="item.dy"
+        />
+        <hr class="image-seperator" />
       </div>
-    </a-spin>
+    </div>
+    <!-- </a-spin> -->
   </div>
   <slot name="slot-cursor" />
 </template>
@@ -105,7 +108,7 @@ export default defineComponent({
       }
     );
 
-    let rendering = ref(false);
+    // let rendering = ref(false);
     let sliceImagesWithTrackList: Array<SliceImage> = reactive([]);
     let maxSliceWidth = 0; // 最大的裁切块宽度，图片容器以此为准
     let theFinalHeight = 0; // 最终宽度，用来定位轨迹在第几张图片，不包括image-seperator高度
@@ -351,7 +354,7 @@ export default defineComponent({
       }
 
       try {
-        rendering.value = true;
+        // rendering.value = true;
         store.globalMask = true;
 
         const hasSliceConfig = store.currentTask?.sliceConfig?.length;
@@ -368,7 +371,7 @@ export default defineComponent({
         emit("error");
       } finally {
         __lock = false;
-        rendering.value = false;
+        // rendering.value = false;
         store.globalMask = false;
       }
     };
@@ -456,7 +459,7 @@ export default defineComponent({
     return {
       dragContainer,
       store,
-      rendering,
+      // rendering,
       sliceImagesWithTrackList,
       answerPaperScale,
       markStatus,