@extends('layouts.app')

@section('content')

<div class="page-content-wrapper">
    <div class="page-content">
        <div class="page-bar">
            <div class="page-title-breadcrumb">
                <!--<div class="pull-left">
                    <div class="page-title text-danger">Sin Sucursal</div>
                </div>-->
                <ol class="breadcrumb page-breadcrumb pull-right">
                    <li><i class="fa fa-home"></i>&nbsp;<a class="parent-item"
                            href="{{ url('/dashboard') }}">Inicio</a>&nbsp;<i class="fa fa-angle-right"></i>
                    </li>
                    <li class="active">Pago Código # {{ $data->contrato_codigo }}</li>
                </ol>
            </div>
        </div>

        <div class="row">

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

                <p>
                    <a onclick="alert('falta implementar')" class="btn btn-primary" title="Imprimir" target="_blank" aria-label="Imprimir" ><i class="fa fa-print"></i> Imprimir</a>        
                    <a class="btn btn-info" href="{{ url('imprimir-ticket-asociaciones/' . $data->pago_id) }}" title="Imprimir" target="_blank" aria-label="Imprimir" ><i class="fa fa-list"></i> Imprimir Ticket</a>       
                     <button class="btn btn-danger" onclick="confirm_anular()"><i class="fa fa-ban"></i> Anular</button>        
                     {{-- <a  href="{{ url('pagos/oficina/caja/activa') }}" onclick=" window.history.back()"><i class="fa fa-chevron-left"></i> Volver</a> --}}    
                     <a href="{{ url('pagos/debito_automatico/pago/manual') }}" class="btn btn-warning">Volver atrás</a>
                </p>
                
                <h2 class="text-center">
                    Pago Código {{ $data->contrato_codigo }}
                </h2>

                <input type="hidden" id="pago_id" value = "{{ $data->id }}">
                <table id="w3" class="table table-striped table-bordered detail-view">
                    <tbody>
                        <tr>
                            <th>Consecutivo</th>
                            <td>{{ $data->consecutivo }}</td>
                        </tr>
                        <tr>
                            <th>Cliente</th>
                            <td>{{ $data->cliente }}</td>
                        </tr>
                        <tr>
                            <th>Contrato</th>
                            <td>{{ $data->contrato_codigo }}</td>
                        </tr>
                        <tr>
                            <th>Servicio</th>
                            <td>{{ $data->servicio }}</td>
                        </tr>
                        <tr>
                            <th>Observaciones</th>
                            <td>{{ $data->observaciones }}</td>
                        </tr>
                        <tr>
                            <th>Valor</th>
                            <td>₡ {{ $data->valor_pago }}</td>
                        </tr>
                        <tr>
                            <th>Fecha de Pago</th>
                            <td>{{ date('d/m/Y H:i', strtotime($data->fecha_pago)) }}</td>
                        </tr>
                        <tr>
                            <th>Creado por</th>
                            <td>{{ $data->creado_por }}</td>
                        </tr>
                        <tr>
                            <th>Fecha Creacion</th>
                            <td>{{ date('d/m/Y H:i', strtotime($data->fecha_creacion_pago)) }}</td>
                        </tr>
                        <tr>
                            <th>Estado</th>
                            @if ($data->estado == 1)
                                <td><span class="label label-danger">Por Pagar</span></td>
                                
                            @elseif($data->estado == 2)
                                <td><span class="label label-success">Pagado</span></td>
                            @elseif($data->estado == 3)
                                <td><span class="label label-warning">pago Parcial</span></td>
                            @else 
                                <td><span class="label label-success">Anulado</span></td>
                            @endif
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>

    </div>
</div>

@endsection


@section('script')

<script>

   

    function confirm_anular() {
        let id = $("#pago_id").val();

        Swal.fire({
            title: "¿Estás seguro?",
            text: "¿Desea anular el pago?",
           
            icon: 'question',
            showLoaderOnConfirm: true,
            showCancelButton: true,
            confirmButtonText: `<i class="fa fa-check"></i> De Acuerdo`,
            cancelButtonText: '<i class="fa fa-ban"></i> Cancelar',
            confirmButtonColor: '#3085d6'
        }).then((result) => {
            /* Read more about isConfirmed, isDenied below */
            if (result.isConfirmed) {

                $.ajax({
                    type: "POST",
                    url: "{{ url('pagos/oficina/caja/activa/anular') }}" + '/' + id,
                    data: {
                        "_token": "{{ csrf_token() }}",
                     
                    },
                    success: function(res) {
                        console.log(res)
                        if (res) {
                            Swal.fire({
                                title: 'Exito!',
                                text: "Se anuló el pago satisfactoriamente.",
                                icon: 'success',
                                showCancelButton: false,
                                confirmButtonColor: '#3085d6'
                            }).then((result) => {
                                // Reload the Page
                                window.location.href = "{{ url('pagos/oficina/caja/activa') }}";
                            });
                        }
                    },
                    dataType: "json"
                });

            }
        });
    }

</script>
@endsection