@ssplib/react-components 0.0.117 → 0.0.118
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -89,7 +89,10 @@ function FileUpload({ name, tipoArquivo, title, required = false, multiple = fal
|
|
|
89
89
|
}
|
|
90
90
|
});
|
|
91
91
|
})
|
|
92
|
-
.catch((err) =>
|
|
92
|
+
.catch((err) => {
|
|
93
|
+
setFilesError((fl) => [...fl, id]);
|
|
94
|
+
console.log(err);
|
|
95
|
+
});
|
|
93
96
|
return { id: id, name: file.name, loading: true, error: false, file: file };
|
|
94
97
|
}),
|
|
95
98
|
]);
|
|
@@ -3,7 +3,7 @@ interface ColumnData {
|
|
|
3
3
|
title: string;
|
|
4
4
|
keyName: string;
|
|
5
5
|
}
|
|
6
|
-
export declare function Table({ columns, fetchFunc, emptyMsg, dataPath, tableName, csv, columnSize, action, isPublic,
|
|
6
|
+
export declare function Table({ columns, fetchFunc, emptyMsg, dataPath, tableName, csv, columnSize, action, isPublic, statusKeyName, csvExcludeKeys, csvCustomKeyNames, csvExcludeValidate, csvButtonTitle, csvAllButtonTitle, csvShowAllButton, itemCount, }: {
|
|
7
7
|
columns: ColumnData[];
|
|
8
8
|
tableName: string;
|
|
9
9
|
csvShowAllButton?: boolean;
|
|
@@ -29,10 +29,9 @@ export declare function Table({ columns, fetchFunc, emptyMsg, dataPath, tableNam
|
|
|
29
29
|
dataPath?: string;
|
|
30
30
|
isPublic?: boolean;
|
|
31
31
|
filters?: {
|
|
32
|
-
|
|
33
|
-
options
|
|
34
|
-
|
|
35
|
-
}[];
|
|
32
|
+
type: '';
|
|
33
|
+
options?: object[];
|
|
34
|
+
};
|
|
36
35
|
}): JSX.Element;
|
|
37
36
|
declare const _default: React.MemoExoticComponent<typeof Table>;
|
|
38
37
|
export default _default;
|
|
@@ -40,7 +40,7 @@ const auth_1 = require("../../../context/auth");
|
|
|
40
40
|
function Table({ columns, fetchFunc, emptyMsg = {
|
|
41
41
|
user: 'Nenhum dado encontrado',
|
|
42
42
|
public: 'Nenhum dado encontrado',
|
|
43
|
-
}, dataPath = '', tableName, csv, columnSize, action, isPublic = false,
|
|
43
|
+
}, dataPath = '', tableName = 'Dados', csv, columnSize, action, isPublic = false, statusKeyName = '', csvExcludeKeys = [], csvCustomKeyNames = {}, csvExcludeValidate = (key, value) => false, csvButtonTitle = 'Salvar .CSV', csvAllButtonTitle = 'Salvar todos em CSV', csvShowAllButton = false, itemCount = 10, }) {
|
|
44
44
|
const [isLoading, setIsLoading] = (0, react_1.useState)(true);
|
|
45
45
|
const [error, setError] = (0, react_1.useState)(null);
|
|
46
46
|
const [data, setData] = (0, react_1.useState)(null);
|
|
@@ -300,37 +300,44 @@ function Table({ columns, fetchFunc, emptyMsg = {
|
|
|
300
300
|
return react_1.default.createElement(material_1.LinearProgress, null);
|
|
301
301
|
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
302
302
|
react_1.default.createElement(material_1.Box, { marginX: isSmall ? 0 : 4 },
|
|
303
|
-
react_1.default.createElement(material_1.Stack, {
|
|
303
|
+
react_1.default.createElement(material_1.Stack, { spacing: 2, direction: { xs: 'column', md: 'row' } },
|
|
304
304
|
react_1.default.createElement(TextField_1.default, { InputProps: {
|
|
305
305
|
startAdornment: react_1.default.createElement(Search_1.default, { sx: { marginRight: 1, fill: '#c0c0c0' } }),
|
|
306
|
-
}, size: 'small', onChange: onInputChange, fullWidth: true, placeholder: `Pesquisar ${tableName}` }),
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
306
|
+
}, size: 'small', onChange: onInputChange, fullWidth: true, placeholder: `Pesquisar ${tableName}` })),
|
|
307
|
+
react_1.default.createElement(material_1.Stack, { spacing: 0.2 },
|
|
308
|
+
getMaxItems().length <= 0 ? (react_1.default.createElement(material_1.Stack, { sx: { backgroundColor: '#E2E8F0', padding: 2, marginX: { xs: 2, md: 0 } }, justifyContent: 'center', alignItems: 'center' },
|
|
309
|
+
react_1.default.createElement(Typography_1.default, { fontSize: 21, fontFamily: 'Inter', fontWeight: 600, textAlign: 'center' }, user ? emptyMsg.user : emptyMsg.public))) : (getMaxItems().map((x, index) => (react_1.default.createElement(material_1.Paper, { key: index, sx: { padding: 0.5, backgroundColor: index % 2 === 0 ? '#E2E8F0' : '#F8FAFC', paddingY: 2 }, elevation: 0 },
|
|
310
|
+
react_1.default.createElement(Grid_1.default, { container: true, spacing: isSmall ? 2 : 0, paddingX: 2 },
|
|
311
|
+
columns.map((c) => (react_1.default.createElement(Grid_1.default, { key: c.keyName + index, item: true, xs: 12, md: 12 / columnSize },
|
|
312
|
+
react_1.default.createElement(material_1.Box, { sx: { width: 'max-content', paddingX: 1 } },
|
|
313
|
+
react_1.default.createElement(Typography_1.default, { fontSize: 16, fontWeight: 700, color: '#1E293B', fontFamily: 'Inter' }, c.title)),
|
|
314
|
+
react_1.default.createElement(material_1.Box, { paddingLeft: 1 },
|
|
315
|
+
react_1.default.createElement(Typography_1.default, { fontSize: 16, sx: { wordWrap: 'break-word', color: '#1E293B' }, fontFamily: 'Inter' }, c.keyName === statusKeyName ? getStatusMsg((0, lodash_get_1.default)(x, c.keyName)) : (0, lodash_get_1.default)(x, c.keyName)))))),
|
|
316
|
+
react_1.default.createElement(Grid_1.default, { item: true, xs: 12, md: 12 / columnSize },
|
|
317
|
+
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)))))))),
|
|
318
|
+
react_1.default.createElement(material_1.Stack, { bgcolor: '#F8FAFC', direction: 'row', justifyContent: 'center', paddingY: 1, borderTop: 3, borderColor: '#b4bfcf' },
|
|
319
|
+
react_1.default.createElement(material_1.Stack, { direction: 'column', justifyContent: 'center', alignItems: 'center' },
|
|
320
|
+
react_1.default.createElement(Pagination_1.default, { count: paginationCount, siblingCount: isSmall ? 0 : 1, size: 'large', onChange: onPaginationChange, page: listPage, shape: 'rounded' })))),
|
|
321
|
+
getMaxItems().length > 0 && (react_1.default.createElement(material_1.Stack, { bgcolor: '#E2E8F0', padding: 1, direction: {
|
|
322
|
+
xs: 'column',
|
|
323
|
+
md: 'row',
|
|
324
|
+
}, spacing: {
|
|
325
|
+
xs: 2,
|
|
326
|
+
md: 0,
|
|
327
|
+
}, justifyContent: 'space-between', alignItems: 'center' },
|
|
328
|
+
react_1.default.createElement(material_1.Box, { height: '100%', top: 0, left: 0, marginLeft: 2 },
|
|
329
|
+
react_1.default.createElement(material_1.Stack, { height: '100%', justifyContent: 'center' },
|
|
330
|
+
currentPage * itemsCount + 1,
|
|
331
|
+
"-",
|
|
332
|
+
currentPage * itemsCount + 1 + getMaxItems().length - 1,
|
|
333
|
+
" de ",
|
|
334
|
+
list.length)),
|
|
319
335
|
csv && (react_1.default.createElement(material_1.Stack, { direction: {
|
|
320
336
|
xs: 'column',
|
|
321
337
|
md: 'row',
|
|
322
|
-
}, justifyContent: 'flex-end',
|
|
338
|
+
}, justifyContent: 'flex-end', spacing: 1 },
|
|
323
339
|
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)),
|
|
324
|
-
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)))
|
|
325
|
-
react_1.default.createElement(material_1.Stack, { direction: 'row', justifyContent: 'center', paddingY: 4 },
|
|
326
|
-
react_1.default.createElement(material_1.Stack, { direction: 'column', justifyContent: 'center', alignItems: 'center' },
|
|
327
|
-
react_1.default.createElement(Typography_1.default, { marginBottom: 2 },
|
|
328
|
-
currentPage * itemsCount + 1,
|
|
329
|
-
"-",
|
|
330
|
-
currentPage * itemsCount + 1 + getMaxItems().length - 1,
|
|
331
|
-
" de ",
|
|
332
|
-
list.length),
|
|
333
|
-
react_1.default.createElement(Pagination_1.default, { count: paginationCount, siblingCount: isSmall ? 0 : 1, size: 'large', onChange: onPaginationChange, page: listPage }))))))));
|
|
340
|
+
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))))))));
|
|
334
341
|
}
|
|
335
342
|
exports.Table = Table;
|
|
336
343
|
exports.default = react_1.default.memo(Table);
|