@extends('store.main.template')

@section('store.content.container')

<div class="card mb-4">
    <div class="card-header">Minhas Encomendas</div>
    <div class="card-body">
        <div class="table-responsive-md">
            <table class="table">
                <thead>
                    <tr>
                        <th scope="col">#</th>
                        <th scope="col">Total</th>
                        <th scope="col">Estado</th>
                        <th scope="col">Utilizador</th>
                        <th scope="col">Data de Encomenda</th>
                        <th scope="col">Última Atualização</th>
                        <th scope="col"></th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($orders as $order)
                    <tr>
                        <th scope="row">{{ $order->id }}</th>
                        <td>{{ $order->total_s_iva }}</td>
                        <td>{{ $order->getStatusText() }}</td>
                        <td>{{ $order->user->name }}</td>
                        <td>{{ $order->date }}</td>
                        <td>{{ $order->updated_at }}</td>
                        <td><a href="{{ route('store.user.orders.view', ["id"=>$order->id]) }}">Ver</a></td>
                    </tr>          
                    @endforeach
                </tbody>
            </table>
        </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