@extends('layouts.app')
@php
$userPermission = \Session::get('userPermission');
$organization_type = \Session::get('organization_type');
@endphp
@section('content')
    <div class="nk-block-head nk-block-head-sm">
        <div class="nk-block-between">
            <div class="nk-block-head-content">
                <h3 class="nk-block-title page-title"><a href="javascript:history.back()" class="pt-3"><em class="icon ni ni-chevron-left back-icon"></em> </a> @if (isset($user)) Edit @else Add @endif User</h3>
            </div><!-- .nk-block-head-content -->
        </div><!-- .nk-block-between -->
    </div><!-- .nk-block-head -->
    <form role="form" method="post" enctype="multipart/form-data"  >
        @csrf
        <div class="nk-block">
            <div class="card card-bordered sp-plan">
                <div class="row no-gutters">
                    <div class="col-md-3">
                        <div class="sp-plan-action card-inner">
                            <div class="icon">
                                <em class="icon ni ni-box fs-36px o-5"></em>
                                <h5 class="o-5">Role Information</h5>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-9">
                        <div class="sp-plan-info card-inner">
                            <div class="row g-3 align-center">
                                <div class="col-lg-5">
                                    <x-inputs.verticalFormLabel label="Role" for="role" suggestion="Select the role of the user." required="true" />
                                </div>
                                <div class="col-lg-7">
                                    <x-inputs.select  size="sm" required="true" name="role" for="role" data-search="on" class="roles">
                                        <option value="">Select Role</option>
                                        @foreach ($roles as $role)

                                        <option
                                        @if(isset($user) && $user->role_id == $role->id)
                                        selected
                                        @elseif(old('role') == $role->id) 
                                        selected
                                        @endif
                                        value="{{ $role->id }}">{{ $role->label }}</option>
                                        @endforeach
                                    </x-inputs.select>
                                    @if ($errors->has('role'))
                                        <span class="text-danger">{{ $errors->first('role') }}</span>
                                    @endif
                                </div>
                            </div>
                            <div class="row g-3 align-center">
                                <div class="col-lg-5">
                                    <x-inputs.verticalFormLabel label="Reporting To" for="reporting_to" suggestion="Select the reporting person of the user." />
                                </div>
                                <div class="col-lg-7">
                                    <x-inputs.select  size="sm" name="reporting_to" for="reporting_to" data-search="on" class="reporting_to">
                                        <option value="">Select User</option>
                                        @foreach ($users as $reportingUser)
                                        <option
                                        @if(isset($user) && $user->reporting_to == $reportingUser->id)
                                        selected
                                        @endif
                                        value="{{ $reportingUser->id }}">{{ $reportingUser->name }}</option>
                                        @endforeach
                                    </x-inputs.select>
                                    @if ($errors->has('reporting_to'))
                                        <span class="text-danger">{{ $errors->first('reporting_to') }}</span>
                                    @endif
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div><!-- .nk-block -->
        
        <div class="nk-block">
            <div class="card card-bordered sp-plan">
                <div class="row no-gutters">
                    <div class="col-md-3">
                        <div class="sp-plan-action card-inner">
                            <div class="icon">
                                <em class="icon ni ni-box fs-36px o-5"></em>
                                <h5 class="o-5">Personal <br> Information</h5>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-9">
                        <div class="sp-plan-info card-inner">
                            <div class="row g-3 align-center">
                                <div class="col-lg-5">
                                    <x-inputs.verticalFormLabel label="First Name" for="firstName" suggestion="Specify the first name of the user." required="true" />
                                </div>
                                <div class="col-lg-7">
                                    <x-inputs.text  value="{{ isset($user) ? $user->name : old('firstname') }}" for="firstName" icon="user" placeholder="First name" name="firstname" required="true" />
                                    @if ($errors->has('firstname'))
                                        <span class="text-danger">{{ $errors->first('firstname') }}</span>
                                    @endif
                                </div>
                            </div>
                            <div class="row g-3 align-center">
                                <div class="col-lg-5">
                                    <x-inputs.verticalFormLabel label="Last Name" for="lastName" suggestion="Specify the last name of the user." />
                                </div>
                                <div class="col-lg-7">
                                    <x-inputs.text value="{{ isset($user) ? $user->last_name : old('lastname') }}" for="lastName" icon="user" placeholder="Last name" name="lastname"/>
                                    @if ($errors->has('lastname'))
                                        <span class="text-danger">{{ $errors->first('lastname') }}</span>
                                    @endif
                                </div>
                            </div>
                            <div class="row g-3 align-center">
                                <div class="col-lg-5">
                                    <x-inputs.verticalFormLabel label="Email" for="email" suggestion="Specify the email of the user." required="true" />
                                </div>
                                <div class="col-lg-7">
                                    <x-inputs.email value="{{ isset($user) ? $user->email : old('email') }}" for="email" icon="mail" required="true" class="" placeholder="Email" name="email" />
                                    <!-- @if ($errors->has('email'))
                                        <span class="text-danger custom-error-text">{{ $errors->first('email') }}</span>
                                    @endif -->
                                </div>
                            </div>
                            <div class="row g-3 align-center">
                                <div class="col-lg-5">
                                    <x-inputs.verticalFormLabel label="Mobile Number" for="mobileNumber" suggestion="Specify the mobile number of the user." required="true" />
                                </div>
                                <div class="col-lg-7">
                                    <x-inputs.number value="{{ isset($user) ? $user->phone_number : old('mobileNumber') }}" for="mobileNumber" class="" icon="call" required="true" placeholder="Mobile Number" name="mobileNumber" 
                                    data-parsley-pattern="{{ \Config::get('constants.REGEX.VALIDATE_MOBILE_NUMBER_LENGTH') }}"
                                    />
                                    @if ($errors->has('mobileNumber'))
                                        <span class="text-danger">{{ $errors->first('mobileNumber') }}</span>
                                    @endif
                                </div>
                            </div>


                           <div class="row g-3 align-center">
                                <div class="col-lg-5">
                                    <x-inputs.verticalFormLabel label="Region" for="region[]" suggestion="Select the region" />
                                </div>
                                <div class="col-lg-7">
                                    <x-inputs.select size="sm" name="region[]" for="region" data-search="on" multiple>
                                        <option value="">Select Region</option>
                                        @foreach ($regions as $region)
                                            <option value="{{ $region->id }}" 
                                                {{ in_array($region->id ,old('region', $userRegion ?? [])) ? 'selected' : '' }}>
                                                {{ $region->region_name }}
                                            </option>
                                        @endforeach

                                    </x-inputs.select>
                                    @if ($errors->has('region'))
                                        <span class="text-danger">{{ $errors->first('region') }}</span>
                                    @endif
                                </div>
                            </div>

                            <div class="row g-3 align-center">
                                <div class="col-lg-5">
                                    <x-inputs.verticalFormLabel label="Area" for="area[]" suggestion="Select the area" />
                                </div>
                                <div class="col-lg-7">
                                    <x-inputs.select size="sm" name="area[]" for="area" data-search="on" multiple>
                                        <option value="">Select Area</option>
                                        @foreach ($area as $a)
                                        <option value="{{ $a->id }}" {{ in_array($a->id, old('area', $userAreas ?? [])) ? 'selected' : '' }}>
                                            {{ $a->area_name }}
                                        </option>

                                        @endforeach
                                    </x-inputs.select>
                                    @if ($errors->has('area'))
                                        <span class="text-danger">{{ $errors->first('area') }}</span>
                                    @endif
                                </div>
                            </div>

                            <div class="row g-3 align-center">
                                <div class="col-lg-5">
                                    <x-inputs.verticalFormLabel label="Product" for="product[]" suggestion="Specify the name of the product." />
                                </div>
                                <div class="col-lg-7">
                                    <x-inputs.select size="sm" name="product[]" for="product" data-search="on" multiple>
                                        <option value="">Select Product</option>
                                        @foreach ($products as $product)
                                            <option value="{{ $product->id }}" 
                                                {{ in_array($product->id, old('product', $userProduct ?? [])) ? 'selected' : '' }}>
                                                {{ $product->product_name }}
                                            </option>
                                        @endforeach


                                    </x-inputs.select>
                                    @if ($errors->has('product'))
                                        <span class="text-danger">{{ $errors->first('product') }}</span>
                                    @endif
                                </div>
                            </div>

                            <div class="row g-3 align-center">
                                <div class="col-lg-5">
                                    <x-inputs.verticalFormLabel label="Segment" for="segment[]" suggestion="Specify the segment for the product." />
                                </div>
                                <div class="col-lg-7">
                                    <x-inputs.select size="sm" name="segment[]" for="segment" data-search="on" multiple>
                                        <option value="">Select Segment</option>
                                        @foreach ($segments as $segment)
                                        <option value="{{ $segment->id }}" {{ in_array($segment->id, old('segment', $userSegments ?? [])) ? 'selected' : '' }}>
                                            {{ $segment->application_name }}
                                        </option>
                                        @endforeach
                                    </x-inputs.select>
                                    @if ($errors->has('segment'))
                                        <span class="text-danger">{{ $errors->first('segment') }}</span>
                                    @endif
                                </div>
                            </div>



                            <!-- <div class="row g-3 align-center">
                                <div class="col-lg-5">
                                    <x-inputs.verticalFormLabel label="Approved" for="approved" suggestion="Specify the approval of the user." required="true" />
                                </div>
                                <div class="col-lg-7">
                                    <x-inputs.switch for="approved" size="md" name="approved"/>
                                </div>
                            </div> -->
                            
                        </div>
                    </div>
                </div>
            </div>
        </div><!-- .nk-block -->
        
        <div class="nk-block userFoundBox">
            <div class="card card-bordered sp-plan">
                <div class="row no-gutters">
                    <div class="col-md-3">
                        <div class="sp-plan-action card-inner">
                            <div class="icon">
                                <em class="icon ni ni-user fs-36px o-5"></em>
                                <h5 class="o-5">Image</h5>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-9">
                        <div class="sp-plan-info card-inner">
                            <div class="row g-3 align-center">
                                <div class="col-lg-5">
                                    <x-inputs.verticalFormLabel label="Profile Image" for="Picture" suggestion="Upload the picture of the user." />
                                </div>
                                <div class="col-lg-7">
                                    <div class="form-group">
                                        <div class="form-control-wrap">
                                            <div class="custom-file">
                                                <input type="file" class="custom-file-input userFoundInput" name="file"  id="customFile">
                                                <label class="custom-file-label" for="customFile">Choose file</label>
                                                @if ($errors->has('file'))
                                                    <span class="text-danger">{{ $errors->first('file') }}</span>
                                                @endif
                                            </div>
                                            @if(isset($user) && !is_null($user->file))
                                            <div class="media_box">
                                                <img height="100" width="100" src="{{url('uploads/users/'.$user->file)}}">
                                                <a href="javascript:void(0);" data-id="{{ $user->id }}" class="removeMedia">
                                                    <i class="fa fa-trash"></i> Remove
                                                </a>
                                            </div>
                                            @endif
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div><!-- .nk-block -->
        @if(!isset($user))
        <div class="nk-block userFoundBox">
            <div class="card card-bordered sp-plan">
                <div class="row no-gutters">
                    <div class="col-md-3">
                        <div class="sp-plan-action card-inner">
                            <div class="icon">
                                <em class="icon ni ni-lock fs-36px o-5"></em>
                                <h5 class="o-5">Security</h5>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-9">
                        <div class="sp-plan-info card-inner">
                            
                            <div class="row g-3 align-center">
                                <div class="col-lg-5">
                                    <x-inputs.verticalFormLabel label="Password" for="password" suggestion="Specify the password of the user." required="true" />
                                </div>
                                <div class="col-lg-7">
                                    <x-inputs.password value="" for="password" required="true" icon="lock" placeholder="Password" name="password" class="userFoundInput"/>
                                    @if ($errors->has('password'))
                                        <span class="text-danger custom-error-text">{{ $errors->first('password') }}</span>
                                    @endif
                                </div>
                            </div>
                            <div class="row g-3 align-center">
                                <div class="col-lg-5">
                                    <x-inputs.verticalFormLabel label="Confirm Password" for="password_confirmation" suggestion="Specify the confirm password of the user." required="true" />
                                </div>
                                <div class="col-lg-7">
                                    <x-inputs.password value="" for="password_confirmation" icon="lock" placeholder="Confirm password" name="password_confirmation" class="userFoundInput"/>
                                    @if ($errors->has('password_confirmation'))
                                        <span class="text-danger custom-error-text">{{ $errors->first('password_confirmation') }}</span>
                                    @endif
                                </div>
                            </div>
                            
                        </div>
                    </div>
                </div>
            </div>
        </div><!-- .nk-block -->
        @endif
        <div class="nk-block">
            <div class="card card-bordered sp-plan">
                <div class="row no-gutters">
                    <div class="col-md-3">
                        <div class="sp-plan-action card-inner">
                            <div class="icon">
                                <em class="icon ni ni-thumbs-up fs-36px o-5"></em>
                                <h5 class="o-5">Approval</h5>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-9">
                        <div class="sp-plan-info card-inner">
                            <div class="row g-3 align-center">
                                <div class="col-lg-5">
                                    <x-inputs.verticalFormLabel label="Status" for="approved" suggestion="Specify the status of the user." />
                                </div>
                                <div class="col-lg-7">

                                    @php
                                        if(isset($user) && $user->status){
                                            $checked = 'checked';
                                        }else{
                                            $checked = '';
                                        }
                                    @endphp
                                    <x-inputs.switch for="approved" size="md" name="approved" checked={{$checked}}/>
                                    @if ($errors->has('approved'))
                                        <span class="text-danger">{{ $errors->first('approved') }}</span>
                                    @endif
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div><!-- .nk-block -->        
        <div class="nk-block">
            @isset($user)
                <input type="hidden" name="userId" id="userId" value="{{ $user->id }}">
            @endisset
            <div class="row">
                <div class="col-md-12">
                    <div class="sp-plan-info pt-0 pb-0 card-inner">  
                            <div class="row">
                                <div class="col-lg-7 text-right offset-lg-5">
                                    <div class="form-group">
                                        <a href="javascript:history.back()" class="btn btn-outline-light">Cancel</a>
                                        <x-button type="submit" class="btn btn-primary">Submit</x-button>
                                    </div>
                                </div>
                            </div>
                    </div><!-- .sp-plan-info -->
                </div><!-- .col -->
            </div><!-- .row -->
        </div>
        <input type="hidden" name="userFound" id="userFound" value="0">
    </form>

    <input type="hidden" name="role_type" id="role_type" value="{{\Config::get('constants.ROLES.BUYER')}}">
    <input type="hidden" name="old_district" id="old_district" value="{{old('district')}}">
    <input type="hidden" name="old_city" id="old_city" value="{{old('city')}}">

    <script type="text/javascript">

        $(document).ready(function(){

            $('.checkUser').blur(function(){

                var userFound = $('#userFound').val();

                if(userFound == 0){
                    var root_url = "