@include('admin/components/header')

@include('admin/components/top_navigation')


@include('admin/components/sidebar')

<!-- page content -->

<div id="app-content">
    <div class="app-content-area">

        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-12 col-md-12 col-12">
                    <!-- Page header -->
                    <div class="d-flex justify-content-between align-items-center mb-5">
                        <h3 class="mb-0 fw-bold">Dashboard</h3>

                    </div>
                </div>
            </div>

            <div class="row mb-5">
                <div class="col-lg-12 col-md-12 col-12 card" style="background-color: #ffb727">
                    <div class="p-6 d-lg-flex justify-content-between align-items-center ">
                        <div class="d-md-flex align-items-center">
                            <img src="{{ 'adminassets/images/avatar/avatar-3.jpg' }}" alt="Image"
                                class="rounded-circle avatar avatar-xl">
                            <div class="ms-md-4 mt-3 mt-md-0 lh-1">
                                <h3 class="text-black mb-0">Hellow, {{$user->role}}</h3>
                                <small class="text-black"> Here is what’s happening with your projects :</small>
                            </div>
                        </div>

                    </div>

                </div>
            </div>





            <div class="row row-cols-1  row-cols-xl-3 row-cols-md-2 ">
                <div class="col mb-5">
                    <div class="card h-100 card-lift">
                        <div class="card-body">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="text-muted fw-semi-bold">Events</span>
                                <span><i data-feather="calendar" class="text-info"></i></span>
                            </div>
                            <div class="mt-4 mb-3 d-flex align-items-center lh-1">
                                <h3 class="fw-bold mb-0">{{ $events_count }}</h3>
                                {{-- <span class="mt-1 ms-2 text-danger"><i data-feather="arrow-down" class="icon-xs"></i>2.29%</span> --}}
                            </div>
                            <a href="{{ route('admin.all_events') }}" class="btn-link fw-semi-bold">View Events</a>
                        </div>
                    </div>
                </div>

                <div class="col mb-5">
                    <div class="card h-100 card-lift">
                        <div class="card-body">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="text-muted fw-semi-bold">News</span>
                                <span><i data-feather="file-text" class="text-info"></i></span>
                            </div>
                            <div class="mt-4 mb-3 d-flex align-items-center lh-1">
                                <h3 class="fw-bold mb-0">{{ $news_count }}</h3>
                                {{-- <span class="mt-1 ms-2 text-success"><i data-feather="arrow-up" class="icon-xs"></i>2.29%</span> --}}
                            </div>
                            <a href="{{ route('admin.all_news') }}" class="btn-link fw-semi-bold">View news</a>
                        </div>
                    </div>
                </div>

                <div class="col mb-5">
                    <div class="card h-100 card-lift">
                        <div class="card-body">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="text-muted fw-semi-bold">Membership</span>
                                <span><i data-feather="users" class="text-info"></i></span>
                            </div>
                            <div class="mt-4 mb-3 d-flex align-items-center lh-1">
                                <h3 class="fw-bold mb-0">{{ $membership_count }}</h3>
                                {{-- <span class="mt-1 ms-2 text-success"><i data-feather="arrow-up" class="icon-xs"></i>5.16%</span> --}}
                            </div>
                            <a href="{{ route('admin.all_membership') }}" class="btn-link fw-semi-bold">All Members</a>
                        </div>
                    </div>
                </div>



            </div>






            <div class="row ">
                <div class="col-xl-6 mb-5">
                    <div class=" card h-100">
                        <div class=" card-header d-flex justify-content-between align-items-center">
                            <h4 class="mb-0">Membership</h4>
                            <div class="dropdown dropstart">
                                <a href="#!" class="btn btn-ghost btn-icon btn-sm rounded-circle"
                                    data-bs-toggle="dropdown" aria-expanded="false">
                                    <i data-feather="more-vertical" class="icon-xs"></i>
                                </a>
                                <ul class="dropdown-menu">
                                    <li><a class="dropdown-item d-flex align-items-center" href="#!">Action</a>
                                    </li>
                                    <li><a class="dropdown-item d-flex align-items-center" href="#!">Another
                                            action</a></li>
                                    <li><a class="dropdown-item d-flex align-items-center" href="#!">Something else
                                            here</a></li>
                                </ul>
                            </div>
                        </div>
                        <div class="card-body">
                            <div class="table-responsive table-card">
                                <table class="table text-nowrap mb-0 table-centered">
                                    <thead class="table-light">
                                        <tr>
                                            <th>Member Name</th>
                                            <th>Line of Business</th>
                                            <th>Category</th>
                                            <th>Status</th>
                                            <th>Status</th>
                                        </tr>
                                    </thead>
                                    <tbody>


                                        @if ($memberships->isEmpty())
                                            <center>
                                                <h2>No Data available</h2>
                                            </center>
                                        @else
                                            @foreach ($memberships as $membership)
                                                <tr>
                                                    <td>
                                                        <div class="lh-1">
                                                            <h5 class="mb-0">
                                                                <a href="#!"
                                                                    class="text-inherit">{{ $membership->member_name }}</a>
                                                            </h5>
                                                        </div>
                                                    </td>
                                                    <td>{{ $membership->line_of_business }}</td>
                                                    <td>{{ $membership->category }}</td>
                                                    <td>{{ $membership->status }}</td>
                                                    <td>
                                                        <a href="#!"
                                                            class="btn btn-ghost btn-icon btn-sm rounded-circle texttooltip"
                                                            data-template="eyeTwo">
                                                            <i data-feather="eye" class="icon-xs"></i>
                                                            <div id="eyeTwo" class="d-none">
                                                                <span>View</span>
                                                            </div>
                                                        </a>
                                                    </td>
                                                </tr>
                                            @endforeach
                                        @endif



                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-6 mb-5">
                    <div class=" card h-100">
                        <div class=" card-header d-flex justify-content-between align-items-center">
                            <h4 class="mb-0">Events</h4>
                            <div class="dropdown dropstart">
                                <a href="#!" class="btn btn-ghost btn-icon btn-sm rounded-circle"
                                    data-bs-toggle="dropdown" aria-expanded="false">
                                    <i data-feather="more-vertical" class="icon-xs"></i>
                                </a>
                                <ul class="dropdown-menu">
                                    <li><a class="dropdown-item d-flex align-items-center" href="#!">Action</a>
                                    </li>
                                    <li><a class="dropdown-item d-flex align-items-center" href="#!">Another
                                            action</a></li>
                                    <li><a class="dropdown-item d-flex align-items-center" href="#!">Something
                                            else
                                            here</a></li>
                                </ul>
                            </div>
                        </div>
                        <div class="card-body">
                            <div class="table-responsive table-card">
                                <table class="table text-nowrap mb-0 table-centered">
                                    <thead class="table-light">
                                        <tr>
                                            <th>Event Title</th>
                                            <th>Event Date</th>
                                        </tr>
                                    </thead>
                                    <tbody>


                                        @if ($events->isEmpty())
                                            <center>
                                                <h2>No Data available</h2>
                                            </center>
                                        @else
                                            @foreach ($events as $event)
                                                <tr>
                                                    <td>
                                                        <div class="lh-1">
                                                            <h5 class="mb-0">
                                                                <a href="#!"
                                                                    class="text-inherit">{{ $event->event_title }}</a>
                                                            </h5>
                                                        </div>
                                                    </td>
                                                    <td>{{ $event->event_date }}</td>


                                                </tr>
                                            @endforeach
                                        @endif



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

        </div>
    </div>
</div>



@include('admin/components/footer')