@ssplib/react-components 0.0.169 → 0.0.171
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.
- package/components/form/checkbox/CheckBoxAdditional.d.ts +1 -1
- package/components/form/checkbox/CheckBoxAdditional.js +2 -2
- package/components/form/checkbox/RequiredCheckBoxValidator.js +0 -7
- package/components/form/input/FetchAutoComplete.js +1 -1
- package/components/form/stepper/Stepper.d.ts +8 -1
- package/components/form/stepper/Stepper.js +287 -4
- package/components/form/table/Table.d.ts +2 -1
- package/components/form/table/Table.js +83 -49
- package/package.json +1 -1
|
@@ -54,7 +54,7 @@ function getChildrenNames(children) {
|
|
|
54
54
|
});
|
|
55
55
|
return arr;
|
|
56
56
|
}
|
|
57
|
-
function
|
|
57
|
+
function RequiredCheckBoxAdditional(_a) {
|
|
58
58
|
var { customText = 'Selecione pelo menos 1 opção' } = _a, props = __rest(_a, ["customText"]);
|
|
59
59
|
const [firstTime, setFirstTime] = (0, react_1.useState)(false);
|
|
60
60
|
const [showAfterFirst, setAfterFirst] = (0, react_1.useState)(true);
|
|
@@ -92,4 +92,4 @@ function RequiredCheckBoxGroup(_a) {
|
|
|
92
92
|
children,
|
|
93
93
|
react_1.default.createElement(material_1.Grid, { item: true, xs: 12 }, firstTime && showAfterFirst && props.content)));
|
|
94
94
|
}
|
|
95
|
-
exports.default =
|
|
95
|
+
exports.default = RequiredCheckBoxAdditional;
|
|
@@ -72,13 +72,6 @@ function RequiredCheckBoxGroup(_a) {
|
|
|
72
72
|
if (nameValue) {
|
|
73
73
|
canContinue = true;
|
|
74
74
|
}
|
|
75
|
-
console.log('todos os value', context.formGetValues());
|
|
76
|
-
console.log('Erro validação');
|
|
77
|
-
console.log('names', names);
|
|
78
|
-
console.log('x', x);
|
|
79
|
-
console.log('i', i);
|
|
80
|
-
console.log('nameValue', nameValue);
|
|
81
|
-
console.log('Erro validação');
|
|
82
75
|
});
|
|
83
76
|
if (!canContinue)
|
|
84
77
|
return customText;
|
|
@@ -106,7 +106,7 @@ function FetchAutoComplete({ name, url, title, customLoadingText, shouldRefetch
|
|
|
106
106
|
}), { hidden: true })),
|
|
107
107
|
react_1.default.createElement(material_1.Autocomplete, { loading: loading, loadingText: loadingText, options: list, defaultValue: dValue, isOptionEqualToValue: (op, value) => op.id === value.id, onChange: (e, v) => handleAutoCompleteChange(v), renderInput: (params) => {
|
|
108
108
|
var _a;
|
|
109
|
-
return (react_1.default.createElement(material_1.TextField, Object.assign({}, params, { size: 'small', fullWidth: true, placeholder: title, onFocus: onFocus,
|
|
109
|
+
return (react_1.default.createElement(material_1.TextField, Object.assign({}, params, { size: 'small', fullWidth: true, placeholder: title, onFocus: onFocus, error: (0, lodash_get_1.default)(context === null || context === void 0 ? void 0 : context.errors, name) ? true : false, helperText: (_a = (0, lodash_get_1.default)(context === null || context === void 0 ? void 0 : context.errors, name)) === null || _a === void 0 ? void 0 : _a.message })));
|
|
110
110
|
}, size: 'small', fullWidth: true })));
|
|
111
111
|
}
|
|
112
112
|
exports.default = FetchAutoComplete;
|
|
@@ -1,9 +1,16 @@
|
|
|
1
1
|
import React, { ReactElement } from 'react';
|
|
2
2
|
import { FieldValues } from 'react-hook-form';
|
|
3
|
-
export declare function
|
|
3
|
+
export declare function Teste(): JSX.Element;
|
|
4
|
+
export declare function Stepper({ debugLog, test, testConfig, ...props }: {
|
|
4
5
|
children: ReactElement | ReactElement[];
|
|
5
6
|
debugData?: (data: FieldValues) => void;
|
|
6
7
|
debugLog?: boolean;
|
|
8
|
+
test?: boolean;
|
|
9
|
+
testConfig?: {
|
|
10
|
+
[key: number]: {
|
|
11
|
+
[key: string]: string | number | boolean;
|
|
12
|
+
};
|
|
13
|
+
};
|
|
7
14
|
}): JSX.Element;
|
|
8
15
|
declare const _default: React.MemoExoticComponent<typeof Stepper>;
|
|
9
16
|
export default _default;
|
|
@@ -46,7 +46,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
46
46
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
47
47
|
};
|
|
48
48
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
49
|
-
exports.Stepper = void 0;
|
|
49
|
+
exports.Stepper = exports.Teste = void 0;
|
|
50
50
|
const KeyboardArrowLeft_1 = __importDefault(require("@mui/icons-material/KeyboardArrowLeft"));
|
|
51
51
|
const KeyboardArrowRight_1 = __importDefault(require("@mui/icons-material/KeyboardArrowRight"));
|
|
52
52
|
const Save_1 = __importDefault(require("@mui/icons-material/Save"));
|
|
@@ -54,6 +54,7 @@ const lab_1 = require("@mui/lab");
|
|
|
54
54
|
const material_1 = require("@mui/material");
|
|
55
55
|
const react_1 = __importStar(require("react"));
|
|
56
56
|
const form_1 = require("../../../context/form");
|
|
57
|
+
const Table_1 = __importDefault(require("../table/Table"));
|
|
57
58
|
const getKeys = (values, id) => {
|
|
58
59
|
if (!values || Object.keys(values).length <= 0)
|
|
59
60
|
return [];
|
|
@@ -64,10 +65,272 @@ const getKeys = (values, id) => {
|
|
|
64
65
|
keys = [...keys, ...Object.keys(values.files).map((x) => `files.${x}`)];
|
|
65
66
|
return keys;
|
|
66
67
|
};
|
|
68
|
+
function sleep(ms) {
|
|
69
|
+
return new Promise((resolve) => setTimeout(resolve, ms));
|
|
70
|
+
}
|
|
71
|
+
function Teste() {
|
|
72
|
+
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
73
|
+
react_1.default.createElement(Table_1.default, { columnSize: 11, action: () => react_1.default.createElement(react_1.default.Fragment, null), tableName: 'Evento', multipleDataPath: 'dtTableArr', csv: { fileName: 'Eventos' }, isPublic: true, columns: [
|
|
74
|
+
{
|
|
75
|
+
keyName: 'coSeqEventoExterno',
|
|
76
|
+
title: 'Protocolo',
|
|
77
|
+
},
|
|
78
|
+
{
|
|
79
|
+
keyName: 'noEvento',
|
|
80
|
+
title: 'Nome',
|
|
81
|
+
},
|
|
82
|
+
{
|
|
83
|
+
keyName: 'dtTableDates',
|
|
84
|
+
title: 'Datas',
|
|
85
|
+
size: 2,
|
|
86
|
+
},
|
|
87
|
+
{
|
|
88
|
+
keyName: 'dsEnderecoLocal',
|
|
89
|
+
title: 'Local',
|
|
90
|
+
},
|
|
91
|
+
{
|
|
92
|
+
keyName: 'noTableRa',
|
|
93
|
+
title: 'RA',
|
|
94
|
+
},
|
|
95
|
+
{
|
|
96
|
+
keyName: 'nuPublicoMaximo',
|
|
97
|
+
title: 'Público Máximo',
|
|
98
|
+
},
|
|
99
|
+
{
|
|
100
|
+
keyName: 'dtCadastro',
|
|
101
|
+
title: 'Data de Solicitação',
|
|
102
|
+
},
|
|
103
|
+
{
|
|
104
|
+
keyName: 'nuProcessoFormatadoSei',
|
|
105
|
+
title: 'Processo SEI',
|
|
106
|
+
},
|
|
107
|
+
{
|
|
108
|
+
keyName: 'stEventoExterno',
|
|
109
|
+
title: 'Status do Evento',
|
|
110
|
+
},
|
|
111
|
+
], statusKeyName: 'stEventoExterno', csvButtonTitle: 'Baixar Eventos CSV', csvCustomKeyNames: {
|
|
112
|
+
noTableRa: 'RA',
|
|
113
|
+
protocoloProcessosei: 'Protocolo / Processo SEI',
|
|
114
|
+
coSeqEventoExterno: 'Protocolo',
|
|
115
|
+
noEvento: 'Nome do Evento',
|
|
116
|
+
dtCadastro: 'Data de Solicitação',
|
|
117
|
+
dtTableInicio: 'Data de Início',
|
|
118
|
+
hrTableInicio: 'Hora de Início',
|
|
119
|
+
dsEnderecoLocal: 'Endereço',
|
|
120
|
+
nuPublicoMaximo: 'Público Máximo',
|
|
121
|
+
nuProcessoFormatadoSei: 'Processo SEI',
|
|
122
|
+
stTableStatus: 'Status do Evento',
|
|
123
|
+
dtTableDates: 'Datas Cadastradas (Inicio | Termino)',
|
|
124
|
+
dsTableNaturezas: 'Naturezas',
|
|
125
|
+
stAcaoTransito: 'Ações de Trânsito',
|
|
126
|
+
}, csvExcludeKeysCSV: ['dtTableDates'], csvExcludeKeys: ['rlEventoData', 'stEventoExterno', 'dtTableArr'], fetchFunc: () => fetch('http://localhost:7171/table'),
|
|
127
|
+
// filtros
|
|
128
|
+
filters: {
|
|
129
|
+
Protocolo: [
|
|
130
|
+
{
|
|
131
|
+
keyName: 'coSeqEventoExterno',
|
|
132
|
+
type: 'a-z',
|
|
133
|
+
name: 'Ordernar em ordem crescente',
|
|
134
|
+
},
|
|
135
|
+
{
|
|
136
|
+
keyName: 'coSeqEventoExterno',
|
|
137
|
+
type: 'z-a',
|
|
138
|
+
name: 'Ordernar em ordem decrescente',
|
|
139
|
+
},
|
|
140
|
+
],
|
|
141
|
+
Nome: [
|
|
142
|
+
{
|
|
143
|
+
keyName: 'noEvento',
|
|
144
|
+
type: 'a-z',
|
|
145
|
+
name: 'Ordernar em ordem crescente',
|
|
146
|
+
},
|
|
147
|
+
{
|
|
148
|
+
keyName: 'noEvento',
|
|
149
|
+
type: 'z-a',
|
|
150
|
+
name: 'Ordernar em ordem decrescente',
|
|
151
|
+
},
|
|
152
|
+
],
|
|
153
|
+
Datas: [
|
|
154
|
+
{
|
|
155
|
+
type: 'date-interval',
|
|
156
|
+
keyName: 'dtTableDates',
|
|
157
|
+
name: 'Intervalo de Data',
|
|
158
|
+
},
|
|
159
|
+
{
|
|
160
|
+
type: 'data-a-z',
|
|
161
|
+
keyName: 'dtTableDates',
|
|
162
|
+
name: 'Data crescente',
|
|
163
|
+
},
|
|
164
|
+
{
|
|
165
|
+
type: 'data-z-a',
|
|
166
|
+
keyName: 'dtTableDates',
|
|
167
|
+
name: 'Data decrescente',
|
|
168
|
+
},
|
|
169
|
+
],
|
|
170
|
+
Local: [
|
|
171
|
+
{
|
|
172
|
+
keyName: 'dsEnderecoLocal',
|
|
173
|
+
type: 'a-z',
|
|
174
|
+
name: 'Ordernar em ordem crescente',
|
|
175
|
+
},
|
|
176
|
+
{
|
|
177
|
+
keyName: 'dsEnderecoLocal',
|
|
178
|
+
type: 'z-a',
|
|
179
|
+
name: 'Ordernar em ordem decrescente',
|
|
180
|
+
},
|
|
181
|
+
],
|
|
182
|
+
'Ato Público': [
|
|
183
|
+
{
|
|
184
|
+
type: 'items',
|
|
185
|
+
keyName: 'dsTableNaturezas',
|
|
186
|
+
name: '',
|
|
187
|
+
referenceKey: 'coSeqEventoExterno',
|
|
188
|
+
options: [
|
|
189
|
+
{
|
|
190
|
+
key: 'atopublico',
|
|
191
|
+
color: 'purple',
|
|
192
|
+
name: 'Somente Ato Público',
|
|
193
|
+
},
|
|
194
|
+
{
|
|
195
|
+
key: 'carnavalesco',
|
|
196
|
+
color: 'red',
|
|
197
|
+
name: 'Somente Carnavalesco',
|
|
198
|
+
},
|
|
199
|
+
],
|
|
200
|
+
},
|
|
201
|
+
],
|
|
202
|
+
RA: [
|
|
203
|
+
{
|
|
204
|
+
keyName: 'noTableRa',
|
|
205
|
+
type: 'a-z',
|
|
206
|
+
name: 'Ordernar em ordem crescente',
|
|
207
|
+
},
|
|
208
|
+
{
|
|
209
|
+
keyName: 'noTableRa',
|
|
210
|
+
type: 'z-a',
|
|
211
|
+
name: 'Ordernar em ordem decrescente',
|
|
212
|
+
},
|
|
213
|
+
{
|
|
214
|
+
type: 'items',
|
|
215
|
+
keyName: 'noTableRa',
|
|
216
|
+
name: '',
|
|
217
|
+
referenceKey: 'coSeqEventoExterno',
|
|
218
|
+
options: [
|
|
219
|
+
'água quente',
|
|
220
|
+
'águas claras',
|
|
221
|
+
'arapoanga',
|
|
222
|
+
'arniqueira',
|
|
223
|
+
'brazlândia',
|
|
224
|
+
'candangolândia',
|
|
225
|
+
'ceilândia',
|
|
226
|
+
'cruzeiro',
|
|
227
|
+
'fercal',
|
|
228
|
+
'gama',
|
|
229
|
+
'guará',
|
|
230
|
+
'itapoã',
|
|
231
|
+
'jardim botânico',
|
|
232
|
+
'lago norte',
|
|
233
|
+
'lago sul',
|
|
234
|
+
'núcleo bandeirante',
|
|
235
|
+
'paranoá',
|
|
236
|
+
'park way',
|
|
237
|
+
'planaltina',
|
|
238
|
+
'plano piloto',
|
|
239
|
+
'recanto das emas',
|
|
240
|
+
'riacho fundo',
|
|
241
|
+
'riacho fundo ii',
|
|
242
|
+
'samambaia',
|
|
243
|
+
'santa maria',
|
|
244
|
+
'são sebastião',
|
|
245
|
+
'scia/estrutural',
|
|
246
|
+
'sia',
|
|
247
|
+
'sobradinho',
|
|
248
|
+
'sobradinho ii',
|
|
249
|
+
'sol nascente e pôr do sol',
|
|
250
|
+
'sudoeste/octogonal',
|
|
251
|
+
'taguatinga',
|
|
252
|
+
'varjão',
|
|
253
|
+
'vicente pires',
|
|
254
|
+
].map((x) => ({
|
|
255
|
+
key: x,
|
|
256
|
+
color: 'black',
|
|
257
|
+
name: x.toUpperCase(),
|
|
258
|
+
})),
|
|
259
|
+
},
|
|
260
|
+
],
|
|
261
|
+
'Público Máximo': [
|
|
262
|
+
{
|
|
263
|
+
keyName: 'nuPublicoMaximo',
|
|
264
|
+
type: 'a-z',
|
|
265
|
+
name: 'Ordernar em ordem crescente',
|
|
266
|
+
},
|
|
267
|
+
{
|
|
268
|
+
keyName: 'nuPublicoMaximo',
|
|
269
|
+
type: 'z-a',
|
|
270
|
+
name: 'Ordernar em ordem decrescente',
|
|
271
|
+
},
|
|
272
|
+
],
|
|
273
|
+
'Data de Solicitação': [
|
|
274
|
+
{
|
|
275
|
+
type: 'data-a-z',
|
|
276
|
+
keyName: 'dtCadastro',
|
|
277
|
+
name: 'Ordem crescente',
|
|
278
|
+
},
|
|
279
|
+
{
|
|
280
|
+
type: 'data-z-a',
|
|
281
|
+
keyName: 'dtCadastro',
|
|
282
|
+
name: 'Ordem decrescente',
|
|
283
|
+
},
|
|
284
|
+
],
|
|
285
|
+
Status: [
|
|
286
|
+
{
|
|
287
|
+
type: 'items',
|
|
288
|
+
keyName: 'stEventoExterno',
|
|
289
|
+
name: '',
|
|
290
|
+
referenceKey: 'coSeqEventoExterno',
|
|
291
|
+
options: [
|
|
292
|
+
{
|
|
293
|
+
key: 'p',
|
|
294
|
+
color: '#F59E0B',
|
|
295
|
+
name: 'EM ANÁLISE',
|
|
296
|
+
},
|
|
297
|
+
{
|
|
298
|
+
key: 'a',
|
|
299
|
+
color: '#0EA5E9',
|
|
300
|
+
name: 'CADASTRADO',
|
|
301
|
+
},
|
|
302
|
+
{
|
|
303
|
+
key: 'c',
|
|
304
|
+
color: '#a1a1a1',
|
|
305
|
+
name: 'CANCELADO',
|
|
306
|
+
},
|
|
307
|
+
{
|
|
308
|
+
key: 'r',
|
|
309
|
+
color: '#EF4444',
|
|
310
|
+
name: 'REPROVADO',
|
|
311
|
+
},
|
|
312
|
+
{
|
|
313
|
+
key: 'l',
|
|
314
|
+
color: '#22C55E',
|
|
315
|
+
name: 'LICENCIADO',
|
|
316
|
+
},
|
|
317
|
+
{
|
|
318
|
+
key: 'fp',
|
|
319
|
+
color: '#991b1b',
|
|
320
|
+
name: 'FORA DO PRAZO',
|
|
321
|
+
},
|
|
322
|
+
],
|
|
323
|
+
},
|
|
324
|
+
],
|
|
325
|
+
} })));
|
|
326
|
+
}
|
|
327
|
+
exports.Teste = Teste;
|
|
67
328
|
function Stepper(_a) {
|
|
68
|
-
var { debugLog = false } = _a, props = __rest(_a, ["debugLog"]);
|
|
329
|
+
var { debugLog = false, test = false, testConfig = {} } = _a, props = __rest(_a, ["debugLog", "test", "testConfig"]);
|
|
69
330
|
const length = Array.isArray(props.children) ? props.children.length : 1;
|
|
70
331
|
const context = (0, react_1.useContext)(form_1.FormContext);
|
|
332
|
+
// next button ref
|
|
333
|
+
const nRef = (0, react_1.useRef)(null);
|
|
71
334
|
const theme = (0, material_1.useTheme)();
|
|
72
335
|
const [activeStep, setActiveStep] = (0, react_1.useState)(0);
|
|
73
336
|
const [canPass, setCanPass] = (0, react_1.useState)(false);
|
|
@@ -98,10 +361,30 @@ function Stepper(_a) {
|
|
|
98
361
|
const handleBack = () => {
|
|
99
362
|
setActiveStep((prevActiveStep) => prevActiveStep - 1);
|
|
100
363
|
};
|
|
364
|
+
const preencher = () => {
|
|
365
|
+
Object.keys(testConfig).forEach((id, idx) => {
|
|
366
|
+
const obj = testConfig[Number(id)];
|
|
367
|
+
Object.keys(obj).forEach((x) => {
|
|
368
|
+
context.formUnregister(`${id}.${x}`);
|
|
369
|
+
context.formSetValue(`${id}.${x}`, obj[x]);
|
|
370
|
+
});
|
|
371
|
+
if (idx < Object.keys(testConfig).length - 1) {
|
|
372
|
+
sleep(100).then(() => {
|
|
373
|
+
var _a;
|
|
374
|
+
const bt = nRef.current;
|
|
375
|
+
(_a = nRef.current) === null || _a === void 0 ? void 0 : _a.click();
|
|
376
|
+
});
|
|
377
|
+
}
|
|
378
|
+
});
|
|
379
|
+
};
|
|
101
380
|
return (react_1.default.createElement(material_1.Box, null,
|
|
102
|
-
react_1.default.createElement(material_1.
|
|
381
|
+
test && (react_1.default.createElement(material_1.Stack, { direction: 'row', justifyContent: 'end' },
|
|
382
|
+
react_1.default.createElement(material_1.Button, { variant: 'contained', color: 'error', onClick: preencher }, "EXCLUIR BANCO PRODU\u00C7\u00C3O"))),
|
|
383
|
+
react_1.default.createElement(material_1.Stack, { sx: { padding: 2, marginBottom: 10 } },
|
|
103
384
|
react_1.default.createElement(material_1.Box, null, stepperBlocks.map((b, index) => (react_1.default.createElement(material_1.Box, { key: 'formsB' + index, hidden: !(activeStep === index) }, stepperBlocks[index])))),
|
|
104
|
-
react_1.default.createElement(material_1.MobileStepper, { variant: 'text', steps: maxSteps, position:
|
|
385
|
+
react_1.default.createElement(material_1.MobileStepper, { variant: 'text', steps: maxSteps, position: 'bottom',
|
|
386
|
+
// position={useMediaQuery(theme.breakpoints.only('xs')) ? 'bottom' : 'static'}
|
|
387
|
+
activeStep: activeStep, sx: { paddingX: 2, paddingTop: 2, paddingBottom: 4 }, backButton: react_1.default.createElement(material_1.Button, { variant: 'contained', startIcon: react_1.default.createElement(KeyboardArrowLeft_1.default, null), onClick: handleBack, disabled: activeStep === 0, sx: { textTransform: 'none' } }, "Voltar"), nextButton: activeStep < maxSteps - 1 ? (react_1.default.createElement(material_1.Button, { variant: 'contained', endIcon: react_1.default.createElement(KeyboardArrowRight_1.default, null), onClick: handleNext, sx: { textTransform: 'none' }, ref: nRef }, "Pr\u00F3ximo")) : (react_1.default.createElement(material_1.Box, null,
|
|
105
388
|
react_1.default.createElement(lab_1.LoadingButton, { variant: 'contained', type: 'submit', loading: context.submiting, loadingPosition: 'start', startIcon: react_1.default.createElement(Save_1.default, null), onClick: (e) => nextCheck(e), sx: { textTransform: 'none', backgroundColor: '#22C55E', '&:hover': { backgroundColor: '#48cf7a' } } },
|
|
106
389
|
react_1.default.createElement("span", null, "Salvar")))) })),
|
|
107
390
|
react_1.default.createElement(material_1.Snackbar, { open: canPass, autoHideDuration: 3000, onClose: () => setCanPass(false), anchorOrigin: {
|
|
@@ -5,9 +5,10 @@ interface ColumnData {
|
|
|
5
5
|
size?: number;
|
|
6
6
|
}
|
|
7
7
|
type FilterTypes = 'a-z' | 'z-a' | 'items' | 'date-interval' | 'data-a-z' | 'data-z-a';
|
|
8
|
-
export declare function Table({ columns, fetchFunc, emptyMsg, dataPath, tableName, csv, columnSize, action, isPublic, statusKeyName, csvExcludeKeys, csvExcludeKeysCSV, csvExcludeKeysAll, csvCustomKeyNames, csvExcludeValidate, csvButtonTitle, csvNoZipText, csvAllButtonTitle, removeQuotes, normalize, csvShowAllButton, csvWithoutZip, itemCount, csvUpper, csvZipFileNamesKey, generateCsvZip, filters, hideTitleCSV, csvExcludeUpper, filterSeparator, filterStorageName, }: {
|
|
8
|
+
export declare function Table({ columns, fetchFunc, emptyMsg, dataPath, tableName, csv, columnSize, action, isPublic, statusKeyName, csvExcludeKeys, csvExcludeKeysCSV, csvExcludeKeysAll, csvCustomKeyNames, csvExcludeValidate, csvButtonTitle, csvNoZipText, csvAllButtonTitle, removeQuotes, normalize, csvShowAllButton, csvWithoutZip, itemCount, csvUpper, csvZipFileNamesKey, generateCsvZip, filters, hideTitleCSV, csvExcludeUpper, filterSeparator, filterStorageName, multipleDataPath, }: {
|
|
9
9
|
normalize?: boolean;
|
|
10
10
|
csvUpper?: boolean;
|
|
11
|
+
multipleDataPath?: string;
|
|
11
12
|
filterStorageName?: string;
|
|
12
13
|
removeQuotes?: boolean;
|
|
13
14
|
columns: ColumnData[];
|
|
@@ -46,7 +46,7 @@ let startData = [];
|
|
|
46
46
|
function Table({ columns, fetchFunc, emptyMsg = {
|
|
47
47
|
user: 'Nenhum dado encontrado',
|
|
48
48
|
public: 'Nenhum dado encontrado',
|
|
49
|
-
}, dataPath = '', tableName = 'Dados', csv, columnSize, action, isPublic = false, statusKeyName = '', csvExcludeKeys = [], csvExcludeKeysCSV = [], csvExcludeKeysAll = [], csvCustomKeyNames = {}, csvExcludeValidate = (key, value) => false, csvButtonTitle = 'Salvar .CSV', csvNoZipText = 'Salvar .CSV', csvAllButtonTitle = 'Salvar todos em CSV', removeQuotes = false, normalize = false, csvShowAllButton = false, csvWithoutZip = false, itemCount = 10, csvUpper = false, csvZipFileNamesKey = '', generateCsvZip = false, filters = {}, hideTitleCSV = false, csvExcludeUpper = [], filterSeparator = '|', filterStorageName = 'tableFilters', }) {
|
|
49
|
+
}, dataPath = '', tableName = 'Dados', csv, columnSize, action, isPublic = false, statusKeyName = '', csvExcludeKeys = [], csvExcludeKeysCSV = [], csvExcludeKeysAll = [], csvCustomKeyNames = {}, csvExcludeValidate = (key, value) => false, csvButtonTitle = 'Salvar .CSV', csvNoZipText = 'Salvar .CSV', csvAllButtonTitle = 'Salvar todos em CSV', removeQuotes = false, normalize = false, csvShowAllButton = false, csvWithoutZip = false, itemCount = 10, csvUpper = false, csvZipFileNamesKey = '', generateCsvZip = false, filters = {}, hideTitleCSV = false, csvExcludeUpper = [], filterSeparator = '|', filterStorageName = 'tableFilters', multipleDataPath = '', }) {
|
|
50
50
|
const [isLoading, setIsLoading] = (0, react_1.useState)(true);
|
|
51
51
|
const [error, setError] = (0, react_1.useState)(null);
|
|
52
52
|
const [data, setData] = (0, react_1.useState)(null);
|
|
@@ -81,6 +81,23 @@ function Table({ columns, fetchFunc, emptyMsg = {
|
|
|
81
81
|
status: j.statusCode,
|
|
82
82
|
});
|
|
83
83
|
else {
|
|
84
|
+
// if (multipleDataPath !== '') {
|
|
85
|
+
// ;(j as any[]).forEach((x) => {
|
|
86
|
+
// const list: any[] = x[multipleDataPath]
|
|
87
|
+
// if (list) {
|
|
88
|
+
// list.forEach((d) => {
|
|
89
|
+
// newData.push({
|
|
90
|
+
// ...x,
|
|
91
|
+
// dtInicio: d.inicio,
|
|
92
|
+
// hrInicio: d.hr_inicio,
|
|
93
|
+
// hrTermino: d.hr_termino,
|
|
94
|
+
// })
|
|
95
|
+
// })
|
|
96
|
+
// }
|
|
97
|
+
// })
|
|
98
|
+
// } else {
|
|
99
|
+
// newData = j
|
|
100
|
+
// }
|
|
84
101
|
setData(j);
|
|
85
102
|
startData = JSON.parse(JSON.stringify(j));
|
|
86
103
|
const oldFilters = localStorage.getItem(filterStorageName);
|
|
@@ -204,6 +221,20 @@ function Table({ columns, fetchFunc, emptyMsg = {
|
|
|
204
221
|
const start = currentPage * itemsCount;
|
|
205
222
|
return list.slice(start, start + itemsCount);
|
|
206
223
|
}, [list, itemsCount, currentPage]);
|
|
224
|
+
function defineCSVCells(key, cell) {
|
|
225
|
+
if (typeof cell === 'string') {
|
|
226
|
+
let item = csvUpper && !csvExcludeUpper.includes(key) ? cell.toUpperCase() : cell;
|
|
227
|
+
item = normalize ? item.normalize('NFD').replace(/[\u0300-\u036f]/g, '') : item;
|
|
228
|
+
return removeQuotes ? `${item}` : `"${item}"`;
|
|
229
|
+
}
|
|
230
|
+
else if (typeof cell === 'object' && !Array.isArray(cell) && cell !== null) {
|
|
231
|
+
let strItemAsObject = transformArrayObjectInString(cell).slice(1, -1); // key: label (Ex.: jsNaturezaEvento)
|
|
232
|
+
let item = csvUpper && !csvExcludeUpper.includes(key) ? strItemAsObject.toUpperCase() : strItemAsObject;
|
|
233
|
+
item = normalize ? item.normalize('NFD').replace(/[\u0300-\u036f]/g, '') : item;
|
|
234
|
+
return removeQuotes ? `${item}` : `"${item}"`;
|
|
235
|
+
}
|
|
236
|
+
return cell;
|
|
237
|
+
}
|
|
207
238
|
// download file
|
|
208
239
|
const downloadCSV = (0, react_1.useCallback)((e, zip = false) => {
|
|
209
240
|
e.preventDefault();
|
|
@@ -222,7 +253,6 @@ function Table({ columns, fetchFunc, emptyMsg = {
|
|
|
222
253
|
});
|
|
223
254
|
Object.keys(obj).forEach((objKey) => {
|
|
224
255
|
const values = [];
|
|
225
|
-
console.log("===== downloadCSV ==== 1");
|
|
226
256
|
obj[objKey].forEach((x) => {
|
|
227
257
|
let include = true;
|
|
228
258
|
originalKeys.forEach((k) => {
|
|
@@ -234,20 +264,12 @@ function Table({ columns, fetchFunc, emptyMsg = {
|
|
|
234
264
|
if (include) {
|
|
235
265
|
const value = keys
|
|
236
266
|
.map((k) => {
|
|
237
|
-
console.log(" DADOS 1 ");
|
|
238
|
-
console.log(x);
|
|
239
|
-
if (k === 'tbRa')
|
|
240
|
-
return x[k]['NO_CIDADE'];
|
|
241
|
-
if (k === 'rlEventoData')
|
|
242
|
-
return `${x[k][0]['DT_INICIO']} - ${x[k][0]['HR_INICIO']}`;
|
|
243
267
|
if (typeof x[k] === 'string') {
|
|
244
268
|
let item = csvUpper ? x[k].toUpperCase() : x[k];
|
|
245
269
|
item = normalize ? item.normalize('NFD').replace(/[\u0300-\u036f]/g, '') : item;
|
|
246
270
|
return removeQuotes ? `${item}` : `"${item}"`;
|
|
247
271
|
}
|
|
248
|
-
else if (typeof x[k] === 'object' &&
|
|
249
|
-
!Array.isArray(x[k]) &&
|
|
250
|
-
x[k] !== null) {
|
|
272
|
+
else if (typeof x[k] === 'object' && !Array.isArray(x[k]) && x[k] !== null) {
|
|
251
273
|
let strItemAsObject = transformArrayObjectInString(x[k]).slice(1, -1); // k: label (Ex.: jsNaturezaEvento)
|
|
252
274
|
let item = csvUpper && !csvExcludeUpper.includes(k) ? strItemAsObject.toUpperCase() : strItemAsObject;
|
|
253
275
|
item = normalize ? item.normalize('NFD').replace(/[\u0300-\u036f]/g, '') : item;
|
|
@@ -272,10 +294,20 @@ function Table({ columns, fetchFunc, emptyMsg = {
|
|
|
272
294
|
});
|
|
273
295
|
}
|
|
274
296
|
else {
|
|
275
|
-
|
|
297
|
+
let keys = originalKeys
|
|
298
|
+
.filter((k) => !csvExcludeKeysCSV.includes(k))
|
|
299
|
+
.map((k) => {
|
|
300
|
+
if (k === multipleDataPath) {
|
|
301
|
+
return 'hrTermino';
|
|
302
|
+
}
|
|
303
|
+
return k;
|
|
304
|
+
});
|
|
305
|
+
if (multipleDataPath !== '') {
|
|
306
|
+
keys = ['dtInicio', 'hrInicio', ...keys];
|
|
307
|
+
}
|
|
308
|
+
console.log(keys);
|
|
276
309
|
const header = keys.map((k) => (csvCustomKeyNames[k] ? csvCustomKeyNames[k] : k)).join(',') + '\n';
|
|
277
310
|
const values = [];
|
|
278
|
-
console.log("===== downloadCSV ==== 2");
|
|
279
311
|
list.forEach((x) => {
|
|
280
312
|
let include = true;
|
|
281
313
|
originalKeys.forEach((k) => {
|
|
@@ -287,29 +319,40 @@ function Table({ columns, fetchFunc, emptyMsg = {
|
|
|
287
319
|
if (include) {
|
|
288
320
|
const value = keys
|
|
289
321
|
.map((k) => {
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
if (k === '
|
|
293
|
-
return
|
|
294
|
-
if (k === '
|
|
295
|
-
return
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
!Array.isArray(x[k]) &&
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
322
|
+
if (k === 'dtInicio')
|
|
323
|
+
return '{dtInicio}';
|
|
324
|
+
else if (k === 'hrInicio')
|
|
325
|
+
return '{hrInicio}';
|
|
326
|
+
else if (k === 'hrTermino')
|
|
327
|
+
return '{hrTermino}';
|
|
328
|
+
else {
|
|
329
|
+
if (typeof x[k] === 'string') {
|
|
330
|
+
let item = csvUpper && !csvExcludeUpper.includes(k) ? x[k].toUpperCase() : x[k];
|
|
331
|
+
item = normalize ? item.normalize('NFD').replace(/[\u0300-\u036f]/g, '') : item;
|
|
332
|
+
return removeQuotes ? `${item}` : `"${item}"`;
|
|
333
|
+
}
|
|
334
|
+
else if (typeof x[k] === 'object' && !Array.isArray(x[k]) && x[k] !== null) {
|
|
335
|
+
let strItemAsObject = transformArrayObjectInString(x[k]).slice(1, -1); // k: label (Ex.: jsNaturezaEvento)
|
|
336
|
+
let item = csvUpper && !csvExcludeUpper.includes(k) ? strItemAsObject.toUpperCase() : strItemAsObject;
|
|
337
|
+
item = normalize ? item.normalize('NFD').replace(/[\u0300-\u036f]/g, '') : item;
|
|
338
|
+
return removeQuotes ? `${item}` : `"${item}"`;
|
|
339
|
+
}
|
|
340
|
+
return x[k];
|
|
308
341
|
}
|
|
309
|
-
return x[k];
|
|
310
342
|
})
|
|
311
343
|
.join(',');
|
|
312
|
-
|
|
344
|
+
if (multipleDataPath !== '') {
|
|
345
|
+
const dates = x[multipleDataPath];
|
|
346
|
+
if (dates) {
|
|
347
|
+
console.log(dates);
|
|
348
|
+
dates.forEach((d) => {
|
|
349
|
+
values.push(value.replace('{dtInicio}', d.dtInicio).replace('{hrInicio}', d.hrInicio).replace('{hrTermino}', d.hrTermino));
|
|
350
|
+
});
|
|
351
|
+
}
|
|
352
|
+
}
|
|
353
|
+
else {
|
|
354
|
+
values.push(value);
|
|
355
|
+
}
|
|
313
356
|
}
|
|
314
357
|
});
|
|
315
358
|
const csvData = header + values.join('\n');
|
|
@@ -322,38 +365,31 @@ function Table({ columns, fetchFunc, emptyMsg = {
|
|
|
322
365
|
}, [list]);
|
|
323
366
|
function transformArrayObjectInString(o) {
|
|
324
367
|
let arrString = [];
|
|
325
|
-
if (typeof o === 'object' &&
|
|
326
|
-
!Array.isArray(o) &&
|
|
327
|
-
o !== null) {
|
|
368
|
+
if (typeof o === 'object' && !Array.isArray(o) && o !== null) {
|
|
328
369
|
for (let [key, value] of Object.entries(o)) {
|
|
329
|
-
if (typeof value === 'object' &&
|
|
330
|
-
|
|
331
|
-
value !== null) {
|
|
332
|
-
arrString.push(key + ": " + transformArrayObjectInString(value));
|
|
370
|
+
if (typeof value === 'object' && !Array.isArray(value) && value !== null) {
|
|
371
|
+
arrString.push(key + ': ' + transformArrayObjectInString(value));
|
|
333
372
|
}
|
|
334
373
|
else {
|
|
335
|
-
if (value) {
|
|
374
|
+
if (value) {
|
|
375
|
+
// Is true
|
|
336
376
|
arrString.push(key);
|
|
337
377
|
}
|
|
338
378
|
}
|
|
339
379
|
}
|
|
340
380
|
}
|
|
341
|
-
return
|
|
381
|
+
return '[' + arrString.join(' - ') + ']';
|
|
342
382
|
}
|
|
343
|
-
;
|
|
344
383
|
const downloadCSVAll = (0, react_1.useCallback)((e) => {
|
|
345
384
|
e.preventDefault();
|
|
346
385
|
if (list.length <= 0)
|
|
347
386
|
return;
|
|
348
387
|
const keys = Object.keys(list[0]).filter((k) => !csvExcludeKeysAll.includes(k));
|
|
349
388
|
const header = keys.join(',') + '\n';
|
|
350
|
-
console.log("===== downloadCSVAll ==== 3");
|
|
351
389
|
const values = list
|
|
352
390
|
.map((x) => {
|
|
353
391
|
return keys
|
|
354
392
|
.map((k) => {
|
|
355
|
-
console.log(" DADOS 3 ");
|
|
356
|
-
console.log(x);
|
|
357
393
|
if (k === 'tbRa')
|
|
358
394
|
return x[k]['NO_CIDADE'];
|
|
359
395
|
if (k === 'rlEventoData')
|
|
@@ -363,9 +399,7 @@ function Table({ columns, fetchFunc, emptyMsg = {
|
|
|
363
399
|
item = normalize ? item.normalize('NFD').replace(/[\u0300-\u036f]/g, '') : item;
|
|
364
400
|
return removeQuotes ? `${item}` : `"${item}"`;
|
|
365
401
|
}
|
|
366
|
-
else if (typeof x[k] === 'object' &&
|
|
367
|
-
!Array.isArray(x[k]) &&
|
|
368
|
-
x[k] !== null) {
|
|
402
|
+
else if (typeof x[k] === 'object' && !Array.isArray(x[k]) && x[k] !== null) {
|
|
369
403
|
let strItemAsObject = transformArrayObjectInString(x[k]).slice(1, -1); // k: label (Ex.: jsNaturezaEvento)
|
|
370
404
|
let item = csvUpper && !csvExcludeUpper.includes(k) ? strItemAsObject.toUpperCase() : strItemAsObject;
|
|
371
405
|
item = normalize ? item.normalize('NFD').replace(/[\u0300-\u036f]/g, '') : item;
|