From a45ba04d32abf1289ecf877fd4d840d4a9289b22 Mon Sep 17 00:00:00 2001
From: liushilong <2224574157@qq.com>
Date: Thu, 11 Apr 2024 18:43:41 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BF=AE=E6=94=B9=E6=A0=B7=E5=BC=8F?=
 =?UTF-8?q?=E7=BC=BA=E9=99=B7=E5=B9=B6=E5=AE=8C=E5=96=84=E5=9B=BE=E5=AE=A1?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E9=80=82=E9=85=8D=E5=90=8E=E7=AB=AF=E5=AD=97?=
 =?UTF-8?q?=E6=AE=B5=E5=8F=98=E5=8A=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .vscode/settings.json                         |   3 +-
 src/App.vue                                   |  44 +-
 src/layout/index.vue                          |  30 +-
 src/views/home/aside/comp/AdvanceFilter.vue   |  46 +-
 .../home/aside/comp/items/Similarity.vue      |   8 +-
 src/views/home/aside/comp/items/Time.vue      |  90 ++--
 src/views/home/content/Content.vue            |   9 +-
 .../home/content/modal/CheckingTaskModal.vue  | 128 +++--
 .../home/content/modal/LoginSuccessModal.vue  |   8 +-
 .../content/modal/QueryRepeatedTasksModal.vue |  64 +--
 src/views/home/index.vue                      |   2 +-
 src/views/worksheet/aside/Aside.vue           | 147 +++---
 src/views/worksheet/aside/WorkSheetList.vue   |  10 +-
 src/views/worksheet/content/Content.vue       | 460 +++++++++++-------
 14 files changed, 624 insertions(+), 425 deletions(-)

diff --git a/.vscode/settings.json b/.vscode/settings.json
index 65d1d01..947c6ee 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -38,5 +38,6 @@
     "json",
     "jsonc",
     "yaml"
-  ]
+  ],
+  "vue3snippets.enable-compile-vue-file-on-did-save-code": true
 }
diff --git a/src/App.vue b/src/App.vue
index 3fa67ec..edb37dd 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,13 +1,13 @@
 <script lang="ts" setup>
-import { dateZhCN, zhCN,NModalProvider } from "naive-ui";
-import { computed, onMounted, nextTick,inject } from "vue";
+import { dateZhCN, zhCN, NModalProvider } from "naive-ui";
+import { computed, onMounted, nextTick, inject } from "vue";
 import { AppProvider } from "@/components/Application";
 import { lighten } from "@/utils/index";
-import mouseTrapBind from '@/hooks/event/mouseTrapBind'
-const mousetrap = inject('mousetrap') as any
-onMounted(()=>{
+import mouseTrapBind from "@/hooks/event/mouseTrapBind";
+const mousetrap = inject("mousetrap") as any;
+onMounted(() => {
   mouseTrapBind(mousetrap);
-})
+});
 
 const getThemeOverrides = computed(() => {
   const theme = "#1980FF";
@@ -49,8 +49,6 @@ const getThemeOverrides = computed(() => {
     },
   };
 });
-
-
 </script>
 
 <template>
@@ -59,10 +57,10 @@ const getThemeOverrides = computed(() => {
     :date-locale="dateZhCN"
     :theme-overrides="getThemeOverrides"
   >
-  <NModalProvider>
-    <AppProvider>
-      <RouterView />
-    </AppProvider>
+    <NModalProvider>
+      <AppProvider>
+        <RouterView />
+      </AppProvider>
     </NModalProvider>
   </NConfigProvider>
 </template>
@@ -80,14 +78,28 @@ const getThemeOverrides = computed(() => {
   color: #666666 !important;
   font-size: 14px !important;
 }
-::v-deep(.n-base-clear > .n-base-clear__clear){
+::v-deep(.n-base-clear > .n-base-clear__clear) {
   color: #c9c9c9 !important;
 }
-.n-form-item.n-form-item--top-labelled .n-form-item-label{
+.n-form-item.n-form-item--top-labelled .n-form-item-label {
   flex-direction: row-reverse !important;
   justify-content: flex-end !important;
 }
-.n-form-item .n-form-item-label .n-form-item-label__asterisk{
-  transform:rotate(-90deg) !important;
+.n-form-item .n-form-item-label .n-form-item-label__asterisk {
+  transform: rotate(-90deg) !important;
+}
+.n-scrollbar-content {
+  padding: 0 7.97px 0 4px;
+}
+.n-form-item .n-form-item-label {
+  font-size: 14px !important;
+  color: #333333 !important;
+}
+.n-slider-dots > .n-slider-dot:nth-child(2) {
+  display: none !important;
+}
+.n-collapse-item-arrow i svg {
+  width: 14px !important;
+  height: 14px !important;
 }
 </style>
diff --git a/src/layout/index.vue b/src/layout/index.vue
index a2f8f4d..4165bfe 100644
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@@ -1,21 +1,17 @@
 <script lang="ts" setup>
-import { computed, unref } from 'vue'
-import { Logo } from './components/Logo'
-import { MainView } from './components/Main'
-import { AsideMenu } from './components/Menu'
-import { PageHeader } from './components/Header'
-import { useProjectSetting } from '@/hooks/setting/useProjectSetting'
+import { computed, unref } from "vue";
+import { Logo } from "./components/Logo";
+import { MainView } from "./components/Main";
+import { AsideMenu } from "./components/Menu";
+import { PageHeader } from "./components/Header";
+import { useProjectSetting } from "@/hooks/setting/useProjectSetting";
 
-const {
-  menuSetting,
-} = useProjectSetting()
+const { menuSetting } = useProjectSetting();
 
 const leftMenuWidth = computed(() => {
-  const { minMenuWidth } = unref(menuSetting)
-  return minMenuWidth
-})
-
-
+  const { minMenuWidth } = unref(menuSetting);
+  return minMenuWidth;
+});
 </script>
 
 <template>
@@ -45,12 +41,12 @@ const leftMenuWidth = computed(() => {
   display: flex;
   flex-direction: row;
   flex: auto;
-  background-image: url('../assets/images/bg.png');
+  background-image: url("../assets/images/bg.png");
   background-size: cover;
   // height: 1100px;
   // width: 1440px;
   height: 100%;
-  max-height:1100px;
+  max-height: 1100px;
   overflow: hidden;
   .layout-sider {
     min-height: 100vh;
@@ -76,7 +72,7 @@ const leftMenuWidth = computed(() => {
       display: flex;
       flex: auto;
       height: 100%;
-      padding: 0px 16px 24px 16px;
+      // padding: 0px 16px 24px 16px;
       overflow-x: hidden;
       box-sizing: border-box;
     }
diff --git a/src/views/home/aside/comp/AdvanceFilter.vue b/src/views/home/aside/comp/AdvanceFilter.vue
index 8a18413..0be9cfe 100644
--- a/src/views/home/aside/comp/AdvanceFilter.vue
+++ b/src/views/home/aside/comp/AdvanceFilter.vue
@@ -254,13 +254,13 @@ const moveEnd = () => {
   });
 };
 
-const setCurrentlySelectedAdvanced = (value:string)=>{
+const setCurrentlySelectedAdvanced = (value: string) => {
   currentlySelectedAdvanced.value = value;
-}
+};
 
 defineExpose({
-  setCurrentlySelectedAdvanced
-})
+  setCurrentlySelectedAdvanced,
+});
 </script>
 
 <template>
@@ -277,9 +277,15 @@ defineExpose({
       >
         <template #trigger>
           <div class="wrapper-left-dropdown" @click="showClick">
-            <span style="font-size: 20px; color: #333333; font-weight: Medium;font-size:17px;font-weight:600">{{
-              currentlySelectedAdvanced
-            }}</span>
+            <span
+              style="
+                color: #333333;
+                font-weight: Medium;
+                font-size: 17px;
+                font-weight: 600;
+              "
+              >{{ currentlySelectedAdvanced }}</span
+            >
             <SvgIcon
               :style="{ marginLeft: '5px' }"
               name="down"
@@ -293,8 +299,12 @@ defineExpose({
             <n-form :rules="rules" ref="ruleformRef" :model="ruleForm">
               <n-form-item path="keyword">
                 <n-input
-                  :style="{ '--n-border': '0px', '--n-display': 'block' }"
-                  placeholder="请输入关键字"
+                  :style="{
+                    '--n-border': '0px',
+                    '--n-display': 'block',
+                    '--n-height': '40px',
+                  }"
+                  placeholder="请输入关键词"
                   @input="inputHandler"
                   :value="ruleForm.keyword"
                   :minlength="2"
@@ -304,7 +314,7 @@ defineExpose({
                   </template>
                   <template #suffix>
                     <SvgIcon
-                      size="14px"
+                      size="16"
                       style="cursor: pointer"
                       name="setting"
                       @click="emit('show-filter')"
@@ -362,13 +372,13 @@ defineExpose({
                   class="cursor-move draggable-li fix"
                   :draggable="true"
                 >
-                  <SvgIcon name="drag" size="18" style="margin-right: 3px" />
+                  <SvgIcon name="drag" size="10" style="margin-right: 3px" />
                   <SvgIcon
                     v-if="item.favorite && !item.isDefaultFilter"
                     name="favorite-fill"
                     color="#fd9b0a"
                     width="13"
-                  height="12"
+                    height="12"
                     fill="#666666"
                     style="cursor: pointer !important; margin-right: 3px"
                     @click="unFavoriteHandler($event, item)"
@@ -377,7 +387,7 @@ defineExpose({
                     v-else-if="!item.favorite && !item.isDefaultFilter"
                     name="favorite-unfill"
                     width="13"
-                  height="12"
+                    height="12"
                     fill="#666666"
                     style="cursor: pointer !important; margin-right: 3px"
                     @click="favoriteHandler($event, item)"
@@ -414,9 +424,9 @@ defineExpose({
   align-items: center;
   position: absolute;
   left: 0;
-  
+  top: -10px;
   width: 100%;
-  padding: 12px 16px;
+  padding: 17px 16px;
   border-bottom: 1px solid #e8e8e8;
   z-index: 10;
   background: #ffffff;
@@ -457,8 +467,6 @@ defineExpose({
         line-height: 22px;
         padding: 8px 12px;
 
-
-
         &:hover {
           background-color: #f3f8ff;
         }
@@ -471,6 +479,10 @@ defineExpose({
     align-items: center;
   }
 }
+.wrapper-left-popover {
+  width: 248px;
+  height: 288px;
+}
 ::v-deep(.wrapper-left-popover .n-form-item) {
   display: block !important;
 }
diff --git a/src/views/home/aside/comp/items/Similarity.vue b/src/views/home/aside/comp/items/Similarity.vue
index 99857cc..f6ddbb4 100644
--- a/src/views/home/aside/comp/items/Similarity.vue
+++ b/src/views/home/aside/comp/items/Similarity.vue
@@ -10,12 +10,12 @@ configUseStore.$subscribe(() => {
     return;
   }
   let asideValue = configUseStore.getAsideValue;
-  if(asideValue['izsimilarity']) {
-    range.value = asideValue['izsimilarity']
-  }else {
+  if (asideValue["izsimilarity"]) {
+    range.value = asideValue["izsimilarity"];
+  } else {
     range.value = [0, 100];
   }
-  console.log(range.value, 'range.value')
+  console.log(range.value, "range.value");
   //  else {
   //   range.value = [0, 100];
   // }
diff --git a/src/views/home/aside/comp/items/Time.vue b/src/views/home/aside/comp/items/Time.vue
index f6a0374..42010e3 100644
--- a/src/views/home/aside/comp/items/Time.vue
+++ b/src/views/home/aside/comp/items/Time.vue
@@ -1,54 +1,53 @@
 <script lang="ts" setup>
-import dayjs from 'dayjs';
-import { onUpdated, watch } from 'vue';
-import { onMounted, ref } from 'vue';
-import { useConfig } from '@/store/modules/asideConfig'
+import dayjs from "dayjs";
+import { onUpdated, watch } from "vue";
+import { onMounted, ref } from "vue";
+import { useConfig } from "@/store/modules/asideConfig";
 
-const configUseStore = useConfig()
+const configUseStore = useConfig();
 
 configUseStore.$subscribe(() => {
-  if(isLoadValue.value) {
+  if (isLoadValue.value) {
     isLoadValue.value = false;
-    return
+    return;
   }
   let asideValue = configUseStore.getAsideValue;
-  if(asideValue['izyear']) {
-    time.value = asideValue['izyear']
-  }else {
+  if (asideValue["izyear"]) {
+    time.value = asideValue["izyear"];
+  } else {
     time.value = null;
   }
 });
 const props = defineProps<{
-  value: [number, number] | null
-  label: string
-}>()
+  value: [number, number] | null;
+  label: string;
+}>();
 
 const emit = defineEmits<{
-  (e: 'update:value', value: number[]): void
-}>()
+  (e: "update:value", value: number[]): void;
+}>();
 
-const time = ref<[number, number] | null>(props.value)
-const isLoadValue = ref(false)
+const time = ref<[number, number] | null>(props.value);
+const isLoadValue = ref(false);
 function onChange(value: [number, number]) {
   isLoadValue.value = true;
-  emit('update:value', value)
+  emit("update:value", value);
 }
 onMounted(() => {
-    if(!props.value) {
-      // 获取当前日期
-      const currentDate = dayjs();
-      // 计算前三个月的起始日期和结束日期
-      const endDate =  currentDate.toDate();
-      const startDate = currentDate.subtract(3, 'month').toDate();
-      // 设置默认日期范围为前三个月的起始日期到三个月前的今天
-      time.value = [startDate.getTime(), endDate.getTime()];
-      console.log('time init', startDate.getTime(), endDate.getTime());
-      setTimeout(() => {
-        emit('update:value', [startDate.getTime(), endDate.getTime()])
-      },300)
-    }
-})
-
+  if (!props.value) {
+    // 获取当前日期
+    const currentDate = dayjs();
+    // 计算前三个月的起始日期和结束日期
+    const endDate = currentDate.toDate();
+    const startDate = currentDate.subtract(3, "month").toDate();
+    // 设置默认日期范围为前三个月的起始日期到三个月前的今天
+    time.value = [startDate.getTime(), endDate.getTime()];
+    console.log("time init", startDate.getTime(), endDate.getTime());
+    setTimeout(() => {
+      emit("update:value", [startDate.getTime(), endDate.getTime()]);
+    }, 300);
+  }
+});
 </script>
 
 <template>
@@ -56,10 +55,14 @@ onMounted(() => {
     <n-collapse :default-expanded-names="['1']" arrow-placement="right">
       <n-collapse-item :title="label" name="1">
         <n-space>
-          <n-date-picker v-model:value="time" type="daterange" :clearable="false" @update:value="onChange">
-            <template #separator>
-              至
-            </template>
+          <n-date-picker
+            v-model:value="time"
+            type="daterange"
+            :clearable="false"
+            @update:value="onChange"
+            placeholder="请选择"
+          >
+            <template #separator> 至 </template>
           </n-date-picker>
         </n-space>
       </n-collapse-item>
@@ -79,15 +82,20 @@ onMounted(() => {
 ::v-deep(.n-input__separator) {
   color: #999999 !important;
 }
-::v-deep(.n-collapse .n-collapse-item:not(.n-collapse-item--disabled).n-collapse-item--trigger-area-main .n-collapse-item__header .n-collapse-item__header-main){
+::v-deep(.n-collapse
+    .n-collapse-item:not(.n-collapse-item--disabled).n-collapse-item--trigger-area-main
+    .n-collapse-item__header
+    .n-collapse-item__header-main) {
   margin-left: 10px;
 }
-::v-deep(.n-collapse .n-collapse-item:not(.n-collapse-item--disabled).n-collapse-item--trigger-area-main .n-collapse-item__header .n-collapse-item__header-main::before){
-  content: '*';
+::v-deep(.n-collapse
+    .n-collapse-item:not(.n-collapse-item--disabled).n-collapse-item--trigger-area-main
+    .n-collapse-item__header
+    .n-collapse-item__header-main::before) {
+  content: "*";
   position: absolute;
   left: 0;
   top: 2px;
   color: red;
 }
-
 </style>
diff --git a/src/views/home/content/Content.vue b/src/views/home/content/Content.vue
index 87c3a39..387d47d 100644
--- a/src/views/home/content/Content.vue
+++ b/src/views/home/content/Content.vue
@@ -378,7 +378,7 @@ async function tasksLoadingCloseCallback() {
 
 async function showLoginSuccessModal() {
   const modal = LoginSuccessModalRef.value as any;
-  modal.showModal()
+  modal.showModal();
 }
 
 // 包id
@@ -623,9 +623,8 @@ const loadImgOver = (item) => {
 };
 
 defineExpose({
-  showLoginSuccessModal
-})
-
+  showLoginSuccessModal,
+});
 </script>
 
 <template>
@@ -633,7 +632,7 @@ defineExpose({
     <div class="wrapper-header">
       <div class="left">
         <SvgIcon size="32" name="magnifying" />
-        <span class="font" style="margin-left: 19.2px;" >AI一键查重</span>
+        <span class="font" style="margin-left: 19.2px">AI一键查重</span>
       </div>
       <div class="flex-btn-icon">
         <SvgIcon
diff --git a/src/views/home/content/modal/CheckingTaskModal.vue b/src/views/home/content/modal/CheckingTaskModal.vue
index 5aa9b34..17a4cbf 100644
--- a/src/views/home/content/modal/CheckingTaskModal.vue
+++ b/src/views/home/content/modal/CheckingTaskModal.vue
@@ -1,73 +1,120 @@
 <script lang="ts" setup>
-import { defineOptions, onMounted, ref, onBeforeUnmount } from 'vue';
-import { useRouter } from 'vue-router';
-
-defineOptions({ name: 'ShortcutModal' })
+import { defineOptions, onMounted, ref, onBeforeUnmount } from "vue";
+import { useRouter } from "vue-router";
 
+defineOptions({ name: "ShortcutModal" });
 
 const emit = defineEmits<{
-  (e: 'refresh', value: any),
-  (e: 'cancel', value: any)
-}>()
-
+  (e: "refresh", value: any);
+  (e: "cancel", value: any);
+}>();
 
-const show = ref(false)
-const isFold = ref(false)
-const router = useRouter()
+const show = ref(false);
+const isFold = ref(false);
+const router = useRouter();
 
 const cardStyle = {
-  'width': '29vw',
-  '--n-padding-bottom': '10px',
-  '--n-padding-left': '10px',
-}
+  width: "29vw",
+  "--n-padding-bottom": "10px",
+  "--n-padding-left": "10px",
+};
 function toggle() {
-  isFold.value = !isFold.value
+  isFold.value = !isFold.value;
 }
 function showModal() {
-  show.value = true
+  show.value = true;
 }
 function closeModal() {
-  show.value = false
+  show.value = false;
 }
 function refresh() {
-  emit('refresh', true)
+  emit("refresh", true);
 }
 function cancel() {
-  closeModal()
-  emit('cancel', true)
+  closeModal();
+  emit("cancel", true);
 }
 const time = ref();
 onMounted(() => {
- time.value = setInterval(() => {
-//  console.log("00000000-----------");
- show.value && refresh();
-}, 5000);
+  time.value = setInterval(() => {
+    //  console.log("00000000-----------");
+    show.value && refresh();
+  }, 5000);
 });
-onBeforeUnmount(() => { 
+onBeforeUnmount(() => {
   clearInterval(time.value);
- time.value = null;
+  time.value = null;
 });
 defineExpose({
   showModal,
-  closeModal
-})
+  closeModal,
+});
 </script>
 
-<template>  
+<template>
   <div class="removeMask">
     <!-- <n-modal v-model:show="show" :show-mask="false" :mask-closable="false" transform-origin="center" style="position: fixed;right: 0;bottom: 0;"> -->
-      <div v-if="show" style="position: fixed;right: 0;bottom: 0; float: left; z-index: 999;width:360px;height:157px;" >
-      <n-card :style="cardStyle" :bordered="false" size="huge" role="dialog" aria-modal="true" style="padding: 8px 8px 0 8px;">
+    <div
+      v-if="show"
+      style="
+        position: fixed;
+        right: 0;
+        bottom: 0;
+        float: left;
+        z-index: 999;
+        width: 360px;
+        height: 157px;
+      "
+    >
+      <n-card
+        :style="cardStyle"
+        :bordered="false"
+        size="huge"
+        role="dialog"
+        aria-modal="true"
+        style="padding: 8px 8px 0 8px"
+      >
         <div class="wrapper">
           <div class="title">查重进度</div>
           <div class="icon-list">
-            <svg-icon size="20" name="refresh" @click="refresh" style="margin-right: 16px;cursor: pointer;" />
-            <svg-icon v-show="!isFold" size="20" name="down-line" style="margin-right: 16px;cursor: pointer;" @click="toggle"/>
-            <svg-icon v-show="isFold" size="20" name="top-line" style="margin-right: 16px;cursor: pointer;" @click="toggle"/>
-            <svg-icon size="20" name="close-none-border" @click="cancel" style="margin-right: 16px;cursor: pointer;"/>
+            <svg-icon
+              size="16"
+              name="refresh"
+              @click="refresh"
+              style="margin-right: 16px; cursor: pointer"
+            />
+            <svg-icon
+              v-show="!isFold"
+              size="16"
+              name="down-line"
+              style="margin-right: 16px; cursor: pointer"
+              @click="toggle"
+            />
+            <svg-icon
+              v-show="isFold"
+              size="16"
+              name="top-line"
+              style="margin-right: 16px; cursor: pointer"
+              @click="toggle"
+            />
+            <svg-icon
+              size="16"
+              name="close-none-border"
+              @click="cancel"
+              style="margin-right: 25.7px; cursor: pointer"
+            />
           </div>
         </div>
-        <div v-show="!isFold" style="display: flex;background-color: #F9F9F9;height: 54px;margin-top: 24px;margin-bottom: 6px;">
+        <div
+          v-show="!isFold"
+          style="
+            display: flex;
+            background-color: #f9f9f9;
+            height: 54px;
+            margin-top: 24px;
+            margin-bottom: 6px;
+          "
+        >
           <div><svg-icon size="40" name="robot2" /></div>
           <div class="msg">
             <div>正在查重中</div>
@@ -80,13 +127,14 @@ defineExpose({
 </template>
 
 <style lang="less" scoped>
-.wrapper{
+.wrapper {
   display: flex;
   justify-content: space-between;
+  width: 357px;
   border-bottom: 1px solid rgba(0, 0, 0, 0.09);
   margin: 0 -18px;
 }
-.icon-list{
+.icon-list {
 }
 .title {
   padding-left: 24px;
@@ -105,8 +153,6 @@ defineExpose({
   line-height: 54px;
 }
 .removeMask {
-  width: 360px;
-  height: 157px;
   ::v-deep(.n-modal-mask) {
     display: none !important;
   }
diff --git a/src/views/home/content/modal/LoginSuccessModal.vue b/src/views/home/content/modal/LoginSuccessModal.vue
index 7fc300f..a9629aa 100644
--- a/src/views/home/content/modal/LoginSuccessModal.vue
+++ b/src/views/home/content/modal/LoginSuccessModal.vue
@@ -74,7 +74,6 @@ defineExpose({
             <div class="num_box">{{ 83 }}</div>
             <div class="title_box">重复图片</div>
           </div>
-          
         </div>
         <div class="footer" @click="viewRepeat">我知道了</div>
         <!-- <div class="footer">
@@ -106,7 +105,7 @@ defineExpose({
   left: calc(50% - 286px);
   .wrapper-hearder {
     margin-top: 80px;
-    margin-left:18px;
+    margin-left: 18px;
     .wrapper-title {
       text-align: center;
       font-size: 16px;
@@ -214,8 +213,9 @@ defineExpose({
       position: relative;
       bottom: -30px;
       left: 20px;
-      
-      font-size: 24px;
+
+      font-size: 20px;
+      font-weight: 400;
       font-family: YouSheBiaoTiHei, YouSheBiaoTiHei-Regular;
       text-align: center;
       color: #ffffff;
diff --git a/src/views/home/content/modal/QueryRepeatedTasksModal.vue b/src/views/home/content/modal/QueryRepeatedTasksModal.vue
index 19f520a..de18dc8 100644
--- a/src/views/home/content/modal/QueryRepeatedTasksModal.vue
+++ b/src/views/home/content/modal/QueryRepeatedTasksModal.vue
@@ -1,63 +1,72 @@
 <script lang="ts" setup>
-import { ref } from 'vue';
-import { useConfig } from '@/store/modules/asideConfig'
+import { ref } from "vue";
+import { useConfig } from "@/store/modules/asideConfig";
 
 const emit = defineEmits<{
-  (e: 'closeCallback', value: any),
-}>()
+  (e: "closeCallback", value: any);
+}>();
 
-
-const show = ref(false)
+const show = ref(false);
 
 const stys = {
-  'width': '424px',
-  'height': '232px',
-  '--n-padding-bottom': '20px',
-  '--n-padding-left': '0px',
-  'background': 'linear-gradient(132deg, rgba(255, 255, 255, 0.32) 21%, rgba(152, 172, 255, 0.14) 100%)',
-  'border-radius': '4px',
-  'box-shadow': '0px 12px 48px 16px rgba(0, 0, 0, 0.03)',
-  'backdrop-filter': ' blur(10px)',
-}
+  width: "424px",
+  height: "232px",
+  "--n-padding-bottom": "20px",
+  "--n-padding-left": "0px",
+  background:
+    "linear-gradient(132deg, rgba(255, 255, 255, 0.32) 21%, rgba(152, 172, 255, 0.14) 100%)",
+  "border-radius": "4px",
+  "box-shadow": "0px 12px 48px 16px rgba(0, 0, 0, 0.03)",
+  "backdrop-filter": " blur(10px)",
+};
 
 function showModal() {
-  show.value = true
+  show.value = true;
 }
 
 function closeModal() {
-  show.value = false
-  emit('closeCallback', true)
+  show.value = false;
+  emit("closeCallback", true);
 }
 
 function closeOnlyModal() {
-  show.value = false
+  show.value = false;
 }
 
 defineExpose({
   showModal,
   closeModal,
   closeOnlyModal,
-})
+});
 
-const configStore = useConfig()
+const configStore = useConfig();
 const percent = ref(0);
 
 configStore.$subscribe(() => {
   percent.value = configStore.getTimeNum;
 });
-
 </script>
 
 <template>
-  <n-modal v-model:show="show" :mask-closable="false" :show-mask="false" transform-origin="center">
+  <n-modal
+    v-model:show="show"
+    :mask-closable="false"
+    :show-mask="false"
+    transform-origin="center"
+  >
     <n-card :style="stys" :bordered="false" role="dialog" aria-modal="true">
-      <svg-icon size="15" name="close" @click="closeModal" style="position:absolute; right:6px;top:6px;cursor: pointer;"/>
+      <svg-icon
+        size="15"
+        name="close"
+        @click="closeModal"
+        style="position: absolute; right: 15.7px; top: 6px; cursor: pointer"
+      />
       <div class="wrapper">
         <svg-icon size="90" name="robot2" />
-        <span style="margin-top: 24px;">正在查重中</span>
+        <span style="margin-top: 24px">正在查重中</span>
       </div>
-      <div style="padding: 0 20px;">
-        <n-progress type="line" :percentage="percent" :show-indicator="false"/>
+      <div style="padding: 0 20px">
+        <n-progress type="line" :percentage="percent" :show-indicator="false" />
       </div>
     </n-card>
   </n-modal>
@@ -71,5 +80,4 @@ configStore.$subscribe(() => {
   justify-content: center;
   align-items: center;
 }
-
 </style>
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index 5f6c151..360dc81 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -20,7 +20,7 @@ const showLoginModal = ()=>{
     <Content ref="contentRef"/>
 
     <!-- 机器人 -->
-    <Robot :canClick="true" @click="showLoginModal"/>
+    <!-- <Robot :canClick="true" @click="showLoginModal"/> -->
   </div>
 </template>
 
diff --git a/src/views/worksheet/aside/Aside.vue b/src/views/worksheet/aside/Aside.vue
index fb45b75..36f6f9a 100644
--- a/src/views/worksheet/aside/Aside.vue
+++ b/src/views/worksheet/aside/Aside.vue
@@ -4,15 +4,17 @@ import { useWindowSizeFn } from "@/hooks/event/useWindowSizeFn";
 import { useUser } from "@/store/modules/user";
 import { useWorkOrder } from "@/store/modules/workOrder";
 import { getViewportOffset } from "@/utils/domUtils";
-import { debounce } from 'lodash-es';
+import { debounce } from "lodash-es";
 import {
-computed, defineEmits, defineOptions,
-inject,
-nextTick,
-onMounted,
-ref,
-unref,
-watch
+  computed,
+  defineEmits,
+  defineOptions,
+  inject,
+  nextTick,
+  onMounted,
+  ref,
+  unref,
+  watch,
 } from "vue";
 import CustomFieldModalVue from "../modal/CustomFieldModal.vue";
 import WorkSheetList from "./WorkSheetList.vue";
@@ -20,63 +22,63 @@ import WorkSheetList from "./WorkSheetList.vue";
 defineOptions({ name: "AsideContent" });
 const emit = defineEmits(["ApprovalOver"]);
 
-const collapse = ref(false)
-const workStore = useWorkOrder()
-const filterModalRef = ref(null)
-const packageListRef = ref<HTMLDivElement | null>(null)
+const collapse = ref(false);
+const workStore = useWorkOrder();
+const filterModalRef = ref(null);
+const packageListRef = ref<HTMLDivElement | null>(null);
 // 展示字段
-const showFieldList = ref<any[]>([])
-const reviewType = 1
-const dicts = ref<any>([])
+const showFieldList = ref<any[]>([]);
+const reviewType = 1;
+const dicts = ref<any>([]);
 function collapseHandler() {
-  collapse.value = !collapse.value
+  collapse.value = !collapse.value;
 }
-const mousetrap = inject('mousetrap') as any
-mousetrap.bind('[', collapseHandler)
+const mousetrap = inject("mousetrap") as any;
+mousetrap.bind("[", collapseHandler);
 
-const searchKeyword = ref('')
+const searchKeyword = ref("");
 
 const asideWidth = computed(() => {
-  return collapse.value ? 0 : 308
-})
+  return collapse.value ? 0 : 308;
+});
 
 const asideStyle = computed(() => {
   return {
     width: `${asideWidth.value}px`,
-  }
-})
+  };
+});
 
 const collapseIcon = computed(() => {
-  return collapse.value ? 'expand-cir' : 'collapse-cir'
-})
+  return collapse.value ? "expand-cir" : "collapse-cir";
+});
 
-const listHeight = ref(700)
+const listHeight = ref(700);
 
 function computeListHeight() {
-  const listEl = document.querySelector('.work-sheet-list')!
-  const { bottomIncludeBody } = getViewportOffset(listEl)
-  const height = bottomIncludeBody
-  listHeight.value = height - 25
+  const listEl = document.querySelector(".work-sheet-list")!;
+  const { bottomIncludeBody } = getViewportOffset(listEl);
+  const height = bottomIncludeBody;
+  listHeight.value = height - 25;
 }
 
 const listStyle = computed(() => {
   return {
     height: `${listHeight.value}px`,
-  }
-})
+  };
+});
 
-useWindowSizeFn(computeListHeight, 280)
+useWindowSizeFn(computeListHeight, 280);
 
 async function getshowFieldList() {
-  showFieldList.value = []
-  const userStore = useUser()
-  const userInfo = userStore.getUserInfo
-  let res
-  res = await getAllfieldList(reviewType) // 所有筛选项目
-  const allList = res.data
-  dicts.value = res.data
-  res = await getfieldList(reviewType, userInfo.id) // 当前用户选择的项目
-  const useList = res.data
+  showFieldList.value = [];
+  const userStore = useUser();
+  const userInfo = userStore.getUserInfo;
+  let res;
+  res = await getAllfieldList(reviewType); // 所有筛选项目
+  const allList = res.data;
+  dicts.value = res.data;
+  res = await getfieldList(reviewType, userInfo.id); // 当前用户选择的项目
+  const useList = res.data;
   /**
    * name 标题
    * id 键值
@@ -84,20 +86,19 @@ async function getshowFieldList() {
    * checked 是否选中
    */
   if (useList.userFieldFixed) {
-    useList.userFieldFixed?.split(',').map((v) => {
-      let item = allList.find(v2 => v2.name == v)
+    useList.userFieldFixed?.split(",").map((v) => {
+      let item = allList.find((v2) => v2.name == v);
       if (item) {
         item = {
           name: item.fieldDesc,
           id: item.name,
           fix: item.isrequired == 2,
           checked: true,
-        }
-        showFieldList.value.push(item)
+        };
+        showFieldList.value.push(item);
       }
-    })
-  }
-  else {
+    });
+  } else {
     // 若为首次获取 则赋默认值
     allList.map((v) => {
       if (v.isrequired == 2) {
@@ -106,45 +107,45 @@ async function getshowFieldList() {
           id: v.name,
           fix: v.isrequired == 2,
           checked: true,
-        }
-        showFieldList.value.push(item)
+        };
+        showFieldList.value.push(item);
       }
-    })
+    });
   }
 }
 
 onMounted(() => {
   nextTick(() => {
-    computeListHeight()
-    getshowFieldList()
-  })
-})
-const asideEnter = ref(false)
+    computeListHeight();
+    getshowFieldList();
+  });
+});
+const asideEnter = ref(false);
 
 const showCollapse = computed(() => {
-  return collapse.value ? true : asideEnter.value
-})
+  return collapse.value ? true : asideEnter.value;
+});
 
 function showFilter() {
-  const modal = unref(filterModalRef)! as any
-  modal.showModal()
+  const modal = unref(filterModalRef)! as any;
+  modal.showModal();
 }
 
 watch(
   () => workStore.immersion,
   () => {
-    collapse.value = true
-  },
-)
+    collapse.value = true;
+  }
+);
 
-const showSearch = ref(false)
+const showSearch = ref(false);
 
 function setShowSearch(value: boolean) {
-  showSearch.value = value
+  showSearch.value = value;
   if (value === false) {
-    (packageListRef.value as any).search('')
-    searchKeyword.value = ''
-  };
+    (packageListRef.value as any).search("");
+    searchKeyword.value = "";
+  }
 }
 
 const inputHandler = debounce((word) => {
@@ -152,9 +153,9 @@ const inputHandler = debounce((word) => {
   (packageListRef.value as any).search(word);
 }, 500);
 
-const ApprovalOver = (packageId)=>{
-  emit('ApprovalOver',packageId)
-}
+const ApprovalOver = (packageId) => {
+  emit("ApprovalOver", packageId);
+};
 </script>
 
 <template>
@@ -174,7 +175,7 @@ const ApprovalOver = (packageId)=>{
         <div class="left">
           <svg-icon name="all-worksheet" size="32" />
           <!-- j -->
-          <span style="margin-left: 8px;color: #333333;">所有任务包</span>
+          <span style="margin-left: 8px; color: #333333">所有任务包</span>
         </div>
         <div class="right">
           <SvgIcon
diff --git a/src/views/worksheet/aside/WorkSheetList.vue b/src/views/worksheet/aside/WorkSheetList.vue
index b9b5641..d283231 100644
--- a/src/views/worksheet/aside/WorkSheetList.vue
+++ b/src/views/worksheet/aside/WorkSheetList.vue
@@ -5,7 +5,7 @@ import { useWorkOrder } from "@/store/modules/workOrder";
 import { isEmpty } from "@/utils";
 import { useInfiniteScroll } from "@vueuse/core";
 import { useMessage } from "naive-ui";
-import { reactive, ref, watch } from "vue";
+import { onMounted, reactive, ref, watch } from "vue";
 import ApprovalModal from "../modal/ApprovalModal.vue";
 import ListItem from "./ListItem.vue";
 import type { PackageListItem } from "/#/workorder";
@@ -72,6 +72,12 @@ async function loadMore() {
   }
 }
 
+// onMounted(() => {
+//   console.log("onMounted");
+//   reset();
+//   fetchList();
+// });
+
 async function fetchList() {
   try {
     pagination.pageNo += 1;
@@ -139,7 +145,7 @@ function dismisClick(packageId: string) {
   });
 }
 const ApprovalOver = (packageId) => {
-  emit("ApprovalOver",packageId);
+  emit("ApprovalOver", packageId);
 };
 
 defineExpose({
diff --git a/src/views/worksheet/content/Content.vue b/src/views/worksheet/content/Content.vue
index 3fd49db..16aa05a 100644
--- a/src/views/worksheet/content/Content.vue
+++ b/src/views/worksheet/content/Content.vue
@@ -1,17 +1,15 @@
 <script lang="ts" setup>
-import { audit } from '@/api/task/task';
-import {
-getPictureSimilarityList, getTaskDetailInfo
-} from "@/api/work/work";
-import NotPassed from '@/components/Approval/NotPassed.vue';
-import { TASK_STATUS_OBJ } from '@/enums/index';
+import { audit } from "@/api/task/task";
+import { getPictureSimilarityList, getTaskDetailInfo } from "@/api/work/work";
+import NotPassed from "@/components/Approval/NotPassed.vue";
+import { TASK_STATUS_OBJ } from "@/enums/index";
 import { useWorkOrder } from "@/store/modules/workOrder";
 import { isEmpty } from "@/utils";
 import { formatToDateHMS } from "@/utils/dateUtil";
 import { hideDownload } from "@/utils/image";
-import emitter from '@/utils/mitt';
+import emitter from "@/utils/mitt";
 import { useInfiniteScroll } from "@vueuse/core";
-import { format } from 'date-fns';
+import { format } from "date-fns";
 import imagesloaded from "imagesloaded";
 import { clone, cloneDeep, debounce, pickBy } from "lodash-es";
 import { useDialog, useMessage } from "naive-ui";
@@ -68,10 +66,10 @@ const imageRef = ref<ComponentElRef | null>();
 const listData = ref<any[]>([]);
 const loading = ref(false);
 const el = ref<HTMLDivElement | null>(null);
-const selectedSortName = ref('');
+const selectedSortName = ref("");
 const isFullScreen = ref(false);
-const notPassModalRef = ref(null)
-const mainImageModalRef = ref(null)
+const notPassModalRef = ref(null);
+const mainImageModalRef = ref(null);
 
 let canloadMore = true;
 
@@ -131,13 +129,15 @@ async function loadMore() {
 }
 
 async function featchList() {
-
   loading.value = true;
   try {
     taskpagination.pageNo += 1;
-    const { data, total, pageCount } = await getPictureSimilarityList(
-      { ...taskpagination, ...sortBy, checkDuplicateId: workStore.activeId, pictureId: taskDetailInfo.value.id }
-    );
+    const { data, total, pageCount } = await getPictureSimilarityList({
+      ...taskpagination,
+      ...sortBy,
+      checkDuplicateId: workStore.activeId,
+      pictureId: taskDetailInfo.value.id,
+    });
 
     totalCount.value = total;
     canloadMore = pageCount >= taskpagination.pageNo && pageCount > 0;
@@ -165,14 +165,13 @@ const layout = debounce(() => {
   });
 }, 300);
 
-
 const fullscreenStyles = computed<any>(() => ({
-  'width': isFullScreen.value ? '100vw' : '',
-  'height': isFullScreen.value ? '100vh' : '',
-  'position': isFullScreen.value ? 'fixed' : '',
-  'top': isFullScreen.value ? '0' : '',
-  'left': isFullScreen.value ? '0' : '',
-  'zIndex': isFullScreen.value ? '100' : '',
+  width: isFullScreen.value ? "100vw" : "",
+  height: isFullScreen.value ? "100vh" : "",
+  position: isFullScreen.value ? "fixed" : "",
+  top: isFullScreen.value ? "0" : "",
+  left: isFullScreen.value ? "0" : "",
+  zIndex: isFullScreen.value ? "100" : "",
 }));
 
 // 切换全屏状态
@@ -180,7 +179,6 @@ const toggleFullScreen = () => {
   isFullScreen.value = !isFullScreen.value;
 };
 
-
 onUpdated(() => {
   layout();
 });
@@ -192,10 +190,10 @@ watch(
     if (isEmpty(packageid)) {
       listData.value.length = 0;
       totalCount.value = 0;
-      taskDetailInfo.value = {}
+      taskDetailInfo.value = {};
       return;
     }
-    queryDetail(packageid)
+    queryDetail(packageid);
     // const res = await getPackageTaskList(newValue, packagepagination);
     // const { data } = res;
     // taskList.value = data;
@@ -273,7 +271,7 @@ function immersionHandler() {
 function showAction() {
   const item = taskDetailInfo.value;
   if (item.historyStates === 2 || item.historyStates === 3) {
-    return
+    return;
   }
   if (batch.value === false) overTask.value = item;
 }
@@ -290,161 +288,157 @@ function previewHandler(event: MouseEvent) {
     (imageRef.value as any).mergedOnClick();
 }
 function rejectHandler() {
-  const modal = unref(notPassModalRef)! as any
-  modal.showModal(selectItems.value)
+  const modal = unref(notPassModalRef)! as any;
+  modal.showModal(selectItems.value);
 }
 
 function singleRejectHandler(item) {
-  const modal = unref(notPassModalRef)! as any
-  modal.showModal([item])
+  const modal = unref(notPassModalRef)! as any;
+  modal.showModal([item]);
 }
 function reject(idOrDesc: string, backId: string, isOther: boolean) {
-  const formIds: string[] = processItems.map(item => item.id)
-  const taskIds: string[] = processItems.map(item => item.taskId)
-  const tasknames: string[] = processItems.map(item => item.taskname)
+  const formIds: string[] = processItems.map((item) => item.id);
+  const taskIds: string[] = processItems.map((item) => item.taskId);
+  const tasknames: string[] = processItems.map((item) => item.taskname);
 
   const param: ApprovalParam = {
     formid: formIds,
     taskId: taskIds,
     approvd: false,
     taskComment: idOrDesc,
-    taskname: isOther ? tasknames : ['其他'],
-  }
+    taskname: isOther ? tasknames : ["其他"],
+  };
 
-  doAudit(param)
+  doAudit(param);
 }
 function handleRejectMainImage() {
-  const modal = unref(mainImageModalRef)! as any
-  const params = cloneDeep(taskDetailInfo.value)
-  params.id = params.taskchildpictureid
-  modal.showModal([params])
+  const modal = unref(mainImageModalRef)! as any;
+  const params = cloneDeep(taskDetailInfo.value);
+  params.id = params.taskchildpictureid;
+  modal.showModal([params]);
 }
-async function reloadDetailInfo(){
+async function reloadDetailInfo() {
   const packageid = workStore.getActiveId;
   taskDetailInfo.value = await getTaskDetailInfo(packageid);
 }
 function handleApproveMainImage(items?: any) {
-  let cloneItem: any
+  let cloneItem: any;
   if (overTask.value) {
-    cloneItem = clone(overTask.value)
-    cloneItem.id = cloneItem.taskchildpictureid
-    processItems = [cloneItem]
+    cloneItem = clone(overTask.value);
+    cloneItem.id = cloneItem.taskchildpictureid;
+    processItems = [cloneItem];
   }
-  const msg = validate(processItems)
+  const msg = validate(processItems);
   if (msg !== null) {
-    message.error(msg)
-    return
+    message.error(msg);
+    return;
   }
 
-  const list: any = []
+  const list: any = [];
   processItems.forEach((item) => {
     list.push({
       formId: item.id,
       taskId: item.taskId,
       taskName: item.fromTaskName,
-    })
-  })
+    });
+  });
 
   const param = {
     result: true,
-    comment: '',
-    disposeType: '',
-    disposeTypeId: '',
-    failCauseId: '',
-    failCauseName: '',
+    comment: "",
+    disposeType: "",
+    disposeTypeId: "",
+    failCauseId: "",
+    failCauseName: "",
     flowTaskInfoList: list,
-  }
+  };
 
   dialog.info({
-    title: '确认提示',
-    content: '确认给该任务审批为【通过】吗?',
-    positiveText: '确定',
-    negativeText: '取消',
+    title: "确认提示",
+    content: "确认给该任务审批为【通过】吗?",
+    positiveText: "确定",
+    negativeText: "取消",
     onPositiveClick: () => {
-      audit(param).then(async(res) => {
-        const { code } = res
-        if (code === 'OK') {
-          message.info(res.message)
+      audit(param).then(async (res) => {
+        const { code } = res;
+        if (code === "OK") {
+          message.info(res.message);
           const packageid = workStore.getActiveId;
           taskDetailInfo.value = await getTaskDetailInfo(packageid);
-        }
-        else message.error(res.message)
-      })
+        } else message.error(res.message);
+      });
     },
-    onNegativeClick: () => { },
-  })
+    onNegativeClick: () => {},
+  });
 }
 function approvalHandler(items?: any) {
-  let cloneItem: any
+  let cloneItem: any;
   if (batch.value) {
-    processItems = selectItems.value
-  }
-  else if (overTask.value) {
-    cloneItem = clone(overTask.value)
-    processItems = [cloneItem]
+    processItems = selectItems.value;
+  } else if (overTask.value) {
+    cloneItem = clone(overTask.value);
+    processItems = [cloneItem];
   }
   //  任务包图片 => 点击 => 通过/不通过按钮
-  if (items !== undefined && !(items instanceof PointerEvent))
-    processItems = [items]
+  if (items !== undefined && !(items instanceof PointerEvent)) processItems = [items];
 
-  const msg = validate(processItems)
+  const msg = validate(processItems);
 
   if (msg !== null) {
-    message.error(msg)
-    return
+    message.error(msg);
+    return;
   }
 
-  const list: any = []
+  const list: any = [];
   processItems.forEach((item) => {
     list.push({
       formId: item.id,
       taskId: item.taskId,
       taskName: item.fromTaskName,
-    })
-  })
+    });
+  });
 
   const param = {
     result: true,
-    comment: '',
-    disposeType: '',
-    disposeTypeId: '',
-    failCauseId: '',
-    failCauseName: '',
+    comment: "",
+    disposeType: "",
+    disposeTypeId: "",
+    failCauseId: "",
+    failCauseName: "",
     flowTaskInfoList: list,
-  }
+  };
 
   dialog.info({
-    title: '确认提示',
-    content: '确认给该任务审批为【通过】吗?',
-    positiveText: '确定',
-    negativeText: '取消',
+    title: "确认提示",
+    content: "确认给该任务审批为【通过】吗?",
+    positiveText: "确定",
+    negativeText: "取消",
     onPositiveClick: () => {
-      doAudit(param)
+      doAudit(param);
     },
-    onNegativeClick: () => { },
-  })
+    onNegativeClick: () => {},
+  });
 }
 
 function doAudit(param: any) {
   audit(param).then((res) => {
-    const { code } = res
-    setBatch(false)
-    if (code === 'OK') {
-      message.info(res.message)
-      emitter.emit('refresh')
-      refreshHandler()
-    }
-    else message.error(res.message)
-  })
+    const { code } = res;
+    setBatch(false);
+    if (code === "OK") {
+      message.info(res.message);
+      emitter.emit("refresh");
+      refreshHandler();
+    } else message.error(res.message);
+  });
 }
 
 function reloadList() {
-  setBatch(false)
-  refreshHandler()
+  setBatch(false);
+  refreshHandler();
 }
 defineExpose({
-  queryDetail
-})
+  queryDetail,
+});
 </script>
 
 <template>
@@ -462,8 +456,20 @@ defineExpose({
             批量审批
           </div>
           <div class="icon-wrap">
-            <SvgIcon size="20" v-if="isFullScreen" name="power-off" @click="immersionHandler" style="cursor: pointer;" />
-            <SvgIcon size="20" v-else name="immersion-model" @click="immersionHandler" style="cursor: pointer;" />
+            <SvgIcon
+              size="20"
+              v-if="isFullScreen"
+              name="power-off"
+              @click="immersionHandler"
+              style="cursor: pointer"
+            />
+            <SvgIcon
+              size="20"
+              v-else
+              name="immersion-model"
+              @click="immersionHandler"
+              style="cursor: pointer"
+            />
           </div>
         </div>
 
@@ -489,50 +495,73 @@ defineExpose({
       <div ref="el" class="scroll">
         <div class="wrapper-detail">
           <!-- 左侧大图 图片信息 -->
-          <div class="left" :style="{ 'background-image': `url(${taskDetailInfo?.imgurl})` }" @click="showAction"
-            @mouseleave="leaveTaskHandler">
+          <div
+            class="left"
+            :style="{ 'background-image': `url(${taskDetailInfo?.imgurl})` }"
+            @click="showAction"
+            @mouseleave="leaveTaskHandler"
+          >
             <div class="footer-times">
-              <div class="time" style="margin-bottom: 4px;">
+              <div class="time" style="margin-bottom: 4px">
                 <SvgIcon color="#FFF" size="16" name="camera" />
-                <span class="time-value">{{ taskDetailInfo?.photoDateTimestamp ? format(
-                  taskDetailInfo.photoDateTimestamp, 'yyyy-MM-dd HH:mm:ss') : '-' }} </span>
+                <span class="time-value">{{ taskDetailInfo?.photoDateTimestamp }} </span>
               </div>
               <div class="time">
                 <SvgIcon color="#FFF" size="16" name="save" />
-                <span class="time-value">{{
-                  taskDetailInfo?.submitDateTimestamp ? format(taskDetailInfo?.submitDateTimestamp, 'yyyy-MM-dd HH:mm:ss')
-                  :
-                  '-'
-                }} </span>
+                <span class="time-value"
+                  >{{
+                    taskDetailInfo?.submitDateTimestamp
+                      ? format(taskDetailInfo?.submitDateTimestamp, "yyyy-MM-dd HH:mm:ss")
+                      : "-"
+                  }}
+                </span>
               </div>
             </div>
             <div class="status">
-              <img v-show="taskDetailInfo?.historyStates === 2" class="img-status" src="@/assets/images/task/pass.png"
-                alt="">
-              <img v-show="taskDetailInfo?.historyStates === 3" class="img-status" src="@/assets/images/task/not_pass.png"
-                alt="">
+              <img
+                v-show="taskDetailInfo?.historyStates === 2"
+                class="img-status"
+                src="@/assets/images/task/pass.png"
+                alt=""
+              />
+              <img
+                v-show="taskDetailInfo?.historyStates === 3"
+                class="img-status"
+                src="@/assets/images/task/not_pass.png"
+                alt=""
+              />
             </div>
             <!-- 右下信息 -->
             <div class="info img-info">
               <n-grid x-gap="12" y-gap="10" :cols="12">
                 <n-gi span="4" class="gi1">
                   <span>
-                    <img class="icon-status" src="@/assets/images/task/status.png" alt="">
+                    <img
+                      class="icon-status"
+                      src="@/assets/images/task/status.png"
+                      alt=""
+                    />
                   </span>
                 </n-gi>
                 <n-gi span="8" class="gi2">
-                  <span class="value">{{ TASK_STATUS_OBJ[taskDetailInfo.historyStates] }}</span>
+                  <span class="value">{{
+                    TASK_STATUS_OBJ[taskDetailInfo.historyStates]
+                  }}</span>
                   <span class="label">审批状态</span>
                 </n-gi>
                 <n-gi span="4" class="gi1">
                   <span>
-                    <img class="icon-status" src="@/assets/images/task/similarity.png" alt="">
+                    <img
+                      class="icon-status"
+                      src="@/assets/images/task/similarity.png"
+                      alt=""
+                    />
                   </span>
                 </n-gi>
                 <n-gi span="8" class="gi2">
-                  <span class="value num">{{
-                    totalCount
-                  }}<span class="unit">张</span> </span>
+                  <span class="value num"
+                    >{{ totalCount }}<span class="unit">张</span>
+                  </span>
                   <span class="label">相似匹配</span>
                 </n-gi>
               </n-grid>
@@ -543,73 +572,150 @@ defineExpose({
             </div>
             <!-- 预览大图组件 -->
             <div style="display: none">
-              <n-image ref="imageRef" :img-props="{ onClick: hideDownload }" :src="taskDetailInfo?.imgurl" />
+              <n-image
+                ref="imageRef"
+                :img-props="{ onClick: hideDownload }"
+                :src="taskDetailInfo?.imgurl"
+              />
             </div>
             <!-- 操作 -->
-            <div v-show="overTask && overTask.id === taskDetailInfo.id" class="action" @click.stop="hideAction">
-              <SvgIcon style="cursor: pointer" name="t1" @click.stop="handleApproveMainImage" />
-              <SvgIcon style="cursor: pointer; margin-left: 30px" name="t2" @click.stop="handleRejectMainImage" />
+            <div
+              v-show="overTask && overTask.id === taskDetailInfo.id"
+              class="action"
+              @click.stop="hideAction"
+            >
+              <SvgIcon
+                style="cursor: pointer"
+                name="t1"
+                @click.stop="handleApproveMainImage"
+              />
+              <SvgIcon
+                style="cursor: pointer; margin-left: 30px"
+                name="t2"
+                @click.stop="handleRejectMainImage"
+              />
             </div>
           </div>
           <PictureInfo :taskDetailInfo="taskDetailInfo"></PictureInfo>
         </div>
-        <div style="display: flex; justify-content: space-between; padding: 12px 0px 3px 0">
+        <div
+          style="display: flex; justify-content: space-between; padding: 12px 0px 3px 0"
+        >
           <div>
             <span
-              style="font-size: 18px; font-weight: Medium;color: #333333;font-family: PingFang SC, PingFang SC-Medium;">任务包图片</span>
+              style="
+                font-size: 18px;
+                font-weight: Medium;
+                color: #333333;
+                font-family: PingFang SC, PingFang SC-Medium;
+              "
+              >任务包图片</span
+            >
           </div>
-          <div style="display: flex; align-items: center;font-size: 14px;margin-right: 25px;color:#323233">
+          <div
+            style="
+              display: flex;
+              align-items: center;
+              font-size: 14px;
+              margin-right: 25px;
+              color: #323233;
+            "
+          >
             <div style="cursor: pointer" @click="sortHandler('createdate')">
               <span>时间排序</span>
-              <SvgIcon style="margin-left: 5px" name="sort" size="12" v-show="selectedSortName !== 'createdate'" />
-              <SvgIcon style="margin-left: 5px" name="active-sort" size="12" v-show="selectedSortName === 'createdate'" />
+              <SvgIcon
+                style="margin-left: 5px"
+                name="sort"
+                size="12"
+                v-show="selectedSortName !== 'createdate'"
+              />
+              <SvgIcon
+                style="margin-left: 5px"
+                name="active-sort"
+                size="12"
+                v-show="selectedSortName === 'createdate'"
+              />
             </div>
-            <div style="margin-left: 15px; cursor: pointer" @click="sortHandler('similarityScore')">
+            <div
+              style="margin-left: 15px; cursor: pointer"
+              @click="sortHandler('similarityScore')"
+            >
               <span>相似度排序</span>
-              <SvgIcon style="margin-left: 5px" name="sort" size="12" v-show="selectedSortName !== 'similarityScore'" />
-              <SvgIcon style="margin-left: 5px" name="active-sort" size="12"
-                v-show="selectedSortName === 'similarityScore'" />
+              <SvgIcon
+                style="margin-left: 5px"
+                name="sort"
+                size="12"
+                v-show="selectedSortName !== 'similarityScore'"
+              />
+              <SvgIcon
+                style="margin-left: 5px"
+                name="active-sort"
+                size="12"
+                v-show="selectedSortName === 'similarityScore'"
+              />
             </div>
           </div>
         </div>
         <div class="wrapper-list">
-          <div v-for="(item, index) in listData" :key="index" :class="{ 'item-selected': item === selectTask }"
-            class="grid-item" @click="handleSelect(item)" @mouseover="overTaskHandelr(item)"
-            @mouseleave="leaveTaskHandler">
-            <div class="img-wrapper" :style="{ 'background-image': `url(${item.imgurl})` }" />
+          <div
+            v-for="(item, index) in listData"
+            :key="index"
+            :class="{ 'item-selected': item === selectTask }"
+            class="grid-item"
+            @click="handleSelect(item)"
+            @mouseover="overTaskHandelr(item)"
+            @mouseleave="leaveTaskHandler"
+          >
+            <div
+              class="img-wrapper"
+              :style="{ 'background-image': `url(${item.imgurl})` }"
+            />
             <div class="time-wrapper">
               <div class="time">
                 <SvgIcon color="#FFF" size="16" name="camera" />
-                <span class="current-time">{{ item.photoDateTimestamp ? formatToDateHMS(Number(item.photoDateTimestamp) ||
-                  0) : '-'
+                <span class="current-time">{{
+                  item.photoDateTimestamp
+                    ? formatToDateHMS(Number(item.photoDateTimestamp) || 0)
+                    : "-"
                 }}</span>
               </div>
               <div class="time">
                 <SvgIcon color="#FFF" size="16" name="save" />
-                <span class="current-time">{{ item.submitDateTimestamp ? formatToDateHMS(Number(item.submitDateTimestamp)
-                  || 0) : '-'
+                <span class="current-time">{{
+                  item.submitDateTimestamp
+                    ? formatToDateHMS(Number(item.submitDateTimestamp) || 0)
+                    : "-"
                 }}</span>
               </div>
             </div>
             <div class="check">
-              <n-checkbox v-show="batch && item.historyStates !== 2 && item.historyStates !== 3"
-                v-model:checked="item.checked" @click.stop @update:checked="onCheckChange($event, item)" />
+              <n-checkbox
+                v-show="batch && item.historyStates !== 2 && item.historyStates !== 3"
+                v-model:checked="item.checked"
+                @click.stop
+                @update:checked="onCheckChange($event, item)"
+              />
             </div>
             <div class="percent" :class="{ 'percent-red': item?.maxSimilarity >= 100 }">
               <div class="val">
-                {{ item?.maxSimilarity && Number(item?.maxSimilarity).toFixed(0) }}<span class="percent-unit">%</span>
+                {{ item?.maxSimilarity && Number(item?.maxSimilarity).toFixed(0)
+                }}<span class="percent-unit">%</span>
               </div>
             </div>
 
             <div class="pass-status" v-if="item.historyStates === 2">
-              <SvgIcon name="pass-icon" style="width:52;height:24px" />
+              <SvgIcon name="pass-icon" style="width: 52; height: 24px" />
             </div>
             <div class="pass-status" v-else-if="item.historyStates === 3">
-              <SvgIcon name="no-pass-icon" style="width:52;height:24px" />
+              <SvgIcon name="no-pass-icon" style="width: 52; height: 24px" />
             </div>
             <div v-show="overTask && overTask.id === item.id" class="action">
               <SvgIcon style="cursor: pointer" name="t1" @click.stop="approvalHandler" />
-              <SvgIcon style="cursor: pointer;margin-left: 40px;" name="t2" @click.stop="singleRejectHandler(item)" />
+              <SvgIcon
+                style="cursor: pointer; margin-left: 40px"
+                name="t2"
+                @click.stop="singleRejectHandler(item)"
+              />
             </div>
           </div>
         </div>
@@ -732,7 +838,7 @@ defineExpose({
         z-index: 3;
         width: 30px;
         height: 30px;
-        background: rgba(255, 255, 255, 0.20);
+        background: rgba(255, 255, 255, 0.2);
         border-radius: 6px;
         backdrop-filter: blur(10px);
         display: flex;
@@ -772,7 +878,11 @@ defineExpose({
       .footer-times {
         width: 100%;
         height: 80px;
-        background: linear-gradient(180deg, rgba(0, 0, 0, 0.01), rgba(0, 0, 0, 0.71) 100%);
+        background: linear-gradient(
+          180deg,
+          rgba(0, 0, 0, 0.01),
+          rgba(0, 0, 0, 0.71) 100%
+        );
         border-radius: 0px 8px 8px 0px;
         position: absolute;
         bottom: 0;
@@ -824,7 +934,7 @@ defineExpose({
         justify-content: center;
         width: 30px;
         height: 30px;
-        background: rgba(80, 122, 253, .1);
+        background: rgba(80, 122, 253, 0.1);
         border-radius: 8px;
         margin-left: 10px;
         cursor: pointer;
@@ -863,7 +973,6 @@ defineExpose({
         .unit {
           font-size: 11px;
         }
-
       }
     }
 
@@ -885,7 +994,6 @@ defineExpose({
       padding: 24px;
       // background: lime;
 
-
       .task-name {
         display: inline-block;
         width: 100%;
@@ -926,18 +1034,18 @@ defineExpose({
       }
 
       .tag-submited {
-        color: #507AFD;
-        border: 1px solid #507AFD;
+        color: #507afd;
+        border: 1px solid #507afd;
       }
 
       .tag-submiting {
-        color: #FFB800;
-        border: 1px solid #FFB800;
+        color: #ffb800;
+        border: 1px solid #ffb800;
       }
 
       .tag-passed {
-        color: #02C984;
-        border: 1px solid #02C984;
+        color: #02c984;
+        border: 1px solid #02c984;
       }
 
       .tag-not-passed {
@@ -965,7 +1073,8 @@ defineExpose({
         margin-right: 32px;
       }
 
-      .top {}
+      .top {
+      }
 
       .property-content {
         flex: 1;
@@ -1007,7 +1116,11 @@ defineExpose({
         bottom: 9px;
         width: calc(100% - 11px);
         height: 58px;
-        background: linear-gradient(180deg, rgba(0, 0, 0, 0.01), rgba(0, 0, 0, 0.71) 100%);
+        background: linear-gradient(
+          180deg,
+          rgba(0, 0, 0, 0.01),
+          rgba(0, 0, 0, 0.71) 100%
+        );
         border-radius: 8px;
         display: flex;
         flex-direction: column;
@@ -1077,7 +1190,6 @@ defineExpose({
         }
       }
 
-
       .action {
         position: absolute;
         z-index: 5;
@@ -1091,8 +1203,6 @@ defineExpose({
         justify-content: center;
         background-color: rgba(0, 0, 0, 0.48);
       }
-
-
     }
   }
 }