fix: PC部分信息详情页表格无法分页fix

vue/src/views/baseSettings/institution/detail.vue

@@ -17,6 +17,9 @@
     </a-descriptions>
     <a-divider orientation="left">管理驿站 共计：{{ manageSiteList.length }}</a-divider>
     <a-table :columns="manageSitesTabColumns" :data-source="manageSiteList" :scroll="{ x:'100%', y: 200 }"
+             :pagination="manageSitesPagination"
+             :loading="manageSitesFormState.loading"
+             @change="manageSitesTableChange"
              bordered>
     </a-table>
     <a-divider orientation="left">其他信息</a-divider>
@@ -28,13 +31,16 @@
 </template>
 
 <script setup lang="ts">
-import {onMounted, reactive, ref} from "vue";
+import {computed, onMounted, reactive, ref} from "vue";
 import {getInstitutionByID} from "@/api/baseSettings/institution";
 import {getListByInstitutionID} from "@/api/baseSettings/siteInfo";
 import dayjs from "dayjs";
+import {getPaginationTotalTitle} from "@/utils/common";
+import type {TableProps} from "ant-design-vue";
 
 // 运营机构数据
 const institutionInfo = reactive({
+  institutionID: "",
   companyName: "",
   companyAddress: "",
   fzrName: "",
@@ -55,12 +61,23 @@ const manageSitesTabColumns = [
     title: '序号',
     align: "center",
     key: 'siteID',
-    customRender: item => `${pageParams.pageSize * (pageParams.pageIndex - 1) + item.index + 1}`
+    customRender: item => `${manageSitesPageParams.pageSize * (manageSitesPageParams.pageIndex - 1) + item.index + 1}`
   },
   {title: '驿站名称', dataIndex: 'siteName', key: 'siteName', align: "center"},
   {title: '驿站地址', dataIndex: 'detailAddress', key: 'detailAddress', align: "center"},
 ];
-const pageParams = reactive({
+const manageSitesPagination = computed(() => ({
+  total: manageSitesFormState.total,
+  current: manageSitesPageParams.pageIndex,
+  pageSize: manageSitesPageParams.pageSize,
+  showSizeChanger: true,
+  showTotal: total => getPaginationTotalTitle(total)
+}));
+const manageSitesFormState = reactive({
+  total: 0,
+  loading: false
+});
+const manageSitesPageParams = reactive({
   pageIndex: 1,
   pageSize: 10,
   institutionID: ''
@@ -80,12 +97,22 @@ function loadData(id: string) {
 
 // 获取关联驿站数据
 function getManageSites(id: string) {
-  pageParams.institutionID = id;
-  getListByInstitutionID(pageParams).then((result: any) => {
+  manageSitesPageParams.institutionID = id;
+  manageSitesFormState.loading = true;
+  getListByInstitutionID(manageSitesPageParams).then((result: any) => {
     manageSiteList.value = result.list;
+    manageSitesFormState.total = result.total;
+  }).finally(() => {
+    manageSitesFormState.loading = false;
   });
 }
 
+const manageSitesTableChange: TableProps['onChange'] = (pag: { pageSize: number; current: number },) => {
+  manageSitesPageParams.pageIndex = pag.current;
+  manageSitesPageParams.pageSize = pag.pageSize;
+  getManageSites(institutionInfo.institutionID);
+};
+
 
 // 页面初始化
 onMounted(() => {

vue/src/views/baseSettings/siteInfo/detail.vue

@@ -16,6 +16,7 @@
     <a-divider orientation="left">站点工作人员</a-divider>
     <a-table :columns="siteUserColumns" :data-source="siteUserList" :scroll="{ x:'100%', y: 200 }"
              :pagination="siteUserTabPagination"
+             :loading="siteUserTabFormState.loading"
              @change="siteUserTabChange"
              bordered>
     </a-table>
@@ -96,8 +97,12 @@ function loadData(siteID: any) {
 // 查询站点人员数据
 function findSiteUser(siteId: string) {
   siteUserSearchParams["siteID"] = siteId;
+  siteUserTabFormState.loading = true;
   getSiteUserList(siteUserSearchParams).then((result: any) => {
     siteUserList.value = result.list;
+    siteUserTabFormState.total = result.total;
+  }).finally(() => {
+    siteUserTabFormState.loading = false;
   });
 }
 

vue/src/views/baseSettings/siteUser/detail.vue

@@ -34,6 +34,7 @@
 <script setup lang="ts">
 import {onMounted, reactive, ref} from "vue";
 import {getSiteUserByID} from "@/api/baseSettings/userInfo";
+import BUploadFile from "@/components/file/uploadFile.vue";
 
 // 站点人员信息
 const siteUserInfo = reactive({

vue/src/views/taskAndLog/dotask/detail.vue

@@ -9,11 +9,13 @@
         }}
       </a-descriptions-item>
       <a-descriptions-item label="所属县区">{{ taskInfo.regionName }}</a-descriptions-item>
-      <!--      <a-descriptions-item :span="2" label="所属街道">{{ taskInfo.streetName }}</a-descriptions-item>-->
       <a-descriptions-item label="任务内容">{{ taskInfo.workContent }}</a-descriptions-item>
     </a-descriptions>
     <a-divider orientation="left">任务执行人员 共计：{{ userData.length }}</a-divider>
     <a-table :columns="columns" :data-source="userData"
+             :pagination="taskUserTabPagination"
+             :loading="taskUserFormState.loading"
+             @change="taskUserTabChange"
              bordered>
       <template #bodyCell="{ column ,index}">
         <template v-if="column.key === 'siteUserName'">
@@ -42,11 +44,12 @@
 </template>
 
 <script lang="ts" setup>
-import {onMounted, reactive, ref} from "vue";
+import {computed, onMounted, reactive, ref} from "vue";
 import {getDataById, getWorkUserList} from "@/api/taskAndLog/dotask";
-import type {TableColumnsType} from "ant-design-vue";
+import type {TableColumnsType, TableProps} from "ant-design-vue";
 import BUploadFile from "@/components/file/uploadFile.vue";
 import dayjs from "dayjs";
+import {getPaginationTotalTitle} from "@/utils/common";
 
 // 任务信息
 const taskInfo = reactive({
@@ -88,15 +91,33 @@ const columns: TableColumnsType = [
     title: '执行情况', dataIndex: 'taskStatusName', key: 'taskStatusName', align: "center", width: 120
   },
 ]
+const taskUserTabFormState = reactive({
+  total: 0,
+  loading: false
+});
+const taskUserTabPagination = computed(() => ({
+  total: taskUserTabFormState.total,
+  current: searchParams.pageIndex,
+  pageSize: searchParams.pageSize,
+  showSizeChanger: true,
+  showTotal: total => getPaginationTotalTitle(total)
+}));
+const taskUserFormState = reactive({
+  total: 0,
+  loading: false
+});
 // 文件列表
 const fileList = ref();
 
 // 人员列表加载
 function loadUserData(id: any) {
+  taskUserFormState.loading = true;
   getWorkUserList(id).then(data => {
     if (data) {
       userData.value = data;
     }
+  }).finally(() => {
+    taskUserFormState.loading = false;
   });
 }
 
@@ -114,6 +135,13 @@ const setFileList = (files) => {
   fileList.value = files;
 };
 
+// 站点人员表格变更
+const taskUserTabChange: TableProps['onChange'] = (pag: { pageSize: number; current: number },) => {
+  searchParams.pageIndex = pag.current;
+  searchParams.pageSize = pag.pageSize;
+  loadUserData(taskInfo.doTaskID);
+};
+
 // 页面初始化
 onMounted(() => {
   const id = history.state.params?.id;