From ac5aeb5c0511f1b861911dc66dbf54fd455dd1f5 Mon Sep 17 00:00:00 2001
From: liushilong <2224574157@qq.com>
Date: Sat, 30 Mar 2024 18:28:04 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20bug=E4=BF=AE=E5=A4=8D=EF=BC=8C=E5=AE=A1?=
 =?UTF-8?q?=E6=89=B9=E5=8F=B3=E4=BE=A7=E8=A1=A8=E6=A0=BC=E9=AB=98=E4=BA=AE?=
 =?UTF-8?q?=E5=B1=95=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/task/content/Content.vue        | 563 ++++++++++++----------
 src/views/task/content/TaskTable.vue      |  20 +-
 src/views/task/modal/CustomFieldModal.vue |   5 +-
 3 files changed, 314 insertions(+), 274 deletions(-)

diff --git a/src/views/task/content/Content.vue b/src/views/task/content/Content.vue
index 697b41a..357c89d 100644
--- a/src/views/task/content/Content.vue
+++ b/src/views/task/content/Content.vue
@@ -1,103 +1,103 @@
 <script lang="ts" setup>
-import { computed, onMounted, onUnmounted, reactive, ref, unref, watch } from 'vue'
-import { chunk, clone } from 'lodash-es'
-import { useDialog, useMessage } from 'naive-ui'
-import { useRoute } from 'vue-router'
-import BatchModal from '../modal/BatchModal.vue'
-import CustomSettingModal from '../modal/CustomSettingModal.vue'
-import PictureTable from './PictureTable.vue'
-import TaskTable from './TaskTable.vue'
-import History from './History.vue'
-import NotPassed from '@/components/Approval/NotPassed.vue'
-import { getAllfieldList, getfieldList } from '@/api/home/filter'
-import { TASK_STATUS_OBJ } from '@/enums/index'
-
-import { audit, dubiousfileyd, getSimilarityList, getTaskDetailInfo } from '@/api/task/task'
-import { useTask } from '@/store/modules/task'
-import { useUser } from '@/store/modules/user'
-import { isEmpty } from '@/utils'
-import { formatToDateHMS } from '@/utils/dateUtil'
-import { hideDownload } from '@/utils/image'
-
-const batch = ref(false)
-const selectItems = ref<any[]>([])
-const message = useMessage()
-const dialog = useDialog()
-const notPassModalRef = ref(null)
-const batchModalRef = ref(null)
-const totalCount = ref(0)
-const taskId: any = ref('') // 任务id
-const packageId: any = ref('') // 包id
-const CustomSettingModalRef = ref(null)
-const taskTableData = ref<any[]>([])
-const route = useRoute()
+import { computed, onMounted, onUnmounted, reactive, ref, unref, watch } from "vue";
+import { chunk, clone } from "lodash-es";
+import { useDialog, useMessage } from "naive-ui";
+import { useRoute } from "vue-router";
+import BatchModal from "../modal/BatchModal.vue";
+import CustomSettingModal from "../modal/CustomSettingModal.vue";
+import PictureTable from "./PictureTable.vue";
+import TaskTable from "./TaskTable.vue";
+import History from "./History.vue";
+import NotPassed from "@/components/Approval/NotPassed.vue";
+import { getAllfieldList, getfieldList } from "@/api/home/filter";
+import { TASK_STATUS_OBJ } from "@/enums/index";
+
+import {
+  audit,
+  dubiousfileyd,
+  getSimilarityList,
+  getTaskDetailInfo,
+} from "@/api/task/task";
+import { useTask } from "@/store/modules/task";
+import { useUser } from "@/store/modules/user";
+import { isEmpty } from "@/utils";
+import { formatToDateHMS } from "@/utils/dateUtil";
+import { hideDownload } from "@/utils/image";
+
+const batch = ref(false);
+const selectItems = ref<any[]>([]);
+const message = useMessage();
+const dialog = useDialog();
+const notPassModalRef = ref(null);
+const batchModalRef = ref(null);
+const totalCount = ref(0);
+const taskId: any = ref(""); // 任务id
+const packageId: any = ref(""); // 包id
+const CustomSettingModalRef = ref(null);
+const taskTableData = ref<any[]>([]);
+const route = useRoute();
 
 const sortBy: any = {
-  orderType: 'desc',
-  orderName: 'similarityScore',
-}
+  orderType: "desc",
+  orderName: "similarityScore",
+};
 
 function setBatch(value: boolean) {
-  if (totalCount.value === 0)
-    return
+  if (totalCount.value === 0) return;
 
-  batch.value = value
+  batch.value = value;
 
   if (value === false) {
-    selectItems.value.forEach(item => (item.checked = false))
-    selectItems.value.length = 0
-    selectItems.value.length = 0
+    selectItems.value.forEach((item) => (item.checked = false));
+    selectItems.value.length = 0;
+    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[] = [];
 
 onMounted(() => {
-  window.addEventListener('keydown', handleKeydown)
+  window.addEventListener("keydown", handleKeydown);
   if (route.query.id) {
-    taskId.value = route.query.id
-    packageId.value = route.query.packageid
-    getDetail()
+    taskId.value = route.query.id;
+    packageId.value = route.query.packageid;
+    getDetail();
   }
-})
+});
 
 // 键盘左右箭头快捷切换
 function handleKeydown(event) {
-  if (event.key === 'ArrowLeft')
-    backHandler()
+  if (event.key === "ArrowLeft") backHandler();
   // 在这里执行左箭头的逻辑
-  else if (event.key === 'ArrowRight')
-    forwardHandler()
+  else if (event.key === "ArrowRight") forwardHandler();
   // 在这里执行右箭头的逻辑
 }
 
 // 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
@@ -114,58 +114,56 @@ function validate(items: any[]) {
   //     return '审批人不一致'
   // }
 
-  return null
+  return null;
 }
 
 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: () => {},
-  })
+  });
 }
 
 function rejectHandler(items?: any) {
@@ -188,153 +186,157 @@ function rejectHandler(items?: any) {
   //   return
   // }
 
-  const modal = unref(notPassModalRef)! as any
-  modal.showModal(selectItems.value)
+  const modal = unref(notPassModalRef)! as any;
+  modal.showModal(selectItems.value);
 }
 
 function doAudit(param: any) {
   audit(param).then((res) => {
-    const { code } = res
-    setBatch(false)
-    if (code === 'OK') {
-      message.success('审核成功')
-      reloadList()
+    const { code } = res;
+    setBatch(false);
+    if (code === "OK") {
+      message.success("审核成功");
+      reloadList();
+    } else {
+      message.error(res.message);
     }
-
-    else { message.error(res.message) }
-  })
+  });
 }
 
 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();
 }
 
 async function handleDragEnd(event, item) {
   // 可以在这里添加拖拽结束后的逻辑
-  const flag = taskStore.getInFile
+  const flag = taskStore.getInFile;
   if (flag) {
-    const res = await dubiousfileyd({ pictureid: item.pictureid })
-    if (res.code === 'OK') {
-      message.success('加入成功')
-      getTableData()
+    const res = await dubiousfileyd({ pictureid: item.pictureid });
+    if (res.code === "OK") {
+      message.success("加入成功");
+      getTableData();
+    } else {
+      message.error(res.message);
     }
-    else {
-      message.error(res.message)
-    }
-    taskStore.setInFile(false)
+    taskStore.setInFile(false);
   }
 }
 
 async function getTableData() {
-  const useInfo = userStore.getUserInfo
-  const listData = []
-  const reviewType = 3 // 类型
-  let res = await getAllfieldList(reviewType)
-  const fieldList = (res as any)?.data
-  res = await getfieldList(reviewType, useInfo.id)
-  const userFieldList = (res as any)?.data.userFieldFixed
+  const useInfo = userStore.getUserInfo;
+  const listData = [];
+  const reviewType = 3; // 类型
+  let res = await getAllfieldList(reviewType);
+  const fieldList = (res as any)?.data;
+  res = await getfieldList(reviewType, useInfo.id);
+  const userFieldList = (res as any)?.data.userFieldFixed;
+  const blueList = [
+    "拜访终端名称",
+    "定位信息",
+    "拜访日期",
+    "定位距离",
+    "拜访小结",
+    "拜访项目类别",
+  ];
   fieldList.map((v) => {
     if (userFieldList.includes(v.name)) {
       const item = {
         label: v.fieldDesc,
         value: taskDetailInfo.value.ocrPicture[v.name],
         key: v.name,
-      }
-      listData.push(item)
+        blue: blueList.includes(v.fieldDesc),
+      };
+      listData.push(item);
     }
-  })
-  taskTableData.value = chunk(listData, 2)
+  });
+  taskTableData.value = chunk(listData, 2);
 }
 
 async function getImgList() {
   if (!isEmpty(taskDetailInfo.value.ocrPicture.id)) {
-    const { data, total } = await getSimilarityList(
-      {
-        ...taskpagination,
-        ...sortBy,
-        pictureId: taskDetailInfo.value.ocrPicture.id,
-      },
-    )
-    taskDetailPictureList.value = data
-    totalCount.value = total
-  }
-  else {
-    taskDetailPictureList.value.length = 0
-    totalCount.value = 0
+    const { data, total } = await getSimilarityList({
+      ...taskpagination,
+      ...sortBy,
+      pictureId: taskDetailInfo.value.ocrPicture.id,
+    });
+    taskDetailPictureList.value = data;
+    totalCount.value = total;
+  } else {
+    taskDetailPictureList.value.length = 0;
+    totalCount.value = 0;
   }
 }
 
 // 从store里面获取任务id
 const currentTaskId = computed(() => {
-  const index = taskStore.getCurrentIndex
-  return taskStore.getApprovalList[index]?.id || ''
-})
+  const index = taskStore.getCurrentIndex;
+  return taskStore.getApprovalList[index]?.id || "";
+});
 
 function overTaskHandle() {
-  const item = taskDetailInfo.value
+  const item = taskDetailInfo.value;
   if (item?.userapprove?.statshis === 2 || item?.userapprove?.statshis == 3) {
-    overTask.value = null
-    return
+    overTask.value = null;
+    return;
   }
 
-  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()
-  window.removeEventListener('keydown', handleKeydown)
-})
+  taskStore.reset();
+  window.removeEventListener("keydown", handleKeydown);
+});
 
 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).src)
-    (imageRef.value as any).mergedOnClick()
+    (imageRef.value as any).mergedOnClick();
 }
 
 watch(
   () => [taskStore.activeId],
   () => {
-    packageId.value = taskStore.getPackageid
-    taskId.value = taskStore.getActiveId
-    getDetail()
-  },
-)
+    packageId.value = taskStore.getPackageid;
+    taskId.value = taskStore.getActiveId;
+    getDetail();
+  }
+);
 
 // 获取数据
 async function getDetail() {
-  taskDetailInfo.value = await getTaskDetailInfo(taskId.value, packageId.value)
-  setBatch(false)
-  getTableData()
-  getImgList()
+  taskDetailInfo.value = await getTaskDetailInfo(taskId.value, packageId.value);
+  setBatch(false);
+  getTableData();
+  getImgList();
 }
 
 function reloadList() {
-  getDetail()
+  getDetail();
 }
 </script>
 
@@ -343,24 +345,11 @@ function reloadList() {
     <div class="wrapper-header">
       <div class="left">
         <span class="font">任务ID：{{ taskDetailInfo.fromtaskname }}</span>
-        <SvgIcon
-          size="22"
-          class="forward"
-          name="arrow-left"
-          @click="backHandler"
-        />
-        <SvgIcon
-          size="22"
-          class="back"
-          name="arrow-right"
-          @click="forwardHandler"
-        />
+        <SvgIcon size="22" class="forward" name="arrow-left" @click="backHandler" />
+        <SvgIcon size="22" class="back" name="arrow-right" @click="forwardHandler" />
       </div>
       <div class="right">
-        <div
-          v-show="!showActions"
-          style="display: flex; align-items: center"
-        >
+        <div v-show="!showActions" style="display: flex; align-items: center">
           <div class="btn" @click="setBatch(true)">
             <SvgIcon style="margin-right: 6px" size="22" name="batch" />
             批量审批
@@ -391,11 +380,7 @@ function reloadList() {
             </ul>
           </n-popover> -->
           <div class="icon-wrap">
-            <SvgIcon
-              size="20"
-              name="immersion-model"
-              @click="immersionHandler"
-            />
+            <SvgIcon size="20" name="immersion-model" @click="immersionHandler" />
           </div>
         </div>
         <div v-show="showActions" class="batch">
@@ -405,9 +390,19 @@ function reloadList() {
             </template>
             返回
           </n-button>
-          <img class="btn-approval btn-left" src="@/assets/images/task/btn-not-pass.png" alt="" @click.stop="rejectHandler">
+          <img
+            class="btn-approval btn-left"
+            src="@/assets/images/task/btn-not-pass.png"
+            alt=""
+            @click.stop="rejectHandler"
+          />
           <SvgIcon size="24" name="vs" />
-          <img class="btn-approval" src="@/assets/images/task/btn-pass.png" alt="" @click.stop="approvalHandler">
+          <img
+            class="btn-approval"
+            src="@/assets/images/task/btn-pass.png"
+            alt=""
+            @click.stop="approvalHandler"
+          />
         </div>
       </div>
     </div>
@@ -447,44 +442,50 @@ function reloadList() {
         </div>
 
         <div class="status">
-          <img v-show="taskDetailInfo?.userapprove?.statshis === 2" class="img-status" src="@/assets/images/task/pass.png" alt="">
-          <img v-show="taskDetailInfo?.userapprove?.statshis === 3" class="img-status" src="@/assets/images/task/not_pass.png" alt="">
+          <img
+            v-show="taskDetailInfo?.userapprove?.statshis === 2"
+            class="img-status"
+            src="@/assets/images/task/pass.png"
+            alt=""
+          />
+          <img
+            v-show="taskDetailInfo?.userapprove?.statshis === 3"
+            class="img-status"
+            src="@/assets/images/task/not_pass.png"
+            alt=""
+          />
         </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="big-mark" />
         <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?.userapprove?.statshis] }}</span>
+              <span class="value">{{
+                TASK_STATUS_OBJ[taskDetailInfo?.userapprove?.statshis]
+              }}</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>
@@ -492,11 +493,18 @@ function reloadList() {
         <div class="time">
           <div v-if="taskDetailInfo?.ocrPicture?.photoDateTimestamp" class="time-item">
             <SvgIcon class="svg-time" color="#FFF" size="16" name="camera-time" />
-            <span>{{ formatToDateHMS(Number(taskDetailInfo.ocrPicture.photoDateTimestamp) || 0) }}</span>
+            <span>{{
+              formatToDateHMS(Number(taskDetailInfo.ocrPicture.photoDateTimestamp) || 0)
+            }}</span>
           </div>
-          <div v-if="taskDetailInfo?.ocrPicture?.submitDateTimestamp" class="time-item time-item2">
+          <div
+            v-if="taskDetailInfo?.ocrPicture?.submitDateTimestamp"
+            class="time-item time-item2"
+          >
             <SvgIcon class="svg-time" color="#FFF" size="16" name="submit-time" />
-            <span>{{ formatToDateHMS(Number(taskDetailInfo.ocrPicture.submitDateTimestamp) || 0) }}</span>
+            <span>{{
+              formatToDateHMS(Number(taskDetailInfo.ocrPicture.submitDateTimestamp) || 0)
+            }}</span>
           </div>
         </div>
         <div style="display: none">
@@ -520,16 +528,16 @@ function reloadList() {
               />
             </div>
             <div class="list">
-              <div
-                v-for="(item) in taskDetailPictureList"
-                :key="item.id"
-                class="item"
-              >
+              <div v-for="item in taskDetailPictureList" :key="item.id" class="item">
                 <div
                   draggable="true"
                   class="img-wrapper"
                   :style="{ 'background-image': `url(${item.imgUrl})` }"
-                  @dragend="(event) => { handleDragEnd(event, item) }"
+                  @dragend="
+                    (event) => {
+                      handleDragEnd(event, item);
+                    }
+                  "
                 />
                 <div class="small-mark" />
                 <div class="check">
@@ -541,19 +549,36 @@ function reloadList() {
                   />
                 </div>
 
-                <img v-if="item.historyStates === 2" class="tag-status" src="@/assets/images/task/tag-pass.png" alt="">
-                <img v-if="item.historyStates === 3" class="tag-status" src="@/assets/images/task/tag-not-pass.png" alt="">
+                <img
+                  v-if="item.historyStates === 2"
+                  class="tag-status"
+                  src="@/assets/images/task/tag-pass.png"
+                  alt=""
+                />
+                <img
+                  v-if="item.historyStates === 3"
+                  class="tag-status"
+                  src="@/assets/images/task/tag-not-pass.png"
+                  alt=""
+                />
                 <div class="time">
                   <div v-if="item.photoDateTimestamp" class="time-item">
                     <SvgIcon class="svg-time" color="#FFF" size="8" name="camera-time" />
-                    <span>{{ formatToDateHMS(Number(item.photoDateTimestamp) || 0) }}</span>
+                    <span>{{
+                      formatToDateHMS(Number(item.photoDateTimestamp) || 0)
+                    }}</span>
                   </div>
                   <div v-if="item.submitDateTimestamp" class="time-item time-item2">
                     <SvgIcon class="svg-time" color="#FFF" size="8" name="submit-time" />
-                    <span>{{ formatToDateHMS(Number(item.submitDateTimestamp) || 0) }}</span>
+                    <span>{{
+                      formatToDateHMS(Number(item.submitDateTimestamp) || 0)
+                    }}</span>
                   </div>
                 </div>
-                <div :class="{ 'percent-red': item.similarityScore === 100 }" class="percent">
+                <div
+                  :class="{ 'percent-red': item.similarityScore === 100 }"
+                  class="percent"
+                >
                   {{ item.similarityScore }}<span class="percent-unit">%</span>
                 </div>
               </div>
@@ -566,7 +591,11 @@ function reloadList() {
 
     <n-tabs type="line" animated>
       <n-tab-pane name="task-info" tab="任务信息">
-        <TaskTable :data="taskDetailInfo" :task-table-data="taskTableData" @show-modal="showActionsModal" />
+        <TaskTable
+          :data="taskDetailInfo"
+          :task-table-data="taskTableData"
+          @show-modal="showActionsModal"
+        />
       </n-tab-pane>
       <n-tab-pane name="picture-info" tab="图片信息">
         <PictureTable :data="taskDetailInfo" />
@@ -576,12 +605,12 @@ function reloadList() {
       </n-tab-pane>
     </n-tabs>
     <NotPassed ref="notPassModalRef" @success="reloadList" />
-    <BatchModal
-      ref="batchModalRef"
-      @reject="rejectHandler"
-      @approval="approvalHandler"
+    <BatchModal ref="batchModalRef" @reject="rejectHandler" @approval="approvalHandler" />
+    <CustomSettingModal
+      ref="CustomSettingModalRef"
+      :review-type="3"
+      @on-ok="getTableData"
     />
-    <CustomSettingModal ref="CustomSettingModalRef" :review-type="3" @on-ok="getTableData" />
   </div>
 </template>
 
@@ -593,7 +622,7 @@ function reloadList() {
   color: #666666;
 }
 ::v-deep(.n-tabs-tab--active .n-tabs-tab__label) {
-  color: #507AFD;
+  color: #507afd;
   font-size: 16px;
   font-weight: 500;
 }
@@ -612,49 +641,48 @@ function reloadList() {
   }
 }
 
-.icon-wrap{
+.icon-wrap {
   display: flex;
   align-items: center;
   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;
 }
 
-.img-info{
-  .icon-status{
+.img-info {
+  .icon-status {
     width: 32px;
     height: 32px;
   }
 
-  .label{
+  .label {
     font-size: 11px;
     font-family: PingFang SC, PingFang SC-Medium;
     font-weight: 500;
     color: #ffffff;
   }
 
-  .value{
+  .value {
     font-size: 15px;
     font-family: PingFang SC, PingFang SC-Semibold;
     font-weight: 600;
     color: #ffffff;
   }
 
-  .num{
+  .num {
     font-size: 18px;
     font-family: PingFang SC, PingFang SC-Semibold;
     font-weight: 600;
     color: #ffffff;
   }
 
-  .unit{
+  .unit {
     font-size: 11px;
   }
-
 }
 .wrapper {
   display: flex;
@@ -717,13 +745,13 @@ function reloadList() {
         display: flex;
         align-items: center;
 
-        .btn-approval{
+        .btn-approval {
           width: 68px;
           height: 28px;
           cursor: pointer;
         }
 
-        .btn-left{
+        .btn-left {
           margin-left: 16px;
         }
       }
@@ -749,10 +777,15 @@ function reloadList() {
       border-radius: 8px;
       position: relative;
 
-      .big-mark{
+      .big-mark {
         width: 100%;
         height: 151px;
-        background: linear-gradient(180deg,rgba(0,0,0,0.00) 0%, rgba(0,0,0,0.00) 29%, rgba(3,0,0,0.73));
+        background: linear-gradient(
+          180deg,
+          rgba(0, 0, 0, 0) 0%,
+          rgba(0, 0, 0, 0) 29%,
+          rgba(3, 0, 0, 0.73)
+        );
         position: absolute;
         left: 0;
         bottom: 0;
@@ -806,7 +839,7 @@ function reloadList() {
         left: 16px;
         bottom: 16px;
 
-        .time-item{
+        .time-item {
           display: flex;
           align-items: center;
           font-size: 14px;
@@ -816,12 +849,12 @@ function reloadList() {
           margin-bottom: 4px;
         }
 
-        .time-item2{
+        .time-item2 {
           margin-bottom: 0;
         }
 
-        .svg-time{
-          margin-right: 5px
+        .svg-time {
+          margin-right: 5px;
         }
       }
 
@@ -837,20 +870,20 @@ function reloadList() {
         justify-content: center;
       }
 
-      .check{
+      .check {
         position: absolute;
         z-index: 3;
         left: 2%;
         top: 2%;
       }
 
-      .status{
+      .status {
         position: absolute;
         z-index: 3;
         left: 0;
         top: 0;
 
-        .img-status{
+        .img-status {
           width: 133px;
           height: 129px;
         }
@@ -859,12 +892,12 @@ function reloadList() {
 
     .right {
       flex: 0.5;
-      background: #F6F9FD;
+      background: #f6f9fd;
       border-radius: 8px;
       margin-left: 20px;
       padding: 24px;
 
-      .right-card{
+      .right-card {
         padding: 3px;
       }
 
@@ -893,10 +926,14 @@ function reloadList() {
         // overflow: hidden;
         margin: 0px 16px 27px 0px;
 
-        .small-mark{
+        .small-mark {
           width: 100%;
           height: 36px;
-          background: linear-gradient(180deg,rgba(0,0,0,0.01), rgba(0,0,0,0.44) 88%);
+          background: linear-gradient(
+            180deg,
+            rgba(0, 0, 0, 0.01),
+            rgba(0, 0, 0, 0.44) 88%
+          );
           border-radius: 0px 8px 8px 8px;
           position: absolute;
           left: 0;
@@ -904,7 +941,7 @@ function reloadList() {
           z-index: 0;
         }
 
-        .tag-status{
+        .tag-status {
           width: 46px;
           height: 22px;
           position: absolute;
@@ -917,7 +954,7 @@ function reloadList() {
           z-index: 3;
           left: 3px;
           bottom: 3px;
-          .time-item{
+          .time-item {
             display: flex;
             align-items: center;
             font-size: 10px;
@@ -928,12 +965,12 @@ function reloadList() {
             line-height: 12px;
           }
 
-          .time-item2{
+          .time-item2 {
             margin-bottom: 0;
           }
 
-          .svg-time{
-            margin-right: 5px
+          .svg-time {
+            margin-right: 5px;
           }
         }
 
@@ -973,12 +1010,12 @@ function reloadList() {
         font-size: 14px;
       }
 
-      .percent-unit{
+      .percent-unit {
         font-size: 8px;
-        margin-top: 4px
+        margin-top: 4px;
       }
 
-      .percent-red{
+      .percent-red {
         background: #ff4e4f;
       }
     }
diff --git a/src/views/task/content/TaskTable.vue b/src/views/task/content/TaskTable.vue
index a0d4a18..cda8791 100644
--- a/src/views/task/content/TaskTable.vue
+++ b/src/views/task/content/TaskTable.vue
@@ -1,4 +1,6 @@
 <script lang="ts" setup>
+import { ref, watch } from "vue";
+
 defineProps({
   data: {
     type: Object as PropType<any>,
@@ -8,19 +10,17 @@ defineProps({
     type: Array as any,
     default: () => [[]],
   },
-})
-const emit = defineEmits(['showModal'])
+});
+const emit = defineEmits(["showModal"]);
 function showActionsModal() {
-  emit('showModal')
+  emit("showModal");
 }
 </script>
 
 <template>
   <div class="info-header">
     <div class="left_box">
-      <div class="title">
-        填报信息
-      </div>
+      <div class="title">填报信息</div>
     </div>
     <div class="right_box" @click="showActionsModal">
       自定义设置
@@ -32,13 +32,13 @@ function showActionsModal() {
       <th v-if="item && item[0]">
         {{ item[0].label }}
       </th>
-      <td v-if="item && item[0]" :class="item.blue ? 'blue' : ''">
+      <td v-if="item && item[0]" :class="item[0].blue ? 'blue' : ''">
         {{ item[0].value }}
       </td>
       <th v-if="item && item.length > 1">
         {{ item[1].label }}
       </th>
-      <td v-if="item && item.length > 1" :class="item.blue ? 'blue' : ''">
+      <td v-if="item && item.length > 1" :class="item[1].blue ? 'blue' : ''">
         {{ item[1].value }}
       </td>
     </tr>
@@ -81,8 +81,8 @@ function showActionsModal() {
     font-family: PingFang SC, PingFang SC-Regular;
     color: #666666;
 
-    .icon{
-      margin-left: 7px
+    .icon {
+      margin-left: 7px;
     }
   }
 }
diff --git a/src/views/task/modal/CustomFieldModal.vue b/src/views/task/modal/CustomFieldModal.vue
index a0d9228..e92f8a0 100644
--- a/src/views/task/modal/CustomFieldModal.vue
+++ b/src/views/task/modal/CustomFieldModal.vue
@@ -251,7 +251,10 @@ function removeHandler(id: string) {
   let index = onList.value.findIndex((item) => {
     return item.id === id;
   });
-  if (index !== -1) onList.value.splice(index, 1);
+  if (index !== -1) {
+    onList.value.splice(index, 1);
+    onShowList.value.splice(index, 1);
+  }
 
   index = offList.value.findIndex((v) => v.id == id);
   offList.value[index].checked = false;