解决悬浮框遮盖的问题

src/components/QmDialog.vue

@@ -1,6 +1,10 @@
 <template>
   <teleport to="body">
-    <div class="dialog-container" :style="positionStyle">
+    <div
+      class="dialog-container"
+      :style="positionStyle"
+      @click="increaseZIndex"
+    >
       <header
         ref="mouseHandler"
         class="tw-flex tw-place-content-between"
@@ -26,9 +30,9 @@
 </template>
 
 <script lang="ts">
-import { store } from "@/features/mark/store";
 import { defineComponent, onUnmounted, reactive, ref } from "vue";
 import { CloseOutlined } from "@ant-design/icons-vue";
+import { store } from "@/features/mark/store";
 
 export default defineComponent({
   components: { CloseOutlined },
@@ -37,14 +41,16 @@ export default defineComponent({
     top: { type: String, default: "10%" },
     width: { type: String, default: "30%" },
     height: { type: String, default: "30%" },
+    zIndex: { type: Number, default: 1000 },
   },
   emits: ["close"],
-  setup({ top, width, height, title }) {
+  setup({ top, width, height, title, zIndex }) {
     const positionStyle = reactive({
       top,
       left: "10%",
       width,
       height,
+      zIndex,
     });
 
     const savedStyle = JSON.parse(
@@ -136,12 +142,19 @@ export default defineComponent({
       }
     });
 
+    const increaseZIndex = () => {
+      positionStyle.zIndex = store.maxModalZIndex++;
+      if (store.maxModalZIndex === 5000) {
+        store.maxModalZIndex = 1020;
+      }
+    };
     return {
       positionStyle,
       mouseHandler,
       resizeHandler,
       handleDragMouseDown,
       handleResizeMouseDown,
+      increaseZIndex,
     };
   },
 });

src/features/mark/PaperModal.vue

@@ -31,7 +31,7 @@ export default defineComponent({
       return store.setting.fileServer + store.setting.subject.paperUrl;
     });
     const close = () => {
-      store.setting.uiSetting["answer.modal"] = false;
+      store.setting.uiSetting["paper.modal"] = false;
     };
     return { store, paperPDFUrl, close };
   },

src/features/mark/store.ts

@@ -42,6 +42,7 @@ const obj = {
   MarkBoardTrackCollapse: false,
   historyTasks: [],
   removeScoreTracks: [],
+  maxModalZIndex: 1020,
 } as MarkStore;
 
 /** 如果currentTask不存在，则返回undefined; 如果currentMarkResult不存在，则创建一个对应的markResult并返回 */

src/types/index.ts

@@ -19,6 +19,7 @@ export interface MarkStore {
   historyTasks: Array<Task>;
   removeScoreTracks: Array<Track>;
   message: string | null;
+  maxModalZIndex: number;
 }
 
 export interface Setting {