为清查、在线日志添加分页

src/services/assetsApi.js

@@ -546,7 +546,7 @@ export async function getOnlineStatistics(selectvalue) {
     const response = await fetch(`${API_BASE_URL}/Online_log`, {
       method: 'POST',
       headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
-      body: JformData.toString()
+      body: formData.toString()
     })
     if (!response.ok) throw new Error(`HTTP错误: ${response.status}`)
     return parseApiResponse(await response.text())

src/views/Admin/Business/StateAssetsMainView.vue

@@ -167,24 +167,37 @@
 
     <!-- 盘点日志弹窗 -->
     <el-dialog v-model="CheckLogDialogVisible" title="盘点日志" width="1000px">
-      <el-table :data="checkLogList" border>
-        <el-table-column prop="dwname" label="单位名称" show-overflow-tooltip/>
-        <el-table-column prop="optioner" label="操作人" width="80px"/>
-        <el-table-column prop="dtcount" label="当天已盘" width="90px"/>
-        <el-table-column prop="dtytcount" label="当天已贴" width="90px"/>
-        <el-table-column prop="pddate" label="日期" width="150px"/>
+      <el-table :data="checkLogPageData" border>
+        <el-table-column prop="dwname" label="单位名称" show-overflow-tooltip />
+        <el-table-column prop="optioner" label="操作人" width="80px" />
+        <el-table-column prop="dtcount" label="当天已盘" width="90px" />
+        <el-table-column prop="dtytcount" label="当天已贴" width="90px" />
+        <el-table-column prop="pddate" label="日期" width="150px" />
         <el-table-column label="最近盘点资产" show-overflow-tooltip>
           <template #default="{ row }">（{{ row.fixtureno }}）{{ row.name }}【{{ row.pdtype }}】</template>
         </el-table-column>
       </el-table>
+      <div style="display:flex; justify-content:center; margin-top: 12px;">
+        <el-pagination
+          v-model:current-page="checkLogPage"
+          :page-size="checkLogPageSize"
+          :total="checkLogList.length"
+          layout="total, prev, pager, next, jumper"
+          @current-change="handleCheckLogPageChange"
+        />
+      </div>
     </el-dialog>
 
     <!-- 在线统计弹窗 -->
-    <el-dialog v-model="OnlineStatisticsDialogVisible" title="在线统计" width="800px">
-      <el-table :data="onlineStatisticsList" border>
-        <el-table-column prop="dwname" label="单位名称" />
+    <el-dialog v-model="OnlineStatisticsDialogVisible" title="在线统计" width="1000px">
+      <el-tabs v-model="activeTab" @tab-click="handleTabClick">
+        <el-tab-pane label="在线" name="在线" />
+        <el-tab-pane label="全部" name="全部" />
+      </el-tabs>
+      <el-table :data="onlinePageData" border>
+        <el-table-column prop="dwname" label="单位名称" show-overflow-tooltip />
         <el-table-column prop="name" label="用户名" />
-        <el-table-column prop="ChineseName" label="姓名" />
+        <el-table-column prop="ChineseName" label="姓名" show-overflow-tooltip />
         <el-table-column label="登录时间">
           <template #default="{ row }">{{ new Date(row.logintime).toLocaleString() }}</template>
         </el-table-column>
@@ -193,12 +206,21 @@
         </el-table-column>
         <el-table-column prop="ipaddress" label="IP地址" />
       </el-table>
+      <div style="display:flex; justify-content:center; margin-top: 12px;">
+        <el-pagination
+          v-model:current-page="onlinePage"
+          :page-size="onlinePageSize"
+          :total="onlineStatisticsList.length"
+          layout="total, prev, pager, next, jumper"
+          @current-change="handleOnlinePageChange"
+        />
+      </div>
     </el-dialog>
   </div>
 </template>
 
 <script setup>
-import { ref, computed } from 'vue'
+import { ref, computed, nextTick } from 'vue'
 import { useRouter, useRoute } from 'vue-router'
 import { Fold, Expand, HomeFilled, Search, Document, DataAnalysis } from '@element-plus/icons-vue'
 import { searchUnits, updateUserRole, getRolesByUnit, getPersonalInfo, updatePersonalInfo, updatePassword, getCheckInfo, getOnlineStatistics } from '@/services/assetsApi'
@@ -424,18 +446,43 @@ const handleConfirmChangePassword = async () => {
 // ========== 盘点日志弹窗 ==========
 const CheckLogDialogVisible = ref(false)
 const checkLogList = ref([])
+const checkLogPage = ref(1)
+const checkLogPageSize = ref(10)
+const checkLogPageData = computed(() => {
+  const start = (checkLogPage.value - 1) * checkLogPageSize.value
+  return checkLogList.value.slice(start, start + checkLogPageSize.value)
+})
 
 const paddianLog = async () => {
   checkLogList.value = await getCheckInfo()
+  checkLogPage.value = 1
   CheckLogDialogVisible.value = true
 }
+const handleCheckLogPageChange = (p) => {
+  checkLogPage.value = p
+}
 
 // ========== 在线统计弹窗 ==========
 const OnlineStatisticsDialogVisible = ref(false)
 const onlineStatisticsList = ref([])
+const activeTab = ref('在线')
+const onlinePage = ref(1)
+const onlinePageSize = ref(10)
+const onlinePageData = computed(() => {
+  const start = (onlinePage.value - 1) * onlinePageSize.value
+  return onlineStatisticsList.value.slice(start, start + onlinePageSize.value)
+})
+
+const handleTabClick = (tab) => {
+  activeTab.value = tab.name
+  nextTick(() => {
+    onlineLog()
+  })
+}
 
 const onlineLog = async () => {
-  onlineStatisticsList.value = await getOnlineStatistics()
+  onlineStatisticsList.value = await getOnlineStatistics(activeTab.value)
+  onlinePage.value = 1
   OnlineStatisticsDialogVisible.value = true
 }
 </script>