@extends('layouts.main')

@section('container')
    <div class="card">
        <div class="card-header">
            <a href="{{ route('admin.user.create') }}" class="btn btn-primary float-right">Tambah User</a>
        </div>
        <div class="card-body">
            @php
                $options = [
                    'role' => [
                        '' => 'Semua',
                        '1' => 'SUPERADMIN',
                        '2' => 'CUSTOMER',
                        '3' => 'STAFF',
                        '4' => 'MANAGER',
                    ],
                    'status' => [
                        "" => 'Semua',
                        '1' => 'Aktif',
                        '0' => 'Tidak Aktif',
                    ],
                    'sub_roles' => [
                        '' => 'Semua',
                        'sales' => 'Sales',
                        'showroom' => 'Showroom',
                        'mitra' => 'Mitra',
                    ],
                ];
                $headers = json_encode([
                    '#No' => 'no',
                    'Nama' => 'name',
                    'Handphone' => 'phone',
                    'Email' => 'email',
                    'Role' => 'role',
                    'Status' => 'status',
                    'Tanggal Dibuat' => 'created_at',
                    '#' => 'action',
                ]);
            @endphp
            <x-datatable.table sourceUrl="{{ route('admin.user.list') }}" tableHeaders="{{ $headers }}" noDateFilter="1" defaultOrder="6">
                <x-datatable.filter type="selection" name="role" label="Role"
                    options="{{ json_encode($options['role']) }}"/>
                <x-datatable.filter type="selection" name="status" label="Status"
                options="{{ json_encode($options['status']) }}" />
                <x-datatable.filter type="selection" name="sub_roles" label="Sub Roles"
                options="{{ json_encode($options['sub_roles']) }}" />
            </x-datatable.table>

        </div>
    </div>
@endsection