优化类型声明

src/api/markPage.ts

@@ -102,7 +102,6 @@ export async function doProblemType(problemId: number) {
   markResult.problem = true;
   markResult.unselective = false;
   markResult.problemTypeId = problemId;
-  // @ts-ignore FIXME: should allow null
   markResult.markerScore = null;
   markResult.scoreList = [];
   markResult.specialTagList = [];

src/components/QmDialog.vue

@@ -77,8 +77,8 @@ const savedStyle = JSON.parse(
 if (savedStyle) {
   Object.assign(positionStyle, savedStyle);
 }
-let mouseHandler = $ref(null as unknown as HTMLHeadElement);
-let resizeHandler = $ref(null as unknown as HTMLDivElement);
+let mouseHandler = $ref<HTMLHeadElement>();
+let resizeHandler = $ref<HTMLDivElement>();
 
 const mousePosition = {
   offsetX: 0,
@@ -138,7 +138,6 @@ const handleResizeMouseMove = (e: MouseEvent) => {
   // console.log(e);
   // console.log("mouse move");
   const { clientX, clientY } = e;
-  // @ts-ignore
   const newXRatio = clientX - mousePosition.offsetX;
   const newYRatio = clientY - mousePosition.offsetY;
   positionStyle.width = parseFloat(positionStyle.width) + newXRatio + "px";

src/features/arbitrate/ArbitrateMarkList.vue

@@ -47,7 +47,7 @@ interface MarkDetail {
   scoreList: string;
 }
 
-let list = reactive([] as Array<MarkDetail>);
+let list: MarkDetail[] = reactive([]);
 
 watch(
   () => store.currentTask,

src/features/library/inspect/MarkBoardInspect.vue

@@ -120,7 +120,7 @@ import {
 } from "@/features/mark/use/focusTracks";
 
 const emit = defineEmits(["inspect", "reject"]);
-let checkedQuestions = reactive([] as Array<Question>);
+let checkedQuestions: Question[] = reactive([]);
 
 watch(
   () => store.currentTask,

src/features/mark/CommonMarkBody.vue

@@ -143,7 +143,7 @@ onUnmounted(() => {
 // end: 快捷键定位
 
 // start: 计算裁切图和裁切图上的分数轨迹和特殊标记轨迹
-let sliceImagesWithTrackList: Array<SliceImage> = reactive([]);
+let sliceImagesWithTrackList: SliceImage[] = reactive([]);
 let maxSliceWidth = 0; // 最大的裁切块宽度，图片容器以此为准
 let theFinalHeight = 0; // 最终宽度，用来定位轨迹在第几张图片，不包括image-seperator高度
 

src/features/mark/MarkChangeProfile.vue

@@ -49,7 +49,7 @@ interface User {
   password: string;
   confirmPassword: string;
 }
-const user = reactive<User>({
+const user: User = reactive({
   name: "",
   password: "",
   confirmPassword: "",

src/features/mark/MarkHeader.vue

@@ -347,7 +347,7 @@
 
 <script setup lang="ts">
 import { doLogout, updateUISetting } from "@/api/markPage";
-import { watchEffect } from "vue";
+import { watchEffect, ref } from "vue";
 import { store } from "@/store/store";
 import { ModeEnum } from "@/types";
 import MarkChangeProfile from "./MarkChangeProfile.vue";
@@ -392,24 +392,24 @@ const logout = () => {
   doLogout();
 };
 
-let changeProfileRef = $ref(null);
+let changeProfileRef = $ref<InstanceType<typeof MarkChangeProfile>>();
 
 const openProfileModal = () => {
-  // @ts-ignore
+  // @ts-ignore https://github.com/vuejs/vue-next/issues/4397
   changeProfileRef?.showModal();
 };
 
-let switchGroupRef = $ref(null);
+let switchGroupRef = $ref<InstanceType<typeof MarkSwitchGroupDialog>>();
 
 const openSwitchGroupModal = () => {
-  // @ts-ignore
+  // @ts-ignore https://github.com/vuejs/vue-next/issues/4397
   switchGroupRef?.showModal();
 };
 
-let problemRef = $ref(null);
+let problemRef = $ref<InstanceType<typeof MarkProblemDialog>>();
 
 const openProblemModal = () => {
-  // @ts-ignore
+  // @ts-ignore https://github.com/vuejs/vue-next/issues/4397
   problemRef?.showModal();
 };
 

src/features/mark/MarkHistory.vue

@@ -156,11 +156,11 @@ const props = withDefaults(
 let secretNumberInput = $ref("");
 let loading = $ref(false);
 let currentPage = $ref(1);
-let order = $ref<MarkHistoryOrderBy>("markerTime");
+let order: MarkHistoryOrderBy = $ref("markerTime");
 if (props.orderTimeField) {
   order = props.orderTimeField;
 }
-let sort = $ref<MarkHistorySortField>("DESC");
+let sort: MarkHistorySortField = $ref("DESC");
 
 const currentTaskChange = async () => {
   if (store.historyOpen) {

src/features/mark/MultiMediaMarkBody.vue

@@ -97,7 +97,7 @@ interface QuestionForRender {
   options: Array<{ number: number; body: RichTextJSON }>;
 }
 
-let questions = $ref([] as Array<QuestionForRender>);
+let questions: QuestionForRender[] = $ref([]);
 async function updateStudentAnswerJSON() {
   return getJSON(store.currentTask?.jsonUrl as string);
 }

src/features/mark/SheetViewModal.vue

@@ -39,7 +39,7 @@ import { store } from "@/store/store";
 import { loadImage } from "@/utils/utils";
 import type { PictureSlice } from "@/types";
 
-const dataUrls: Array<string> = reactive([]);
+const dataUrls: string[] = reactive([]);
 watch(
   () => store.sheetViewModal,
   async () => {

src/features/mark/use/draggable.ts

@@ -3,7 +3,7 @@ import { onMounted, onUnmounted } from "vue";
 export function dragImage() {
   // grab moving
   let pos = { top: 0, left: 0, x: 0, y: 0 };
-  let dragContainer = $ref(null as unknown as HTMLDivElement);
+  let dragContainer = $ref<HTMLDivElement>();
   // let isGrabbing = $ref(false);
 
   const mouseDownHandler = function (e: MouseEvent) {

src/features/mark/use/splitPane.ts

@@ -2,7 +2,7 @@ import { onMounted, onUnmounted, watchEffect } from "vue";
 
 export function dragSplitPane() {
   let pos = { y: 0 };
-  let dragSpliter = $ref(null as unknown as HTMLDivElement);
+  let dragSpliter = $ref<HTMLDivElement>();
   let topPercent = $ref(40);
 
   const mouseDownHandler = function (e: MouseEvent) {

src/features/student/importInspect/ImportInspect.vue

@@ -35,8 +35,8 @@ const { studentId } = route.query as {
   studentId: string;
 };
 
-let studentIds = $ref([] as Array<number>);
-let tagIds = $ref([] as Array<number>);
+let studentIds: number[] = $ref([]);
+let tagIds: number[] = $ref([]);
 let currentStudentId = $ref(0);
 
 async function updateSetting() {

src/features/student/importInspect/MarkBoardInspect.vue

@@ -102,7 +102,7 @@ import {
 const emit = defineEmits(["makeTag", "fetchTask"]);
 const props =
   defineProps<{ tagged: boolean; isFirst: boolean; isLast: boolean }>();
-let checkedQuestions = reactive([] as Array<Question>);
+let checkedQuestions: Question[] = reactive([]);
 
 watch(
   () => store.currentTask,

src/features/student/inspect/MarkBoardInspect.vue

@@ -120,7 +120,7 @@ import {
 } from "@/features/mark/use/focusTracks";
 
 const emit = defineEmits(["inspect", "reject"]);
-let checkedQuestions = reactive([] as Array<Question>);
+let checkedQuestions: Question[] = reactive([]);
 
 watch(
   () => store.currentTask,

src/features/student/inspect/MarkBody.vue

@@ -57,7 +57,7 @@ const { dragContainer } = dragImage();
 
 const { addTimeout } = useTimers();
 
-let sliceImagesWithTrackList: Array<SliceImage> = reactive([]);
+let sliceImagesWithTrackList: SliceImage[] = reactive([]);
 let maxImageWidth = 0;
 
 async function processImage() {