@ssplib/react-components 0.0.247 → 0.0.249

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.
Files changed (115) hide show
  1. package/package.json +2 -2
  2. package/src/components/detalhes/Category.js +7 -0
  3. package/src/components/detalhes/Field.js +35 -0
  4. package/src/components/detalhes/FieldLabel.js +21 -0
  5. package/src/components/detalhes/File.js +35 -0
  6. package/src/components/form/checkbox/CheckBox.js +12 -0
  7. package/{components → src/components}/form/checkbox/CheckBoxAdditional.js +11 -37
  8. package/src/components/form/checkbox/CheckBoxWarning.js +14 -0
  9. package/src/components/form/checkbox/RequiredCheckBoxValidator.js +56 -0
  10. package/src/components/form/date/DatePicker.js +71 -0
  11. package/src/components/form/date/TimePicker.js +53 -0
  12. package/src/components/form/file/DropFileUpload.js +207 -0
  13. package/src/components/form/file/FileUpload.js +171 -0
  14. package/src/components/form/input/ActiveInput.js +27 -0
  15. package/src/components/form/input/AutoComplete.js +40 -0
  16. package/src/components/form/input/FetchAutoComplete.js +103 -0
  17. package/src/components/form/input/FixedAutoComplete.js +46 -0
  18. package/{components → src/components}/form/input/Input.js +22 -52
  19. package/src/components/form/input/MaskInput.js +52 -0
  20. package/src/components/form/input/MultInput.js +38 -0
  21. package/src/components/form/input/OtherCheckBox.js +27 -0
  22. package/src/components/form/stepper/Stepper.js +105 -0
  23. package/src/components/form/stepper/StepperBlock.js +67 -0
  24. package/src/components/form/switch/Switch.js +27 -0
  25. package/src/components/form/switch/ToggleVisibility.js +33 -0
  26. package/{components → src/components}/form/table/Table.js +200 -230
  27. package/src/components/icons/icons.js +16 -0
  28. package/src/components/modal/Modal.js +75 -0
  29. package/src/components/navbar/NavBar.js +127 -0
  30. package/{components → src/components}/navbar/TabNavBar.d.ts +2 -1
  31. package/src/components/navbar/TabNavBar.js +135 -0
  32. package/src/components/providers/FormProvider.js +23 -0
  33. package/src/components/providers/KeycloakAuthProvider.js +69 -0
  34. package/{components → src/components}/providers/OAuthProvider.js +19 -49
  35. package/src/components/providers/SspComponentsProvider.js +11 -0
  36. package/{components → src/components}/utils/Bt.js +7 -13
  37. package/src/components/utils/CustomMenu.js +33 -0
  38. package/src/context/auth.js +2 -0
  39. package/{context → src/context}/form.d.ts +2 -3
  40. package/src/context/form.js +2 -0
  41. package/src/index.js +41 -0
  42. package/src/types/auth.js +1 -0
  43. package/{types → src/types}/form.js +4 -7
  44. package/components/detalhes/Category.js +0 -14
  45. package/components/detalhes/Field.js +0 -42
  46. package/components/detalhes/FieldLabel.js +0 -28
  47. package/components/detalhes/File.js +0 -62
  48. package/components/form/checkbox/CheckBox.js +0 -18
  49. package/components/form/checkbox/CheckBoxWarning.js +0 -43
  50. package/components/form/checkbox/RequiredCheckBoxValidator.js +0 -85
  51. package/components/form/date/DatePicker.js +0 -100
  52. package/components/form/date/TimePicker.js +0 -82
  53. package/components/form/file/DropFileUpload.js +0 -236
  54. package/components/form/file/FileUpload.js +0 -200
  55. package/components/form/input/ActiveInput.js +0 -33
  56. package/components/form/input/AutoComplete.js +0 -69
  57. package/components/form/input/FetchAutoComplete.js +0 -132
  58. package/components/form/input/FixedAutoComplete.js +0 -76
  59. package/components/form/input/MaskInput.js +0 -78
  60. package/components/form/input/MultInput.js +0 -67
  61. package/components/form/input/OtherCheckBox.js +0 -56
  62. package/components/form/stepper/Stepper.js +0 -135
  63. package/components/form/stepper/StepperBlock.js +0 -97
  64. package/components/form/switch/Switch.js +0 -54
  65. package/components/form/switch/ToggleVisibility.js +0 -61
  66. package/components/icons/icons.js +0 -24
  67. package/components/modal/Modal.js +0 -105
  68. package/components/navbar/NavBar.js +0 -156
  69. package/components/navbar/TabNavBar.js +0 -162
  70. package/components/providers/FormProvider.js +0 -49
  71. package/components/providers/KeycloakAuthProvider.js +0 -98
  72. package/components/providers/SspComponentsProvider.js +0 -18
  73. package/components/utils/CustomMenu.js +0 -39
  74. package/context/auth.js +0 -5
  75. package/context/form.js +0 -5
  76. package/index.js +0 -80
  77. package/types/auth.js +0 -2
  78. /package/{components → src/components}/detalhes/Category.d.ts +0 -0
  79. /package/{components → src/components}/detalhes/Field.d.ts +0 -0
  80. /package/{components → src/components}/detalhes/FieldLabel.d.ts +0 -0
  81. /package/{components → src/components}/detalhes/File.d.ts +0 -0
  82. /package/{components → src/components}/form/checkbox/CheckBox.d.ts +0 -0
  83. /package/{components → src/components}/form/checkbox/CheckBoxAdditional.d.ts +0 -0
  84. /package/{components → src/components}/form/checkbox/CheckBoxWarning.d.ts +0 -0
  85. /package/{components → src/components}/form/checkbox/RequiredCheckBoxValidator.d.ts +0 -0
  86. /package/{components → src/components}/form/date/DatePicker.d.ts +0 -0
  87. /package/{components → src/components}/form/date/TimePicker.d.ts +0 -0
  88. /package/{components → src/components}/form/file/DropFileUpload.d.ts +0 -0
  89. /package/{components → src/components}/form/file/FileUpload.d.ts +0 -0
  90. /package/{components → src/components}/form/input/ActiveInput.d.ts +0 -0
  91. /package/{components → src/components}/form/input/AutoComplete.d.ts +0 -0
  92. /package/{components → src/components}/form/input/FetchAutoComplete.d.ts +0 -0
  93. /package/{components → src/components}/form/input/FixedAutoComplete.d.ts +0 -0
  94. /package/{components → src/components}/form/input/Input.d.ts +0 -0
  95. /package/{components → src/components}/form/input/MaskInput.d.ts +0 -0
  96. /package/{components → src/components}/form/input/MultInput.d.ts +0 -0
  97. /package/{components → src/components}/form/input/OtherCheckBox.d.ts +0 -0
  98. /package/{components → src/components}/form/stepper/Stepper.d.ts +0 -0
  99. /package/{components → src/components}/form/stepper/StepperBlock.d.ts +0 -0
  100. /package/{components → src/components}/form/switch/Switch.d.ts +0 -0
  101. /package/{components → src/components}/form/switch/ToggleVisibility.d.ts +0 -0
  102. /package/{components → src/components}/form/table/Table.d.ts +0 -0
  103. /package/{components → src/components}/icons/icons.d.ts +0 -0
  104. /package/{components → src/components}/modal/Modal.d.ts +0 -0
  105. /package/{components → src/components}/navbar/NavBar.d.ts +0 -0
  106. /package/{components → src/components}/providers/FormProvider.d.ts +0 -0
  107. /package/{components → src/components}/providers/KeycloakAuthProvider.d.ts +0 -0
  108. /package/{components → src/components}/providers/OAuthProvider.d.ts +0 -0
  109. /package/{components → src/components}/providers/SspComponentsProvider.d.ts +0 -0
  110. /package/{components → src/components}/utils/Bt.d.ts +0 -0
  111. /package/{components → src/components}/utils/CustomMenu.d.ts +0 -0
  112. /package/{context → src/context}/auth.d.ts +0 -0
  113. /package/{index.d.ts → src/index.d.ts} +0 -0
  114. /package/{types → src/types}/auth.d.ts +0 -0
  115. /package/{types → src/types}/form.d.ts +0 -0
@@ -1,236 +0,0 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || function (mod) {
19
- if (mod && mod.__esModule) return mod;
20
- var result = {};
21
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
- __setModuleDefault(result, mod);
23
- return result;
24
- };
25
- var __importDefault = (this && this.__importDefault) || function (mod) {
26
- return (mod && mod.__esModule) ? mod : { "default": mod };
27
- };
28
- Object.defineProperty(exports, "__esModule", { value: true });
29
- const material_1 = require("@mui/material");
30
- const system_1 = require("@mui/system");
31
- const lodash_get_1 = __importDefault(require("lodash.get"));
32
- const react_1 = __importStar(require("react"));
33
- const auth_1 = require("../../../context/auth");
34
- const form_1 = require("../../../context/form");
35
- const react_dropzone_1 = require("react-dropzone");
36
- const axios_1 = __importDefault(require("axios"));
37
- const icons_1 = require("../../icons/icons");
38
- function bytesToMegabytes(bytes) {
39
- const megabytes = bytes / (1024 * 1024);
40
- return megabytes;
41
- }
42
- function bytesToKBorMB(bytes) {
43
- const KB = 1024;
44
- const MB = 1024 * KB;
45
- if (bytes < MB) {
46
- const KBValue = bytes / KB;
47
- return `${KBValue.toFixed(1)}KB`;
48
- }
49
- else {
50
- const MBValue = bytes / MB;
51
- return `${MBValue.toFixed(1)}MB`;
52
- }
53
- }
54
- function LinearProgressWithLabel(props) {
55
- return (react_1.default.createElement(material_1.Box, { sx: { display: 'flex', alignItems: 'center' } },
56
- react_1.default.createElement(material_1.Box, { sx: { width: '100%', mr: 1 } },
57
- react_1.default.createElement(material_1.LinearProgress, Object.assign({ variant: 'determinate' }, props))),
58
- react_1.default.createElement(material_1.Box, { sx: { minWidth: 3 } },
59
- react_1.default.createElement(material_1.Typography, { variant: 'body2', color: 'text.secondary' }, `${Math.round(props.value)}%`))));
60
- }
61
- function DropFileUpload({ name, tipoArquivo, title, required = false, multiple = false, apiURL, sizeLimit = 4, xs = 12, sm, md, route = '', tstToken = '', }) {
62
- const { getRootProps, getInputProps } = (0, react_dropzone_1.useDropzone)({
63
- multiple,
64
- onDrop: (dropFiles) => {
65
- const fileList = [];
66
- setProgress(-1);
67
- dropFiles
68
- .filter((file) => {
69
- if (bytesToMegabytes(file.size) > sizeLimit) {
70
- setErrorMsg(`Por favor, escolha um arquivo com tamanho inferior a ${sizeLimit} MB`);
71
- setTimeout(() => {
72
- setErrorMsg('');
73
- }, 3000);
74
- return false;
75
- }
76
- return true;
77
- })
78
- .forEach((file, index) => {
79
- let id = Date.now() + index;
80
- // fetch API
81
- const fd = new FormData();
82
- fd.append('files', file);
83
- fd.append('tipoArquivo', tipoArquivo);
84
- axios_1.default
85
- .post(apiURL, fd, {
86
- onUploadProgress: (progressEvent) => {
87
- const percentCompleted = Math.round((progressEvent.loaded * 100) / progressEvent.total);
88
- setProgress(percentCompleted);
89
- if (percentCompleted >= 100) {
90
- setFiles((f) => [...f, { id: id, name: file.name, loading: true, error: false, file: file, size: file.size }]);
91
- }
92
- },
93
- headers: { Authorization: `Bearer ${tstToken === '' ? (user ? user.token : '') : tstToken}` },
94
- })
95
- .then((res) => {
96
- if (res.status > 200) {
97
- const fileIdFromApi = (0, lodash_get_1.default)(res.data, route, res.data)[0];
98
- const fileId = fileIdFromApi['coSeqArquivo'];
99
- context.setFilesUid((fId) => [
100
- ...fId,
101
- {
102
- CO_SEQ_ARQUIVO: fileId,
103
- CO_TIPO_ARQUIVO: parseInt(tipoArquivo),
104
- },
105
- ]);
106
- setFilesLoaded((fl) => [...fl, id]);
107
- const f = {};
108
- f[id] = fileId;
109
- setFilesIds((ids) => (Object.assign(Object.assign({}, ids), f)));
110
- }
111
- else {
112
- setProgress(-1);
113
- removeFile(id);
114
- }
115
- })
116
- .catch((err) => {
117
- console.log(err);
118
- setProgress(-1);
119
- removeFile(id);
120
- });
121
- });
122
- },
123
- });
124
- const context = (0, react_1.useContext)(form_1.FormContext);
125
- const { user } = (0, react_1.useContext)(auth_1.AuthContext);
126
- const theme = (0, material_1.useTheme)();
127
- const isSmall = (0, material_1.useMediaQuery)(theme.breakpoints.only('xs'));
128
- const [progress, setProgress] = (0, react_1.useState)(-1);
129
- const [files, setFiles] = (0, react_1.useState)([]);
130
- const [filesLoaded, setFilesLoaded] = (0, react_1.useState)([]);
131
- const [fileIds, setFilesIds] = (0, react_1.useState)({});
132
- // const [filesError, setFilesError] = useState<number[]>([])
133
- const [errorMsg, setErrorMsg] = (0, react_1.useState)('');
134
- const removeFile = (id, hideMsg, fileId) => {
135
- setFiles(files.filter((x) => x.id !== id));
136
- if (fileId)
137
- context.setFilesUid((fId) => fId.filter((idd) => idd.CO_SEQ_ARQUIVO !== fileId));
138
- if (!hideMsg) {
139
- setErrorMsg('Erro ao enviar arquivo. Verifique o formato e tente mais tarde.');
140
- setTimeout(() => {
141
- setErrorMsg('');
142
- }, 3000);
143
- }
144
- };
145
- const deleteFile = (e, id) => {
146
- if (Object.keys(fileIds).includes(id.toString())) {
147
- fetch(`${apiURL}/${fileIds[id]}`, {
148
- method: 'DELETE',
149
- headers: {
150
- Authorization: `Bearer ${tstToken === '' ? (user ? user.token : '') : tstToken}`,
151
- },
152
- })
153
- .then((res) => {
154
- if (!res.ok)
155
- removeFile(id, true, fileIds[id]);
156
- if (res.status === 200) {
157
- removeFile(id, true, fileIds[id]);
158
- }
159
- })
160
- .catch((err) => console.log(err));
161
- }
162
- };
163
- (0, react_1.useEffect)(() => {
164
- const dt = new DataTransfer();
165
- files.forEach((x) => {
166
- dt.items.add(x.file);
167
- });
168
- context === null || context === void 0 ? void 0 : context.formSetValue(name, dt.files);
169
- }, [files, context, name]);
170
- (0, react_1.useEffect)(() => {
171
- return () => {
172
- context.setFilesUid((files) => files.filter((x) => x.CO_TIPO_ARQUIVO !== parseInt(tipoArquivo)));
173
- };
174
- }, []);
175
- return (react_1.default.createElement(material_1.Grid, Object.assign({ item: true }, { xs, sm, md }, { sx: { width: '100%' } }),
176
- react_1.default.createElement(material_1.Box, { bgcolor: 'white', p: 2, borderRadius: '8px', color: '#1E293B' },
177
- react_1.default.createElement(material_1.InputLabel, { required: required, sx: { marginBottom: 2, textTransform: 'capitalize' } }, title),
178
- react_1.default.createElement(system_1.Stack, Object.assign({}, getRootProps({ className: 'dropzone' }), { bgcolor: '#EFEFEF', justifyContent: 'center', alignItems: 'center', textAlign: 'center', borderRadius: '6px', py: 8, border: 'solid 1.5px #989898', sx: {
179
- borderStyle: 'dashed',
180
- cursor: 'pointer',
181
- } }),
182
- react_1.default.createElement("input", Object.assign({}, getInputProps(), context.formRegister(name, {
183
- validate: (v, f) => {
184
- if ((v.length && filesLoaded.length) <= 0 && required)
185
- return 'O campo de arquivo é obrigatório';
186
- },
187
- }))),
188
- react_1.default.createElement(system_1.Stack, { spacing: 2, alignItems: 'center' },
189
- react_1.default.createElement(material_1.Box, null,
190
- react_1.default.createElement(material_1.Typography, { fontWeight: 600, fontSize: 18 }, "Arraste seus arquivos at\u00E9 aqui"),
191
- react_1.default.createElement(material_1.Typography, null, "ou selecione arquivos que est\u00E3o no seu computador")),
192
- react_1.default.createElement(material_1.Button, { variant: 'contained', sx: {
193
- backgroundColor: '#64748B',
194
- pointerEvents: 'none',
195
- borderRadius: '8px',
196
- width: 'fit-content',
197
- } }, "Selecionar"),
198
- react_1.default.createElement(material_1.Typography, { fontWeight: 300 },
199
- "Tamanho m\u00E1ximo por arquivo ",
200
- sizeLimit,
201
- "MB"))),
202
- react_1.default.createElement(material_1.Typography, { pt: 2, fontSize: 16, fontWeight: 600 },
203
- "Voc\u00EA selecionou ",
204
- files.length,
205
- " arquivo",
206
- files.length > 1 ? 's' : '',
207
- "."),
208
- react_1.default.createElement(system_1.Stack, { width: '100%', marginTop: 1, spacing: 1 },
209
- files.map((x) => (react_1.default.createElement(system_1.Stack, { direction: 'row', justifyContent: 'space-between', border: 'solid 1px #E2E8F0', borderRadius: 2, p: 1 },
210
- react_1.default.createElement(system_1.Stack, { direction: 'row' },
211
- react_1.default.createElement(system_1.Stack, { direction: 'row', justifyContent: 'center', alignItems: 'center', minWidth: 30, pr: 1.5 },
212
- react_1.default.createElement(icons_1.PDFIcon, { sx: {
213
- filter: 'invert(42%) sepia(86%) saturate(2412%) hue-rotate(326deg) brightness(86%) contrast(102%)',
214
- transform: 'scale(1.5)',
215
- width: 30,
216
- } })),
217
- react_1.default.createElement(system_1.Stack, null,
218
- react_1.default.createElement(material_1.Typography, { fontWeight: 600 }, x.name),
219
- react_1.default.createElement(material_1.Typography, { fontSize: 14 }, bytesToKBorMB(x.size)))),
220
- react_1.default.createElement(material_1.Button, { size: 'small', startIcon: react_1.default.createElement(icons_1.TrashIcon, null), variant: 'contained', onClick: (e) => deleteFile(e, x.id), sx: {
221
- height: 40,
222
- backgroundColor: '#DE3F50',
223
- borderRadius: '8px',
224
- } }, "Remover")))),
225
- progress > 0 && progress < 100 && (react_1.default.createElement(LinearProgressWithLabel, { value: progress, sx: {
226
- backgroundColor: '#103D6A',
227
- '.MuiLinearProgress-bar': {
228
- backgroundColor: '#BDDDFA',
229
- },
230
- } }))),
231
- errorMsg && (react_1.default.createElement(react_1.default.Fragment, null,
232
- react_1.default.createElement(material_1.Typography, { variant: 'caption', color: '#e53935', fontWeight: 600, fontSize: 14, paddingTop: 2 }, errorMsg),
233
- react_1.default.createElement("br", null))),
234
- (0, lodash_get_1.default)(context === null || context === void 0 ? void 0 : context.errors, name) && (react_1.default.createElement(material_1.Typography, { variant: 'caption', color: '#e53935', fontWeight: 600, fontSize: 14 }, "* O campo de arquivo \u00E9 obrigat\u00F3rio")))));
235
- }
236
- exports.default = DropFileUpload;
@@ -1,200 +0,0 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || function (mod) {
19
- if (mod && mod.__esModule) return mod;
20
- var result = {};
21
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
- __setModuleDefault(result, mod);
23
- return result;
24
- };
25
- var __importDefault = (this && this.__importDefault) || function (mod) {
26
- return (mod && mod.__esModule) ? mod : { "default": mod };
27
- };
28
- Object.defineProperty(exports, "__esModule", { value: true });
29
- const CameraAlt_1 = __importDefault(require("@mui/icons-material/CameraAlt"));
30
- const Delete_1 = __importDefault(require("@mui/icons-material/Delete"));
31
- const Done_1 = __importDefault(require("@mui/icons-material/Done"));
32
- const InsertDriveFile_1 = __importDefault(require("@mui/icons-material/InsertDriveFile"));
33
- const PictureAsPdf_1 = __importDefault(require("@mui/icons-material/PictureAsPdf"));
34
- const material_1 = require("@mui/material");
35
- const system_1 = require("@mui/system");
36
- const lodash_get_1 = __importDefault(require("lodash.get"));
37
- const react_1 = __importStar(require("react"));
38
- const auth_1 = require("../../../context/auth");
39
- const form_1 = require("../../../context/form");
40
- function bytesToMegabytes(bytes) {
41
- const megabytes = bytes / (1024 * 1024);
42
- return megabytes;
43
- }
44
- function FileUpload({ name, tipoArquivo, title, required = false, multiple = false, apiURL, route = '', sizeLimit = 4, xs = 12, sm, md, }) {
45
- const context = (0, react_1.useContext)(form_1.FormContext);
46
- const { user } = (0, react_1.useContext)(auth_1.AuthContext);
47
- const theme = (0, material_1.useTheme)();
48
- const isSmall = (0, material_1.useMediaQuery)(theme.breakpoints.only('xs'));
49
- const [files, setFiles] = (0, react_1.useState)([]);
50
- const [filesLoaded, setFilesLoaded] = (0, react_1.useState)([]);
51
- const [fileIds, setFilesIds] = (0, react_1.useState)({});
52
- // const [filesError, setFilesError] = useState<number[]>([])
53
- const [errorMsg, setErrorMsg] = (0, react_1.useState)('');
54
- const onFile = (0, react_1.useCallback)((e) => {
55
- const newFiles = e.target.files;
56
- const filesTo = Object.keys(newFiles).map((key) => newFiles[key]);
57
- setFiles([
58
- ...files,
59
- ...filesTo
60
- .filter((file) => {
61
- if (bytesToMegabytes(file.size) > sizeLimit) {
62
- setErrorMsg(`Por favor, escolha um arquivo com tamanho inferior a ${sizeLimit} MB`);
63
- setTimeout(() => {
64
- setErrorMsg('');
65
- }, 3000);
66
- return false;
67
- }
68
- return true;
69
- })
70
- .map((file, index) => {
71
- let id = Date.now() + index;
72
- // fetch API
73
- const fd = new FormData();
74
- fd.append('files', file);
75
- fd.append('tipoArquivo', tipoArquivo);
76
- fetch(apiURL, {
77
- method: 'POST',
78
- body: fd,
79
- headers: {
80
- Authorization: `Bearer ${user ? user.token : ''}`,
81
- },
82
- })
83
- .then((res) => {
84
- if (!res.ok) {
85
- removeFile(id);
86
- return;
87
- }
88
- res.json().then((j) => {
89
- if (j.status && j.status.status === 200) {
90
- const fileIdFromApi = (0, lodash_get_1.default)(j, route, j)[0];
91
- const fileId = fileIdFromApi['coSeqArquivo'];
92
- context.setFilesUid((fId) => [
93
- ...fId,
94
- {
95
- CO_SEQ_ARQUIVO: fileId,
96
- CO_TIPO_ARQUIVO: parseInt(tipoArquivo),
97
- },
98
- ]);
99
- setFilesLoaded((fl) => [...fl, id]);
100
- const f = {};
101
- f[id] = fileId;
102
- setFilesIds((ids) => (Object.assign(Object.assign({}, ids), f)));
103
- }
104
- else {
105
- removeFile(id);
106
- }
107
- });
108
- })
109
- .catch((err) => {
110
- removeFile(id);
111
- });
112
- return { id: id, name: file.name, loading: true, error: false, file: file };
113
- }),
114
- ]);
115
- }, [files, context]);
116
- const removeFile = (id, hideMsg, fileId) => {
117
- setFiles(files.filter((x) => x.id !== id));
118
- if (fileId)
119
- context.setFilesUid((fId) => fId.filter((idd) => idd.CO_SEQ_ARQUIVO !== fileId));
120
- if (!hideMsg) {
121
- setErrorMsg('Erro ao enviar arquivo. Tente novamente mais tarde');
122
- setTimeout(() => {
123
- setErrorMsg('');
124
- }, 3000);
125
- }
126
- };
127
- const deleteFile = (e, id) => {
128
- if (Object.keys(fileIds).includes(id.toString())) {
129
- fetch(`${apiURL}/${fileIds[id]}`, {
130
- method: 'DELETE',
131
- headers: {
132
- Authorization: `Bearer ${user === null || user === void 0 ? void 0 : user.token}`,
133
- },
134
- })
135
- .then((res) => {
136
- if (!res.ok)
137
- removeFile(id, true, fileIds[id]);
138
- if (res.status === 200) {
139
- removeFile(id, true, fileIds[id]);
140
- }
141
- })
142
- .catch((err) => console.log(err));
143
- }
144
- };
145
- (0, react_1.useEffect)(() => {
146
- const dt = new DataTransfer();
147
- files.forEach((x) => {
148
- dt.items.add(x.file);
149
- });
150
- context === null || context === void 0 ? void 0 : context.formSetValue(name, dt.files);
151
- }, [files, context, name]);
152
- (0, react_1.useEffect)(() => {
153
- return () => {
154
- context.setFilesUid((files) => files.filter((x) => x.CO_TIPO_ARQUIVO !== parseInt(tipoArquivo)));
155
- };
156
- }, []);
157
- return (react_1.default.createElement(material_1.Grid, Object.assign({ item: true }, { xs, sm, md }, { sx: { width: '100%' } }),
158
- react_1.default.createElement(material_1.InputLabel, { required: required, sx: { marginBottom: 2, textTransform: 'capitalize' } }, title),
159
- react_1.default.createElement(material_1.Box, { sx: { backgroundColor: '#e2eafc', padding: 1, borderRadius: 1, marginTop: 1 } },
160
- react_1.default.createElement("input", Object.assign({ id: name, type: 'file', multiple: multiple }, context === null || context === void 0 ? void 0 : context.formRegister(name, {
161
- validate: (v, f) => {
162
- if ((v.length && filesLoaded.length) <= 0 && required)
163
- return 'O campo de arquivo é obrigatório';
164
- },
165
- }), { onChange: onFile, accept: '.pdf', style: { display: 'none' } })),
166
- react_1.default.createElement("input", Object.assign({ id: name + 'foto', type: 'file', capture: 'environment', multiple: multiple }, context === null || context === void 0 ? void 0 : context.formRegister(name, {
167
- validate: (v, f) => {
168
- if ((v.length && filesLoaded.length) <= 0 && required)
169
- return 'O campo de arquivo é obrigatório';
170
- },
171
- }), { onChange: onFile, accept: '.jpg, .png, .jpeg', style: { display: 'none' } })),
172
- react_1.default.createElement(material_1.Box, { sx: {
173
- display: {
174
- sx: 'block',
175
- md: 'flex',
176
- },
177
- } },
178
- react_1.default.createElement(material_1.Box, { sx: { width: '100%', marginRight: { xs: 0, md: 1 }, marginBottom: { xs: 1, md: 0 } } }, !multiple && files.length >= 1 ? (react_1.default.createElement(material_1.Button, { disabled: true, variant: 'contained', disableElevation: true, startIcon: react_1.default.createElement(InsertDriveFile_1.default, null), component: 'span', sx: { textTransform: 'none' }, fullWidth: true }, "Escolher Documento")) : (react_1.default.createElement("label", { htmlFor: name },
179
- react_1.default.createElement(material_1.Button, { variant: 'contained', disableElevation: true, startIcon: react_1.default.createElement(InsertDriveFile_1.default, null), component: 'span', sx: { textTransform: 'none' }, fullWidth: true }, "Escolher Documento")))),
180
- react_1.default.createElement(material_1.Box, { sx: { width: '100%' } }, !multiple && files.length >= 1 ? (react_1.default.createElement(material_1.Button, { disabled: true, variant: 'contained', disableElevation: true, startIcon: react_1.default.createElement(CameraAlt_1.default, null), component: 'span', sx: { textTransform: 'none', backgroundColor: '#0096c7' }, fullWidth: true }, isSmall ? 'Tirar Foto' : 'Escolher Imagem')) : (react_1.default.createElement("label", { htmlFor: name + 'foto' },
181
- react_1.default.createElement(material_1.Button, { variant: 'contained', disableElevation: true, startIcon: react_1.default.createElement(CameraAlt_1.default, null), component: 'span', sx: { textTransform: 'none', backgroundColor: '#0096c7' }, fullWidth: true }, isSmall ? 'Tirar Foto' : 'Escolher Imagem'))))),
182
- react_1.default.createElement(material_1.Typography, { fontWeight: 600, paddingY: 1, color: 'black' },
183
- "Voc\u00EA selecionou ",
184
- files.length,
185
- " arquivo",
186
- files.length > 1 && 's'),
187
- files.length > 0 && (react_1.default.createElement(material_1.TableContainer, { component: material_1.Paper },
188
- react_1.default.createElement(system_1.Stack, { direction: 'column' }, files.map((x) => (react_1.default.createElement(system_1.Stack, { key: x.name, direction: 'row', justifyContent: 'space-between', padding: 0.5 },
189
- react_1.default.createElement(material_1.Box, null,
190
- react_1.default.createElement(system_1.Stack, { direction: 'row', spacing: 2 },
191
- filesLoaded.includes(x.id) ? react_1.default.createElement(Done_1.default, { sx: { fill: '#06d6a0' } }) : react_1.default.createElement(material_1.CircularProgress, { size: 22, sx: { color: 'black' } }),
192
- react_1.default.createElement(PictureAsPdf_1.default, { color: 'error' }),
193
- react_1.default.createElement(material_1.Typography, { fontWeight: 600 }, x.name))),
194
- react_1.default.createElement(material_1.Box, null, filesLoaded.includes(x.id) && (react_1.default.createElement(material_1.Button, { variant: 'contained', size: 'small', sx: { textTransform: 'none', backgroundColor: '#d1495b', '&:hover': { backgroundColor: '#c1121f' } }, onClick: (e) => deleteFile(e, x.id), startIcon: react_1.default.createElement(Delete_1.default, null) }, "Remover"))))))))),
195
- errorMsg && (react_1.default.createElement(react_1.default.Fragment, null,
196
- react_1.default.createElement(material_1.Typography, { variant: 'caption', color: '#e53935', fontWeight: 600, fontSize: 14, paddingTop: 2 }, errorMsg),
197
- react_1.default.createElement("br", null))),
198
- (0, lodash_get_1.default)(context === null || context === void 0 ? void 0 : context.errors, name) && (react_1.default.createElement(material_1.Typography, { variant: 'caption', color: '#e53935', fontWeight: 600, fontSize: 14 }, "* O campo de arquivo \u00E9 obrigat\u00F3rio")))));
199
- }
200
- exports.default = FileUpload;
@@ -1,33 +0,0 @@
1
- "use strict";
2
- var __rest = (this && this.__rest) || function (s, e) {
3
- var t = {};
4
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
5
- t[p] = s[p];
6
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
7
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
8
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
9
- t[p[i]] = s[p[i]];
10
- }
11
- return t;
12
- };
13
- var __importDefault = (this && this.__importDefault) || function (mod) {
14
- return (mod && mod.__esModule) ? mod : { "default": mod };
15
- };
16
- Object.defineProperty(exports, "__esModule", { value: true });
17
- const material_1 = require("@mui/material");
18
- const InputLabel_1 = __importDefault(require("@mui/material/InputLabel"));
19
- const react_1 = __importDefault(require("react"));
20
- const Switch_1 = __importDefault(require("../switch/Switch"));
21
- const ToggleVisibility_1 = require("../switch/ToggleVisibility");
22
- const Input_1 = require("./Input");
23
- function FileUpload(_a) {
24
- var { name, required = false, title, defaultChecked = false, xs = 12, unregisterNameList, sm, md } = _a, props = __rest(_a, ["name", "required", "title", "defaultChecked", "xs", "unregisterNameList", "sm", "md"]);
25
- const switchName = `${name}-switch`;
26
- return (react_1.default.createElement(material_1.Grid, Object.assign({ item: true }, { xs, sm, md }),
27
- title && (react_1.default.createElement(InputLabel_1.default, { required: required, sx: { textTransform: 'capitalize' } }, title)),
28
- react_1.default.createElement(material_1.Stack, { direction: 'row' },
29
- react_1.default.createElement(Switch_1.default, { name: switchName, defaultChecked: defaultChecked }),
30
- react_1.default.createElement(ToggleVisibility_1.SwitchWatch, { switchId: switchName, unregisterNameList: unregisterNameList },
31
- react_1.default.createElement(Input_1.Input, { name: 'ddd', type: 'input' })))));
32
- }
33
- exports.default = FileUpload;
@@ -1,69 +0,0 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || function (mod) {
19
- if (mod && mod.__esModule) return mod;
20
- var result = {};
21
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
- __setModuleDefault(result, mod);
23
- return result;
24
- };
25
- var __importDefault = (this && this.__importDefault) || function (mod) {
26
- return (mod && mod.__esModule) ? mod : { "default": mod };
27
- };
28
- Object.defineProperty(exports, "__esModule", { value: true });
29
- const material_1 = require("@mui/material");
30
- const InputLabel_1 = __importDefault(require("@mui/material/InputLabel"));
31
- const lodash_get_1 = __importDefault(require("lodash.get"));
32
- const react_1 = __importStar(require("react"));
33
- const react_query_1 = require("react-query");
34
- const auth_1 = require("../../../context/auth");
35
- const form_1 = require("../../../context/form");
36
- function AutoComplete({ name, required = false, title, customPlaceholder, url, xs = 12, sm, md, dataPath = '', }) {
37
- const context = (0, react_1.useContext)(form_1.FormContext);
38
- const { user } = (0, react_1.useContext)(auth_1.AuthContext);
39
- const [options, setOptions] = (0, react_1.useState)([]);
40
- const { isLoading, data, error } = (0, react_query_1.useQuery)(`autocomplete-${name}`, () => fetch(url, {
41
- headers: {
42
- Authorization: `Bearer ${user ? user.token : ''}`,
43
- },
44
- }).then((x) => x.json().then((list) => setOptions(getData(list)))));
45
- // transformar isso em um component ou utils
46
- const getData = (0, react_1.useCallback)((dt) => {
47
- if (Array.isArray(dt))
48
- return dt;
49
- if (typeof dt === 'object')
50
- return (0, lodash_get_1.default)(dt, dataPath);
51
- }, []);
52
- const onSelect = (0, react_1.useCallback)((e, value) => {
53
- context === null || context === void 0 ? void 0 : context.formSetValue(name, value ? value.id : '');
54
- context === null || context === void 0 ? void 0 : context.formTrigger(name);
55
- }, [context, name]);
56
- return (react_1.default.createElement(material_1.Grid, Object.assign({ item: true }, { xs, sm, md }),
57
- title && react_1.default.createElement(InputLabel_1.default, { required: required }, title),
58
- react_1.default.createElement("input", Object.assign({ type: 'text' }, context === null || context === void 0 ? void 0 : context.formRegister(name, {
59
- validate: (v, f) => {
60
- if (v.length <= 0 && required)
61
- return 'Este campo é obrigatório';
62
- },
63
- }), { hidden: true })),
64
- react_1.default.createElement(material_1.Autocomplete, { options: options, isOptionEqualToValue: (option, value) => option.id === value.id, onChange: onSelect, renderInput: (params) => {
65
- var _a;
66
- return (react_1.default.createElement(material_1.TextField, Object.assign({}, params, { placeholder: customPlaceholder, size: 'small', 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 })));
67
- } })));
68
- }
69
- exports.default = AutoComplete;