@extends('layout')

@section('content')
<nav class="breadcrumb">
    <a class="breadcrumb-item" href="/">Home</a>
    <a class="breadcrumb-item" href="/cierres">Cierres de caja</a>
    <span class="breadcrumb-item active">{{ $datos->tienda->nombre.' - '.\Carbon\Carbon::parse($datos->fecha)->format('d/m/Y') }}</span>
</nav>

<header class="content__title">
    <h1>Detalle del cierre de caja</h1>
    <small>{{ $datos->tienda->nombre.' - '.\Carbon\Carbon::parse($datos->fecha)->format('d/m/Y') }}</small>
    @if(Auth::user()->hasRole('admin'))
    <div class="actions">
        <a href="#" class="actions__item zmdi zmdi-delete eliminar-cierre text-danger" data-id="" data-toggle="tooltip" data-original-title="Eliminar"></a>
        {{-- <a href="{{ url('cierres/editar/'.$datos->id) }}" class="actions__item zmdi zmdi-edit" data-id="" data-toggle="tooltip" data-original-title="Editar"></a> --}}
    </div>
    @endif
</header>

<div class="row">
    <div class="col-lg-6">
        <form action="/cierres/subir-comprobante" method="post" enctype="multipart/form-data">
            @csrf
            <input type="hidden" name="id" value="{{ $datos->id }}">
            <input type="hidden" name="tipo" value="retiro">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title">Comprobante de Retiro</h4>
                </div>
                <div class="card-body">
                    <div class="form-group label-floating archivo-input mb-0">
                        <div class="file-loading">
                            <input name="file" class="fileinput" required type="file">
                        </div>
                        <div class="file-errors"></div>
                    </div>
                </div>
                <div class="card-footer">
                    <div class="text-right">
                        @if($datos->comprobante_retiro)
                        <a href="/eliminar-comprobante/{{ $datos->id }}/retiro" class="btn btn-danger"><i class="zmdi zmdi-delete zmdi-hc-lg"></i>&nbsp; Eliminar</a>
                        <a href="/descargar-comprobante/{{ $datos->id }}/retiro" class="btn btn-success"><i class="zmdi zmdi-download zmdi-hc-lg"></i>&nbsp; Descargar</a>
                        <button type="submit" class="btn btn-primary btn--raised"><i class="zmdi zmdi-upload"></i>&nbsp; Resubir</button>
                        @else
                        <button type="submit" class="btn btn-primary btn--raised"><i class="zmdi zmdi-upload"></i>&nbsp; Subir</button>
                        @endif
                    </div>
                </div>
            </div>
        </form>
    </div>
    <div class="col-lg-6">
        <form action="/cierres/subir-comprobante" method="post" enctype="multipart/form-data">
            @csrf
            <input type="hidden" name="id" value="{{ $datos->id }}">
            <input type="hidden" name="tipo" value="transbank">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title">Comprobante de Transbank</h4>
                </div>
                <div class="card-body">
                    <div class="form-group label-floating archivo-input mb-0">
                        <div class="file-loading">
                            <input name="file" class="fileinput" required type="file">
                        </div>
                        <div class="file-errors"></div>
                    </div>
                </div>
                <div class="card-footer">
                    <div class="text-right">
                        @if($datos->comprobante_transbank)
                        <a href="/eliminar-comprobante/{{ $datos->id }}/transbank" class="btn btn-danger"><i class="zmdi zmdi-delete zmdi-hc-lg"></i>&nbsp; Eliminar</a>
                        <a href="/descargar-comprobante/{{ $datos->id }}/transbank" class="btn btn-success"><i class="zmdi zmdi-download zmdi-hc-lg"></i>&nbsp; Descargar</a>
                        <button type="submit" class="btn btn-primary btn--raised"><i class="zmdi zmdi-upload"></i>&nbsp; Resubir</button>
                        @else
                        <button type="submit" class="btn btn-primary btn--raised"><i class="zmdi zmdi-upload"></i>&nbsp; Subir</button>
                        @endif
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>

<div class="row">
    <div class="col-lg-6 order-lg-last">
        <div class="card">
            <div class="card-header">
                <h4 class="card-title">Totales cálculados</h4>
            </div>
            <div class="card-body p-0 pt-1">
                <table class="table table-hover mb-0">
                    <thead>
                        <tr class="table-active">
                            <th width="50%">Forma de pago</th>
                            <th class="text-right">Confirmar</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <th class="table-active">Efectivo ({{ $cantidad['efectivo'] }})</th>
                            <td class="text-right lead">${{ number_format($datos->efectivo,0,'.','.') }}</td>
                        </tr>
                        <tr>
                            <th class="table-active">Tarjeta ({{ $cantidad['tarjeta'] }})</th>
                            <td class="text-right lead">${{ number_format($datos->tarjeta,0,'.','.') }}</td>
                        </tr>
                        <tr>
                            <th class="table-active">Transferencia ({{ $cantidad['transferencia'] }})</th>
                            <td class="text-right lead">${{ number_format($datos->transferencias,0,'.','.') }}</td>
                        </tr>
                        <tr style="border-bottom:2px solid #e3e7eb">
                            <th class="table-active">TOTAL VENTAS</th>
                            @php
                            $total = $datos->efectivo + $datos->tarjeta + $datos->transferencias
                            @endphp
                            <td class="text-right lead font-weight-bold">${{ number_format($total,0,'.','.') }}</td>
                        </tr>
                        <tr>
                            <th class="table-active">Saldo inicial</th>
                            <td class="text-right lead text-info" id="monto-saldo-inicial" data-monto="{{ $datos->saldo_inicial }}">${{ number_format($datos->saldo_inicial,0,'.','.') }}</td>
                        </tr>
                        <tr>
                            <th class="table-active">Gasto</th>
                            <td class="text-right lead text-red" id="monto-gastos">- ${{ number_format($datos->gastos,0,'.','.') }}</td>
                        </tr>
                        <tr style="border-bottom:2px solid #e3e7eb">
                            <th class="table-active">
                                SALDO CAJA CALCULADO<br>
                                <small>(Saldo inicial + efectivo - Gastos)</small>
                            </th>
                            @php
                                $saldo_calculado = $datos->efectivo + $datos->saldo_inicial - $datos->gastos;
                            @endphp
                            <td class="text-right lead font-weight-bold @if($saldo_calculado > 0) text-success @else text-danger @endif" id="saldo-caja">${{ number_format($saldo_calculado,0,'.','.') }}</td>
                        </tr>
                        <tr>
                            <th class="table-active">SALDO CAJA REAL</th>
                            <td class="text-right text-info">
                                <span class="lead">
                                    ${{ number_format($datos->saldo_real,0,'.','.') }}
                                </span>
                                @php
                                    $resto = $datos->saldo_inicial + $datos->efectivo - $datos->gastos - $datos->saldo_real;
                                @endphp
                                @if($resto < 0)
                                <br>
                                <small class="badge badge-success">Saldo a favor: ${{ number_format(abs($resto),0,'.','.') }}</small>
                                @elseif($resto > 0)
                                <br>
                                <small class="badge badge-danger">Saldo en contra: ${{ number_format(abs($resto),0,'.','.') }}</small>
                                @endif
                            </td>
                        </tr>
                        <tr style="border-bottom:2px solid #e3e7eb">
                            <th class="table-active">RETIRO</th>
                            <td class="text-right lead text-info">${{ number_format($datos->retiro,0,'.','.') }}</td>
                        </tr>
                        <tr>
                            <th class="table-active">SALDO FINAL</th>
                            @php
                            $saldo_final = $datos->saldo_real - $datos->retiro
                            @endphp
                            <td class="text-right lead @if($saldo_final > 0) text-success @else text-danger @endif font-weight-bold">${{ number_format($saldo_final,0,'.','.') }}</td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
    <div class="col-lg-6 order-lg-first">
        <div class="card">
            <div class="card-header">
                <h4 class="card-title">Gastos</h4>
            </div>
            <div class="card-body p-0">
                @if(count($gastos) > 0)
                <table class="table table-sm table-hover">
                    <thead class="thead-light2">
                        <tr>
                            <th width="70%">ITEM</th>
                            <th class="text-right">MONTO</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($gastos as $g)
                        <tr>
                            <td>{{ $g->item }}</td>
                            <td class="text-right text-cyan">${{ number_format($g->monto,0,'.','.') }}</td>
                        </tr>
                        @endforeach
                    </tbody>
                </table>
                @else
                <p class="text-center pt-4">No hay gastos ingresados en este cierre de caja.</p>
                @endif
            </div>
        </div>
    </div>
</div>

<div class="card">
    <div class="card-header">
        <h4 class="card-title">Resumen de ventas</h4>
    </div>
    <div class="card-body p-0">
        <div class="table-responsive">
            <table class="table table-hover mt-0" id="datatable_ajax">
                <thead class="thead-default">
                    <tr>
                        <th>DOCUMENTO</th>
                        <th>CLIENTE</th>
                        <th>FECHA</th>
                        <th>F. PAGO</th>
                        <th class="text-right pr-5">MONTO</th>
                    </tr>
                    <tr class="filter">
                        <td>
                            <div class="form-group mb-0">
                                <input type="text" class="form-control form-filter" placeholder="" data-column="0" autocomplete="off">
                                <i class="form-group__bar"></i>
                            </div>
                        </td>
                        <td>
                            <div class="form-group mb-0">
                                <input type="text" class="form-control form-filter" placeholder="" data-column="1" autocomplete="off">
                                <i class="form-group__bar"></i>
                            </div>
                        </td>
                        <td></td>
                        <td></td>
                        <td>
                            <div class="form-group mb-0">
                                <input type="text" class="form-control form-filter" placeholder="" data-column="5" autocomplete="off">
                                <i class="form-group__bar"></i>
                            </div>
                        </td>
                    </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
    </div>
</div>

@endsection

@push('styles')
<link href="/vendors/fileinput-bootstrap/css/fileinput.min.css" rel="stylesheet">
@endpush

@push('scripts')
<script type="text/javascript" src="/vendors/fileinput-bootstrap/js/fileinput.min.js"></script>
<script type="text/javascript" src="/vendors/fileinput-bootstrap/js/locales/es.js"></script>
<script type="text/javascript" src="/vendors/datatables/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="/vendors/datatables/input.js"></script>
<script type="text/javascript">
$(function() {
    if($('.fileinput')[0]){
        $('.fileinput').each(function(e){
            var error_container = $(this).closest('.archivo-input').find('.file-errors');
            $(this).fileinput({
                language: 'es',
                showPreview: false,
                showUpload: false,
                dropZoneEnabled: false,
                showCancel: false,
                maxFileSize: 500,
                required: true,
                elErrorContainer: error_container,
                allowedFileExtensions: ["jpg", "pdf", "doc", "docx"],
                removeClass: "btn btn-danger"
            });

            $(this).on('fileuploaderror', function(event, data, msg) {
                $(this).closest('.archivo-input').find(':file').val('');
                $(this).fileinput('refresh').fileinput('remove');
            });
        });
    }

    $('.eliminar-cierre').click(function(){
        var elem = $(this);
        iziToast.question({
            timeout: false,
            close: false,
            overlay: true,
            displayMode: 'once',
            zindex: 999,
            maxWidth: 500,
            title: 'Eliminar cierre de caja',
            message: 'Una vez confirmado no se podran recuperar los datos. ¿Desea continuar?',
            position: 'center',
            buttons: [
                ['<button><b>SI</b></button>', function (instance, toast) {
                    $('button').prop('disabled',true);
                    $.ajax({
                        url: '/cierres/eliminar/{{ $datos->id }}'
                        ,type: 'POST'
                        ,data: { _token: '{{ csrf_token() }}' }
                        ,dataType: 'json'
                    })
                    .done(function(json){
                        if(json.result){
                            window.location.href = '/cierres';
                        }else{
                            mensaje('error','ERROR',json.msg);
                            $('button').prop('disabled',false);
                        }
                    });
                    instance.hide({ transitionOut: 'fadeOut' }, toast, 'button');
                }, true],
                ['<button>NO</button>', function (instance, toast) {
                    instance.hide({ transitionOut: 'fadeOut' }, toast, 'button');
                }],
            ],
        });
    });

    // Resumen de ventas
    $.extend( true, $.fn.dataTable.defaults, datatables_options);
    $.fn.dataTable.ext.errMode = function ( settings, helpPage, message ) { 
        mensaje('error','ERROR',message);
    };
    var table = $('#datatable_ajax').DataTable({
        ajax: '/ventas/datatables?tienda={{ $datos->tienda->id }}&fi={{ $datos->fecha_formato() }}&ft={{ $datos->fecha_formato() }}',
        columns: [
            { 
                data: 'folio',
                name: 'folio',
                render: function(data,type,row){
                    return  '<a href="'+(row.tipo == 'm' ? '{{ url('ventas/detalle-manual') }}' : '{{ url('ventas/detalle') }}') + '/' + row.id +'" data-nc="'+(row.nota_credito ? true : false)+'">' + (row.tipo == 'b' ? 'BOLETA' : (row.tipo == 'f' ? 'FACTURA' : 'MANUAL')) + ' N°'+ row.folio +'</a>'
                }
            },
            { 
                data: 'cliente.nombre', 
                name: 'cliente.nombre',
                render: function(data,type,row){
                    if(row.clientes_id){
                        if(row.cliente.tipo == 'e'){
                            return '<a href="{{ url('clientes/detalle') }}/'+ row.cliente.id +'">'+ row.cliente.razon_social +'</a>'
                        }else{
                            return '<a href="{{ url('clientes/detalle') }}/'+ row.cliente.id +'">'+ row.cliente.nombre +' '+ (row.cliente.apellidos ? row.cliente.apellidos : '') +'</a>'
                        }
                    }else{
                        return 'No indicado'
                    }
                }
            },
            { data: 'fecha', name: 'fecha' },
            { 
                data: 'formas_pago_id', 
                name: 'formas_pago_id',
                render: function(data,type,row){
                    if(row.forma_pago){
                        return row.forma_pago.nombre;
                    }else{
                        return '<span class="badge badge-warning">No indicado</span>'
                    }
                }
            },
            { data: 'monto', name: 'monto', sClass: 'text-right text-cyan' },
        ],
        createdRow: function(row,data,index){
            if($(row,'td:eq(0)').find('a[data-nc="true"]').length){
                $(row).addClass('table-danger');
            }
        }
    });

    $('.form-filter').keyup(function(){
        var $this = $(this);
        delay(function(){
            table.columns($this.data('column'))
                .search($this.val())
                .draw();
        },600);
    });
});
</script>
@endpush