feat: 审核和排序后重新layout 调整布局

src/layout/components/Header/RecycleModal.vue

@@ -11,6 +11,7 @@ import { debounce } from 'lodash-es'
 
 import { audit } from '@/api/task/task'
 import NotPassed from '@/components/Approval/NotPassed.vue'
+import { formatToDateHMS } from '@/utils/dateUtil'
 import { off, on } from '@/utils/domUtils'
 import ConfrimModal from "./ConfrimModal.vue"
 
@@ -134,7 +135,7 @@ async function loadMore() {
 }
 
 onUpdated(() => {
-  console.log('onUpdated',onUpdated)
+  console.log('onUpdated', onUpdated)
   layout()
 })
 
@@ -243,6 +244,7 @@ async function showModal() {
   pagination.pageNo = 1
   const list = await featchList()
   listData.value = list
+  layout()
 }
 
 async function onChange() {
@@ -470,6 +472,23 @@ async function refreshHandler() {
                   <div :class="{ 'percent-red': item.similarityScore === 100 }" class="percent">
                     {{ item.similarityScore }}<span class="percent-unit">%</span>
                   </div>
+                  <div class="time" style="left: 25px;bottom: 15px;">
+                    <!-- <div class="time-item">
+                      <SvgIcon class="svg-time" color="#FFF" size="16" name="camera-time" />
+                      <span>{{ item?.photoDateTimestamp ?
+                        formatToDateHMS(Number(item.photoDateTimestamp)) : '-' }}</span>
+                    </div>
+                    <div class="time-item time-item2">
+                      <SvgIcon class="svg-time" color="#FFF" size="16" name="submit-time" />
+                      <span>{{ item.submitDateTimestamp ?
+                        formatToDateHMS(Number(item.submitDateTimestamp)) : '-' }}</span>
+                    </div> -->
+                    <div class="time-item">
+                      <SvgIcon class="svg-time" color="#FFF" size="16" name="time" />
+                      <span>{{ item.submitDateTimestamp ?
+                        formatToDateHMS(Number(item.submitDateTimestamp)) : '-' }}</span>
+                    </div>
+                  </div>
                 </div>
               </div>
               <!-- </n-scrollbar> -->
@@ -610,6 +629,9 @@ async function refreshHandler() {
       }
 
     }
+    .grid-item-selected {
+      background-color: #dae3ff;
+    }
 
     .percent {
       position: absolute;
@@ -632,14 +654,36 @@ async function refreshHandler() {
         margin-top: 4px;
       }
     }
+
     .percent-red {
       background: #ff4e4f;
     }
+    .time {
+        position: absolute;
+        z-index: 3;
+        left: 32px;
+        bottom: 32px;
 
-    .grid-item-selected {
+        .time-item {
-      background-color: #dae3ff;
+          display: flex;
+          align-items: center;
+          font-size: 14px;
+          font-family: PingFang SC, PingFang SC-Medium;
+          font-weight: 500;
+          color: #ffffff;
+          margin-bottom: 4px;
+        }
+
+        .time-item2 {
+          margin-bottom: 0;
         }
 
+        .svg-time {
+          margin-right: 5px;
+        }
+      }
+
+
     .scroll {
       overflow-y: auto;
       height: calc(100vh - 282px);
@@ -666,5 +710,4 @@ async function refreshHandler() {
     height: 100%;
     object-fit: cover;
   }
-}
+}</style>
-</style>