@extends('admin.sidebar')
@section('content')
    <h3 class="text-uppercase my-5">Dashboard</h3>
    <div class="row ">
        <a href="{{ route('dashboard', ['role' => 'atlit']) }}" class="col-6 col-lg-3 col-md-6 bigger">
            <div class="card shadow">
                <div class="card-body px-4 py-4-5">
                    <div class="row">
                        <div class="col-md-4 col-lg-12 col-xl-12 col-xxl-5 d-flex justify-content-start ">
                            <div class="stats-icon red mb-2">
                                <i class="iconly-boldProfile"></i>
                            </div>
                        </div>
                        <div class="col-md-8 col-lg-12 col-xl-12 col-xxl-7">
                            <h6 class="text-muted font-semibold">Atlit</h6>
                            <h6 class="font-extrabold mb-0">{{ $atlit }}</h6>
                        </div>
                    </div>
                </div>
            </div>
        </a>
        <a href="{{ route('dashboard', ['role' => 'pelatih']) }}" class="col-6 col-lg-3 col-md-6 bigger">
            <div class="card shadow">
                <div class="card-body px-4 py-4-5">
                    <div class="row">
                        <div class="col-md-4 col-lg-12 col-xl-12 col-xxl-5 d-flex justify-content-start ">
                            <div class="stats-icon blue mb-2">
                                <i class="iconly-boldDocument"></i>
                            </div>
                        </div>
                        <div class="col-md-8 col-lg-12 col-xl-12 col-xxl-7">
                            <h6 class="text-muted font-semibold">Pelatih</h6>
                            <h6 class="font-extrabold mb-0">{{ $pelatih }}</h6>
                        </div>
                    </div>
                </div>
            </div>
        </a>
        <a href="{{ route('dashboard', ['role' => 'wasit']) }}" class="col-6 col-lg-3 col-md-6 bigger">
            <div class="card shadow">
                <div class="card-body px-4 py-4-5">
                    <div class="row">
                        <div class="col-md-4 col-lg-12 col-xl-12 col-xxl-5 d-flex justify-content-start ">
                            <div class="stats-icon purple mb-2">
                                <i class="iconly-boldEdit "></i>
                            </div>
                        </div>
                        <div class="col-md-8 col-lg-12 col-xl-12 col-xxl-7">
                            <h6 class="text-muted font-semibold">Wasit</h6>
                            <h6 class="font-extrabold mb-0">{{ $wasit }}</h6>
                        </div>
                    </div>
                </div>
            </div>
        </a>
        <a href="{{ route('dashboard', ['role' => 'operator']) }}" class="col-6 col-lg-3 col-md-6 bigger">
            <div class="card shadow">
                <div class="card-body px-4 py-4-5">
                    <div class="row">
                        <div class="col-md-4 col-lg-12 col-xl-12 col-xxl-5 d-flex justify-content-start ">
                            <div class="stats-icon green mb-2">
                                <i class="iconly-boldWork"></i>
                            </div>
                        </div>
                        <div class="col-md-8 col-lg-12 col-xl-12 col-xxl-7">
                            <h6 class="text-muted font-semibold">Operator</h6>
                            <h6 class="font-extrabold mb-0">{{ $operator }}</h6>
                        </div>
                    </div>
                </div>
            </div>
        </a>
    </div>
    <section class="section">
        <div class="card shadow">
            <div class="card-header">
                <h5 class="card-title center">
                    Akun {{ $role }} Yang Baru Ditambahkan
                </h5>
            </div>
            @if ($request->role != 'operator' && isset($request->role))
                <form class="row" id="filterForm" action="" style="margin-right:50px">
                    @csrf
                    <div class="col-3"></div>
                    <div class="col-3"></div>
                    <div class="col-2"></div>
                    <div class="form-group col-3">
                        <input type="hidden" name="role" value="{{ $request->role }}" id="">
                        <select class="form-control selectpicker" name="cabor" onchange="submitFilter()"
                            id="cabor"data-show-subtext="true" data-live-search="true">
                            <option selected value="">--Pilih Cabang OlahRaga--</option>
                            @foreach ($cabor as $item)
                                <option value="{{ $item->nama }}">{{ $item->nama }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-1 ">

                        <button type="submit" class="btn m-auto"><i class="bi bi-funnel-fill"></i></button>
                    </div>
                </form>
            @endif
            <div class="card-body">
                <table class="table table-striped " id="table1">
                    <thead>
                        <tr>
                            <th>Username</th>
                            <th>Email</th>
                            @if ($request->role != 'operator')
                                <th>Cabor</th>
                            @endif
                            <th>Role</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($user as $item)
                            <tr>
                                <td>{{ $item->username }}</td>
                                <td>{{ $item->email }}</td>
                                @if ($request->role != 'operator')
                                    <td>
                                        @if ($request->role == 'atlit')
                                            @if (isset($item->atlit->cabor))
                                                {{ $item->atlit->cabor }}
                                            @endif
                                        @endif
                                        @if ($request->role == 'pelatih')
                                            @if (isset($item->pelatih->cabor))
                                                {{ $item->pelatih->cabor }}
                                            @endif
                                        @endif
                                        @if ($request->role == 'wasit')
                                            @if (isset($item->wasit->cabor))
                                                {{ $item->wasit->cabor }}
                                            @endif
                                        @endif

                                    </td>
                                @endif
                                @if ($item->role == 1)
                                    <td>Operator</td>
                                @elseif ($item->role == 2)
                                    <td>Pelatih</td>
                                @elseif($item->role == 3)
                                    <td>Atlet</td>
                                @elseif($item->role == 4)
                                    <td>Atlet</td>
                                @endif

                            </tr>
                        @endforeach

                    </tbody>
                </table>
            </div>
        </div>

    </section>
    <script>
        function submitFilter() {

            document.getElementById("filterForm").submit();;


        }
    </script>
    <script>
        $(document).ready(function() {
            if ($.fn.DataTable.isDataTable('#table1')) {
                $('#table1').DataTable().destroy();
            }

            $('#table1').DataTable({
                "ordering": false
            });
        });
    </script>

@endsection