0.0.6 • Published 2 years ago
Share package Dynamic table with paging and sorting for interface paginatingAndSorting of Spring Boot or other aplication with same params. see dataTable example Parameters dataTable = {dataTableProperties} onChange = (resp: {order: string, page: number,sort: string}) => void
dataTable properties Name Type Required Description content Array<{[key: string]: any}>Not JSONs array to populate the table. maxItemsShow numberNot Maximum amount of items (pages) to show in the pagination. Default 3. number numberYes Number of the current page showLastedAndFirst booleanNot Allows to show or not the buttons to go back "«" and forward "»" the next X amount of pages. Default true showPagination booleanNot Allows to show or not show pagination. Default true titles Array<TitleTableProps>Yes Titles for table columns. totalPages numberYes Total pages.
dataTable example {
"content":[
{"id": 1,
"name": "name1",
"address": {
"city": "ciudad1",
"State": "State1",
"Country": "Country1"
}}...
],
"number":0,
"totalPages":10,
"titles":[
...
]
}
Titles properties (TitleTableProps) Name Type Required Description sort stringNot Base text string to return when sorting a column, if not sent, the options in that column are hidden. name string or Array<string>Yes, if you don't send sort Key to locate the value to show in the column. If it's a nested value, the keys are separated by a period. If you want to concatenate values in a column, the keys are sent in an array. title anyYes Title to show Columns in the table.
Titles example {"titles":[
{
"title":"ID",
"sort":"id"
},
{
"title":"Address",
"sort":"city",
"name":["address.city","address.state"]
}
]}
How to use import { Table } from 'paginating-sorting'const handleChangeTable = (pageAction) =>{
console.log(pageAction);//order: string, page: number, sort: string
}<Table dataTable={dataTable} onChange={handleChangeTable}/>