fix type warnings

src/features/arbitrate/MarkDrawTrack.vue

@@ -1,129 +0,0 @@
-<template>
-  <template v-for="(track, index) in trackList" :key="index">
-    <div
-      class="score-container"
-      :class="[focusedTrack(track) && 'score-animation']"
-      :style="computeTopAndLeft(track)"
-    >
-      <span
-        class="tw-m-auto"
-        :id="'a' + track.mainNumber + track.subNumber + track.offsetY"
-      >
-        {{ track.score }}
-      </span>
-    </div>
-  </template>
-  <template v-for="(tag, index) in specialTagList" :key="index">
-    <div class="score-container" :style="computeTopAndLeft(tag)">
-      <span class="tw-m-auto">
-        {{ tag.tagName }}
-      </span>
-    </div>
-  </template>
-</template>
-
-<script lang="ts">
-import { SpecialTag, Track } from "@/types";
-import { defineComponent, PropType, watch } from "vue";
-import { store } from "./store";
-
-export default defineComponent({
-  name: "MarkDrawTrack",
-  props: {
-    trackList: {
-      type: Array as PropType<Array<Track>>,
-    },
-    specialTagList: {
-      type: Array as PropType<Array<SpecialTag>>,
-    },
-    originalImage: {
-      type: Object as PropType<HTMLImageElement>,
-      required: true,
-    },
-    sliceImage: {
-      type: Object as PropType<HTMLImageElement>,
-      required: true,
-    },
-    dx: { type: Number, required: true },
-    dy: { type: Number, required: true },
-  },
-  setup({ trackList, originalImage, sliceImage, dx, dy }) {
-    const focusedTrack = (track: Track) => {
-      return store.focusTracks.includes(track);
-    };
-    const computeTopAndLeft = (track: Track | SpecialTag) => {
-      const topInsideSlice = track.offsetY - dy;
-      const leftInsideSlice = track.offsetX - dx;
-      return {
-        top: (topInsideSlice / sliceImage.naturalHeight) * 100 + "%",
-        left: (leftInsideSlice / sliceImage.naturalWidth) * 100 + "%",
-        "font-size": store.setting.uiSetting["answer.paper.scale"] * 2.2 + "em",
-      };
-    };
-
-    watch(
-      () => store.focusTracks.length,
-      () => {
-        if (store.focusTracks.length === 0) return;
-        const minImageIndex = Math.min(
-          ...store.focusTracks.map((t) => t.offsetIndex)
-        );
-        const minImageOffsetY = Math.min(
-          ...store.focusTracks
-            .filter((t) => t.offsetIndex === minImageIndex)
-            .map((t) => t.offsetY)
-        );
-        const topTrack = store.focusTracks.find(
-          (t) =>
-            t.offsetIndex === minImageIndex && t.offsetY === minImageOffsetY
-        );
-        if (topTrack) {
-          document
-            .querySelector(
-              `#a${topTrack.mainNumber + topTrack.subNumber + topTrack.offsetY}`
-            )
-            ?.scrollIntoView({ behavior: "smooth" });
-        }
-      }
-    );
-
-    return { store, focusedTrack, computeTopAndLeft };
-  },
-});
-</script>
-
-<style scoped>
-.score-container {
-  position: absolute;
-  display: flex;
-  place-content: center;
-  color: red;
-
-  /* to center score */
-  width: 200px;
-  height: 200px;
-  margin-top: -100px;
-  margin-left: -100px;
-
-  /* to click through div */
-  pointer-events: none;
-}
-.score-animation {
-  animation: 2s ease-in-out 0s infinite alternate change_color;
-}
-
-@keyframes change_color {
-  from {
-    color: red;
-    font-size: 2em;
-    margin-top: -100px;
-    margin-left: -100px;
-  }
-  to {
-    color: black;
-    font-size: 4em;
-    margin-top: -80px;
-    margin-left: -80px;
-  }
-}
-</style>

src/features/arbitrate/store.ts

@@ -1,55 +0,0 @@
-import { MarkStore, Setting } from "@/types";
-import { reactive } from "vue";
-
-const obj = {
-  setting: {
-    mode: "TRACK",
-    examType: "SCAN_IMAGE",
-    forceMode: false,
-    sheetView: false,
-    sheetConfig: [],
-    enableAllZero: false,
-    fileServer: "",
-    userName: "",
-    subject: <Setting["subject"]>{},
-    forceSpecialTag: false,
-    uiSetting: {
-      "answer.paper.scale": 1,
-      "score.board.collapse": false,
-      "normal.mode": "keyboard",
-      "paper.modal": false,
-      "answer.modal": false,
-      "minimap.modal": false,
-      "specialTag.modal": false,
-    },
-    statusValue: "FORMAL",
-    problemTypes: [],
-    groupNumber: 0,
-    groupTitle: "",
-    topCount: 0,
-    splitConfig: [],
-    prefetchCount: 3,
-    startTime: 0,
-    endTime: 0,
-  },
-  status: <MarkStore["status"]>{},
-  groups: [],
-  tasks: [],
-  message: null,
-  currentMarkResult: undefined,
-  currentTask: undefined,
-  currentQuestion: undefined,
-  currentScore: undefined,
-  currentSpecialTag: undefined,
-  markResults: [],
-  historyOpen: false,
-  MarkBoardTrackCollapse: false,
-  historyTasks: [],
-  removeScoreTracks: [],
-  maxModalZIndex: 1020,
-  minimapScrollTo: 0,
-  allPaperModal: false,
-  sheetViewModal: false,
-} as MarkStore;
-
-export const store = reactive(obj);

src/features/library/inspect/LibraryInspect.vue

@@ -14,13 +14,13 @@
 
 <script lang="ts">
 import { computed, defineComponent, onMounted, ref } from "vue";
-import { store } from "./store";
+import { store } from "@/features/mark/store";
 import MarkHeader from "./MarkHeader.vue";
 import { useRoute } from "vue-router";
 import MarkBody from "./MarkBody.vue";
 import MarkHistory from "./MarkHistory.vue";
 import MarkBoardInspect from "./MarkBoardInspect.vue";
-import { Question, Task } from "@/types";
+import { MarkStore, Question, Task } from "@/types";
 import { message } from "ant-design-vue";
 import {
   clearInspectedTask,
@@ -59,7 +59,7 @@ export default defineComponent({
       store.setting.uiSetting = {
         "answer.paper.scale": 1,
         "score.board.collapse": false,
-      };
+      } as MarkStore["setting"]["uiSetting"];
       store.setting.splitConfig = settingRes.data.splitConfig;
     }
     async function updateStatus() {
@@ -88,7 +88,8 @@ export default defineComponent({
         rawTask.jsonUrl = store.setting.fileServer + rawTask.jsonUrl;
         store.currentTask = res.data;
         if (store.currentTask)
-          store.setting.subject = store.currentTask.subject;
+          store.setting.subject = store.currentTask
+            .subject as MarkStore["setting"]["subject"];
       } else {
         store.message = res.data.message;
       }

src/features/library/inspect/MarkBoardInspect.vue

@@ -12,7 +12,10 @@
       <template v-for="(groupNumber, index) in groups" :key="index">
         <div class="tw-mb-4">
           <div
-            class="tw-flex tw-justify-between tw-place-items-center hover:tw-bg-gray-200"
+            class="
+              tw-flex tw-justify-between tw-place-items-center
+              hover:tw-bg-gray-200
+            "
             style="border-bottom: 1px solid grey"
             @mouseover="addFocusTrack(groupNumber, undefined, undefined)"
             @mouseleave="removeFocusTrack"
@@ -30,7 +33,11 @@
             <template v-for="(question, index) in questions" :key="index">
               <div
                 v-if="question.groupNumber === groupNumber"
-                class="question tw-flex tw-place-items-center tw-mb-1 tw-ml-2 hover:tw-bg-gray-200"
+                class="
+                  question
+                  tw-flex tw-place-items-center tw-mb-1 tw-ml-2
+                  hover:tw-bg-gray-200
+                "
                 @mouseover="
                   addFocusTrack(
                     undefined,
@@ -87,7 +94,7 @@
 import { Question } from "@/types";
 import { message } from "ant-design-vue";
 import { computed, defineComponent, reactive, watch } from "vue";
-import { store } from "./store";
+import { store } from "@/features/mark/store";
 
 export default defineComponent({
   name: "MarkBoardInspect",

src/features/library/inspect/MarkBody.vue

@@ -11,7 +11,7 @@
 <script lang="ts">
 import CommonMarkBody from "@/features/mark/CommonMarkBody.vue";
 import { defineComponent, watch } from "vue";
-import { store } from "./store";
+import { store } from "@/features/mark/store";
 
 export default defineComponent({
   name: "MarkBody",

src/features/library/inspect/MarkHeader.vue

@@ -64,7 +64,7 @@
 
 <script lang="ts">
 import { computed, defineComponent, onMounted, ref } from "vue";
-import { store } from "./store";
+import { store } from "@/features/mark/store";
 import {
   ZoomInOutlined,
   ZoomOutOutlined,

src/features/library/inspect/MarkHistory.vue

@@ -56,7 +56,7 @@ import { getInspectedHistory } from "@/api/inspectPage";
 import { Task } from "@/types";
 import { defineComponent, ref, watch, watchEffect } from "vue";
 import { useRoute } from "vue-router";
-import { store } from "./store";
+import { store } from "@/features/mark/store";
 import { CloseOutlined } from "@ant-design/icons-vue";
 import { cloneDeep } from "lodash";
 

src/features/library/inspect/store.ts

@@ -1,26 +0,0 @@
-import { InspectStore, Task } from "@/types";
-import { reactive } from "vue";
-
-const obj = {
-  setting: {
-    fileServer: "",
-    userName: "",
-    subject: { name: "", code: "" },
-    uiSetting: {
-      "answer.paper.scale": 1,
-      "score.board.collapse": false,
-    },
-    splitConfig: [],
-  },
-  status: {
-    totalCount: 0,
-  },
-  currentTask: undefined,
-  historyOpen: false,
-  MarkBoardTrackCollapse: false,
-  historyTasks: [],
-  focusTracks: [],
-  message: null,
-} as InspectStore;
-
-export const store = reactive(obj);

src/features/library/libraryTrack/LibraryTrack.vue

@@ -9,11 +9,11 @@
 
 <script lang="ts">
 import { defineComponent, onMounted } from "vue";
-import { store } from "./store";
+import { store } from "@/features/mark/store";
 import MarkHeader from "./MarkHeader.vue";
 import { useRoute } from "vue-router";
 import MarkBody from "./MarkBody.vue";
-import { Task } from "@/types";
+import { MarkStore, Task } from "@/types";
 import { message } from "ant-design-vue";
 import { getSingleLibraryTask } from "@/api/libraryTrackPage";
 
@@ -39,7 +39,7 @@ export default defineComponent({
         store.setting.uiSetting = {
           "answer.paper.scale": 1,
           "score.board.collapse": false,
-        };
+        } as MarkStore["setting"]["uiSetting"];
 
         let task = res.data.task as Task;
 
@@ -48,9 +48,9 @@ export default defineComponent({
         );
 
         store.currentTask = task;
-        console.log(store.currentTask);
         if (store.currentTask)
-          store.setting.subject = store.currentTask.subject;
+          store.setting.subject = store.currentTask
+            .subject as MarkStore["setting"]["subject"];
       } else {
         store.message = res.data.message;
       }

src/features/library/libraryTrack/MarkBody.vue

@@ -11,7 +11,7 @@
 <script lang="ts">
 import CommonMarkBody from "@/features/mark/CommonMarkBody.vue";
 import { defineComponent, watch } from "vue";
-import { store } from "./store";
+import { store } from "@/features/mark/store";
 
 export default defineComponent({
   name: "MarkBody",

src/features/library/libraryTrack/MarkHeader.vue

@@ -41,7 +41,7 @@
 
 <script lang="ts">
 import { computed, defineComponent } from "vue";
-import { store } from "./store";
+import { store } from "@/features/mark/store";
 import {
   ZoomInOutlined,
   ZoomOutOutlined,

src/features/library/libraryTrack/store.ts

@@ -1,26 +0,0 @@
-import { InspectStore, Task } from "@/types";
-import { reactive } from "vue";
-
-const obj = {
-  setting: {
-    fileServer: "",
-    userName: "",
-    subject: { name: "", code: "" },
-    uiSetting: {
-      "answer.paper.scale": 1,
-      "score.board.collapse": false,
-    },
-    splitConfig: [],
-  },
-  status: {
-    totalCount: 0,
-  },
-  currentTask: undefined,
-  historyOpen: false,
-  MarkBoardTrackCollapse: false,
-  historyTasks: [],
-  focusTracks: [],
-  message: null,
-} as InspectStore;
-
-export const store = reactive(obj);

src/features/mark/store.ts

@@ -46,6 +46,7 @@ const obj = {
   MarkBoardTrackCollapse: false,
   historyTasks: [],
   removeScoreTracks: [],
+  focusTracks: [],
   maxModalZIndex: 1020,
   minimapScrollTo: 0,
   allPaperModal: false,