加载后的错误处理

src/features/arbitrate/Arbitrate.vue

@@ -7,7 +7,7 @@
         :should-reload="shouldReloadHistory"
       />
       <ArbitrateMarkList />
-      <mark-body />
+      <mark-body @error="renderError" />
       <mark-board-key-board
         v-if="showMarkBoardKeyBoard"
         @submit="saveTaskToServer"
@@ -233,6 +233,11 @@ export default defineComponent({
       }
     };
 
+    const renderError = () => {
+      store.currentTask = undefined;
+      store.message = "加载失败，请重新加载。";
+    };
+
     return {
       store,
       fetchTask,
@@ -241,6 +246,7 @@ export default defineComponent({
       showMarkBoardMouse,
       saveTaskToServer,
       shouldReloadHistory,
+      renderError,
     };
   },
 });

src/features/library/inspect/LibraryInspect.vue

@@ -6,7 +6,7 @@
         @reload="reloadAndfetchTask"
         :should-reload="shouldReloadHistory"
       />
-      <mark-body />
+      <mark-body @error="renderError" />
       <MarkBoardInspect @inspect="saveTaskToServer" @reject="rejectQuestions" />
     </div>
   </div>
@@ -172,6 +172,11 @@ export default defineComponent({
       }
     };
 
+    const renderError = () => {
+      store.currentTask = undefined;
+      store.message = "加载失败，请重新加载。";
+    };
+
     return {
       store,
       fetchTask,
@@ -179,6 +184,7 @@ export default defineComponent({
       saveTaskToServer,
       rejectQuestions,
       shouldReloadHistory,
+      renderError,
     };
   },
 });

src/features/library/libraryTrack/LibraryTrack.vue

@@ -2,7 +2,7 @@
   <div class="my-container">
     <mark-header />
     <div class="tw-flex tw-gap-1">
-      <mark-body />
+      <mark-body @error="renderError" />
     </div>
   </div>
 </template>
@@ -69,9 +69,15 @@ export default defineComponent({
       return getSingleLibraryTask(libraryId as string);
     }
 
+    const renderError = () => {
+      store.currentTask = undefined;
+      store.message = "加载失败，请重新加载。";
+    };
+
     return {
       store,
       fetchTask,
+      renderError,
     };
   },
 });

src/features/library/quality/Quality.vue

@@ -3,7 +3,7 @@
     <mark-header />
     <div class="tw-flex tw-gap-1">
       <mark-history />
-      <mark-body />
+      <mark-body @error="renderError" />
     </div>
   </div>
   <AnswerModal />
@@ -71,8 +71,14 @@ export default defineComponent({
       // fetchTask(); // mark-header 会调用 (watchEffect)
     });
 
+    const renderError = () => {
+      store.currentTask = undefined;
+      store.message = "加载失败，请重新加载。";
+    };
+
     return {
       store,
+      renderError,
     };
   },
 });

src/features/student/inspect/Inspect.vue

@@ -6,7 +6,7 @@
         @reload="reloadAndfetchTask"
         :should-reload="shouldReloadHistory"
       />
-      <mark-body />
+      <mark-body @error="renderError" />
       <MarkBoardInspect @inspect="saveTaskToServer" @reject="rejectQuestions" />
     </div>
   </div>
@@ -201,6 +201,11 @@ export default defineComponent({
       }
     };
 
+    const renderError = () => {
+      store.currentTask = undefined;
+      store.message = "加载失败，请重新加载。";
+    };
+
     return {
       store,
       fetchTask,
@@ -208,6 +213,7 @@ export default defineComponent({
       saveTaskToServer,
       rejectQuestions,
       shouldReloadHistory,
+      renderError,
     };
   },
 });

src/features/student/studentTrack/StudentTrack.vue

@@ -2,7 +2,7 @@
   <div class="my-container">
     <mark-header />
     <div class="tw-flex tw-gap-1">
-      <mark-body />
+      <mark-body @error="renderError" />
     </div>
   </div>
 </template>
@@ -74,9 +74,15 @@ export default defineComponent({
       return getSingleStudentTask(studentId as string);
     }
 
+    const renderError = () => {
+      store.currentTask = undefined;
+      store.message = "加载失败，请重新加载。";
+    };
+
     return {
       store,
       fetchTask,
+      renderError,
     };
   },
 });