format

src/components/device-page/device-card/history-diag-card/device-alarm-history-diag-card.vue

@@ -41,7 +41,7 @@ const tableColumns: DataTableColumns<NdmDeviceAlarmLogResultVO> = [
 
 const tableData = ref<DataTableRowData[]>([]);
 const DEFAULT_PAGE_SIZE = 10;
-const tablePagination = reactive<PaginationProps>({
+const pagination = reactive<PaginationProps>({
   size: 'small',
   showSizePicker: true,
   page: 1,
@@ -52,12 +52,12 @@ const tablePagination = reactive<PaginationProps>({
     return h('div', {}, { default: () => `共${itemCount}条` });
   },
   onUpdatePage: (page: number) => {
-    tablePagination.page = page;
+    pagination.page = page;
     getDeviceAlarmLogList();
   },
   onUpdatePageSize: (pageSize: number) => {
-    tablePagination.pageSize = pageSize;
+    pagination.pageSize = pageSize;
-    tablePagination.page = 1;
+    pagination.page = 1;
     getDeviceAlarmLogList();
   },
 });
@@ -68,8 +68,8 @@ const { mutate: getDeviceAlarmLogList, isPending } = useMutation({
     const alarmDate_ge = dateTimeRange.value[0];
     const alarmDate_le = dateTimeRange.value[1];
     const restParams: Omit<PageParams<{ id: string }>, 'model' | 'extra'> = {
-      current: tablePagination.page ?? 1,
+      current: pagination.page ?? 1,
-      size: tablePagination.pageSize ?? DEFAULT_PAGE_SIZE,
+      size: pagination.pageSize ?? DEFAULT_PAGE_SIZE,
       sort: 'id',
       order: 'descending',
     };
@@ -81,8 +81,8 @@ const { mutate: getDeviceAlarmLogList, isPending } = useMutation({
     return res;
   },
   onSuccess: ({ records, size, total }) => {
-    tablePagination.pageSize = parseInt(size);
+    pagination.pageSize = parseInt(size);
-    tablePagination.itemCount = parseInt(total);
+    pagination.itemCount = parseInt(total);
     tableData.value = records;
   },
   onError: (error) => {
@@ -94,8 +94,8 @@ const { mutate: getDeviceAlarmLogList, isPending } = useMutation({
 defineExpose({
   isPending,
   refresh: () => {
-    tablePagination.page = 1;
+    pagination.page = 1;
-    tablePagination.pageSize = DEFAULT_PAGE_SIZE;
+    pagination.pageSize = DEFAULT_PAGE_SIZE;
     getDeviceAlarmLogList();
   },
 });
@@ -103,7 +103,7 @@ defineExpose({
 
 <template>
   <NCard size="small" title="设备告警记录">
-    <NDataTable size="small" :loading="isPending" :columns="tableColumns" :data="tableData" :pagination="tablePagination" :single-line="false" remote flex-height style="height: 500px" />
+    <NDataTable size="small" :loading="isPending" :columns="tableColumns" :data="tableData" :pagination="pagination" :single-line="false" remote flex-height style="height: 500px" />
   </NCard>
 </template>
 

src/components/device-page/device-card/history-diag-card/device-status-history-diag-card.vue

@@ -44,7 +44,7 @@ const icmpLogList = ref<NdmIcmpLogResultVO[]>([]);
 const predecessorItem = ref<NdmIcmpLogResultVO>();
 
 const DEFAULT_PAGE_SIZE = 6;
-const timelinePagination = reactive<PaginationProps>({
+const pagination = reactive<PaginationProps>({
   size: 'small',
   showSizePicker: true,
   page: 1,
@@ -55,12 +55,12 @@ const timelinePagination = reactive<PaginationProps>({
     return h('div', {}, { default: () => `共${itemCount}条` });
   },
   onUpdatePage: (page: number) => {
-    timelinePagination.page = page;
+    pagination.page = page;
     getDeviceIcmpLogList();
   },
   onUpdatePageSize: (pageSize: number) => {
-    timelinePagination.pageSize = pageSize;
+    pagination.pageSize = pageSize;
-    timelinePagination.page = 1;
+    pagination.page = 1;
     getDeviceIcmpLogList();
   },
 });
@@ -71,8 +71,8 @@ const { mutate: getDeviceIcmpLogList, isPending } = useMutation({
     const createdTime_precisest = dayjs(dateTimeRange.value[0]).format('YYYY-MM-DD HH:mm:ss');
     const createdTime_preciseed = dayjs(dateTimeRange.value[1]).format('YYYY-MM-DD HH:mm:ss');
     const restParams: Omit<PageParams<{ id: string }>, 'model' | 'extra'> = {
-      current: timelinePagination.page ?? 1,
+      current: pagination.page ?? 1,
-      size: timelinePagination.pageSize ?? DEFAULT_PAGE_SIZE,
+      size: pagination.pageSize ?? DEFAULT_PAGE_SIZE,
       sort: 'id',
       order: 'descending',
     };
@@ -82,19 +82,19 @@ const { mutate: getDeviceIcmpLogList, isPending } = useMutation({
       ...restParams,
     });
     let previousPageRes: PageResult<Partial<NdmIcmpLogVO>> | undefined = undefined;
-    if ((timelinePagination.page ?? 1) > 1) {
+    if ((pagination.page ?? 1) > 1) {
       previousPageRes = await postIcmpLogPage(stationCode.value, {
         model: { deviceId: id },
         extra: { createdTime_precisest, createdTime_preciseed },
         ...restParams,
-        current: (timelinePagination.page ?? 1) - 1,
+        current: (pagination.page ?? 1) - 1,
       });
     }
     return { currentPageRes, previousPageRes };
   },
   onSuccess: ({ currentPageRes: { records, size, total }, previousPageRes }) => {
-    timelinePagination.pageSize = parseInt(size);
+    pagination.pageSize = parseInt(size);
-    timelinePagination.itemCount = parseInt(total);
+    pagination.itemCount = parseInt(total);
     icmpLogList.value = records;
     predecessorItem.value = previousPageRes?.records.at(-1);
   },
@@ -128,8 +128,8 @@ const timelineItems = computed<TimelineItemProps[]>(() => {
 defineExpose({
   isPending,
   refresh: () => {
-    timelinePagination.page = 1;
+    pagination.page = 1;
-    timelinePagination.pageSize = DEFAULT_PAGE_SIZE;
+    pagination.pageSize = DEFAULT_PAGE_SIZE;
     getDeviceIcmpLogList();
   },
 });
@@ -147,14 +147,14 @@ defineExpose({
     </NScrollbar>
     <template #footer>
       <NPagination
-        v-model:page="timelinePagination.page"
+        v-model:page="pagination.page"
-        v-model:page-size="timelinePagination.pageSize"
+        v-model:page-size="pagination.pageSize"
-        :page-sizes="timelinePagination.pageSizes"
+        :page-sizes="pagination.pageSizes"
-        :item-count="timelinePagination.itemCount"
+        :item-count="pagination.itemCount"
         size="small"
         show-size-picker
-        @update-page="timelinePagination.onUpdatePage"
+        @update-page="pagination.onUpdatePage"
-        @update:page-size="timelinePagination.onUpdatePageSize"
+        @update:page-size="pagination.onUpdatePageSize"
       />
     </template>
   </NCard>