2023.9.x feature add per page resource list #1534
Conversation
| {{ getPagination }} | ||
| </div> | ||
|
|
||
| <div> |
There was a problem hiding this comment.
Where is the text like in recordList?
| @@ -282,6 +292,7 @@ export default { | |||
| return { | |||
| selected: [], | |||
| selectableItemIDs: [], | |||
| rowsPerPage: 10, | |||
| @@ -408,6 +433,11 @@ export default { | |||
| this.$router.replace({ query: { ...this.$route.query, page, pageCursor } }) | |||
| }, | |||
|
|
|||
| loadRows () { | |||
There was a problem hiding this comment.
You need to use the value you select, not the pagination limit
|
|
||
| <div> | ||
| <b-form-select | ||
| v-model="pagination.limit" |
There was a problem hiding this comment.
Dont v-modal pagination.limit, the value should be updated by the query.replace. You only pass the value here.
| <b-form-select | ||
| v-model="pagination.limit" | ||
| :options="perPageOptions" | ||
| @change="loadRows" |
There was a problem hiding this comment.
Lets call this by what it is please, like you did in recordList, onPerPageChange
| </div> | ||
|
|
||
| <div> | ||
| <b-form-select |
There was a problem hiding this comment.
This should be togglable in a prop.
You need to amend showFooter aswell just like you did in recordList. Try it with different options, how does it look and work.
| class="text-nowrap" | ||
| > | ||
| {{ getPagination }} | ||
| <div class="d-flex gap-1 align-items-center"> |
There was a problem hiding this comment.
It should wrap like recordList, styles should be similar. User shouldn't see a difference
| @@ -126,65 +126,72 @@ | |||
| </b-card-body> | |||
|
|
|||
| <template | |||
| v-if="showFooter" | |||
| @change="loadRows" | ||
| /> | ||
| <div class="d-flex flex-wrap gap-1 align-items-center"> | ||
| <div> |
There was a problem hiding this comment.
putting it in span means I have to add a block class to it which is the same as having a div imo
| @@ -433,8 +446,8 @@ export default { | |||
| this.$router.replace({ query: { ...this.$route.query, page, pageCursor } }) | |||
| }, | |||
|
|
|||
| loadRows () { | |||
| this.$router.replace({ query: { ...this.$route.query, page: 1, limit: this.pagination.limit } }) | |||
| lhandlePerPageChange (v) { | |||
| @@ -433,8 +446,8 @@ export default { | |||
| this.$router.replace({ query: { ...this.$route.query, page, pageCursor } }) | |||
| }, | |||
|
|
|||
| loadRows () { | |||
| this.$router.replace({ query: { ...this.$route.query, page: 1, limit: this.pagination.limit } }) | |||
| lhandlePerPageChange (v) { | |||
There was a problem hiding this comment.
call it limit so you dont have to define it as limit: v
| <b-form-select | ||
| :options="perPageOptions" | ||
| :value="pagination.limit" | ||
| style="width: 70px;" |
There was a problem hiding this comment.
Do we need this, if so why is it not in recordList?
EmmyMay
force-pushed
the
2023.9.x-feature-add-per-page-resource-list
branch
from
bf89e86
to
ad78724
Compare
| @@ -342,10 +384,11 @@ export default { | |||
|
|
|||
| hasNextPage () { | |||
| return !!this.pagination.nextPage | |||
|
|
|||
There was a problem hiding this comment.
Lint please, no need for this extra line and spaces
| }, | ||
|
|
||
| showFooter () { | ||
| return !(this.hideTotal && this.hidePagination) | ||
| return !(this.hideTotal && this.hidePagination && !this.hidePerPageOption) |
EmmyMay
force-pushed
the
2023.9.x-feature-add-per-page-resource-list
branch
from
0106d0b
to
c5caedd
Compare
|
One small thing in reporter, else all good: 
|
EmmyMay
force-pushed
the
2023.9.x-feature-add-per-page-resource-list
branch
from
c5caedd
to
a2972c4
Compare
The following changes are implemented
TODO: Summary
Changes in the user interface:
TODO: Add screenshots, recordings or remove this section
Checklist when submitting a final (!draft) PR
closes Add per page dropdown to resource lists #1497