Browse Source

Merge branch 'master' into release_1.3.8

chenhao 2 years ago
parent
commit
a45136adfb
2 changed files with 86 additions and 144 deletions
  1. 5 12
      src/features/mark/Mark.vue
  2. 81 132
      src/features/mark/MarkHeader.vue

+ 5 - 12
src/features/mark/Mark.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="my-container">
-    <mark-header />
+    <mark-header :showTotalScore="store.isMultiMedia" />
     <div class="tw-flex tw-gap-1">
       <mark-history showSearch showOrder :getHistory="getHistoryTask" />
       <mark-body @error="removeBrokenTask" />
@@ -33,17 +33,9 @@
   <SpecialTagModal />
   <ShortCutModal />
   <MarkBoardTrackDialog
-    v-if="store.isTrackMode"
-    @submit="saveTaskToServer"
-    @allZeroSubmit="allZeroSubmit"
-    @unselectiveSubmit="unselectiveSubmit"
-  />
-  <a-spin
-    v-if="statusSpinning"
-    wrapperClassName="status-spin"
-    size="large"
-    :spinning="loadingStatusSpinning"
-  >
+v-if="store.isTrackMode" @submit="saveTaskToServer" @allZeroSubmit="allZeroSubmit"
+    @unselectiveSubmit="unselectiveSubmit" />
+  <a-spin v-if="statusSpinning" wrapperClassName="status-spin" size="large" :spinning="loadingStatusSpinning">
     <div
       style="height: 100vh"
       class="tw-text-8xl tw-flex tw-items-center tw-justify-center tw-text-red-500"
@@ -464,6 +456,7 @@ const saveTaskToServer = async () => {
   width: 100%;
   overflow: clip;
 }
+
 .status-spin {
   position: absolute;
   top: 0;

+ 81 - 132
src/features/mark/MarkHeader.vue

@@ -1,35 +1,26 @@
 <template>
   <div
-    v-if="store.setting && store.setting.subject.name"
-    class="tw-flex tw-gap-2 tw-justify-between tw-items-center header-container"
-  >
+v-if="store.setting && store.setting.subject.name"
+    class="tw-flex tw-gap-2 tw-justify-between tw-items-center header-container">
     <a-tooltip>
       <template #title>回评</template>
       <div
-        class="tw-flex tw-place-content-center tw-cursor-pointer tw-relative menu"
-        :class="[store.historyOpen && 'menu-toggled']"
-        @click="store.toggleHistory"
-      >
+class="tw-flex tw-place-content-center tw-cursor-pointer tw-relative menu"
+        :class="[store.historyOpen && 'menu-toggled']" @click="store.toggleHistory">
         <span class="tw-inline-flex tw-place-content-center">
-          <img
-            src="./images/left-menu.svg"
-            :class="[store.historyOpen && 'svg-red']"
-          />
+          <img src="./images/left-menu.svg" :class="[store.historyOpen && 'svg-red']" />
         </span>
         <div v-if="store.historyOpen" class="triangle"></div>
       </div>
     </a-tooltip>
     <div style="max-width: 12%; margin-left: -20px">
       <a
-        class="tw-text-white tw-block tw-overflow-ellipsis tw-overflow-hidden tw-whitespace-nowrap header-big-text"
-        :title="store.setting.subject.name"
-        href="/mark/subject-select"
-        @dragstart.prevent
-      >
+class="tw-text-white tw-block tw-overflow-ellipsis tw-overflow-hidden tw-whitespace-nowrap header-big-text"
+        :title="store.setting.subject.name" href="/mark/subject-select" @dragstart.prevent>
         {{
-          `${store.setting.subject.code ?? ""}-${
-            store.setting.subject.name ?? ""
-          }`
+        `${store.setting.subject.code ?? ""}-${
+        store.setting.subject.name ?? ""
+        }`
         }}
       </a>
     </div>
@@ -41,10 +32,8 @@
           待仲裁{{ store.status.arbitrateCount }}
         </template>
         <img
-          src="./images/problems.svg"
-          :class="questionMarkShouldChange && 'question-mark-animation'"
-          @mouseover="questionMarkShouldChange = false"
-        />
+src="./images/problems.svg" :class="questionMarkShouldChange && 'question-mark-animation'"
+          @mouseover="questionMarkShouldChange = false" />
       </a-tooltip>
     </div>
     <!-- <div v-if="store.setting.statusValue === 'TRIAL'">试评</div> -->
@@ -55,24 +44,27 @@
           {{ store.currentTask?.secretNumber ?? "-" }}
         </span>
       </div>
-      <div
-        v-if="store.currentTask && store.currentTask.objectiveScore !== null"
-      >
+      <div v-if="store.currentTask && store.currentTask.objectiveScore !== null">
         <span class="header-small-text">客观分</span>
         <span class="highlight-text">
           {{ store.currentTask.objectiveScore }}
         </span>
       </div>
+      <div v-if="props.showTotalScore && store.currentTask && store.currentTask.objectiveScore !== null" style="margin-left: 0.5em">
+        <span class="header-small-text">成绩</span>
+        <span class="highlight-text" style="margin-left: 0.2em; margin-top: 0.1em">
+          {{
+            parseFloat((((Math.max(store.currentTask.objectiveScore || 0, 0) * 100 +
+          Math.max(store.currentTask.markResult?.markerScore || 0, 0) * 100) | 0) / 100).toFixed(2))
+          }}
+        </span>
+      </div>
     </div>
     <div v-show="store.status.totalCount" class="tw-flex tw-gap-2">
       <span style="display: inline-flex; height: 16px; min-width: 55px">
         <span class="header-small-text">已评</span>
         <transition-group name="count-animation" tag="span">
-          <span
-            :key="store.status.personCount || 0"
-            class="highlight-text"
-            style="display: block"
-          >
+          <span :key="store.status.personCount || 0" class="highlight-text" style="display: block">
             {{ store.status.personCount }}
           </span>
         </transition-group>
@@ -84,11 +76,7 @@
       <span style="display: inline-flex; height: 16px; min-width: 55px">
         <span class="header-small-text">未评</span>
         <transition-group name="count-animation" tag="span">
-          <span
-            :key="todoCount || 0"
-            class="highlight-text"
-            style="display: block"
-          >
+          <span :key="todoCount || 0" class="highlight-text" style="display: block">
             {{ todoCount }}
           </span>
         </transition-group>
@@ -96,11 +84,7 @@
       <span style="display: inline-flex; height: 16px; min-width: 60px">
         <span class="header-small-text">进度</span>
         <transition-group name="count-animation" tag="span">
-          <span
-            :key="progress || '-'"
-            class="highlight-text"
-            style="display: block"
-          >
+          <span :key="progress || '-'" class="highlight-text" style="display: block">
             {{ progress }}%
           </span>
         </transition-group>
@@ -112,22 +96,18 @@
           评卷时间段
           <br />
           {{
-            store.setting.startTime > 0
-              ? $filters.datetimeFilter(store.setting.startTime)
-              : "-"
+          store.setting.startTime > 0
+          ? $filters.datetimeFilter(store.setting.startTime)
+          : "-"
           }}
           <br />~<br />
           {{
-            store.setting.endTime > 0
-              ? $filters.datetimeFilter(store.setting.endTime)
-              : "-"
+          store.setting.endTime > 0
+          ? $filters.datetimeFilter(store.setting.endTime)
+          : "-"
           }}
         </template>
-        <img
-          src="./images/time.png"
-          style="width: 16px; height: 16px"
-          class="svg-red-hover"
-        />
+        <img src="./images/time.png" style="width: 16px; height: 16px" class="svg-red-hover" />
       </a-tooltip>
     </div>
     <div class="tw-flex">
@@ -140,46 +120,37 @@
           </a-menu>
         </template>
         <a-button
-          style="
+style="
             color: rgba(255, 255, 255, 0.5);
             border: none;
             display: flex;
             align-items: center;
-          "
-        >
+          ">
           <img
-            src="./images/trackmode.png"
-            style="
+src="./images/trackmode.png" style="
               width: 11px;
               height: 12px;
               display: inline;
               margin-right: 2px;
-            "
-          />
+            " />
           {{ modeName }}
           <div v-if="!store.setting.forceMode" class="dropdown-triangle"></div>
         </a-button>
       </a-dropdown>
     </div>
-    <a-popover
-      v-if="!store.isScanImage"
-      title="小助手"
-      trigger="hover"
-      class="tw-cursor-pointer"
-    >
+    <a-popover v-if="!store.isScanImage" title="小助手" trigger="hover" class="tw-cursor-pointer">
       <template #content>
         <table class="assistant-table">
           <tr v-if="store.setting.statusValue !== 'TRIAL'">
             <td>问题卷</td>
-            <td><a-button @click="openProblemModal">选择问题类型</a-button></td>
+            <td>
+              <a-button @click="openProblemModal">选择问题类型</a-button>
+            </td>
           </tr>
         </table>
       </template>
       <div class="tw-flex tw-items-center">
-        <img
-          src="./images/assistant.png"
-          style="width: 10px; height: 12px; margin-right: 2px"
-        />
+        <img src="./images/assistant.png" style="width: 10px; height: 12px; margin-right: 2px" />
         <span>小助手</span>
         <div class="dropdown-triangle"></div>
       </div>
@@ -194,22 +165,20 @@
           <tr v-if="store.setting.subject.paperUrl">
             <td>试卷</td>
             <td>
-              <a-switch
-                v-model:checked="store.setting.uiSetting['paper.modal']"
-              />
+              <a-switch v-model:checked="store.setting.uiSetting['paper.modal']" />
             </td>
           </tr>
           <tr v-if="store.setting.subject.answerUrl">
             <td>答案</td>
             <td>
-              <a-switch
-                v-model:checked="store.setting.uiSetting['answer.modal']"
-              />
+              <a-switch v-model:checked="store.setting.uiSetting['answer.modal']" />
             </td>
           </tr>
           <tr>
             <td>全卷</td>
-            <td><a-switch v-model:checked="store.allPaperModal" /></td>
+            <td>
+              <a-switch v-model:checked="store.allPaperModal" />
+            </td>
           </tr>
           <tr v-if="store.setting.sheetView">
             <td>原图</td>
@@ -220,31 +189,24 @@
           <tr>
             <td>缩略图</td>
             <td>
-              <a-switch
-                v-model:checked="store.setting.uiSetting['minimap.modal']"
-              />
+              <a-switch v-model:checked="store.setting.uiSetting['minimap.modal']" />
             </td>
           </tr>
           <tr>
             <td>特殊标记</td>
             <td>
-              <a-switch
-                v-model:checked="store.setting.uiSetting['specialTag.modal']"
-              />
+              <a-switch v-model:checked="store.setting.uiSetting['specialTag.modal']" />
             </td>
           </tr>
           <tr v-if="store.setting.statusValue !== 'TRIAL'">
             <td>问题卷</td>
             <td>
               <a-button
-                type="text"
-                style="
+type="text" style="
                   color: var(--app-primary-button-bg-color);
                   margin-right: -15px;
                   height: 25px;
-                "
-                @click="openProblemModal"
-              >
+                " @click="openProblemModal">
                 选择问题类型
               </a-button>
             </td>
@@ -253,20 +215,14 @@
             <td>分数/标记大小</td>
             <td>
               <a-slider
-                v-model:value="store.setting.uiSetting['score.fontSize.scale']"
-                :min="0.5"
-                :step="0.1"
-                :max="2"
-                style="margin: 0"
-              />
+v-model:value="store.setting.uiSetting['score.fontSize.scale']" :min="0.5" :step="0.1" :max="2"
+                style="margin: 0" />
             </td>
           </tr>
           <tr v-if="store.isScanImage">
             <td>快捷键</td>
             <td>
-              <a-switch
-                v-model:checked="store.setting.uiSetting['shortCut.modal']"
-              />
+              <a-switch v-model:checked="store.setting.uiSetting['shortCut.modal']" />
             </td>
           </tr>
         </table>
@@ -281,54 +237,33 @@
       </div>
     </a-popover>
     <div
-      class="tw-flex tw-place-content-center tw-cursor-pointer tw-items-center"
-      style="max-width: 8%"
-      :title="store.setting.groupTitle + '-' + store.setting.groupNumber"
-      @click="openSwitchGroupModal"
-    >
-      <img
-        src="./images/group.png"
-        style="width: 10px; height: 12px; margin-right: 2px"
-      />
+class="tw-flex tw-place-content-center tw-cursor-pointer tw-items-center" style="max-width: 8%"
+      :title="store.setting.groupTitle + '-' + store.setting.groupNumber" @click="openSwitchGroupModal">
+      <img src="./images/group.png" style="width: 10px; height: 12px; margin-right: 2px" />
       <div class="tw-overflow-ellipsis tw-overflow-hidden tw-whitespace-nowrap">
         {{ "分组:" + store.setting.groupNumber }}
       </div>
       <div v-if="store.groups.length > 1" class="dropdown-triangle"></div>
     </div>
     <div class="tw-flex tw-gap-4">
-      <div
-        class="tw-flex tw-place-items-center tw-cursor-pointer"
-        @click="openProfileModal"
-      >
+      <div class="tw-flex tw-place-items-center tw-cursor-pointer" @click="openProfileModal">
         <!-- <UserOutlined /> -->
         {{ store.setting.userName }}
       </div>
-      <div
-        class="tw-flex tw-place-items-center tw-cursor-pointer"
-        @click="logout"
-      >
+      <div class="tw-flex tw-place-items-center tw-cursor-pointer" @click="logout">
         <!-- <PoweroffOutlined /> -->
         退出
       </div>
       <a-tooltip placement="bottomRight" :overlayStyle="{ width: '58px' }">
         <template #title>给分板</template>
         <div
-          class="tw-flex tw-place-content-center tw-cursor-pointer menu"
-          :class="[
-            store.isScoreBoardVisible && store.currentTask && 'menu-toggled',
-          ]"
-          @click="store.toggleScoreBoard"
-        >
+class="tw-flex tw-place-content-center tw-cursor-pointer menu" :class="[
+          store.isScoreBoardVisible && store.currentTask && 'menu-toggled',
+        ]" @click="store.toggleScoreBoard">
           <span class="tw-inline-flex tw-place-content-center tw-relative">
-            <img
-              src="./images/right-menu.svg"
-              :class="[store.isScoreBoardVisible && 'svg-red']"
-            />
+            <img src="./images/right-menu.svg" :class="[store.isScoreBoardVisible && 'svg-red']" />
           </span>
-          <div
-            v-if="store.isScoreBoardVisible && store.currentTask"
-            class="triangle"
-          ></div>
+          <div v-if="store.isScoreBoardVisible && store.currentTask" class="triangle"></div>
         </div>
       </a-tooltip>
     </div>
@@ -348,6 +283,8 @@ import MarkProblemDialog from "./MarkProblemDialog.vue";
 import { isNumber } from "lodash-es";
 import { Modal } from "ant-design-vue";
 
+const props = defineProps<{ showTotalScore?: boolean }>();
+
 const modeName = $computed(() =>
   store.setting.mode === "TRACK" ? "轨迹模式" : "普通模式"
 );
@@ -447,6 +384,7 @@ watch(
 .header-bg-color {
   background-color: var(--header-bg-color);
 }
+
 .header-container {
   position: relative;
   height: 56px;
@@ -455,11 +393,13 @@ watch(
   background-color: var(--header-bg-color);
   color: rgba(255, 255, 255, 0.5);
 }
+
 .menu {
   width: 56px;
   height: 56px;
   padding: 20px;
 }
+
 .menu:hover,
 .menu-toggled {
   background-color: rgba(255, 255, 255, 0.2);
@@ -468,17 +408,21 @@ watch(
 .header-container span {
   vertical-align: middle;
 }
+
 .header-big-text {
   font-size: 20px;
   line-height: 30px;
 }
+
 .header-small-text {
   font-size: var(--app-secondary-font-size);
 }
+
 .highlight-text {
   color: white;
   font-size: var(--app-title-font-size);
 }
+
 .header-bg-color.ant-btn:hover {
   background-color: var(--app-ant-select-bg-override-color) !important;
 }
@@ -490,17 +434,19 @@ watch(
   color: var(--app-bold-text-color);
   width: 240px;
 }
+
 .assistant-table tr td:nth-child(2) {
   text-align: right;
 }
+
 .svg-red {
-  filter: invert(27%) sepia(51%) saturate(2878%) hue-rotate(346deg)
-    brightness(104%) contrast(97%);
+  filter: invert(27%) sepia(51%) saturate(2878%) hue-rotate(346deg) brightness(104%) contrast(97%);
 }
+
 .svg-red-hover:hover {
-  filter: invert(27%) sepia(51%) saturate(2878%) hue-rotate(346deg)
-    brightness(104%) contrast(97%);
+  filter: invert(27%) sepia(51%) saturate(2878%) hue-rotate(346deg) brightness(104%) contrast(97%);
 }
+
 .triangle {
   background-color: white;
   width: 10px;
@@ -510,6 +456,7 @@ watch(
   position: absolute;
   bottom: -2px;
 }
+
 .dropdown-triangle {
   background-color: #8c8d9b;
   width: 7px;
@@ -522,6 +469,7 @@ watch(
 .count-animation-leave-active {
   transition: all 1.2s ease-in-out;
 }
+
 .count-animation-enter-from,
 .count-animation-leave-to {
   opacity: 0;
@@ -536,6 +484,7 @@ watch(
   0% {
     scale: 0.7;
   }
+
   100% {
     scale: 1.3;
   }