@extends('crudbooster::admin_template')

@section('content')

@php

#es vendedor

$all_status = DB::table('estados')
->orderBy('id')->get();

@endphp

<style>
    .profile-status{
    margin-bottom: 20px;
    display: table;
    width: 100%;
  }

  .profile-status > div{
    padding: 5px 10px;
    float: left;
    height: 55px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    text-transform: uppercase;
    border-left: 0px !important;
    position: relative;
    margin: 0 4px;
    font-size: 14px;
    width: calc({{ 100 / (count($all_status)?:1) }}% - 8px) ;
  }

  .profile-status > div::after {
    z-index: 2;
    content: '';
    position: absolute;
    top: 0px;
    right: -10px;
    height: 55px;
    border-bottom: 25px solid transparent;
    border-top: 25px solid transparent;
    border-left-width: 10px;
    border-left-color: white;
    border-left-style: solid;
  }

  .profile-status > div::before {
    z-index: 1;
    content: '';
    position: absolute;
    top: 0px;
    left: 0px;
    height: 55px;
    border-bottom: 25px solid transparent;
    border-top: 25px solid transparent;
    border-left-width: 10px;
    border-left-color: #ffffff;
    border-left-style: solid;
  }

  .profile-status > div.active{
    height: 65px;
    margin-top: -5px;
  }

  .profile-status > div.active::before, .profile-status > div.active::after {
    height: 65px;
    border-bottom: 33px solid transparent;
    border-top: 33px solid transparent;
  }

  .mx-4
  {
    margin-left: 1rem;
    margin-right: 1rem;
  }

  .flex{
    display: flex;
  } 
  
  .justify-content-end
  {
    justify-content: end;
  }

  @foreach($all_status as $i=>$s)
    .profile-status > div:nth-child({{ $i + 1 }})::after {
      border-left-color: {{ $s->color }}CC;
    }
  @endforeach


  @media(max-width: 800px){
    .profile-status > div{
      width: 100%;
      float: none;
      height: 40px;
    }

    .profile-status > div::after, .profile-status > div::before{
      border: 0;
    }
  }
    </style>
    @if($index_statistic)
        <div id='box-statistic' class='row'>
            @foreach($index_statistic as $stat)
                <div class="{{ ($stat['width'])?:'col-sm-3' }}">
                    <div class="small-box bg-{{ $stat['color']?:'red' }}">
                        <div class="inner">
                            <h3>{{ $stat['count'] }}</h3>
                            <p>{{ $stat['label'] }}</p>
                        </div>
                        <div class="icon">
                            <i class="{{ $stat['icon'] }}"></i>
                        </div>
                    </div>
                </div>
            @endforeach
        </div>
    @endif

    @if(!is_null($pre_index_html) && !empty($pre_index_html))
        {!! $pre_index_html !!}
    @endif


    @if(g('return_url'))
        <p><a href='{{g("return_url")}}'><i class='fa fa-chevron-circle-{{ trans('crudbooster.left') }}'></i>
                &nbsp; {{trans('crudbooster.form_back_to_list',['module'=>urldecode(g('label'))])}}</a></p>
    @endif

    
    @if($parent_table)
        <div class="box box-default">
            <div class="box-body table-responsive no-padding">
                <table class='table table-bordered'>
                    <tbody>
                    <tr class='active'>
                        <td colspan="2"><strong><i class='fa fa-bars'></i> {{ ucwords(urldecode(g('label'))) }}</strong></td>
                    </tr>
                    @foreach(explode(',',urldecode(g('parent_columns'))) as $c)
                        <tr>
                            <td width="25%"><strong>
                                    @if(urldecode(g('parent_columns_alias')))
                                        {{explode(',',urldecode(g('parent_columns_alias')))[$loop->index]}}
                                    @else
                                        {{  ucwords(str_replace('_',' ',$c)) }}
                                    @endif
                                </strong></td>
                            <td> {{ $parent_table->$c }}</td>
                        </tr>
                    @endforeach
                    </tbody>
                </table>
            </div>
        </div>
    @endif


        <div class="box">
            <div class="box-body view-filters">

                    <span class="pull-right" style="display: none;">Cantidad seleccionados: <span id="cant_seleccionados_chk"></span> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
                    <h4 onclick="$('#form_filtros').toggle(); $('#form_filtros2').hide()" style="font-size: 14px;cursor: pointer;display: inline-block;
                    border-bottom: 1px solid #e0e0e0;
                    padding-bottom: 10px;
                    margin-top: 2px; margin-right: 20px;
                    padding-left: 10px;"><i class="fa fa-filter" aria-hidden="true"></i> Filtros de búsqueda</h4>

                    <form id="form_filtros" style="display: none;    background: rgb(247, 245, 245); border: 1px solid #e0e0e0; border-radius: 5px;padding: 20px;" method="get">

                        @if(isset($_REQUEST['seller_report']))
                            <input name="id_cms_users" id="id_cms_users" value="{{$_REQUEST['id_cms_users']}}" type="hidden">
                            <input name="seller_report" type="hidden">
                        @endif

                        <input type="hidden" name="q" value="{{Request::get('q')}}" />
                        <div class="row">
                        @foreach($view_filters as $filter)
                            @switch($filter['type'])
                                @case('select')

                                    @if($filter['name'] == 'id_cliente')
                                        <div class="col-md-4">
                                            <label>{{$filter['label']}}</label>
                                            <select data-live-search="true" class="selectpicker" multiple name="{{$filter['name']}}[]" title="Todos los Clientes">
                                                @foreach($filter['items'] as $item)
                                                    <option {{ (is_array($_REQUEST[$filter['name']]) && in_array($item->id, $_REQUEST[$filter['name']])) ? "selected" : "" }} value="{{$item->id}}">{{$item->name}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    @endif

                                    @if($filter['name'] == 'id_proyecto')
                                        <div class="col-md-4">
                                            <label>{{$filter['label']}}</label>
                                            <select data-live-search="true" class="selectpicker" multiple name="{{$filter['name']}}[]" title="Todos los Proyectos">
                                                @foreach($filter['items'] as $item)
                                                    <option {{ (is_array($_REQUEST[$filter['name']]) && in_array($item->id, $_REQUEST[$filter['name']])) ? "selected" : "" }} value="{{$item->id}}">{{$item->name}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    @endif

                                    @if($filter['name'] == 'id_servicio')
                                        <div class="col-md-4">
                                            <label>{{$filter['label']}}</label>
                                            <select data-live-search="true" class="selectpicker" multiple name="{{$filter['name']}}[]" title="Todos los Servicios">
                                                @foreach($filter['items'] as $item)
                                                    <option {{ (is_array($_REQUEST[$filter['name']]) && in_array($item->id, $_REQUEST[$filter['name']])) ? "selected" : "" }} value="{{$item->id}}">{{$item->name}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    @endif

                                    @if($filter['name'] == 'id_moneda')
                                        <div class="col-md-4">
                                            <label>{{$filter['label']}}</label>
                                            <select data-live-search="true" class="selectpicker" multiple name="{{$filter['name']}}[]" title="Todos las Monedas">
                                                @foreach($filter['items'] as $item)
                                                    <option {{ (is_array($_REQUEST[$filter['name']]) && in_array($item->id, $_REQUEST[$filter['name']])) ? "selected" : "" }} value="{{$item->id}}">{{$item->name}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    @endif

                                @break

                            @endswitch
                        @endforeach
                            <div class="col-md-4">
                                <label>Fecha<small>(desde / hasta)</small></label>
                                <div class="row">
                                    <div class="col-md-6">
                                        <input type="text" name="fecha_desde" value="{{$_REQUEST['fecha_desde']}}" class="fecha" placeholder="desde" style="width: 100%"  />
                                    </div>
                                    <div class="col-md-6">
                                        <input type="text" name="fecha_hasta" value="{{$_REQUEST['fecha_hasta']}}" class="fecha" placeholder="hasta" style="width: 100%"   />
                                    </div>
                                </div>
                            </div>
                        </div>






                        <div class="col-md-3">



                        </div>

                        <div class="row">
                            <div class="col-md-4 pull-right" style="text-align: right;">
                                <button class="btn btn-primary">Realizar Búsqueda <i class="fa fa-search" aria-hidden="true"></i></button>

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

                    @if(empty($starred_result))
                        <div class="box-header" id="bulk_actions" style="display: none">
                            @if($button_bulk_action && ( ($button_delete && CRUDBooster::isDelete()) || $button_selected) )
                                <div class="pull-{{ trans('crudbooster.left') }}">
                                    <div class="selected-action" style="display:inline-block;position:relative;">
                                        <button type="button" class="btn btn-default btn-sm dropdown-toggle" data-toggle="dropdown" aria-expanded="false"><i
                                                    class='fa fa-check-square-o'></i> {{trans("crudbooster.button_selected_action")}}
                                            <span class="fa fa-caret-down"></span></button>
                                        <ul class="dropdown-menu">
                                            @if($button_delete && CRUDBooster::isDelete())
                                                <li><a href="javascript:void(0)" data-name='delete' title='{{trans('crudbooster.action_delete_selected')}}'><i
                                                                class="fa fa-trash"></i> {{trans('crudbooster.action_delete_selected')}}</a></li>
                                            @endif

                                            @if($button_selected)
                                                @foreach($button_selected as $button)
                                                    <li><a href="javascript:void(0)" data-name='{{$button["name"]}}' title='{{$button["label"]}}'><i
                                                                    class="fa fa-{{$button['icon']}}"></i> {{$button['label']}}</a></li>
                                                @endforeach
                                            @endif

                                        </ul><!--end-dropdown-menu-->
                                    </div><!--end-selected-action-->
                                </div><!--end-pull-left-->
                            @endif

                            <br style="clear:both"/>

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


        <div class="box-body table-responsive no-padding">
            @include("table")
        </div>
    </div>

    @if(!is_null($post_index_html) && !empty($post_index_html))
        {!! $post_index_html !!}
    @endif

    @if(!empty($starred_result))
      <style>
        #table_dashboard{
          opacity: .5;
        }
      </style>
    @endif

<script>
    function regenerateTxts()
    {
        console.log("generando...");
        const selected = document.querySelectorAll(".checkbox:checked");
        let values = [];

        if(selected.length==0)
        {
            alert("Seleccione al menos 1 cuota");
            return;
        }

        for(let i = 0; i<selected.length;i++)
        {
            values.push(selected[i].value);
        }

        const options = {
            method: "POST",
            headers: {
            "Content-Type": "application/json",
            },
            body: JSON.stringify({
                cuotas: values,
            }),
        };

        fetch(`/api/regenerar-txt-masive`, options)
            .then((response) => response.json())
            .then(
                async (result) => {
                    console.log(result);
                },
                (error) => {
                    console.log(error);
                }
            );
    }
</script>

@endsection

@push("bottom")

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.9/dist/css/bootstrap-select.min.css">

<!-- Latest compiled and minified JavaScript -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.9/dist/js/bootstrap-select.min.js"></script>


<!-- (Optional) Latest compiled and minified JavaScript translation files -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.9/dist/js/i18n/defaults-*.min.js"></script>
<style>
        .dropdown.bootstrap-select{
          margin-bottom: 10px;
          width: 100% !important;
        }

        .bootstrap-select .dropdown-menu {
            width: 100% !important;
            min-width: 100% !important;
        }

        .btn.dropdown-toggle.btn-default{
          padding: 4px 12px;
          background: white;
        }

        .modal-footer {
            padding-bottom: 0;
            border-top-color: #f4f4f4;
        }
        .fecha {
            width: 100%;
            padding: 4px;
            border-radius: 3px;
            border: 1px solid #dddddd;
        }

        .modal-footer {
            padding-bottom: 15px;
        }

      </style>
<script>
    $('.fecha').datepicker( {
        format: "dd-mm-yyyy",
        locale: "es",
        language: "es"
    }).on("changeDate", function(e){
        $(this).datepicker("hide");
    });

    $(function(){

        @if(isset($_REQUEST['seller_report']))
            $('a[title="Editar"]').attr('target', '_blank');
        @endif

        setTimeout(function(){
            $('.bs-select-all').html('Marcar todos');
            $('.bs-deselect-all').html('Desmarcar todos');
        }, 500);



        $('#table_dashboard input[type=checkbox]').click(function(){
            var cantidad = $('#table_dashboard input[type=checkbox]:checked').length;
            if(cantidad > 0){
                $('#cant_seleccionados_chk').html( $('#table_dashboard input[type=checkbox]:checked').length  );
                $('#cant_seleccionados_chk').parent().show();
                $('#bulk_actions').show();
            }
            else
            {
                $('#cant_seleccionados_chk').html( $('#table_dashboard input[type=checkbox]:checked').length  );
                $('#cant_seleccionados_chk').parent().hide();
                $('#bulk_actions').hide();
            }
        })
    })



</script>
@endpush