@extends('layouts.app', ['page' => 'invoices'])

@section('title', __('messages.invoice_details'))

@section('page_header')
<style>
    table {
        border-collapse: collapse;
    }
</style>

<div class="orders-page">
    <div class="page__heading d-flex align-items-center justify-content-between flex-wrap">
        <div class="flex">
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb mb-1">
                    <li class="breadcrumb-item">
                        <a href="#"><i class="material-icons icon-20pt">home</i></a>
                    </li>
                    <li class="breadcrumb-item" aria-current="page">
                        <a href="{{ route('invoices') }}">{{ __('messages.invoices') }}</a>
                    </li>
                    <li class="breadcrumb-item active" aria-current="page">
                        {{ __('messages.invoice_details') }}
                    </li>
                </ol>
            </nav>
            <h1 class="m-0 page-title">{{ __('messages.invoice_details') }}</h1>
        </div>

        @if(($invoice->estatus) === "LISTO PARA ENTREGAR" && ($invoice->customer->email))
            <a href="https://dashboard.boxshoplogistics.com/api/yappy/index.php?orden={{ $invoice->id }}&cliente={{ $invoice->customer->email }}"
               target="_blank"
               class="mt-3 mt-md-0">
                <img alt="Yappy" src="https://dashboard.boxshoplogistics.com/brand.png" style="width: 207px; height: 56px;" />
            </a>
        @endif
    </div>
</div>
@endsection

@section('content')
<div class="orders-page">

    @if($invoice->idyappy && ($invoice->estatus) === "PAGO WEB")
        <script src='https://code.jquery.com/jquery-3.3.1.slim.min.js' integrity='sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo' crossorigin='anonymous'></script>
        <script src='https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js' integrity='sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy' crossorigin='anonymous'></script>

        <div class='text-center'>
            <a href='#myModal' class='trigger-btn' data-toggle='modal'></a>
        </div>

        <div id='myModal' class='modal fade'>
            <div class='modal-dialog modal-login'>
                <div class='modal-content'>
                    <div class='modal-header'>
                        <h4 class='modal-title'>PAGO PENDIENTE POR APLICAR</h4>
                        <button type='button' class='close' data-dismiss='modal' aria-hidden='true'>&times;</button>
                    </div>
                    <div class='modal-body'>
                        <p style='text-align: center;'>HAY UN PAGO PENDIENTE POR INGRESAR.</p>
                        <p style='text-align: center;'>CONFIRMACION YAPPY WEB: {{ $invoice->idyappy }}</p>
                        <p style='text-align: center;'>VERIFICAR POR FAVOR</p>
                    </div>
                    <div class='modal-footer'>
                        <a href='https://dashboard.boxshoplogistics.com/api/yappy/view.php?confirmacion={{ $invoice->idyappy }}' target='_blank'>Verificar Aquí</a>
                    </div>
                </div>
            </div>
        </div>

        <script>
            $('#myModal').modal('toggle');
        </script>
    @endif

    <div class="card mb-4">
        <div class="card-body">
            <div class="d-flex flex-column flex-lg-row justify-content-between align-items-start">
                <div class="mb-3 mb-lg-0">
                    <h2 class="mb-1">BS{{ $invoice->id }}{{ $invoice->identificador }}</h2>
                    <div class="text-muted">{{ $invoice->sucursal }}</div>
                </div>

                <div class="d-flex flex-wrap gap-2">
                    <a href="{{ route('pdf.invoice', ['invoice' => $invoice->uid, 'download' => true]) }}" class="btn btn-light">
                        <i class="material-icons">cloud_download</i>
                        {{ __('messages.download') }}
                    </a>

                    @if(($invoice->sent) == "0")
                        <a href="{{ route('invoices.send', $invoice->id) }}"
                           class="btn btn-light alert-confirm"
                           data-alert-title="Are you sure?"
                           data-alert-text="Enviar confirmación de orden.">
                            <i class="material-icons">send</i>
                            ENVIAR CONFIRMACION
                        </a>
                    @endif

                    @if(($invoice->estatus) != "LISTO PARA ENTREGAR")
                        <a href="https://dashboard.boxshoplogistics.com/api/listoparaentregar.php?orden={{ $invoice->id }}"
                           class="btn btn-light alert-confirm"
                           data-alert-title="LISTO PARA ENTREGAR EN {{ $invoice->sucursal }}?"
                           data-alert-text="Esta accion notificará al cliente de que su paquete se encuentra disponible en sucursal.">
                            <span style="color:#3EA740;">
                                <i class="material-icons">send</i>
                                NOTIFICAR LISTO PARA ENTREGA
                            </span>
                        </a>
                    @endif

                    @if(($invoice->estatus) == "LISTO PARA ENTREGAR" || ($invoice->estatus) == "PAGO WEB")
                        <a href="https://dashboard.boxshoplogistics.com/api/entregado.php?orden={{ $invoice->id }}"
                           class="btn btn-light alert-confirm"
                           data-alert-title="ENTREGADO EN SUCURSAL {{ $invoice->sucursal }}?"
                           data-alert-text="Esta accion marcará entregada la orden.">
                            <span style="color:#FF0000;">
                                <i class="material-icons">send</i>
                                ACTUALIZAR A ENTREGADO
                            </span>
                        </a>
                    @endif

                    <a href="{{ route('payments.create', ['invoice' => $invoice->id]) }}" target="_blank" class="btn btn-light">
                        <i class="material-icons">payment</i>
                        {{ __('messages.enter_payment') }}
                    </a>

                    <a href="{{ route('invoices.edit', $invoice->id) }}" class="btn btn-light">
                        <i class="material-icons">edit</i>
                        {{ __('messages.edit') }}
                    </a>

                    <div class="btn-group">
                        <button type="button" class="btn btn-light dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                            {{ __('messages.more') }}
                        </button>
                        <div class="dropdown-menu dropdown-menu-right">
                            @if(($invoice->estatus) == "COTIZADO" || ($invoice->estatus) == "ORDEN CONFIRMADA" || ($invoice->estatus) == "")
                                <a href="https://dashboard.boxshoplogistics.com/api/comprado.php?orden={{ $invoice->id }}" class="dropdown-item">
                                    ACTUALIZAR COMPRADO
                                </a>
                            @endif

                            @if(($invoice->estatus) == "LISTO PARA ENTREGAR")
                                <a href="https://dashboard.boxshoplogistics.com/api/entregado.php?orden={{ $invoice->id }}" class="dropdown-item">
                                    ACTUALIZAR A ENTREGADO
                                </a>
                            @endif

                            @if(($invoice->estatus) == "COMPRADO")
                                <a href="https://dashboard.boxshoplogistics.com/api/transito.php?orden={{ $invoice->id }}" class="dropdown-item">
                                    ACTUALIZAR EN TRANSITO
                                </a>
                            @endif

                            <a href="https://dashboard.boxshoplogistics.com/api/etiqueta.php?orden={{ $invoice->id }}" target="_blank" class="dropdown-item">
                                IMPRIMIR ETIQUETA
                            </a>

                            <div class="dropdown-divider"></div>

                            <a href="https://dashboard.boxshoplogistics.com/api/transitosucursal.php?orden={{ $invoice->id }}" class="dropdown-item text-danger">
                                EN TRANSITO SUCURSAL
                            </a>

                            <div class="dropdown-divider"></div>

                            @if(($invoice->sent) == "1")
                                <a href="{{ route('invoices.send', $invoice->id) }}"
                                   class="dropdown-item alert-confirm"
                                   data-alert-title="Estas Seguro?"
                                   data-alert-text="Esta accion enviará una actualización de la orden.">
                                    REENVIAR CONFIRMACION
                                </a>
                            @endif

                            @if($invoice->notes)
                                <a href="https://dashboard.boxshoplogistics.com/api/actualizacion.php?orden={{ $invoice->id }}"
                                   class="dropdown-item alert-confirm"
                                   data-alert-title="Estas Seguro?"
                                   data-alert-text="Esta accion enviará una actualización de la orden.">
                                    NOTIFICAR ACTUALIZACION
                                </a>
                            @endif

                            @if($authUser->hasRole(['admin', 'super_admin']))
                                <a href="{{ route('invoices.delete', $invoice->id) }}" class="dropdown-item text-danger delete-confirm">
                                    {{ __('messages.delete') }}
                                </a>
                            @endif
                        </div>
                    </div>
                </div>
            </div>

            <hr>

            <div class="row">
                @if(($invoice->sent) == "0")
                    <div class="col-12 mb-3">
                        <div class="alert alert-warning mb-0" role="alert">
                            Recuerda enviar el correo de confirmación.
                        </div>
                    </div>
                @endif

                @if($invoice->estatus)
                    <div class="col-12 col-md-4 mb-3">
                        <div class="alert alert-soft-dark mb-0" role="alert">
                            <strong>ESTATUS:</strong> {{ $invoice->estatus }}
                        </div>
                    </div>
                @endif

                @if($invoice->fechalistoparaentregar)
                    <div class="col-12 col-md-4 mb-3">
                        <div class="alert alert-soft-warning mb-0" role="alert">
                            <strong>FECHA DE LLEGADA:</strong> {{ $invoice->fechalistoparaentregar }}
                        </div>
                    </div>
                @endif

                @if($invoice->fecha_retirado)
                    <div class="col-12 col-md-4 mb-3">
                        <div class="alert alert-soft-secondary mb-0" role="alert">
                            <strong>FECHA DE RETIRO:</strong> {{ $invoice->format_retirado }}
                        </div>
                    </div>
                @endif
            </div>
        </div>
    </div>

    @if($comentarios->count() > 0)
        <div class="card mb-4 border-danger">
            <div class="card-body">
                <h5 class="mb-3 text-danger">Comentarios</h5>
                @foreach($comentarios as $activity)
                    <div style="">
                        <strong>COMENTARIOS:</strong>
                        <span style="color:#112b4a;">{{ $activity->description }}</span>
                    </div>
                @endforeach
            </div>
        </div>
    @endif

    <div class="card mb-4">
        <div class="card-body">
            <h4 class="mb-3">Servicios</h4>

            <div class="table-responsive">
                <table width="100%" class="table mb-0">
                    <thead>
                        <tr>
                            <th>Servicio</th>
                            <th class="text-center">Cantidad</th>
                            <th class="text-right">Precio</th>
                            @if($invoice->tax_per_item)
                                <th class="text-right">Impuesto</th>
                            @endif
                            @if($invoice->discount_per_item)
                                <th class="text-right">Descuento</th>
                            @endif
                            <th class="text-right">Total</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($invoice->items as $item)
                            <tr>
                                <td>
                                    <div>{{ preg_replace('/\((.*?)\)/i', '', $item->product->name) }}</div>
                                    <small class="text-muted">{!! nl2br(htmlspecialchars($item->product->description)) !!}</small>
                                </td>
                                <td class="text-center">{{ $item->quantity }}</td>
                                <td class="text-right">{!! money($item->price, $invoice->currency_code)->format() !!}</td>

                                @if($invoice->tax_per_item)
                                    <td class="text-right">
                                        @foreach ($item->getTotalPercentageOfTaxesWithNames() as $key => $value)
                                            {{ $key }}<br>
                                        @endforeach
                                    </td>
                                @endif

                                @if($invoice->discount_per_item)
                                    <td class="text-right">{{ $item->discount_val }}%</td>
                                @endif

                                <td class="text-right">{!! money($item->total, $invoice->currency_code)->format() !!}</td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>

            <hr>

            <div class="row justify-content-end">
                <div class="col-12 col-md-5">
                    <div class="card bg-light border-0">
                        <div class="card-body">
                            <div class="d-flex justify-content-between mb-2">
                                <h5 class="mb-0">Total</h5>
                                <h5 class="mb-0">{!! money($invoice->total, $invoice->currency_code)->format() !!}</h5>
                            </div>

                            @if (count($invoice->payments) > 0)
                                <div class="d-flex justify-content-between">
                                    <h5 class="mb-0 text-danger">Saldo Pendiente</h5>
                                    <h5 class="mb-0 text-danger">{!! money($invoice->due_amount, $invoice->currency_code)->format() !!}</h5>
                                </div>
                            @endif
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-12 col-lg-6 mb-4">
            <div class="card h-100">
                <div class="card-header bg-white">
                    <strong>Documento PDF</strong>
                </div>
                <div class="card-body">
                    <embed class="pdf-iframe"
                           src="{{ route('pdf.invoice', $invoice->uid) }}"
                           type="application/pdf"
                           width="100%"
                           height="650px">
                </div>
            </div>
        </div>

        <div class="col-12 col-lg-6 mb-4">
            <nav class="nav nav-pills nav-justified w-100 mb-3" role="tablist">
                <a href="#payments" class="h6 nav-item nav-link bg-secondary text-white active show" data-toggle="tab" role="tab" aria-selected="true">
                    {{ __('messages.payments') }}
                </a>
                <a href="#activities" class="h6 nav-item nav-link bg-secondary text-white" data-toggle="tab" role="tab" aria-selected="false">
                    Log de Actividad
                </a>
            </nav>

            <div class="tab-content">
                <div class="tab-pane active show" id="payments">
                    <div class="card">
                        <div class="card-body">
                            @include('application.payments._table')
                        </div>
                    </div>
                </div>

                <div class="tab-pane" id="activities">
                    <div class="card">
                        <div class="card-body">
                            <p class="text-dark-gray d-flex align-items-center mb-3">
                                <i class="material-icons icon-muted mr-2">dvr</i>
                                <strong>{{ __('messages.activities') }}</strong>
                            </p>

                            @if($activities->count() > 0)
                                @foreach($activities as $activity)
                                    <div class="card mb-2 border-0 bg-light">
                                        <div class="card-body py-3">
                                            <div class="small text-muted mb-1">
                                                {{ $activity->created_at->format($currentCompany->getSetting('date_format')) }}
                                            </div>
                                            <div>{{ $activity->description }}</div>
                                        </div>
                                    </div>
                                @endforeach
                            @else
                                <div class="card border-0 bg-light">
                                    <div class="card-body py-3">
                                        <strong>{{ __('messages.no_activities_yet') }}</strong>
                                    </div>
                                </div>
                            @endif
                        </div>
                    </div>
                </div>
            </div>

            @if(($authUser->modificartracking) == "1")
                <div class="card mt-4">
                    <div class="card-header bg-white">
                        <strong>Actualizar tracking</strong>
                    </div>
                    <div class="card-body">
                        <form action="https://dashboard.boxshoplogistics.com/api/updatetracking.php?orden={{ $invoice->id }}&clientid={{ $invoice->customer_id }}&user={{ $authUser->full_name }}" method="POST">
                            <div class="d-flex flex-column flex-sm-row">
                                <div class="flex-fill mr-sm-2 mb-2 mb-sm-0">
                                    <input name="tracking"
                                           type="text"
                                           autocomplete="off"
                                           class="form-control"
                                           value="{{ $invoice->tracking }}"
                                           placeholder="TRACKING"
                                           required>
                                </div>
                                <button type="submit" class="btn btn-primary">
                                    <i class="fa-solid fa-pen-to-square"></i>
                                    ACTUALIZAR
                                </button>
                            </div>
                        </form>

                        @if($invoice->tracking)
                            <script>
                                window.setTimeout(function() {
                                    $(".alerts").fadeTo(500, 0).slideUp(500, function(){
                                        $(this).remove();
                                    });
                                }, 3000);
                            </script>

                            <div class="alert alerts alert-success mt-3 mb-0" role="alert">
                                <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                                </button>
                                El tracking ha sido actualizado: {{ $invoice->tracking }}
                            </div>
                        @endif
                    </div>
                </div>
            @endif

            <div class="card mt-4">
                <div class="card-header bg-white">
                    <strong>Detalles</strong>
                </div>
                <div class="card-body">
                    <div class="table-responsive">
                        <table class="table mb-0">
                            <tbody>
                                <tr>
                                    <td><strong>Cliente:</strong></td>
                                    <td>{{ $invoice->customer->display_name }}</td>
                                </tr>
                                <tr>
                                    <td><strong>Correo:</strong></td>
                                    <td>{{ $invoice->customer->email }}</td>
                                </tr>
                                <tr>
                                    <td><strong>Teléfono:</strong></td>
                                    <td>{{ $invoice->customer->phone }}</td>
                                </tr>
                                <tr>
                                    <td><strong>Sucursal:</strong></td>
                                    <td>{{ $invoice->sucursal }}</td>
                                </tr>
                                <tr>
                                    <td><strong>Tracking:</strong></td>
                                    <td>{{ $invoice->tracking }}</td>
                                </tr>
                                <tr>
                                    <td><strong>Tienda:</strong></td>
                                    <td>{{ $invoice->web }}</td>
                                </tr>
                                <tr>
                                    <td><strong>Cantidad de productos:</strong></td>
                                    <td>{{ $invoice->cantidad }}</td>
                                </tr>
                                <tr>
                                    <td><strong>Precio Total del Producto:</strong></td>
                                    <td>{{ $invoice->precio_total }}</td>
                                </tr>
                                <tr>
                                    <td><strong>Servicio de Compra (SIN ITBMS):</strong></td>
                                    <td>{{ $invoice->servi_compra }}</td>
                                </tr>
                                <tr>
                                    <td><strong>Libras Estimadas:</strong></td>
                                    <td>{{ $invoice->librasest }}</td>
                                </tr>
                                <tr>
                                    <td><strong>Flete de Compra:</strong></td>
                                    <td>{{ $invoice->flete_compra }}</td>
                                </tr>
                                <tr>
                                    <td><strong>Productos:</strong></td>
                                    <td style="white-space: pre-wrap; word-break: break-word;">{{ $invoice->productos }}</td>
                                </tr>
                                <tr>
                                    <td><strong>Link de Producto:</strong></td>
                                    <td style="white-space: pre-wrap; word-break: break-word;">{{ $invoice->links }}</td>
                                </tr>
                                <tr>
                                    <td><strong>Detalles:</strong></td>
                                    <td style="white-space: pre-wrap; word-break: break-word;">{{ $invoice->detalles }}</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>

        </div>
    </div>
</div>
@endsection