@extends('layouts.app')

@section('topbar_cta')
    <button class="primary-btn">Nova Venda</button>
@endsection

@section('content')
<section class="kpi-grid">
    @foreach ($kpis as $kpi)
        <article class="card kpi-card">
            <p class="kpi-label">{{ $kpi['label'] }}</p>
            <h3>{{ $kpi['value'] }}</h3>
            <span class="kpi-delta">{{ $kpi['delta'] }}</span>
        </article>
    @endforeach
</section>

<section class="content-grid">
    <article class="card panel">
        <div class="panel-head">
            <h2>Ultimas Vendas</h2>
            <a href="#">ver tudo</a>
        </div>

        <div class="table-wrap">
            <table>
                <thead>
                <tr>
                    <th>Pedido</th>
                    <th>Cliente</th>
                    <th>Pagamento</th>
                    <th>Total</th>
                    <th>Status</th>
                </tr>
                </thead>
                <tbody>
                @foreach ($sales as $sale)
                    <tr>
                        <td>{{ $sale['order'] }}</td>
                        <td>{{ $sale['customer'] }}</td>
                        <td>{{ $sale['payment'] }}</td>
                        <td>{{ $sale['total'] }}</td>
                        <td>
                            <span class="status {{ $sale['status'] === 'Concluida' ? 'ok' : 'pending' }}">
                                {{ $sale['status'] }}
                            </span>
                        </td>
                    </tr>
                @endforeach
                </tbody>
            </table>
        </div>
    </article>

    <article class="card panel">
        <div class="panel-head">
            <h2>Acoes Rapidas</h2>
            <a href="#">atalhos</a>
        </div>

        <div class="shortcut-list">
            @foreach ($shortcuts as $shortcut)
                <div class="shortcut-item">
                    <div>
                        <h4>{{ $shortcut['title'] }}</h4>
                        <p>{{ $shortcut['desc'] }}</p>
                    </div>
                    <kbd>{{ $shortcut['key'] }}</kbd>
                </div>
            @endforeach
        </div>
    </article>
</section>
@endsection