@ssplib/react-components 0.0.56 → 0.0.58

package/components/form/table/Table.d.ts

@@ -3,9 +3,12 @@ interface ColumnData {
     title: string;
     keyName: string;
 }
-export declare function Table({ columns, fetchFunc, emptyMsg, dataPath, tableName, csv, columnSize, action, isPublic, filters, statusKeyName, csvExcludeKeys, csvCustomKeyNames, csvExcludeValidate, }: {
+export declare function Table({ columns, fetchFunc, emptyMsg, dataPath, tableName, csv, columnSize, action, isPublic, filters, statusKeyName, csvExcludeKeys, csvCustomKeyNames, csvExcludeValidate, csvButtonTitle, csvAllButtonTitle, csvShowAllButton, }: {
     columns: ColumnData[];
     tableName: string;
+    csvShowAllButton?: boolean;
+    csvAllButtonTitle?: string;
+    csvButtonTitle?: string;
     csvExcludeValidate?: (key: string, value: string | number) => boolean;
     csvCustomKeyNames?: {
         [key: string]: string;

package/components/form/table/Table.js

@@ -40,7 +40,7 @@ const auth_1 = require("../../../context/auth");
 function Table({ columns, fetchFunc, emptyMsg = {
     user: 'Nenhum dado encontrado',
     public: 'Nenhum dado encontrado',
-}, dataPath = '', tableName, csv, columnSize, action, isPublic = false, filters, statusKeyName = '', csvExcludeKeys = [], csvCustomKeyNames = {}, csvExcludeValidate = (key, value) => false, }) {
+}, dataPath = '', tableName, csv, columnSize, action, isPublic = false, filters, statusKeyName = '', csvExcludeKeys = [], csvCustomKeyNames = {}, csvExcludeValidate = (key, value) => false, csvButtonTitle = 'Salvar .CSV', csvAllButtonTitle = 'Salvar Tudo como CSV', csvShowAllButton = false, }) {
     const [isLoading, setIsLoading] = (0, react_1.useState)(true);
     const [error, setError] = (0, react_1.useState)(null);
     const [data, setData] = (0, react_1.useState)(null);
@@ -203,6 +203,36 @@ function Table({ columns, fetchFunc, emptyMsg = {
         a.click();
         document.body.removeChild(a);
     }, [list]);
+    const downloadCSVAll = (0, react_1.useCallback)((e) => {
+        e.preventDefault();
+        if (list.length <= 0)
+            return;
+        const keys = Object.keys(list[0]);
+        const header = keys.join(',') + '\n';
+        const values = list
+            .map((x) => {
+            return keys
+                .map((k) => {
+                if (k === 'tbRa')
+                    return x[k]['NO_CIDADE'];
+                if (k === 'rlEventoData')
+                    return `${x[k][0]['DT_INICIO']} - ${x[k][0]['HR_INICIO']}`;
+                if (typeof x[k] === 'string')
+                    return `"${x[k]}"`;
+                return x[k];
+            })
+                .join(',');
+        })
+            .join('\n');
+        const csvData = header + values;
+        // download
+        const a = document.createElement('a');
+        a.href = 'data:text/csv;charset=utf-8,' + csvData;
+        a.download = `${csv === null || csv === void 0 ? void 0 : csv.fileName}.csv`;
+        document.body.appendChild(a);
+        a.click();
+        document.body.removeChild(a);
+    }, [list]);
     const getStatusMsg = (0, react_1.useCallback)((cod) => {
         switch (cod) {
             case 'P':
@@ -259,8 +289,12 @@ function Table({ columns, fetchFunc, emptyMsg = {
                     react_1.default.createElement(Grid_1.default, { item: true, xs: 12, md: 12 / columnSize },
                         react_1.default.createElement(material_1.Stack, { direction: 'row', alignItems: 'center', justifyContent: isSmall ? 'start' : 'flex-end', sx: { height: '100%', paddingBottom: isSmall ? 2 : 0 } }, action(x))))))))),
             getMaxItems().length > 0 && (react_1.default.createElement(react_1.default.Fragment, null,
-                csv && (react_1.default.createElement(material_1.Stack, { direction: 'row', justifyContent: 'flex-end', marginTop: 2 },
-                    react_1.default.createElement(material_1.Button, { startIcon: react_1.default.createElement(FileDownload_1.default, null), variant: 'contained', size: 'small', onClick: downloadCSV, sx: { backgroundColor: '#22C55E', marginRight: { xs: 2, md: 0 } } }, "Salvar .CSV"))),
+                csv && (react_1.default.createElement(material_1.Stack, { direction: {
+                        xs: 'column',
+                        md: 'row',
+                    }, justifyContent: 'flex-end', marginTop: 2, spacing: 1 },
+                    csvShowAllButton && (react_1.default.createElement(material_1.Button, { startIcon: react_1.default.createElement(FileDownload_1.default, null), variant: 'contained', size: 'small', onClick: downloadCSVAll, sx: { backgroundColor: '#64748B', marginRight: { xs: 2, md: 0 }, width: { xs: '100%', md: 'fit-content' } } }, csvAllButtonTitle)),
+                    react_1.default.createElement(material_1.Button, { startIcon: react_1.default.createElement(FileDownload_1.default, null), variant: 'contained', size: 'small', onClick: downloadCSV, sx: { backgroundColor: '#22C55E', marginRight: { xs: 2, md: 0 }, width: { xs: '100%', md: 'fit-content' } } }, csvButtonTitle))),
                 react_1.default.createElement(material_1.Stack, { direction: 'row', justifyContent: 'center', paddingY: 4 },
                     react_1.default.createElement(Pagination_1.default, { count: paginationCount, siblingCount: isSmall ? 0 : 1, size: 'large', onChange: onPaginationChange, page: listPage })))))));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@ssplib/react-components",
-    "version": "0.0.56",
+    "version": "0.0.58",
     "description": "SSP React Components",
     "main": "index.js",
     "author": "Pedro Henrique <sr.hudrick@gmail.com>",