@extends('layouts.reporte')

@section('php')
    @php
        $cliente = config('app.CLIENTE');
        if ($cliente == 'colgate') {
            $div = '<div style="padding: 5px 16px;overflow: hidden;background-color: lightblue;text-align: center;"><ul>';
            foreach ($div_reportes as $value) {
                $div.="<li>".$value->Descripcion."</li>";
            }
            $div.="</ul></div>";
        }else{
            $div='';
        }
        $salida = json_encode(["2"=> __('messages.ventas'), "1" => __('messages.unidades')]);
        $porcentaje = json_encode(["80"=> "80 / 20", "20" => "20 / 80", "100" => "Todos"]);
        $display_tabla = '';
        $vista = json_encode(["1" => "Locales", "2" => "Locales - Productos", "3" => "Productos - Marca"]);
        foreach ($elemento as $key => $value) {
            if($value->valor == "SMU"){
                unset($elemento[$key]);
            }
        }
    @endphp
@endsection
@section('div_reportes')
@php echo $div; @endphp
@endsection
@section('tabla')
    @if(isset($selectores_tabla['rankingvent']))
        <x-tabla id="rankingvent" style="{{$display_tabla}}" :filtrosAv="$filtrosAv" :filtrosAvAlias="$filtrosAvAlias">


            <x-filtro id="f_clientes_rankingvent" :lista="$clientes" style="max-width: 120px;min-width: 120px;width: 120px;">
                <x-slot name="texto">
                    {{__('messages.filtro-texto-cliente')}}
                </x-slot>
            </x-filtro>
            <x-selector-generico id="f_vista_rankingvent2" idselect="f_vista_rankingvent" :salida="$vista"  class="selector-generico" style="width: 150px">
                <x-slot name="texto">
                    Vista
                </x-slot>
            </x-selector-generico>
            <x-selector-generico id="salida_rankingvent2" idselect="salida_rankingvent" :salida="$salida"  class="selector-generico" style="width: 110px">
                <x-slot name="texto">
                    {{__('messages.selector-generico-texto-valor')}}
                </x-slot>
            </x-selector-generico>
            <x-selector-generico id="porcentaje_rankingvent2" idselect="porcentaje_rankingvent" :salida="$porcentaje"  class="selector-generico" style="width: 110px" selected="100">
                <x-slot name="texto">
                    Pareto
                </x-slot>
            </x-selector-generico>
            <x-boton-actualizar onclick="getRankingVentas('{{$cliente}}', 'ventas')"/>
            <x-filtro id="f_categorias_rankingvent" :lista="$categorias" style="max-width: 120px;min-width: 120px;width: 120px;" class="ms-auto">
                <x-slot name="texto">
                    {{__('messages.filtro-texto-categoria')}}
                </x-slot>
            </x-filtro>
            <x-filtro id="f_kam_rankingvent" :lista="$kam" style="max-width: 120px;min-width: 120px;width: 120px;">
                <x-slot name="texto">
                    {{__('messages.filtro-texto-kam')}}
                </x-slot>
            </x-filtro>
        </x-tabla>
        @php $display_tabla = 'display: none;'; @endphp
    @endif
@endsection
@section('js_aft')
    <script>
    
        let ids = ['rankingvent'];
        
        $(document).ready(() => {
            let filtros = ['clientes', 'categorias', 'kam'];
            for(let filtro of filtros) {
                for(let id of ids) {
                    multiSelect(filtro, id, "{{__('messages.seleccionar')}}");
                }
            }
        });
        var filtrosPromise = getFiltrosAv('{{$cliente}}', '{{$codigo}}');
        filtrosPromise.then(function(resp){
            ponerFiltrosAv(resp);
        });
    </script>
@endsection