评卷：分数段更新

src/api/markPage.ts

@@ -66,40 +66,40 @@ export async function getHistoryTask({
 export async function saveTask() {
   const markResult = findCurrentTaskMarkResult();
   if (markResult) {
-    const scoreGroups = groupBy(
-      markResult.trackList,
-      (obj) =>
-        (obj.mainNumber + "").padStart(10, "0") +
-        obj.subNumber.padStart(10, "0")
-    );
-    const questionWithScore = Object.entries(scoreGroups);
-    const questionWithTotalScore = questionWithScore.map((v) => [
-      v[0],
-      v[1].reduce((acc, c) => (acc += c.score), 0),
-    ]);
-    const questionWithTotalScoreSorted = sortBy(
-      questionWithTotalScore,
-      (obj) => obj[0]
-    );
-    const scoreList = questionWithTotalScoreSorted.map((s) => s[1]);
-    // console.log(
-    //   scoreGroups,
-    //   questionWithScore,
+    // const scoreGroups = groupBy(
+    //   markResult.trackList,
+    //   (obj) =>
+    //     (obj.mainNumber + "").padStart(10, "0") +
+    //     obj.subNumber.padStart(10, "0")
+    // );
+    // const questionWithScore = Object.entries(scoreGroups);
+    // const questionWithTotalScore = questionWithScore.map((v) => [
+    //   v[0],
+    //   v[1].reduce((acc, c) => (acc += c.score), 0),
+    // ]);
+    // const questionWithTotalScoreSorted = sortBy(
     //   questionWithTotalScore,
-    //   questionWithTotalScoreSorted,
-    //   scoreList
+    //   (obj) => obj[0]
     // );
-    markResult.scoreList = scoreList as number[];
-    // const sortScore = orderBy(markResult.trackList, ['mainNumber', 'subNumber', 'score']);
-    // markResult.scoreList = sortScore.reduce((acc, pre) => {
-    //   if(pre.mainNumber === cur.mainNumber && pre.subNumber === cur.subNumber) {
-    //     acc[acc.length-1] += cur.score
-    //   }
-    // }, [0])
-    markResult.markerScore =
-      markResult.trackList
-        .map((t) => t.score)
-        .reduce((acc, v) => (acc += v * 100), 0) / 100;
+    // const scoreList = questionWithTotalScoreSorted.map((s) => s[1]);
+    // // console.log(
+    // //   scoreGroups,
+    // //   questionWithScore,
+    // //   questionWithTotalScore,
+    // //   questionWithTotalScoreSorted,
+    // //   scoreList
+    // // );
+    // markResult.scoreList = scoreList as number[];
+    // // const sortScore = orderBy(markResult.trackList, ['mainNumber', 'subNumber', 'score']);
+    // // markResult.scoreList = sortScore.reduce((acc, pre) => {
+    // //   if(pre.mainNumber === cur.mainNumber && pre.subNumber === cur.subNumber) {
+    // //     acc[acc.length-1] += cur.score
+    // //   }
+    // // }, [0])
+    // markResult.markerScore =
+    //   markResult.trackList
+    //     .map((t) => t.score)
+    //     .reduce((acc, v) => (acc += v * 100), 0) / 100;
     markResult.specialTagList = [];
     markResult.problem = false;
     markResult.spent = Date.now() - markResult.spent;

src/components/mark/MarkBoard.vue

@@ -2,10 +2,17 @@
   <div
     v-if="store.currentTask"
     :style="{ display: store.markBoardCollapse ? 'none' : 'block' }"
-    style="max-width: 250px; min-width: 250px; border: 1px solid grey"
+    style="
+      max-width: 250px;
+      min-width: 250px;
+      border: 1px solid grey;
+      padding-left: 6px;
+    "
   >
     <div>
-      <h1 class="text-3xl text-center">总分：{{ markResultScore }}</h1>
+      <h1 class="text-3xl text-center">
+        总分：{{ store.currentMarkResult?.markerScore || 0 }}
+      </h1>
     </div>
     <div>
       <div class="text-2xl text-center" @click="submit">提交</div>
@@ -21,7 +28,8 @@
       >
         <div
           @click="chooseQuestion(question)"
-          class="question"
+          class="question rounded p-1"
+          style="min-width: 100px"
           :class="isCurrentQuestion(question) && 'current-question'"
         >
           <div>
@@ -61,14 +69,6 @@ export default defineComponent({
   setup(props, { emit }) {
     const markResult = findCurrentTaskMarkResult();
 
-    const markResultScore = computed(() => {
-      return markResult
-        ? markResult.trackList
-            .map((t) => t.score)
-            .reduce((acc, v) => (acc += v * 100), 0) / 100
-        : 0;
-    });
-
     const questionScoreSteps = computed(() => {
       const question = store.currentQuestion;
       if (!question) return [];
@@ -124,7 +124,6 @@ export default defineComponent({
     return {
       store,
       markResult,
-      markResultScore,
       isCurrentQuestion,
       chooseQuestion,
       isCurrentScore,
@@ -143,6 +142,7 @@ export default defineComponent({
 }
 .current-question {
   border: 1px solid yellowgreen;
+  background-color: lightblue;
 }
 .single-score {
   width: 30px;
@@ -155,5 +155,6 @@ export default defineComponent({
 }
 .current-score {
   border: 1px solid yellowgreen;
+  background-color: lightblue;
 }
 </style>

src/components/mark/MarkBody.vue

@@ -87,6 +87,7 @@ export default defineComponent({
         store.markResults = [...store.markResults, markResult];
         // console.log("watcheffect markResult 2", markResult, store.markResults);
       }
+      if (!markResult || !store.currentTask) return;
       // store.markResults.splice(store.markResults.indexOf(markResult), 1);
       // store.markResults.push(markResult);
       // console.log("watcheffect markResult 3", markResult, store.markResults);
@@ -308,7 +309,8 @@ export default defineComponent({
 
     const makeMark = (event: MouseEvent, item: SliceImage) => {
       // console.log(item);
-      if (!store.currentQuestion || !store.currentScore) return;
+      if (!store.currentQuestion || typeof store.currentScore === "undefined")
+        return;
       const target = event.target as HTMLImageElement;
       const track = {} as Track;
       // TODO: choose question first
@@ -339,6 +341,7 @@ export default defineComponent({
         console.log("不在有效宽度内，轨迹不生效");
         return;
       }
+      store.currentScore = undefined;
       const markResult = findCurrentTaskMarkResult();
       // console.log("makemark markresult", markResult);
       if (markResult) {

src/components/mark/store.ts

@@ -1,5 +1,6 @@
 import { ModeEnum, Setting, MarkStore, Task } from "@/types";
-import { reactive } from "vue";
+import { groupBy, sortBy } from "lodash";
+import { reactive, watch } from "vue";
 
 const obj = {
   setting: {
@@ -26,6 +27,7 @@ const obj = {
   status: <MarkStore["status"]>{},
   groups: [],
   tasks: [],
+  currentMarkResult: undefined,
   currentTask: <Task>{},
   currentQuestion: undefined,
   currentScore: undefined,
@@ -63,3 +65,65 @@ export function findCurrentTaskMarkResult() {
 export function markScore() {}
 
 export const store = reactive(obj);
+
+watch(
+  () => store.currentTask,
+  () => {
+    const m = findCurrentTaskMarkResult();
+    store.currentMarkResult = m;
+  }
+);
+
+watch(
+  () => store.currentMarkResult?.trackList,
+  () => {
+    const markResult = findCurrentTaskMarkResult();
+    if (markResult) {
+      const scoreGroups = groupBy(
+        markResult.trackList,
+        (obj) =>
+          (obj.mainNumber + "").padStart(10, "0") +
+          obj.subNumber.padStart(10, "0")
+      );
+      const questionWithScore = Object.entries(scoreGroups);
+      const questionWithTotalScore = questionWithScore.map((v) => [
+        v[0],
+        v[1].reduce((acc, c) => (acc += c.score), 0),
+      ]);
+      const questionWithTotalScoreSorted = sortBy(
+        questionWithTotalScore,
+        (obj) => obj[0]
+      );
+      const scoreList = questionWithTotalScoreSorted.map((s) => s[1]);
+      // console.log(
+      //   scoreGroups,
+      //   questionWithScore,
+      //   questionWithTotalScore,
+      //   questionWithTotalScoreSorted,
+      //   scoreList
+      // );
+      const cq = store.currentQuestion;
+      if (cq) {
+        cq.score = markResult.trackList
+          .filter(
+            (v) =>
+              v.mainNumber === cq.mainNumber && v.subNumber === cq.subNumber
+          )
+          .map((v) => v.score)
+          .reduce((acc, v) => (acc += v));
+      }
+      markResult.scoreList = scoreList as number[];
+      // const sortScore = orderBy(markResult.trackList, ['mainNumber', 'subNumber', 'score']);
+      // markResult.scoreList = sortScore.reduce((acc, pre) => {
+      //   if(pre.mainNumber === cur.mainNumber && pre.subNumber === cur.subNumber) {
+      //     acc[acc.length-1] += cur.score
+      //   }
+      // }, [0])
+      markResult.markerScore =
+        markResult.trackList
+          .map((t) => t.score)
+          .reduce((acc, v) => (acc += v * 100), 0) / 100;
+    }
+  },
+  { deep: true }
+);

src/types/index.ts

@@ -10,6 +10,7 @@ export interface MarkStore {
   };
   tasks: Array<Task>; // 保持数量为3
   currentTask?: Task; // 用来切换task，还有回看
+  currentMarkResult?: MarkResult;
   currentQuestion?: Question;
   currentScore?: number;
   markResults: Array<MarkResult>;