@extends('layouts.seller')
@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 ?  __('seller_user.edit') :  __('seller_user.add') }}</p>

        </li>
        <li>
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="{{route('seller.dashboard')}}">{{ __('common.home') }}</a></li>
                    <li class="breadcrumb-item active" aria-current="page"><a href="{{ route('seller-access.index') }}">{{ __('seller_user.title') }}</a></li>
                    <li class="breadcrumb-item active" aria-current="page"> {{ $data->adminId ?  __('seller_user.edit') :  __('seller_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 ?  __('seller_user.edit') :  __('seller_user.add') }}
                            </p>
                        </li>
                    </ul>
                    <div class="error-msg font-14"></div>
                </div>
                {{ Form::open(array('route' => $routes, 'method' => 'POST', 'id' => 'ajaxSave', 'autocomplete' => 'off')) }}
                {!! Form::hidden('existed_user',0) !!}
                <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', __('seller_user.email'), array('class' => 'control-label')) }}
                                <div class="input-group">
                                    {!! Form::text('email',$data->email ?? '', ['class' => 'form-control']) !!}
                                </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', __('seller_user.full_name'), array('class' => 'control-label')) }}
                                {{ Form::text('full_name', $data->full_name ?? '', array('class' => 'form-control')) }}
                            </div>
                            <div class="custom-input-group colored-field-group col-12">
                                {{ Form::label('password', __('seller_user.password'), array('class' => 'control-label')) }}
                                {{ Form::password('password', array('class' => 'form-control', 'placeholder' => 'password')) }}
                            </div>

                            <div class="mt-4 custom-input-group colored-field-group col-12">
                                <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("#email");
        emailField.addEventListener('change',function(){
            let email = this.value;
            $('._fetch_placeholder').show();

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