@ssplib/react-components 0.0.283 → 0.0.285

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

@@ -1,5 +1,5 @@
 import React from 'react';
 import { TableProps } from './types';
-export declare function Table({ mediaQueryLG, columns, fetchFunc, emptyMsg, dataPath, tableName, csvConfig, columnSize, action, useKC, itemCount, expandTextMaxLength, collapsedSize, customMargin, customMarginMobile, filtersFunc, filters, orderBy, customErrorMsg, customTableStyle, id, initialData, isExpandable, }: TableProps): JSX.Element;
+export declare function Table({ mediaQueryLG, columns, csvConfig, fetchFunc, emptyMsg, dataPath, tableName, columnSize, action, useKC, itemCount, expandTextMaxLength, collapsedSize, customMargin, customMarginMobile, filtersFunc, filters, orderBy, customErrorMsg, customTableStyle, id, initialData, isExpandable, }: TableProps): JSX.Element;
 declare const _default: React.MemoExoticComponent<typeof Table>;
 export default _default;

package/components/form/table/Table.js

@@ -50,13 +50,10 @@ let isExpandAll = false;
 let localTableName = '';
 let filtersFuncData = {};
 let localTableNameCache = '';
-function Table({ mediaQueryLG, columns, fetchFunc, emptyMsg = {
+function Table({ mediaQueryLG, columns, csvConfig, fetchFunc, emptyMsg = {
     user: 'Nenhum dado encontrado',
     public: 'Nenhum dado encontrado',
-}, dataPath = '', tableName = 'Dado', csvConfig = {
-    fileName: tableName,
-    map: []
-}, columnSize, action, useKC = true, itemCount = 10, expandTextMaxLength = 50, collapsedSize = 53, customMargin = 4, customMarginMobile = 0, filtersFunc, filters = [], orderBy = [], customErrorMsg = undefined, customTableStyle = {}, id, initialData = null, isExpandable = true, }) {
+}, dataPath = '', tableName = 'Dado', columnSize, action, useKC = true, itemCount = 10, expandTextMaxLength = 50, collapsedSize = 53, customMargin = 4, customMarginMobile = 0, filtersFunc, filters = [], orderBy = [], customErrorMsg = undefined, customTableStyle = {}, id, initialData = null, isExpandable = true, }) {
     var _a, _b;
     const [isLoading, setIsLoading] = (0, react_1.useState)(false);
     const [error, setError] = (0, react_1.useState)(null);
@@ -302,9 +299,11 @@ function Table({ mediaQueryLG, columns, fetchFunc, emptyMsg = {
         localStorage.removeItem(localTableName);
         setFilterKey(new Date().getTime().toString());
     }
-    const handleCSVDownload = (list) => {
+    const handleCSVDownload = (list, all = false) => {
         var _a;
-        (0, utils_1.downloadCSVFile)(list, csvConfig, JSON.parse((_a = localStorage.getItem(localTableName)) !== null && _a !== void 0 ? _a : '[]') || []);
+        if (!csvConfig)
+            return;
+        (0, utils_1.downloadCSVFile)(list, Object.assign(Object.assign({}, csvConfig), (all ? { downloadAll: true } : {})), JSON.parse((_a = localStorage.getItem(localTableName)) !== null && _a !== void 0 ? _a : '[]') || []);
     };
     const handleFiltrarDados = (dt) => {
         (0, utils_1.filtrarDados)({
@@ -465,14 +464,14 @@ function Table({ mediaQueryLG, columns, fetchFunc, emptyMsg = {
                 }, spacing: {
                     xs: 2,
                     md: 0,
-                }, justifyContent: 'space-between', alignItems: 'center' }, csvConfig.map.length > 0 && (react_1.default.createElement(material_1.Stack, { direction: {
+                }, justifyContent: 'space-between', alignItems: 'center' }, csvConfig && (react_1.default.createElement(material_1.Stack, { direction: {
                     xs: 'column',
                     md: 'row',
                 }, justifyContent: 'flex-end', spacing: 1 },
                 JSON.parse((_b = localStorage.getItem(localTableName)) !== null && _b !== void 0 ? _b : '[]')
                     .filter((x) => x.value || (x.operator === 'entre' && (x.value || x.value2))).length > 0 &&
                     react_1.default.createElement(material_1.Button, { startIcon: react_1.default.createElement(FileDownload_1.default, null), variant: 'contained', size: 'small', onClick: (e) => handleCSVDownload(list), sx: { backgroundColor: '#a5a5a5', marginRight: { xs: 2, md: 0 }, width: { xs: '100%', md: 'fit-content' } } }, "Baixar Filtrados"),
-                react_1.default.createElement(material_1.Button, { startIcon: react_1.default.createElement(FileDownload_1.default, null), variant: 'contained', size: 'small', onClick: (e) => handleCSVDownload(startData.current), sx: { backgroundColor: '#22C55E', marginRight: { xs: 2, md: 0 }, width: { xs: '100%', md: 'fit-content' } } }, "Baixar Tabela")))))),
+                react_1.default.createElement(material_1.Button, { startIcon: react_1.default.createElement(FileDownload_1.default, null), variant: 'contained', size: 'small', onClick: (e) => handleCSVDownload(startData.current, true), sx: { backgroundColor: '#22C55E', marginRight: { xs: 2, md: 0 }, width: { xs: '100%', md: 'fit-content' } } }, "Baixar Tabela")))))),
         react_1.default.createElement(material_1.Stack, { direction: 'row', justifyContent: 'center', paddingY: 1, paddingTop: 2 },
             react_1.default.createElement(material_1.Stack, { direction: 'row', justifyContent: 'center', alignItems: 'center', spacing: 2 },
                 react_1.default.createElement(material_1.Button, { onClick: (e) => setListPage((s) => {

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

@@ -30,6 +30,8 @@ export interface FilterValue {
 export interface CsvMapProps {
     name: string;
     key: string;
+    onlyFilter?: boolean;
+    onlyAll?: boolean;
     useFilterValue?: {
         label: string;
         operators: FilterOperators[];
@@ -37,7 +39,10 @@ export interface CsvMapProps {
 }
 export interface CsvConfigProp {
     fileName: string;
-    map: CsvMapProps[];
+    downloadAll?: boolean;
+    customFiltered?: (list: any[], filters: FilterValue[]) => any[];
+    customAll?: (list: any[], filters: FilterValue[]) => any[];
+    map?: CsvMapProps[];
 }
 /**
  * Interface para as propriedades do componente Table.

package/components/form/table/utils.js

@@ -208,7 +208,7 @@ function filtrarDados({ filterData, startData, filtersFuncData = {}, localTableN
                     case 'data inicio':
                         currentData.forEach((cd) => {
                             var _a;
-                            const dates = (_a = filtersFuncData[dt.customFunc]((0, lodash_get_1.default)(cd, dt.keyName, ''))) !== null && _a !== void 0 ? _a : [];
+                            const dates = ((_a = filtersFuncData[dt.customFunc]((0, lodash_get_1.default)(cd, dt.keyName, ''))) !== null && _a !== void 0 ? _a : []).filter(d => d !== undefined && d !== '');
                             if (dates.length <= 0)
                                 return;
                             var inicioDate = dates[0];
@@ -221,9 +221,10 @@ function filtrarDados({ filterData, startData, filtersFuncData = {}, localTableN
                     case 'data fim':
                         currentData.forEach((cd) => {
                             var _a;
-                            const dates = (_a = filtersFuncData[dt.customFunc]((0, lodash_get_1.default)(cd, dt.keyName, ''))) !== null && _a !== void 0 ? _a : [];
+                            const dates = ((_a = filtersFuncData[dt.customFunc]((0, lodash_get_1.default)(cd, dt.keyName, ''))) !== null && _a !== void 0 ? _a : []).filter(d => d !== undefined && d !== '');
                             if (dates.length <= 0)
                                 return;
+                            console.log(dates);
                             var fimDate = dates[dates.length - 1];
                             var fimValue = (0, dayjs_1.default)(fimDate, 'DD/MM/YYYY');
                             if (fimValue.isSame((0, dayjs_1.default)(dt.value, 'DD/MM/YYYY'))) {
@@ -234,7 +235,7 @@ function filtrarDados({ filterData, startData, filtersFuncData = {}, localTableN
                     case 'tem a data':
                         currentData.forEach((cd) => {
                             var _a;
-                            const dates = (_a = filtersFuncData[dt.customFunc]((0, lodash_get_1.default)(cd, dt.keyName, ''))) !== null && _a !== void 0 ? _a : [];
+                            const dates = ((_a = filtersFuncData[dt.customFunc]((0, lodash_get_1.default)(cd, dt.keyName, ''))) !== null && _a !== void 0 ? _a : []).filter(d => d !== undefined && d !== '');
                             if (dates.includes(dt.value)) {
                                 filteredData.push(cd);
                             }
@@ -245,7 +246,7 @@ function filtrarDados({ filterData, startData, filtersFuncData = {}, localTableN
                         const dateB = dt.value2 ? (0, dayjs_1.default)(dt.value2, 'DD/MM/YYYY') : (0, dayjs_1.default)('31/12/2030', 'DD/MM/YYYY');
                         currentData.forEach((cd) => {
                             var _a;
-                            const dates = (_a = filtersFuncData[dt.customFunc]((0, lodash_get_1.default)(cd, dt.keyName, ''))) !== null && _a !== void 0 ? _a : [];
+                            const dates = ((_a = filtersFuncData[dt.customFunc]((0, lodash_get_1.default)(cd, dt.keyName, ''))) !== null && _a !== void 0 ? _a : []).filter(d => d !== undefined && d !== '');
                             let isBetween = false;
                             dates.forEach((dtStr) => {
                                 if (isBetween)
@@ -300,22 +301,31 @@ function downloadCSVFile(list, config, filters) {
     return __awaiter(this, void 0, void 0, function* () {
         if (list.length <= 0)
             return;
-        // definindo os campos especificados do csv
-        const newData = list.map(x => {
-            const obj = {};
-            config.map.forEach(m => {
-                // opção de usar o valor do filtro no próprio campo
-                if (m.useFilterValue) {
-                    const filterValueList = filters.filter(f => f.label == m.useFilterValue.label && m.useFilterValue.operators.includes(f.operator));
-                    const filterValue = filterValueList.length > 0 ? (filterValueList.reduce(r => r.value).value || undefined) : undefined;
-                    obj[m.name] = filterValue || (0, lodash_get_1.default)(x, m.key);
-                    return;
-                }
-                obj[m.name] = (0, lodash_get_1.default)(x, m.key);
+        let data = [];
+        if (config.downloadAll && config.customAll)
+            data = config.customAll(list, filters);
+        else if (!config.downloadAll && config.customFiltered)
+            data = config.customFiltered(list, filters);
+        else {
+            // definindo os campos especificados do csv
+            list.forEach(x => {
+                const obj = {};
+                config.map.forEach(m => {
+                    // opção de usar o valor do filtro no próprio campo
+                    if (m.useFilterValue && !config.downloadAll && !m.onlyAll) {
+                        const filterValueList = filters.filter(f => f.label == m.useFilterValue.label && m.useFilterValue.operators.includes(f.operator));
+                        const filterValue = filterValueList.length > 0 ? (filterValueList.reduce(r => r.value).value || undefined) : undefined;
+                        obj[m.name] = filterValue || (0, lodash_get_1.default)(x, m.key);
+                        return;
+                    }
+                    if (m.onlyFilter)
+                        return;
+                    obj[m.name] = (0, lodash_get_1.default)(x, m.key);
+                });
+                data.push(obj);
             });
-            return obj;
-        });
-        const worksheet = XLSX.utils.json_to_sheet(newData);
+        }
+        const worksheet = XLSX.utils.json_to_sheet(data);
         const workbook = XLSX.utils.book_new();
         XLSX.utils.book_append_sheet(workbook, worksheet, config.fileName);
         XLSX.writeFile(workbook, `${config.fileName}.xlsx`);

package/package.json

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