argous 1.2.141 → 1.2.142
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.
|
@@ -186,9 +186,96 @@ exports.CustomTooltip = core_1.withStyles(function (theme) { return ({
|
|
|
186
186
|
color: theme.palette.type === 'light' ? '#333333e3' : '#fbfbfbd1'
|
|
187
187
|
}
|
|
188
188
|
}); })(core_1.Tooltip);
|
|
189
|
+
var ListboxFavorites = react_1.forwardRef(function (props, ref) {
|
|
190
|
+
var classes = useStyles();
|
|
191
|
+
var children = props.children, favoritePage = props.favoritePage, dados = props.dados, setDados = props.setDados, groupHeaderColor = props.groupHeaderColor, groupTitleColor = props.groupTitleColor;
|
|
192
|
+
var pageNumber = dados.pageNumber, favoritosLength = dados.favoritosLength, direction = dados.direction, slide = dados.slide;
|
|
193
|
+
console.log('Listbox', children);
|
|
194
|
+
function retornaInicio() {
|
|
195
|
+
switch (pageNumber) {
|
|
196
|
+
case 1:
|
|
197
|
+
return 0;
|
|
198
|
+
case 2:
|
|
199
|
+
return 7;
|
|
200
|
+
case 3:
|
|
201
|
+
return 14;
|
|
202
|
+
default: return;
|
|
203
|
+
}
|
|
204
|
+
}
|
|
205
|
+
function retornaFim() {
|
|
206
|
+
switch (pageNumber) {
|
|
207
|
+
case 1:
|
|
208
|
+
return 7;
|
|
209
|
+
case 2:
|
|
210
|
+
return 14;
|
|
211
|
+
case 3:
|
|
212
|
+
return favoritosLength;
|
|
213
|
+
default: return;
|
|
214
|
+
}
|
|
215
|
+
}
|
|
216
|
+
function retornaArray(sectionIndex, section) {
|
|
217
|
+
if (sectionIndex === 0 && favoritePage && favoritosLength > 7)
|
|
218
|
+
return section.props.children[1].props.children.slice(retornaInicio(), retornaFim());
|
|
219
|
+
return section.props.children[1].props.children;
|
|
220
|
+
}
|
|
221
|
+
function retornaEstrutura(sectionIndex, item) {
|
|
222
|
+
if (sectionIndex === 0 && favoritePage && favoritosLength > 7) {
|
|
223
|
+
return (react_1.default.createElement(core_1.Slide, { in: slide, direction: direction },
|
|
224
|
+
react_1.default.createElement(exports.CustomTooltip, { title: item.props.children, arrow: true, enterDelay: '1000', enterNextDelay: '1000', placement: 'top-end', TransitionComponent: core_1.Fade, TransitionProps: { timeout: { enter: 100, exit: 500 } } },
|
|
225
|
+
react_1.default.createElement(core_1.ListItem, __assign({}, item.props, { key: item.key, className: classes.listItem }),
|
|
226
|
+
react_1.default.createElement(core_1.ListItemText, { primary: item.props.children, className: classes.listItemText })))));
|
|
227
|
+
}
|
|
228
|
+
return (react_1.default.createElement(exports.CustomTooltip, { title: item.props.children, arrow: true, enterDelay: '1000', enterNextDelay: '1000', placement: 'top-end', TransitionComponent: core_1.Fade, TransitionProps: { timeout: { enter: 100, exit: 500 } } },
|
|
229
|
+
react_1.default.createElement(core_1.ListItem, __assign({}, item.props, { key: item.key, className: classes.listItem }),
|
|
230
|
+
react_1.default.createElement(core_1.ListItemText, { primary: item.props.children, className: classes.listItemText }))));
|
|
231
|
+
}
|
|
232
|
+
function buttonClick(evento, value) {
|
|
233
|
+
evento.preventDefault();
|
|
234
|
+
evento.stopPropagation();
|
|
235
|
+
if (value !== pageNumber) {
|
|
236
|
+
verificaSaidaSlide(value);
|
|
237
|
+
setDados(function (v) { return (__assign(__assign({}, v), { slide: false })); });
|
|
238
|
+
setTimeout(function () {
|
|
239
|
+
setDados(function (v) { return (__assign(__assign({}, v), { pageNumber: value, direction: retornaDirection(value) })); });
|
|
240
|
+
setTimeout(function () { return setDados(function (v) { return (__assign(__assign({}, v), { slide: true })); }); }, 100);
|
|
241
|
+
}, 200);
|
|
242
|
+
}
|
|
243
|
+
}
|
|
244
|
+
function verificaSaidaSlide(value) {
|
|
245
|
+
var direction = '';
|
|
246
|
+
if ((value === 2 || value === 3) && pageNumber === 1)
|
|
247
|
+
direction = 'right';
|
|
248
|
+
else if (value === 3 && pageNumber === 2)
|
|
249
|
+
direction = 'right';
|
|
250
|
+
else if (value === 1 && pageNumber === 2)
|
|
251
|
+
direction = 'left';
|
|
252
|
+
direction && setDados(function (v) { return (__assign(__assign({}, v), { direction: direction })); });
|
|
253
|
+
}
|
|
254
|
+
function retornaDirection(value) {
|
|
255
|
+
if (value < pageNumber)
|
|
256
|
+
return 'right';
|
|
257
|
+
return 'left';
|
|
258
|
+
}
|
|
259
|
+
return children.map(function (section, sectionIndex) {
|
|
260
|
+
var _a, _b, _c;
|
|
261
|
+
return (react_1.default.createElement("ul", __assign({}, props, { className: clsx_1.default('MuiAutocomplete-listbox', classes.box) }),
|
|
262
|
+
react_1.default.createElement(core_1.ListSubheader, { className: classes.subHeader, style: { backgroundColor: groupHeaderColor === null || groupHeaderColor === void 0 ? void 0 : groupHeaderColor[sectionIndex], color: groupTitleColor === null || groupTitleColor === void 0 ? void 0 : groupTitleColor[sectionIndex] } },
|
|
263
|
+
section.props.children[0].props.children,
|
|
264
|
+
react_1.default.createElement(core_1.Fade, { in: sectionIndex === 0 && favoritePage && favoritosLength > 7 },
|
|
265
|
+
react_1.default.createElement("div", { className: classes.divButton },
|
|
266
|
+
react_1.default.createElement("div", { className: classes.areaButton },
|
|
267
|
+
react_1.default.createElement("div", { onClick: function (e) { return buttonClick(e, 1); }, className: clsx_1.default((_a = {}, _a[classes.buttonActive] = pageNumber === 1, _a), classes.button) }, "1")),
|
|
268
|
+
react_1.default.createElement("div", { className: classes.areaButton },
|
|
269
|
+
react_1.default.createElement("div", { onClick: function (e) { return buttonClick(e, 2); }, className: clsx_1.default((_b = {}, _b[classes.buttonActive] = pageNumber === 2, _b), classes.button) }, "2")),
|
|
270
|
+
favoritosLength > 14 &&
|
|
271
|
+
react_1.default.createElement(react_1.default.Fragment, null,
|
|
272
|
+
react_1.default.createElement("div", { className: classes.areaButton },
|
|
273
|
+
react_1.default.createElement("div", { onClick: function (e) { return buttonClick(e, 3); }, className: clsx_1.default((_c = {}, _c[classes.buttonActive] = pageNumber === 3, _c), classes.button) }, "3")))))),
|
|
274
|
+
retornaArray(sectionIndex, section).map(function (item, itemIndex) { return retornaEstrutura(sectionIndex, item); })));
|
|
275
|
+
});
|
|
276
|
+
});
|
|
189
277
|
var AutoCompleteFavorites = function (_a) {
|
|
190
278
|
var action = _a.action, busca = _a.busca, resposta = _a.resposta, label = _a.label, value = _a.value, pgCode = _a.pgCode, favoritePage = _a.favoritePage, groupName = _a.groupName, groupHeaderColor = _a.groupHeaderColor, groupTitleColor = _a.groupTitleColor, loadingColor = _a.loadingColor, filterFunction = _a.filterFunction, getOptionLabel = _a.getOptionLabel, _b = _a.onChange, onChange = _b === void 0 ? function (e) { return e; } : _b, _c = _a.textFieldProps, textFieldProps = _c === void 0 ? {} : _c, searchParams = _a.searchParams, props = __rest(_a, ["action", "busca", "resposta", "label", "value", "pgCode", "favoritePage", "groupName", "groupHeaderColor", "groupTitleColor", "loadingColor", "filterFunction", "getOptionLabel", "onChange", "textFieldProps", "searchParams"]);
|
|
191
|
-
var classes = useStyles();
|
|
192
279
|
var _d = react_1.useState({
|
|
193
280
|
lista: [],
|
|
194
281
|
slide: true,
|
|
@@ -198,101 +285,15 @@ var AutoCompleteFavorites = function (_a) {
|
|
|
198
285
|
}), dados = _d[0], setDados = _d[1];
|
|
199
286
|
var _e = react_1.useState(false), loading = _e[0], setLoading = _e[1];
|
|
200
287
|
var _f = react_1.useState(''), inputValue = _f[0], setInputValue = _f[1];
|
|
201
|
-
var ListboxFavorites = react_1.forwardRef(function (props, ref) {
|
|
202
|
-
var children = props.children, favoritePage = props.favoritePage, dados = props.dados, setDados = props.setDados, groupHeaderColor = props.groupHeaderColor, groupTitleColor = props.groupTitleColor;
|
|
203
|
-
var pageNumber = dados.pageNumber, favoritosLength = dados.favoritosLength, direction = dados.direction, slide = dados.slide;
|
|
204
|
-
console.log('Listbox', children);
|
|
205
|
-
function retornaInicio() {
|
|
206
|
-
switch (pageNumber) {
|
|
207
|
-
case 1:
|
|
208
|
-
return 0;
|
|
209
|
-
case 2:
|
|
210
|
-
return 7;
|
|
211
|
-
case 3:
|
|
212
|
-
return 14;
|
|
213
|
-
default: return;
|
|
214
|
-
}
|
|
215
|
-
}
|
|
216
|
-
function retornaFim() {
|
|
217
|
-
switch (pageNumber) {
|
|
218
|
-
case 1:
|
|
219
|
-
return 7;
|
|
220
|
-
case 2:
|
|
221
|
-
return 14;
|
|
222
|
-
case 3:
|
|
223
|
-
return favoritosLength;
|
|
224
|
-
default: return;
|
|
225
|
-
}
|
|
226
|
-
}
|
|
227
|
-
function retornaArray(sectionIndex, section) {
|
|
228
|
-
if (sectionIndex === 0 && favoritePage && favoritosLength > 7)
|
|
229
|
-
return section.props.children[1].props.children.slice(retornaInicio(), retornaFim());
|
|
230
|
-
return section.props.children[1].props.children;
|
|
231
|
-
}
|
|
232
|
-
function retornaEstrutura(sectionIndex, item) {
|
|
233
|
-
if (sectionIndex === 0 && favoritePage && favoritosLength > 7) {
|
|
234
|
-
return (react_1.default.createElement(core_1.Slide, { in: slide, direction: direction },
|
|
235
|
-
react_1.default.createElement(exports.CustomTooltip, { title: item.props.children, arrow: true, enterDelay: '1000', enterNextDelay: '1000', placement: 'top-end', TransitionComponent: core_1.Fade, TransitionProps: { timeout: { enter: 100, exit: 500 } } },
|
|
236
|
-
react_1.default.createElement(core_1.ListItem, __assign({}, item.props, { key: item.key, className: classes.listItem }),
|
|
237
|
-
react_1.default.createElement(core_1.ListItemText, { primary: item.props.children, className: classes.listItemText })))));
|
|
238
|
-
}
|
|
239
|
-
return (react_1.default.createElement(exports.CustomTooltip, { title: item.props.children, arrow: true, enterDelay: '1000', enterNextDelay: '1000', placement: 'top-end', TransitionComponent: core_1.Fade, TransitionProps: { timeout: { enter: 100, exit: 500 } } },
|
|
240
|
-
react_1.default.createElement(core_1.ListItem, __assign({}, item.props, { key: item.key, className: classes.listItem }),
|
|
241
|
-
react_1.default.createElement(core_1.ListItemText, { primary: item.props.children, className: classes.listItemText }))));
|
|
242
|
-
}
|
|
243
|
-
function buttonClick(evento, value) {
|
|
244
|
-
evento.preventDefault();
|
|
245
|
-
evento.stopPropagation();
|
|
246
|
-
if (value !== pageNumber) {
|
|
247
|
-
verificaSaidaSlide(value);
|
|
248
|
-
setDados(function (v) { return (__assign(__assign({}, v), { slide: false })); });
|
|
249
|
-
setTimeout(function () {
|
|
250
|
-
setDados(function (v) { return (__assign(__assign({}, v), { pageNumber: value, direction: retornaDirection(value) })); });
|
|
251
|
-
setTimeout(function () { return setDados(function (v) { return (__assign(__assign({}, v), { slide: true })); }); }, 100);
|
|
252
|
-
}, 200);
|
|
253
|
-
}
|
|
254
|
-
}
|
|
255
|
-
function verificaSaidaSlide(value) {
|
|
256
|
-
var direction = '';
|
|
257
|
-
if ((value === 2 || value === 3) && pageNumber === 1)
|
|
258
|
-
direction = 'right';
|
|
259
|
-
else if (value === 3 && pageNumber === 2)
|
|
260
|
-
direction = 'right';
|
|
261
|
-
else if (value === 1 && pageNumber === 2)
|
|
262
|
-
direction = 'left';
|
|
263
|
-
direction && setDados(function (v) { return (__assign(__assign({}, v), { direction: direction })); });
|
|
264
|
-
}
|
|
265
|
-
function retornaDirection(value) {
|
|
266
|
-
if (value < pageNumber)
|
|
267
|
-
return 'right';
|
|
268
|
-
return 'left';
|
|
269
|
-
}
|
|
270
|
-
return children.map(function (section, sectionIndex) {
|
|
271
|
-
var _a, _b, _c;
|
|
272
|
-
return (react_1.default.createElement("ul", __assign({}, props, { className: clsx_1.default('MuiAutocomplete-listbox', classes.box) }),
|
|
273
|
-
react_1.default.createElement(core_1.ListSubheader, { className: classes.subHeader, style: { backgroundColor: groupHeaderColor === null || groupHeaderColor === void 0 ? void 0 : groupHeaderColor[sectionIndex], color: groupTitleColor === null || groupTitleColor === void 0 ? void 0 : groupTitleColor[sectionIndex] } },
|
|
274
|
-
section.props.children[0].props.children,
|
|
275
|
-
react_1.default.createElement(core_1.Fade, { in: sectionIndex === 0 && favoritePage && favoritosLength > 7 },
|
|
276
|
-
react_1.default.createElement("div", { className: classes.divButton },
|
|
277
|
-
react_1.default.createElement("div", { className: classes.areaButton },
|
|
278
|
-
react_1.default.createElement("div", { onClick: function (e) { return buttonClick(e, 1); }, className: clsx_1.default((_a = {}, _a[classes.buttonActive] = pageNumber === 1, _a), classes.button) }, "1")),
|
|
279
|
-
react_1.default.createElement("div", { className: classes.areaButton },
|
|
280
|
-
react_1.default.createElement("div", { onClick: function (e) { return buttonClick(e, 2); }, className: clsx_1.default((_b = {}, _b[classes.buttonActive] = pageNumber === 2, _b), classes.button) }, "2")),
|
|
281
|
-
favoritosLength > 14 &&
|
|
282
|
-
react_1.default.createElement(react_1.default.Fragment, null,
|
|
283
|
-
react_1.default.createElement("div", { className: classes.areaButton },
|
|
284
|
-
react_1.default.createElement("div", { onClick: function (e) { return buttonClick(e, 3); }, className: clsx_1.default((_c = {}, _c[classes.buttonActive] = pageNumber === 3, _c), classes.button) }, "3")))))),
|
|
285
|
-
retornaArray(sectionIndex, section).map(function (item, itemIndex) { return retornaEstrutura(sectionIndex, item); })));
|
|
286
|
-
});
|
|
287
|
-
});
|
|
288
288
|
function carimbaLista(lista) {
|
|
289
289
|
return __awaiter(this, void 0, void 0, function () {
|
|
290
290
|
var completo;
|
|
291
291
|
return __generator(this, function (_a) {
|
|
292
|
+
console.log('carimbaLista', lista);
|
|
292
293
|
completo = [];
|
|
293
294
|
lista.map(function (arr, index) {
|
|
294
295
|
index === 0 && favoritePage && setDados(function (v) { return (__assign(__assign({}, v), { favoritosLength: arr.length })); });
|
|
295
|
-
return arr.map(function (itemArr) { return itemArr.length <
|
|
296
|
+
return arr.map(function (itemArr) { return itemArr.length < itemArr.length + 1 && itemArr.push(groupName[index]); });
|
|
296
297
|
});
|
|
297
298
|
lista.forEach(function (v) {
|
|
298
299
|
for (var _i = 0, _a = v.values(); _i < _a.length; _i++) {
|
|
@@ -300,6 +301,7 @@ var AutoCompleteFavorites = function (_a) {
|
|
|
300
301
|
completo.push(item);
|
|
301
302
|
}
|
|
302
303
|
});
|
|
304
|
+
console.log('carimbaLista completo', completo);
|
|
303
305
|
setDados(function (v) { return (__assign(__assign({}, v), { lista: completo })); });
|
|
304
306
|
return [2 /*return*/];
|
|
305
307
|
});
|
|
@@ -106,9 +106,118 @@ export const CustomTooltip = withStyles((theme) => ({
|
|
|
106
106
|
}
|
|
107
107
|
}))(Tooltip);
|
|
108
108
|
|
|
109
|
-
const
|
|
109
|
+
const ListboxFavorites = forwardRef((props, ref) => {
|
|
110
110
|
|
|
111
111
|
const classes = useStyles();
|
|
112
|
+
const { children, favoritePage, dados, setDados, groupHeaderColor, groupTitleColor } = props;
|
|
113
|
+
const { pageNumber, favoritosLength, direction, slide } = dados;
|
|
114
|
+
|
|
115
|
+
console.log('Listbox', children);
|
|
116
|
+
|
|
117
|
+
function retornaInicio() {
|
|
118
|
+
switch (pageNumber) {
|
|
119
|
+
case 1:
|
|
120
|
+
return 0;
|
|
121
|
+
case 2:
|
|
122
|
+
return 7;
|
|
123
|
+
case 3:
|
|
124
|
+
return 14;
|
|
125
|
+
default: return;
|
|
126
|
+
}
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
function retornaFim() {
|
|
130
|
+
switch (pageNumber) {
|
|
131
|
+
case 1:
|
|
132
|
+
return 7;
|
|
133
|
+
case 2:
|
|
134
|
+
return 14;
|
|
135
|
+
case 3:
|
|
136
|
+
return favoritosLength;
|
|
137
|
+
default: return;
|
|
138
|
+
}
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
function retornaArray(sectionIndex, section) {
|
|
142
|
+
if (sectionIndex === 0 && favoritePage && favoritosLength > 7) return section.props.children[1].props.children.slice(retornaInicio(), retornaFim());
|
|
143
|
+
return section.props.children[1].props.children;
|
|
144
|
+
}
|
|
145
|
+
|
|
146
|
+
function retornaEstrutura(sectionIndex, item) {
|
|
147
|
+
if (sectionIndex === 0 && favoritePage && favoritosLength > 7) {
|
|
148
|
+
return (
|
|
149
|
+
<Slide in={slide} direction={direction}>
|
|
150
|
+
<CustomTooltip title={item.props.children} arrow enterDelay='1000' enterNextDelay='1000' placement='top-end' TransitionComponent={Fade} TransitionProps={{ timeout: { enter: 100, exit: 500 } }}>
|
|
151
|
+
<ListItem {...item.props} key={item.key} className={classes.listItem}>
|
|
152
|
+
<ListItemText primary={item.props.children} className={classes.listItemText} />
|
|
153
|
+
</ListItem>
|
|
154
|
+
</CustomTooltip>
|
|
155
|
+
</Slide>
|
|
156
|
+
);
|
|
157
|
+
} return (
|
|
158
|
+
<CustomTooltip title={item.props.children} arrow enterDelay='1000' enterNextDelay='1000' placement='top-end' TransitionComponent={Fade} TransitionProps={{ timeout: { enter: 100, exit: 500 } }}>
|
|
159
|
+
<ListItem {...item.props} key={item.key} className={classes.listItem}>
|
|
160
|
+
<ListItemText primary={item.props.children} className={classes.listItemText} />
|
|
161
|
+
</ListItem>
|
|
162
|
+
</CustomTooltip>
|
|
163
|
+
);
|
|
164
|
+
}
|
|
165
|
+
|
|
166
|
+
function buttonClick(evento, value) {
|
|
167
|
+
evento.preventDefault();
|
|
168
|
+
evento.stopPropagation();
|
|
169
|
+
if (value !== pageNumber) {
|
|
170
|
+
verificaSaidaSlide(value);
|
|
171
|
+
setDados(v => ({ ...v, slide: false }));
|
|
172
|
+
setTimeout(() => {
|
|
173
|
+
setDados(v => ({ ...v, pageNumber: value, direction: retornaDirection(value) }));
|
|
174
|
+
setTimeout(() => setDados(v => ({ ...v, slide: true })), 100);
|
|
175
|
+
}, 200);
|
|
176
|
+
}
|
|
177
|
+
}
|
|
178
|
+
|
|
179
|
+
function verificaSaidaSlide(value) {
|
|
180
|
+
let direction = '';
|
|
181
|
+
if ((value === 2 || value === 3) && pageNumber === 1) direction = 'right';
|
|
182
|
+
else if (value === 3 && pageNumber === 2) direction = 'right';
|
|
183
|
+
else if (value === 1 && pageNumber === 2) direction = 'left';
|
|
184
|
+
direction && setDados(v => ({ ...v, direction: direction }));
|
|
185
|
+
}
|
|
186
|
+
|
|
187
|
+
function retornaDirection(value) {
|
|
188
|
+
if (value < pageNumber) return 'right';
|
|
189
|
+
return 'left';
|
|
190
|
+
}
|
|
191
|
+
|
|
192
|
+
return children.map((section, sectionIndex) => (
|
|
193
|
+
<ul {...props} className={clsx('MuiAutocomplete-listbox', classes.box)}>
|
|
194
|
+
<ListSubheader className={classes.subHeader} style={{ backgroundColor: groupHeaderColor?.[sectionIndex], color: groupTitleColor?.[sectionIndex] }}>
|
|
195
|
+
{section.props.children[0].props.children}
|
|
196
|
+
<Fade in={sectionIndex === 0 && favoritePage && favoritosLength > 7}>
|
|
197
|
+
<div className={classes.divButton}>
|
|
198
|
+
<div className={classes.areaButton}>
|
|
199
|
+
<div onClick={e => buttonClick(e, 1)} className={clsx({ [classes.buttonActive]: pageNumber === 1 }, classes.button)}>1</div>
|
|
200
|
+
</div>
|
|
201
|
+
<div className={classes.areaButton}>
|
|
202
|
+
<div onClick={e => buttonClick(e, 2)} className={clsx({ [classes.buttonActive]: pageNumber === 2 }, classes.button)}>2</div>
|
|
203
|
+
</div>
|
|
204
|
+
{favoritosLength > 14 &&
|
|
205
|
+
<React.Fragment>
|
|
206
|
+
<div className={classes.areaButton}>
|
|
207
|
+
<div onClick={e => buttonClick(e, 3)} className={clsx({ [classes.buttonActive]: pageNumber === 3 }, classes.button)}>3</div>
|
|
208
|
+
</div>
|
|
209
|
+
</React.Fragment>
|
|
210
|
+
}
|
|
211
|
+
</div>
|
|
212
|
+
</Fade>
|
|
213
|
+
</ListSubheader>
|
|
214
|
+
{retornaArray(sectionIndex, section).map((item, itemIndex) => retornaEstrutura(sectionIndex, item))}
|
|
215
|
+
</ul>
|
|
216
|
+
));
|
|
217
|
+
});
|
|
218
|
+
|
|
219
|
+
const AutoCompleteFavorites = ({ action, busca, resposta, label, value, pgCode, favoritePage, groupName, groupHeaderColor, groupTitleColor, loadingColor, filterFunction, getOptionLabel, onChange = e => e, textFieldProps = {}, searchParams, ...props }) => {
|
|
220
|
+
|
|
112
221
|
const [dados, setDados] = useState({
|
|
113
222
|
lista: [],
|
|
114
223
|
slide: true,
|
|
@@ -119,125 +228,19 @@ const AutoCompleteFavorites = ({ action, busca, resposta, label, value, pgCode,
|
|
|
119
228
|
const [loading, setLoading] = useState(false);
|
|
120
229
|
const [inputValue, setInputValue] = useState('');
|
|
121
230
|
|
|
122
|
-
const ListboxFavorites = forwardRef((props, ref) => {
|
|
123
|
-
const { children, favoritePage, dados, setDados, groupHeaderColor, groupTitleColor } = props;
|
|
124
|
-
const { pageNumber, favoritosLength, direction, slide } = dados;
|
|
125
|
-
|
|
126
|
-
console.log('Listbox', children);
|
|
127
|
-
|
|
128
|
-
function retornaInicio() {
|
|
129
|
-
switch (pageNumber) {
|
|
130
|
-
case 1:
|
|
131
|
-
return 0;
|
|
132
|
-
case 2:
|
|
133
|
-
return 7;
|
|
134
|
-
case 3:
|
|
135
|
-
return 14;
|
|
136
|
-
default: return;
|
|
137
|
-
}
|
|
138
|
-
}
|
|
139
|
-
|
|
140
|
-
function retornaFim() {
|
|
141
|
-
switch (pageNumber) {
|
|
142
|
-
case 1:
|
|
143
|
-
return 7;
|
|
144
|
-
case 2:
|
|
145
|
-
return 14;
|
|
146
|
-
case 3:
|
|
147
|
-
return favoritosLength;
|
|
148
|
-
default: return;
|
|
149
|
-
}
|
|
150
|
-
}
|
|
151
|
-
|
|
152
|
-
function retornaArray(sectionIndex, section) {
|
|
153
|
-
if (sectionIndex === 0 && favoritePage && favoritosLength > 7) return section.props.children[1].props.children.slice(retornaInicio(), retornaFim());
|
|
154
|
-
return section.props.children[1].props.children;
|
|
155
|
-
}
|
|
156
|
-
|
|
157
|
-
function retornaEstrutura(sectionIndex, item) {
|
|
158
|
-
if (sectionIndex === 0 && favoritePage && favoritosLength > 7) {
|
|
159
|
-
return (
|
|
160
|
-
<Slide in={slide} direction={direction}>
|
|
161
|
-
<CustomTooltip title={item.props.children} arrow enterDelay='1000' enterNextDelay='1000' placement='top-end' TransitionComponent={Fade} TransitionProps={{ timeout: { enter: 100, exit: 500 } }}>
|
|
162
|
-
<ListItem {...item.props} key={item.key} className={classes.listItem}>
|
|
163
|
-
<ListItemText primary={item.props.children} className={classes.listItemText} />
|
|
164
|
-
</ListItem>
|
|
165
|
-
</CustomTooltip>
|
|
166
|
-
</Slide>
|
|
167
|
-
);
|
|
168
|
-
} return (
|
|
169
|
-
<CustomTooltip title={item.props.children} arrow enterDelay='1000' enterNextDelay='1000' placement='top-end' TransitionComponent={Fade} TransitionProps={{ timeout: { enter: 100, exit: 500 } }}>
|
|
170
|
-
<ListItem {...item.props} key={item.key} className={classes.listItem}>
|
|
171
|
-
<ListItemText primary={item.props.children} className={classes.listItemText} />
|
|
172
|
-
</ListItem>
|
|
173
|
-
</CustomTooltip>
|
|
174
|
-
);
|
|
175
|
-
}
|
|
176
|
-
|
|
177
|
-
function buttonClick(evento, value) {
|
|
178
|
-
evento.preventDefault();
|
|
179
|
-
evento.stopPropagation();
|
|
180
|
-
if (value !== pageNumber) {
|
|
181
|
-
verificaSaidaSlide(value);
|
|
182
|
-
setDados(v => ({ ...v, slide: false }));
|
|
183
|
-
setTimeout(() => {
|
|
184
|
-
setDados(v => ({ ...v, pageNumber: value, direction: retornaDirection(value) }));
|
|
185
|
-
setTimeout(() => setDados(v => ({ ...v, slide: true })), 100);
|
|
186
|
-
}, 200);
|
|
187
|
-
}
|
|
188
|
-
}
|
|
189
|
-
|
|
190
|
-
function verificaSaidaSlide(value) {
|
|
191
|
-
let direction = '';
|
|
192
|
-
if ((value === 2 || value === 3) && pageNumber === 1) direction = 'right';
|
|
193
|
-
else if (value === 3 && pageNumber === 2) direction = 'right';
|
|
194
|
-
else if (value === 1 && pageNumber === 2) direction = 'left';
|
|
195
|
-
direction && setDados(v => ({ ...v, direction: direction }));
|
|
196
|
-
}
|
|
197
|
-
|
|
198
|
-
function retornaDirection(value) {
|
|
199
|
-
if (value < pageNumber) return 'right';
|
|
200
|
-
return 'left';
|
|
201
|
-
}
|
|
202
|
-
|
|
203
|
-
return children.map((section, sectionIndex) => (
|
|
204
|
-
<ul {...props} className={clsx('MuiAutocomplete-listbox', classes.box)}>
|
|
205
|
-
<ListSubheader className={classes.subHeader} style={{ backgroundColor: groupHeaderColor?.[sectionIndex], color: groupTitleColor?.[sectionIndex] }}>
|
|
206
|
-
{section.props.children[0].props.children}
|
|
207
|
-
<Fade in={sectionIndex === 0 && favoritePage && favoritosLength > 7}>
|
|
208
|
-
<div className={classes.divButton}>
|
|
209
|
-
<div className={classes.areaButton}>
|
|
210
|
-
<div onClick={e => buttonClick(e, 1)} className={clsx({ [classes.buttonActive]: pageNumber === 1 }, classes.button)}>1</div>
|
|
211
|
-
</div>
|
|
212
|
-
<div className={classes.areaButton}>
|
|
213
|
-
<div onClick={e => buttonClick(e, 2)} className={clsx({ [classes.buttonActive]: pageNumber === 2 }, classes.button)}>2</div>
|
|
214
|
-
</div>
|
|
215
|
-
{favoritosLength > 14 &&
|
|
216
|
-
<React.Fragment>
|
|
217
|
-
<div className={classes.areaButton}>
|
|
218
|
-
<div onClick={e => buttonClick(e, 3)} className={clsx({ [classes.buttonActive]: pageNumber === 3 }, classes.button)}>3</div>
|
|
219
|
-
</div>
|
|
220
|
-
</React.Fragment>
|
|
221
|
-
}
|
|
222
|
-
</div>
|
|
223
|
-
</Fade>
|
|
224
|
-
</ListSubheader>
|
|
225
|
-
{retornaArray(sectionIndex, section).map((item, itemIndex) => retornaEstrutura(sectionIndex, item))}
|
|
226
|
-
</ul>
|
|
227
|
-
));
|
|
228
|
-
});
|
|
229
|
-
|
|
230
231
|
async function carimbaLista(lista) {
|
|
232
|
+
console.log('carimbaLista', lista);
|
|
231
233
|
let completo = [];
|
|
232
234
|
lista.map((arr, index) => {
|
|
233
235
|
index === 0 && favoritePage && setDados(v => ({ ...v, favoritosLength: arr.length }));
|
|
234
|
-
return arr.map(itemArr => itemArr.length <
|
|
236
|
+
return arr.map(itemArr => itemArr.length < itemArr.length + 1 && itemArr.push(groupName[index]));
|
|
235
237
|
});
|
|
236
238
|
lista.forEach(v => {
|
|
237
239
|
for (let item of v.values()) {
|
|
238
240
|
completo.push(item);
|
|
239
241
|
}
|
|
240
242
|
});
|
|
243
|
+
console.log('carimbaLista completo', completo);
|
|
241
244
|
setDados(v => ({ ...v, lista: completo }));
|
|
242
245
|
}
|
|
243
246
|
|