Skip to content

Commit

Permalink
fix(table): wrong pagination meta on filter
Browse files Browse the repository at this point in the history
  • Loading branch information
jd-solanki committed Dec 26, 2022
1 parent bee54cd commit 2fb3963
Show file tree
Hide file tree
Showing 2 changed files with 34 additions and 6 deletions.
14 changes: 8 additions & 6 deletions packages/anu-vue/src/components/data-table/ADataTable.vue
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ const _tableProps = reactivePick(props, Object.keys(tableProps).filter(k => !['r
const _rows = ref<Record<string, unknown>[]>(typeof props.rows !== 'function' ? props.rows : [])
const serverTotal = ref(0)
const _total = computed(() => typeof props.rows === 'function' ? serverTotal.value : props.rows.length)
const _total = ref(typeof props.rows === 'function' ? serverTotal.value : props.rows.length)
// SECTION Calculate column
/*
Expand Down Expand Up @@ -130,6 +130,9 @@ const fetchRows = () => {
: col.name),
)
// Update total
_total.value = filteredRows.value.length
// Sort
const { results: sortedRows } = useSort(
filteredRows,
Expand Down Expand Up @@ -238,11 +241,10 @@ const renderHeaderRightSlot = (typeof props.search === 'boolean' && props.search
// 馃憠 Pagination meta
const paginationMeta = computed(() => {
const from = typeof props.rows === 'function'
? _rows.value.length
: props.rows.length
? (currentPage.value - 1) * currentPageSize.value + 1
: 0
const from = _rows.value.length
? (currentPage.value - 1) * currentPageSize.value + 1
: 0
const to = isLastPage.value
? _total.value
: currentPage.value * currentPageSize.value
Expand Down
26 changes: 26 additions & 0 deletions packages/anu-vue/test/ATable.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -89,4 +89,30 @@ describe('Testing ATable & ADataTable', async () => {
expect(upArrow.exists()).toBe(true)
expect(downArrow.exists()).toBe(true)
})

it('if we filter the rows pagination should show correct information', async () => {
const wrapper = mount(ADataTable, {
props: {
rows: nameList,
pageSize: 5,
search: true,
},
})

const pagination = wrapper.find('.a-data-table-pagination-meta')
const searchInput = wrapper.find('.a-card-typography-wrapper .a-input-input')

// check pagination
expect(pagination?.text()).toBe('1 - 5 of 10')

await searchInput.setValue('name1')

// check pagination
expect(pagination?.text()).toBe('1 - 2 of 2')

await searchInput.setValue('name4')

// check pagination
expect(pagination?.text()).toBe('1 - 1 of 1')
})
})

0 comments on commit 2fb3963

Please sign in to comment.