@extends('admin.layouts.app')

@section('breadcrumb')
    <div>
        <h1 class="page-title fw-medium fs-18 mb-2">
            افزودن مدیر جدید
        </h1>

        <div>
            <nav>
                <ol class="breadcrumb mb-0">
                    <li class="breadcrumb-item">
                        <a href="{{ route('admin.admins.index') }}">
                            مدیران
                        </a>
                    </li>

                    <li class="breadcrumb-item active" aria-current="page">
                        افزودن مدیر
                    </li>
                </ol>
            </nav>
        </div>
    </div>
@endsection


@section('content')
    <div class="container-fluid pt-4">

        <div class="row">

            {{-- Success Message --}}
            @if(session('success'))
                <div class="alert alert-success">
                    {{ session('success') }}
                </div>
            @endif


            {{-- Error Message --}}
            @if(session('error'))
                <div class="alert alert-danger">
                    {{ session('error') }}
                </div>
            @endif

            <div class="col-xl-12">

                <form
                    action="{{ route('admin.admins.store') }}"
                    method="POST"
                    enctype="multipart/form-data"
                >
                    @csrf
                    <div class="card custom-card">

                        {{-- Card Header --}}
                        <div class="card-header">
                            <div class="card-title">
                                ایجاد مدیر
                            </div>
                        </div>
                        {{-- Card Body --}}
                        <div class="card-body">

                            <div class="row gy-3">

                                {{-- First Name --}}
                                <div class="col-xl-6">
                                    <label class="form-label">
                                        نام
                                    </label>

                                    <input
                                        type="text"
                                        class="form-control"
                                        name="first_name"
                                        value="{{ old('first_name') }}"
                                        placeholder="نام را وارد کنید"
                                    >

                                    @error('first_name')
                                    <span class="text-danger">
                                            {{ $message }}
                                        </span>
                                    @enderror
                                </div>


                                {{-- Last Name --}}
                                <div class="col-xl-6">
                                    <label class="form-label">
                                        نام خانوادگی
                                    </label>

                                    <input
                                        type="text"
                                        class="form-control"
                                        name="last_name"
                                        value="{{ old('last_name') }}"
                                        placeholder="نام خانوادگی را وارد کنید"
                                    >

                                    @error('last_name')
                                    <span class="text-danger">
                                            {{ $message }}
                                        </span>
                                    @enderror
                                </div>


                                {{-- Username --}}
                                <div class="col-xl-6">
                                    <label class="form-label">
                                        نام کاربری
                                    </label>

                                    <input
                                        type="text"
                                        class="form-control"
                                        name="username"
                                        value="{{ old('username') }}"
                                        placeholder="نام کاربری را وارد کنید"
                                    >

                                    @error('username')
                                    <span class="text-danger">
                                            {{ $message }}
                                        </span>
                                    @enderror
                                </div>


                                {{-- Email --}}
                                <div class="col-xl-6">
                                    <label class="form-label">
                                        ایمیل
                                    </label>

                                    <input
                                        type="email"
                                        class="form-control"
                                        name="email"
                                        value="{{ old('email') }}"
                                        placeholder="ایمیل را وارد کنید"
                                    >

                                    @error('email')
                                    <span class="text-danger">
                                            {{ $message }}
                                        </span>
                                    @enderror
                                </div>


                                {{-- Mobile --}}
                                <div class="col-xl-6">
                                    <label class="form-label">
                                        شماره موبایل
                                    </label>

                                    <input
                                        type="text"
                                        class="form-control"
                                        name="mobile"
                                        value="{{ old('mobile') }}"
                                        placeholder="شماره موبایل را وارد کنید"
                                    >

                                    @error('mobile')
                                    <span class="text-danger">
                                            {{ $message }}
                                        </span>
                                    @enderror
                                </div>


                                {{-- Password --}}
                                <div class="col-xl-6">
                                    <label class="form-label">
                                        رمز عبور
                                    </label>

                                    <input
                                        type="password"
                                        class="form-control"
                                        name="password"
                                        placeholder="رمز عبور را وارد کنید"
                                    >

                                    @error('password')
                                    <span class="text-danger">
                                            {{ $message }}
                                        </span>
                                    @enderror
                                </div>


                                {{-- Role --}}
                                <div class="col-xl-6">
                                    <label class="form-label">
                                        نقش مدیر
                                    </label>

                                    <select
                                        class="form-control"
                                        name="role"
                                        id="adminRole"
                                    >
                                        @foreach(\App\Enums\Admin\AdminRole::cases() as $role)
                                            <option
                                                value="{{ $role->value }}"
                                                @selected(old('role') == $role->value)
                                            >
                                                {{ $role->label() }}
                                            </option>
                                        @endforeach
                                    </select>

                                    @error('role')
                                    <span class="text-danger">
                                        {{ $message }}
                                    </span>
                                    @enderror
                                </div>


                                {{-- Status --}}
                                <div class="col-xl-6">
                                    <label class="form-label">
                                        وضعیت
                                    </label>

                                    <select
                                        class="form-control"
                                        name="status"
                                    >

                                        @foreach(\App\Enums\Admin\AdminStatus::cases() as $status)

                                            <option
                                                value="{{ $status->value }}"
                                                @selected(
                                                    old(
                                                        'status',
                                                        \App\Enums\Admin\AdminStatus::ACTIVE->value
                                                    ) == $status->value
                                                )
                                            >
                                                {{ $status->label() }}
                                            </option>

                                        @endforeach

                                    </select>

                                    @error('status')
                                    <span class="text-danger">
                                            {{ $message }}
                                        </span>
                                    @enderror
                                </div>

                            </div>


                            {{-- Permissions --}}
                            <div class="col-xl-12 mt-4">

                                <div class="card custom-card">

                                    <div class="card-header">
                                        <div class="card-title">
                                            سطح دسترسی
                                        </div>
                                    </div>

                                    <div class="card-body">

                                        <div class="row gy-3">

                                            @foreach(\App\Enums\Admin\AdminPermission::cases() as $permission)

                                                <div class="col-xl-3 col-lg-4 col-md-6">

                                                    <div class="form-check">

                                                        <input
                                                            class="form-check-input permission-checkbox"
                                                            type="checkbox"
                                                            name="permissions[]"
                                                            value="{{ $permission->value }}"
                                                            id="permission_{{ $permission->value }}"
                                                            data-permission="{{ $permission->value }}"

                                                            @checked(
                                                                in_array(
                                                                    $permission->value,
                                                                    old('permissions', [])
                                                                )
                                                            )
                                                        >

                                                        <label
                                                            class="form-check-label"
                                                            for="permission_{{ $permission->value }}"
                                                        >
                                                            {{ $permission->label() }}
                                                        </label>

                                                    </div>

                                                </div>

                                            @endforeach

                                        </div>

                                        @error('permissions')
                                        <span class="text-danger">
                                        {{ $message }}
                                        </span>
                                        @enderror

                                        @error('permissions.*')
                                        <span class="text-danger">
                                        {{ $message }}
                                        </span>
                                        @enderror

                                    </div>

                                </div>

                            </div>


                            {{-- Avatar --}}
                            <div class="card-avatar mt-4">

                                <div class="text-center">

                                    <label class="form-label d-block fw-semibold">
                                        تصویر پروفایل
                                    </label>

                                    <label
                                        class="avatar-picker"
                                        id="avatarPreview"
                                        style="
                                            background-image:
                                            url('{{ asset('assets/admin/images/faces/DefaultAvatar.jpg') }}')
                                        "
                                    >

                                        <input
                                            type="file"
                                            name="image"
                                            accept="image/*"
                                            onchange="previewAvatar(this)"
                                        >


                                    </label>

                                </div>

                            </div>


                            @error('image')
                            <div class="mt-2">
                                    <span class="text-danger">
                                        {{ $message }}
                                    </span>
                            </div>
                            @enderror

                        </div>


                        {{-- Card Footer --}}
                        <div class="card-footer text-end">

                            <a
                                href="{{ route('admin.admins.index') }}"
                                class="btn btn-light"
                            >
                                انصراف
                            </a>

                            <button
                                type="submit"
                                class="btn btn-primary"
                            >
                                ثبت اطلاعات
                            </button>

                        </div>

                    </div>

                </form>

            </div>

        </div>

    </div>
@endsection
@push('scripts')
    <script>

        document.addEventListener('DOMContentLoaded', function () {

            const roleSelect = document.getElementById('adminRole');

            const superAdminRole =
                @json(\App\Enums\Admin\AdminRole::SUPERADMIN->value);

            const manageAdminsPermission =
                @json(\App\Enums\Admin\AdminPermission::MANAGE_ADMINS->value);


            function handleAdminPermissions() {

                const isSuperAdmin =
                    roleSelect.value === superAdminRole;


                document
                    .querySelectorAll('.permission-checkbox')
                    .forEach(function (checkbox) {

                        if (
                            checkbox.dataset.permission ===
                            manageAdminsPermission
                        ) {

                            if (!isSuperAdmin) {

                                checkbox.checked = false;
                                checkbox.disabled = true;

                            } else {

                                checkbox.disabled = false;

                            }

                        }

                    });
            }


            roleSelect.addEventListener(
                'change',
                handleAdminPermissions
            );


            handleAdminPermissions();

        });

    </script>
@endpush