import { tableColumnFilter } from './tableColumnFilter'; export interface tableRow { data: any; hidden?: boolean; authHidden?: boolean; } export interface componentTableData { header: string; component: any; } export interface headerTableData { header: string; title: string; canSort: boolean; canFilter: boolean; filter?: tableColumnFilter; } export interface tableData { headers: headerTableData[]; rows: tableRow[]; components: componentTableData[]; topButtons: { text: string; callbackfn: Function; }[]; search: { enabled: boolean; byHeader: string; }; selection: { enabled: boolean; multi: boolean; onChangeCallbackfn?: Function; selectionButtons?: { text: string; callbackfn: Function; }[]; }; rowAuth: { enabled: boolean; byHeader: string; toCheckCallback: (headerValue: any) => boolean; }; rowSelectable: { enabled: boolean; callbackfn: (row: tableRow) => {}; }; useExternalHandling: { enabled: boolean; pagination?: { getCurrentPageCallback: () => number; setPageCallback: (pageNumber: number) => {}; getPageCountCallback: () => number; getPageSizeCallback: () => number; setPageSizeCallback?: (pageSize: number) => void; }; selection?: { isIdSelectedCallback: (rowId: string) => boolean; toggleIdCallback: (rowId: string) => {}; toggleAllCallback: () => {}; }; filtering?: { setFiltersOnChangeCallback: (filters: { filter: tableColumnFilter; header: string; }) => {}; }; sorting?: { handleColumnSortCallback: (header: string, direction: 'asc' | 'desc') => {}; }; genericSearch?: { handleSearchOnChangeCallback: (query: string) => {}; }; }; draggableSorting: { enabled: boolean; orderingCallback: (dataInNewOrder: Array) => {}; }; } /** * ____ ____ _________ __ __ * |_ _| |_ _| | _ _ | [ | [ | * \ \ / /______|_/ | | \_|,--. | |.--. | | .---. * \ \ / /|______| | | `'_\ : | '/'`\ \| |/ /__\\ * \ ' / _| |_ // | |, | \__/ || || \__., * \_/ |_____| \'-;__/[__;.__.'[___]'.__.' * * Basic usage - The vTable requires a properly formatted tableData Object * * the `tableData` should hold: * the `headers` {{header: string, title: string, canSort: boolean, canFilter: boolean}[]} which you'd like to be able to see which correspond to fields in your objects * the `rows` {tableRow[]} should be an array of available rows of data (rows[x].data = {...row}) * the `components` {componentTableData[]} is an array of key, pairs which are the different headers and customer components what will render in place of plain text * the `topButtons` {{ text: string; callbackfn: Function }[]} is an array of available buttons and each of their respective callback functions to render above the table * the `search` {{ enabled: boolean; byHeader: string }} is a check to see if this table will allow searching (search.allowed) and if so which header to search text in (search.byHeader) * the `selection` {{ enabled: boolean; multi: boolean }} is to enable and disable selection as well as enable a multi select feature. Selection requires that each row have some `id` field * the `rowAuth` {{ enabled: boolean; byHeader: string; toCheckCallback: (headerValue: any) => boolean}} will see if there is some auth check per row and which header to check for the rowAuth via your callback given * * The table will be generated from this object and will fill in whatever div it is in * * Additionally, a `Title` can be passed into the props to display as text above the table */ declare const _default: import('vue').DefineSetupFnComponent, {}, {}, Record & {}, import('vue').PublicProps>; export default _default; //# sourceMappingURL=vTable.vue.d.ts.map