@extends('template.layoutAdmin', ['activeButton'=>'pagos'])
@section('title')
    {{  trans('propinas.tituloPropinas') }}
@endsection
@section('cabecera')
    
    <h1> {{ trans('propinas.tituloPropinas')}}
        <small>{{ trans('propinas.mensajeAyuda') }}</small>
       
    </h1>
@endsection

@section('contenido')

    <div class="row">
        @sidebar('propina.store')
            <div class="col-md-5">
                <div class="box">
                    <div class="box-body">
                        <form id="createCat">
                        <div class="row">
                            <div class="col-md-12">
                                <div class="form-group">
                                    <label for="valorPropina"> {{  trans('propinas.valorPropina') }} </label>
                                    <input type="text" autocomplete="off" id="valorPropinaEdit" placeholder=" {{  trans('propinas.valorPropinaPlace') }} " class="form-control">
                                </div>
                            </div>
                            <br/>
                            <div class="col-md-12">
                                <div class="form-group">
                                    <label for="estadoPro"> {{  trans('propinas.estado') }} </label>
                                    <select class="form-control" id="estadoPro" name="estadoPro">
                                        <option value="1"> {{  trans('propinas.activo') }} </option>
                                        <option value="0"> {{  trans('propinas.inactivo') }} </option>
                                    </select>
                                </div>
                            </div>
                            <br/>
                            <div class="col-md-12 text-center">
                                <a href="#" class="btn btn-info" onclick="guardarPropina()" > {{  trans('propinas.guardarPropina') }} </a>
                            </div>
                        </div>
                        </form>
                    </div>
                </div>
            </div>
        @endsidebar
        <div class="col-md-7">
            <div class="box">
                <div class="box-header with-border">
                    <div class="row">
                        <div class="col-md-7 text-left">
                            <h3> {{  trans('propinas.listaPropinas') }} </h3>
                        </div>
                        <div class="col-5">
                            <form method="get">
                            <div class="input-group">
                              <input type="text" value="{{$search}}" autocomplete="off" id="search" name="search" class="form-control" placeholder=" {{  trans('propinas.buscarPropina') }} ">
                              <span class="input-group-btn">
                                @if(!empty($search))
                                    <input type="submit" class="btn btn-default" value=" {{  trans('propinas.buscar') }} ">
                                    <a href="{{route('propina')}}" class="btn btn-sm btn-danger"><i class="fa fa-trash"></i></a>
                                @else
                                    <input type="submit" class="btn btn-default" value=" {{  trans('propinas.buscar') }} ">
                                @endif
                              </span>
                            </div>
                            </form>
                        </div>
                    </div>
                </div>
                <div class="box-body">
                    <table class="table table-bordered table-responsive" id="tbActualizar">
                        <thead>
                            <tr>
                                <th>#</th>
                                <th> {{  trans('propinas.nombre') }} </th>
                                <th> {{  trans('propinas.estado') }} </th>
                            </tr>
                        </thead>
                        <tbody>
                            @php
                                $ID = 1;
                            @endphp
                            @foreach ($data as $item)
                                <tr>
                                    <td>{{$ID}}</td>
                                    <td id="name"><a href="javascript:;" onclick="editarCat({{$item->idPropina}})" >{{$item->valor}} %</a></td>
                                    @if ($item->idEstado == 1)
                                        <td><span class="badge badge-success"  ><a href="javascript:;" onclick="actualizarEstado(0,{{$item->idPropina}})" style="color: #fff;font-size: 12px;"> {{  trans('propinas.activo') }}	</a></span></td>
                                    @else
                                        <td><span class="badge badge-danger" ><a href="javascript:;" onclick="actualizarEstado(1,{{$item->idPropina}})" style="color: #fff;font-size: 12px;"> {{  trans('propinas.inactivo') }} </a></span></td>
                                    @endif
                                </tr>
                                @php
                                    $ID++;
                                @endphp
                            @endforeach

                        </tbody>
                    </table>
                </div>
                {{ $data->links() }}
            </div>
        </div>
    </div>
    <div class="modal fade" id="editarPropina" tabindex="-1" role="dialog" aria-labelledby="editarPropinaLabel" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="editarPropinaLabel"></h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <form id="editCat">
                        <div class="row">
                            <div class="col-md-12">
                                <div class="form-group">
                                    <label for="valorPropinaEdit"> {{  trans('propinas.valorPropina') }} </label>
                                    <input type="text" name="valorPropinaEdit" id="valorPropinaEdit" placeholder="V {{  trans('propinas.valorPropinaPlace') }}" class="form-control">
                                    <input type="hidden" id="idPropina">
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer text-center">
                    <button type="button" class="btn btn-info" data-dismiss="modal"> {{  trans('propinas.cerrar') }} </button>
                    <button type="button" onclick="actualizarPro()" class="btn btn-info"> {{  trans('propinas.actualizar') }} </button>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('js')
    <script type="text/javascript">
        $('#valorPropinaEdit').on('input', function () {
            this.value = this.value.replace(/[^0-9,.]/g, '').replace(/,/g, '.');
        });
    </script>
    <script>
        function guardarPropina()
        {

            var host = "{{$_SERVER["HTTP_HOST"]}}";
            var data = {
                "valorPropina": $("#valorPropinaEdit").val(),
                "estadoPro": $("#estadoPro").val(),
            }
            $.ajax({
                url: UrlHost_+"/administrator/propina/post",
                data: data,
                type: 'post',
                dataType: 'json',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                beforeSend: function () {
                    swal({
                        title: " {{  trans('propinas.cargando') }} ",
                        text: " {{  trans('propinas.espereUnMomento') }} ",
                        showConfirmButton: false
                    });
                },
                success: function(response){
                    if (response.estado == 1) {
                        swal.close();
                        $("#createCat")[0].reset();
                        $("#tbActualizar").load(location.href+" #tbActualizar>*","");
                    }else if(response.estado == 3){
                        swal("Error!", "Debe enviar un valor", "info");
                    }
                },
                error: function(xhr){
                    swal("Error!", " {{  trans('propinas.errorMessage') }} ", "error");
                }
            });
        }
        function editarCat(item)
        {
            var host = "{{$_SERVER["HTTP_HOST"]}}";
            var data = {
                "idPropina": item,
            }
            $.ajax({
                url: UrlHost_+"/administrator/propina/editar",
                data: data,
                type: 'post',
                dataType: 'json',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                beforeSend: function () {
                    swal({
                        title: " {{  trans('propinas.cargando') }} ",
                        text: " {{  trans('propinas.espereUnMomento') }} ",
                        showConfirmButton: false
                    });
                    $("#editCat")[0].reset();
                },
                success: function(response){
                    if (response.code == 200) {
                        $("#editarPropina").modal('show');
                        $("#editarPropinaLabel").text("Editar");
                        $("input[name*='valorPropinaEdit']").val(response.datos.valor);
                        $("#idPropina").val(item);
                    }
                   swal.close();
                },
                error: function(xhr){
                    swal("Error!", " {{  trans('propinas.errorMessage') }} ", "error");
                }
            });
        }

        function actualizarPro()
        {
            var host = "{{$_SERVER["HTTP_HOST"]}}";
            var data = {
                "valorPropinaEdit": $("input[name*='valorPropinaEdit']").val(),
                "idPropina": $("#idPropina").val(),
            }
            $.ajax({
                url: UrlHost_+"/administrator/propina/editarPost",
                data: data,
                type: 'post',
                dataType: 'json',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                beforeSend: function () {
                    swal({
                        title: " {{  trans('propinas.cargando') }} ",
                        text: " {{  trans('propinas.espereUnMomento') }} ",
                        showConfirmButton: false
                    });
                },
                success: function(response){
                    if (response.code == 200) {
                        swal.close();
                        $("#editarPropina").modal('hide');
                        $("#tbActualizar").load(location.href+" #tbActualizar>*","");
                    }else{
                        swal("Info!", response.message, "info");
                    }
                },
                error: function(xhr){
                    swal("Error!", " {{  trans('propinas.errorMessage') }} ", "error");
                }
            });
        }

        function actualizarEstado(estado,idPropina)
        {
            var host = "{{$_SERVER["HTTP_HOST"]}}";
            var data = {
                "estado": estado,
                "idPropina": idPropina
            }
            $.ajax({
                url: UrlHost_+"/administrator/propina/actualizarEstado",
                data: data,
                type: 'post',
                dataType: 'json',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                beforeSend: function () {
                    swal({
                        title: " {{  trans('propinas.cargando') }} ",
                        text: " {{  trans('propinas.espereUnMomento') }} ",
                        showConfirmButton: false
                    });
                },
                success: function(response){
                    if (response.code == 200) {
                        swal.close();
                        $("#tbActualizar").load(location.href+" #tbActualizar>*","");
                    }
                },
                error: function(xhr){
                    swal("Error!", " {{  trans('propinas.errorMessage') }} ", "error");
                }
            });
        }
    </script>
@endsection