@extends('plantillas.app')

@section('breadcrumbs')
    {!!   Breadcrumbs::render('inicio') !!}
@endsection

@section('contenido')

    @if(Auth::user()->esGerente() or Auth::user()->esAdministrador())
        <div class="row">


            <div class="col-md-8">
                <div class="jumbotron">
                    <h3>La información que contiene este <i class="text-warning fas fa-lightbulb"></i> UTILITARIO es para <b>ayudar a tu gestión</b></h3>
                </div>
                <div class="card border-success border-darken-3">
                    <div class="card-header card-head-inverse bg-success bg-darken-3">
                        <h4 class="card-title"><i class="fas fa-box"></i> Materiales de almacén
                        </h4>
                    </div>

                    @if (is_null($transaccionAlmacen))
                        <div class="card-content">
                            <div class="card-body">
                                <div class="alert alert-danger">
                                    <h5><i class="icon fas fa-ban"></i> Alerta</h5>
                                    Aún no se realiza la transferencia de la información de almacén del AVALON al utilitario,
                                    se debe usar la opción "CARGAR ALMACÉN" a la cual solo tiene acceso personal de informática.
                                </div>
                            </div>
                        </div>

                    @else
                        <div class="card-content">
                            <div class="card-body">
                                <div class="alert alert-warning">
                                    <h5>
                                        <i class="icon fas fa-exclamation-triangle"></i> Importante</h5>
                                    El siguiente cuadro estadístico <u class="font-weight-bolder ">no es en tiempo real,</u>
                                    para actualizarlo se debe usar la opción "CARGAR ALMACÉN" a la cual solo tiene acceso personal de Informática.
                                    <span class="font-italic font-weight-bolder">
                                    La última actualización del cuadro estadístico se realizó el {{ $transaccionAlmacen->created_at->format('d-m-Y h:i:s A') }}
                                    </span>
                                </div>
                                <p>Materiales que <b><u>ingresaron al almacén en un determinado año</u></b> y que <b><u>no se utilizan a la fecha</u></b></p>
                                <div class="row">
                                    <div class="col-md-7">
                                        <div id="chart"></div>
                                    </div>

                                    <div class="col-md-5">
                                        <ul class="list-group">
                                            @foreach($saldosPorAnio as $anio)
                                                <li class="list-group-item">
                                            <span class="float-right">
                                                <a href="{{ route('logistica.item.reporte',$anio->nombre) }}" target="_blank">
                                                    S/ {{ number_format($anio->valor,2) }}
                                                </a>
                                            </span>
                                                    <span class="font-weight-bold">{{ $anio->nombre }}</span>
                                                    <small>({{ number_format($anio->valor/$saldosPorAnio->sum('valor')*100,2) }} %)</small>
                                                </li>
                                            @endforeach
                                            <li class="list-group-item bg-blue-grey white">
                                            <span class="float-right">
                                                S/ {{ number_format($saldosPorAnio->sum('valor'),2) }}
                                            </span>
                                                TOTAL
                                            </li>
                                        </ul>
                                    </div>
                                </div>

                            </div>
                        </div>
                    @endif
                </div>
            </div>

            <div class="col-md-4">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title"><i class="fas fa-tasks"></i> Planes operativos</h3>
                    </div>

                    <div class="card-body">

                        <div class="row">
                            @if (!is_null($transaccionActividades))
                                <div class="col-md-12">
                                <div class="card-body box-profile">

                                    <h3 class="profile-username text-center">Avance presupuestal global</h3>
                                    <p class="text-muted text-center">
                                        {{ round($avancePresupuestal['total']/$presupuesto['pim']*100,3) }} %
                                    </p>
                                    <div class="progress">
                                        <div class="progress-bar bg-primary progress-bar-striped" role="progressbar" aria-valuenow="{{ round($avancePresupuestal['total']/$presupuesto['pim'],3) }}" aria-valuemin="0" aria-valuemax="100" style="width:{{ round($avancePresupuestal['total']/$presupuesto['pim']*100,3) }}%">
                                            <span class="sr-only">{{ round($avancePresupuestal['total']/$presupuesto['pim']*100,3) }}% Complete (success)</span>
                                        </div>
                                    </div>
                                    <ul class="list-group list-group-unbordered mb-3">
                                        <li class="list-group-item">
                                            <b>Presupuesto inicial (PIA)</b> <span class="float-right">S/ {{ number_format($presupuesto['pia'],2,'.',', ') }}</span>
                                        </li>
                                        <li class="list-group-item">
                                            <b>Presupuesto actual (PIM)</b> <span class="float-right">S/ {{ number_format($presupuesto['pim'],2,'.',', ') }}</span>
                                        </li>
                                        <li class="list-group-item">
                                            <b>Comprometido</b> <span class="float-right">S/ {{ number_format($avancePresupuestal['total'],2,'.',', ') }}</span>
                                        </li>
                                        <li class="list-group-item text-purple">
                                            <b>Saldo disponible</b> <span class="float-right">S/ {{ number_format(($presupuesto['pim'] - $avancePresupuestal['total']),2,'.',', ') }}</span>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            @endif

                            <div class="col-md-12">
                                <div class="card-body">
                                    <a href="{{ route('actividad.listar') }}">
                                        <div class="alert alert-primary text-center">
                                            <p>
                                                <i class="fas fa-book fa-5x"></i>
                                            </p>
                                            <h5>ACTIVIDADES</h5>
                                            Seguimiento de actividades empresariales
                                        </div>
                                    </a>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>

        {{--
        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title"><i class="fas fa-chart-bar"></i> Indicadores</h3>
                    </div>

                    <div class="card-body">

                        <div class="row">

                            <div class="col-md-3">
                                <div class="card card-primary card-outline">
                                    <div class="card-body">
                                        <ul class="nav flex-column">
                                            <div id="relacionTrabajo"></div>
                                        </ul>
                                        <div class="alert text-center">
                                            <h5>Relación de trabajo</h5>
                                            <a class="btn btn-primary" href="{{ route('indicador.relacionDeTrabajo') }}">Detalle</a>
                                        </div>
                                    </div>
                                </div>
                            </div>


                        </div>
                    </div>

                </div>
            </div>
        </div>
        --}}

        <!-- reporte de costos -->
        @if (!is_null($transaccionIndicadores))
        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-header d-flex p-0 bg-gradient-warning">
                        <h3 class="card-title p-3"><i class="fas fa-chess"></i> Reporte costos</h3>
                        {{--
                        <ul class="nav nav-pills ml-auto p-2">
                            <li class="nav-item"><a class="nav-link active" href="#tab_funcion" data-toggle="tab">Función</a></li>
                            <li class="nav-item"><a class="nav-link" href="#tab_naturaleza" data-toggle="tab">Naturaleza</a></li>
                            <li class="nav-item dropdown">
                                <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#">
                                    Exportar <span class="caret"></span>
                                </a>
                                <div class="dropdown-menu">
                                    <a class="dropdown-item" tabindex="-1" href="#">Excel</a>
                                    <a class="dropdown-item" tabindex="-1" href="#">PDF</a>
                                </div>
                            </li>
                            --}}
                        </ul>
                    </div>

                    <div class="card-body">
                        <div class="tab-content">
                            <div id="tab_funcion" class="tab-pane active">
                                <div class="col-md-12">
                                    <table class="table table-striped text-sm">
                                        <thead>
                                        <tr>
                                            <td>Cuenta</td>
                                            <td>Ene</td>
                                            <td>Feb</td>
                                            <td>Mar</td>
                                            <td>Abr</td>
                                            <td>May</td>
                                            <td>Jun</td>
                                            <td>Jul</td>
                                            <td>Ago</td>
                                            <td>Set</td>
                                            <td>Oct</td>
                                            <td>Nov</td>
                                            <td>Dic</td>
                                            <td>Total</td>
                                        </tr>
                                        </thead>
                                        <tbody class="text-right">
                                        @foreach($costos as $costo)
                                            <tr id="cuenta_{{ $costo->digito==3?substr($costo->cuenta,0,2):'xx'}}"  style="font-size: {{ $costo->digito==3? '10px':'12px' }}" class="{{ $costo->digito==3? 'collapse':'bg-cyan' }}">

                                                @if($costo->digito==3)
                                                    <td class="text-left pl-4">
                                                        <a href="{{ route('costos.detallarCuenta',$costo->cuenta) }}">
                                                            {{ $costo->cuenta }} - {{ $costo->descripcion }}
                                                        </a>
                                                    </td>
                                                @else
                                                    <td class="text-left pl-1">
                                                        <a class="text-white" href="#cuenta_{{$costo->cuenta}}" data-toggle="collapse" aria-expanded="false" aria-controls="cuenta_{{$costo->cuenta}}">
                                                            {{ $costo->cuenta }} - {{ $costo->descripcion }}
                                                        </a>
                                                    </td>
                                                @endif


                                                <td>{{ number_format($costo->enero,2) }}</td>
                                                <td>{{ number_format($costo->febrero,2) }}</td>
                                                <td>{{ number_format($costo->marzo,2) }}</td>
                                                <td>{{ number_format($costo->abril,2) }}</td>
                                                <td>{{ number_format($costo->mayo,2) }}</td>
                                                <td>{{ number_format($costo->junio,2) }}</td>
                                                <td>{{ number_format($costo->julio,2) }}</td>
                                                <td>{{ number_format($costo->agosto,2) }}</td>
                                                <td>{{ number_format($costo->setiembre,2) }}</td>
                                                <td>{{ number_format($costo->octubre,2) }}</td>
                                                <td>{{ number_format($costo->noviembre,2) }}</td>
                                                <td>{{ number_format($costo->diciembre,2) }}</td>
                                                <td>{{ number_format($costo->valor,2) }}</td>
                                            </tr>

                                        @endforeach
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                            <div id="tab_naturaleza" class="tab-pane">
                                <div class="col-md-12">
                                    <table class="table table-striped text-sm">
                                        <thead>
                                        <tr>
                                            <td>Cuenta</td>
                                            <td>Ene</td>
                                            <td>Feb</td>
                                            <td>Mar</td>
                                            <td>Abr</td>
                                            <td>May</td>
                                            <td>Jun</td>
                                            <td>Jul</td>
                                            <td>Ago</td>
                                            <td>Set</td>
                                            <td>Oct</td>
                                            <td>Nov</td>
                                            <td>Dic</td>
                                            <td>Total</td>
                                        </tr>
                                        </thead>
                                        <tbody class="text-right">
                                        @foreach($gastos as $gasto)
                                            <tr id="cuenta_{{ $gasto->digito==3?substr($gasto->cuenta,0,2):'xx'}}"  style="font-size: {{ $gasto->digito==3? '10px':'12px' }}" class="{{ $gasto->digito==3? 'collapse':'bg-success' }}">

                                                @if($gasto->digito==3)
                                                    <td class="text-left pl-4">
                                                        <a href="{{ route('costos.detallarCuenta',$gasto->cuenta) }}" target="_blank">
                                                            {{ $gasto->cuenta }} - {{ $gasto->descripcion }}
                                                        </a>
                                                    </td>
                                                @else
                                                    <td class="text-left pl-1">
                                                        <a class="text-white" href="#cuenta_{{$gasto->cuenta}}" data-toggle="collapse" aria-expanded="false" aria-controls="cuenta_{{$gasto->cuenta}}">
                                                            {{ $gasto->cuenta }} - {{ $gasto->descripcion }}
                                                        </a>
                                                    </td>
                                                @endif


                                                <td>{{ number_format($gasto->enero,2) }}</td>
                                                <td>{{ number_format($gasto->febrero,2) }}</td>
                                                <td>{{ number_format($gasto->marzo,2) }}</td>
                                                <td>{{ number_format($gasto->abril,2) }}</td>
                                                <td>{{ number_format($gasto->mayo,2) }}</td>
                                                <td>{{ number_format($gasto->junio,2) }}</td>
                                                <td>{{ number_format($gasto->julio,2) }}</td>
                                                <td>{{ number_format($gasto->agosto,2) }}</td>
                                                <td>{{ number_format($gasto->setiembre,2) }}</td>
                                                <td>{{ number_format($gasto->octubre,2) }}</td>
                                                <td>{{ number_format($gasto->noviembre,2) }}</td>
                                                <td>{{ number_format($gasto->diciembre,2) }}</td>
                                                <td>{{ number_format($gasto->valor,2) }}</td>
                                            </tr>

                                        @endforeach
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>
        @endif
    @endif



    @if(Auth::user()->esAdministrador())

        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title"><i class="fas fa-user-shield"></i> Administrador</h3>
                    </div>

                    <div class="card-body">

                        <div class="row">
                            <div class="col-md-4">
                                <div class="card-body">
                                    <a href="{{ route('administrador.usuarios.listar') }}">
                                        <div class="alert alert-secondary text-center">
                                            <p>
                                                <i class="fas fa-user fa-5x"></i>
                                            </p>
                                            <h5>USUARIOS</h5>
                                            Esta opción permite administrar los usuarios.
                                        </div>
                                    </a>
                                </div>
                            </div>

                            <div class="col-md-4">
                                <div class="card shadow-none" id="importar">
                                    <div class="card-body">
                                        <a href="#" id="cargar">
                                            <div class="alert alert-danger text-center">
                                                <p>
                                                    <i class="fas fa-sync fa-5x"></i>
                                                </p>
                                                <h5>CARGAR ACTIVIDADES</h5>
                                                Esta opción permite importar las actividades empresariales del AVALON.
                                            </div>
                                        </a>
                                    </div>
                                </div>
                            </div>

                            <div class="col-md-4">
                                <div class="card shadow-none" id="importarAlmacen">
                                    <div class="card-body">
                                        <a href="#" id="cargarAlmacen">
                                            <div class="alert alert-primary text-center">
                                                <p>
                                                    <i class="fas fa-sync fa-5x"></i>
                                                </p>
                                                <h5>CARGAR ALMACÉN</h5>
                                                Esta opción permite importar los movimientos de almacén del AVALON.
                                            </div>
                                        </a>
                                    </div>

                                </div>
                            </div>


                            <div class="col-md-4">
                                <div class="card shadow-none" id="importarIndicadores">
                                    <div class="card-body">
                                        <a href="#" id="cargarIndicadores">
                                            <div class="alert alert-warning text-center" style="color:white;">
                                                <p>
                                                    <i class="fas fa-sync fa-5x"></i>
                                                </p>
                                                <h5>CARGAR INDICADORES</h5>
                                                Esta opción permite importar los movimientos de contabilidad del AVALON para el cálculo de indicadores.
                                            </div>
                                        </a>
                                    </div>

                                </div>
                            </div>

                        </div>
                    </div>

                </div>
            </div>
        </div>
    @endif



    @if(Auth::user()->esVerificador() or Auth::user()->esPresupuesto() or Auth::user()->esAdministrador())
        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title"><i class="far fa-eye"></i> Verificador</h3>
                    </div>

                    <div class="card-body">

                        <div class="row">
                            <div class="col-md-4">
                                <div class="card-body">
                                    <a href="{{ route('pedido.buscar') }}">
                                        <div class="alert alert-success text-center">
                                            <p>
                                                <i class="far fa-file-alt fa-5x"></i>
                                            </p>
                                            <h5>VERIFICAR PEDIDOS</h5>
                                            Esta opción permite visualizar los enlaces contables y actividad presupuestal
                                            de los items de las notas de pedido.
                                        </div>
                                    </a>
                                </div>
                            </div>

                            <div class="col-md-4">
                                <div class="card-body">
                                    <a href="{{ route('cajaChica.buscar') }}">
                                        <div class="alert alert-info text-center">
                                            <p>
                                                <i class="fas fa-funnel-dollar fa-5x"></i>
                                            </p>
                                            <h5>VERIFICAR CAJAS CHICAS</h5>
                                            Esta opción permite visualizar los enlaces contables y actividad presupuestal
                                            de las items registrados en las cajas chicas.
                                        </div>
                                    </a>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    @endif

    @if(Auth::user()->esOperativo() or Auth::user()->esVerificador() or Auth::user()->esPresupuesto() or Auth::user()->esAdministrador())
        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title"><i class="fas fa-tasks"></i> Planes operativos</h3>
                    </div>

                    <div class="card-body">

                        <div class="row">
                            <div class="col-md-4">
                                <div class="card-body">
                                    <a href="{{ route('actividad.listar') }}">
                                        <div class="alert alert-primary text-center">
                                            <p>
                                                <i class="fas fa-book fa-5x"></i>
                                            </p>
                                            <h5>ACTIVIDADES</h5>
                                            Gestionar actividades de planes operativos e inversión.
                                        </div>
                                    </a>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    @endif

    @if(Auth::user()->esPresupuesto() or Auth::user()->esAdministrador())
        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title"><i class="fas fa-chart-bar"></i> Planificación y presupuesto</h3>
                    </div>

                    <div class="card-body">

                        <div class="row">
                            @if(!Auth::user()->esAdministrador())
                                <div class="col-md-4">
                                    <div class="card shadow-none" id="importar">
                                        <div class="card-body">
                                            <a href="#" id="cargar">
                                                <div class="alert alert-danger text-center">
                                                    <p>
                                                        <i class="fas fa-sync fa-5x"></i>
                                                    </p>
                                                    <h5>CARGAR ACTIVIDADES</h5>
                                                    Esta opción permite importar las actividades empresariales del AVALON.
                                                </div>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            @endif

                            <div class="col-md-4">
                                <div class="card-body">
                                    <a href="{{ route('reporte.planificacion.listar') }}">
                                        <div class="alert alert-secondary text-center">
                                            <p>
                                                <i class="fas fa-copy fa-5x"></i>
                                            </p>
                                            <h5>REPORTES</h5>
                                            Repositorio de reportes adicionales al AVALON.
                                        </div>
                                    </a>
                                </div>
                            </div>


                        </div>
                    </div>
                </div>
            </div>
        </div>
    @endif
@endsection



@section('js')

    <script>

        $(document).ready(function() {

            var $primary = "#00b5b8",
                $secondary = "#2c3648",
                $success = "#0f8e67",
                $info = "#179bad",
                $warning = "#ffb997",
                $danger = "#ff8f9e"

            var $themeColor = [$primary, $success, $warning, $info, $danger, $secondary]

            var options = {
                series: [{!! implode(",",array_column($saldosPorAnio->toArray(),'valor')) !!}],
                chart: {
                    height: 350,
                    type: 'pie',
                },
                labels: [{!! implode(",",array_column($saldosPorAnio->toArray(),'nombre')) !!}],
                legend:{
                    fontSize:'16px',
                },
                dataLabels: {
                    formatter: function (val, opts) {
                        return val.toFixed(2) + '%'
                    },
                    style: {
                        fontSize: '18px',
                    },
                },
                responsive: [
                    {
                        breakpoint: 1200,
                        options: {
                            chart: {
                                width: 300
                            },
                            legend: {
                                position: 'bottom'
                            }
                        }
                    }, {
                        breakpoint: 768,
                        options: {
                            chart: {
                                width: 520
                            },
                            legend: {
                                position: 'right'
                            }
                        }
                    }, {
                        breakpoint: 620,
                        options: {
                            chart: {
                                width: 450
                            },
                            legend: {
                                position: 'right'
                            }
                        }
                    }, {
                        breakpoint: 480,
                        options: {
                            chart: {
                                width: 250
                            },
                            legend: {
                                position: 'bottom'
                            }
                        }
                    }],
                colors: $themeColor,
            };

            var chart = new ApexCharts(document.querySelector("#chart"), options);
            chart.render();

            var opcionesRelacionTrabajo={
                series: [{
                    name: "Indicador",
                    data: [{{ implode(",",$indicadores['relacionTrabajo']) }}]
                }],
                chart: {
                    height: 200,
                    type: 'line',
                    toolbar: {
                        show: false
                    }
                },
                dataLabels: {
                    enabled: false
                },
                stroke: {
                    curve: 'straight'
                },
                grid: {
                    row: {
                        colors: ['#f3f3f3', 'transparent'], // takes an array which will be repeated on columns
                        opacity: 0.5
                    },
                },
                xaxis: {
                    categories: [{{ implode(",",array_keys($indicadores['relacionTrabajo'])) }}],
                },
                colors: ['#FF9800'],
            };
            var graficoRelacionTrabajo=new ApexCharts(document.querySelector("#relacionTrabajo"),opcionesRelacionTrabajo);
            graficoRelacionTrabajo.render();


            function bloquearBox()
            {
                $('#importar').append("<div class='overlay actividades'><i class='fas fa-spinner fa-spin fa-2x fa-sync-alt'></i></div>");
            }

            function bloquearBoxAlmacen()
            {
                $('#importarAlmacen').append("<div class='overlay almacen'><i class='fas fa-spinner fa-spin fa-2x fa-sync-alt'></i></div>");
            }

            function bloquearBoxIndicadores()
            {
                $('#importarIndicadores').append("<div class='overlay indicadores'><i class='fas fa-spinner fa-spin fa-2x fa-sync-alt'></i></div>");
            }
            function desbloquearBox()
            {
                $('.actividades').remove()
            }

            function desbloquearBoxAlmacen()
            {
                $('.almacen').remove()
            }

            function desbloquearBoxIndicadores()
            {
                $('.indicadores').remove()
            }

            $('#cargar').click(function(event)
            {
                event.preventDefault();
                bloquearBox();
                $.ajax({
                    url: '{{ route('administrador.actividad.importar') }}',
                    type: 'GET',
                    success: function () {
                        toastr.success('Se realizó la transferencia de las actividades satisfactoriamente','Bien hecho',posicion);
                        desbloquearBox();
                    }
                })
            });

            $('#cargarAlmacen').click(function(event)
            {
                event.preventDefault();
                bloquearBoxAlmacen();
                $.ajax({
                    url: '{{ route('logistica.item.importar') }}',
                    type: 'GET',
                    success: function () {
                        toastr.success('Se realizó la transferencia de los movimientos de almacén satisfactoriamente','Bien hecho',posicion);
                        desbloquearBoxAlmacen();
                    }
                })
            });

            $('#cargarIndicadores').click(function(event)
            {
                event.preventDefault();
                bloquearBoxIndicadores();
                $.ajax({
                    url: '{{ route('indicador.transferir') }}',
                    type: 'GET',
                    success: function () {
                        toastr.success('Se realizó la transferencia de los movimientos de contabilidad satisfactoriamente','Bien hecho',posicion);
                        desbloquearBoxIndicadores();
                    }
                })
            });

        });


    </script>

@endsection