componentes-sinco 1.0.1-rc.6 → 1.0.1-rc.8
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/dist/index.cjs +516 -92
- package/dist/index.css +3 -0
- package/dist/index.d.cts +57 -22
- package/dist/index.d.ts +57 -22
- package/dist/index.js +499 -77
- package/package.json +2 -3
- package/dist/index.d.mts +0 -361
- package/dist/index.mjs +0 -3450
package/dist/index.cjs
CHANGED
|
@@ -63,7 +63,9 @@ __export(index_exports, {
|
|
|
63
63
|
AdproSincoTheme: () => AdproSincoTheme,
|
|
64
64
|
FooterAction: () => FooterAction,
|
|
65
65
|
PageHeader: () => PageHeader,
|
|
66
|
+
SCAutocomplete: () => SCAutocomplete,
|
|
66
67
|
SCCalendarSwipeable: () => SCCalendarSwipeable,
|
|
68
|
+
SCDataGrid: () => SCDataGrid,
|
|
67
69
|
SCDialog: () => SCDialog,
|
|
68
70
|
SCDrawer: () => SCDrawer,
|
|
69
71
|
SCMenu: () => SCMenu,
|
|
@@ -1099,8 +1101,7 @@ var import_material6 = require("@mui/material");
|
|
|
1099
1101
|
var import_Grid23 = __toESM(require("@mui/material/Grid2"), 1);
|
|
1100
1102
|
var import_Close2 = __toESM(require("@mui/icons-material/Close"), 1);
|
|
1101
1103
|
var Muicon3 = __toESM(require("@mui/icons-material"), 1);
|
|
1102
|
-
var SCDialog = ({ title, iconTitle, subtitle, content, actions
|
|
1103
|
-
} }], buttonDialog, disableClose, dividers, widthContent, heightContent, background, setShow, show }) => {
|
|
1104
|
+
var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, disableClose, dividers, widthContent, heightContent, background, setShow, show }) => {
|
|
1104
1105
|
let i = 0;
|
|
1105
1106
|
let iconTitleValidation = "";
|
|
1106
1107
|
let IconTitle;
|
|
@@ -1139,7 +1140,7 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions = [{ text: "Cerra
|
|
|
1139
1140
|
setShow(false);
|
|
1140
1141
|
}
|
|
1141
1142
|
};
|
|
1142
|
-
|
|
1143
|
+
const dialogActions = actions != null ? actions : [{ text: "Cerrar", fn: handleClose }];
|
|
1143
1144
|
content = content != null ? content : { component: /* @__PURE__ */ import_react9.default.createElement(import_material6.Box, null, " Aqui va el contenido ") };
|
|
1144
1145
|
return /* @__PURE__ */ import_react9.default.createElement("div", null, buttonDialog ? /* @__PURE__ */ import_react9.default.createElement(import_react9.default.Fragment, null, buttonDialog.text != void 0 ? /* @__PURE__ */ import_react9.default.createElement(import_material6.Tooltip, { placement: "bottom-start", title: buttonDialog.tooltip != void 0 ? buttonDialog.tooltip : "", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ import_react9.default.createElement(import_material6.Button, { size: "small", color: buttonDialog.color != void 0 ? buttonDialog.color : "primary", variant: (buttonDialog == null ? void 0 : buttonDialog.variant) != void 0 ? buttonDialog == null ? void 0 : buttonDialog.variant : "text", startIcon: (buttonDialog == null ? void 0 : buttonDialog.iconPosition) == "left" || !(buttonDialog == null ? void 0 : buttonDialog.iconPosition) ? /* @__PURE__ */ import_react9.default.createElement(ButtonIcon, { color: buttonDialog.color != void 0 ? buttonDialog.color : "primary" }) : "", endIcon: (buttonDialog == null ? void 0 : buttonDialog.iconPosition) == "right" ? /* @__PURE__ */ import_react9.default.createElement(ButtonIcon, { color: buttonDialog.color != void 0 ? buttonDialog.color : "primary" }) : "", onClick: handleOpen }, " ", (buttonDialog == null ? void 0 : buttonDialog.text) != void 0 ? buttonDialog.text : "", " ")) : /* @__PURE__ */ import_react9.default.createElement(import_material6.IconButton, { style: { cursor: "pointer" }, onClick: handleOpen }, /* @__PURE__ */ import_react9.default.createElement(import_material6.SvgIcon, { fontSize: "small", color: (buttonDialog == null ? void 0 : buttonDialog.color) != void 0 ? buttonDialog == null ? void 0 : buttonDialog.color : "action", component: ButtonIcon }))) : "", /* @__PURE__ */ import_react9.default.createElement(import_material6.Modal, { open: open || false, onClose: handleClose }, /* @__PURE__ */ import_react9.default.createElement(
|
|
1145
1146
|
import_material6.Dialog,
|
|
@@ -1177,12 +1178,12 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions = [{ text: "Cerra
|
|
|
1177
1178
|
}
|
|
1178
1179
|
) : content.component
|
|
1179
1180
|
),
|
|
1180
|
-
|
|
1181
|
+
dialogActions.length > 0 ? /* @__PURE__ */ import_react9.default.createElement(import_material6.DialogActions, { sx: { gap: 1, m: 0, padding: "12px 16px 12px 16px" } }, dialogActions.map((boton) => /* @__PURE__ */ import_react9.default.createElement(
|
|
1181
1182
|
import_material6.Button,
|
|
1182
1183
|
{
|
|
1183
1184
|
key: i = i + 1,
|
|
1184
1185
|
autoFocus: true,
|
|
1185
|
-
variant: i == 1 ||
|
|
1186
|
+
variant: i == 1 || dialogActions.length < 2 ? "contained" : "text",
|
|
1186
1187
|
color: "primary",
|
|
1187
1188
|
size: "small",
|
|
1188
1189
|
onClick: boton.fn,
|
|
@@ -1281,11 +1282,13 @@ var import_material8 = require("@mui/material");
|
|
|
1281
1282
|
var import_TabPanel = __toESM(require("@mui/lab/TabPanel"), 1);
|
|
1282
1283
|
var import_TabContext = __toESM(require("@mui/lab/TabContext"), 1);
|
|
1283
1284
|
var Muicon5 = __toESM(require("@mui/icons-material"), 1);
|
|
1284
|
-
var SCTabs = ({ options, defaultOption, background, iconPosition, colorTab, orientation, variant, scrollButtons, children }) => {
|
|
1285
|
+
var SCTabs = ({ options, defaultOption, typeIcon, background, iconPosition, colorTab, orientation, variant, scrollButtons, children }) => {
|
|
1286
|
+
const [toast, setToast] = import_react12.default.useState(null);
|
|
1285
1287
|
let i = 0;
|
|
1286
1288
|
let j = 0;
|
|
1287
1289
|
let k = 0;
|
|
1288
1290
|
let l = 0;
|
|
1291
|
+
let validateTypeIcon = true;
|
|
1289
1292
|
const [value, setValue] = import_react12.default.useState("1");
|
|
1290
1293
|
(0, import_react12.useEffect)(() => {
|
|
1291
1294
|
if (defaultOption) {
|
|
@@ -1293,11 +1296,40 @@ var SCTabs = ({ options, defaultOption, background, iconPosition, colorTab, orie
|
|
|
1293
1296
|
}
|
|
1294
1297
|
}, [defaultOption]);
|
|
1295
1298
|
options.map(function(option) {
|
|
1296
|
-
|
|
1297
|
-
|
|
1298
|
-
|
|
1299
|
-
|
|
1300
|
-
|
|
1299
|
+
const optionsLength = options.length;
|
|
1300
|
+
if (option == null ? void 0 : option.iconOrBadge) {
|
|
1301
|
+
if (typeIcon == "icon") {
|
|
1302
|
+
if ((option == null ? void 0 : option.iconOrBadge) in Muicon5 == true) {
|
|
1303
|
+
validateTypeIcon = true;
|
|
1304
|
+
option.iconOrBadge = Muicon5[option == null ? void 0 : option.iconOrBadge];
|
|
1305
|
+
} else {
|
|
1306
|
+
validateTypeIcon = false;
|
|
1307
|
+
setTimeout(() => {
|
|
1308
|
+
setToast({
|
|
1309
|
+
type: "error",
|
|
1310
|
+
title: "Componente SCTabs",
|
|
1311
|
+
subtitle: "En Option todos los iconOrBadge deben ser iconos de MUI, por favor verificar.",
|
|
1312
|
+
time: 50
|
|
1313
|
+
});
|
|
1314
|
+
}, 10);
|
|
1315
|
+
return;
|
|
1316
|
+
}
|
|
1317
|
+
} else if (typeIcon == "badge") {
|
|
1318
|
+
if ((option == null ? void 0 : option.iconOrBadge) in Muicon5 == false) {
|
|
1319
|
+
validateTypeIcon = true;
|
|
1320
|
+
option;
|
|
1321
|
+
} else {
|
|
1322
|
+
validateTypeIcon = false;
|
|
1323
|
+
setTimeout(() => {
|
|
1324
|
+
setToast({
|
|
1325
|
+
type: "error",
|
|
1326
|
+
title: "Componente SCTabs",
|
|
1327
|
+
subtitle: "En Option todos los iconOrBadge deben ser numeros para el badge, por favor verificar.",
|
|
1328
|
+
time: 10
|
|
1329
|
+
});
|
|
1330
|
+
}, 10);
|
|
1331
|
+
return;
|
|
1332
|
+
}
|
|
1301
1333
|
}
|
|
1302
1334
|
}
|
|
1303
1335
|
});
|
|
@@ -1308,7 +1340,7 @@ var SCTabs = ({ options, defaultOption, background, iconPosition, colorTab, orie
|
|
|
1308
1340
|
setValue(newValue);
|
|
1309
1341
|
}
|
|
1310
1342
|
};
|
|
1311
|
-
return /* @__PURE__ */ import_react12.default.createElement(import_react12.default.Fragment, null, /* @__PURE__ */ import_react12.default.createElement(import_material8.Box, { sx: { height: orientation == "vertical" ? "100%" : "auto", display: "flex", flexDirection: orientation == "vertical" ? "row" : "column" }, id: "tabsitos" }, /* @__PURE__ */ import_react12.default.createElement(import_TabContext.default, { value }, /* @__PURE__ */ import_react12.default.createElement(
|
|
1343
|
+
return /* @__PURE__ */ import_react12.default.createElement(import_react12.default.Fragment, null, validateTypeIcon == true ? /* @__PURE__ */ import_react12.default.createElement(import_material8.Box, { sx: { height: orientation == "vertical" ? "100%" : "auto", display: "flex", flexDirection: orientation == "vertical" ? "row" : "column" }, id: "tabsitos" }, /* @__PURE__ */ import_react12.default.createElement(import_TabContext.default, { value }, /* @__PURE__ */ import_react12.default.createElement(
|
|
1312
1344
|
import_material8.Tabs,
|
|
1313
1345
|
{
|
|
1314
1346
|
value,
|
|
@@ -1329,7 +1361,7 @@ var SCTabs = ({ options, defaultOption, background, iconPosition, colorTab, orie
|
|
|
1329
1361
|
label: option.name || "",
|
|
1330
1362
|
disabled: option.disabled || false,
|
|
1331
1363
|
iconPosition: iconPosition || "end",
|
|
1332
|
-
icon:
|
|
1364
|
+
icon: typeIcon == "badge" ? /* @__PURE__ */ import_react12.default.createElement(
|
|
1333
1365
|
import_material8.Badge,
|
|
1334
1366
|
{
|
|
1335
1367
|
sx: {
|
|
@@ -1341,10 +1373,10 @@ var SCTabs = ({ options, defaultOption, background, iconPosition, colorTab, orie
|
|
|
1341
1373
|
}
|
|
1342
1374
|
},
|
|
1343
1375
|
variant: "standard",
|
|
1344
|
-
badgeContent: option.
|
|
1376
|
+
badgeContent: option.iconOrBadge,
|
|
1345
1377
|
color: value == String(i) ? colorTab ? colorTab : "primary" : "default"
|
|
1346
1378
|
}
|
|
1347
|
-
) :
|
|
1379
|
+
) : typeIcon == "icon" ? /* @__PURE__ */ import_react12.default.createElement(import_material8.SvgIcon, { fontSize: "small", component: option.iconOrBadge, color: value == String(i) ? colorTab ? colorTab : "primary" : "action", sx: { width: "20px", height: "20px" } }) : "",
|
|
1348
1380
|
sx: { "& .MuiTab-icon": { margin: "0px !important" }, padding: "10px 16px", gap: "4px" }
|
|
1349
1381
|
}
|
|
1350
1382
|
))
|
|
@@ -1356,12 +1388,12 @@ var SCTabs = ({ options, defaultOption, background, iconPosition, colorTab, orie
|
|
|
1356
1388
|
sx: { padding: "16px" }
|
|
1357
1389
|
},
|
|
1358
1390
|
option.page ? option.page : /* @__PURE__ */ import_react12.default.createElement(import_material8.Typography, null, "No se ha configurado el componente a visualizar ")
|
|
1359
|
-
)))));
|
|
1391
|
+
)))) : /* @__PURE__ */ import_react12.default.createElement(import_material8.Box, { sx: { height: "200px" } }, toast && /* @__PURE__ */ import_react12.default.createElement(SCToastNotification, __spreadValues({}, toast))));
|
|
1360
1392
|
};
|
|
1361
1393
|
|
|
1362
1394
|
// src/Components/FooterAction/FooterAction.tsx
|
|
1363
|
-
var import_material9 = require("@mui/material");
|
|
1364
1395
|
var import_react13 = __toESM(require("react"), 1);
|
|
1396
|
+
var import_material9 = require("@mui/material");
|
|
1365
1397
|
var FooterAction = ({
|
|
1366
1398
|
leftContent,
|
|
1367
1399
|
rightContent,
|
|
@@ -1388,51 +1420,24 @@ var FooterAction = ({
|
|
|
1388
1420
|
);
|
|
1389
1421
|
};
|
|
1390
1422
|
|
|
1391
|
-
// src/Components/PageHeader/PageHeader.tsx
|
|
1392
|
-
var import_react14 = __toESM(require("react"), 1);
|
|
1393
|
-
var import_material10 = require("@mui/material");
|
|
1394
|
-
var PageHeader = ({
|
|
1395
|
-
title,
|
|
1396
|
-
subtitle,
|
|
1397
|
-
actions,
|
|
1398
|
-
buttonBack,
|
|
1399
|
-
fixed,
|
|
1400
|
-
shadow = true
|
|
1401
|
-
}) => {
|
|
1402
|
-
return /* @__PURE__ */ import_react14.default.createElement(
|
|
1403
|
-
import_material10.Stack,
|
|
1404
|
-
{
|
|
1405
|
-
"data-testid": "main-container",
|
|
1406
|
-
justifyContent: "center",
|
|
1407
|
-
height: 48,
|
|
1408
|
-
position: fixed ? "fixed" : "relative",
|
|
1409
|
-
width: fixed ? "100%" : "inherit",
|
|
1410
|
-
bgcolor: "background.paper",
|
|
1411
|
-
zIndex: 10,
|
|
1412
|
-
sx: { boxShadow: shadow ? (theme) => theme.shadows[1] : "none" }
|
|
1413
|
-
},
|
|
1414
|
-
/* @__PURE__ */ import_react14.default.createElement(import_material10.Stack, { "data-testid": "page-header-content", height: 40, px: 3, pl: buttonBack ? 1 : 3, direction: "row", alignItems: "center", justifyContent: "space-between" }, /* @__PURE__ */ import_react14.default.createElement(import_material10.Stack, { id: "left-section", direction: "row", alignItems: "center", gap: 1 }, buttonBack, /* @__PURE__ */ import_react14.default.createElement(import_material10.Stack, { id: "text-section", gap: 0.5 }, /* @__PURE__ */ import_react14.default.createElement(import_material10.Typography, { "data-testid": "page-header-title", variant: "h6", color: "text.primary" }, title), subtitle && /* @__PURE__ */ import_react14.default.createElement(import_material10.Typography, { "data-testid": "page-header-subtitle", variant: "caption", color: "text.primary" }, subtitle))), actions && /* @__PURE__ */ import_react14.default.createElement(import_material10.Stack, { id: "right-actions", direction: "row", alignItems: "center", gap: 1 }, actions))
|
|
1415
|
-
);
|
|
1416
|
-
};
|
|
1417
|
-
|
|
1418
1423
|
// src/Components/Modal/Helpers/Data.tsx
|
|
1419
|
-
var
|
|
1424
|
+
var import_react14 = __toESM(require("react"), 1);
|
|
1420
1425
|
var import_icons_material7 = require("@mui/icons-material");
|
|
1421
1426
|
var modalStateConfig = {
|
|
1422
1427
|
info: {
|
|
1423
1428
|
color: "info",
|
|
1424
1429
|
defaultDescription: "Se [sincronizar\xE1n] los datos trabajados en modo offline y se [subir\xE1n] a los servidores.",
|
|
1425
|
-
icon: /* @__PURE__ */
|
|
1430
|
+
icon: /* @__PURE__ */ import_react14.default.createElement(import_icons_material7.Info, { color: "info", fontSize: "medium" })
|
|
1426
1431
|
},
|
|
1427
1432
|
delete: {
|
|
1428
1433
|
color: "delete",
|
|
1429
1434
|
defaultDescription: "[Elemento espec\xEDfico] [dejar\xE1 de existir en todos los lugares donde est\xE9 en uso]. Esta acci\xF3n es irreversible.",
|
|
1430
|
-
icon: /* @__PURE__ */
|
|
1435
|
+
icon: /* @__PURE__ */ import_react14.default.createElement(import_icons_material7.Info, { color: "error", fontSize: "medium" })
|
|
1431
1436
|
},
|
|
1432
1437
|
warning: {
|
|
1433
1438
|
color: "warning",
|
|
1434
1439
|
defaultDescription: "Se descartar\xE1 la [creaci\xF3n] y los cambios se perder\xE1n.",
|
|
1435
|
-
icon: /* @__PURE__ */
|
|
1440
|
+
icon: /* @__PURE__ */ import_react14.default.createElement(import_icons_material7.Warning, { color: "warning", fontSize: "medium" })
|
|
1436
1441
|
}
|
|
1437
1442
|
};
|
|
1438
1443
|
|
|
@@ -1462,8 +1467,8 @@ var getButtonColor = (state) => {
|
|
|
1462
1467
|
};
|
|
1463
1468
|
|
|
1464
1469
|
// src/Components/Modal/SCModal.tsx
|
|
1465
|
-
var
|
|
1466
|
-
var
|
|
1470
|
+
var import_react15 = __toESM(require("react"), 1);
|
|
1471
|
+
var import_material10 = require("@mui/material");
|
|
1467
1472
|
var import_icons_material9 = require("@mui/icons-material");
|
|
1468
1473
|
var SCModal = ({
|
|
1469
1474
|
buttonModal,
|
|
@@ -1474,35 +1479,35 @@ var SCModal = ({
|
|
|
1474
1479
|
action
|
|
1475
1480
|
}) => {
|
|
1476
1481
|
var _a, _b, _c, _d, _e;
|
|
1477
|
-
const [openModal, setOpenModal] = (0,
|
|
1478
|
-
(0,
|
|
1482
|
+
const [openModal, setOpenModal] = (0, import_react15.useState)(open != null ? open : false);
|
|
1483
|
+
(0, import_react15.useEffect)(() => {
|
|
1479
1484
|
if (open !== void 0) {
|
|
1480
1485
|
setOpenModal(open);
|
|
1481
1486
|
}
|
|
1482
1487
|
}, [open]);
|
|
1483
|
-
const Icon = (0,
|
|
1484
|
-
const handleClose = (0,
|
|
1488
|
+
const Icon = (0, import_react15.useMemo)(() => getIconComponent2(buttonModal == null ? void 0 : buttonModal.icon), [buttonModal == null ? void 0 : buttonModal.icon]);
|
|
1489
|
+
const handleClose = (0, import_react15.useCallback)(() => setOpenModal(false), []);
|
|
1485
1490
|
const toggleModal = (newOpen) => () => setOpenModal(newOpen);
|
|
1486
|
-
const prevAction = (0,
|
|
1491
|
+
const prevAction = (0, import_react15.useMemo)(
|
|
1487
1492
|
() => action != null ? action : [{ text: "Cancelar", fn: handleClose }, { text: "Consultar", fn: () => {
|
|
1488
1493
|
} }],
|
|
1489
1494
|
[action, handleClose]
|
|
1490
1495
|
);
|
|
1491
1496
|
const { icon, defaultDescription } = modalStateConfig[state];
|
|
1492
|
-
return /* @__PURE__ */
|
|
1493
|
-
|
|
1497
|
+
return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, /* @__PURE__ */ import_react15.default.createElement(
|
|
1498
|
+
import_material10.Button,
|
|
1494
1499
|
{
|
|
1495
1500
|
"data-testid": "test-buttonModal",
|
|
1496
1501
|
color: (_a = buttonModal == null ? void 0 : buttonModal.color) != null ? _a : "primary",
|
|
1497
1502
|
onClick: toggleModal(true),
|
|
1498
1503
|
variant: (_b = buttonModal == null ? void 0 : buttonModal.variant) != null ? _b : "text",
|
|
1499
1504
|
size: (_c = buttonModal == null ? void 0 : buttonModal.size) != null ? _c : "small",
|
|
1500
|
-
startIcon: (buttonModal == null ? void 0 : buttonModal.iconPosition) === "left" && /* @__PURE__ */
|
|
1501
|
-
endIcon: (buttonModal == null ? void 0 : buttonModal.iconPosition) === "right" && /* @__PURE__ */
|
|
1505
|
+
startIcon: (buttonModal == null ? void 0 : buttonModal.iconPosition) === "left" && /* @__PURE__ */ import_react15.default.createElement(Icon, null),
|
|
1506
|
+
endIcon: (buttonModal == null ? void 0 : buttonModal.iconPosition) === "right" && /* @__PURE__ */ import_react15.default.createElement(Icon, null)
|
|
1502
1507
|
},
|
|
1503
1508
|
capitalize((_d = buttonModal == null ? void 0 : buttonModal.text) != null ? _d : "filtrar")
|
|
1504
|
-
), /* @__PURE__ */
|
|
1505
|
-
|
|
1509
|
+
), /* @__PURE__ */ import_react15.default.createElement(import_material10.Modal, { open: openModal, onClose: toggleModal(false), sx: { boxShadow: 8 } }, /* @__PURE__ */ import_react15.default.createElement(
|
|
1510
|
+
import_material10.Box,
|
|
1506
1511
|
{
|
|
1507
1512
|
sx: {
|
|
1508
1513
|
position: "absolute",
|
|
@@ -1515,10 +1520,10 @@ var SCModal = ({
|
|
|
1515
1520
|
boxShadow: 24
|
|
1516
1521
|
}
|
|
1517
1522
|
},
|
|
1518
|
-
/* @__PURE__ */
|
|
1519
|
-
/* @__PURE__ */
|
|
1520
|
-
action && /* @__PURE__ */
|
|
1521
|
-
|
|
1523
|
+
/* @__PURE__ */ import_react15.default.createElement(import_material10.Stack, { direction: "row", justifyContent: "space-between", alignItems: "center" }, /* @__PURE__ */ import_react15.default.createElement(import_material10.Stack, { direction: "row", alignItems: "center", p: 1, gap: 1.5 }, /* @__PURE__ */ import_react15.default.createElement(import_material10.Box, { display: "flex", justifyContent: "center", alignItems: "center", borderRadius: "50%", height: 36, width: 36, bgcolor: getModalColor(state) }, icon), /* @__PURE__ */ import_react15.default.createElement(import_material10.Typography, { variant: "h6", color: "text.primary" }, title)), /* @__PURE__ */ import_react15.default.createElement(import_material10.IconButton, { onClick: toggleModal(false), "data-testid": "test-buttonClose" }, /* @__PURE__ */ import_react15.default.createElement(import_icons_material9.Close, { color: "action" }))),
|
|
1524
|
+
/* @__PURE__ */ import_react15.default.createElement(import_material10.Stack, { py: 1, px: 3, gap: 1.5 }, /* @__PURE__ */ import_react15.default.createElement(import_material10.Typography, { variant: "body1" }, description || defaultDescription)),
|
|
1525
|
+
action && /* @__PURE__ */ import_react15.default.createElement(
|
|
1526
|
+
import_material10.Stack,
|
|
1522
1527
|
{
|
|
1523
1528
|
id: "Action",
|
|
1524
1529
|
direction: "row",
|
|
@@ -1528,8 +1533,8 @@ var SCModal = ({
|
|
|
1528
1533
|
bgcolor: "grey.50",
|
|
1529
1534
|
sx: { borderRadius: 1 }
|
|
1530
1535
|
},
|
|
1531
|
-
/* @__PURE__ */
|
|
1532
|
-
|
|
1536
|
+
/* @__PURE__ */ import_react15.default.createElement(
|
|
1537
|
+
import_material10.Button,
|
|
1533
1538
|
{
|
|
1534
1539
|
color: "inherit",
|
|
1535
1540
|
variant: "text",
|
|
@@ -1538,8 +1543,8 @@ var SCModal = ({
|
|
|
1538
1543
|
},
|
|
1539
1544
|
capitalize("cancelar")
|
|
1540
1545
|
),
|
|
1541
|
-
/* @__PURE__ */
|
|
1542
|
-
|
|
1546
|
+
/* @__PURE__ */ import_react15.default.createElement(
|
|
1547
|
+
import_material10.Button,
|
|
1543
1548
|
{
|
|
1544
1549
|
"data-testid": "test-aceptar",
|
|
1545
1550
|
color: getButtonColor(state),
|
|
@@ -1554,6 +1559,33 @@ var SCModal = ({
|
|
|
1554
1559
|
)));
|
|
1555
1560
|
};
|
|
1556
1561
|
|
|
1562
|
+
// src/Components/PageHeader/PageHeader.tsx
|
|
1563
|
+
var import_react16 = __toESM(require("react"), 1);
|
|
1564
|
+
var import_material11 = require("@mui/material");
|
|
1565
|
+
var PageHeader = ({
|
|
1566
|
+
title,
|
|
1567
|
+
subtitle,
|
|
1568
|
+
actions,
|
|
1569
|
+
buttonBack,
|
|
1570
|
+
fixed,
|
|
1571
|
+
shadow = true
|
|
1572
|
+
}) => {
|
|
1573
|
+
return /* @__PURE__ */ import_react16.default.createElement(
|
|
1574
|
+
import_material11.Stack,
|
|
1575
|
+
{
|
|
1576
|
+
"data-testid": "main-container",
|
|
1577
|
+
justifyContent: "center",
|
|
1578
|
+
height: 48,
|
|
1579
|
+
position: fixed ? "fixed" : "relative",
|
|
1580
|
+
width: fixed ? "100%" : "inherit",
|
|
1581
|
+
bgcolor: "background.paper",
|
|
1582
|
+
zIndex: 10,
|
|
1583
|
+
sx: { boxShadow: shadow ? (theme) => theme.shadows[1] : "none" }
|
|
1584
|
+
},
|
|
1585
|
+
/* @__PURE__ */ import_react16.default.createElement(import_material11.Stack, { "data-testid": "page-header-content", height: 40, px: 3, pl: buttonBack ? 1 : 3, direction: "row", alignItems: "center", justifyContent: "space-between" }, /* @__PURE__ */ import_react16.default.createElement(import_material11.Stack, { id: "left-section", direction: "row", alignItems: "center", gap: 1 }, buttonBack, /* @__PURE__ */ import_react16.default.createElement(import_material11.Stack, { id: "text-section", gap: 0.5 }, /* @__PURE__ */ import_react16.default.createElement(import_material11.Typography, { "data-testid": "page-header-title", variant: "h6", color: "text.primary" }, title), subtitle && /* @__PURE__ */ import_react16.default.createElement(import_material11.Typography, { "data-testid": "page-header-subtitle", variant: "caption", color: "text.primary" }, subtitle))), actions && /* @__PURE__ */ import_react16.default.createElement(import_material11.Stack, { id: "right-actions", direction: "row", alignItems: "center", gap: 1 }, actions))
|
|
1586
|
+
);
|
|
1587
|
+
};
|
|
1588
|
+
|
|
1557
1589
|
// src/Components/SCCalendarSwipeable.tsx
|
|
1558
1590
|
var import_react17 = __toESM(require("react"), 1);
|
|
1559
1591
|
var import_material12 = require("@mui/material");
|
|
@@ -1599,13 +1631,8 @@ var SCCalendarSwipeable = ({
|
|
|
1599
1631
|
const toggleCalendar = (newOpen) => () => {
|
|
1600
1632
|
setOpenCalendar(newOpen);
|
|
1601
1633
|
};
|
|
1602
|
-
const locale =
|
|
1603
|
-
|
|
1604
|
-
weekStartsOn: 0
|
|
1605
|
-
// 0 para domingo, 1 para lunes, etc.
|
|
1606
|
-
}
|
|
1607
|
-
});
|
|
1608
|
-
return /* @__PURE__ */ import_react17.default.createElement(import_react17.default.Fragment, null, /* @__PURE__ */ import_react17.default.createElement(import_LocalizationProvider.LocalizationProvider, { dateAdapter: import_AdapterDateFns.AdapterDateFns }, openCalendar == false ? /* @__PURE__ */ import_react17.default.createElement(import_material12.Box, { sx: { width: "100%", background: background ? background : "white", display: "flex", flexDirection: "column", alignItems: "center" } }, /* @__PURE__ */ import_react17.default.createElement(import_material12.Box, { sx: { width: "100%", maxWidth: "320px", background: "transparent" } }, /* @__PURE__ */ import_react17.default.createElement(import_Grid25.default, { container: true, gap: 0.5, sx: {
|
|
1634
|
+
const locale = __spreadValues({}, import_locale.es);
|
|
1635
|
+
return /* @__PURE__ */ import_react17.default.createElement(import_react17.default.Fragment, null, /* @__PURE__ */ import_react17.default.createElement(import_LocalizationProvider.LocalizationProvider, { dateAdapter: import_AdapterDateFns.AdapterDateFns, adapterLocale: locale }, openCalendar == false ? /* @__PURE__ */ import_react17.default.createElement(import_material12.Box, { "data-testid": "calendar-mobile", sx: { width: "100%", background: background ? background : "white", display: "flex", flexDirection: "column", alignItems: "center" } }, /* @__PURE__ */ import_react17.default.createElement(import_material12.Box, { sx: { width: "100%", maxWidth: "320px", background: "transparent" } }, /* @__PURE__ */ import_react17.default.createElement(import_Grid25.default, { container: true, gap: 0.5, sx: {
|
|
1609
1636
|
justifyContent: "space-between",
|
|
1610
1637
|
padding: "12px 0px",
|
|
1611
1638
|
background: "transparent"
|
|
@@ -1626,7 +1653,7 @@ var SCCalendarSwipeable = ({
|
|
|
1626
1653
|
}
|
|
1627
1654
|
},
|
|
1628
1655
|
/* @__PURE__ */ import_react17.default.createElement(import_material12.Typography, { sx: { fontSize: "12px !important", color: (0, import_date_fns.isSameDay)(dia, fecha) ? "white" : "#101840DE" } }, (0, import_date_fns.format)(dia, "d"))
|
|
1629
|
-
)))), /* @__PURE__ */ import_react17.default.createElement(import_Grid25.default, { container: true, justifyContent: "center" }, /* @__PURE__ */ import_react17.default.createElement(import_material12.IconButton, { onClick: toggleCalendar(true) }, /* @__PURE__ */ import_react17.default.createElement(import_KeyboardDoubleArrowDown.default, null))))) : /* @__PURE__ */ import_react17.default.createElement(import_material12.Box, { sx: { width: "100%", background: "white" } }, /* @__PURE__ */ import_react17.default.createElement(
|
|
1656
|
+
)))), /* @__PURE__ */ import_react17.default.createElement(import_Grid25.default, { container: true, justifyContent: "center" }, /* @__PURE__ */ import_react17.default.createElement(import_material12.IconButton, { "data-testid": "open-calendar-button", onClick: toggleCalendar(true) }, /* @__PURE__ */ import_react17.default.createElement(import_KeyboardDoubleArrowDown.default, null))))) : /* @__PURE__ */ import_react17.default.createElement(import_material12.Box, { sx: { width: "100%", background: "white" } }, /* @__PURE__ */ import_react17.default.createElement(
|
|
1630
1657
|
import_StaticDatePicker.StaticDatePicker,
|
|
1631
1658
|
{
|
|
1632
1659
|
orientation: "landscape",
|
|
@@ -1636,15 +1663,413 @@ var SCCalendarSwipeable = ({
|
|
|
1636
1663
|
sx: { fontSize: "12px !important", height: "300px !important", background: background ? background : "white", "& .MuiDayCalendar-header": { justifyContent: "space-between" }, "& .MuiDayCalendar-weekContainer": { justifyContent: "space-between" }, "& .MuiPickersCalendarHeader-root": { paddingLeft: "0px", paddingRight: "0px", color: "#10184099" }, "& .MuiPickersDay-root": { fontSize: "12px !important" }, "& .MuiDayCalendar-weekDayLabel": { fontSize: "12px !important" } },
|
|
1637
1664
|
onChange: (newValue) => setFecha(newValue)
|
|
1638
1665
|
}
|
|
1639
|
-
), /* @__PURE__ */ import_react17.default.createElement(import_Grid25.default, { container: true, justifyContent: "center" }, /* @__PURE__ */ import_react17.default.createElement(import_material12.IconButton, { onClick: toggleCalendar(false) }, /* @__PURE__ */ import_react17.default.createElement(import_KeyboardDoubleArrowUp.default, null))))));
|
|
1666
|
+
), /* @__PURE__ */ import_react17.default.createElement(import_Grid25.default, { container: true, justifyContent: "center" }, /* @__PURE__ */ import_react17.default.createElement(import_material12.IconButton, { "data-testid": "close-calendar-button", onClick: toggleCalendar(false) }, /* @__PURE__ */ import_react17.default.createElement(import_KeyboardDoubleArrowUp.default, null))))));
|
|
1640
1667
|
};
|
|
1641
1668
|
|
|
1669
|
+
// src/Components/SCDataGrid.tsx
|
|
1670
|
+
var import_react18 = __toESM(require("react"), 1);
|
|
1671
|
+
var import_x_data_grid_pro = require("@mui/x-data-grid-pro");
|
|
1672
|
+
var import_x_license_pro = require("@mui/x-license-pro");
|
|
1673
|
+
var import_styles = require("@mui/styles");
|
|
1674
|
+
var useStyles = (0, import_styles.makeStyles)({
|
|
1675
|
+
root: {
|
|
1676
|
+
"& .MuiDataGrid-filler": {
|
|
1677
|
+
display: "none !important"
|
|
1678
|
+
},
|
|
1679
|
+
"& .MuiDataGrid-footerContainer": {
|
|
1680
|
+
minHeight: "26px !important",
|
|
1681
|
+
height: "26px !important"
|
|
1682
|
+
},
|
|
1683
|
+
"& .MuiTablePagination-toolbar": {
|
|
1684
|
+
minHeight: "25px !important",
|
|
1685
|
+
height: "25px !important"
|
|
1686
|
+
},
|
|
1687
|
+
"& .MuiTablePagination-actions .MuiIconButton-root": {
|
|
1688
|
+
padding: "0px !important"
|
|
1689
|
+
},
|
|
1690
|
+
"&.MuiDataGrid-root": {
|
|
1691
|
+
"--DataGrid-topContainerHeight": "0px !important"
|
|
1692
|
+
/* Cambia este valor según tus necesidades */
|
|
1693
|
+
},
|
|
1694
|
+
"MuiDataGrid-root .MuiDataGrid-virtualScrollerContent .MuiDataGrid-row": {
|
|
1695
|
+
"--height": "0px !important",
|
|
1696
|
+
"minHeight": "0px !important",
|
|
1697
|
+
"maxHeight": "0px !important"
|
|
1698
|
+
},
|
|
1699
|
+
"& .MuiDataGrid-cell": {
|
|
1700
|
+
padding: "0 !important"
|
|
1701
|
+
}
|
|
1702
|
+
}
|
|
1703
|
+
});
|
|
1704
|
+
var SCDataGrid = (_a) => {
|
|
1705
|
+
var _b = _a, { data, columns, rowsTable, checkboxSelection, width, height, maxHeight, density, agrupacion, groupingColDef, getTreeDataPath } = _b, props = __objRest(_b, ["data", "columns", "rowsTable", "checkboxSelection", "width", "height", "maxHeight", "density", "agrupacion", "groupingColDef", "getTreeDataPath"]);
|
|
1706
|
+
const apiRef = (0, import_x_data_grid_pro.useGridApiRef)();
|
|
1707
|
+
const classes = useStyles();
|
|
1708
|
+
import_x_license_pro.LicenseInfo.setLicenseKey(
|
|
1709
|
+
"77d49a57fbc5f4af35ddb05c5f1742e0Tz0xMTI3MjgsRT0xNzc4MzcxMTk5MDAwLFM9cHJvLExNPXN1YnNjcmlwdGlvbixQVj1RMy0yMDI0LEtWPTI="
|
|
1710
|
+
);
|
|
1711
|
+
let validationTreeData = getTreeDataPath ? true : false;
|
|
1712
|
+
let paginalion = 10;
|
|
1713
|
+
let valor = 80;
|
|
1714
|
+
let alto = 345;
|
|
1715
|
+
let estilot = "compact";
|
|
1716
|
+
let tamanoEncabezado = density == "compact" ? 24 : density == "standard" ? 36 : density == "comfortable" ? 52 : 24;
|
|
1717
|
+
let tamanoCelda = density == "compact" ? 22 : density == "standard" ? 28 : density == "comfortable" ? 48 : 22;
|
|
1718
|
+
let dataConvert = [];
|
|
1719
|
+
const [groupDataLenght, setGroupDataLengh] = (0, import_react18.useState)(0);
|
|
1720
|
+
checkboxSelection = checkboxSelection || false;
|
|
1721
|
+
const rows = rowsTable ? rowsTable : validationTreeData != false ? parseInt(data.length) : data.length < 10 ? parseInt(data.length) : 10;
|
|
1722
|
+
width = width || "100%";
|
|
1723
|
+
density = density || "compact";
|
|
1724
|
+
agrupacion = agrupacion || false;
|
|
1725
|
+
groupingColDef = groupingColDef || {};
|
|
1726
|
+
getTreeDataPath = getTreeDataPath || void 0;
|
|
1727
|
+
const [pageSize, setPageSize] = (0, import_react18.useState)(rows);
|
|
1728
|
+
const [arrayRows, setArrayRows] = (0, import_react18.useState)([]);
|
|
1729
|
+
const [heightTable, setHeightTable] = (0, import_react18.useState)(height || 0);
|
|
1730
|
+
(0, import_react18.useEffect)(() => {
|
|
1731
|
+
if ((data == null ? void 0 : data.length) > 0) {
|
|
1732
|
+
dataConvertRows(data, void 0);
|
|
1733
|
+
if (validationTreeData) {
|
|
1734
|
+
countGroupedElements(data, getTreeDataPath);
|
|
1735
|
+
}
|
|
1736
|
+
}
|
|
1737
|
+
}, [data]);
|
|
1738
|
+
(0, import_react18.useEffect)(() => {
|
|
1739
|
+
if (groupDataLenght > 0 && validationTreeData == true) {
|
|
1740
|
+
setHeightTable(heightTable ? heightTable : groupDataLenght * tamanoCelda + tamanoEncabezado + 27);
|
|
1741
|
+
} else if (groupDataLenght <= 0 && validationTreeData == false) {
|
|
1742
|
+
setHeightTable(heightTable ? heightTable : rows * tamanoCelda + tamanoEncabezado + 27);
|
|
1743
|
+
}
|
|
1744
|
+
}, [groupDataLenght]);
|
|
1745
|
+
const dataConvertRows = (data2, columnId) => {
|
|
1746
|
+
let dataConvert2 = [];
|
|
1747
|
+
if ((data2 == null ? void 0 : data2.length) > 0) {
|
|
1748
|
+
const dataKeys = Object.keys(data2[0]);
|
|
1749
|
+
data2.map((item) => {
|
|
1750
|
+
const newKeys = {};
|
|
1751
|
+
let i = 0;
|
|
1752
|
+
let id = dataConvert2.length + 1;
|
|
1753
|
+
for (i = 0; i < dataKeys.length; i++) {
|
|
1754
|
+
newKeys[dataKeys[i]] = item[dataKeys[i]];
|
|
1755
|
+
}
|
|
1756
|
+
newKeys.id = columnId ? item[columnId] : id;
|
|
1757
|
+
dataConvert2 = [...dataConvert2, newKeys];
|
|
1758
|
+
});
|
|
1759
|
+
}
|
|
1760
|
+
setArrayRows(dataConvert2);
|
|
1761
|
+
};
|
|
1762
|
+
const isRowSelectable = (params) => params.row.bloqueoChecked == false ? false : true;
|
|
1763
|
+
const [selectionModel, setSelectionModel] = (0, import_react18.useState)([]);
|
|
1764
|
+
const handleSelectionChange = (newSelection) => {
|
|
1765
|
+
console.log(data);
|
|
1766
|
+
console.log(arrayRows);
|
|
1767
|
+
if (groupDataLenght > 0 && validationTreeData == true) {
|
|
1768
|
+
let numberGrouped = 0;
|
|
1769
|
+
let idsRowSelectBefore = [];
|
|
1770
|
+
let idRowSelect = [];
|
|
1771
|
+
for (let i = 0; i < newSelection.length; i++) {
|
|
1772
|
+
if (typeof newSelection[i] === "string") {
|
|
1773
|
+
if (newSelection[i].includes("auto-generated-row-null")) {
|
|
1774
|
+
numberGrouped = i;
|
|
1775
|
+
}
|
|
1776
|
+
} else {
|
|
1777
|
+
idsRowSelectBefore.push(newSelection[i]);
|
|
1778
|
+
}
|
|
1779
|
+
}
|
|
1780
|
+
arrayRows.forEach((array) => {
|
|
1781
|
+
if (typeof newSelection[numberGrouped] === "string") {
|
|
1782
|
+
if (newSelection[numberGrouped].includes(array.name)) {
|
|
1783
|
+
idRowSelect.push(array.id);
|
|
1784
|
+
}
|
|
1785
|
+
}
|
|
1786
|
+
});
|
|
1787
|
+
if (idRowSelect !== null) {
|
|
1788
|
+
const soloEnArr1 = idsRowSelectBefore.filter((elemento) => !idRowSelect.includes(elemento));
|
|
1789
|
+
const hasCommonElements = idsRowSelectBefore.some((element) => idRowSelect.includes(element));
|
|
1790
|
+
if (hasCommonElements == true) {
|
|
1791
|
+
setSelectionModel([...soloEnArr1]);
|
|
1792
|
+
} else {
|
|
1793
|
+
setSelectionModel([...idsRowSelectBefore, ...idRowSelect]);
|
|
1794
|
+
}
|
|
1795
|
+
}
|
|
1796
|
+
} else {
|
|
1797
|
+
setSelectionModel([...newSelection]);
|
|
1798
|
+
}
|
|
1799
|
+
};
|
|
1800
|
+
const countGroupedElements = (row, getTreeDataPath2) => {
|
|
1801
|
+
const groupedCounts = {};
|
|
1802
|
+
data.forEach((row2) => {
|
|
1803
|
+
const path = getTreeDataPath2(row2) || [];
|
|
1804
|
+
const key = path[0];
|
|
1805
|
+
if (!groupedCounts[key]) {
|
|
1806
|
+
groupedCounts[key] = 0;
|
|
1807
|
+
}
|
|
1808
|
+
groupedCounts[key]++;
|
|
1809
|
+
});
|
|
1810
|
+
setGroupDataLengh(Object.keys(groupedCounts).length);
|
|
1811
|
+
return groupedCounts;
|
|
1812
|
+
};
|
|
1813
|
+
const virtualScrollerHeight = validationTreeData ? groupDataLenght * tamanoCelda + 10 : rows * tamanoCelda;
|
|
1814
|
+
return /* @__PURE__ */ import_react18.default.createElement(import_react18.default.Fragment, null, heightTable > 0 ? /* @__PURE__ */ import_react18.default.createElement(import_react18.default.Fragment, null, /* @__PURE__ */ import_react18.default.createElement("div", { style: { display: "flex", flexDirection: "column", width, maxHeight } }, /* @__PURE__ */ import_react18.default.createElement(
|
|
1815
|
+
import_x_data_grid_pro.DataGridPro,
|
|
1816
|
+
__spreadProps(__spreadValues({
|
|
1817
|
+
apiRef
|
|
1818
|
+
}, props), {
|
|
1819
|
+
rows: arrayRows,
|
|
1820
|
+
columns,
|
|
1821
|
+
density,
|
|
1822
|
+
treeData: validationTreeData,
|
|
1823
|
+
getTreeDataPath,
|
|
1824
|
+
groupingColDef: validationTreeData == true ? groupingColDef : false,
|
|
1825
|
+
pagination: true,
|
|
1826
|
+
initialState: {
|
|
1827
|
+
pagination: { paginationModel: { pageSize: rows } }
|
|
1828
|
+
},
|
|
1829
|
+
checkboxSelection,
|
|
1830
|
+
rowSelectionModel: selectionModel,
|
|
1831
|
+
onRowSelectionModelChange: (newSelection) => handleSelectionChange(newSelection),
|
|
1832
|
+
isRowSelectable,
|
|
1833
|
+
disableRowSelectionOnClick: true,
|
|
1834
|
+
className: classes.root,
|
|
1835
|
+
localeText: {
|
|
1836
|
+
noRowsLabel: "No hay filas",
|
|
1837
|
+
columnMenuLabel: "Men\xFA de columna",
|
|
1838
|
+
footerTotalRows: "Filas Totales:",
|
|
1839
|
+
footerRowSelected: (count) => `${count.toLocaleString()} fila(s) seleccionada(s)`,
|
|
1840
|
+
// Ejemplo de traducción dinámica
|
|
1841
|
+
MuiTablePagination: {
|
|
1842
|
+
labelRowsPerPage: "Filas por p\xE1gina:",
|
|
1843
|
+
labelDisplayedRows: ({ from, to, count }) => `${from}\u2013${to} de ${count !== -1 ? count : `m\xE1s de ${to}`}`
|
|
1844
|
+
}
|
|
1845
|
+
}
|
|
1846
|
+
})
|
|
1847
|
+
))) : "");
|
|
1848
|
+
};
|
|
1849
|
+
|
|
1850
|
+
// src/Components/SCAutocomplete.tsx
|
|
1851
|
+
var import_react19 = __toESM(require("react"), 1);
|
|
1852
|
+
var import_material13 = require("@mui/material");
|
|
1853
|
+
var import_Grid26 = __toESM(require("@mui/material/Grid2"), 1);
|
|
1854
|
+
var import_icons_material10 = require("@mui/icons-material");
|
|
1855
|
+
var Muicon6 = __toESM(require("@mui/icons-material"), 1);
|
|
1856
|
+
function SCAutocomplete({
|
|
1857
|
+
label = "",
|
|
1858
|
+
data,
|
|
1859
|
+
columnGroup,
|
|
1860
|
+
getItemValue,
|
|
1861
|
+
type = "normal",
|
|
1862
|
+
checkMassive = false,
|
|
1863
|
+
deleteType = "button",
|
|
1864
|
+
fnAplicar,
|
|
1865
|
+
required,
|
|
1866
|
+
disabled,
|
|
1867
|
+
background,
|
|
1868
|
+
setState,
|
|
1869
|
+
state
|
|
1870
|
+
}) {
|
|
1871
|
+
const labelContent = `<span class="red-asterisk">* </span>` + label;
|
|
1872
|
+
let group = "";
|
|
1873
|
+
let isSelected = false;
|
|
1874
|
+
const [selectedOptions, setSelectedOptions] = import_react19.default.useState([]);
|
|
1875
|
+
const [prevData, setPrevData] = import_react19.default.useState(data);
|
|
1876
|
+
(0, import_react19.useEffect)(() => {
|
|
1877
|
+
let dataChangeValidation = JSON.stringify(prevData) === JSON.stringify(data);
|
|
1878
|
+
if (dataChangeValidation == false) {
|
|
1879
|
+
setState({ hiddenValue: "-1", textValue: "" });
|
|
1880
|
+
setSelectedOptions([]);
|
|
1881
|
+
setPrevData(data);
|
|
1882
|
+
}
|
|
1883
|
+
}, [data]);
|
|
1884
|
+
(0, import_react19.useEffect)(() => {
|
|
1885
|
+
if (type == "multiselect") {
|
|
1886
|
+
if (state.hiddenValue != "-1") {
|
|
1887
|
+
setSelectedOptions(data.filter(
|
|
1888
|
+
(item) => Array.isArray(state.hiddenValue) ? state.hiddenValue.includes(getItemValue(item).value) : getItemValue(item).value === state.hiddenValue
|
|
1889
|
+
));
|
|
1890
|
+
}
|
|
1891
|
+
}
|
|
1892
|
+
}, [state.hiddenValue]);
|
|
1893
|
+
data.map(function(option, index, array) {
|
|
1894
|
+
if (option == null ? void 0 : option.icon) {
|
|
1895
|
+
if ((option == null ? void 0 : option.icon.type) == void 0) {
|
|
1896
|
+
option.icon = Muicon6[option == null ? void 0 : option.icon];
|
|
1897
|
+
} else {
|
|
1898
|
+
option;
|
|
1899
|
+
}
|
|
1900
|
+
}
|
|
1901
|
+
});
|
|
1902
|
+
const cleanOptions = (event2) => {
|
|
1903
|
+
setState({ hiddenValue: "-1", textValue: "" });
|
|
1904
|
+
setSelectedOptions([]);
|
|
1905
|
+
};
|
|
1906
|
+
const handleCheckAll = (event2) => {
|
|
1907
|
+
if (event2.target.checked) {
|
|
1908
|
+
setSelectedOptions(data);
|
|
1909
|
+
setState({
|
|
1910
|
+
hiddenValue: data.map((item) => getItemValue(item).value),
|
|
1911
|
+
textValue: data.map((item) => getItemValue(item).text)
|
|
1912
|
+
});
|
|
1913
|
+
} else {
|
|
1914
|
+
setSelectedOptions([]);
|
|
1915
|
+
setState({ hiddenValue: "-1", textValue: "" });
|
|
1916
|
+
}
|
|
1917
|
+
};
|
|
1918
|
+
const allSelected = data.length > 0 && selectedOptions.length === data.length;
|
|
1919
|
+
const handleChange = (event2, value) => {
|
|
1920
|
+
if (type === "multiselect") {
|
|
1921
|
+
const ids = value.map((v) => getItemValue ? getItemValue(v).value : "");
|
|
1922
|
+
const texts = value.map((v) => getItemValue ? getItemValue(v).text : "");
|
|
1923
|
+
setSelectedOptions(value);
|
|
1924
|
+
setState({
|
|
1925
|
+
hiddenValue: ids,
|
|
1926
|
+
textValue: texts
|
|
1927
|
+
});
|
|
1928
|
+
} else {
|
|
1929
|
+
setState({
|
|
1930
|
+
hiddenValue: getItemValue(value).value,
|
|
1931
|
+
textValue: getItemValue(value).text
|
|
1932
|
+
});
|
|
1933
|
+
}
|
|
1934
|
+
};
|
|
1935
|
+
const selectedValue = type === "multiselect" ? data.filter(
|
|
1936
|
+
(item) => state.hiddenValue.includes(getItemValue(item).value)
|
|
1937
|
+
) : data.find(
|
|
1938
|
+
(item) => getItemValue(item).value === state.hiddenValue
|
|
1939
|
+
) || null;
|
|
1940
|
+
return /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, data && /* @__PURE__ */ import_react19.default.createElement(
|
|
1941
|
+
import_material13.Autocomplete,
|
|
1942
|
+
{
|
|
1943
|
+
multiple: type === "multiselect",
|
|
1944
|
+
clearOnEscape: true,
|
|
1945
|
+
disabled,
|
|
1946
|
+
options: data,
|
|
1947
|
+
onChange: handleChange,
|
|
1948
|
+
getOptionLabel: (option) => getItemValue(option).text,
|
|
1949
|
+
value: selectedValue,
|
|
1950
|
+
sx: {
|
|
1951
|
+
background: background || "transparent",
|
|
1952
|
+
width: "100%",
|
|
1953
|
+
maxWidth: "100%",
|
|
1954
|
+
"& .MuiAutocomplete-tag": {
|
|
1955
|
+
maxWidth: 120,
|
|
1956
|
+
overflow: "hidden",
|
|
1957
|
+
textOverflow: "ellipsis",
|
|
1958
|
+
whiteSpace: "nowrap"
|
|
1959
|
+
},
|
|
1960
|
+
"& .MuiAutocomplete-inputRoot": {
|
|
1961
|
+
flexWrap: "nowrap !important",
|
|
1962
|
+
overflowX: "auto"
|
|
1963
|
+
}
|
|
1964
|
+
},
|
|
1965
|
+
limitTags: 2,
|
|
1966
|
+
renderTags: (value, getTagProps) => {
|
|
1967
|
+
const limit = 2;
|
|
1968
|
+
return /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, value.slice(0, limit).map((option, index) => /* @__PURE__ */ import_react19.default.createElement(
|
|
1969
|
+
import_material13.Chip,
|
|
1970
|
+
__spreadProps(__spreadValues({
|
|
1971
|
+
color: "default",
|
|
1972
|
+
size: "small",
|
|
1973
|
+
variant: "filled",
|
|
1974
|
+
label: getItemValue(option).text
|
|
1975
|
+
}, getTagProps({ index })), {
|
|
1976
|
+
style: { maxWidth: 120, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }
|
|
1977
|
+
})
|
|
1978
|
+
)), value.length > limit && /* @__PURE__ */ import_react19.default.createElement(import_material13.Box, { sx: { ml: 0.5, fontSize: 13, color: "#666", display: "flex", alignItems: "center" } }, `+${value.length - limit}`));
|
|
1979
|
+
},
|
|
1980
|
+
renderOption: (props, option) => {
|
|
1981
|
+
const _a = props, { key } = _a, optionProps = __objRest(_a, ["key"]);
|
|
1982
|
+
let isValid;
|
|
1983
|
+
if (type == "multiselect") {
|
|
1984
|
+
isSelected = selectedOptions.some(
|
|
1985
|
+
(selected) => getItemValue(selected).value === getItemValue(option).value
|
|
1986
|
+
);
|
|
1987
|
+
}
|
|
1988
|
+
if (columnGroup) {
|
|
1989
|
+
isValid = group == option[columnGroup];
|
|
1990
|
+
group = option[columnGroup];
|
|
1991
|
+
}
|
|
1992
|
+
return /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, { key }, columnGroup ? !isValid ? /* @__PURE__ */ import_react19.default.createElement(import_material13.Typography, { color: "text.secondary", sx: { margin: "7px 16px !important", fontSize: "13px !important" } }, option[columnGroup]) : "" : "", /* @__PURE__ */ import_react19.default.createElement(import_material13.MenuItem, __spreadProps(__spreadValues({}, optionProps), { style: { background: type != "multiselect" ? state.hiddenValue == getItemValue(option).value ? "#dfe6ec" : "white" : "white", padding: "7px 16px" } }), type != "multiselect" && getItemValue(option).icon != void 0 ? /* @__PURE__ */ import_react19.default.createElement(import_material13.ListItemIcon, { sx: { minWidth: "10px !important" } }, /* @__PURE__ */ import_react19.default.createElement(import_material13.SvgIcon, { fontSize: "small", color: "action", component: getItemValue(option).icon })) : "", type == "multiselect" ? /* @__PURE__ */ import_react19.default.createElement(import_material13.Checkbox, { checked: isSelected, value: getItemValue(option).text, color: "primary" }) : "", /* @__PURE__ */ import_react19.default.createElement(import_material13.ListItemText, { primary: getItemValue(option).text, color: "text.primary" }))));
|
|
1993
|
+
},
|
|
1994
|
+
renderInput: (params) => /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, /* @__PURE__ */ import_react19.default.createElement(
|
|
1995
|
+
import_material13.TextField,
|
|
1996
|
+
__spreadProps(__spreadValues({}, params), {
|
|
1997
|
+
label: required ? /* @__PURE__ */ import_react19.default.createElement("span", { dangerouslySetInnerHTML: { __html: labelContent } }) : label,
|
|
1998
|
+
placeholder: selectedOptions.length == 0 ? "B\xFAsqueda" : "",
|
|
1999
|
+
InputProps: __spreadProps(__spreadValues({}, params.InputProps), {
|
|
2000
|
+
endAdornment: /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, deleteType == "icon" && state.hiddenValue != "-1" ? /* @__PURE__ */ import_react19.default.createElement(import_material13.IconButton, { size: "small", onClick: cleanOptions, sx: { marginLeft: "auto", textAlign: "right", padding: "0px" } }, /* @__PURE__ */ import_react19.default.createElement(import_icons_material10.Clear, { fontSize: "small" })) : "", /* @__PURE__ */ import_react19.default.createElement(import_material13.InputAdornment, { style: { zIndex: 1, position: "relative" }, position: "end" }, /* @__PURE__ */ import_react19.default.createElement(import_icons_material10.Search, { fontSize: "small", color: "action", style: { cursor: "pointer" } })))
|
|
2001
|
+
})
|
|
2002
|
+
})
|
|
2003
|
+
)),
|
|
2004
|
+
slotProps: {
|
|
2005
|
+
listbox: {
|
|
2006
|
+
component: import_react19.default.forwardRef(function ListboxComponent(props, ref) {
|
|
2007
|
+
return /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, /* @__PURE__ */ import_react19.default.createElement(
|
|
2008
|
+
import_material13.Box,
|
|
2009
|
+
__spreadProps(__spreadValues({
|
|
2010
|
+
ref
|
|
2011
|
+
}, props), {
|
|
2012
|
+
sx: __spreadValues({
|
|
2013
|
+
position: "relative",
|
|
2014
|
+
paddingBottom: "56px",
|
|
2015
|
+
backgroundColor: "white"
|
|
2016
|
+
}, props.sx)
|
|
2017
|
+
}),
|
|
2018
|
+
checkMassive && type == "multiselect" ? /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, /* @__PURE__ */ import_react19.default.createElement(import_material13.FormControlLabel, { control: /* @__PURE__ */ import_react19.default.createElement(import_material13.Checkbox, { checked: allSelected, indeterminate: selectedOptions.length > 0 && selectedOptions.length < data.length, onChange: handleCheckAll, color: "primary" }), label: "Todos los item", sx: { marginLeft: "0px !important", marginRight: "0px !important", padding: "7px 16px" } }), /* @__PURE__ */ import_react19.default.createElement(import_material13.Divider, null)) : "",
|
|
2019
|
+
props.children,
|
|
2020
|
+
deleteType == "button" || fnAplicar ? /* @__PURE__ */ import_react19.default.createElement(
|
|
2021
|
+
import_Grid26.default,
|
|
2022
|
+
{
|
|
2023
|
+
container: true,
|
|
2024
|
+
sx: {
|
|
2025
|
+
position: "sticky",
|
|
2026
|
+
bottom: -8,
|
|
2027
|
+
left: 0,
|
|
2028
|
+
width: "100%",
|
|
2029
|
+
backgroundColor: "grey.50",
|
|
2030
|
+
padding: "8px 16px",
|
|
2031
|
+
textAlign: "left",
|
|
2032
|
+
justifyContent: "space-between"
|
|
2033
|
+
}
|
|
2034
|
+
},
|
|
2035
|
+
deleteType == "button" ? /* @__PURE__ */ import_react19.default.createElement(
|
|
2036
|
+
import_material13.Button,
|
|
2037
|
+
{
|
|
2038
|
+
variant: "text",
|
|
2039
|
+
color: "primary",
|
|
2040
|
+
size: "small",
|
|
2041
|
+
onClick: (event2) => {
|
|
2042
|
+
event2.stopPropagation();
|
|
2043
|
+
cleanOptions(event2);
|
|
2044
|
+
}
|
|
2045
|
+
},
|
|
2046
|
+
"Limpiar"
|
|
2047
|
+
) : "",
|
|
2048
|
+
fnAplicar && /* @__PURE__ */ import_react19.default.createElement(
|
|
2049
|
+
import_material13.Button,
|
|
2050
|
+
{
|
|
2051
|
+
variant: "contained",
|
|
2052
|
+
color: "primary",
|
|
2053
|
+
size: "small",
|
|
2054
|
+
onClick: fnAplicar
|
|
2055
|
+
},
|
|
2056
|
+
"Aplicar"
|
|
2057
|
+
)
|
|
2058
|
+
) : ""
|
|
2059
|
+
));
|
|
2060
|
+
})
|
|
2061
|
+
}
|
|
2062
|
+
}
|
|
2063
|
+
}
|
|
2064
|
+
));
|
|
2065
|
+
}
|
|
2066
|
+
|
|
1642
2067
|
// src/Theme/index.ts
|
|
1643
|
-
var
|
|
2068
|
+
var import_styles3 = require("@mui/material/styles");
|
|
1644
2069
|
|
|
1645
2070
|
// src/Theme/components.ts
|
|
1646
|
-
var
|
|
1647
|
-
var
|
|
2071
|
+
var import_react20 = __toESM(require("react"), 1);
|
|
2072
|
+
var import_icons_material11 = require("@mui/icons-material");
|
|
1648
2073
|
var components = {
|
|
1649
2074
|
MuiSelect: {
|
|
1650
2075
|
styleOverrides: {
|
|
@@ -2341,10 +2766,10 @@ var components = {
|
|
|
2341
2766
|
MuiAlert: {
|
|
2342
2767
|
defaultProps: {
|
|
2343
2768
|
iconMapping: {
|
|
2344
|
-
success:
|
|
2345
|
-
error:
|
|
2346
|
-
warning:
|
|
2347
|
-
info:
|
|
2769
|
+
success: import_react20.default.createElement(import_icons_material11.CheckCircleRounded),
|
|
2770
|
+
error: import_react20.default.createElement(import_icons_material11.ErrorRounded),
|
|
2771
|
+
warning: import_react20.default.createElement(import_icons_material11.WarningRounded),
|
|
2772
|
+
info: import_react20.default.createElement(import_icons_material11.InfoRounded)
|
|
2348
2773
|
}
|
|
2349
2774
|
},
|
|
2350
2775
|
variants: [
|
|
@@ -2596,9 +3021,6 @@ var components = {
|
|
|
2596
3021
|
}
|
|
2597
3022
|
},
|
|
2598
3023
|
MuiSvgIcon: {
|
|
2599
|
-
defaultProps: {
|
|
2600
|
-
color: "action"
|
|
2601
|
-
},
|
|
2602
3024
|
styleOverrides: {
|
|
2603
3025
|
fontSizeLarge: {
|
|
2604
3026
|
width: 35,
|
|
@@ -3288,7 +3710,7 @@ var import_Typography = require("@mui/material/Typography");
|
|
|
3288
3710
|
var import_Radio = require("@mui/material/Radio");
|
|
3289
3711
|
var import_Chip = require("@mui/material/Chip");
|
|
3290
3712
|
var import_Checkbox = require("@mui/material/Checkbox");
|
|
3291
|
-
var
|
|
3713
|
+
var import_styles2 = require("@mui/material/styles");
|
|
3292
3714
|
|
|
3293
3715
|
// src/Theme/typography.ts
|
|
3294
3716
|
var typography = {
|
|
@@ -3459,16 +3881,18 @@ var ADCTheme = __spreadValues({
|
|
|
3459
3881
|
}, BasicTheme);
|
|
3460
3882
|
|
|
3461
3883
|
// src/Theme/index.ts
|
|
3462
|
-
var SincoTheme = (0,
|
|
3463
|
-
var AdproSincoTheme = (0,
|
|
3464
|
-
var ADCSincoTheme = (0,
|
|
3884
|
+
var SincoTheme = (0, import_styles3.createTheme)(__spreadValues({}, ERPTheme));
|
|
3885
|
+
var AdproSincoTheme = (0, import_styles3.createTheme)(__spreadValues({}, ADPROTheme));
|
|
3886
|
+
var ADCSincoTheme = (0, import_styles3.createTheme)(__spreadValues({}, ADCTheme));
|
|
3465
3887
|
// Annotate the CommonJS export names for ESM import in node:
|
|
3466
3888
|
0 && (module.exports = {
|
|
3467
3889
|
ADCSincoTheme,
|
|
3468
3890
|
AdproSincoTheme,
|
|
3469
3891
|
FooterAction,
|
|
3470
3892
|
PageHeader,
|
|
3893
|
+
SCAutocomplete,
|
|
3471
3894
|
SCCalendarSwipeable,
|
|
3895
|
+
SCDataGrid,
|
|
3472
3896
|
SCDialog,
|
|
3473
3897
|
SCDrawer,
|
|
3474
3898
|
SCMenu,
|