curio-table-ants

table-ants

Installation & Usage

npm install curio-table-ants --save

import TableAnts, {TableAntsProps, TableAntsColumn} from "curio-table-ants"

const props: TableAntsProps = {
    fetchURL: location.origin + "/api/user/all"
}

const columns: TableAntsColumn[] = [
    {
        title: "Email",
        dataIndex: "email",
        key: "email",
        type: "string",
        render(text: any, row: any) {
            return `${text}(${row.name})`
        }
    }
]
render((
    <TableAnts {...props} />
), document.getElementById("#app")

Configuration

TableAntsProps

PropName	Type	Description	Default value
begin	number	a Unix timestamp	Timestamp of the day 10 days before today
end	number	a Unix timestamp	Timestamp of now
download	boolean	Display the download button or not	true
format	string	the extention of the file to be downloaded	".execl"
onTimeChange	(ts: number[]) => boolean		Call back when timepicker's value is changed
pageSize	number	row of data in each page	20
payloadExtra	object	extra payload required by fetchURL API	{}
sheetName	string	the name of file to be doanloaded	"Sheet"
timepicker	boolean	Display the timepicker or not	false
path	string	relative path of data array (in the JSON object returned by fetchURL API)	""
baseColor	string	a HSL color value, will be used in many components in the table	hsl(132, 40%, 57%)
onDataFetched	(data: any) => void	Callback function which is called when data is fetched.
filters	JSX.Element[]	A list of cusomized filter component	[]
lang	string	language	"en-US"
downloadURL	string	the API that fetch data from fetchURL and return the download link	required
fetchURL	string	the API that return actual data (Must be the absolute URL of a HTTP POST API	required
totalKey	string	relative path of the total number of data (in the JSON object returned by fetchURL API)	required
columns	TableAntsColumn[]	Definition of columns	required

TableAntsColumn

PropName	Type	Description	Default value
title	string | JSX.Element	the column title
dataIndex	string	the key (or path) of data (in a single row).	You can imit dataIndex to hide this column in the page
key	string	same as dataIndex.	You can omit key to remove this column in the download file
type	string	type in Golang, should be one of int64, string, bool, slice or float64]	required if key is present
conv	string[]	a list of conv functions (conv originial data to readable format in download file)
hideByDefault	boolean	literally "hide by default"
dlDataIndex	string	column will be download only if the column spicified by dlDataIndex is visible in the table
render	(text: any, row: any) => string | JSX.Element	render function
filters	any[]
onFilter	(v: string) => void
colSpan	number	how many colspans the column will occupy
width	number | string
className	string
sorter	(a: any, b:any): boolean	a valid sorter function