@extends('layouts.admin')
@section('css')
    <style>
        div.child-route{
            display: none;
            padding-left: 20px;
            align-items: center;
        }
        td.label {
            padding: 11px !important;
            width: 50%;
            border-right: 1px solid #f7f7f7;
        }
    </style>
@endsection
@section('content')

<div class="page-header text-uppercase">
    <ul class="list-unstyled space-list m-0">
        <li>
            <p>{{ $data->adminId ?  __('admin_user.edit') :  __('admin_user.add') }}</p>

        </li>
        <li>
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="{{route('admin.dashboard')}}">{{ __('common.home') }}</a></li>
                    <li class="breadcrumb-item active" aria-current="page"><a href="{{ route('admin-user.index') }}">{{ __('admin_user.title') }}</a></li>
                    <li class="breadcrumb-item active" aria-current="page"> {{ $data->adminId ?  __('admin_user.edit') :  __('admin_user.add') }}</li>
                </ol>
            </nav>
        </li>
    </ul>
</div>
<div class="admin-area-col">
    <div class="row employee-list-view">
        <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 employee-list-full">
            <div class="round-white-bg box-shadow">
                <div class="d-block">
                    <ul class="list-inline justified-header bordered-header border-0">
                        <li>
                            <p class="m-0 font-bold">
                                {{ $data->adminId ?  __('admin_user.edit') :  __('admin_user.add') }}
                            </p>
                        </li>
                    </ul>
                    <div class="error-msg font-14"></div>
                </div>
                {{ Form::open(array('route' => $routes, 'method' => 'POST', 'id' => 'ajaxSave')) }}
                <div class="row">
                    <div class="col-xs-6 col-sm-6 col-md-6 col-lg-4">
                        <div class="row">
                            <div class="custom-input-group colored-field-group col-12">
                                {{ Form::label('email', __('admin_user.email'), array('class' => 'control-label')) }}
                                <div class="input-group">
                                    {!! Form::text('email', $data->email, ['class' => 'form-control readonly' , 'id' => 'invite-email', 'readonly' => ($data->adminId) ? true : false]) !!}
                                    @if(!isset($data->email))
                                        <div class="input-group-append">
                                        <span class="input-group-text __sent_email_response" id="basic-addon1"  >
                                           <div class="spinner-border spinner-border-sm __email_loading_spin mr-1" role="status" style="display: none">
                                              <span class="sr-only">Loading...</span>
                                            </div>
                                            <a href="javascript:void(0)" id="verification-mail" class="" data-field_id = "invite-email"  data-url = "{{route('admin-user.invite')}}" >{!! __('admin_user.invite') !!}</a>
                                        </span>
                                        </div>
                                    @endif
                                </div>
                                <span class="_fetch_placeholder" style="display: none">{!! __('admin.please_wait') !!}</span>
                            </div>
                            <div class="custom-input-group colored-field-group col-12">
                                {{ Form::label('full_name', __('admin_user.full_name'), array('class' => 'control-label')) }}
                                {{ Form::text('full_name', $data->full_name, array('class' => 'form-control readonly', 'readonly' => ($data->adminId) ? true : false)) }}
                            </div>
                            <div class="custom-input-group colored-field-group col-12">
                                {{ Form::label('role', __('admin_user.role'), array('class' => 'control-label')) }}
                                {{ Form::select('role', $role, $data->role_id, array('class' => 'form-control select2')) }}
                            </div>
                            <div class="custom-input-group colored-field-group col-12">
                                {{ Form::label('password', __('admin_user.password'), array('class' => 'control-label')) }}
                                {{ Form::password('password', array('class' => 'form-control')) }}
                            </div>

                            <div class="custom-input-group colored-field-group col-12">
                                <div class="global-item-top-box">
                                    <label class="yummy-switch-label">
                                        {!! Form::checkbox('status', 1, (isset($data->status)&&($data->status==0))?false:true) !!}
                                        <span class="yummy-switch-box"></span>
                                    </label>
                                </div>
                            </div>
                            <div class="custom-input-group colored-field-group col-12 mt-4">
                                <ul class="list-inline">
                                    <li class="list-inline-item">
                                        {{ Form::submit( __('common.save'), array('class' => 'btn btn-primary width80')) }}
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>

                    <div class="col-xs-6 col-sm-6 col-md-6 col-lg-8">
                        @include('layouts.menu', [
                            'menus' => $menus,
                            'permission' => isset($permission) ? $permission : [],
                            'style' => true
                        ])
                    </div>
                </div>
                {{ Form::close()}}
            </div>
        </div>

    </div>
</div>
@endsection

@section('script')
    @include('layouts.menu-script',['type' => 'grid'])
    <script>
        let emailField = document.querySelector("#invite-email");
        emailField.addEventListener('change',function(){
            let email = this.value;
            $('._fetch_placeholder').show();

            $.ajax({
                url: "{{ route('email-exists') }}",
                method: "POST",
                data: {email, _token:"{{ csrf_token() }}"},
                success: function(response) {
                    if(response.status) {
                        $('#full_name').val(response?.data?.full_name).prop('readonly',true);
                        $('#password').parent().hide();
                    } else {
                        $('#full_name').val('').prop('readonly', false);
                        $('#password').parent().show();
                    }
                    $('._fetch_placeholder').hide();
                }
            });
        });
    </script>

@endsection