@extends('template.layoutAdmin', ['activeButton'=>'inventario'])

@section('style')
  <style media="screen">
  .pagination{
    display:inline-block;
    padding-left:0;
    margin: 10px 0 -10px 0;
  }
  .pagination>li{
    display:inline
  }
  .pagination li a,.pagination li span{
    position:relative;
    float:left;
    padding:6px 12px;
    margin: 0 -1px 0 -1px;
    line-height:1.42857143;
    color:#337ab7;
    text-decoration:none;
    background-color:#fff;
    border:1px solid #ddd
  }
  .pagination li:first-child a,.pagination li:first-child span{
    margin-left:0;
    border-top-left-radius:4px;
    border-bottom-left-radius:4px
  }
  .pagination li:last-child a,.pagination li:last-child span{
    border-top-right-radius:4px;
    border-bottom-right-radius:4px
  }
  .pagination li a:focus,.pagination li a:hover,.pagination li span:focus,.pagination li span:hover{
    z-index:2;
    color:#23527c;
    background-color:#eee!important;
    border-color:#eee;
  }
  .pagination>.active>a,.pagination>.active>a:focus,.pagination>.active>a:hover,.pagination>.active>span,.pagination>.active>span:focus,.pagination>.active>span:hover{
    z-index:3;
    color:#fff;
    cursor:default;
    background-color:#337ab7!important;
    border-color:#337ab7;
  }
  .pagination>.disabled>a,.pagination>.disabled>a:focus,.pagination>.disabled>a:hover,.pagination>.disabled>span,.pagination>.disabled>span:focus,.pagination>.disabled>span:hover{
    color:#777;
    cursor:not-allowed;
    background-color:#fff;
    border-color:#ddd
  }
  .pagination-lg li a,.pagination-lg li span{
    padding:10px 16px;
    font-size:18px;
    line-height:1.3333333
  }
  .pagination-lg li:first-child>a,.pagination-lg li:first-child span{
    border-top-left-radius:6px;
    border-bottom-left-radius:6px
  }
  .pagination-lg li:last-child a,.pagination-lg li:last-child span{
    border-top-right-radius:6px;
    border-bottom-right-radius:6px
  }
  </style>
@endsection

@section('title')
    {{  trans('proveedor.tituloProveedor') }}
@endsection

@section('cabecera')
    <h1>
        {{ trans('proveedor.tituloProveedor') }}
        <small>{{ trans('proveedor.mensajeAyuda') }}</small>
    </h1>
@endsection

@section('contenido')
    <div class="row">
        <div class="col-12">
            @if(Session::has('message'))
                <div class="alert alert-success alert-dismissible" role="alert">
                    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    😉 {{Session::get('message')}} 😉
                </div>
            @endif
            @if(Session::has('message_error'))
                <div class="alert alert-danger alert-dismissible" role="alert">
                    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    😓 {{Session::get('message_error')}} 😒
                </div>
            @endif
        </div>
        <div class="col-12">
            <div class="box">
                <div class="box-header with-border">
                    <div class="row">
                        <div class="col-md-6">
                            <h3 class="box-title"> {{  trans('proveedor.tituloProveedor') }} </h3>
                        </div>
                        <div class="col-md-6 text-right">
                            {{---
                                <a class="btn btn-info" data-toggle="collapse" href="#collapseExample" role="button" aria-expanded="false" aria-controls="collapseExample">
                                <i class="fa fa-filter" aria-hidden="true"></i>
                            </a>
                                --}}
                            <button class="btn btn-info" type="button" data-toggle="modal" data-target="#AgregarProv">
                                <i class="fa fa-plus"></i>
                            </button>
                        </div>
                    </div>
                </div>
                <div class="box-body">
                    <div class="col-12">
                        <div class="collapse" id="collapseExample">
                            <div class="card card-body">
                                <form action="" method="get">
                                    <div class="row">
                                        <div class="col-2"></div>
                                        <div class="col-4">
                                            <div class="form-group">
                                                <label for="fechaInicio"> {{  trans('proveedor.fechaInicio') }} </label>
                                                <input type="text"
                                                    name="fechaInicio"
                                                    class="form-control"
                                                    id="fechaInicio"
                                                    autocomplete="off"
                                                    placeholder=" {{  trans('proveedor.rangoFecha') }} ">
                                            </div>
                                        </div>
                                        <div class="col-4">
                                          <div class="form-group">
                                              <label for="fechaFinal"> {{  trans('proveedor.fechaFinal') }}	</label>
                                              <input type="text"
                                                  name="fechaFinal"
                                                  class="form-control"
                                                  id="fechaFinal"
                                                  autocomplete="off"
                                                  placeholder="Rango de fecha">
                                          </div>
                                        </div>
                                        <div class="col-2"></div>
                                    </div>
                                    <div class="row">
                                        <div class="col-2"></div>
                                        <div class="col-4">
                                            <div class="form-group">
                                                <label for="nombre"> {{  trans('proveedor.nombre') }} </label>
                                                <input type="text"
                                                    name="nombre"
                                                    class="form-control"
                                                    autocomplete="off"
                                                    placeholder=" {{  trans('proveedor.nombre') }} ">
                                            </div>
                                        </div>
                                        <div class="col-4">
                                            <div class="form-group">
                                                <label for="idTipoT"> {{  trans('proveedor.tipoPedido') }} </label>
                                                <select name="idTipoT" id="idTipoT"  class="form-control">
                                                    <option value=""> {{  trans('proveedor.seleccionar') }} </option>
                                                    {{-- @foreach($tipoPedidos as $tipoPedido)
                                                      <option value="{{$tipoPedido->idValorParametro}}">{{$tipoPedido->nombre}}</option>
                                                    @endforeach --}}
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-2"></div>
                                    </div>
                                    <div class="row">
                                        <div class="col-12 text-center">
                                            <input type="submit" class="btn btn-info btn-sm" value="Buscar">
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                    <table class="table table-bordered table-responsive" id="tbActualizar">
                        <thead>
                          <tr>
                            {{-- <th class="text-center">ID</th> --}}
                            @if (env('MULTISERVER') == "CO")
                                <th class="text-center"> {{  trans('proveedor.nit') }} </th>
                            @else
                                <th class="text-center"> {{  trans('proveedor.nit') }}</th>
                            @endif
                            <th class="text-center"> {{  trans('proveedor.nombreProveedor') }} </th>
                            <th class="text-center"> {{  trans('proveedor.direccion') }} </th>
                            <th class="text-center"> {{  trans('proveedor.celular') }} </th>
                            <th class="text-center"> {{  trans('proveedor.correo') }} </th>
                            <th class="text-center"> {{  trans('proveedor.estado') }} </th>
                            <th class="text-center"> {{  trans('proveedor.opciones') }} </th>
                          </tr>
                        </thead>
                        <tbody>
                            @foreach ($provedores as $item)
                                <tr>
                                    <td class="text-center">{{$item->numero_de_identificacion}}</td>
                                    <td class="text-center">{{$item->nombre}}</td>
                                    <td class="text-center">{{$item->direccion}}</td>
                                    <td class="text-center">+{{$item->codigo_pais}} {{$item->celular}}</td>
                                    <td class="text-center">{{$item->correo}}</td>
                                    <td class="text-center">
                                        @if ($item->state == 1)
                                        <span class="badge" style="background:green" onclick="cambiarEstado({{$item->idProovedor}},1)"> {{  trans('proveedor.activo') }} </span>
                                        @elseif($item->state == 2)
                                        <span class="badge" style="background:yellow" onclick="cambiarEstado({{$item->idProovedor}},2)"> {{  trans('proveedor.inactivo') }} </span>
                                        @endif
                                        </td>
                                    <td class="text-center"> <button class="btn btn-info btn-sm" data-toggle="modal" data-target="#editarProv" onclick="abrirEditar({{$item->idProovedor}})"><i class="fa fa-eye"></i></button> </td>
                                </tr>
                            @endforeach

                        </tbody>
                    </table>
                </div>


            </div>
        </div>
    </div>
<x-proveedor.modal-agregar-proveedor :data-pais="$dataPais" :valor-parametro="$valorParametro" ></x-proveedor.modal-agregar-proveedor>
<x-proveedor.modal-editar-proveedor :data-pais="$dataPais" :valor-parametro="$valorParametro" ></x-proveedor.modal-editar-proveedor>

@endsection

@section('js')
  <script type="text/javascript">
        function numero(valor) {
            var expresion = /^\d*[\.]?[\d]*$/;
            var resultado = expresion.test(valor);
            if(!resultado) {
                swal("Info!", " {{  trans('planes.campoNumerico') }} ", "info");
                $("#valor").val("");
            }
        }

    $( document ).ready(function() {
      $( "#fechaInicio" ).datepicker({format: 'dd/mm/yyyy'});
      //$("#fechaInicio").datepicker
      $( "#fechaFinal" ).datepicker({format: 'dd/mm/yyyy'});
    });
    var idEditar=0;

    function cambiarEstado(idInventario,state){
        var data={
            'idProovedor':idInventario,
            'state':state
        }
        var host="{{$_SERVER["HTTP_HOST"]}}";
        $.ajax({
                url: UrlHost_+"/administrator/proovedor/cambiarEstado",
                data: data,
                type: 'post',
                dataType: 'json',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                beforeSend:function(){
                    swal({
                            title: " {{  trans('proveedor.cargando') }} ",
                            text: " {{  trans('proveedor.yaActualizado') }} ",
                            showConfirmButton: false
                        });
                },
                success:function(response){
                    if(response.code==200){
                        swal.close();
                        $("#tbActualizar").load(location.href+" #tbActualizar>*","");
                        ;
                    }else{
                        swal({
                            title: "Error",
                            text: " {{  trans('proveedor.errorActualizar') }} ",
                            showConfirmButton: false
                        });
                    }
                }
        });


    }
    function Ingresar(){
        let form = document.getElementById('formCreateProveedor');

        const nombreProv=form.elements['nombreProv'].value;
        const nit=form.elements['nit'].value;
        const direccion=form.elements['Direccion'].value;
        const celular = form.elements['celular'].value;
        const codigo_pais = form.elements['codigo_pais'].value;
        const correo = form.elements['correo'].value;
        const tipoIdentificacion = form.elements['tipoIdentificacion'].value;
        const razon_social = form.elements['razonsocial'].value;
        const nombre_comercial = form.elements['nombrecomercial'].value;
        if (nombreProv.trim().length==0 || nit.trim().length==0){
            swal({
                      title: " {{  trans('proveedor.camposVacios') }} ",
                      text: " {{  trans('proveedor.ingresarCampos') }} ",
                      showConfirmButton: true
                });
        }else{
            if(nit.length>13){
                swal({
                      title: " {{  trans('proveedor.numeroCelular') }}",
                      text: " {{  trans('proveedor.numeroMalIngresado') }}",
                      showConfirmButton: true
                });

            }else{

                var data = {
                        nombreProvedor: nombreProv,
                        nitProvedor: nit,
                        direccionProvedor:direccion,
                        celularProvedor:celular,
                        codigo_pais:codigo_pais,
                        correoProvedor:correo,
                        tipoIdentificacion: tipoIdentificacion,
                        razon_social: razon_social,
                        nombre_comercial: nombre_comercial
                    }

                var host = "{{ $_SERVER['HTTP_HOST'] }}";
                $.ajax({
                    url: UrlHost_ + "/administrator/proovedor/crear",
                    data: data,
                    type: 'post',
                    dataType: 'json',
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },
                    beforeSend: function() {
                        swal({
                            title: " {{  trans('proveedor.cargando') }} ",
                            text: " {{  trans('proveedor.agregandoProveedor') }} ",
                            showConfirmButton: false
                        });
                    },
                    success: function(response) {
                        
                        if (response.code == 200) {
                            swal({
                                title: "proveedor Creado",
                                text: " {{  trans('proveedor.proveedorCreadoCorrectamente') }} ",
                                showConfirmButton: true
                            });

                            swal("Éxito", "Se ha creado correctamente el proveedor", "success");
                            location.replace(location.href)
                        } else {
                            swal({
                                title: "Error",
                                text: " {{  trans('proveedor.errorServidor') }}	",
                                showConfirmButton: true
                            });
                        }

                    }

                });
            }
        }
    }

    function cerrarIngresar(){
        document.getElementById('nombreProv').value="";
        document.getElementById('nit').value="";
        document.getElementById('Direccion').value="";
        document.getElementById('celular').value="";
        document.getElementById('correo').value="";
    }


function removeOptions(selectElement) {
   var i, L = selectElement.options.length - 1;
   for(i = L; i >= 0; i--) {
      selectElement.remove(i);
   }
}



    function abrirEditar(idInventario2){
        var idInventario={
            'idProovedor':idInventario2
        }
        var host = "{{$_SERVER["HTTP_HOST"]}}";
        $.ajax({
            url: UrlHost_+"/administrator/proovedor/editar",
                data: idInventario,
                type: 'get',
                dataType: 'json',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                 },
                 beforeSend:function(){
                    swal({
                        title: " {{  trans('proveedor.cargando') }} ",
                        text: " {{  trans('proveedor.editandoProveedor') }} ",
                        showConfirmButton: false
                    });
                 },
                 success:function(response){

                     if(response.code==200){
                        let form = document.getElementById('formEditProveedor');
                        form.elements['nombreProv'].value = response.data.nombre;
                        form.elements['nit'].value = response.data.numero_de_identificacion;
                        form.elements['Direccion'].value = response.data.direccion;
                        form.elements['celular'].value = response.data.celular;
                        form.elements['correo'].value = response.data.correo;
                        form.elements['codigo_pais'].value = response.data.correo;
                        form.elements['razonsocial'].value = response.data.razon_social;
                        form.elements['nombrecomercial'].value = response.data.nombre_comercial;
                        removeOptions(form.elements['codigo_pais']);
                        response.paises.forEach(element => {
                            if(response.data.codigo_pais == element.codigo)
                            {
                                form.elements['codigo_pais'].add(new Option(element.codigo, element.codigo));
                            }else{
                                form.elements['codigo_pais'].add(new Option(element.codigo, element.codigo));
                            }
                        });
                        swal.close();

                        idEditar=idInventario2;

                     }

                 }


            });

    }

    function cerrarEditar(){
        idEditar=0;
        document.getElementById('nombreProv').value="";
        document.getElementById('nit').value="";
        document.getElementById('Direccion').value="";
        document.getElementById('celular').value="";
        document.getElementById('correo').value="";
        $('#editarProv').modal('hide');
    }

    function Editar(){

        form = document.getElementById('formEditProveedor');

        const nombreProv=form.elements['nombreProv'].value;
        const nit=form.elements['nit'].value;
        const direccion=form.elements['Direccion'].value;
        const celular = form.elements['celular'].value;
        const codigo_pais = form.elements['codigo_pais'].value;
        const correo = form.elements['correo'].value;
        const tipoIdentificacion = form.elements['tipoIdentificacion'].value;
        const razon_social = form.elements['razonsocial'].value;
        const nombre_comercial = form.elements['nombrecomercial'].value;


        if (nombreProv.trim().length==0 || nit.trim().length==0){
            swal({
                      title: " {{  trans('proveedor.camposVacios') }} ",
                      text: " {{  trans('proveedor.ingresarCampos') }} ",
                      showConfirmButton: true
                });
        }else{
            var data1 = {
                idEditar:idEditar,
                nombreProvedor: nombreProv,
                nitProvedor: nit,
                direccionProvedor:direccion,
                celularProvedor:celular,
                codigo_pais:codigo_pais,
                correoProvedor:correo,
                tipoIdentificacion: tipoIdentificacion,
                razon_social: razon_social,
                nombre_comercial: nombre_comercial
            }
            var host = "{{ $_SERVER['HTTP_HOST'] }}";
            $.ajax({
                url: UrlHost_ + "/administrator/proovedor/editar/put",
                data: data1,
                type: 'post',
                dataType: 'json',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                beforeSend: function() {
                    swal({
                        title: " {{  trans('proveedor.cargando') }}	",
                        text: " {{  trans('proveedor.editandoProveedor') }}	",
                        showConfirmButton: false
                    });
                },
                success: function(response) {
                    if (response.code == 200) {
                        swal({
                            title: "proveedor Editado",
                            text: " {{  trans('proveedor.proveedorEditadoCorrectamente') }} ",
                            showConfirmButton: false
                            });
                            location.replace(location.href)
                    } else {
                        swal({
                            title: "Error",
                            text: " {{  trans('proveedor.errorServidor') }}	",
                            showConfirmButton: true
                        });

                    }

                }
            });
        }
    }

  </script>
@endsection