@extends('store.main.template')

@section('store.content.container')

<div class="card invoice">
    <div class="card-header p-4 p-md-5 border-bottom-0 bg-gradient-dark text-warning">
        <div class="row justify-content-between align-items-center">
            <div class="col-12 col-lg-auto mb-5 mb-lg-0 text-left text-lg-start">
                <!-- Invoice branding-->
                <div class="h2 text-white mb-0">Carrinho de compras</div>
            </div>
            <div class="col-12 col-lg-auto text-right text-lg-end">
                <!-- Invoice details-->
                #{{ $order->id }}
                <br>
                {{ $order->date }}
            </div>
        </div>
    </div>
    <div class="card-body p-4 p-md-5">
        <!-- Invoice table-->
            <div class="table-responsive">
                <table class="table table-borderless mb-0">
                    <thead class="border-bottom">
                        <tr class="small text-uppercase text-muted">
                            <th width="50%">Produto</th>
                            <th width="10%" class="">Qtd</th>
                            <th width="7%">Desconto</th>
                            <th width="7%">Preço</th>
                            <th width="7%">Iva</th>
                            <th width="7%">Total</th>
                            <th width="10%">Total c/ IVA</th>
                        </tr>
                    </thead>
                    <tbody>
                        <!-- Invoice item 1-->
                        @foreach ($order->orderDetail as $detail )
                        <input name="refs[]" type="hidden" value="{{ $detail->product->id }}">
                        <tr class="border-bottom">
                            <td>
                                <div>{{ $detail->product->extra_info }} {{ $detail->product->metric }}  {{ $detail->product->pack_size }} </div>
                                <div class="small text-muted d-none d-md-block">{{ $detail->product->external_id }}</div>
                            </td>
                            <td>{{ $detail->qty }}</td>
                            <td>{{ round($detail->getDiscountAmount(), 2) }}€ <small>({{ $detail->discount }}%)</small></td>
                            <td>{{ $detail->total_s_iva }}€</td>
                            <td>{{ $detail->iva }}%</td>
                            <td>{{ round($detail->getRowPriceNoVatNoDiscount(), 2) }}€</td>
                            <td>{{ round($detail->getRowTotalWithVatWithDiscount(), 2) }}€</td>
                        </tr>
                        @endforeach
                        <!-- Invoice subtotal-->
                        <tr>
                            <td class=" pb-0" colspan="1">&nbsp;</td>
                            <td class="  pb-0" colspan="1"></td>
                            <td class=" pb-0" colspan="1">&nbsp;</td>
                            <td class=" pb-0" colspan="3"><div class="text-uppercase small font-weight-bold">Subtotal:</div></td>
                            <td class=" pb-0"><div class="mb-0">{{ round($order->getOrderTotalNoVat(), 2) ?? 0 }}€</div></td>
                        </tr>
                        <!-- Invoice tax column-->
                        <tr>
                            <td class=" pb-0" colspan="3">&nbsp;</td>
                            <td class=" pb-0" colspan="3"><div class="text-uppercase small font-weight-bold">Iva:</div></td>
                            <td class=" pb-0"><div class="mb-0">{{ round($order->getOrderTotalVat(), 2) ?? 0 }}€</div></td>
                        </tr>
                        <!-- Invoice total-->
                        <tr>
                            <td class=" pb-0" colspan="3">&nbsp;</td>
                            <td class=" pb-0" colspan="3"><div class="text-uppercase font-weight-bold">Total:</div></td>
                            <td class=" pb-0"><div class="mb-0 font-weight-bold text-warning">{{ round($order->getOrderTotalWithVat(), 2) ?? 0 }}€</div></td>
                        </tr>
                    </tbody>
                </table>
            </div>
    </div>
    <div class="card-footer bg-warning p-4 p-lg-5 border-top-0">
        <div class="row">
            <div class="col-4 mb-4 mb-lg-0">
                <!-- Invoice - sent to info-->
                <div class="h6 mb-1">{{ $order->customer->name ?? '' }}</div>
                <div class="small">{{ $order->customer->nif?? ''  }}</div>
                <div class="small">{{ $order->customer->address ?? ''  }}</div>
                <div class="small">{{ $order->customer->telephone ?? '' }}</div>
            </div>
            <div class="col-8">
                <!-- Invoice - additional notes-->
                <div class="small mb-0">Payment is due 15 days after receipt of this invoice. Please make checks or money orders out to Company Name, and include the invoice number in the memo. We appreciate your business, and hope to be working with you again very soon!</div>
            </div>
        </div>
    </div>
</div>

<div class="row p-4 align-right">
    <div class="col-6">
        <a href="{{ url()->previous() }}" class="btn btn-outline-dark sharp-edges">Voltar</a>
    </div>
</div>
@endsection

@section('modals')
<div class="modal_placeholder"></div>
@endsection

@section('pageJsIncludes')
<script>
    $(function () {
    $('[data-toggle="popover"]').popover({
        container: 'body',
        trigger: 'focus'
    })
  })
</script>
@endsection