<div>
    <div class="table-responsive table-card mt-3 mb-1">
        <table class="table align-middle table-nowrap" id="customerTable">
            <thead class="table-light">
                <tr>
                    <th class="border px-4 py-2">Nama</th>
                    <th class="border px-4 py-2">Kecamatan</th>
                    <th class="border px-4 py-2">Kota</th>
                    <th class="border px-4 py-2">Aksi</th>
                </tr>
            </thead>
            <tbody class="list form-check-all" id="sortableTable">
                @foreach ($selectedBufferCustomers as $buffercustomer)
                    <tr data-id="{{ $buffercustomer['id'] }}">
                        <td class="border px-4 py-2">{{ $buffercustomer['name'] }}</td>
                        <td class="border px-4 py-2">{{ isset($buffercustomer['district_name']) ? $buffercustomer['district_name'] : $buffercustomer['district'] }}</td>
                        <td class="border px-4 py-2">{{ isset($buffercustomer['regency_name']) ? $buffercustomer['regency_name'] : $buffercustomer['regency'] }}</td>
                        <td class="border px-4 py-2">
                            <a type="button" wire:click="removeCustomer('{{ $buffercustomer['id'] }}')"
                                class="btn btn-danger">
                                Hapus
                            </a>
                        </td>
                    </tr>
                @endforeach
            </tbody>
        </table>
    </div>
</div>
