diff --git a/src/apis/equipment/approval.ts b/src/apis/equipment/approval.ts index 8ce061b..65d78e1 100644 --- a/src/apis/equipment/approval.ts +++ b/src/apis/equipment/approval.ts @@ -9,14 +9,38 @@ export const equipmentApprovalApi = { * 分页查询待审批的设备采购申请 */ getPendingApprovals(params: EquipmentApprovalListReq) { - return http.get('/equipment/approval/pending', params) + // 确保分页参数格式正确，与设备采购模块保持一致 + const requestParams = { + ...params, + // 直接使用 pageNum，因为后端分页器需要的是 pageNum 参数 + pageNum: params.pageNum || 1, + pageSize: params.pageSize || 10, + } + + console.log('🔍 API - equipmentApprovalApi.getPendingApprovals 被调用') + console.log('🔍 API - 接收到的参数:', params) + console.log('🔍 API - 最终请求参数:', requestParams) + + return http.get('/equipment/approval/pending', requestParams) }, /** * 分页查询已审批的设备采购申请 */ getApprovedApprovals(params: EquipmentApprovalListReq) { - return http.get('/equipment/approval/approved', params) + // 确保分页参数格式正确，与设备采购模块保持一致 + const requestParams = { + ...params, + // 直接使用 pageNum，因为后端分页器需要的是 pageNum 参数 + pageNum: params.pageNum || 1, + pageSize: params.pageSize || 10, + } + + console.log('🔍 API - equipmentApprovalApi.getApprovedApprovals 被调用') + console.log('🔍 API - 接收到的参数:', params) + console.log('🔍 API - 最终请求参数:', requestParams) + + return http.get('/equipment/approval/approved', requestParams) }, /** diff --git a/src/apis/equipment/procurement.ts b/src/apis/equipment/procurement.ts index cae4d71..dd8b3f6 100644 --- a/src/apis/equipment/procurement.ts +++ b/src/apis/equipment/procurement.ts @@ -20,8 +20,8 @@ export const equipmentProcurementApi = { // 确保参数格式正确 const requestParams = { ...params, - // 确保分页参数存在 - page: params.page || 1, + // 直接使用 pageNum，因为后端分页器需要的是 pageNum 参数 + pageNum: params.pageNum || 1, pageSize: params.pageSize || 10, } diff --git a/src/types/auto-imports.d.ts b/src/types/auto-imports.d.ts index eab6be6..369aad4 100644 --- a/src/types/auto-imports.d.ts +++ b/src/types/auto-imports.d.ts @@ -70,6 +70,6 @@ declare global { // for type re-export declare global { // @ts-ignore - export type { Component, ComponentPublicInstance, ComputedRef, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, VNode, WritableComputedRef } from 'vue' + export type { Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue' import('vue') } diff --git a/src/types/equipment.d.ts b/src/types/equipment.d.ts index 2e86b33..f5d7ca1 100644 --- a/src/types/equipment.d.ts +++ b/src/types/equipment.d.ts @@ -23,7 +23,7 @@ export interface EquipmentPageQuery { invoice?: string barcode?: string importer?: string - page?: number // 当前页码 - 与后端参数保持一致 + pageNum?: number // 当前页码 - 与后端分页器期望的参数名保持一致 pageSize?: number // 每页大小 orderBy?: string orderDirection?: string diff --git a/src/views/system-resource/device-management/approval/index.vue b/src/views/system-resource/device-management/approval/index.vue index 9de6c40..adf49b2 100644 --- a/src/views/system-resource/device-management/approval/index.vue +++ b/src/views/system-resource/device-management/approval/index.vue @@ -117,8 +117,9 @@ :columns="columns" :data="tableData" :loading="loading" - :pagination="pagination" + :pagination="false" row-key="approvalId" + :scroll="{ x: 'max-content', y: 400 }" @change="handleTableChange" > @@ -193,6 +194,23 @@ + + +
+ +
@@ -249,19 +267,7 @@ const pagination = reactive({ showPageSize: true, showJumper: true, showTotal: (total: number) => `共 ${total} 条记录`, - pageSizeOptions: [10, 20, 50, 100], // 添加分页条数选项 - onChange: (page: number, pageSize: number) => { - console.log('分页变化 - 页码:', page, '每页条数:', pageSize) - pagination.current = page - pagination.pageSize = pageSize - loadData(currentSearchParams.value) - }, - onPageSizeChange: (pageSize: number) => { - console.log('每页条数变化:', pageSize) - pagination.pageSize = pageSize - pagination.current = 1 // 重置到第一页 - loadData(currentSearchParams.value) - } + pageSizeOptions: [10, 20, 50, 100] }) // 弹窗控制 @@ -570,6 +576,21 @@ const handleTableChange = (pag: any) => { loadData(currentSearchParams.value || {}) } +// 分页变化处理 +const handlePageChange = (page: number) => { + console.log('页码变化:', page) + pagination.current = page + loadData(currentSearchParams.value || {}) +} + +// 每页条数变化处理 +const handlePageSizeChange = (pageSize: number) => { + console.log('每页条数变化:', pageSize) + pagination.pageSize = pageSize + pagination.current = 1 // 重置到第一页 + loadData(currentSearchParams.value || {}) +} + // 标签页变化 const handleTabChange = (key: string) => { activeTab.value = key @@ -799,6 +820,42 @@ onMounted(() => { color: var(--color-text-4); font-style: italic; } + + // 分页器容器样式 - 固定在表格下方 + .pagination-container { + position: sticky; + bottom: 0; + background: white; + padding: 16px 24px; + border-top: 1px solid var(--color-border); + display: flex; + justify-content: flex-end; + align-items: center; + z-index: 10; + box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06); + + .arco-pagination { + margin: 0; + + .arco-pagination-item { + border-radius: 6px; + margin: 0 4px; + + &.arco-pagination-item-active { + background: var(--color-primary); + border-color: var(--color-primary); + } + } + + .arco-pagination-size-changer { + margin-left: 16px; + } + + .arco-pagination-jumper { + margin-left: 16px; + } + } + } // 确保搜索区域有良好的对比度 .approval-search-container { diff --git a/src/views/system-resource/device-management/index.vue b/src/views/system-resource/device-management/index.vue index dafb746..7e731a2 100644 --- a/src/views/system-resource/device-management/index.vue +++ b/src/views/system-resource/device-management/index.vue @@ -117,9 +117,9 @@ :columns="columns" :data="tableData" :loading="loading" - :pagination="pagination" + :pagination="false" row-key="equipmentId" - :scroll="{ x: 'max-content', y: 500 }" + :scroll="{ x: 'max-content', y: 400 }" :bordered="false" :stripe="true" size="medium" @@ -209,6 +209,23 @@ + + +
+ +
@@ -262,33 +279,7 @@ const pagination = reactive({ // 确保分页器完全可见 hideOnSinglePage: false, // 分页器大小 - size: 'default', - // 分页器位置 - position: 'bottom', - // 分页事件处理 - onChange: (page: number, pageSize: number) => { - console.log('🔄 分页变化事件触发:', { page, pageSize }) - console.log('📊 变化前分页状态:', { - current: pagination.current, - pageSize: pagination.pageSize, - total: pagination.total - }) - - pagination.current = page - if (pageSize !== pagination.pageSize) { - pagination.pageSize = pageSize - pagination.current = 1 // 重置到第一页 - } - - console.log('📊 变化后分页状态:', { - current: pagination.current, - pageSize: pagination.pageSize, - total: pagination.total - }) - - console.log('🚀 开始重新加载数据...') - loadData(currentSearchParams.value) - } + size: 'default' }) // 弹窗控制 @@ -740,20 +731,20 @@ const handleTableChange = (pag: any) => { loadData(currentSearchParams.value) } -// 分页变化 - 已移至分页配置中处理 -// const handlePageChange = (page: number) => { -// console.log('页码变化:', page) -// pagination.current = page -// loadData(currentSearchParams.value) -// } +// 分页变化处理 +const handlePageChange = (page: number) => { + console.log('页码变化:', page) + pagination.current = page + loadData(currentSearchParams.value) +} -// 每页条数变化 - 已移至分页配置中处理 -// const handlePageSizeChange = (pageSize: number) => { -// console.log('每页条数变化:', pageSize) -// pagination.pageSize = pageSize -// pagination.current = 1 // 重置到第一页 -// loadData(currentSearchParams.value) -// } +// 每页条数变化处理 +const handlePageSizeChange = (pageSize: number) => { + console.log('每页条数变化:', pageSize) + pagination.pageSize = pageSize + pagination.current = 1 // 重置到第一页 + loadData(currentSearchParams.value) +} @@ -1132,28 +1123,39 @@ onMounted(() => { } } - // 分页样式优化 - .arco-pagination { - margin-top: 24px; - justify-content: center; - padding: 16px 0; + // 分页器容器样式 - 固定在表格下方 + .pagination-container { + position: sticky; + bottom: 0; + background: white; + padding: 16px 24px; + border-top: 1px solid var(--color-border); + display: flex; + justify-content: flex-end; + align-items: center; + z-index: 10; + box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06); - .arco-pagination-item { - border-radius: 6px; - margin: 0 4px; + .arco-pagination { + margin: 0; - &.arco-pagination-item-active { - background: var(--color-primary); - border-color: var(--color-primary); + .arco-pagination-item { + border-radius: 6px; + margin: 0 4px; + + &.arco-pagination-item-active { + background: var(--color-primary); + border-color: var(--color-primary); + } + } + + .arco-pagination-size-changer { + margin-left: 16px; + } + + .arco-pagination-jumper { + margin-left: 16px; } - } - - .arco-pagination-size-changer { - margin-left: 16px; - } - - .arco-pagination-jumper { - margin-left: 16px; } } diff --git a/src/views/system-resource/device-management/procurement/index.vue b/src/views/system-resource/device-management/procurement/index.vue index 2399f1e..b3f4431 100644 --- a/src/views/system-resource/device-management/procurement/index.vue +++ b/src/views/system-resource/device-management/procurement/index.vue @@ -116,9 +116,10 @@ :columns="columns" :data="tableData" :loading="loading" - :pagination="pagination" + :pagination="false" :row-selection="rowSelection" row-key="equipmentId" + :scroll="{ x: 'max-content', y: 400 }" @change="handleTableChange" > @@ -218,6 +219,23 @@ + + +
+ +
@@ -277,19 +295,7 @@ const pagination = reactive({ showPageSize: true, showJumper: true, showTotal: (total: number) => `共 ${total} 条记录`, - pageSizeOptions: [10, 20, 50, 100], // 添加分页条数选项 - onChange: (page: number, pageSize: number) => { - console.log('分页变化 - 页码:', page, '每页条数:', pageSize) - pagination.current = page - pagination.pageSize = pageSize - loadData(currentSearchParams.value) - }, - onPageSizeChange: (pageSize: number) => { - console.log('每页条数变化:', pageSize) - pagination.pageSize = pageSize - pagination.current = 1 // 重置到第一页 - loadData(currentSearchParams.value) - } + pageSizeOptions: [10, 20, 50, 100] }) // 弹窗控制 @@ -717,6 +723,21 @@ const handleTableChange = (pag: any) => { loadData(currentSearchParams.value) } +// 分页变化处理 +const handlePageChange = (page: number) => { + console.log('页码变化:', page) + pagination.current = page + loadData(currentSearchParams.value) +} + +// 每页条数变化处理 +const handlePageSizeChange = (pageSize: number) => { + console.log('每页条数变化:', pageSize) + pagination.pageSize = pageSize + pagination.current = 1 // 重置到第一页 + loadData(currentSearchParams.value) +} + // 新增 const handleAdd = () => { modalMode.value = 'add' @@ -1003,6 +1024,42 @@ onMounted(() => { color: var(--color-text-4); font-style: italic; } + + // 分页器容器样式 - 固定在表格下方 + .pagination-container { + position: sticky; + bottom: 0; + background: white; + padding: 16px 24px; + border-top: 1px solid var(--color-border); + display: flex; + justify-content: flex-end; + align-items: center; + z-index: 10; + box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06); + + .arco-pagination { + margin: 0; + + .arco-pagination-item { + border-radius: 6px; + margin: 0 4px; + + &.arco-pagination-item-active { + background: var(--color-primary); + border-color: var(--color-primary); + } + } + + .arco-pagination-size-changer { + margin-left: 16px; + } + + .arco-pagination-jumper { + margin-left: 16px; + } + } + } } // 响应式设计