@extends('admin.layout.master')

@section('title', 'Admins')

@section('body')
    <!--Page header-->
    <div class="page-header d-xl-flex d-block">
        <div class="page-leftheader">
            <h4 class="page-title">Admin</h4>
        </div>
    </div>
    <!--End Page header-->

    <div class="row ">
        <div class="col-md-12">
            <div class="card mb-lg-0">
                <div class="card-header border-bottom-0">
                    <h3 class="card-title">Edit Admin</h3>
                </div>
                <div class="card-body">
                    <form action="{{ route('admin.update_admin') }}" id="update-admin" method="post" enctype="multipart/form-data">
                        @csrf
                        <div class="row">
                            @if ($errors->any())
                                <div class="alert alert-danger alert-dismissible fade show mb-5 hdo-alert">
                                    <ul>
                                        @foreach ($errors->all() as $error)
                                            <li> <strong> {{ $error }} </strong> </li>
                                        @endforeach
                                    </ul>
                                </div>
                            @endif
                            <input type="hidden" name="admin_id" id="admin_id" value="{{ $admin->id }}">
                            <div class="col-md-12">
                                <div class="form-group">
                                    <label class="form-label">Name*</label>
                                    <input class="form-control" name="name" type="text" placeholder="Enter Name"
                                        value="{{ $admin->name }}">
                                </div>
                            </div>
                            <div class="col-md-12">
                                <div class="form-group">
                                    <label class="form-label">Email*</label>
                                    <input class="form-control" name="email" id="edit_email" type="text" placeholder="Enter Email"
                                        value="{{ $admin->email }}">
                                </div>
                            </div>
                            <div class="col-md-12">
                                <div class="form-group">
                                    <label class="form-label">Phone*</label>
                                    <input class="form-control" name="phone" type="text" placeholder="Enter Phone"
                                        value="{{ $admin->phone }}">
                                </div>
                            </div>
                            <div class="col-md-12">
                                <div class="form-group">
                                    <label class="form-label">Username*</label>
                                    <input class="form-control" name="username" type="text" placeholder="Enter Username"
                                        value="{{ $admin->username }}">
                                </div>
                            </div>
                            @if (isset($all_locations))
                                <div class="col-md-12">
                                    <div class="form-group">
                                        <label class="form-label">Access Location</label>
                                        @foreach ($all_locations as $loc)
                                            <div class="col-sm-6 col-lg-3">
                                                <div class="form-group d-flex gap-2">
                                                    <label class="custom-control custom-checkbox">
                                                        <input type="checkbox" class="custom-control-input"
                                                            name="access_location[]" id="{{ $loc->location_name }}"
                                                            value="{{ $loc->location_id }}"
                                                            {{ in_array($loc->location_id, explode(',', $admin->access_location)) ? 'checked' : '' }}>
                                                        <span class="custom-control-label">{{ $loc->location_name }}</span>
                                                    </label>
                                                </div>
                                            </div>
                                        @endforeach
                                    </div>
                                </div>
                            @endif
                            @if (isset($all_roles))
                                <div class="col-md-12">
                                    <div class="form-group">
                                        <label class="form-label">Select Role</label>
                                        <select class="form-control" name="role_id">
                                            <option value="">Select</option>
                                            @foreach ($all_roles as $role)
                                                <option value="{{ $role->id }}"
                                                    {{ isset($admin->role) ? ($admin->role == $role->id ? 'selected' : '') : '' }}>
                                                    {{ $role->name }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                            @endif
                            <div class="col-md-12">
                                <div class="form-label">Upload Photo</div>
                                <div class="input-group file-browser">
                                    <input type="text" class="form-control border-right-0 browse-file" placeholder="choose" readonly>
                                    <label class="input-group-append mb-0">
                                        <span class="btn ripple btn-primary">
                                            Browse <input type="file" class="file-browserinput" name="image" hidden accept="image/*">
                                        </span>
                                    </label>
                                </div>
                            </div>
                        </div>
                        <button type="submit" id="update_emoji_form" class="btn btn-primary mt-2">Update</button>
                    </form>
                </div>
            </div>
        </div>
    </div>

@endsection

@push('script')
    <script>
        $(document).ready(function() {
            var debounceFetchData = _.debounce(function(value,element) {
                var id = "{{ $admin->id }}"; // Assuming admin_id is the ID of your input field
                var result = false;
                $.ajax({
                    url: "{{ route('admin.check_unique_email') }}",
                    method: "POST",
                    async: false,
                    data: {
                        "email": value,
                        "id": id
                    },
                    success: function(response) {
                        if (response == false) {
                            $.validator.messages.customDebounce = "Admin email already exists.";
                            $.validator.methods.customDebounce = function() { return false; }; // Override the customDebounce method to always return false (fails validation)
                            $(element).valid();
                        } else {
                            $.validator.messages.customDebounce = "";
                            $.validator.methods.customDebounce = function() { return true; };
                            $(element).valid();
                        }
                    }
                });
                return result;
            }, 1000);

            $(document).on('keyup','#edit_email',function(){
                debounceFetchData($(this).val(), $(this));
            });

            $.validator.addMethod("validMobile", function(value, element) {
                return this.optional(element) || /^[0-9]{10}$/.test(value); // This regex assumes 10 digit mobile number without country code
            }, "Please enter a valid mobile number.");


            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });

            $("#update-admin").validate({
                highlight: function(element) {
                    $(element).closest('.form').removeClass('has-success').addClass('has-error');
                },
                success: function(element) {
                    $(element).closest('.form').removeClass('has-error').addClass('has-success');
                    $(element).closest('.error').remove();
                },
                rules: {
                    email: {
                        required: true,
                        email: true,
                        customDebounce: true
                    },
                    name: {
                        required: true,
                    },
                    phone: {
                        required: true,
                        validMobile: true
                    },
                    username: {
                        required: true,
                    }
                },
                messages: {
                    email: {
                        required: "Email fiels is required",
                        email: "Email is not a valid email",
                    },
                    name: {
                        required: "Name fiels is required",
                    },
                    phone: {
                        required: "Phone fiels is required",
                        validMobile: "Please enter a valid mobile number"
                    },
                    username: {
                        required: "Username fiels is required",
                    }
                },
                submitHandler: function(form, e) {
                    e.preventDefault();
                    form.submit();
                }
            });
        })
    </script>
@endpush