import React from 'react';
import { baseUrl, SiteRoutes } from '../../../config';
import { Route } from 'react-router-dom';
import { renderToStaticMarkup } from "react-dom/server";
import { withLocalize } from "react-localize-redux";
import globalTranslations from "../../../translations/global.json";
import { ServiceRequest } from 'Components/Request/service';

class Header extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            Company: '',
            CallCenter:''
        }

        this.props.initialize({
            languages: [
                { name: "English", code: "en" },
                { name: "Spanish", code: "es" }
            ],
            translation: globalTranslations,
            options: { renderToStaticMarkup }
        });
    }

    componentDidMount () {
        this.CargarInfo();

    }

    async CargarInfo(){
        let token = this.getParameterByName('pToken')
        let id = this.getParameterByName('pId')
        const response = await ServiceRequest.ObtenerExp_Ubicacion_Util(id,token);
        if (response != null) {
            this.setState({Company:response.data.Empresa_Nombre,CallCenter:response.data.Call_Center_Nombre})
        }
    }
    getParameterByName(name) {
        name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
        var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
            results = regex.exec(location.search);
        return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
    }



    render() {
        const baseUrl = document.getElementById('rutaRaizRedireccion').value;
        const baseImage =  document.getElementById('metaImagen').value;
        const {Company,CallCenter } = this.state; 
        

        return (
            <div>
                <header>
                    <nav class="big"><div class="row"><div class="col"><h1><img src={baseImage} alt="Logo Logical Data" />
                    </h1></div></div></nav>
                    <div class="header2"><div class="col text-right"><p  class="mt-3 mb-2 mr-2 margin-right-25">Compañía: {Company} <span class="ml-2 mr-2">|</span> Call Center: {CallCenter}</p></div></div></header>
                
            </div>

        )
    }
};
export default withLocalize(Header);