@extends('layouts.default')
@section('content')

    <div class="content d-flex flex-column flex-column-fluid" id="kt_content">


        <div class="post d-flex flex-column-fluid" id="kt_post">

            <div id="kt_content_container" class="container-xxl">

                <div class="card">


                    <div class="card-body py-4">

                        <table class="table align-middle table-row-dashed fs-6 gy-5" id="kt_table_users"
                            style="display: inline-table">

                            <thead>

                                <tr class="text-start text-muted fw-bolder fs-7 text-uppercase gs-0">

                                    <th class="min-w-20px">No.</th>
                                    <th class="min-w-125px">User</th>
                                    <th class="min-w-125px">Name</th>
                                    <th class="min-w-125px">Email</th>
                                    <th class="min-w-125px">Gender</th>
                                    <th class="text-end min-w-100px">User Information</th>
                                </tr>

                            </thead>

                            <tbody class="text-gray-600 fw-bold">

                                @foreach ($trainers as $key => $trainer)
                                    <tr>

                                        <td>{{ $key + 1 }}</td>

                                        <td class="d-flex align-items-center">

                                            <div class="symbol symbol-circle symbol-50px overflow-hidden me-3">
                                                <a>
                                                    <div class="symbol-label">
                                                        <img class="w-100"
                                                            src="{{ isset($trainer->profile->image) ? asset('uploads/' . $trainer->profile->image) : asset('asset/media/avatars/blank.png') }}" />
                                                    </div>
                                                </a>
                                            </div>

                                            <div class="d-flex flex-column">
                                                <a class="text-gray-800 mb-1">{{ $trainer->name ?? null }}</a>
                                                <span>{{ $trainer->email ?? null }}</span>
                                            </div>

                                        </td>

                                        <td>{{ $trainer->name ?? null }}</td>
                                        <td>{{ $trainer->email ?? null }}</td>
                                        <td>{{ $trainer->profile->gender ?? null }}</td>

{{--                                      <td>

                                            <label
                                                class="form-check form-switch form-switch-sm form-check-custom form-check-solid flex-stack ">
                                                <input type="checkbox" data-id="{{ $trainer->id }}"
                                                    class="form-check-input toggle-class"
                                                    {{ $trainer->status ? 'checked' : '' }} />
                                            </label>
                                        </td>
                                        <td class="active-abc">
                                            <div class="badge badge-light-success trainer-{{ $trainer->id }}">
                                                {{ $trainer->status == 1 ? 'Active' : 'Deactive' }}</div>
                                        </td> --}}

                                        <td class="text-center"><a href="{{ URL('trainer/' . $trainer->id) }}"><button
                                                    type="button" class="btn btn-primary btn-sm">View</button></a>
                                        </td>

                                    </tr>
                                @endforeach

                            </tbody>

                        </table>

                    </div>

                </div>

            </div>

        </div>

    </div>


@stop