1.0.1 • Published 2 years ago

meis-custom-table v1.0.1

Weekly downloads
-
License
ISC
Repository
gitlab
Last release
2 years ago

table props: 1) isLoading: true/false => need to add skeleton 2) emptyContainer: { text: string / component overlay: component } 3) data: array 4) pagination: { perPage: number currentPage: number totalRecords: number onChangePage: funtion } 5) customHeader: component -> done 6) topBar: { -> all done title: string / component isShowDefaultSearch: true / false placeholder: string onChangeSearch: funtion defaultSearchValue: string, } 6) select : { isShowHeaderCheckBox: true / false isShowView : true / false viewText: string actions: array => {title : string / component, action: function} checkBoxField: field name from each row default id search: { placeholder: 'Search contact', onChange: function, defaultValue: search } } 7) rowDecoration: array => title=> string / component, value => function, minWidth: '100px' 8) tableWrapperclass: string -> done 9) renderPagination: component

demo <MEISCustomTable tableWrapperclass="campaign_report" isLoading={true} data={ {firstName: 'first', value: 101, email: 'asdafcf@asd.cd', number: '123412343' }, {firstName: 'first 2', value: 102, email: 'asxcdf@asd.cd', number: '12341452343' }, {firstName: 'first 3', value: 103, email: 'asdawef@asd.cd', number: '149412343' }, {firstName: 'first 4', value: 104, email: 'asd3ef@asd.cd', number: '1234154543' }, } customHeader={(Here custom here will be added)} topBar={{ title: 'Table title', isShowDefaultSearch: true, placeholder: 'Search contact', onChangeSearch: (e) => {console.log(e)}, defaultSearchValue: '017' }} select={{ isShowHeaderCheckBox: true, onChangeCheckBox: (e) => {console.log(e)}, isShowView:true, viewText: " contact (s) selected !", actions: {title: 'Move', action: (e) => {console.log(e)}}, {title: (Delete), action: (e) => {console.log(e)}}, , checkBoxField: 'value' //default will id }} pagination={{ perPage:10, currentPage: 2, totalRecords: 135, onChangePage: (e) => {console.log(e)} }} renderPagination={(Custom pagination will be render here)} rowDecoration={ {title: 'Name', value: (row) => {return row.firstName}}, {title: 'Email', value: (row) => {return row.email}}, {title: 'Number', value: (row) => {return row.number},} } emptyContainer={{ text: "No contact available !", overlay: (Add more) }} />