QT/superset2
1
0
Fork 0
mirror of https://github.com/apache/superset.git synced 2026-04-19 16:14:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

Move pagination outside of table (#16232)

Browse Source
This commit is contained in:
Geido
2021-08-16 16:43:49 +02:00
committed by GitHub
parent 3709131089
commit 22231addec
1 changed files with 43 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

79
superset-frontend/src/components/TableView/TableView.tsx
View File

@@ -63,7 +63,7 @@ const TableViewStyles = styled.div<{
${({ scrollTable, theme }) =>
scrollTable &&
`
height: 380px;
height: 300px;
margin-bottom: ${theme.gridUnit * 4}px;
overflow: auto;
`}
@@ -88,22 +88,24 @@ const TableViewStyles = styled.div<{
`${theme.gridUnit - 2}px solid ${theme.colors.grayscale.light2}`};
${({ small }) => small && `padding-bottom: 0;`}
}
`;
.pagination-container {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background-color: ${({ theme }) => theme.colors.grayscale.light5};
const PaginationStyles = styled.div<{
isPaginationSticky?: boolean;
}>`
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background-color: ${({ theme }) => theme.colors.grayscale.light5};
${({ isPaginationSticky }) =>
isPaginationSticky &&
`
${({ isPaginationSticky }) =>
isPaginationSticky &&
`
position: sticky;
bottom: 0;
left: 0;
`};
}
.row-count-container {
margin-top: ${({ theme }) => theme.gridUnit * 2}px;
@@ -191,30 +193,35 @@ const TableView = ({
const isEmpty = !loading && content.length === 0;
return (
<TableViewStyles {...props}>
<TableCollection
getTableProps={getTableProps}
getTableBodyProps={getTableBodyProps}
prepareRow={prepareRow}
headerGroups={headerGroups}
rows={content}
columns={columns}
loading={loading}
/>
{isEmpty && (
<EmptyWrapperComponent>
{noDataText ? (
<Empty
image={Empty.PRESENTED_IMAGE_SIMPLE}
description={noDataText}
/>
) : (
<Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
)}
</EmptyWrapperComponent>
)}
<>
<TableViewStyles {...props}>
<TableCollection
getTableProps={getTableProps}
getTableBodyProps={getTableBodyProps}
prepareRow={prepareRow}
headerGroups={headerGroups}
rows={content}
columns={columns}
loading={loading}
/>
{isEmpty && (
<EmptyWrapperComponent>
{noDataText ? (
<Empty
image={Empty.PRESENTED_IMAGE_SIMPLE}
description={noDataText}
/>
) : (
<Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
)}
</EmptyWrapperComponent>
)}
</TableViewStyles>
{pageCount > 1 && withPagination && (
<div className="pagination-container">
<PaginationStyles
className="pagination-container"
isPaginationSticky={props.isPaginationSticky}
>
<Pagination
totalPages={pageCount || 0}
currentPage={pageCount ? pageIndex + 1 : 0}
@@ -232,9 +239,9 @@ const TableView = ({
)}
</div>
)}
</div>
</PaginationStyles>
)}
</TableViewStyles>
</>
);
};