feat: 主图审核后状态不刷新bug修复

src/views/worksheet/components/PictureWall.vue

@@ -334,10 +334,9 @@ onUnmounted(() => {
           <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">
+        <div class="percent" :class="{ 'percent-red': item?.maxSimilarity >= 100 }">
-          <SvgIcon size="42" name="tag" />
           <div class="val">
-            {{ item?.maxSimilarity && Number(item?.maxSimilarity).toFixed(0) }}%
+            {{ item?.maxSimilarity && Number(item?.maxSimilarity).toFixed(0) }}<span class="percent-unit">%</span>
           </div>
         </div>
 
@@ -417,29 +416,28 @@ onUnmounted(() => {
 
     .percent {
       position: absolute;
-      text-align: center;
+      display: flex;
-      z-index: 3;
+      align-items: center;
-      right: 17px;
+      justify-content: center;
-      top: 2px;
+      width: 35px;
+      height: 18px;
+      opacity: 0.9;
+      background: #6f92fd;
+      border-radius: 6px 0px 6px 0px;
+      z-index: 5;
+      right: 12px;
+      top: 15px;
       color: #fff;
+      font-size: 14px;
+    }
 
-      .val {
+    .percent-unit {
-        position: absolute;
+      font-size: 8px;
-        left: 0;
+      margin-top: 4px;
-        top: 0;
+    }
-        display: block;
+
-        width: 100%;
+    .percent-red {
-        height: 100%;
+      background: #ff4e4f;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        font-size: 12px;
-        font-family: PingFang SC, PingFang SC-Semibold;
-        font-weight: Semibold;
-        text-align: left;
-        color: #ffffff;
-        line-height: 24px;
-      }
     }
 
     .pass-status {

src/views/worksheet/content/Content.vue

@@ -71,6 +71,7 @@ const el = ref<HTMLDivElement | null>(null);
 const selectedSortName = ref('');
 const isFullScreen = ref(false);
 const notPassModalRef = ref(null)
+const mainImageModalRef = ref(null)
 
 let canloadMore = true;
 
@@ -272,7 +273,7 @@ function immersionHandler() {
 }
 
 function showAction() {
-  const item = taskDetailInfo.value;  
+  const item = taskDetailInfo.value;
   if (item.historyStates === 2 || item.historyStates === 3) {
     return
   }
@@ -294,12 +295,6 @@ function rejectHandler() {
   const modal = unref(notPassModalRef)! as any
   modal.showModal(selectItems.value)
 }
-function detailRejectHandler() {
-  const modal = unref(notPassModalRef)! as any
-  const params = cloneDeep(taskDetailInfo.value)
-  params.id = params.taskchildpictureid
-  modal.showModal([params])
-}
 
 function singleRejectHandler(item) {
   const modal = unref(notPassModalRef)! as any
@@ -320,22 +315,24 @@ function reject(idOrDesc: string, backId: string, isOther: boolean) {
 
   doAudit(param)
 }
-function detailApprovalHandler(items?: any){
+function handleRejectMainImage() {
+  const modal = unref(mainImageModalRef)! as any
+  const params = cloneDeep(taskDetailInfo.value)
+  params.id = params.taskchildpictureid
+  modal.showModal([params])
+}
+async function reloadDetailInfo(){
+  const packageid = workStore.getActiveId;
+  taskDetailInfo.value = await getTaskDetailInfo(packageid);
+}
+function handleApproveMainImage(items?: any) {
   let cloneItem: any
-  if (batch.value) {
+  if (overTask.value) {
-    processItems = selectItems.value
-  }
-  else if (overTask.value) {
     cloneItem = clone(overTask.value)
     cloneItem.id = cloneItem.taskchildpictureid
     processItems = [cloneItem]
   }
-  //  任务包图片 => 点击 => 通过/不通过按钮
-  if (items !== undefined && !(items instanceof PointerEvent))
-    processItems = [items]
-
   const msg = validate(processItems)
-
   if (msg !== null) {
     message.error(msg)
     return
@@ -366,7 +363,15 @@ function detailApprovalHandler(items?: any){
     positiveText: '确定',
     negativeText: '取消',
     onPositiveClick: () => {
-      doAudit(param)
+      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)
+      })
     },
     onNegativeClick: () => { },
   })
@@ -456,8 +461,8 @@ function reloadList() {
             批量审批
           </div>
           <div class="icon-wrap">
-            <SvgIcon size="20" v-if="isFullScreen" name="power-off" @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;"/>
+            <SvgIcon size="20" v-else name="immersion-model" @click="immersionHandler" style="cursor: pointer;" />
           </div>
         </div>
 
@@ -494,13 +499,15 @@ function reloadList() {
               <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') :
+                  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 === 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>
@@ -539,8 +546,8 @@ function reloadList() {
             </div>
             <!-- 操作 -->
             <div v-show="overTask && overTask.id === taskDetailInfo.id" class="action" @click.stop="hideAction">
-              <SvgIcon style="cursor: pointer" name="t1" @click.stop="detailApprovalHandler" />
+              <SvgIcon style="cursor: pointer" name="t1" @click.stop="handleApproveMainImage" />
-              <SvgIcon style="cursor: pointer; margin-left: 30px" name="t2" @click.stop="detailRejectHandler" />
+              <SvgIcon style="cursor: pointer; margin-left: 30px" name="t2" @click.stop="handleRejectMainImage" />
             </div>
           </div>
           <PictureInfo :taskDetailInfo="taskDetailInfo"></PictureInfo>
@@ -584,10 +591,10 @@ function reloadList() {
               </div>
             </div>
             <div class="check">
-              <n-checkbox v-show="batch && item.historyStates !== 2 && item.historyStates !== 3" v-model:checked="item.checked" @click.stop
+              <n-checkbox v-show="batch && item.historyStates !== 2 && item.historyStates !== 3"
-                @update:checked="onCheckChange($event, item)" />
+                v-model:checked="item.checked" @click.stop @update:checked="onCheckChange($event, item)" />
             </div>
-            <div class="percent" :class="{ 'percent-red': item?.maxSimilarity >= 100  }">
+            <div class="percent" :class="{ 'percent-red': item?.maxSimilarity >= 100 }">
               <div class="val">
                 {{ item?.maxSimilarity && Number(item?.maxSimilarity).toFixed(0) }}<span class="percent-unit">%</span>
               </div>
@@ -609,6 +616,7 @@ function reloadList() {
     </n-spin>
     <ConfrimModal ref="confrimModalRef" @commit="reject" />
     <NotPassed ref="notPassModalRef" @success="reloadList" />
+    <NotPassed ref="mainImageModalRef" @success="reloadDetailInfo" />
   </div>
 </template>
 
@@ -661,6 +669,7 @@ function reloadList() {
         margin-left: 6px;
       }
     }
+
     .right {
       display: flex;
       align-items: center;
@@ -919,6 +928,7 @@ function reloadList() {
         color: #507AFD;
         border: 1px solid #507AFD;
       }
+
       .tag-submiting {
         color: #FFB800;
         border: 1px solid #FFB800;
@@ -1034,11 +1044,13 @@ function reloadList() {
         color: #fff;
         font-size: 14px;
       }
+
       .percent-unit {
         font-size: 8px;
         margin-top: 4px;
       }
-      .percent-red{
+
+      .percent-red {
         background: #ff4e4f;
       }