import React, { Fragment, useState, useEffect, useReducer, useContext, useRef } from 'react';
import { useHistory } from 'react-router-dom';
import { SiteRutas, ImagenesRutas, UtilitariosRutas } from '../request/RutasConfig.jsx';
import Header from '../components/Header/Header.jsx';
import useInput from '../components/Util/Hooks/useInput.jsx';
import { useSessionStorage } from '../components/Util/Hooks/useSessionStorage.jsx';
import { useLocalStorage } from '../components/Util/Hooks/useLocalStorage.jsx';
import { Obtener_Menu_Request } from '../request/MenuRequest.jsx';
import { Notificacion } from '../components/Util/Notificacion/Notificacion.jsx';
import { manageError } from '../components/Util/ManageError.js';
import Config from '../components/Util/constantes.js';
//modasl
import Session from '../components/Util/session/index.jsx';
import LocalStorage from '../components/Util/localStorage/index.jsx';
//import SessionControl from '../components/Util/SessionControl/SessionControl';
import { checkSession, obtenerSessionTimeout, removeSession, CerrarSesion } from '../request/LoginRequest.jsx';
import { SegSistema_Listar_Request } from '../request/SeguridadRequest.jsx';

export default props => {
    const mounted = useRef();

    const [nombreSistema, setNombreSistema] = useState('');
    const [lstMenu, setLstMenu] = useState([]);
    const [listaOrganigrama, setListaOrganigrama] = useState([{ id: '', name: '', isOpen: true, valor: '' }]);
    const [ID, setusuarioID] = useSessionStorage('id', '');
    const [token, setToken] = useSessionStorage('token', '');
    const [cargando, serCargando] = useState(true);
    let history = useHistory();
    const SessionStorage = new Session();
    const [sesionTimeout, setSesionTimeout] = useState(0);
    const [usuario, setUsuario] = useSessionStorage('usuarioNombre');
    const [imagenUsuario, setImagenUsuario] = useSessionStorage('ImagenUsuario', '');
    const [sistemasSession, setSistemasSession] = useLocalStorage('sistemaID', '');
    const [sistemaNombre, setSistemaNombre] = useLocalStorage('sistemaNombre', '');
    const [mostrarLista, setMostrarLista] = useState(true);
    const [lstSistemas, setLstSistemas] = useState([{ Id: 0, Nombre: 'LDLogin' }]);//[{ Id: 1, Nombre: 'LDCOMP' }, { Id: 2, Nombre: 'LDFASP' }];
    const [selNombre, setSelNombre] = useState('ND');
    const _modulo = Config.Modulo;

    const cargarDatos = async () => {

        //obtenerSesionTimeout();

        const _ListaSist = await Obtener_Sistemas(token, 0);
        setLstSistemas(_ListaSist);

        setNombreSistema("LDFAS LOGIN");

        if (_ListaSist.length > 1) {
            setMostrarLista(true);
        } else {
            setMostrarLista(false);
        }

        // const listaM = await Obtener_Menu(token, Config.Modulo);
        //setLstMenu(listaM);

        if (_ListaSist.length > 0) {

            if (sistemasSession === undefined || sistemasSession === "undefined" || sistemasSession === "") {

                setSelNombre(_ListaSist[0].Nombre);
                setSistemaNombre(_ListaSist[0].Nombre);
                setSistemasSession(_ListaSist[0].Id);
                history.push(SiteRutas.InterfazModulos)

            } else {

                if (_ListaSist.length > 1) {

                    let validaAcceso = _ListaSist.filter((item) => item.Id === sistemasSession);

                    if (validaAcceso.length > 0) {
                        setSelNombre(sistemaNombre);
                    } else {
                        setSelNombre(_ListaSist[0].Nombre);
                        setSistemaNombre(_ListaSist[0].Nombre);
                        setSistemasSession(_ListaSist[0].Id);
                        history.push(SiteRutas.InterfazModulos)
                    }

                } else {
                    setSelNombre(_ListaSist[0].Nombre);
                    setSistemaNombre(_ListaSist[0].Nombre);
                    setSistemasSession(_ListaSist[0].Id);
                    history.push(SiteRutas.InterfazModulos)
                }
            }

        }
    }


    const Obtener_Menu = async (pToken, pModulo) => {
        const response = await Obtener_Menu_Request(pToken, pModulo);
        let listaMenu = [];
        if (response.Exitoso) {
            listaMenu = response.Datos;
            if (listaMenu.length == 1) {
                if (listaMenu[0].ID == 0) {
                    history.push(SiteRutas.Login);
                    Notificacion.error(`Usuario no posee permisos en el menú`);
                    return [];
                }
            }
        } else {
            const _login = manageError(response, props, 'Obtener_Menu_Request');
            history.push(SiteRutas.Login);
            return [];
        }
        return listaMenu;
    }


    const Obtener_Sistemas = async (pToken, pTipoSist) => {
        const response = await SegSistema_Listar_Request(pToken, ID, 'WEB', pTipoSist, _modulo);
        let listaSist = [];
        if (response.Exitoso) {
            listaSist = response.Datos;
        } else {
            Notificacion.error(response.Mensaje)
            history.push(SiteRutas.Login)

            //Notificacion.error("No cuenta con accesos a ningún módulo.");
        }
        return listaSist;
    }

    useEffect(() => {
        if (!mounted.current) {
            const carga = async () => {
                await cargarDatos()
            }
            carga()
            mounted.current = true;
        }
    }, [])

    const onCerrarSesion = async () => {
        const session = new Session();
        const local = new LocalStorage();
        session.clear();
        document.title = "LD LOGIN";
        history.push(SiteRutas.Login);
    }
    // MANEJO DE SESION
    const eliminarSesion = async () => {
        const result = await removeSession();
        if (!result) {
            Error({ text: 'La sesión ha expirado.' });
            history.push(SiteRutas.Login);
        }
    }
    /*
        const reactivarSesion = async () => {
            const result = await checkSession();
            if (result || result === 'true') {
                Error({ text: 'La sesión ha expirado.' });
                history.push(SiteRutas.Login);
            }
        }
    
        const obtenerSesionTimeout = async () => {
            const result = await obtenerSessionTimeout();
            if (result && !isNaN(result)) {
    
                const _sesionTimeout = parseInt(result);
                if (sesionTimeout > 0) {
                    setSesionTimeout(_setSesionTimeout);
                }
                else {
                    Error({ text: 'La sesión ha expirado.' });
                    history.push(SiteRutas.Login);
                }
            }
            else {
                Error({ text: 'La sesión ha expirado.' });
                history.push(SiteRutas.Login);
            }
        }
    
        const cerrarSesionTimeout = logoutType => {
            eliminarSesion();
        } */

    const handlerSistemas = async (pId, pNombre) => {
        const name = pNombre;
        const Id = pId;
        setSelNombre(pNombre);
        setSistemasSession(pId);
        setSistemaNombre(pNombre);
        history.push(SiteRutas.InterfazModulos)
    }

    return (
        <Fragment>

            {/*  <Menu lstMenu={lstMenu} {...props}/> */}

            {/*  
             *  
             * 
             * */}
            <Header
                lstSistemas={lstSistemas}
                nombreSistema={nombreSistema}
                usuario={usuario}
                imagenUsuario={imagenUsuario}
                onCerrarSesion={onCerrarSesion}
                handlerSistemas={handlerSistemas}
                SelNombre={selNombre}
                mostrarLista={mostrarLista}
            />
            <div className="main-content container-fluid" id="back-top">

                <div>
                    <div className="col-md-12" >
                        {props.children}
                    </div>
                </div>

            </div>

        </Fragment>
    );
}