diff --git a/src/api/home/main.ts b/src/api/home/main.ts
index 5ef20a6..60e6f24 100644
--- a/src/api/home/main.ts
+++ b/src/api/home/main.ts
@@ -117,9 +117,10 @@ export async function getPictureList(params: any): Promise<any> {
     headers: { 'Content-Type': ContentTypeEnum.FORM_DATA },
   })
 
-  const { data: { records, pages } } = res
+  const { data: { records, pages, total } } = res
   return {
     pageCount: pages,
     data: records,
+    total,
   }
 }
diff --git a/src/api/work/work.ts b/src/api/work/work.ts
index 949fc80..78e6923 100644
--- a/src/api/work/work.ts
+++ b/src/api/work/work.ts
@@ -87,6 +87,7 @@ export async function getTaskDetailPictureList(packageid: string, taskchildpictu
       assignee: item.assignee,
       pictureid: item.pictureid,
       imgurl: item.ocrPicture.imgurl,
+      thumburl: item.serverThumbnailUrl || item.ocrPicture.imgurl,
       iztrueorfalse: item.iztrueorfalse,
       states: item.states,
       history: hasHistory(item.ocpictureid, item.picturecompare),
diff --git a/src/views/final/aside/Aside.vue b/src/views/final/aside/Aside.vue
index 9e3ed29..3d3778c 100644
--- a/src/views/final/aside/Aside.vue
+++ b/src/views/final/aside/Aside.vue
@@ -134,16 +134,8 @@ function scrollHandler(key: string) {
   element?.scrollIntoView(true)
 }
 
-// 设置过滤配置的值（匹配的设置，不匹配的重置为默认值）
-function filterHandler(filterList: Filter[]) {
-  const filerMap: Record<string, any> = {}
-
-  for (const filter of filterList) {
-    const { key, value } = filter
-    filerMap[key] = value
-  }
-
-  emitter.emit('filter-final', filerMap)
+function filterHandler(searchId: string) {
+  emitter.emit('filter-final', searchId)
 }
 
 function editFilter(filter: any) {
diff --git a/src/views/final/comp/Action.vue b/src/views/final/comp/Action.vue
index a9e46d2..b50e98f 100644
--- a/src/views/final/comp/Action.vue
+++ b/src/views/final/comp/Action.vue
@@ -17,8 +17,9 @@ const props = defineProps({
 })
 
 const actionConfig = {
-  1: [{ label: '查看', key: 'view' }, { label: '重置审批', key: 'reset' }],
-  5: [{ label: '通过', key: 'approval' }, { label: '不通过', key: 'reject' }, { label: '重置审批', key: 'reset' }],
+  3: [{ label: '查看', key: 'view' }, { label: '重置审批', key: 'reset' }],
+  4: [{ label: '查看', key: 'view' }, { label: '重置审批', key: 'reset' }],
+  2: [{ label: '通过', key: 'approval' }, { label: '不通过', key: 'reject' }, { label: '重置审批', key: 'reset' }],
 }
 
 const actions = computed(() => {
diff --git a/src/views/final/content/Content.vue b/src/views/final/content/Content.vue
index c6326fd..77efc19 100644
--- a/src/views/final/content/Content.vue
+++ b/src/views/final/content/Content.vue
@@ -130,15 +130,14 @@ const pagination = reactive({
 })
 const tableData = ref<Array<RowData>>([])
 const selectionIds = ref<DataTableRowKey[]>([])
-const userStore = useUser()
 const dialog = useDialog()
 const message = useMessage()
 const finalStore = useFinal()
 
-async function query(page: number, pageSize: number, filterValues?: any) {
+async function query(page: number, pageSize: number, filterId?: any) {
   const asideParmas = unref(finalStore.getAsideValue)
   // 有过滤配置的时候优先使用过滤配置，不要使用左侧参数
-  const params = filterValues || asideParmas
+  const params = filterId ? { userSearchId: filterId } : asideParmas
   const result = await getFinalList({ sortorder: 'asc', pageSize, currPage: page, sortname: '', ...params })
   const { data, pageCount } = result
   tableData.value = data
@@ -404,9 +403,9 @@ function reset() {
   pagination.pageSize = 1
 }
 
-async function refreshHandler(filterValues?: any) {
+async function refreshHandler(searchId?: any) {
   reset()
-  query(pagination.page, pagination.pageSize, filterValues)
+  query(pagination.page, pagination.pageSize, searchId)
 }
 </script>
 
diff --git a/src/views/home/aside/Aside.vue b/src/views/home/aside/Aside.vue
index 1a008f2..7445876 100644
--- a/src/views/home/aside/Aside.vue
+++ b/src/views/home/aside/Aside.vue
@@ -133,15 +133,8 @@ function scrollHandler(key: string) {
 }
 
 // 选择某个过滤配置，刷新图片墙
-function filterHandler(filterList: Filter[]) {
-  const filerMap: Record<string, any> = {}
-
-  for (const filter of filterList) {
-    const { key, value } = filter
-    filerMap[key] = value
-  }
-
-  emitter.emit('filter', filerMap)
+function filterHandler(searchId: string) {
+  emitter.emit('filter', searchId)
 }
 
 function editFilter(filter: any) {
diff --git a/src/views/home/aside/comp/AdvanceFilter.vue b/src/views/home/aside/comp/AdvanceFilter.vue
index df6193c..9388c82 100644
--- a/src/views/home/aside/comp/AdvanceFilter.vue
+++ b/src/views/home/aside/comp/AdvanceFilter.vue
@@ -46,6 +46,7 @@ function generateDefaultConfig(): FilterEntity[] {
 
     if (isDefaultFilter === true) {
       const config = {
+        id: '',
         name: label,
         favorite: false,
         isDefaultFilter,
diff --git a/src/views/home/content/Content.vue b/src/views/home/content/Content.vue
index ada822f..523d33c 100644
--- a/src/views/home/content/Content.vue
+++ b/src/views/home/content/Content.vue
@@ -26,7 +26,7 @@ const el = ref<HTMLDivElement | null>(null)
 const viewMode = ref('masonry')
 const pagination = reactive({
   pageNo: 0,
-  pageSize: 50,
+  pageSize: 30,
 })
 const configStore = useConfig()
 const packageModalRef = ref(null)
@@ -34,6 +34,7 @@ const generateModalRef = ref(null)
 const LoginSuccessModalRef = ref(null)
 const loading = ref(false)
 const message = useMessage()
+const totalCount = ref(0)
 let canloadMore = true
 let filterId = null
 
@@ -130,12 +131,14 @@ async function featchList() {
     const asideParams = unref(configStore.getAsideValue)
     const params = filterId ? { userSearchId: filterId } : asideParams
     const result = await getPictureList({ ...pagination, ...contentParams, ...params })
-    const { data, pageCount } = result
+    const { data, pageCount, total } = result
+    totalCount.value = total
     canloadMore = pageCount >= pagination.pageNo && pageCount > 0
 
     const list = data.map((item) => {
       return {
         imgUrl: item.imgurl,
+        thumburl: item.serverThumbnailUrl || item.imgurl,
         upname: item.upname,
         ocrPictureclass: item.ocrPictureclass,
         uphead: item.uphead,
@@ -216,7 +219,7 @@ watch(() => configStore.asideValue, (newVal, oldVal) => {
 
 function reset() {
   pagination.pageNo = 0
-  pagination.pageSize = 50
+  pagination.pageSize = 30
   listData.value.length = 0
   loading.value = false
   canloadMore = true
@@ -253,19 +256,22 @@ function getAvatar(url: string): string {
       <SvgIcon style="cursor: pointer;" size="105" name="yijianchachong" @click="oneCheck" />
     </div>
     <div class="wrapper-content">
-      <div class="form">
-        <n-popselect v-model:value="timeRange" :options="timeOptions" trigger="click">
-          <div class="dropdown">
-            <span>{{ timeLabel || '请选择' }}</span>
-            <SvgIcon class="gap" name="arrow-botton" size="14" />
-          </div>
-        </n-popselect>
-        <n-popselect v-model:value="viewMode" :options="viewOptions" trigger="click">
-          <div class="dropdown">
-            <span>{{ viewLabel || '请选择' }}</span>
-            <SvgIcon class="gap" name="arrow-botton" size="14" />
-          </div>
-        </n-popselect>
+      <div style="display: flex;justify-content: space-between;">
+        <div class="form">
+          <n-popselect v-model:value="timeRange" :options="timeOptions" trigger="click">
+            <div class="dropdown">
+              <span>{{ timeLabel || '请选择' }}</span>
+              <SvgIcon class="gap" name="arrow-botton" size="14" />
+            </div>
+          </n-popselect>
+          <n-popselect v-model:value="viewMode" :options="viewOptions" trigger="click">
+            <div class="dropdown">
+              <span>{{ viewLabel || '请选择' }}</span>
+              <SvgIcon class="gap" name="arrow-botton" size="14" />
+            </div>
+          </n-popselect>
+        </div>
+        <span>共{{ totalCount }}项</span>
       </div>
       <n-spin :show="loading">
         <div ref="el" class="scroll" :style="listStyle">
@@ -279,7 +285,7 @@ function getAvatar(url: string): string {
               > -->
               <n-image
                 class="img" :img-props="{ onClick: hideDownload }"
-                :class="{ 'img-fit': viewMode !== 'masonry' }" :src="item.imgUrl"
+                :class="{ 'img-fit': viewMode !== 'masonry' }" :src="item.thumburl"
               />
               <div class="info">
                 <div class="left">
diff --git a/src/views/task/content/Content.vue b/src/views/task/content/Content.vue
index da942f0..08e12e8 100644
--- a/src/views/task/content/Content.vue
+++ b/src/views/task/content/Content.vue
@@ -1,37 +1,34 @@
 <script lang="ts" setup>
-import { getAllfieldList } from "@/api/home/filter";
-import { audit } from "@/api/task/task";
-import { getTaskDetailInfo, getTaskDetailPictureList } from "@/api/work/work";
-import { useTask } from "@/store/modules/task";
-import { useUser } from "@/store/modules/user";
-import { isEmpty } from "@/utils";
-import { hideDownload } from "@/utils/image";
-import emitter from "@/utils/mitt";
-import _ from 'lodash';
-import { clone } from "lodash-es";
-import { useDialog, useMessage } from "naive-ui";
-import { computed, onUnmounted, reactive, ref, unref, watch } from "vue";
-import BatchModal from "../modal/BatchModal.vue";
-import ConfrimModal from "../modal/ConfrimModal.vue";
-import CustomSettingModal from "../modal/CustomSettingModal.vue";
-import PictureTable from "./PictureTable.vue";
-import TaskTable from "./TaskTable.vue";
-import type { ApprovalParam, PictureSortParam } from "/#/api";
-
-const batch = ref(false);
-const selectItems = ref<any[]>([]);
-const message = useMessage();
-const dialog = useDialog();
-const confrimModalRef = ref(null);
-const batchModalRef = ref(null);
-const totalCount = ref(0);
-const CustomSettingModalRef = ref(null);
-const taskTableData = ref<any[]>([]);
+import { clone } from 'lodash-es'
+import { useDialog, useMessage } from 'naive-ui'
+import { computed, onUnmounted, reactive, ref, unref, watch } from 'vue'
+import { isEmpty } from '@/utils'
+import BatchModal from '../modal/BatchModal.vue'
+import { audit } from '@/api/task/task'
+import { getTaskDetailInfo, getTaskDetailPictureList } from '@/api/work/work'
+import { useTask } from '@/store/modules/task'
+import { useUser } from '@/store/modules/user'
+import { hideDownload } from '@/utils/image'
+import emitter from '@/utils/mitt'
+import ConfrimModal from '../modal/ConfrimModal.vue'
+import CustomSettingModal from '../modal/CustomSettingModal.vue'
+import PictureTable from './PictureTable.vue'
+import TaskTable from './TaskTable.vue'
+import type { ApprovalParam, PictureSortParam } from '/#/api'
+
+const batch = ref(false)
+const selectItems = ref<any[]>([])
+const message = useMessage()
+const dialog = useDialog()
+const confrimModalRef = ref(null)
+const batchModalRef = ref(null)
+const totalCount = ref(0)
+const CustomSettingModalRef = ref(null)
 
 const sortBy: PictureSortParam = {
-  orderbyname: "asc",
-  orderbyvalue: "fromuptime",
-};
+  orderbyname: 'asc',
+  orderbyvalue: 'fromuptime',
+}
 
 function setBatch(value: boolean) {
   if (totalCount.value === 0)
@@ -39,38 +36,40 @@ function setBatch(value: boolean) {
 
   batch.value = value
   if (value === false) {
-    selectItems.value.forEach((item) => (item.checked = false));
-    selectItems.value.length = 0;
+    selectItems.value.forEach(item => (item.checked = false))
+    selectItems.value.length = 0
   }
 }
 
 function onCheckChange(checked: any, item: any) {
-  const index = selectItems.value.indexOf(item);
-  item.checked = checked;
+  const index = selectItems.value.indexOf(item)
+  item.checked = checked
 
-  if (index === -1 && checked) selectItems.value.push(item);
-  else selectItems.value.splice(index, 1);
+  if (index === -1 && checked)
+    selectItems.value.push(item)
+  else selectItems.value.splice(index, 1)
 }
 
 const showActions = computed(() => {
-  return selectItems.value.length > 0 && batch;
-});
+  return selectItems.value.length > 0 && batch
+})
 
 const taskpagination = reactive({
   pageNo: 1,
   pageSize: 10,
-});
-const taskStore = useTask();
-const overTask = ref<any>(null);
-const taskDetailInfo = ref<any>({});
-const taskDetailPictureList = ref<any[]>([]);
-const userStore = useUser();
-const imageRef = ref<ComponentElRef | null>();
-let processItems: any[] = [];
+})
+const taskStore = useTask()
+const overTask = ref<any>(null)
+const taskDetailInfo = ref<any>({})
+const taskDetailPictureList = ref<any[]>([])
+const userStore = useUser()
+const imageRef = ref<ComponentElRef | null>()
+let processItems: any[] = []
 
 // states:1未提交，2待审批，3通过，4不通过
 function validate(items: any[]) {
-  if (items.length === 0) return "至少选中一个任务";
+  if (items.length === 0)
+    return '至少选中一个任务'
 
   // const useInfo = userStore.getUserInfo
   // const username = useInfo.loginname
@@ -87,200 +86,175 @@ function validate(items: any[]) {
   //     return '审批人不一致'
   // }
 
-  return null;
+  return null
 }
 
 function approvalHandler(items?: any) {
-  let cloneItem: any;
-  if (batch.value) {
-    processItems = selectItems.value;
-  } else if (overTask.value) {
-    cloneItem = clone(overTask.value);
-    processItems = [cloneItem];
+  let cloneItem: any
+  if (batch.value) { processItems = selectItems.value }
+  else if (overTask.value) {
+    cloneItem = clone(overTask.value)
+    processItems = [cloneItem]
   }
 
   if (items !== undefined && !(items instanceof PointerEvent))
-    processItems = items;
+    processItems = items
 
-  const msg = validate(processItems);
+  const msg = validate(processItems)
 
   if (msg !== null) {
-    message.error(msg);
-    return;
+    message.error(msg)
+    return
   }
 
   dialog.info({
-    title: "确认提示",
-    content: "确认给该任务审批为【通过】吗?",
-    positiveText: "确定",
-    negativeText: "取消",
+    title: '确认提示',
+    content: '确认给该任务审批为【通过】吗?',
+    positiveText: '确定',
+    negativeText: '取消',
     onPositiveClick: () => {
-      approval();
+      approval()
     },
-    onNegativeClick: () => {},
-  });
+    onNegativeClick: () => { },
+  })
 }
 
 function rejectHandler(items?: any) {
-  let cloneItem: any;
-  if (batch.value) {
-    processItems = selectItems.value;
-  } else if (overTask.value) {
-    cloneItem = clone(overTask.value);
-    processItems = [cloneItem];
+  let cloneItem: any
+  if (batch.value) { processItems = selectItems.value }
+  else if (overTask.value) {
+    cloneItem = clone(overTask.value)
+    processItems = [cloneItem]
   }
 
   if (items !== undefined && !(items instanceof PointerEvent))
-    processItems = items;
+    processItems = items
 
-  const msg = validate(processItems);
+  const msg = validate(processItems)
 
   if (msg !== null) {
-    message.error(msg);
-    return;
+    message.error(msg)
+    return
   }
 
-  const modal = unref(confrimModalRef)! as any;
-  modal.showModal();
+  const modal = unref(confrimModalRef)! as any
+  modal.showModal()
 }
 
 function approval() {
-  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: true,
-    taskComment: "approval",
+    taskComment: 'approval',
     taskname: tasknames,
-  };
+  }
 
-  doAudit(param);
+  doAudit(param)
 }
 
 function doAudit(param: any) {
   audit(param).then((res) => {
-    const { code } = res;
-    processItems.length = 0;
-    if (code === "OK") emitter.emit("refresh");
-    else message.error(res.message);
-  });
+    const { code } = res
+    processItems.length = 0
+    if (code === 'OK')
+      emitter.emit('refresh')
+    else message.error(res.message)
+  })
 }
 
 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 showModal(modalRef: any) {
-  const modal = unref(modalRef)! as any;
-  modal.showModal();
+  const modal = unref(modalRef)! as any
+  modal.showModal()
 }
 
 function forwardHandler() {
-  taskStore.forward();
+  taskStore.forward()
 }
 
 function backHandler() {
-  taskStore.back();
+  taskStore.back()
 }
 
-watch(
-  () => [taskStore.activeId],
-  async (newValue, oldValue) => {
-    const packageid = taskStore.getPackageid;
-    const taskId = taskStore.getActiveId;
-
-    if (isEmpty(taskId)) return;
-
-    let listData = [];
-    taskDetailInfo.value = await getTaskDetailInfo(taskId, packageid);
-    const reviewType = 3; //类型
-    let res = await getAllfieldList(reviewType);
-    let fieldList = (res as any)?.data;
-    console.log(taskDetailInfo.value, "taskDetailInfo");
-    console.log(fieldList, "fieldList");
-    let showFieldData = taskDetailInfo.value.ocrPicture;
-    let showFieldKeys = Object.keys(showFieldData);
-    for (let i in showFieldKeys) {
-      let key = showFieldKeys[i];
-      let currentData = fieldList.find((v) => v.name == key);
-      if (currentData) {
-        let item = {
-          label: currentData.fieldDesc,
-          value: taskDetailInfo.value.ocrPicture[key],
-          key: currentData.name,
-        };
-        listData.push(item);
-      }
-    }
-    taskTableData.value = _.chunk(listData,2);
-    console.log(taskTableData.value,'taskTableData')
-    if (!isEmpty(packageid)) {
-      const { data, total } = await getTaskDetailPictureList(
-        packageid,
-        taskId,
-        { ...taskpagination, ...sortBy }
-      );
-      taskDetailPictureList.value = data;
-      totalCount.value = total;
-    } else {
-      taskDetailPictureList.value.length = 0;
-      totalCount.value = 0;
-    }
+watch(() => [taskStore.activeId], async (newValue, oldValue) => {
+  const packageid = taskStore.getPackageid
+  const taskId = taskStore.getActiveId
+
+  if (isEmpty(taskId))
+    return
+
+  taskDetailInfo.value = await getTaskDetailInfo(taskId, packageid)
+
+  if (!isEmpty(packageid)) {
+    const { data, total } = await getTaskDetailPictureList(packageid, taskId, { ...taskpagination, ...sortBy })
+    taskDetailPictureList.value = data
+    totalCount.value = total
+  }
+  else {
+    taskDetailPictureList.value.length = 0
+    totalCount.value = 0
   }
-);
+})
 
 const currentTaskId = computed(() => {
-  const index = taskStore.getCurrentIndex;
-  return taskStore.getApprovalList[index]?.formid || "";
-});
+  const index = taskStore.getCurrentIndex
+  return taskStore.getApprovalList[index]?.formid || ''
+})
 
 function overTaskHandle() {
-  const item = taskDetailInfo.value;
+  const item = taskDetailInfo.value
 
-  if (validate([item]) == null && batch.value === false) overTask.value = item;
+  if (validate([item]) == null && batch.value === false)
+    overTask.value = item
 }
 
 function leaveTaskHandler() {
-  overTask.value = null;
+  overTask.value = null
 }
 
 function showActionsModal() {
-  const modal = unref(CustomSettingModalRef)! as any;
-  modal.showModal();
+  const modal = unref(CustomSettingModalRef)! as any
+  modal.showModal()
 }
 
 onUnmounted(() => {
-  taskStore.reset();
-});
+  taskStore.reset()
+})
 
 const mark = computed(() => {
-  return taskDetailInfo.value.iztrueorfalse === null ? "未标记" : "已标记";
-});
+  return taskDetailInfo.value.iztrueorfalse === null ? '未标记' : '已标记'
+})
 
 function immersionHandler() {
-  taskStore.updateImmersion();
+  taskStore.updateImmersion()
 }
 
 function previewHandler(event: MouseEvent) {
-  event.stopImmediatePropagation();
-  event.stopPropagation();
+  event.stopImmediatePropagation()
+  event.stopPropagation()
 
-  if (imageRef.value) (imageRef.value as any).mergedOnClick();
+  if (imageRef.value)
+    (imageRef.value as any).mergedOnClick()
 }
 
 function getPercent(pictureid: string) {
@@ -312,21 +286,12 @@ function getPercent(pictureid: string) {
         />
       </div>
       <div class="right">
-        <div
-          v-show="!showActions"
-          style="display: flex; align-items: center"
-          @click="setBatch(true)"
-        >
+        <div v-show="!showActions" style="display: flex;align-items: center;" @click="setBatch(true)">
           <div class="btn">
-            <SvgIcon style="margin-right: 6px" size="14" name="tf" />
+            <SvgIcon style="margin-right: 6px;" size="14" name="tf" />
             批量审批
           </div>
-          <SvgIcon
-            style="cursor: pointer"
-            size="20"
-            name="immersion-model"
-            @click="immersionHandler"
-          />
+          <SvgIcon style="cursor: pointer;" size="20" name="immersion-model" @click="immersionHandler" />
         </div>
         <div v-show="showActions" class="batch">
           <n-button text @click="setBatch(false)">
@@ -335,14 +300,11 @@ function getPercent(pictureid: string) {
             </template>
             返回
           </n-button>
-          <div
-            style="cursor: pointer; margin-left: 16px"
-            @click.stop="rejectHandler"
-          >
+          <div style="cursor: pointer;margin-left: 16px;" @click.stop="rejectHandler">
             <SvgIcon width="64" height="28" name="a1" />
           </div>
           <SvgIcon size="24" name="vs" />
-          <div style="cursor: pointer" @click.stop="approvalHandler">
+          <div style="cursor: pointer;" @click.stop="approvalHandler">
             <SvgIcon width="64" height="28" name="a2" />
           </div>
         </div>
@@ -350,43 +312,21 @@ function getPercent(pictureid: string) {
     </div>
     <div class="wrapper-detail">
       <div
-        class="left"
-        :style="{
-          'background-image': `url(${taskDetailInfo?.ocrPicture?.imgurl})`,
-        }"
-        @mouseover="overTaskHandle"
-        @mouseleave="leaveTaskHandler"
-        @click="previewHandler"
+        class="left" :style="{ 'background-image': `url(${taskDetailInfo?.ocrPicture?.imgurl})` }"
+        @mouseover="overTaskHandle" @mouseleave="leaveTaskHandler" @click="previewHandler"
       >
         <div v-show="overTask" class="action">
+          <SvgIcon style="cursor: pointer;" width="168" height="48" name="r6" @click.stop="approvalHandler" />
           <SvgIcon
-            style="cursor: pointer"
-            width="168"
-            height="48"
-            name="r6"
-            @click.stop="approvalHandler"
-          />
-          <SvgIcon
-            style="cursor: pointer; margin-left: 30px"
-            width="168"
-            height="48"
-            name="r7"
+            style="cursor: pointer;margin-left: 30px;" width="168" height="48" name="r7"
             @click.stop="rejectHandler"
           />
         </div>
         <div class="mark">
-          <SvgIcon
-            v-show="taskDetailInfo?.iztrueorfalse === 0"
-            size="128"
-            name="jia"
-          />
+          <SvgIcon v-show="taskDetailInfo?.iztrueorfalse === 0" size="128" name="jia" />
         </div>
         <div class="mark">
-          <SvgIcon
-            v-show="taskDetailInfo?.iztrueorfalse === 1"
-            size="128"
-            name="zhen"
-          />
+          <SvgIcon v-show="taskDetailInfo?.iztrueorfalse === 1" size="128" name="zhen" />
         </div>
         <div class="info">
           <n-grid x-gap="12" y-gap="10" :cols="12">
@@ -396,7 +336,7 @@ function getPercent(pictureid: string) {
               </span>
             </n-gi>
             <n-gi span="8" class="gi2">
-              <span style="font-size: bold; font-size: 18px">{{ mark }}</span>
+              <span style="font-size: bold;font-size: 18px;">{{ mark }}</span>
               <span>审批状态</span>
             </n-gi>
             <n-gi span="4" class="gi1">
@@ -405,9 +345,7 @@ function getPercent(pictureid: string) {
               </span>
             </n-gi>
             <n-gi span="8" class="gi2">
-              <span style="font-size: bold; font-size: 18px">{{
-                totalCount
-              }}</span>
+              <span style="font-size: bold;font-size: 18px;">{{ totalCount }}</span>
               <span>相似匹配</span>
             </n-gi>
           </n-grid>
@@ -416,12 +354,8 @@ function getPercent(pictureid: string) {
           <SvgIcon color="#FFF" size="16" name="time" />
           <span>2023-09-17 13:09:10</span>
         </div>
-        <div style="display: none">
-          <n-image
-            ref="imageRef"
-            :img-props="{ onClick: hideDownload }"
-            :src="taskDetailInfo?.ocrPicture?.imgurl"
-          />
+        <div style="display: none;">
+          <n-image ref="imageRef" :img-props="{ onClick: hideDownload }" :src="taskDetailInfo?.ocrPicture?.imgurl" />
         </div>
       </div>
       <div class="right">
@@ -429,22 +363,13 @@ function getPercent(pictureid: string) {
           <div class="header">
             <span>相似图片({{ totalCount }})</span>
             <SvgIcon
-              style="margin-right: 20px; cursor: pointer"
-              name="max"
-              size="24"
+              style="margin-right: 20px;cursor: pointer;" name="max" size="24"
               @click="showModal(batchModalRef)"
             />
           </div>
           <div class="list">
-            <div
-              v-for="(item, index) in taskDetailPictureList"
-              :key="index"
-              class="item"
-            >
-              <div
-                class="img-wrapper"
-                :style="{ 'background-image': `url(${item.imgurl})` }"
-              />
+            <div v-for="(item, index) in taskDetailPictureList" :key="index" class="item">
+              <div class="img-wrapper" :style="{ 'background-image': `url(${item.thumburl})` }" />
               <div class="check">
                 <n-checkbox
                   v-show="batch"
@@ -465,7 +390,9 @@ function getPercent(pictureid: string) {
 
     <div class="info-header">
       <div class="left_box">
-        <div class="title">填报信息</div>
+        <div class="title">
+          填报信息
+        </div>
         <SvgIcon size="12" name="collapse" />
       </div>
       <div class="right_box" @click="showActionsModal">
@@ -475,7 +402,7 @@ function getPercent(pictureid: string) {
     </div>
     <n-tabs type="line" animated>
       <n-tab-pane name="task-info" tab="任务信息">
-        <TaskTable :data="taskDetailInfo" :taskTableData="taskTableData"/>
+        <TaskTable :data="taskDetailInfo" />
       </n-tab-pane>
       <n-tab-pane name="picture-info" tab="图片信息">
         <PictureTable :data="taskDetailInfo" />
@@ -541,7 +468,7 @@ function getPercent(pictureid: string) {
         display: flex;
         align-items: center;
         justify-content: center;
-        color: #fff;
+        color: #FFF;
         margin-right: 6px;
         cursor: pointer;
       }
@@ -611,7 +538,7 @@ function getPercent(pictureid: string) {
         background: rgba(216, 216, 216, 0.4);
         border-radius: 7px;
         padding: 10px;
-        color: #fff;
+        color: #FFF;
       }
 
       .time {
@@ -619,7 +546,7 @@ function getPercent(pictureid: string) {
         z-index: 3;
         left: 2%;
         bottom: 2%;
-        color: #fff;
+        color: #FFF;
         display: flex;
         align-items: center;
       }
@@ -633,7 +560,7 @@ function getPercent(pictureid: string) {
         display: flex;
         align-items: left;
         flex-direction: column;
-        justify-content: center;
+        justify-content: center
       }
     }
 
diff --git a/src/views/worksheet/aside/WorkSheetList.vue b/src/views/worksheet/aside/WorkSheetList.vue
index 8fe2644..9717eb0 100644
--- a/src/views/worksheet/aside/WorkSheetList.vue
+++ b/src/views/worksheet/aside/WorkSheetList.vue
@@ -27,7 +27,7 @@ const { isLoading } = useInfiniteScroll(
   () => {
     loadMore()
   },
-  { distance: 10, interval: 300, canLoadMore: () => {
+  { distance: 10, interval: 800, canLoadMore: () => {
     // console.log('canloadmore excuted!')
     return canloadMore.value
   } },
diff --git a/src/views/worksheet/content/Content.vue b/src/views/worksheet/content/Content.vue
index 54d6a47..4f3b7ee 100644
--- a/src/views/worksheet/content/Content.vue
+++ b/src/views/worksheet/content/Content.vue
@@ -1,7 +1,9 @@
 <script lang="ts" setup>
-import { computed, onUnmounted, reactive, ref, unref, watch } from 'vue'
+import { computed, onMounted, onUnmounted, onUpdated, reactive, ref, unref, watch } from 'vue'
 import { useDialog, useMessage } from 'naive-ui'
-import { clone, pickBy } from 'lodash-es'
+import { clone, debounce, pickBy } from 'lodash-es'
+import { useInfiniteScroll } from '@vueuse/core'
+import imagesloaded from 'imagesloaded'
 import ConfrimModal from '../modal/ConfrimModal.vue'
 import type { PictureSortParam, SetTFParam } from '/#/api'
 import { useWorkOrder } from '@/store/modules/workOrder'
@@ -15,6 +17,7 @@ const selectItems = ref<any[]>([])
 const message = useMessage()
 const dialog = useDialog()
 const totalCount = ref(0)
+let _imagesload: any
 
 function setBatch(value: boolean) {
   batch.value = value
@@ -59,6 +62,11 @@ const taskDetailInfo = ref<any>({})
 const taskDetailPictureList = ref<any[]>([])
 const confrimModalRef = ref(null)
 const imageRef = ref<ComponentElRef | null>()
+const listData = ref<any[]>([])
+const loading = ref(false)
+const el = ref<HTMLDivElement | null>(null)
+
+let canloadMore = true
 
 let processItems: any[] = []
 
@@ -184,16 +192,86 @@ function backHandler() {
   workStore.back()
 }
 
+function reset() {
+  taskpagination.pageNo = 0
+  taskpagination.pageSize = 20
+  listData.value.length = 0
+  loading.value = false
+  canloadMore = true
+}
+
+async function refreshHandler() {
+  reset()
+
+  useInfiniteScroll(
+    el as any,
+    () => {
+      loadMore()
+    },
+    { distance: 10, canLoadMore: () => canloadMore },
+  )
+}
+
+async function loadMore() {
+  if (loading.value || el.value == null)
+    return
+
+  const more = await featchList()
+  listData.value.push(...more)
+}
+
+async function featchList() {
+  loading.value = true
+  try {
+    taskpagination.pageNo += 1
+    const taskId = selectTask.value.id
+    const { data, total, pageCount } = await getTaskDetailPictureList(workStore.activeId, taskId, { ...taskpagination, ...sortBy })
+    totalCount.value = total
+    canloadMore = pageCount >= taskpagination.pageNo && pageCount > 0
+
+    return data
+  }
+  catch (error) {
+    canloadMore = false
+    return []
+  }
+}
+
+const layout = debounce(() => {
+  if (el.value == null)
+    return
+
+  _imagesload = imagesloaded('.grid-item')
+
+  _imagesload.on('done', (instance) => {
+    if (!el.value)
+      return
+    const scrollHeight = el.value!.scrollHeight
+    const clientHeight = el.value!.clientHeight
+    const top = scrollHeight - clientHeight - 100
+    el.value!.scrollTo({ top, behavior: 'instant' })
+    loading.value = false
+  })
+
+  _imagesload.on('fail', (instance) => {
+    message.error('图片错误')
+    loading.value = false
+  })
+}, 300)
+
+onUpdated(() => {
+  layout()
+})
+
 watch(() => workStore.activeId, async (newValue, oldValue) => {
-  const taskId = workStore.getActiveId
+  const packageid = workStore.getActiveId
 
-  if (isEmpty(taskId))
+  if (isEmpty(packageid))
     return
 
   const res = await getPackageTaskList(newValue, packagepagination)
   const { data } = res
   taskList.value = data
-
   if (taskList.value.length > 0)
     handleSelect(taskList.value[0])
 })
@@ -208,21 +286,20 @@ async function handleSelect(item: any) {
   const taskId = item.id
   taskDetailInfo.value = await getTaskDetailInfo(taskId, workStore.activeId)
 
-  const { data, total } = await getTaskDetailPictureList(workStore.activeId, taskId, { ...taskpagination, ...sortBy })
-  taskDetailPictureList.value = data
-  totalCount.value = total
+  const packageid = workStore.getActiveId
+
+  if (isEmpty(packageid))
+    return
+
+  refreshHandler()
 }
 
 async function sortHandler(orderby: 'pictureResult' | 'fromuptime') {
   if (!selectTask.value)
     return
 
-  taskpagination.pageNo = 1
-  taskpagination.pageSize = 10
   sortBy.orderbyvalue = orderby
-
-  const res = await getTaskDetailPictureList(workStore.activeId, selectTask.value.id, { ...taskpagination, ...sortBy })
-  taskDetailPictureList.value = res.data
+  refreshHandler()
 }
 
 const propertys = computed(() => {
@@ -273,7 +350,7 @@ function getPercent(pictureid: string) {
   const index = ocpictureid.split(',').indexOf(String(pictureid))
   const results = pictureresult.split(',')
   const percent = results[index] || '0'
-  const val = Number.parseFloat(percent)
+  const val = Math.floor(Number.parseFloat(percent))
   return `${val}%`
 }
 
@@ -292,8 +369,6 @@ function previewHandler(event: MouseEvent) {
   if (imageRef.value)
     (imageRef.value as any).mergedOnClick()
 }
-
-const count = computed(() => taskDetailPictureList.value.length)
 </script>
 
 <template>
@@ -334,110 +409,115 @@ const count = computed(() => taskDetailPictureList.value.length)
         </div>
       </div>
     </div>
-    <div class="wrapper-detail">
-      <div
-        class="left" :style="{ 'background-image': `url(${taskDetailInfo?.ocrPicture?.imgurl})` }"
-        @click="previewHandler"
-      >
-        <div class="mark">
-          <SvgIcon v-show="taskDetailInfo?.iztrueorfalse === 0" size="128" name="jia" />
-        </div>
-        <div class="mark">
-          <SvgIcon v-show="taskDetailInfo?.iztrueorfalse === 1" size="128" name="zhen" />
-        </div>
-        <div class="info">
-          <n-grid x-gap="16" y-gap="0" :cols="12">
-            <n-gi span="4">
-              <span style="color:#8b8d8f;">
-                <SvgIcon name="m1" />
-              </span>
-            </n-gi>
-            <n-gi span="8" style="display: flex;align-items: left;flex-direction: column;justify-content: center;">
-              <span>{{ mark }}</span>
-              <span>图片标记</span>
-            </n-gi>
-            <n-gi span="4">
-              <span style="color:#8b8d8f;">
-                <SvgIcon name="m2" />
-              </span>
-            </n-gi>
-            <n-gi span="8" style="display: flex;align-items: left;flex-direction: column;justify-content: center;">
-              <span>{{ totalCount }}</span>
-              <span>相似匹配</span>
-            </n-gi>
-          </n-grid>
-        </div>
-        <div style="display: none;">
-          <n-image ref="imageRef" :img-props="{ onClick: hideDownload }" :src="taskDetailInfo?.ocrPicture?.imgurl" />
-        </div>
-      </div>
-      <div class="right">
-        <n-scrollbar style="max-height: 100%;">
-          <span class="name">图片名称</span>
-          <div class="tags">
-            <div class="tag tag-actived">
-              重复图片
+    <n-spin :show="loading">
+      <div ref="el" class="scroll">
+        <div class="wrapper-detail">
+          <div
+            class="left" :style="{ 'background-image': `url(${taskDetailInfo?.ocrPicture?.imgurl})` }"
+            @click="previewHandler"
+          >
+            <div class="mark">
+              <SvgIcon v-show="taskDetailInfo?.iztrueorfalse === 0" size="128" name="jia" />
             </div>
-            <div class="tag">
-              基线任务
+            <div class="mark">
+              <SvgIcon v-show="taskDetailInfo?.iztrueorfalse === 1" size="128" name="zhen" />
+            </div>
+            <div class="info">
+              <n-grid x-gap="16" y-gap="0" :cols="12">
+                <n-gi span="4">
+                  <span style="color:#8b8d8f;">
+                    <SvgIcon name="m1" />
+                  </span>
+                </n-gi>
+                <n-gi span="8" style="display: flex;align-items: left;flex-direction: column;justify-content: center;">
+                  <span>{{ mark }}</span>
+                  <span>图片标记</span>
+                </n-gi>
+                <n-gi span="4">
+                  <span style="color:#8b8d8f;">
+                    <SvgIcon name="m2" />
+                  </span>
+                </n-gi>
+                <n-gi span="8" style="display: flex;align-items: left;flex-direction: column;justify-content: center;">
+                  <span>{{ totalCount }}</span>
+                  <span>相似匹配</span>
+                </n-gi>
+              </n-grid>
+            </div>
+            <div style="display: none;">
+              <n-image ref="imageRef" :img-props="{ onClick: hideDownload }" :src="taskDetailInfo?.ocrPicture?.imgurl" />
             </div>
           </div>
-          <n-divider />
-          <div class="property">
-            <span class="property-name top" style="font-weight: bold;color: #333333;">拜访终端
-            </span>
-            <span style="font-weight: bold;color: #333333;font-size: 16px;">拜访终端</span>
-          </div>
-          <div v-for="(key) in Object.keys(propertys)" :key="key" class="property">
-            <span class="property-name">{{ fieldMap[key] }}</span>
-            <span class="property-content ">{{ propertys[key] }}</span>
+          <div class="right">
+            <n-scrollbar style="max-height: 100%;">
+              <span class="name">图片名称</span>
+              <div class="tags">
+                <div class="tag tag-actived">
+                  重复图片
+                </div>
+                <div class="tag">
+                  基线任务
+                </div>
+              </div>
+              <n-divider />
+              <div class="property">
+                <span class="property-name top" style="font-weight: bold;color: #333333;">拜访终端
+                </span>
+                <span style="font-weight: bold;color: #333333;font-size: 16px;">拜访终端</span>
+              </div>
+              <div v-for="(key) in Object.keys(propertys)" :key="key" class="property">
+                <span class="property-name">{{ fieldMap[key] }}</span>
+                <span class="property-content ">{{ propertys[key] }}</span>
+              </div>
+            </n-scrollbar>
           </div>
-        </n-scrollbar>
-      </div>
-    </div>
-    <div style="display: flex;justify-content: space-between;padding: 12px 0px;">
-      <div><span style="font-size: 21px;font-weight: bold;">相似图片</span><span>({{ count }})</span></div>
-      <div style="display: flex;align-items: center;" @click="sortHandler('fromuptime')">
-        <div style="cursor: pointer;">
-          <span>按时间排序</span>
-          <SvgIcon style="margin-left: 8px;" name="sort" size="12" />
         </div>
-        <div style="margin-left: 15px;cursor: pointer" @click="sortHandler('pictureResult')">
-          <span>相似度排序</span>
-          <SvgIcon style="margin-left: 8px;" name="sort" size="12" />
-        </div>
-      </div>
-    </div>
-    <div class="wrapper-list">
-      <div
-        v-for="(item, index) in taskDetailPictureList" :key="index" :class="{ 'item-selected': item === selectTask }"
-        class="item" @click="handleSelect(item)" @mouseover="overTaskHandelr(item)" @mouseleave="leaveTaskHandler"
-      >
-        <div class="img-wrapper" :style="{ 'background-image': `url(${item.imgurl})` }" />
-        <div class="check">
-          <n-checkbox
-            v-show="batch" v-model:checked="item.checked" @click.stop
-            @update:checked="onCheckChange($event, item)"
-          />
-        </div>
-        <div class="percent">
-          <SvgIcon size="42" name="tag" />
-          <div class="val">
-            {{ getPercent(item.pictureid) }}
+        <div style="display: flex;justify-content: space-between;padding: 12px 0px;">
+          <div><span style="font-size: 21px;font-weight: bold;">相似图片</span><span>({{ totalCount }})</span></div>
+          <div style="display: flex;align-items: center;">
+            <div style="cursor: pointer;" @click="sortHandler('fromuptime')">
+              <span>按时间排序</span>
+              <SvgIcon style="margin-left: 8px;" name="sort" size="12" />
+            </div>
+            <div style="margin-left: 15px;cursor: pointer" @click="sortHandler('pictureResult')">
+              <span>相似度排序</span>
+              <SvgIcon style="margin-left: 8px;" name="sort" size="12" />
+            </div>
           </div>
         </div>
-        <div class="mark">
-          <SvgIcon v-show="item.iztrueorfalse === 0" name="jia" />
-        </div>
-        <div class="mark">
-          <SvgIcon v-show="item.iztrueorfalse === 1" name="zhen" />
-        </div>
-        <div v-show="overTask && overTask.id === item.id" class="action">
-          <SvgIcon style="cursor: pointer;" name="t1" @click.stop="trueHandler" />
-          <SvgIcon style="cursor: pointer;" name="t2" @click.stop="falseHandler" />
+        <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.thumburl})` }" />
+            <div class="check">
+              <n-checkbox
+                v-show="batch" v-model:checked="item.checked" @click.stop
+                @update:checked="onCheckChange($event, item)"
+              />
+            </div>
+            <div class="percent">
+              <SvgIcon size="42" name="tag" />
+              <div class="val">
+                {{ getPercent(item.pictureid) }}
+              </div>
+            </div>
+            <div class="mark">
+              <SvgIcon v-show="item.iztrueorfalse === 0" name="jia" />
+            </div>
+            <div class="mark">
+              <SvgIcon v-show="item.iztrueorfalse === 1" name="zhen" />
+            </div>
+            <div v-show="overTask && overTask.id === item.id" class="action">
+              <SvgIcon style="cursor: pointer;" name="t1" @click.stop="trueHandler" />
+              <SvgIcon style="cursor: pointer;" name="t2" @click.stop="falseHandler" />
+            </div>
+          </div>
         </div>
       </div>
-    </div>
+    </n-spin>
     <ConfrimModal ref="confrimModalRef" @commit="setFalse" />
   </div>
 </template>
@@ -453,8 +533,11 @@ const count = computed(() => taskDetailPictureList.value.length)
   background: #FFF;
   border-radius: 3px;
   border: 1px solid rgb(239, 239, 245);
-  height: calc(100vh - 88px);
-  overflow-y: scroll;
+
+  .scroll {
+    height: calc(100vh - 88px - 72px);
+    overflow-y: scroll;
+  }
 
   &-header {
     display: flex;
@@ -635,7 +718,7 @@ const count = computed(() => taskDetailPictureList.value.length)
       background-color: #FFF;
     }
 
-    .item {
+    .grid-item {
       box-sizing: border-box;
       border-radius: 8px;
       padding: 9px 10px;