@extends('layouts.app')
@section('title')
    {{ __('messages_301.User profile') }}
@endsection
@section('style')
    <link rel="stylesheet" href="{{ asset('assets/vendor/css/pages/page-profile.css') }}" />
    <style>
        .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
            width: 100% !important;
        }

        .bordered-img {
            border: 5px solid black;
            /* Adjust the color and width as needed */
            border-radius: 5px;
            /* Adjust the radius to match the rounded corners if needed */
        }

        .shadow-img {
            box-shadow: 0 4px 8px rgb(0, 0, 0);
            /* Adjust the offset, blur, and color as needed */
            border-radius: 5px;
            /* Adjust the radius to match the rounded corners if needed */
        }
    </style>
@endsection
@section('content')
    <div class="container-xxl flex-grow-1 container-p-y">
        @include('inc.breadcrumb', [
            'breadcrumb_items' => [
                __('messages.Home') => route('home'),
                __('messages_301.Users') => null,
                __('messages_301.Students') => route('admin.users.students.index'),
                __('messages_301.User profile') => 'active',
            ],
        ])



        <div class="container-xxl flex-grow-1 container-p-y">

            @include('admin.users.includes.profile_info')
            <!-- User Profile Content -->
            <div class="row">
                <div class="col-xl-4 col-lg-5 col-md-5">
                    <!-- About User -->
                    <div class="card mb-4">
                        <div class="card-body">
                            <small class="card-text text-uppercase">{{ __('messages_301.About') }}</small>
                            <ul class="list-unstyled mb-4 mt-3">
                                <li class="d-flex align-items-center mb-3">
                                    <i class="ti ti-user text-heading"></i><span
                                        class="fw-medium mx-2 text-heading">{{ __('messages_301.Username') }}:</span>
                                    <span>{{ $data->username ?: null }}</span>
                                </li>
                                {{-- <li class="d-flex align-items-center mb-3">
                                    <i class="ti ti-check text-heading"></i><span
                                        class="fw-medium mx-2 text-heading">{{ __('messages_301.Status') }}:</span>
                                    <span>Active</span>
                                </li> --}}
                                <li class="d-flex align-items-center mb-3">
                                    <i class="ti ti-crown text-heading"></i><span
                                        class="fw-medium mx-2 text-heading">{{ __('messages_301.User type') }}:</span>
                                    <span>{{ $data->type }}</span>
                                </li>
                                <li class="d-flex align-items-center mb-3">
                                    <i class="ti ti-flag text-heading"></i><span
                                        class="fw-medium mx-2 text-heading">{{ __('messages_301.Country') }}:</span>
                                    <span>{{ $data->country?->name }}</span>
                                </li>
                                @if ($data->type->value == 'student')
                                    <li class="d-flex align-items-center mb-3">
                                        <i class="ti ti-flag text-heading"></i><span
                                            class="fw-medium mx-2 text-heading">{{ __('messages_301.University') }}:</span>
                                        <span>{{ $data->university?->name }}</span>
                                    </li>
                                @endif
                                @if ($data->type->value == 'student')
                                    <li class="d-flex align-items-center mb-3">
                                        <i class="ti ti-flag text-heading"></i><span
                                            class="fw-medium mx-2 text-heading">{{ __('messages_301.Topics') }}:</span>
                                        @if (count($data->topics))
                                            @foreach ($data->topics as $topic)
                                                <span class="badge bg-label-secondary">{{ $topic?->name }}</span>
                                            @endforeach
                                        @endif
                                    </li>
                                @endif
                            </ul>
                            <small class="card-text text-uppercase">{{ __('messages_301.Contacts') }}</small>
                            <ul class="list-unstyled mb-4 mt-3">
                                <li class="d-flex align-items-center mb-3">
                                    <i class="ti ti-phone-call"></i><span
                                        class="fw-medium mx-2 text-heading">{{ __('messages.Phone Number') }}:</span>
                                    <span>({{ $data->mobile_country_code ?: null }}) {{ $data->mobile ?: null }}</span>
                                </li>

                                <li class="d-flex align-items-center mb-3">
                                    <i class="ti ti-mail"></i><span
                                        class="fw-medium mx-2 text-heading">{{ __('messages.Email') }}:</span>
                                    <span>{{ $data->email }}</span>
                                </li>
                            </ul>
                        </div>
                    </div>

                </div>
                <div class="col-xl-8 col-lg-7 col-md-7">
                    <!-- Activity Timeline -->
                    <div class="card card-action mb-2">
                        <div class="card-body pb-0">
                            <small class="card-text text-uppercase">{{ __('messages_301.Overview') }}</small>

                            <ul class="list-unstyled mb-4 mt-3">
                                @if ($data->type->value == 'doctor')
                                    <li class="d-flex align-items-center mb-3">
                                        <i class="ti ti-check"></i><span
                                            class="fw-medium mx-2">{{ __('messages_301.Courses') }}:</span>
                                        <span>{{ count($data->courses) }}</span>
                                    </li>
                                @endif
                                <li class="d-flex align-items-center mb-3">
                                    <i class="ti ti-users"></i><span
                                        class="fw-medium mx-2">{{ __('messages_301.Following') }}:</span>
                                    <span>{{ count($data->following) }}</span>
                                </li>
                                @if ($data->type->value != 'student')
                                    <li class="d-flex align-items-center mb-3">
                                        <i class="fas fa-briefcase"></i><span
                                            class="fw-medium mx-2">{{ __('messages_301.Jobs') }}:</span>
                                        <span>{{ count($data->jobs) }}</span>
                                    </li>
                                @endif

                                {{-- @if ($data->type->value == 'student') --}}
                                <li class="d-flex align-items-center mb-3">
                                    <i class="fas fa-briefcase"></i><span
                                        class="fw-medium mx-2">{{ __('messages_301.Applied jobs') }}:</span>
                                    <span>{{ count($data->applied_jobs) }}</span>
                                </li>
                                {{-- @endif --}}

                                <li class="d-flex align-items-center mb-3">
                                    <i class="ti ti-pencil"></i><span
                                        class="fw-medium mx-2">{{ __('messages_303.Posts') }}:</span>
                                    <span>{{ count($data->posts) }}</span>
                                </li>
                                <li class="d-flex align-items-center mb-3">
                                    <i class="ti ti-check"></i><span
                                        class="fw-medium mx-2">{{ __('messages_303.Password changed count') }}:</span>
                                    <span>{{ ($data->password_change_count) }}</span>
                                </li>
                               
                            </ul>
                        </div>
                    </div>
                    <!--/ Activity Timeline -->

                </div>
            </div>

        </div>
        <!-- Projects table -->

        <!--/ Projects table -->
    </div>
    <!--/ User Profile Content -->

@endsection

@section('script')
    <script src="{{ asset('assets/js/pages-account-settings-account.js') }}"></script>
    <script src="{{ asset('assets/js/pages-profile.js') }}"></script>
    <script>
        $(document).ready(function() {
            $('.nav-link').on('click', function(event) {
                // event.preventDefault(); // Prevent the default link behavior

                var page = $(this).data('page');

                var userId = {{ $data->id }}; // Assuming $data->id contains the user ID
                var user_type = {!! json_encode($data->type->value) !!};
                if(user_type == 'doctor')
                var newUrl = '/admin/users/doctors/' + userId + '?type=' + page;
                else if(user_type == 'company')
                var newUrl = '/admin/users/companies/' + userId + '?type=' + page;
                else if(user_type == 'student')
                var newUrl = '/admin/users/students/' + userId + '?type=' + page;
                // Navigate to the new URL
                window.location.href = newUrl;
            });
        });
    </script>
@endsection