@ssplib/react-components 0.0.293 → 0.0.295
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/Map-31d95a26.js +2 -0
- package/Map-31d95a26.js.map +1 -0
- package/Map-644d2f90.js +2 -0
- package/Map-644d2f90.js.map +1 -0
- package/components/detalhes/Category.d.ts +0 -1
- package/components/detalhes/Field.d.ts +0 -1
- package/components/detalhes/FieldLabel.d.ts +0 -1
- package/components/detalhes/File.d.ts +0 -1
- package/components/form/checkbox/CheckBoxAdditional.d.ts +0 -1
- package/components/form/checkbox/RequiredCheckBoxValidator.d.ts +0 -1
- package/components/form/date/DatePicker.d.ts +0 -1
- package/components/form/date/GenericDatePicker.d.ts +0 -1
- package/components/form/date/TimePicker.d.ts +0 -1
- package/components/form/file/DropFileUpload.d.ts +0 -1
- package/components/form/file/FileUpload.d.ts +0 -1
- package/components/form/input/AutoComplete.d.ts +0 -1
- package/components/form/input/FetchAutoComplete.d.ts +0 -1
- package/components/form/input/FixedAutoComplete.d.ts +0 -1
- package/components/form/input/GenericFetchAutoComplete.d.ts +0 -1
- package/components/form/input/GenericMultInput.d.ts +0 -1
- package/components/form/input/MultInput.d.ts +0 -1
- package/components/form/input/OptionalInput.d.ts +10 -0
- package/components/form/input/OtherCheckBox.d.ts +0 -1
- package/components/form/switch/ToggleVisibility.d.ts +0 -1
- package/components/form/table/FilterSection.d.ts +0 -1
- package/components/form/table/TableLoadingState.d.ts +0 -1
- package/components/form/table/utils.d.ts +0 -1
- package/components/icons/icons.d.ts +0 -1
- package/components/loading/LinearProgress.d.ts +2 -0
- package/components/loading/LoadingScreen.d.ts +7 -0
- package/components/map/index.d.ts +0 -1
- package/components/modal/Modal.d.ts +0 -1
- package/components/navbar/NavBar.d.ts +0 -1
- package/components/navbar/TabNavBar.d.ts +0 -1
- package/components/providers/GenericFormProvider.d.ts +10 -0
- package/components/providers/KeycloakAuthProvider.d.ts +0 -1
- package/components/providers/OAuthProvider.d.ts +0 -1
- package/components/providers/SspComponentsProvider.d.ts +0 -1
- package/components/teste/Teste.d.ts +3 -0
- package/components/utils/Bt.d.ts +0 -1
- package/context/auth.d.ts +0 -1
- package/decorators/FormBaseDecorator.d.ts +2 -0
- package/decorators/GenericFormBaseDecorator.d.ts +2 -0
- package/decorators/StepperDecorator.d.ts +2 -0
- package/index.cjs +3 -0
- package/index.cjs.map +1 -0
- package/index.d.ts +18 -18
- package/index.esm.js +3 -0
- package/index.esm.js.map +1 -0
- package/package.json +1 -1
- package/stories/Autocomplete.stories.d.ts +6 -0
- package/stories/CheckBox.stories.d.ts +6 -0
- package/stories/CheckBoxWarning.stories.d.ts +6 -0
- package/stories/DatePicker.stories.d.ts +6 -0
- package/stories/DetalhesCategory.stories.d.ts +6 -0
- package/stories/DetalhesField.stories.d.ts +6 -0
- package/stories/DetalhesFieldLabel.stories.d.ts +6 -0
- package/stories/DetalhesFile.stories.d.ts +6 -0
- package/stories/DropFileUpload.stories.d.ts +6 -0
- package/stories/ExemploAssitirValorInput.stories.d.ts +7 -0
- package/stories/ExemploInputs.stories.d.ts +7 -0
- package/stories/ExemploTable.stories.d.ts +1 -0
- package/stories/ExemploValoresCompartilhados.stories.d.ts +7 -0
- package/stories/FetchAutocomplete.stories.d.ts +6 -0
- package/stories/FileUpload.stories.d.ts +6 -0
- package/stories/FixedAutocomplete.stories.d.ts +6 -0
- package/stories/GenericFetchAutocomplete.stories.d.ts +6 -0
- package/stories/GenericInput.stories.d.ts +6 -0
- package/stories/GenericTable.stories.d.ts +6 -0
- package/stories/Input.stories.d.ts +6 -0
- package/stories/LinearProgress.stories.d.ts +6 -0
- package/stories/LoadingScreen.stories.d.ts +6 -0
- package/stories/Map.stories.d.ts +6 -0
- package/stories/MultInput.stories.d.ts +6 -0
- package/stories/NavBar.stories.d.ts +6 -0
- package/stories/OptionalInput.stories.d.ts +6 -0
- package/stories/OtherCheckBox.stories.d.ts +6 -0
- package/stories/Stepper.stories.d.ts +6 -0
- package/stories/StepperBlock.stories.d.ts +6 -0
- package/stories/Switch.stories.d.ts +6 -0
- package/stories/Table.stories.d.ts +4 -0
- package/stories/TableWithStaticData.stories.d.ts +6 -0
- package/stories/Teste.stories.d.ts +6 -0
- package/stories/TimePicker.stories.d.ts +6 -0
- package/components/detalhes/Category.js +0 -14
- package/components/detalhes/Field.js +0 -42
- package/components/detalhes/FieldLabel.js +0 -28
- package/components/detalhes/File.js +0 -62
- package/components/form/checkbox/CheckBox.js +0 -18
- package/components/form/checkbox/CheckBoxAdditional.js +0 -95
- package/components/form/checkbox/CheckBoxWarning.js +0 -43
- package/components/form/checkbox/RequiredCheckBoxValidator.js +0 -85
- package/components/form/date/DatePicker.js +0 -105
- package/components/form/date/GenericDatePicker.js +0 -105
- package/components/form/date/TimePicker.js +0 -82
- package/components/form/file/DropFileUpload.js +0 -226
- package/components/form/file/FileUpload.js +0 -200
- package/components/form/input/ActiveInput.js +0 -33
- package/components/form/input/AutoComplete.js +0 -69
- package/components/form/input/FetchAutoComplete.js +0 -132
- package/components/form/input/FixedAutoComplete.js +0 -81
- package/components/form/input/GenericFetchAutoComplete.js +0 -132
- package/components/form/input/GenericInput.js +0 -168
- package/components/form/input/GenericMaskInput.js +0 -79
- package/components/form/input/GenericMultInput.js +0 -67
- package/components/form/input/Input.js +0 -168
- package/components/form/input/MaskInput.js +0 -78
- package/components/form/input/MultInput.js +0 -67
- package/components/form/input/OtherCheckBox.js +0 -56
- package/components/form/stepper/Stepper.js +0 -135
- package/components/form/stepper/StepperBlock.js +0 -97
- package/components/form/switch/Switch.js +0 -54
- package/components/form/switch/ToggleVisibility.js +0 -61
- package/components/form/table/FilterSection.js +0 -217
- package/components/form/table/GenericTable.js +0 -1034
- package/components/form/table/Table.js +0 -514
- package/components/form/table/TableErrorState.js +0 -27
- package/components/form/table/TableLoadingState.js +0 -39
- package/components/form/table/types.js +0 -2
- package/components/form/table/utils.js +0 -361
- package/components/icons/icons.js +0 -24
- package/components/map/AnimatedMarker.js +0 -65
- package/components/map/DraggableMarker.js +0 -66
- package/components/map/Map.js +0 -23
- package/components/map/index.js +0 -31
- package/components/modal/Modal.js +0 -105
- package/components/navbar/NavBar.js +0 -171
- package/components/navbar/TabNavBar.js +0 -179
- package/components/providers/FormProvider.js +0 -54
- package/components/providers/KeycloakAuthProvider.js +0 -118
- package/components/providers/OAuthProvider.js +0 -138
- package/components/providers/SspComponentsProvider.js +0 -18
- package/components/utils/Bt.js +0 -35
- package/components/utils/CustomMenu.js +0 -39
- package/context/auth.js +0 -5
- package/context/form.js +0 -5
- package/index.js +0 -94
- package/types/auth.js +0 -2
- package/types/form.js +0 -31
|
@@ -1,514 +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
|
-
exports.Table = void 0;
|
|
30
|
-
const TableErrorState_1 = require("./TableErrorState");
|
|
31
|
-
const icons_material_1 = require("@mui/icons-material");
|
|
32
|
-
const Clear_1 = __importDefault(require("@mui/icons-material/Clear"));
|
|
33
|
-
const FileDownload_1 = __importDefault(require("@mui/icons-material/FileDownload"));
|
|
34
|
-
const NavigateNextRounded_1 = __importDefault(require("@mui/icons-material/NavigateNextRounded"));
|
|
35
|
-
const Search_1 = __importDefault(require("@mui/icons-material/Search"));
|
|
36
|
-
const material_1 = require("@mui/material");
|
|
37
|
-
const Grid_1 = __importDefault(require("@mui/material/Grid"));
|
|
38
|
-
const Pagination_1 = __importDefault(require("@mui/material/Pagination"));
|
|
39
|
-
const TextField_1 = __importDefault(require("@mui/material/TextField"));
|
|
40
|
-
const Typography_1 = __importDefault(require("@mui/material/Typography"));
|
|
41
|
-
const lodash_get_1 = __importDefault(require("lodash.get"));
|
|
42
|
-
const react_1 = __importStar(require("react"));
|
|
43
|
-
const auth_1 = require("../../../context/auth");
|
|
44
|
-
const Modal_1 = require("../../modal/Modal");
|
|
45
|
-
const CustomMenu_1 = __importDefault(require("../../utils//CustomMenu"));
|
|
46
|
-
const TableLoadingState_1 = require("./TableLoadingState");
|
|
47
|
-
const utils_1 = require("./utils");
|
|
48
|
-
const FilterSection_1 = require("./FilterSection");
|
|
49
|
-
let isExpandAll = false;
|
|
50
|
-
let localTableName = '';
|
|
51
|
-
let filtersFuncData = {};
|
|
52
|
-
let localTableNameCache = '';
|
|
53
|
-
function Table({ mediaQueryLG, columns, csvConfig, fetchFunc, emptyMsg = {
|
|
54
|
-
user: 'Nenhum dado encontrado',
|
|
55
|
-
public: 'Nenhum dado encontrado',
|
|
56
|
-
}, 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, }) {
|
|
57
|
-
var _a, _b;
|
|
58
|
-
const [isLoading, setIsLoading] = (0, react_1.useState)(false);
|
|
59
|
-
const [error, setError] = (0, react_1.useState)(null);
|
|
60
|
-
const [data, setData] = (0, react_1.useState)(initialData);
|
|
61
|
-
/** startData Dado puro, sem filtro ou ordenação */
|
|
62
|
-
const { user, userLoaded } = (0, react_1.useContext)(auth_1.AuthContext);
|
|
63
|
-
const [list, setList] = (0, react_1.useState)([]);
|
|
64
|
-
const [listClone, setListClone] = (0, react_1.useState)([]);
|
|
65
|
-
//numero de items pra ser mostrado
|
|
66
|
-
const [itemsCount, setItemsCount] = (0, react_1.useState)(itemCount);
|
|
67
|
-
const [currentPage, setCurrentPage] = (0, react_1.useState)(0);
|
|
68
|
-
const [paginationCount, setPagCount] = (0, react_1.useState)(1);
|
|
69
|
-
const [listPage, setListPage] = (0, react_1.useState)(1);
|
|
70
|
-
const [expandObj, setExpandObj] = (0, react_1.useState)({});
|
|
71
|
-
const [showExpandObj, setShowExpandObj] = (0, react_1.useState)({});
|
|
72
|
-
const [showExpandObjOnExited, setShowExpandObjOnExited] = (0, react_1.useState)({});
|
|
73
|
-
const [filterKey, setFilterKey] = (0, react_1.useState)('filterKey');
|
|
74
|
-
const theme = (0, material_1.useTheme)();
|
|
75
|
-
const isSmall = (0, material_1.useMediaQuery)(theme.breakpoints.only('xs'));
|
|
76
|
-
const startData = (0, react_1.useRef)(data);
|
|
77
|
-
const orderAsc = (0, react_1.useRef)((localStorage.getItem(`order-${id}`) === 'true') || false);
|
|
78
|
-
const lg = (0, material_1.useMediaQuery)(theme.breakpoints.up(2000));
|
|
79
|
-
localTableName = `tableFilter_${id}`;
|
|
80
|
-
localTableNameCache = `tableFilterCache_${id}`;
|
|
81
|
-
filtersFuncData = filtersFunc !== null && filtersFunc !== void 0 ? filtersFunc : {};
|
|
82
|
-
if (!localStorage.getItem(localTableNameCache))
|
|
83
|
-
localStorage.setItem(localTableNameCache, JSON.stringify(filters));
|
|
84
|
-
if (localStorage.getItem(localTableNameCache) !== JSON.stringify(filters)) {
|
|
85
|
-
localStorage.setItem(localTableNameCache, JSON.stringify(filters));
|
|
86
|
-
localStorage.removeItem(localTableName);
|
|
87
|
-
}
|
|
88
|
-
(0, react_1.useEffect)(() => {
|
|
89
|
-
setError(null);
|
|
90
|
-
if (!fetchFunc)
|
|
91
|
-
return;
|
|
92
|
-
if (userLoaded || !useKC) {
|
|
93
|
-
setIsLoading(true);
|
|
94
|
-
fetchFunc()
|
|
95
|
-
.then((res) => {
|
|
96
|
-
if (!res.ok) {
|
|
97
|
-
setError({
|
|
98
|
-
status: 500,
|
|
99
|
-
});
|
|
100
|
-
setIsLoading(false);
|
|
101
|
-
return;
|
|
102
|
-
}
|
|
103
|
-
return res.json().then((j) => {
|
|
104
|
-
if (j.statusCode === 204) {
|
|
105
|
-
setData({ body: { data: [] } });
|
|
106
|
-
startData.current = [];
|
|
107
|
-
}
|
|
108
|
-
else if (j.statusCode === 403)
|
|
109
|
-
setError({
|
|
110
|
-
status: j.statusCode,
|
|
111
|
-
});
|
|
112
|
-
else {
|
|
113
|
-
let value = dataPath ? (0, lodash_get_1.default)(j, dataPath) : j;
|
|
114
|
-
if (!value || !Array.isArray(value)) {
|
|
115
|
-
setData({ body: { data: [] } });
|
|
116
|
-
startData.current = [];
|
|
117
|
-
}
|
|
118
|
-
else {
|
|
119
|
-
let newValue = value;
|
|
120
|
-
// começando a ordenação padrão
|
|
121
|
-
if (localStorage.getItem(`order-data-${id}`)) {
|
|
122
|
-
try {
|
|
123
|
-
const orderData = JSON.parse(localStorage.getItem(`order-data-${id}`));
|
|
124
|
-
newValue = (0, utils_1.ordenarDados)({
|
|
125
|
-
order: orderData,
|
|
126
|
-
list: value,
|
|
127
|
-
orderAsc: orderAsc.current,
|
|
128
|
-
});
|
|
129
|
-
}
|
|
130
|
-
catch (err) {
|
|
131
|
-
console.log(err);
|
|
132
|
-
}
|
|
133
|
-
}
|
|
134
|
-
else if (orderBy.length > 0) {
|
|
135
|
-
// se não tiver salvo uma ordenação, ordena pelo primeiro da lista
|
|
136
|
-
newValue = (0, utils_1.ordenarDados)({
|
|
137
|
-
order: orderBy[0],
|
|
138
|
-
list: value,
|
|
139
|
-
orderAsc: orderAsc.current,
|
|
140
|
-
});
|
|
141
|
-
}
|
|
142
|
-
setData(newValue);
|
|
143
|
-
startData.current = JSON.parse(JSON.stringify(newValue));
|
|
144
|
-
}
|
|
145
|
-
}
|
|
146
|
-
setIsLoading(false);
|
|
147
|
-
});
|
|
148
|
-
})
|
|
149
|
-
.catch((err) => {
|
|
150
|
-
setError({
|
|
151
|
-
status: 500,
|
|
152
|
-
});
|
|
153
|
-
});
|
|
154
|
-
}
|
|
155
|
-
}, [userLoaded, fetchFunc]);
|
|
156
|
-
const getData = (0, react_1.useCallback)((dt) => {
|
|
157
|
-
if (Array.isArray(dt))
|
|
158
|
-
return dt;
|
|
159
|
-
if (typeof dt === 'object')
|
|
160
|
-
return (0, lodash_get_1.default)(dt, dataPath);
|
|
161
|
-
}, []);
|
|
162
|
-
(0, react_1.useEffect)(() => {
|
|
163
|
-
if (isLoading || error || !getData(data))
|
|
164
|
-
return;
|
|
165
|
-
let value = getData(data);
|
|
166
|
-
setList(value);
|
|
167
|
-
setListClone(value);
|
|
168
|
-
setPagCount((0, utils_1.getCount)(value, itemsCount));
|
|
169
|
-
if (localStorage.getItem(localTableName)) {
|
|
170
|
-
(0, utils_1.filtrarDados)({
|
|
171
|
-
filterData: JSON.parse(localStorage.getItem(localTableName)),
|
|
172
|
-
filtersFuncData: filtersFuncData,
|
|
173
|
-
localTableName: localTableName,
|
|
174
|
-
setCurrentPage: setCurrentPage,
|
|
175
|
-
setList,
|
|
176
|
-
setListClone,
|
|
177
|
-
setListPage,
|
|
178
|
-
setPagCount,
|
|
179
|
-
startData: startData.current,
|
|
180
|
-
itemsCount,
|
|
181
|
-
});
|
|
182
|
-
}
|
|
183
|
-
}, [itemsCount, isLoading, data, error]);
|
|
184
|
-
(0, react_1.useEffect)(() => {
|
|
185
|
-
setCurrentPage(listPage - 1);
|
|
186
|
-
}, [listPage]);
|
|
187
|
-
const onPaginationChange = (0, react_1.useCallback)((e, page) => {
|
|
188
|
-
setListPage(page);
|
|
189
|
-
}, []);
|
|
190
|
-
function onInputChange(e) {
|
|
191
|
-
const searchValue = e.target.value;
|
|
192
|
-
if (searchValue === '') {
|
|
193
|
-
setList(listClone);
|
|
194
|
-
setPagCount((0, utils_1.getCount)(getData(list), itemsCount));
|
|
195
|
-
return;
|
|
196
|
-
}
|
|
197
|
-
const listData = getData(list);
|
|
198
|
-
const newList = [];
|
|
199
|
-
listData.forEach((x) => {
|
|
200
|
-
const dataStr = [];
|
|
201
|
-
Object.keys(x).map((key) => {
|
|
202
|
-
var _a;
|
|
203
|
-
let value = (_a = (0, lodash_get_1.default)(x, key, '')) !== null && _a !== void 0 ? _a : '';
|
|
204
|
-
if (typeof value === 'number')
|
|
205
|
-
value = value.toString();
|
|
206
|
-
if (typeof value !== 'string')
|
|
207
|
-
return;
|
|
208
|
-
dataStr.push(value);
|
|
209
|
-
});
|
|
210
|
-
if (dataStr.length <= 0)
|
|
211
|
-
return;
|
|
212
|
-
let exists = false;
|
|
213
|
-
dataStr.forEach((key) => {
|
|
214
|
-
const status = ['P', 'C', 'A', 'R', 'L', 'PA'];
|
|
215
|
-
if (status.includes(key)) {
|
|
216
|
-
switch (key) {
|
|
217
|
-
case 'P':
|
|
218
|
-
if ('em analise'.includes(searchValue.toLowerCase())) {
|
|
219
|
-
exists = true;
|
|
220
|
-
}
|
|
221
|
-
return;
|
|
222
|
-
case 'C':
|
|
223
|
-
if ('cancelado'.includes(searchValue.toLowerCase())) {
|
|
224
|
-
exists = true;
|
|
225
|
-
}
|
|
226
|
-
return;
|
|
227
|
-
case 'A':
|
|
228
|
-
if ('cadastrado'.includes(searchValue.toLowerCase())) {
|
|
229
|
-
exists = true;
|
|
230
|
-
}
|
|
231
|
-
return;
|
|
232
|
-
case 'R':
|
|
233
|
-
if ('reprovado'.includes(searchValue.toLowerCase())) {
|
|
234
|
-
exists = true;
|
|
235
|
-
}
|
|
236
|
-
return;
|
|
237
|
-
case 'L':
|
|
238
|
-
if ('licenciado'.includes(searchValue.toLowerCase())) {
|
|
239
|
-
exists = true;
|
|
240
|
-
}
|
|
241
|
-
return;
|
|
242
|
-
case 'PA':
|
|
243
|
-
if ('pré aprovado'.includes(searchValue.toLowerCase()) || 'pre aprovado'.includes(searchValue.toLowerCase())) {
|
|
244
|
-
exists = true;
|
|
245
|
-
}
|
|
246
|
-
return;
|
|
247
|
-
case 'FP':
|
|
248
|
-
if ('fora do prazo'.includes(searchValue.toLowerCase())) {
|
|
249
|
-
exists = true;
|
|
250
|
-
}
|
|
251
|
-
return;
|
|
252
|
-
}
|
|
253
|
-
}
|
|
254
|
-
if ((0, utils_1.removePunctuationAndAccents)(key.toLowerCase()).includes((0, utils_1.removePunctuationAndAccents)(searchValue.toLowerCase()))) {
|
|
255
|
-
exists = true;
|
|
256
|
-
}
|
|
257
|
-
});
|
|
258
|
-
if (!exists)
|
|
259
|
-
return;
|
|
260
|
-
newList.push(x);
|
|
261
|
-
});
|
|
262
|
-
setList(newList);
|
|
263
|
-
setPagCount((0, utils_1.getCount)(newList, itemsCount));
|
|
264
|
-
setCurrentPage(0);
|
|
265
|
-
setListPage(1);
|
|
266
|
-
}
|
|
267
|
-
const getMaxItems = (0, react_1.useCallback)(() => {
|
|
268
|
-
const start = currentPage * itemsCount;
|
|
269
|
-
return list.slice(start, start + itemsCount);
|
|
270
|
-
}, [list, itemsCount, currentPage]);
|
|
271
|
-
// effect usado quando for mostrar "VER MAIS" e "VER MENOS"
|
|
272
|
-
(0, react_1.useEffect)(() => {
|
|
273
|
-
const start = currentPage * itemsCount;
|
|
274
|
-
const newList = list.slice(start, start + itemsCount);
|
|
275
|
-
let obj = {};
|
|
276
|
-
newList.forEach((x, index) => {
|
|
277
|
-
columns.forEach((c) => {
|
|
278
|
-
var _a;
|
|
279
|
-
obj[index] = obj[index] === true ? true : ((_a = (0, lodash_get_1.default)(x, c.keyName, '')) !== null && _a !== void 0 ? _a : 'Não Informado').toString().length >= expandTextMaxLength;
|
|
280
|
-
});
|
|
281
|
-
});
|
|
282
|
-
setShowExpandObj(obj);
|
|
283
|
-
}, [list, itemsCount, currentPage]);
|
|
284
|
-
function expandAll() {
|
|
285
|
-
let obj = {};
|
|
286
|
-
for (let i = 0; i < itemCount; i++) {
|
|
287
|
-
obj[i] = !isExpandAll;
|
|
288
|
-
}
|
|
289
|
-
setShowExpandObjOnExited(obj);
|
|
290
|
-
setExpandObj(obj);
|
|
291
|
-
isExpandAll = !isExpandAll;
|
|
292
|
-
}
|
|
293
|
-
function reset() {
|
|
294
|
-
setList(startData.current);
|
|
295
|
-
setListClone(startData.current);
|
|
296
|
-
setPagCount((0, utils_1.getCount)(startData.current, itemsCount));
|
|
297
|
-
setCurrentPage(0);
|
|
298
|
-
setListPage(1);
|
|
299
|
-
localStorage.removeItem(localTableName);
|
|
300
|
-
setFilterKey(new Date().getTime().toString());
|
|
301
|
-
}
|
|
302
|
-
const handleCSVDownload = (list, all = false) => {
|
|
303
|
-
var _a;
|
|
304
|
-
if (!csvConfig)
|
|
305
|
-
return;
|
|
306
|
-
(0, utils_1.downloadCSVFile)(list, Object.assign(Object.assign({}, csvConfig), (all ? { downloadAll: true } : {})), JSON.parse((_a = localStorage.getItem(localTableName)) !== null && _a !== void 0 ? _a : '[]') || []);
|
|
307
|
-
};
|
|
308
|
-
const handleFiltrarDados = (dt) => {
|
|
309
|
-
(0, utils_1.filtrarDados)({
|
|
310
|
-
filterData: dt,
|
|
311
|
-
filtersFuncData: filtersFuncData,
|
|
312
|
-
localTableName: localTableName,
|
|
313
|
-
setCurrentPage: setCurrentPage,
|
|
314
|
-
setList,
|
|
315
|
-
setListClone,
|
|
316
|
-
setListPage,
|
|
317
|
-
setPagCount,
|
|
318
|
-
startData: startData.current,
|
|
319
|
-
itemsCount,
|
|
320
|
-
});
|
|
321
|
-
};
|
|
322
|
-
const handleOrdenarDados = (x) => {
|
|
323
|
-
/** Inverter a ordem de ordenação no segundo clique */
|
|
324
|
-
orderAsc.current = !orderAsc.current;
|
|
325
|
-
const dadosOrdenados = (0, utils_1.ordenarDados)({
|
|
326
|
-
order: x,
|
|
327
|
-
list,
|
|
328
|
-
orderAsc: orderAsc.current,
|
|
329
|
-
});
|
|
330
|
-
localStorage.setItem(`order-${id}`, orderAsc.current.toString());
|
|
331
|
-
localStorage.setItem(`order-data-${id}`, JSON.stringify(x));
|
|
332
|
-
setList(dadosOrdenados);
|
|
333
|
-
};
|
|
334
|
-
if (error)
|
|
335
|
-
return react_1.default.createElement(TableErrorState_1.TableErrorState, { customErrorMsg: customErrorMsg, error: error });
|
|
336
|
-
if (isLoading)
|
|
337
|
-
return react_1.default.createElement(TableLoadingState_1.TableLoadingState, { tableName: tableName });
|
|
338
|
-
if (!userLoaded && useKC)
|
|
339
|
-
return react_1.default.createElement(material_1.LinearProgress, null);
|
|
340
|
-
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
341
|
-
react_1.default.createElement(material_1.Box, Object.assign({ marginX: isSmall ? customMarginMobile : customMargin, bgcolor: 'white', p: 2, borderRadius: 6 }, customTableStyle),
|
|
342
|
-
react_1.default.createElement(material_1.Stack, { spacing: 1.5, direction: { xs: 'column', md: 'row' } },
|
|
343
|
-
react_1.default.createElement(material_1.Stack, { spacing: 1.5, direction: { xs: 'column', md: 'row' }, height: { md: '40px', xs: 'inherit' }, width: '100%' },
|
|
344
|
-
react_1.default.createElement(TextField_1.default, { InputProps: {
|
|
345
|
-
startAdornment: react_1.default.createElement(Search_1.default, { sx: { marginRight: 1, fill: '#c0c0c0' } }),
|
|
346
|
-
sx: {
|
|
347
|
-
'.MuiOutlinedInput-notchedOutline': { border: 'none' },
|
|
348
|
-
},
|
|
349
|
-
}, sx: {
|
|
350
|
-
border: 'solid 1px #CBD5E1',
|
|
351
|
-
backgroundColor: '#F8FAFC',
|
|
352
|
-
borderRadius: '50px',
|
|
353
|
-
maxWidth: '600px',
|
|
354
|
-
}, size: 'small', onChange: onInputChange, fullWidth: true, placeholder: `Pesquisar ${tableName}` }),
|
|
355
|
-
react_1.default.createElement(material_1.Button, { startIcon: react_1.default.createElement(icons_material_1.FilterAlt, null), variant: 'contained', onClick: (e) => Modal_1.MODAL.open(react_1.default.createElement(FilterSection_1.FilterMenu, { key: filterKey, reset: reset, filtrar: (dt) => handleFiltrarDados(dt), baseFilters: [...filters], filters: localStorage.getItem(localTableName) ? JSON.parse(localStorage.getItem(localTableName)) : [...filters] })), sx: {
|
|
356
|
-
borderRadius: 3,
|
|
357
|
-
paddingX: '24px',
|
|
358
|
-
paddingY: '8px',
|
|
359
|
-
backgroundColor: '#208FE8',
|
|
360
|
-
textTransform: 'capitalize',
|
|
361
|
-
} },
|
|
362
|
-
react_1.default.createElement(material_1.Stack, { direction: 'row', borderRadius: 5, padding: 0 },
|
|
363
|
-
react_1.default.createElement("span", null, "Filtrar"))),
|
|
364
|
-
react_1.default.createElement(material_1.Stack, { direction: 'row', spacing: 1 },
|
|
365
|
-
orderBy.length > 0 && react_1.default.createElement(CustomMenu_1.default, { data: orderBy.map((x) => ({
|
|
366
|
-
name: x.label,
|
|
367
|
-
onClick: () => handleOrdenarDados(x),
|
|
368
|
-
})), btProps: {
|
|
369
|
-
startIcon: react_1.default.createElement(icons_material_1.KeyboardArrowDown, null),
|
|
370
|
-
fullWidth: true,
|
|
371
|
-
} }, "Ordenar"),
|
|
372
|
-
isExpandable && (react_1.default.createElement(material_1.Button, { variant: 'contained', fullWidth: true, startIcon: isExpandAll ? react_1.default.createElement(icons_material_1.KeyboardArrowUp, null) : react_1.default.createElement(icons_material_1.KeyboardArrowDown, null), sx: {
|
|
373
|
-
backgroundColor: '#637082',
|
|
374
|
-
':hover': {
|
|
375
|
-
backgroundColor: '#3c4757',
|
|
376
|
-
},
|
|
377
|
-
textTransform: 'capitalize',
|
|
378
|
-
borderRadius: 3,
|
|
379
|
-
padding: {
|
|
380
|
-
md: '0px 8px',
|
|
381
|
-
},
|
|
382
|
-
}, onClick: expandAll }, isExpandAll ? 'Recolher' : 'Expandir')))),
|
|
383
|
-
react_1.default.createElement(material_1.Stack, { alignItems: 'end', width: { xs: '100%', md: '20%' }, direction: { xs: 'row', md: 'column' }, spacing: { xs: 1, md: 0 } },
|
|
384
|
-
react_1.default.createElement(Typography_1.default, { fontWeight: 600, textAlign: 'end' },
|
|
385
|
-
"Registro de ",
|
|
386
|
-
tableName,
|
|
387
|
-
"s"),
|
|
388
|
-
react_1.default.createElement(material_1.Stack, { justifyContent: 'center' },
|
|
389
|
-
react_1.default.createElement(Typography_1.default, null,
|
|
390
|
-
"Exibindo ",
|
|
391
|
-
currentPage * itemsCount + 1,
|
|
392
|
-
"-",
|
|
393
|
-
currentPage * itemsCount + 1 + getMaxItems().length - 1,
|
|
394
|
-
" de ",
|
|
395
|
-
list.length)))),
|
|
396
|
-
localStorage.getItem(localTableName) && (react_1.default.createElement(material_1.Box, { display: 'inline-flex', flexWrap: 'wrap', padding: 0.5, borderRadius: 4, marginBottom: 1 }, JSON.parse((_a = localStorage.getItem(localTableName)) !== null && _a !== void 0 ? _a : '[]')
|
|
397
|
-
.filter((x) => x.value || (x.operator === 'entre' && (x.value || x.value2)))
|
|
398
|
-
.map((x) => (react_1.default.createElement(material_1.Stack, { direction: 'row', spacing: 1, bgcolor: '#4e85c1', color: 'white', width: 'fit-content', paddingY: 0.5, borderRadius: 2, paddingX: 1, m: 0.5 },
|
|
399
|
-
react_1.default.createElement(Typography_1.default, { fontWeight: 700 }, x.label),
|
|
400
|
-
react_1.default.createElement(Typography_1.default, { fontStyle: 'italic' }, x.operator),
|
|
401
|
-
react_1.default.createElement(Typography_1.default, { bgcolor: 'white', borderRadius: 2, paddingX: 1, color: 'black' }, Array.isArray(x.value)
|
|
402
|
-
? x.value.map((x) => x.label).join(' - ')
|
|
403
|
-
: typeof x.value === 'object'
|
|
404
|
-
? x.value.label
|
|
405
|
-
: x.operator === 'entre'
|
|
406
|
-
? `${x.value ? x.value : 'Antes'} e ${x.value2 ? x.value2 : 'Depois'}`
|
|
407
|
-
: x.value.toString()),
|
|
408
|
-
react_1.default.createElement(material_1.IconButton, { onClick: (e) => {
|
|
409
|
-
var _a;
|
|
410
|
-
let currentValue = JSON.parse((_a = localStorage.getItem(localTableName)) !== null && _a !== void 0 ? _a : '[]');
|
|
411
|
-
currentValue = currentValue.map((item) => {
|
|
412
|
-
if (item.label === x.label) {
|
|
413
|
-
return Object.assign(Object.assign(Object.assign({}, item), { value: '' }), (item.value2 ? { value2: '' } : {}));
|
|
414
|
-
}
|
|
415
|
-
return item;
|
|
416
|
-
});
|
|
417
|
-
handleFiltrarDados(currentValue);
|
|
418
|
-
}, size: 'small', sx: {
|
|
419
|
-
padding: 0,
|
|
420
|
-
} },
|
|
421
|
-
react_1.default.createElement(Clear_1.default, { sx: {
|
|
422
|
-
fill: 'white',
|
|
423
|
-
} }))))))),
|
|
424
|
-
react_1.default.createElement(material_1.Stack, { spacing: 0.2 }, getMaxItems().length <= 0 ? (react_1.default.createElement(material_1.Stack, { sx: { backgroundColor: '#E2E8F0', padding: 2, marginX: { xs: 2, md: 0 } }, justifyContent: 'center', alignItems: 'center' },
|
|
425
|
-
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: {
|
|
426
|
-
padding: 0.5,
|
|
427
|
-
backgroundColor: index % 2 === 0 ? '#F8FAFC' : 'white',
|
|
428
|
-
paddingTop: 2,
|
|
429
|
-
borderTop: 'solid 1.5px #E2E8F0',
|
|
430
|
-
position: 'relative',
|
|
431
|
-
}, elevation: 0 },
|
|
432
|
-
react_1.default.createElement(Grid_1.default, { container: true, spacing: isSmall ? 2 : 0, paddingX: 2, rowSpacing: 2 },
|
|
433
|
-
columns.map((c) => {
|
|
434
|
-
var _a, _b;
|
|
435
|
-
return (react_1.default.createElement(Grid_1.default, { key: c.keyName + index, item: true, xs: 12, md: lg ? (12 / columnSize) * (!!c.size ? c.size : 1) : mediaQueryLG ? mediaQueryLG.all : (12 / columnSize) * (!!c.size ? c.size : 1), sx: {
|
|
436
|
-
overflow: 'hidden',
|
|
437
|
-
} },
|
|
438
|
-
react_1.default.createElement(material_1.Box, { sx: { width: 'max-content', paddingX: 1 } },
|
|
439
|
-
react_1.default.createElement(Typography_1.default, { fontSize: 16, fontWeight: 700, color: '#1E293B', fontFamily: 'Inter' }, c.title)),
|
|
440
|
-
react_1.default.createElement(material_1.Box, { paddingLeft: 1, position: 'relative' },
|
|
441
|
-
react_1.default.createElement(material_1.Collapse, { in: expandObj[index] === true, collapsedSize: collapsedSize, onExited: (e) => setShowExpandObjOnExited((s) => (Object.assign(Object.assign({}, s), { [index]: false }))) },
|
|
442
|
-
react_1.default.createElement(material_1.Box, { sx: {
|
|
443
|
-
wordWrap: 'break-word',
|
|
444
|
-
color: '#1E293B',
|
|
445
|
-
fontSize: 16,
|
|
446
|
-
}, fontFamily: 'Inter' },
|
|
447
|
-
react_1.default.createElement(material_1.Box, null, c.customComponent ? (c.customComponent((0, lodash_get_1.default)(x, c.keyName), x)) : (react_1.default.createElement(material_1.Box, { color: 'transparent', sx: { pointerEvents: 'none', userSelect: 'none' } }, (0, lodash_get_1.default)(x, c.keyName, '')))),
|
|
448
|
-
react_1.default.createElement(material_1.Box, { position: 'absolute', top: 0 }, c.customComponent ? (c.customComponent((0, lodash_get_1.default)(x, c.keyName), x)) : (react_1.default.createElement(react_1.default.Fragment, null, showExpandObjOnExited[index] ? ((0, lodash_get_1.default)(x, c.keyName, '')) : ((_a = (0, lodash_get_1.default)(x, c.keyName, '')) !== null && _a !== void 0 ? _a : '').toString().length >= expandTextMaxLength ? (react_1.default.createElement(react_1.default.Fragment, null, ((_b = (0, lodash_get_1.default)(x, c.keyName, '')) !== null && _b !== void 0 ? _b : '').toString().substring(0, expandTextMaxLength) + '...')) : ((0, lodash_get_1.default)(x, c.keyName, ''))))))))));
|
|
449
|
-
}),
|
|
450
|
-
react_1.default.createElement(Grid_1.default, { item: true, xs: 12, md: lg ? 12 / columnSize : mediaQueryLG ? mediaQueryLG.action : 12 / columnSize },
|
|
451
|
-
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))),
|
|
452
|
-
showExpandObj[index] && (react_1.default.createElement(material_1.Stack, { direction: 'row', justifyContent: 'flex-end', bottom: 0, width: '100%' },
|
|
453
|
-
react_1.default.createElement(material_1.Button, { onClick: (e) => {
|
|
454
|
-
setExpandObj((s) => (Object.assign(Object.assign({}, s), { [index]: !s[index] })));
|
|
455
|
-
setShowExpandObjOnExited((s) => (Object.assign(Object.assign({}, s), { [index]: true })));
|
|
456
|
-
}, sx: {
|
|
457
|
-
padding: 0,
|
|
458
|
-
color: '#637082',
|
|
459
|
-
textTransform: 'capitalize',
|
|
460
|
-
}, startIcon: expandObj[index] ? react_1.default.createElement(icons_material_1.ExpandLess, null) : react_1.default.createElement(icons_material_1.ExpandMore, null) }, expandObj[index] ? 'Ver Menos' : 'Ver Mais'))))))))),
|
|
461
|
-
getMaxItems().length > 0 && (react_1.default.createElement(material_1.Stack, { padding: 1, direction: {
|
|
462
|
-
xs: 'column',
|
|
463
|
-
md: 'row',
|
|
464
|
-
}, spacing: {
|
|
465
|
-
xs: 2,
|
|
466
|
-
md: 0,
|
|
467
|
-
}, justifyContent: 'space-between', alignItems: 'center' }, csvConfig && (react_1.default.createElement(material_1.Stack, { direction: {
|
|
468
|
-
xs: 'column',
|
|
469
|
-
md: 'row',
|
|
470
|
-
}, justifyContent: 'flex-end', spacing: 1 },
|
|
471
|
-
JSON.parse((_b = localStorage.getItem(localTableName)) !== null && _b !== void 0 ? _b : '[]')
|
|
472
|
-
.filter((x) => x.value || (x.operator === 'entre' && (x.value || x.value2))).length > 0 &&
|
|
473
|
-
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"),
|
|
474
|
-
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")))))),
|
|
475
|
-
react_1.default.createElement(material_1.Stack, { direction: 'row', justifyContent: 'center', paddingY: 1, paddingTop: 2 },
|
|
476
|
-
react_1.default.createElement(material_1.Stack, { direction: 'row', justifyContent: 'center', alignItems: 'center', spacing: 2 },
|
|
477
|
-
react_1.default.createElement(material_1.Button, { onClick: (e) => setListPage((s) => {
|
|
478
|
-
if (s > 1) {
|
|
479
|
-
return s - 1;
|
|
480
|
-
}
|
|
481
|
-
return 1;
|
|
482
|
-
}), sx: { bgcolor: 'white', borderRadius: '50px', height: '40px', width: '40px', minWidth: 0, border: 'solid 1px #E2E8F0' } },
|
|
483
|
-
react_1.default.createElement(NavigateNextRounded_1.default, { sx: { transform: 'scale(1.5) scaleX(-1)' } })),
|
|
484
|
-
react_1.default.createElement(Pagination_1.default, { renderItem: (item) => {
|
|
485
|
-
if (item.type === 'page')
|
|
486
|
-
return (react_1.default.createElement(material_1.Button, { onClick: item.onClick, sx: Object.assign(Object.assign({ fontWeight: 600 }, (item.selected
|
|
487
|
-
? {
|
|
488
|
-
bgcolor: '#33B55D',
|
|
489
|
-
color: 'white',
|
|
490
|
-
}
|
|
491
|
-
: {
|
|
492
|
-
color: '#1E293B',
|
|
493
|
-
})), { borderRadius: '100%', padding: 0, margin: 0, minWidth: 0, width: '40px', height: '40px', marginX: 0.25 }) }, item.page));
|
|
494
|
-
if (!['next', 'previous', 'page'].includes(item.type))
|
|
495
|
-
return react_1.default.createElement(material_1.PaginationItem, Object.assign({}, item));
|
|
496
|
-
}, count: paginationCount, siblingCount: isSmall ? 0 : 6, size: 'large', onChange: onPaginationChange, page: listPage, shape: 'circular', variant: 'outlined', sx: {
|
|
497
|
-
'.MuiPagination-ul': {
|
|
498
|
-
backgroundColor: 'white',
|
|
499
|
-
border: 'solid 1px #E2E8F0',
|
|
500
|
-
borderRadius: '50px',
|
|
501
|
-
paddingX: 0.25,
|
|
502
|
-
paddingY: 0.5,
|
|
503
|
-
},
|
|
504
|
-
} }),
|
|
505
|
-
react_1.default.createElement(material_1.Button, { onClick: (e) => setListPage((s) => {
|
|
506
|
-
if (s < paginationCount) {
|
|
507
|
-
return s + 1;
|
|
508
|
-
}
|
|
509
|
-
return paginationCount;
|
|
510
|
-
}), sx: { bgcolor: 'white', borderRadius: '50px', height: '40px', width: '40px', minWidth: 0, border: 'solid 1px #E2E8F0' } },
|
|
511
|
-
react_1.default.createElement(NavigateNextRounded_1.default, { sx: { transform: 'scale(1.5)' } }))))));
|
|
512
|
-
}
|
|
513
|
-
exports.Table = Table;
|
|
514
|
-
exports.default = react_1.default.memo(Table);
|
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.TableErrorState = void 0;
|
|
7
|
-
const icons_material_1 = require("@mui/icons-material");
|
|
8
|
-
const material_1 = require("@mui/material");
|
|
9
|
-
const react_1 = __importDefault(require("react"));
|
|
10
|
-
function TableErrorState({ customErrorMsg, error }) {
|
|
11
|
-
return (react_1.default.createElement(material_1.Box, { bgcolor: '#fff2c8', color: '#3e3129', padding: 2, marginX: 2, borderRadius: 4 },
|
|
12
|
-
react_1.default.createElement(material_1.Typography, { fontSize: 24, textAlign: 'center', fontFamily: 'Inter' },
|
|
13
|
-
error.status === 403 && 'Acesso negado',
|
|
14
|
-
error.status === 500 && (react_1.default.createElement(material_1.Box, { fontWeight: 500, textAlign: 'center' },
|
|
15
|
-
react_1.default.createElement(icons_material_1.ReportProblemRounded, { sx: {
|
|
16
|
-
transform: 'scale(2)',
|
|
17
|
-
marginY: 1,
|
|
18
|
-
fill: '#3e3129',
|
|
19
|
-
} }),
|
|
20
|
-
react_1.default.createElement(material_1.Box, null, customErrorMsg ? (customErrorMsg) : (react_1.default.createElement(react_1.default.Fragment, null,
|
|
21
|
-
"N\u00E3o foi poss\u00EDvel se conectar ao servidor no momento. Por favor, aguarde alguns instantes e tente de novo.",
|
|
22
|
-
react_1.default.createElement("br", null),
|
|
23
|
-
react_1.default.createElement("br", null),
|
|
24
|
-
"Caso precise de ajuda, entre em contato pelo email: ",
|
|
25
|
-
react_1.default.createElement("strong", null, "cdes@ssp.df.gov.br")))))))));
|
|
26
|
-
}
|
|
27
|
-
exports.TableErrorState = TableErrorState;
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.TableLoadingState = void 0;
|
|
7
|
-
const icons_material_1 = require("@mui/icons-material");
|
|
8
|
-
const material_1 = require("@mui/material");
|
|
9
|
-
const Typography_1 = __importDefault(require("@mui/material/Typography"));
|
|
10
|
-
const react_1 = __importDefault(require("react"));
|
|
11
|
-
function TableLoadingState({ tableName }) {
|
|
12
|
-
return (react_1.default.createElement(material_1.Stack, { sx: {
|
|
13
|
-
height: '100%',
|
|
14
|
-
width: '100%',
|
|
15
|
-
}, justifyContent: 'center', alignItems: 'center' },
|
|
16
|
-
react_1.default.createElement(material_1.Box, { width: '100%' },
|
|
17
|
-
react_1.default.createElement(material_1.Stack, { direction: 'row', justifyContent: 'center', alignItems: 'center', justifyItems: 'center', spacing: 2, marginY: 4 },
|
|
18
|
-
react_1.default.createElement(icons_material_1.PendingRounded, { sx: {
|
|
19
|
-
fill: '#5e5e5e',
|
|
20
|
-
} }),
|
|
21
|
-
react_1.default.createElement(Typography_1.default, { fontWeight: 600, fontSize: 20, textTransform: 'capitalize', textAlign: 'center', color: '#5e5e5e' },
|
|
22
|
-
"Carregando ",
|
|
23
|
-
tableName)),
|
|
24
|
-
react_1.default.createElement(material_1.LinearProgress, { color: 'inherit' }),
|
|
25
|
-
Array(10)
|
|
26
|
-
.fill('')
|
|
27
|
-
.map((x) => (react_1.default.createElement(material_1.Stack, { direction: {
|
|
28
|
-
xs: 'column',
|
|
29
|
-
md: 'row',
|
|
30
|
-
}, spacing: {
|
|
31
|
-
xs: 3,
|
|
32
|
-
md: 1,
|
|
33
|
-
}, justifyContent: 'space-between', paddingY: 8, borderBottom: '1px solid #cacaca' }, Array(7)
|
|
34
|
-
.fill(0)
|
|
35
|
-
.map((y) => (react_1.default.createElement(material_1.Box, null,
|
|
36
|
-
react_1.default.createElement(material_1.Skeleton, { width: 60 }),
|
|
37
|
-
react_1.default.createElement(material_1.Skeleton, { width: 120 }))))))))));
|
|
38
|
-
}
|
|
39
|
-
exports.TableLoadingState = TableLoadingState;
|