@extends('admin::layouts.app')

@section('content')
    <section class="content mb-5">
        <div class="container-fluid">
            @include('admin::partials.title-pad', [
                'title' => __('admin.my_staff'),
                'search' => $search,
                'searchPlaceholder' => __('placeholder.search_staffs'),
                'create' => 'admin.staffs.create',
                'list' => $users,
            ])

            <div class="col-md-12">
                <div class="tab-content" id="myTabContent">
                    <div class="tab-pane fade show active" id="Internal">
                        <div class="row">
                            @forelse ($users as $user)
                                <div class="col-md-4">
                                    <div class="card package-section cc-section">
                                        <div class="row">
                                            <div class="col-4">
                                                <div class="cc-image">
                                                    <img
                                                        src="{{ isset($user->user_profile) ? $user->user_profile : asset('admin-assets/img/makeup-circle-1.jpg') }}" />
                                                </div>
                                            </div>
                                            <div class="col-8 pl-0">
                                                <h5>{{ $user->name }}</h5>
                                                <h6 class="my-1">
                                                    @forelse ($user->specialists as $item)
                                                        {{ $item->name_en }}
                                                        @unless ($loop->last)
                                                            ,
                                                        @endunless
                                                    @empty
                                                    @endforelse
                                                </h6>
                                                <h6 class="mb-1">
                                                    {{ isset($user->mobileCode->dial_code) ? $user->mobileCode->dial_code : '' }}
                                                    {{ $user->mobile_number }}</h6>

                                                <div class="grid-status">
                                                    <span
                                                        class="badge bad-status {{ $user->status == App\Helpers\ConstantHelper::ACTIVE ? 'badge-success' : 'badge-danger' }} ">{{ __('admin.'.$user->status) }}</span>
                                                </div>
                                            </div>
                                            @php
                                                $staffStatus =
                                                    $user
                                                        ->bussinessUsers()
                                                        ->where('user_id', auth()->user()->id)
                                                        ->first()->pivot->status ?? '';
                                            @endphp
                                            <div class="col-6 col-md-3 pack-details">
                                                <p>{{ __('admin.staff_status') }}</p>
                                                <span
                                                    class="badge bad-status {{ $staffStatus == App\Helpers\ConstantHelper::APPROVED ? 'badge-success' : 'badge-danger' }} ">{{ __('admin.'.$staffStatus) }}</span>
                                            </div>
                                            <div class="col-6 col-md-3 pack-details">
                                                <p>{{ __('admin.gender') }}</p>
                                                <h5>{{ isset($user->userDetail->gender) ? __('static.'.$user->userDetail->gender) : '' }}
                                                </h5>
                                            </div>
                                            <div class="col-6 col-md-3 pack-details">
                                                <p>{{ __('admin.nationality') }}</p>
                                                <h5>{{ isset($user->nationality->name_en) ? $user->nationality->name_en : '' }}
                                                </h5>
                                            </div>
                                            <div class="col-6 col-md-3 pack-details">
                                                <p>{{ __('admin.bookings') }}</p>
                                                <h5>{{ $user->orders_count }}</h5>
                                            </div>
                                            <div class="col-md-3 pack-details">
                                                <p>{{ __('label.user_type') }}</p>
                                                <h5>{{$locale == App\Helpers\ConstantHelper::ARABIC ? $user->name_ar : $user->role->name }}</h5>
                                            </div>
                                            <div class="col-md-3 pack-details">
                                                <p>{{ __('label.user_roles') }}</p>
                                                @foreach ($user->roles as $role)
                                                    <span class="badge bad-status badge-success">
                                                        {{ $locale == App\Helpers\ConstantHelper::ARABIC ? $role->name_ar : $role->name }}
                                                    </span>
                                                @endforeach
                                            </div>
                                            <div class="col-md-12">
                                                <div class="border-top"></div>
                                            </div>
                                            <div class="col-md-12 d-flex justify-content-between mt-3">
                                                {{-- @if ($user->created_by == auth()->user()->id)
                                                    @if (Auth::user()->hasPermission('admin.staffs.delete'))
                                                        <a href="javascript:;"
                                                            data-url="/api/admin/staffs/{{ $user->id }}"
                                                            data-request="remove"
                                                            class="btn-md card-btn btn-outline-secondary text-danger f-16"
                                                            title="Delete Staff"><i
                                                                class="iconly-boldDelete"></i>{{ __('admin.remove_staff') }}</a>
                                                    @endif
                                                @else --}}
                                                @if ($staffStatus == 'inactive')
                                                    @if (Auth::user()->hasPermission('admin.activate-staff-user'))
                                                        <button
                                                            onclick="confirmAndActivateStaff('{{ auth()->user()->id }}', '{{ $user->id }}')"
                                                            class="btn-md card-btn btn-outline-primary f-16"
                                                            title="Delete Staff">
                                                            <i class="iconly-boldAdd-User"></i>
                                                            {{ __('admin.active_staff') }}
                                                        </button>
                                                    @endif
                                                @else
                                                    @if (Auth::user()->hasPermission('admin.inactivate-staff-user'))
                                                        <button
                                                            onclick="confirmAndInactivateStaff('{{ auth()->user()->id }}', '{{ $user->id }}')"
                                                            class="btn-md card-btn btn-outline-secondary text-danger f-16"
                                                            title="Delete Staff">
                                                            <i class="iconly-boldDelete"></i>
                                                            {{ __('admin.inactive_staff') }}
                                                        </button>
                                                    @endif
                                                @endif
                                                {{-- @endif --}}
                                                @if (Auth::user()->hasPermission('admin.staffs.edit'))
                                                    <a href="{{ url('admin/staffs/edit/' . $user->id) }}"
                                                        class="btn-md card-btn btn-primary" title="Edit Service"><i
                                                            class="fa fa-eye"></i>{{ __('admin.edit') }}</a>
                                                @endif
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            @empty
                                <div class="col-md-12">
                                    <p class="text-danger">{{ __('admin::message.no_records_found') }}</p>
                                </div>
                            @endforelse

                            {{-- Pagination --}}
                            {{ $users->appends(request()->input())->links('admin::partials.pagination') }}
                            {{-- Pagination End --}}
                        </div>
                    </div>


                </div>

            </div>
        </div>
    </section>
@endsection

@section('script')
    <script>
        async function inactivateStaff(userId, staffId) {
            try {
                const response = await fetch(`${api_url}/admin/inactivate-staff-user`, {
                    method: 'POST',
                    headers: {
                        'Content-Type': 'application/json',
                        'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').content,
                    },
                    body: JSON.stringify({
                        user_id: userId,
                        staff_id: staffId,
                    }),
                });

                const data = await response.json();
                if (response.ok) {
                    setTimeout(function() {
                        showSuccessMessage(data.message);
                    }, 500);
                    location.reload();
                } else {
                    showErrorMessage(`${data.message}`);
                }
            } catch (error) {
                showErrorMessage('An error occurred. Please try again later.');
                console.error('An error occurred:', error);
            }
        }

        function confirmAndInactivateStaff(userId, staffId) {
            const isConfirmed = confirm('Are you sure you want to set this staff request as inactive?');
            if (isConfirmed) {
                inactivateStaff(userId, staffId);
            }
        }

        async function activateStaff(userId, staffId) {
            try {
                const response = await fetch(`${api_url}/admin/activate-staff-user`, {
                    method: 'POST',
                    headers: {
                        'Content-Type': 'application/json',
                        'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').content,
                    },
                    body: JSON.stringify({
                        user_id: userId,
                        staff_id: staffId,
                    }),
                });

                const data = await response.json();
                if (response.ok) {
                    setTimeout(function() {
                        showSuccessMessage(data.message);
                    }, 500);
                    location.reload();
                } else {
                    showErrorMessage(`${data.message}`);
                }
            } catch (error) {
                showErrorMessage('An error occurred. Please try again later.');
                console.error('An error occurred:', error);
            }
        }

        function confirmAndActivateStaff(userId, staffId) {
            const isConfirmed = confirm('Are you sure you want to set this staff request as active again?');
            if (isConfirmed) {
                activateStaff(userId, staffId);
            }
        }

        function showSuccessMessage(message) {
            alert(message);
        }

        function showErrorMessage(message) {
            alert(message);
        }
    </script>
@endsection