@extends('layouts.master')
@section('content')

<div class="content-wrapper">
    <!-- Content -->
 
    <div class="container-xxl flex-grow-1 container-p-y">
        @if(Session::has('success'))
            @section('scripts')
                <script>swal("Good job!", "{{ Session::get('success') }}", "success");</script>
            @endsection
        @endif

        @if(Session::has('error'))
            @section('scripts')
                <script>swal("Oops...", "{{ Session::get('error') }}", "error");</script>
            @endsection
        @endif
        <div class="row">
            <div class="col-lg-12">

                <div class="card">
                    <div class="card-header border-bottom">
                        Create User
                    </div>
                    <div class="card-body">
                        <form action="{{ route('admin.users.store') }}" method="POST" enctype="multipart/form-data" id="basic-form">
                            @csrf
                            <input type="hidden" name="id" id="id" value="{{ isset($data) ? $data->id : '' }}">
                            <input type="hidden" name="driver_id" id="driver_id" value="{{ (isset($data) && isset($data->driver)) ? $data->driver->id : '' }}">
                            <input type="hidden" name="vendor_id" id="vendor_id" value="{{ (isset($data) && isset($data->vendor)) ? $data->vendor->id : '' }}">
                            <input type="hidden" name="bank_account_id" id="bank_account_id" value="{{ (isset($data) && isset($data->bank_account)) ? $data->bank_account->id : '' }}">
                            
                            <h5 class="fw-bolder">{{ 'Basic Information' }}</h5>
                            <div class="row">
                                <div class="form-group col-md-6">
                                    <label for="name" class="mt-2"> Name <span class="text-danger">*</span></label>
                                    <input type="text" name="name" class="form-control @error('name') is-invalid @enderror" placeholder="Name" value="{{ old('name', isset($data) ? $data->name : '') }}" >
                                    @error('name')
                                        <span class="invalid-feedback form-invalid fw-bold" role="alert">
                                            {{ $message }}
                                        </span>
                                    @enderror
                                </div>

                                <div class="form-group col-md-6">
                                    <label for="name" class="mt-2"> Email </label>
                                    <input type="email" name="email" class="form-control @error('email') is-invalid @enderror" placeholder="Email" value="{{ old('email', isset($data) ? $data->email : '') }}" >
                                    @error('email')
                                        <span class="invalid-feedback form-invalid fw-bold" role="alert">
                                            {{ $message }}
                                        </span>
                                    @enderror
                                </div>
                            </div>

                            <div class="row">
                                <div class="form-group col-md-6 mt-auto">
                                    <label for="name" class="mt-2"> Phone <span class="text-danger">*</span></label>
                                    <input type="number" name="phone" class="form-control spin @error('phone') is-invalid @enderror" placeholder="Phone" value="{{ old('phone', isset($data) ? $data->phone : '') }}" min="0" minlength="10" maxlength="10" required>
                                    @error('phone')
                                        <span class="invalid-feedback form-invalid fw-bold" role="alert">
                                            {{ $message }}
                                        </span>
                                    @enderror
                                </div>

                                <div class="form-group col-md-6">
                                    @if(!empty($data->profile_image))
                                        <div class="mt-3">
                                            <span class="pip" data-title="{{$data->profile_image}}">
                                                <img src="{{ url(config('app.profile_image')).'/'.$data->profile_image ?? '' }}" alt="" width="150" height="100">
                                            </span>
                                        </div>
                                    @endif
                                    <label for="profile_image" class="mt-2"> Profile Image <span class="text-danger info">(Only jpeg, png, jpg files allowed)</span></label>
                                    <input type="file" name="profile_image" class="form-control @error('profile_image') is-invalid @enderror" accept="image/jpeg,image/png">
                                    <input type="hidden" class="form-control" name="profileImageOld" value="{{ isset($data) ? $data->profile_image : ''}}">
                                    @error('profile_image')
                                        <span class="invalid-feedback form-invalid fw-bold" role="alert">
                                            {{ $message }}
                                        </span>
                                    @enderror
                                </div>
                            </div>

                            <div class="row">
                                <div class="form-group col-md-6  @error('password') show @enderror">
                                    <label for="name" class="mt-2"> Password  <span class="text-danger">{{ isset($data) && isset($data->id) ? '' : '*' }}</span> <i class="mdi mdi-information-outline" data-toggle="tooltip" data-placement="right" title="Password must contain atleast one Lower case letter, atleast one Upper case letter, atleast one Number and atleast one Special character."></i></label>
                                    <input type="password" name="password" class="form-control @error('password') is-invalid @enderror" placeholder="Password" minlength="8" {{ isset($data) ? '' : 'required' }}>
                                    @error('password')
                                    <span class="invalid-feedback form-invalid fw-bold" role="alert">
                                        {{ $message }}
                                    </span>
                                    @enderror
                                </div>
                                <div class="form-group col-md-6">
                                    <label class="mt-2">Role <span class="text-danger">*</span></label>
                                    <select name="role[]" class="form-control role select2 form-select @error('role') is-invalid @enderror" multiple  required onchange="addinput(this)">
                                        @foreach($roles as $key => $value) 
                                            <option value="{{ $key }}" {{ (in_array($key, old('role', [])) || isset($data) && $data->roles->contains($key)) ? 'selected' : '' }}>{{ $value }}</option>
                                        @endforeach
                                        
                                    </select>
                                    @error('role')
                                        <span class="invalid-feedback form-invalid fw-bold" role="alert">
                                            {{ $message }}
                                        </span>
                                    @enderror
                                </div>
                                <div class="row" id="emp" style="display:none;" >
                                    <div class="form-group col-md-6  @error('password') show @enderror">
                                        <label for="gender" class="mt-2"> Gender  <span class="text-danger">{{ isset($data) && isset($data->id) ? '' : '*' }}</span> </label>
                                        <select name="gender" id="" class="form-control" disabled>
                                            <option value="male" class="form-control">Male</option>
                                            <option value="female" class="form-control">Female</option>
                                        </select>
                                        @error('gender')
                                        <span class="invalid-feedback form-invalid fw-bold" role="alert">
                                            {{ $message }}
                                        </span>
                                        @enderror 
                                    </div>
                                </div>
                            </div>
                            
                            <div class="mt-3">
                                <input class="btn btn-primary" type="submit" value="Save">
                            </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
    <script>   
        function myFunction(field) {
    $.ajax({
        url: "/onchange",
        type: "POST",
        data: {
            field_name: field.gender,
            field_value: field.value,
            _token: "{{ csrf_token() }}"
        },
        success: function (response) {
          alert(vcvcv);
        },
        error: function (xhr, status, error) {
        alert(hhhhh);
        }
    });
}
    </script>
    <script>
 function addinput(val){


     let id=val;
     console.log(id);
     var myDiv = document.getElementById("emp");
      
     if(id==3){
    // Set the display property of the div to "block"
    myDiv.style.display = "block";
    // Get a reference to all the input fields within the div
    var inputs = myDiv.getElementsByTagName("select,input");
     
    // Enable all the input fields
    for (var i = 0; i < inputs.length; i++) {
        inputs[i].disabled = false;
    }
     }
     else{
        myDiv.style.display = "none";
        var inputs = myDiv.getElementsByTagName("select,input");
     
    // Enable all the input fields
    for (var i = 0; i < inputs.length; i++) {
        inputs[i].disabled = true;
    }

     }

 }
    </script>
@endsection