Protei/PromucFlow_constructor
2
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

feat: add total records and pageCount to table header

Browse Source
This commit is contained in:
Tolulope Adetula 2022-04-06 12:48:55 +01:00
parent a6fe504768
commit 86ce80abc3
2 changed files with 24 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Binding/Bind_TableTextPagination_spec.js
View File

@ -73,6 +73,11 @@ describe("Test Create Api and Bind to Table widget", function() {
cy.wait(500);
cy.wait("@postExecute");
cy.wait(500);
cy.get(".show-page-items").should("contain", "20 Records");
cy.get(".page-item")
.next()
.should("contain", "of 2");
cy.get(".t--table-widget-next-page").should("not.have.attr", "disabled");
cy.ValidateTableData("1");

22
app/client/src/widgets/TableWidget/component/TableHeader.tsx
View File

@ -165,6 +165,11 @@ function TableHeader(props: TableHeaderProps) {
{props.isVisiblePagination && props.serverSidePaginationEnabled && (
<PaginationWrapper>
{props.totalRecordsCount ? (
<RowWrapper className="show-page-items">
{props.totalRecordsCount} Records
</RowWrapper>
) : null}
<PaginationItemWrapper
className="t--table-widget-prev-page"
disabled={props.pageNo === 0}
@ -174,9 +179,20 @@ function TableHeader(props: TableHeaderProps) {
>
<Icon color={Colors.HIT_GRAY} icon="chevron-left" iconSize={16} />
</PaginationItemWrapper>
<PaginationItemWrapper className="page-item" selected>
{props.pageNo + 1}
</PaginationItemWrapper>
{props.totalRecordsCount ? (
<RowWrapper>
Page{" "}
<PaginationItemWrapper className="page-item" selected>
{props.pageNo + 1}
</PaginationItemWrapper>{" "}
<span>{`of ${props.pageCount}`}</span>
</RowWrapper>
) : (
<PaginationItemWrapper className="page-item" selected>
{props.pageNo + 1}
</PaginationItemWrapper>
)}
<PaginationItemWrapper
className="t--table-widget-next-page"
disabled={