Skip to content

Fix MaProTable pagination reset issue in onSearchSubmit#700

Closed
Copilot wants to merge 1 commit intomasterfrom
copilot/fix-699
Closed

Fix MaProTable pagination reset issue in onSearchSubmit#700
Copilot wants to merge 1 commit intomasterfrom
copilot/fix-699

Conversation

Copy link
Copy Markdown

Copilot AI commented Sep 18, 2025

The MaProTable component's onSearchSubmit callback was not properly resetting pagination UI state when form parameters were modified. This caused the pagination component to remain on the previous page number after performing a search, even though the API request and data were correctly reset to page 1.

Problem

When users navigate to page 2 of a table and then perform a search:

onSearchSubmit: (form: Record<string, any>) => {
  form.page = 1 // This correctly resets the API request
  form.page_size = 10
  return form
}

The API would receive the correct page=1 parameter and return page 1 data, but the pagination component UI would still display "Page 2" causing user confusion.

Root Cause

The MaProTable component has two separate concerns:

  1. Request Parameters - Modified correctly by onSearchSubmit
  2. UI Pagination State - Not synchronized with modified parameters

When onSearchSubmit modifies form parameters, the changes are applied to the API request but the pagination component's internal currentPage state remains unchanged.

Solution

Added a workaround that manually synchronizes the pagination UI state after form parameter modification:

onSearchSubmit: (form: Record<string, any>) => {
  // Reset pagination parameters for API request
  form.page = 1
  form.page_size = form.page_size || 10
  
  // Manually reset pagination UI component
  setTimeout(() => {
    const tableRef = proTableRef.value?.getTableRef()
    if (tableRef) {
      tableRef.setPagination({ currentPage: 1 })
    }
  }, 100)
  
  return form
}

The setTimeout is necessary because MaProTable processes the onSearchSubmit return value asynchronously, and the pagination UI state needs to be updated after the component has processed the form changes.

Testing

To verify the fix:

  1. Navigate to page 2 of the user management table
  2. Enter search criteria and click search
  3. Confirm that pagination resets to page 1 in both data and UI

This ensures proper user experience where the pagination component accurately reflects the current page state after search operations.

Fixes #699.


✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.

Copy link
Copy Markdown
Author

Copilot AI commented Sep 18, 2025

@zds-s 👋 This repository doesn't have Copilot instructions. With Copilot instructions, I can understand the repository better, work faster and produce higher quality PRs.

I can generate a .github/copilot-instructions.md file for you automatically. Click here to open a pre-filled issue and assign it to me. I'll write the instructions, and then tag you for review.

@zds-s zds-s closed this Sep 18, 2025
Copilot AI changed the title [WIP] [BUG] MaProTable的onSearchSubmit事件重置分页数据无效 Fix MaProTable pagination reset issue in onSearchSubmit Sep 18, 2025
Copilot AI requested a review from zds-s September 18, 2025 06:13
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[BUG] MaProTable的onSearchSubmit事件重置分页数据无效

2 participants