feat: 注释图片修改背景色示例页面(测试环境类型检查失败)

src/modules/example/ImageModify.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="text-center">
-    <h1 class="" :style="`color: ${drawing ? 'red' : 'blue'}`">修改图片背景色</h1>
+    <!-- <h1 class="" :style="`color: ${drawing ? 'red' : 'blue'}`">修改图片背景色</h1>
     <div class="flex justify-center">
       <el-button type="primary" class="" @click="reset">Reset</el-button>
       <el-color-picker v-model="color" show-alpha color-format="rgb" size="large">
@@ -31,54 +31,53 @@
           <img :src="dataUrl" alt="" />
         </div>
       </div>
-    </div>
+    </div> -->
   </div>
 </template>
 
 <script setup lang="ts" name="ImageModify">
-import { ref, computed, watch } from 'vue'
-import { ElButton, ElButtonGroup, ElUpload, ElColorPicker, UploadFiles, ElProgress } from 'element-plus'
-import { convertColor, BLACK, DISTANCE, useSetImgBg } from '@/hooks/useSetImgBg'
-import { Minus, Plus } from '@element-plus/icons-vue'
-import { useResizeObserver } from '@vueuse/core'
+// import { ref, computed, watch } from 'vue'
+// import { ElButton, ElButtonGroup, ElUpload, ElColorPicker, UploadFiles, ElProgress } from 'element-plus'
+// import { convertColor, BLACK, DISTANCE, useSetImgBg } from '@/hooks/useSetImgBg'
+// import { Minus, Plus } from '@element-plus/icons-vue'
 
-import type { SetImgBgOption } from '@/hooks/useSetImgBg'
+// import type { SetImgBgOption } from '@/hooks/useSetImgBg'
 
-const canvas = ref<HTMLCanvasElement | null>(null)
-const image = ref<HTMLImageElement | null>(null)
-const color = ref('rgba(95, 228, 83, 255)')
-const imageList = ref<UploadFiles>([])
+// const canvas = ref<HTMLCanvasElement | null>(null)
+// const image = ref<HTMLImageElement | null>(null)
+// const color = ref('rgba(95, 228, 83, 255)')
+// const imageList = ref<UploadFiles>([])
 
-let distance = ref(DISTANCE)
+// let distance = ref(DISTANCE)
 
-const P = computed<SetImgBgOption>(() => ({
-  image: image.value,
-  canvas: canvas.value,
-  useNaturalSize: false,
-  distance: distance.value,
-  markColor: BLACK,
-  bgColor: convertColor(color.value),
-}))
+// const P = computed<SetImgBgOption>(() => ({
+//   image: image.value,
+//   canvas: canvas.value,
+//   useNaturalSize: false,
+//   distance: distance.value,
+//   markColor: BLACK,
+//   bgColor: convertColor(color.value),
+// }))
 
-const { drawing, dataUrl } = useSetImgBg(P)
+// const { drawing, dataUrl } = useSetImgBg(P)
 
-const reset = () => {
-  color.value = 'rgba(95, 228, 83, 1)'
-  imageList.value = []
-}
+// const reset = () => {
+//   color.value = 'rgba(95, 228, 83, 1)'
+//   imageList.value = []
+// }
 
-const increase = () => {
-  distance.value += 10
-  if (distance.value > 255) {
-    distance.value = 255
-  }
-}
-const decrease = () => {
-  distance.value -= 10
-  if (distance.value < 0) {
-    distance.value = 0
-  }
-}
+// const increase = () => {
+//   distance.value += 10
+//   if (distance.value > 255) {
+//     distance.value = 255
+//   }
+// }
+// const decrease = () => {
+//   distance.value -= 10
+//   if (distance.value < 0) {
+//     distance.value = 0
+//   }
+// }
 
 // useResizeObserver(image, update)
 </script>

src/modules/quality/self-check/index.vue

@@ -20,11 +20,16 @@
         <base-table
           :columns="columns2"
           highlight-current-row
+          :data="selfCheckAnalysisDiffList"
           @current-change="onCheckSelfCheckAnalysisDiff"
         ></base-table>
       </el-card>
       <el-card class="flex-1" shadow="never">
-        <base-table :columns="columns3"></base-table>
+        <base-table
+          :columns="columns3"
+          :data="currentSelfCheckAnalysisDiffItem?.papers"
+          @dblclick="onDbClick"
+        ></base-table>
       </el-card>
     </div>
   </div>
@@ -119,7 +124,8 @@ const columns1: EpTableColumn<ExtractArrayValue<ExtractApiResponse<'selfCheckAna
 
 const { fetch: getSelfCheckAnalysisDiffList, result: selfCheckAnalysisDiffList } = useFetch('selfCheckAnalysisDiffList')
 
-const { onCurrentChange: onCheckSelfCheckAnalysisDiff, current } = useTableCheck(selfCheckAnalysisDiffList)
+const { onCurrentChange: onCheckSelfCheckAnalysisDiff, current: currentSelfCheckAnalysisDiffItem } =
+  useTableCheck(selfCheckAnalysisDiffList)
 
 const columns2: EpTableColumn<ExtractArrayValue<ExtractApiResponse<'selfCheckAnalysisDiffList'>>>[] = [
   { label: '离差值', prop: 'diff' },
@@ -131,6 +137,12 @@ const columns2: EpTableColumn<ExtractArrayValue<ExtractApiResponse<'selfCheckAna
   },
 ]
 
+const papers = computed(() => {
+  return currentSelfCheckAnalysisDiffItem?.value?.papers || []
+})
+
+const { onDbClick, currentView, current: currentPaper } = useTableCheck(papers)
+
 const columns3: EpTableColumn[] = [
   { label: '密号', prop: 'secretNumber' },
   { label: '分数', prop: 'markScore' },
@@ -138,6 +150,16 @@ const columns3: EpTableColumn[] = [
   { label: '评卷时间', prop: 'markTime' },
 ]
 
+watch(currentSelfCheckAnalysis, () => {
+  if (currentSelfCheckAnalysis.value) {
+    getSelfCheckAnalysisDiffList({
+      subjectCode: model.subjectCode,
+      questionMainNumber: model.questionMainNumber,
+      markerId: currentSelfCheckAnalysis.value.markerId,
+    })
+  }
+})
+
 function onSearch() {
   selfCheckAnalysis({ ...omit(model, 'time'), startTime: model.time[0], endTime: model.time[1] })
 }