@dexteel/mesf-core 4.20.1 → 4.20.3

package/dist/index.esm.js

@@ -1,6 +1,6 @@
 export { LicenseManager } from 'ag-grid-enterprise';
 import { DialogTitle as DialogTitle$1, DialogContent as DialogContent$1, DialogActions as DialogActions$1, Grid, Button, withStyles as withStyles$1, alpha, makeStyles, Dialog as Dialog$1, SvgIcon, Collapse, Typography as Typography$1, Checkbox, TextField, InputAdornment, IconButton as IconButton$1, MenuItem, Select, Card, CardContent, CardActions, Snackbar, CircularProgress, Paper, InputLabel, FormHelperText, DialogContentText, FormControlLabel, Badge, useTheme, FormControl, Input, Chip, Tooltip, ListItemIcon, MenuList, Divider, Box, debounce, createStyles as createStyles$1, List, ListItem, ListItemText } from '@material-ui/core';
-import { get, isNil as isNil$1, isEmpty, values, round, isNaN, isNumber } from 'lodash-es';
+import { get as get$1, isNil as isNil$1, isEmpty, values, round, isNaN, isNumber } from 'lodash-es';
 import * as React from 'react';
 import React__default, { useState, useRef, useEffect, useMemo, Component, createContext, useContext, useCallback, lazy, Suspense } from 'react';
 import { ArrowRight, ArrowBackRounded, ArrowForwardRounded, SkipNext, ChevronLeft, ChevronRight } from '@material-ui/icons';
@@ -14,10 +14,15 @@ import { useComplexState } from 'use-complex-state';
 import { createSlice } from '@reduxjs/toolkit';
 import { DndProvider } from 'react-dnd';
 import { HTML5Backend } from 'react-dnd-html5-backend';
-import { isNil, get as get$1 } from 'lodash';
+import { AgGridReact } from 'ag-grid-react';
+import MomentUtils from '@date-io/moment';
+import { MuiPickersUtilsProvider, KeyboardDatePicker, KeyboardTimePicker } from '@material-ui/pickers';
+import moment$2 from 'moment';
+import EditIcon from '@material-ui/icons/Edit';
+import PlaylistAddIcon from '@material-ui/icons/PlaylistAdd';
+import { isNil, get } from 'lodash';
 import axios from 'axios';
 import { _adapters, Chart, CategoryScale, LinearScale, PointElement, LineElement, Title, Tooltip as Tooltip$1, Legend, TimeScale } from 'chart.js';
-import moment$2 from 'moment';
 import zoomPlugin from 'chartjs-plugin-zoom';
 import LockIcon from '@material-ui/icons/Lock';
 import SaveIcon from '@material-ui/icons/Save';
@@ -51,17 +56,12 @@ import { useSpring, animated } from 'react-spring';
 import { DataGrid, GridOverlay } from '@material-ui/data-grid';
 import { format, fromZonedTime, formatInTimeZone } from 'date-fns-tz';
 import { findIana } from 'windows-iana';
-import { AgGridReact } from 'ag-grid-react';
 import Alert$2 from '@material-ui/lab/Alert';
 import RefreshIcon from '@material-ui/icons/Refresh';
 import ReplayIcon from '@material-ui/icons/Replay';
 import ToggleOfIcon from '@material-ui/icons/ToggleOff';
 import ToggleOnIcon from '@material-ui/icons/ToggleOn';
 import FormatListBulletedSharpIcon from '@material-ui/icons/FormatListBulletedSharp';
-import MomentUtils from '@date-io/moment';
-import { MuiPickersUtilsProvider, KeyboardDatePicker, KeyboardTimePicker } from '@material-ui/pickers';
-import EditIcon from '@material-ui/icons/Edit';
-import PlaylistAddIcon from '@material-ui/icons/PlaylistAdd';
 import { useForm, Controller } from 'react-hook-form';
 import 'ag-grid-enterprise/styles/ag-grid.css';
 import 'ag-grid-enterprise/styles/ag-theme-balham.min.css';
@@ -591,13 +591,15 @@ var useStyles$v = makeStyles(function (theme) { return ({
 var TreePickerControl = function (props) {
     var classes = useStyles$v();
     var onSelect = props.onSelect, value = props.value; props.styleLabel; var dataSource = props.dataSource, _a = props.inputTitle, inputTitle = _a === void 0 ? "Asset" : _a; props.showPath; var _c = props.multipleSelectNodes, multipleSelectNodes = _c === void 0 ? false : _c, _d = props.showClearButton, showClearButton = _d === void 0 ? false : _d, showAssetTree = props.showAssetTree, onHide = props.onHide, _e = props.listAssetDrawings, listAssetDrawings = _e === void 0 ? [] : _e, onSuccess = props.onSuccess, isLoading = props.isLoading, other = __rest(props, ["onSelect", "value", "styleLabel", "dataSource", "inputTitle", "showPath", "multipleSelectNodes", "showClearButton", "showAssetTree", "onHide", "listAssetDrawings", "onSuccess", "isLoading"]);
-    var _f = useState(false), open = _f[0], setOpen = _f[1];
+    var _f = useState(showAssetTree || false), open = _f[0], setOpen = _f[1];
     var handleClickListItem = function (e) {
         e.stopPropagation();
         setOpen(true);
     };
     var handleClose = function (newValue, newDescription, findNode) {
-        setOpen(false);
+        if (!showAssetTree) {
+            setOpen(false);
+        }
         if (newValue) {
             if (onSelect !== undefined) {
                 onSelect(newValue, newDescription, findNode);
@@ -674,12 +676,7 @@ var TreePickerControl = function (props) {
 var useStyles$u = makeStyles(function (theme) { return ({
     root: {
         width: "100%",
-        backgroundColor: theme.palette.background.paper,
-        "& .MuiInputBase-input": {
-            color: "black",
-            cursor: "pointer",
-            paddingRight: 45
-        }
+        backgroundColor: theme.palette.background.paper
     },
     paper: {
         width: "100%",
@@ -724,6 +721,11 @@ var TreePickerControlV2 = function (props) {
         !showAssetTree ? (React__default.createElement(Grid, { container: true, item: true, md: 12, xs: 12, style: { position: "relative" }, title: props.description },
             React__default.createElement(Grid, { item: true, style: { position: "relative", width: "100%" } },
                 React__default.createElement(TextField, { id: "treePickerTextField", label: inputTitle || "", variant: "outlined", value: description, margin: "dense", autoComplete: "off", fullWidth: true, disabled: true, InputProps: {
+                        style: {
+                            color: disabled ? "grey" : "black",
+                            cursor: "pointer",
+                            paddingRight: 45
+                        },
                         endAdornment: (React__default.createElement(InputAdornment, { position: "end", style: {
                                 cursor: "pointer"
                             } },
@@ -1933,11 +1935,12 @@ var LogsProvider = function (_a) {
     return (React__default.createElement(LogsContext.Provider, { value: { state: state, actions: actions } }, children));
 };
 
-var LOG_TYPE_CODES = [
-    { id: "A", description: "All" },
-    { id: "I", description: "Info" },
-    { id: "E", description: "Error" },
-];
+var LOG_TYPE_CODES = {
+    A: { id: "A", description: "All" },
+    I: { id: "I", color: "#3f51b5", description: "Info" },
+    E: { id: "E", color: "#f44336", description: "Error" },
+    W: { id: "W", color: "#E69C00", description: "Warning" }
+};
 
 var CodeFilter = function (_a) {
     var LogTypeCode = _a.LogTypeCode, setLogTypeCodeFilter = _a.setLogTypeCodeFilter;
@@ -1945,7 +1948,7 @@ var CodeFilter = function (_a) {
         React__default.createElement(InputLabel, { id: "demo-simple-select-label", style: { fontSize: 10, marginBottom: 0 } }, "Type"),
         React__default.createElement(Select, { labelId: "demo-simple-select-label", id: "demo-simple-select", value: LogTypeCode, onChange: function (newLogTypeCode) {
                 return setLogTypeCodeFilter(newLogTypeCode.target.value);
-            }, style: { minWidth: "100%" } }, LOG_TYPE_CODES.map(function (log) {
+            }, style: { minWidth: "100%" } }, Object.values(LOG_TYPE_CODES).map(function (log) {
             return (React__default.createElement(MenuItem, { key: "logId-".concat(log.id), value: log.id }, log.description));
         }))));
 };
@@ -2052,60 +2055,6 @@ var ModalLogSelected = function (_a) {
                         React__default.createElement(Button, { fullWidth: true, variant: "contained", color: "default", onClick: function () { return onHide(true); } }, "Close")))))));
 };
 
-//fx obtener logs
-var GetLogs = function (Start, End, Search, LogTypeCode) { return __awaiter(void 0, void 0, void 0, function () {
-    var apiService, parameters, resp;
-    return __generator(this, function (_a) {
-        switch (_a.label) {
-            case 0:
-                apiService = new MESApiService();
-                parameters = [];
-                parameters.push({ name: "Start", value: Start });
-                parameters.push({ name: "End", value: End });
-                parameters.push({ name: "Search", value: Search });
-                parameters.push({
-                    name: "LogTypeCode",
-                    value: LogTypeCode === "A" ? null : LogTypeCode
-                });
-                return [4 /*yield*/, apiService.callV2("[MES].[GetLogs]", parameters)];
-            case 1:
-                resp = _a.sent();
-                return [2 /*return*/, resp];
-        }
-    });
-}); };
-
-var useGetLogsFromAPI = function (_a) {
-    var Start = _a.Start, End = _a.End, Search = _a.Search, LogTypeCode = _a.LogTypeCode, setError = _a.setError, setLoading = _a.setLoading;
-    var actions = useLogsContext().actions;
-    var _b = useState(0), shouldUpdate = _b[0], setShouldUpdate = _b[1];
-    var update = function () {
-        setShouldUpdate(shouldUpdate + 1);
-    };
-    useEffect(function () {
-        var canceled = false;
-        GetLogs(Start, End, Search, LogTypeCode)
-            .then(function (res) {
-            if (res.ok) {
-                var logs = get(res, "data.tables[0].rows", []);
-                if (canceled)
-                    return;
-                actions.setLogs(logs);
-            }
-            else
-                setError(res.message);
-        })["finally"](function () {
-            if (canceled)
-                return;
-            setLoading(false);
-        });
-        return function () {
-            canceled = true;
-        };
-    }, [shouldUpdate]);
-    return update;
-};
-
 var useStyles$q = makeStyles(function (theme) { return ({
     buttons: {
         opacity: 0,
@@ -2128,13 +2077,11 @@ var useLogTableData = function () {
     var formatTime = function (nowTime) {
         return (nowTime.toLocaleDateString("en-US") + " " + nowTime.toLocaleTimeString());
     };
-    var formatUser = function (nowUser) {
-        return nowUser === null ? " " : nowUser;
-    };
     var getLogTypeByCodeId = function (logTypeCodeId) {
-        var _a;
-        return (((_a = LOG_TYPE_CODES.find(function (ltc) { return ltc.id === logTypeCodeId; })) === null || _a === void 0 ? void 0 : _a.description) ||
-            "CodeId: ".concat(logTypeCodeId));
+        return get(LOG_TYPE_CODES, "".concat(logTypeCodeId, ".description"), " -");
+    };
+    var backgroundColor = function (logTypeCode) {
+        return get(LOG_TYPE_CODES, "".concat(logTypeCode[0], ".color"), "#BBBBBB");
     };
     var rows = (_a = state.logs) === null || _a === void 0 ? void 0 : _a.map(function (_a) {
         var LogId = _a.LogId, Timestamp = _a.Timestamp, Source = _a.Source, Message = _a.Message, LogTypeCode = _a.LogTypeCode, User = _a.User;
@@ -2161,58 +2108,59 @@ var useLogTableData = function () {
                 display: "flex",
                 alignItems: "center",
                 justifyContent: "center"
-            }
+            },
+            headerClass: "ag-header-cell-centered"
         },
         {
             field: "Source",
             headerName: "Source",
-            minWidth: 150,
-            flex: 4,
-            type: "string",
-            cellStyle: {
-                display: "flex",
-                alignItems: "center",
-                justifyContent: "center"
-            }
+            minWidth: 180,
+            flex: 5,
+            type: "string"
         },
         {
             field: "Message",
             headerName: "Message",
             minWidth: 100,
-            flex: 8,
-            type: "string",
-            cellStyle: {
-                display: "flex",
-                alignItems: "center",
-                justifyContent: "center"
-            }
+            flex: 10,
+            type: "string"
         },
         {
             field: "LogTypeCode",
             headerName: "Type",
             minWidth: 130,
-            flex: 3,
-            cellStyle: {
-                display: "flex",
-                alignItems: "center",
-                justifyContent: "center"
+            flex: 2,
+            cellRenderer: function (params) {
+                return (React__default.createElement(React__default.Fragment, null,
+                    React__default.createElement("div", { style: {
+                            padding: "2px 6px",
+                            borderRadius: 4,
+                            display: "inline-flex",
+                            alignItems: "center",
+                            justifyContent: "center",
+                            color: "#fff",
+                            fontWeight: "bold",
+                            fontSize: "0.75rem",
+                            backgroundColor: backgroundColor(params.value)
+                        } }, params.value)));
             }
         },
         {
             field: "User",
             headerName: "User",
-            minWidth: 130,
-            flex: 3,
+            minWidth: 70,
+            flex: 1,
             type: "string",
             valueFormatter: function (_a) {
                 var value = _a.value;
-                return formatUser(value);
+                return value || " ";
             },
             cellStyle: {
                 display: "flex",
                 alignItems: "center",
                 justifyContent: "center"
-            }
+            },
+            headerClass: "ag-header-cell-centered"
         },
         {
             cellRenderer: function (params) {
@@ -2239,36 +2187,11 @@ var useLogTableData = function () {
     return { rows: rows, columnDefs: columnDefs };
 };
 
-var useLogsOptionsFunctions = function (_a) {
-    var setSelectedLog = _a.setSelectedLog, setShowLogModal = _a.setShowLogModal, handleResetButtonClick = _a.handleResetButtonClick;
-    var getMenuOptions = function (data) {
-        var options = [];
-        if (data) {
-            options = options.concat([
-                {
-                    name: "View Log",
-                    key: "view_log",
-                    onClick: function () {
-                        setSelectedLog(data);
-                        setShowLogModal(true);
-                    },
-                    icon: React__default.createElement(PlaylistAddIcon, null)
-                },
-                {
-                    name: "Reset Filter",
-                    key: "reset_filters",
-                    onClick: function () {
-                        handleResetButtonClick();
-                    },
-                    icon: React__default.createElement(EditIcon, null)
-                },
-            ]);
-        }
-        return options;
-    };
-    return {
-        getMenuOptions: getMenuOptions
-    };
+var ButtonWithLoading = function (_a) {
+    var children = _a.children, isLoading = _a.isLoading, props = __rest(_a, ["children", "isLoading"]);
+    return (React__default.createElement(Button, __assign({}, props, { disabled: isLoading }),
+        isLoading && React__default.createElement(CircularProgress, { size: "1rem" }),
+        children));
 };
 
 var useStyles$p = makeStyles(function (theme) { return ({
@@ -2277,7 +2200,7 @@ var useStyles$p = makeStyles(function (theme) { return ({
             cursor: "pointer"
         },
         "& .MuiPaper-root ": {
-            height: "26vh !important"
+            height: "100% !important"
         },
         "& .MuiDataGrid-columnHeaderTitle, & .MuiTablePagination-caption": {
             fontWeight: "bold"
@@ -2287,20 +2210,22 @@ var useStyles$p = makeStyles(function (theme) { return ({
         },
         "& .ag-header-cell-label": {
             display: "flex",
-            alignItems: "center",
-            justifyContent: "center",
-            fontSize: "2vh"
+            alignItems: "start",
+            justifyContent: "start",
+            fontSize: "1.2rem",
+            fontWeight: "bold"
+        },
+        "& .ag-header-cell-centered .ag-header-cell-label": {
+            justifyContent: "center !important"
         },
         "& .ag-header-cell-text": {
-            textAlign: "center !important"
+            textAlign: "start !important"
         },
         "& .ag-checkbox-input-wrapper": {
             margin: "0 10px"
         },
         "& .ag-cell": {
-            alignItems: "center",
-            padding: "0 !important",
-            border: "unset !important"
+            padding: "2px !important"
         },
         "& .ag-header-cell": {
             padding: "0px !important",
@@ -2310,9 +2235,7 @@ var useStyles$p = makeStyles(function (theme) { return ({
             alignItems: "center",
             justifyContent: "center"
         },
-        "& .ag-cell-wrapper": {
-            textAlign: "center"
-        },
+        "& .ag-cell-wrapper": {},
         "& .ag-menu-option": {
             cursor: "pointer"
         }
@@ -2320,39 +2243,61 @@ var useStyles$p = makeStyles(function (theme) { return ({
     card: {
         backgroundColor: "#e9f2f8",
         display: "flex",
-        alignItems: "center"
+        alignItems: "center",
+        height: "100%"
     },
     filters: {
         position: "relative",
         margin: "0 10px"
     },
-    form: {
-        display: "flex",
-        flexDirection: "column"
-    }
-}); });
-var TableLogs = function () {
-    var _a = useLogsContext(), _b = _a.state.searchData, Start = _b.Start, End = _b.End, Search = _b.Search, LogTypeCode = _b.LogTypeCode, _c = _a.actions, setStartFilter = _c.setStartFilter, setEndFilter = _c.setEndFilter, setSearchFilter = _c.setSearchFilter, setLogTypeCodeFilter = _c.setLogTypeCodeFilter, resetFilters = _c.resetFilters;
+    form: {}
+}); });
+
+var useLogsOptionsFunctions = function (_a) {
+    var setSelectedLog = _a.setSelectedLog, setShowLogModal = _a.setShowLogModal, handleResetButtonClick = _a.handleResetButtonClick;
+    var getMenuOptions = function (data) {
+        var options = [];
+        if (data) {
+            options = options.concat([
+                {
+                    name: "View Log",
+                    key: "view_log",
+                    onClick: function () {
+                        setSelectedLog(data);
+                        setShowLogModal(true);
+                    },
+                    icon: React__default.createElement(PlaylistAddIcon, null)
+                },
+                {
+                    name: "Reset Filter",
+                    key: "reset_filters",
+                    onClick: function () {
+                        handleResetButtonClick();
+                    },
+                    icon: React__default.createElement(EditIcon, null)
+                },
+            ]);
+        }
+        return options;
+    };
+    return {
+        getMenuOptions: getMenuOptions
+    };
+};
+
+var TableLogs = function (_a) {
+    var isLoading = _a.isLoading; _a.rowData; var refreshData = _a.refreshData;
+    var _b = useLogsContext(), _c = _b.state.searchData, Start = _c.Start, End = _c.End, Search = _c.Search, LogTypeCode = _c.LogTypeCode, _d = _b.actions, setLogTypeCodeFilter = _d.setLogTypeCodeFilter, setEndFilter = _d.setEndFilter, setStartFilter = _d.setStartFilter, setSearchFilter = _d.setSearchFilter;
     var classes = useStyles$p();
     var gridStyle = useMemo(function () { return ({ height: "100%", width: "100%" }); }, []);
-    var gridRef = useRef(null);
-    var _d = useState(false), showLogModal = _d[0], setShowLogModal = _d[1];
-    var _e = useState(true), loading = _e[0], setLoading = _e[1];
-    var _f = useState(undefined), selectedLog = _f[0], setSelectedLog = _f[1];
-    var _g = useState(""), error = _g[0], setError = _g[1];
-    var _h = useState(""), messegaTable = _h[0]; _h[1];
-    var handleResetButtonClick = function () {
-        resetFilter();
-        getLogs();
-        setError("");
+    var _e = useState(null); _e[0]; var setGridAPI = _e[1];
+    var _f = useState(false), showLogModal = _f[0], setShowLogModal = _f[1];
+    var _g = useState(undefined), selectedLog = _g[0], setSelectedLog = _g[1];
+    var _h = useState(""), error = _h[0], setError = _h[1];
+    var onGridReady = function (params) {
+        setGridAPI(params.api);
     };
-    var getMenuOptions = useLogsOptionsFunctions({
-        setSelectedLog: setSelectedLog,
-        setShowLogModal: setShowLogModal,
-        handleResetButtonClick: handleResetButtonClick
-    }).getMenuOptions;
-    var _j = useContextMenuMESF(), showContextMenu = _j.showContextMenu, registerConfig = _j.registerConfig;
-    var _k = useLogTableData(), rows = _k.rows, columnDefs = _k.columnDefs;
+    var _j = useLogTableData(), rows = _j.rows, columnDefs = _j.columnDefs;
     var defaultColDef = useMemo(function () {
         return {
             sortable: true,
@@ -2361,6 +2306,21 @@ var TableLogs = function () {
             wrapHeaderText: true
         };
     }, []);
+    var _k = useContextMenuMESF(), showContextMenu = _k.showContextMenu, registerConfig = _k.registerConfig;
+    var handleSubmit = function (ev) {
+        ev.preventDefault();
+        refreshData({ Start: Start, End: End, Search: Search, LogTypeCode: LogTypeCode });
+    };
+    var handleResetButtonClick = function () {
+        resetFilter();
+        refreshData({
+            Start: moment$2().add(-5, "days").hour(0).minute(0).second(0).toDate(),
+            End: moment$2().hour(23).minute(59).second(59).toDate(),
+            Search: "",
+            LogTypeCode: "A"
+        });
+        setError("");
+    };
     var loadingOverlayComponent = useMemo(function () {
         return (React.createElement("div", { style: {
                 width: "100%",
@@ -2370,27 +2330,22 @@ var TableLogs = function () {
                 alignItems: "center"
             } },
             React.createElement(LazyLoading, null)));
-    }, []);
+    }, [isLoading]);
     // Btn reset data
     var resetFilter = function () {
-        resetFilters(null);
+        setStartFilter(null);
+        setEndFilter(null);
+        setSearchFilter("");
+        setLogTypeCodeFilter("A");
         setSelectedLog(undefined);
     };
     var rowClicked = function (rowClickedEvent) {
         var data = rowClickedEvent.data;
-        if (data === undefined)
+        if (data)
             return;
         setSelectedLog(data);
         setShowLogModal(true);
     };
-    var getLogs = useGetLogsFromAPI({
-        Start: Start,
-        End: End,
-        Search: Search,
-        LogTypeCode: LogTypeCode,
-        setError: setError,
-        setLoading: setLoading
-    });
     var getContextMenuItems = function (params) {
         var _a, _b;
         var data = (_a = params.node) === null || _a === void 0 ? void 0 : _a.data;
@@ -2399,73 +2354,122 @@ var TableLogs = function () {
         showContextMenu(event, data, "TableLogs");
         return [];
     };
-    var handleSubmit = function (ev) {
-        ev.preventDefault();
-        getLogs();
-    };
+    var getMenuOptions = useLogsOptionsFunctions({
+        setSelectedLog: setSelectedLog,
+        setShowLogModal: setShowLogModal,
+        handleResetButtonClick: handleResetButtonClick
+    }).getMenuOptions;
     useEffect(function () {
         registerConfig({
             id: "TableLogs",
             getOptions: getMenuOptions
         });
     }, []);
-    if (rows.length) {
-        return (React.createElement(Grid, { container: true, justifyContent: "center", alignItems: "center", className: classes.root },
-            React.createElement(Grid, { item: true, md: 12, xs: 12, className: classes.filters, style: { padding: "0 15px" } },
-                React.createElement(ModalLogSelected, { show: showLogModal, onHide: function () { return setShowLogModal(false); }, selectedLog: selectedLog }),
-                React.createElement(Typography$1, { variant: "h5", style: { margin: "20px 0 20px", fontWeight: 600 } }, "MES and System Logs"),
-                React.createElement(Grid, { container: true, direction: "row", style: { margin: "20px 0 0" } },
-                    React.createElement(Grid, { item: true, md: 12, xs: 12 },
-                        React.createElement(Card, { className: classes.card },
-                            React.createElement(CardContent, { style: { padding: "16px !important", width: "100%" } },
-                                React.createElement("form", { onSubmit: handleSubmit, className: classes.form },
-                                    React.createElement(Grid, { container: true, alignItems: "center", direction: "row", spacing: 2 },
-                                        React.createElement(Grid, { item: true, md: 4, xs: 12 },
-                                            React.createElement(DateFilter, { label: "From", date: Start, setDate: setStartFilter })),
-                                        React.createElement(Grid, { item: true, md: 4, xs: 12 },
-                                            React.createElement(DateFilter, { label: "To", date: End, setDate: setEndFilter })),
+    return (React.createElement(Grid, { container: true, justifyContent: "center", alignItems: "center", className: classes.root },
+        React.createElement(Grid, { item: true, md: 12, xs: 12, className: classes.filters, style: { padding: "0 15px" } },
+            React.createElement(ModalLogSelected, { show: showLogModal, onHide: function () { return setShowLogModal(false); }, selectedLog: selectedLog }),
+            React.createElement(Typography$1, { variant: "h5", style: { margin: "20px 0 20px", fontWeight: 600 } }, "MES and System Logs"),
+            React.createElement(Grid, { container: true, direction: "row", style: { margin: "10px 0 0" } },
+                React.createElement(Grid, { item: true, md: 12, xs: 12 },
+                    React.createElement(Card, { className: classes.card },
+                        React.createElement(CardContent, { style: { padding: "6px !important", width: "100%" } },
+                            React.createElement("form", { onSubmit: handleSubmit, className: classes.form },
+                                React.createElement(Grid, { container: true, alignItems: "center", direction: "row", spacing: 2 },
+                                    React.createElement(Grid, { item: true, md: 3, xs: 12 },
+                                        React.createElement(DateFilter, { label: "From", date: Start, setDate: setStartFilter })),
+                                    React.createElement(Grid, { item: true, md: 3, xs: 12 },
+                                        React.createElement(DateFilter, { label: "To", date: End, setDate: setEndFilter })),
+                                    React.createElement(Grid, { item: true, md: 2, xs: 12 },
+                                        React.createElement(CodeFilter, { LogTypeCode: LogTypeCode, setLogTypeCodeFilter: setLogTypeCodeFilter })),
+                                    React.createElement(Grid, { item: true, container: true, md: 4, xs: 12, spacing: 1, justifyContent: "flex-end", alignItems: "flex-end" },
                                         React.createElement(Grid, { item: true, md: 4, xs: 12 },
-                                            React.createElement(CodeFilter, { LogTypeCode: LogTypeCode, setLogTypeCodeFilter: setLogTypeCodeFilter }))),
-                                    React.createElement(Grid, { container: true, direction: "row" },
-                                        React.createElement(Grid, { item: true, md: 12, xs: 12 },
-                                            React.createElement(SearchFilter, { search: Search, setSearch: setSearchFilter }))),
-                                    React.createElement(Grid, { container: true, direction: "row", justifyContent: "flex-start", spacing: 2 },
-                                        React.createElement(Grid, { item: true, md: 6, xs: 12 },
                                             React.createElement(Button, { variant: "contained", color: "default", onClick: handleResetButtonClick, fullWidth: true }, "Reset")),
-                                        React.createElement(Grid, { item: true, md: 6, xs: 12 },
-                                            React.createElement(Button, { fullWidth: true, startIcon: loading && React.createElement(CircularProgress, { size: "1rem" }), disabled: loading, variant: "contained", color: "primary", type: "submit" }, "Search"))))))),
-                    React.createElement(Grid, { item: true, md: 12, xs: 12, style: {
-                            height: "55vh",
-                            border: "4px solid #ccc",
-                            borderRadius: 10,
-                            padding: 10,
-                            margin: "20px 0 10px"
-                        } },
-                        React.createElement("div", { style: gridStyle, className: "ag-theme-alpine" },
-                            React.createElement(AgGridReact, { ref: gridRef, rowData: rows, columnDefs: columnDefs, defaultColDef: defaultColDef, rowHeight: 34, headerHeight: 34, animateRows: true, loadingOverlayComponent: loadingOverlayComponent, getContextMenuItems: function (e) { return getContextMenuItems(e); }, pagination: true, rowSelection: "single", overlayNoRowsTemplate: messegaTable, onRowDoubleClicked: function (e) {
-                                    rowClicked(e);
-                                } }))))),
-            React.createElement(ErrorModal, { error: error, onHide: function () { return setError(""); } })));
-    }
-    else
-        return (React.createElement(React.Fragment, null,
-            React.createElement(Grid, { container: true, justifyContent: "center", alignItems: "center", style: { height: "70vh", width: "100%" } },
-                React.createElement(LazyLoading, null))));
+                                        React.createElement(Grid, { item: true, md: 4, xs: 12 },
+                                            React.createElement(ButtonWithLoading, { isLoading: isLoading, fullWidth: true, variant: "contained", color: "primary", type: "submit" }, "Search")))),
+                                React.createElement(Grid, { container: true, direction: "row" },
+                                    React.createElement(Grid, { item: true, md: 12, xs: 12 },
+                                        React.createElement(SearchFilter, { search: Search, setSearch: setSearchFilter }))))))),
+                React.createElement(Grid, { item: true, md: 12, xs: 12, style: {
+                        height: "55vh",
+                        border: "4px solid #ccc",
+                        borderRadius: 10,
+                        padding: 10,
+                        margin: "20px 0 10px"
+                    } },
+                    React.createElement("div", { style: gridStyle, className: "ag-theme-material" },
+                        React.createElement(AgGridReact, { rowData: rows, columnDefs: columnDefs, defaultColDef: defaultColDef, onGridReady: onGridReady, getRowId: function (params) { return params.data.id; }, rowHeight: 34, headerHeight: 40, animateRows: true, loadingOverlayComponent: loadingOverlayComponent, getContextMenuItems: function (e) { return getContextMenuItems(e); }, rowSelection: "single", onRowDoubleClicked: function (e) {
+                                rowClicked(e);
+                            } }))))),
+        React.createElement(ErrorModal, { error: error, onHide: function () { return setError(""); } })));
 };
 
+//fx obtener logs
+var getLogs = function (Start, End, Search, LogTypeCode) { return __awaiter(void 0, void 0, void 0, function () {
+    var apiService, parameters, resp;
+    return __generator(this, function (_a) {
+        switch (_a.label) {
+            case 0:
+                apiService = new MESApiService();
+                parameters = [];
+                parameters.push({ name: "Start", value: Start });
+                parameters.push({ name: "End", value: End });
+                parameters.push({ name: "Search", value: Search });
+                parameters.push({
+                    name: "LogTypeCode",
+                    value: LogTypeCode === "A" ? null : LogTypeCode
+                });
+                return [4 /*yield*/, apiService.callV2("[MES].[GetLogs]", parameters)];
+            case 1:
+                resp = _a.sent();
+                return [2 /*return*/, resp];
+        }
+    });
+}); };
+
 var Logs = function (prop) {
-    var logs = useLogsContext().state.logs;
-    if (logs) {
-        return (React.createElement(Grid, { container: true, justifyContent: "center", alignItems: "center" },
-            React.createElement(Grid, { item: true, md: 12, xs: 12, style: { margin: 0 } },
-                React.createElement(Paper, { elevation: 1, style: {
+    var _a = useState(true), loading = _a[0], setLoading = _a[1];
+    var _b = useState(""), error = _b[0], setError = _b[1];
+    var _c = useLogsContext(), _d = _c.state.searchData, Start = _d.Start, End = _d.End, Search = _d.Search, LogTypeCode = _d.LogTypeCode, state = _c.state, actions = _c.actions;
+    var getLogsFromAPI = function () { return __awaiter(void 0, void 0, void 0, function () {
+        var canceled, res, logs;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    canceled = false;
+                    setLoading(true);
+                    return [4 /*yield*/, getLogs(Start, End, Search, LogTypeCode)];
+                case 1:
+                    res = _a.sent();
+                    if (res.ok) {
+                        logs = get$1(res, "data.tables[0].rows", []);
+                        if (canceled)
+                            return [2 /*return*/];
+                        actions.setLogs(logs);
+                    }
+                    else
+                        setError(res.message);
+                    if (canceled)
+                        return [2 /*return*/];
+                    setLoading(false);
+                    return [2 /*return*/, function () {
+                            canceled = true;
+                        }];
+            }
+        });
+    }); };
+    useEffect(function () {
+        getLogsFromAPI();
+    }, []);
+    return (React__default.createElement(React__default.Fragment, null,
+        React__default.createElement(Grid, { container: true, justifyContent: "center", alignItems: "center" },
+            React__default.createElement(Grid, { item: true, md: 12, xs: 12, style: { margin: 0 } },
+                React__default.createElement(Paper, { elevation: 1, style: {
                         width: "100%",
                         padding: "10px 0 20px",
                         borderRadius: "0.75rem"
                     } },
-                    React.createElement(TableLogs, null)))));
-    }
-    return React.createElement(LazyLoading, null);
+                    React__default.createElement(TableLogs, { isLoading: loading, rowData: state.logs, refreshData: getLogsFromAPI })))),
+        React__default.createElement(ErrorModal, { error: error, onHide: function () { return setError(""); } })));
 };
 
 var LogsPage = function (props) {
@@ -2813,7 +2817,7 @@ var DataTable = function (_a) {
                     case 1:
                         resp = _a.sent();
                         if (resp.ok)
-                            setAllActions(get(resp, "data.tables[0].rows", []));
+                            setAllActions(get$1(resp, "data.tables[0].rows", []));
                         else
                             setError(resp.message);
                         return [2 /*return*/];
@@ -2909,7 +2913,7 @@ var ActionsOfProfile = function (_a) {
                         case 1:
                             resp = _a.sent();
                             if (resp.ok)
-                                setActionsOfProfile(get(resp, "data.tables[0].rows", []));
+                                setActionsOfProfile(get$1(resp, "data.tables[0].rows", []));
                             else
                                 setError(resp.message);
                             setIsLoading(false);
@@ -3289,7 +3293,7 @@ var Profiles = function (prop) {
                 case 1:
                     resp = _a.sent();
                     if (resp.ok) {
-                        profiles = get$1(resp, "data.tables[0].rows", []);
+                        profiles = get(resp, "data.tables[0].rows", []);
                         actions.setProfiles(profiles);
                         setIsLoading(false);
                     }
@@ -4661,7 +4665,7 @@ var useSearchAssets$1 = function (_a) {
         getAssets().then(function (res) {
             if (res.ok) {
                 var mydataSource_1 = [];
-                var rows = get(res, "data.tables[0].rows", []);
+                var rows = get$1(res, "data.tables[0].rows", []);
                 var areas = rows.filter(function (asset) { return asset.CanBeDefaultAsset; });
                 setAllAssets(rows);
                 setAreasList(areas);
@@ -6148,7 +6152,7 @@ var AuthTypeSelector = function (_a) {
         setIsLoading(true);
         getAuthTypes().then(function (resp) {
             if (resp.ok) {
-                setAuthTypes(get(resp, "data.tables[0].rows", []));
+                setAuthTypes(get$1(resp, "data.tables[0].rows", []));
                 setIsLoading(false);
             }
             else {
@@ -6214,7 +6218,7 @@ var ProfilesPicker = function (_a) {
         getProfiles()
             .then(function (res) {
             if (res.ok) {
-                var profilesData = get(res, "data.tables[0].rows", null);
+                var profilesData = get$1(res, "data.tables[0].rows", null);
                 if (profilesData) {
                     if (canceled)
                         return;
@@ -7146,12 +7150,12 @@ var Configuration$1 = /** @class */ (function () {
 }());
 
 var getError = function (error) {
-    var arrayOfErrors = values(get(error, "response.data.errors", null));
+    var arrayOfErrors = values(get$1(error, "response.data.errors", null));
     var allErrors = "";
     if (arrayOfErrors.length) {
         allErrors = concatErrorMessagges(arrayOfErrors, allErrors);
     }
-    return get(error, "response.data.result", get(error, "internalError.message", get(error, "response.data.detail", get(error, "response.data.title", error.toString()) + " " + allErrors)));
+    return get$1(error, "response.data.result", get$1(error, "internalError.message", get$1(error, "response.data.detail", get$1(error, "response.data.title", error.toString()) + " " + allErrors)));
 };
 var concatErrorMessagges = function (arrayOfErrors, string) {
     arrayOfErrors.forEach(function (element, index) {
@@ -7869,7 +7873,7 @@ var getShiftByParameters = function (parameters) { return __awaiter(void 0, void
                 if (resp.ok) {
                     return [2 /*return*/, {
                             ok: true,
-                            data: get(resp.data, "tables[0].rows[0]", {})
+                            data: get$1(resp.data, "tables[0].rows[0]", {})
                         }];
                 }
                 else {
@@ -8567,7 +8571,7 @@ var Account = function () {
                 case 1:
                     resp = _j.sent();
                     if (resp.ok) {
-                        userData = get(resp, "data.tables[0].rows", null);
+                        userData = get$1(resp, "data.tables[0].rows", null);
                         setUserName((_a = userData[0]) === null || _a === void 0 ? void 0 : _a.UserName);
                         setUserLastName((_b = userData[0]) === null || _b === void 0 ? void 0 : _b.LastName);
                         setUserFirstName((_c = userData[0]) === null || _c === void 0 ? void 0 : _c.FirstName);
@@ -8945,10 +8949,10 @@ function Login(_a) {
     var params = useRef(new URL(document.location).searchParams);
     var _b = useState(false), open = _b[0], setOpen = _b[1];
     var _c = useState(""), message = _c[0], setMessage = _c[1];
-    var useEmailAndPassword = get(authConfig, "useEmailAndPassword", true);
-    var useAzureAD = get(authConfig, "useAzureAD", false);
-    var useWindowsAuth = get(authConfig, "useWindowsAuth", false);
-    var guestIsEnabled = get(authConfig, "guestIsEnabled", false);
+    var useEmailAndPassword = get$1(authConfig, "useEmailAndPassword", true);
+    var useAzureAD = get$1(authConfig, "useAzureAD", false);
+    var useWindowsAuth = get$1(authConfig, "useWindowsAuth", false);
+    var guestIsEnabled = get$1(authConfig, "guestIsEnabled", false);
     var handleClose = function () {
         setOpen(false);
         params.current["delete"]("message");
@@ -9024,7 +9028,7 @@ var useSearchAssets = function (setError) {
                 switch (_a.label) {
                     case 0:
                         if (!res.ok) return [3 /*break*/, 2];
-                        rows = get(res, "data.tables[0].rows", []);
+                        rows = get$1(res, "data.tables[0].rows", []);
                         return [4 /*yield*/, rows.filter(function (asset) { return asset.CanBeDefaultAsset; })];
                     case 1:
                         areas = _a.sent();
@@ -9097,7 +9101,7 @@ var useSearchUTLSettings = function (_a) {
                 case 1:
                     res = _a.sent();
                     if (res.ok) {
-                        settings = get(res, "data.tables[0].rows", []);
+                        settings = get$1(res, "data.tables[0].rows", []);
                         initSettings(settings);
                     }
                     else {
@@ -9404,13 +9408,6 @@ var ColorPicker = function (_a) {
                 } })); })))));
 };
 
-var ButtonWithLoading = function (_a) {
-    var children = _a.children, isLoading = _a.isLoading, props = __rest(_a, ["children", "isLoading"]);
-    return (React__default.createElement(Button, __assign({}, props, { disabled: isLoading }),
-        isLoading && React__default.createElement(CircularProgress, { size: "1rem" }),
-        children));
-};
-
 var TrendingsInitialState = {
     timeScopeStart: moment$2(new Date()).subtract(1, "days").toDate(),
     timeScopeEnd: new Date(),
@@ -12253,7 +12250,7 @@ var useDefaultAreaId = function (setError) {
         if (userId) {
             getUser(userId, null).then(function (res) {
                 if (res.ok) {
-                    var userDefaultAreaId = get(res, "data.tables[0].rows[0].DefaultAssetId", null);
+                    var userDefaultAreaId = get$1(res, "data.tables[0].rows[0].DefaultAssetId", null);
                     if (userDefaultAreaId) {
                         setDefaultAreaId(userDefaultAreaId);
                     }