优化ID卡

src/pages/Index/Regular/Running.vue

@@ -1195,6 +1195,9 @@ const updateStartTimes = () => {
 
 // 计算剩余时间
 const getRemainingTime = (plate: Subtank) => {
+  if(!plate.projId){
+    return;
+  }
   const startTime = startTimes.value[plate.pos] || Date.now()
   const elapsed = (Date.now() - startTime) / 1000 // 已经过的秒数
   const remaining = Math.max(0, plate.incubatedTimeSec - elapsed) // 剩余时间，最小为0

src/pages/Index/components/Consumables/IdCardInfo.vue

@@ -26,7 +26,7 @@
               </tr>
             </thead>
             <tbody>
-              <tr v-for="(item, index) in currentData" :key="index" :class="{
+              <tr v-for="(item, index) in tableData" :key="index" :class="{
                 'odd-row': index % 2 !== 0,
                 'even-row': index % 2 === 0,
               }">
@@ -57,7 +57,7 @@
               :class="{ active: page === currentPage }">
               {{ page === '...' ? '...' : page }}
             </button>
-            <button @click="nextPage" :disabled="currentPage === totalPages">
+            <button @click="nextPage" :disabled="currentPage === totalPage">
               下一页
             </button>
           </div>
@@ -100,6 +100,8 @@ const props = defineProps({
 const emit = defineEmits(['update:modelValue'])
 const pageSizeList:number[] = [5,10,20]
 const visible = ref(props.modelValue)
+//总条数
+let totalPage = ref(0)
 watch(
   () => props.modelValue,
   (newVal) => {
@@ -129,6 +131,7 @@ const cancelDelete = () => {
 }
 
 // 获取 id 卡信息
+
 const getCardList = async () => {
   const params = {
     pageNum: currentPage.value,
@@ -140,13 +143,21 @@ const getCardList = async () => {
   }
   tableData.value = res.data.list
   totalItems.value = res.data.list.length
+  totalPage.value = res.data.totalPage;
+  console.log('tableData.value===', tableData.value)
 }
 
 // 初始化获取信息
 onMounted(() => {
   getCardList()
 })
-const handleCancel = () => emit('update:modelValue', false)
+const handleCancel = () => {
+  currentPage.value = 1
+  tableData.value = []
+  totalPage.value = 0
+  totalItems.value = 0
+  emit('update:modelValue', false)
+}
 
 // 确认操作时输出已选中的项目
 const handleConfirm = () => {
@@ -168,17 +179,18 @@ const prevPage = () => {
   if (currentPage.value > 1) currentPage.value--
 }
 const nextPage = () => {
-  if (currentPage.value < totalPages.value) currentPage.value++
+  if (currentPage.value < totalPage.value) currentPage.value++
+
 }
 const goToPage = (page: any) => {
   if (page !== '...') currentPage.value = page
 }
 
 const formatDate = (date: any) => new Date(date).toLocaleDateString()
-const currentData = computed(() => {
-  const start = (currentPage.value - 1) * pageSize.value
-  return tableData.value.slice(start, start + pageSize.value)
-})
+// const currentData = computed(() => {
+//   const start = (currentPage.value - 1) * pageSize.value
+//   return tableData.value.slice(start, start + pageSize.value)
+// })
 
 // 显示的页码按钮逻辑
 const displayedPages = computed(() => {
@@ -202,7 +214,7 @@ const displayedPages = computed(() => {
 // 切换全选状态
 const toggleSelectAll = () => {
   if (selectAll.value) {
-    selectedItems.value = [...currentData.value]
+    selectedItems.value = [...tableData.value]
   } else {
     selectedItems.value = []
   }
@@ -210,7 +222,13 @@ const toggleSelectAll = () => {
 
 // 监听选中项的变化，更新全选状态
 watch(selectedItems, (newSelection) => {
-  selectAll.value = newSelection.length === currentData.value.length
+  selectAll.value = newSelection.length === tableData.value.length
+})
+
+//监听页数变化
+watch(currentPage, ()=>{
+  console.log('currentPage---', currentPage)
+  getCardList()
 })
 
 // 处理页大小变化

src/pages/Index/components/Consumables/MoveLiquidArea.vue

@@ -170,7 +170,7 @@
       </div>
     </div>
   </div>
-  <IdCardInfo v-model="visible"></IdCardInfo>
+  <IdCardInfo v-model="visible" v-if="visible"></IdCardInfo>
 </template>
 
 <script setup lang="ts">