Tablo

@php
    $orders = [
        ['#1042', 'Elif Kaya', 'Ödendi', 'success', 1240, '11 Eki'],
        ['#1041', 'Mert Demir', 'Bekliyor', 'warning', 399, '10 Eki'],
        ['#1040', 'Zeynep Ak', 'İade', 'danger', 2870, '9 Eki'],
        ['#1039', 'Can Yılmaz', 'Ödendi', 'success', 560, '9 Eki'],
    ];
@endphp
<div x-data="{ selected: [] }" class="sc-col">
    <div class="arm-toolbar" x-show="selected.length" x-cloak>
        <span class="arm-text arm-text--sm"><strong x-text="selected.length"></strong> sipariş seçildi</span>
        <armada:spacer />
        <armada:button size="sm" icon="download">Dışa aktar</armada:button>
        <armada:button size="sm" variant="soft" tone="danger" icon="trash-2">Sil</armada:button>
    </div>
    <armada:table>
        <armada:table.columns>
            <armada:table.column class="arm-table__check"><input type="checkbox" class="arm-checkbox" aria-label="Tümünü seç" x-on:change="selected = $el.checked ? @js(array_column($orders, 0)) : []" x-bind:checked="selected.length === {{ count($orders) }}"></armada:table.column>
            <armada:table.column sortable sorted direction="desc">Sipariş</armada:table.column>
            <armada:table.column sortable>Müşteri</armada:table.column>
            <armada:table.column>Durum</armada:table.column>
            <armada:table.column align="end" sortable>Tutar</armada:table.column>
            <armada:table.column>Tarih</armada:table.column>
            <armada:table.column></armada:table.column>
        </armada:table.columns>
        <armada:table.rows>
            @foreach ($orders as [$id, $name, $status, $tone, $amount, $date])
                <armada:table.row x-bind:class="selected.includes('{{ $id }}') && 'is-selected'">
                    <armada:table.cell check><input type="checkbox" class="arm-checkbox" value="{{ $id }}" x-model="selected" aria-label="Seç"></armada:table.cell>
                    <armada:table.cell primary>{{ $id }}</armada:table.cell>
                    <armada:table.cell label="Müşteri"><div class="sc-row" style="gap:8px;flex-wrap:nowrap"><armada:avatar :name="$name" size="xs" />{{ $name }}</div></armada:table.cell>
                    <armada:table.cell label="Durum"><armada:badge :tone="$tone" dot>{{ $status }}</armada:badge></armada:table.cell>
                    <armada:table.cell label="Tutar" align="end">₺{{ number_format($amount, 0, ',', '.') }}</armada:table.cell>
                    <armada:table.cell label="Tarih">{{ $date }}</armada:table.cell>
                    <armada:table.cell align="end">
                        <armada:dropdown align="end">
                            <x-slot:trigger><armada:button variant="ghost" size="sm" icon="ellipsis" aria-label="İşlemler" /></x-slot:trigger>
                            <armada:menu.item icon="eye">Görüntüle</armada:menu.item>
                            <armada:menu.item icon="printer">Fatura yazdır</armada:menu.item>
                            <armada:menu.separator />
                            <armada:menu.item icon="undo-2" variant="danger">İade et</armada:menu.item>
                        </armada:dropdown>
                    </armada:table.cell>
                </armada:table.row>
            @endforeach
        </armada:table.rows>
        <x-slot:footer><div style="padding:10px 14px;border-top:1px solid var(--arm-border-soft)"><armada:pagination :current="1" :last="12" :total="46" :per-page="4" /></div></x-slot:footer>
    </armada:table>
</div>

<armada:table striped compact :stack="false">
    <armada:table.columns>
        <armada:table.column>Bölge</armada:table.column>
        <armada:table.column align="end">Ziyaret</armada:table.column>
        <armada:table.column align="end">Dönüşüm</armada:table.column>
        <armada:table.column align="end">Gelir</armada:table.column>
    </armada:table.columns>
    <armada:table.rows>
        @foreach ([['İstanbul', 18240, '3,4%', '₺214.000'], ['Ankara', 9120, '2,9%', '₺96.300'], ['İzmir', 7480, '3,1%', '₺81.900'], ['Bursa', 4210, '2,2%', '₺38.400']] as [$r, $v, $c, $g])
            <armada:table.row>
                <armada:table.cell primary>{{ $r }}</armada:table.cell>
                <armada:table.cell align="end">{{ number_format($v, 0, ',', '.') }}</armada:table.cell>
                <armada:table.cell align="end">{{ $c }}</armada:table.cell>
                <armada:table.cell align="end">{{ $g }}</armada:table.cell>
            </armada:table.row>
        @endforeach
    </armada:table.rows>
</armada:table>

<armada:card flush>
    <armada:empty icon="search-x" title="Sonuç bulunamadı" description="Filtreleri değiştirip tekrar deneyin.">
        <x-slot:actions><armada:button icon="rotate-ccw">Filtreleri temizle</armada:button></x-slot:actions>
    </armada:empty>
</armada:card>