這是一個基於 mantine@6 所組成的 Table Component

傳送門 ：https://6672316d941f26940289fdc1-xguzxdqbhz.chromatic.com/

表頭 columns( [{key:'',title:''}])

控制表頭顏色 theadBackgroundColor(string) theadTextColor(string)

表身資料 data(array)

資料顯示千分位 currency(true/false)

顯示總和 showTotal(true/false)

顯示表身顏色 striped(true/false)

控制表身單數欄位顏色 tbodyOddBackgroundColor(string) tbodyOddTextColor(string)

控制表身偶數欄位顏色 tbodyEvenBackgroundColor(string) tbodyEvenTextColor(string)

排序功能 order(true/false)

預設排序欄位 需要與 columns 的 key 值相符合 orderColumn(string)

顯示編輯按鈕 showEdit(true/false)

編輯按鈕文字、背景顏色 editTextColor(string) editBgColor(string)

編輯按鈕 onClick 函式會回傳當前欄位的資料 editClick(fn)

顯示刪除按鈕 showDelete(true/false)

刪除按鈕文字、背景顏色 deleteTextColor(string) deleteBgColor(string)

刪除按鈕 onClick 函式會回傳當前欄位的資料 deleteClick(fn)

顯示自定義樣式 showCustom(true/false)

設定自定義樣式 customComponent(fn)

顯示分頁 showPagination(true/false)

設定每頁數量 pageSize(number)