@extends('layouts.app')

@section('content')
<div class="row">
    
    <div class="col-lg-12 col-md-12 col-sm-12 mb-3">
<h1>Edit User Info: {{$user->name}}</h1>
        <!-- Button trigger modal -->
        <button type="button" class="btn btn-sm btn-info" style="background-color:{{$color}}" data-toggle="modal"
            data-target="#singModal" id="create_sign_btn">
            Create Signature
        </button>
        <button type="button" class="btn btn-sm btn-elegant btn-warning"  data-toggle="modal"
            data-target="#permissions" id="edit_permissions">
            Edit Permissions
        </button>
        <p id="created_sign_p" class="inline font-weight-bold mt-1" style="color:{{$color}};">{{$signature_exist}}</p>
    </div>

</div>
<hr>
<div class="row">
    <div class="col-12">
        <div class="card">
            <div class="card-header">
                Edit User
            </div>
            <div class="card-body">
                    <form method="POST" enctype="multipart/form-data" action="{{ route('staff.update',$user->id) }}" class="col-md-12 col-lg-12 col-sm-12" >
        <input type="hidden" name="_method" value="PUT">
        {{ csrf_field() }}

        <div class="row form-row ">
            <div class="form-group col-md-3 col-lg-3 col-sm-3">
                <label>Phone</label>
                <input type="text" name="phone" value="{{$user->phone}}" class="form-control">
            </div>
            <div class="form-group col-md-3 col-lg-3 col-sm-3">
                <label>Passport#</label>
                <input type="text" name="passport" value="{{$user->passport}}" class="form-control">
            </div>
            <div class="form-group col-md-3 col-lg-3 col-sm-3">
                <label>Driving licence#</label>
                <input type="text" name="driving_lic" value="{{$user->driving_lic}}" class="form-control">
            </div>
            <div class="form-group col-md-3 col-lg-3 col-sm-3">
                <label>Visa#</label>
                <input type="text" name="visa" value="{{$user->visa}}" class="form-control">
            </div>
        </div>

        <div class=" row form-row">

            <div class="form-group col-md-3 col-lg-3 col-sm-3">
                <label>Driving licence Expiry</label>
                <input type="date" name="driving_lic_enddate" value="{{$user->driving_lic_enddate}}"
                    class="form-control">
            </div>
            <div class="form-group col-md-3 col-lg-3 col-sm-3">
                <label>Passport Expiry</label>
                <input type="date" name="pass_enddate" value="{{$user->pass_enddate}}" class="form-control">
            </div>
            <div class="form-group col-md-3 col-lg-3 col-sm-3">
                <label>Visa Expiry</label>
                <input type="date" name="visa_enddate" value="{{$user->visa_enddate}}" class="form-control">
            </div>
            <div class="form-group col-md-3 col-lg-3 col-sm-3">
                <label>Emirates ID Expiry</label>
                <input type="date" name="emirate_id_enddate" value="{{$user->emirate_id_enddate}}" class="form-control">
            </div>
        </div>
        <div class="row form-row">
            <div class="form-group col-md-3 col-lg-3 col-sm-3">
                <label>Emirates ID</label>
                <input type="text" name="emirates_uid" value="{{$user->emirates_uid}}" class="form-control">
            </div>
            <div class="form-group col-md-3 col-lg-3 col-sm-3">
                <label>Education</label>
                <input type="text" name="education" value="{{$user->education}}" class="form-control">
            </div>
            <div class="form-group col-md-3 col-lg-3 col-sm-3">
                <label>Department</label>
                <select class="form-control" name="department_id">
                    <option selected value={{$user->department->id}}>{{$user->department->name}}</option>
                    @foreach($departments as $department)
                    @if($department->id != $user->department->id)
                    <option value={{$department->id}}>{{$department->name}}</option>
                    @endif
                    @endforeach
                </select>
            </div>
            <div class="form-group col-md-3 col-lg-3 col-sm-3">
                <label>Equipment list</label>
                <select name="equipment_user[]" multiple class="selectpicker" data-live-search="true"
                    title="Choose Equipment" data-actions-box="true" data-selected-text-format="count">
                    @foreach($equipments as $equipment)
                    <option value="{{$equipment->id}}" {{ (in_array($equipment->id, $u_eq_ids)  ) ? "selected":""}}>

                        {{$equipment->name}}
                    </option>
                    @endforeach
                </select>
            </div>
        </div>
        <div class=" row form-row">
            <div class="form-group col-md-3 col-lg-3 col-sm-3">
                <label>Designation</label>
                <input type="text" name="title" value="{{$user->title}}" class="form-control">
            </div>
        </div>
        <hr>

        <div class=" row form-row">

            <div class="form-group col-md-6 col-lg-3 col-sm-12 mr-2 ">
                <label for="user_hr_document" class="custom-file-label "><i class="fa fa-cloud-upload mr-1"></i>Upload
                    User Document</label>
                <input type="file" class="custom-file-input file_upload" name="user_hr_document"
                    accept="application/pdf">
            </div>
            <div class="form-group col-md-6 col-lg-3 col-sm-12 mr-2 ">
                <label for="user_hr_photo" class="custom-file-label "><i class="fa fa-picture-o mr-1"></i>Upload User
                    Photo</label>
                <input type="file" class="custom-file-input file_upload" name="user_hr_photo" accept="image/*">
            </div>
        </div>
        <hr>
        <div class=" row form-row">
            <div class="form-check form-check-inline border p-1 form-group col-md-6 col-lg-2 col-sm-12"
                style="border-radius:5px;box-shadow: 0px 0px 4px blueviolet;">
                <label class="form-check-label mr-1" for="car">Enabled? </label>
                <input class="form-check-input" type="checkbox" value=1 name="status" {{$user->status? "checked":""}}>
            </div>
            <div class="form-check form-check-inline border p-1 form-group col-md-6 col-lg-2 col-sm-12"
                style="border-radius:5px;box-shadow: 0px 0px 4px blueviolet;">
                <label class="form-check-label mr-1" for="car">Have a Car? </label>
                <input class="form-check-input" type="checkbox" value=1 id="car" name="car"
                    {{$user->car? "checked":""}}>
            </div>

        </div>

        <div class="row form-row mt-2">
            <div class="col-12">
                <button type="submit" class="btn btn-primary">Update Info</button>
            </div>

        </div>


    </form>
            </div>
        </div>
    </div>

</div>
<hr>
<div class="row">


    <!-- Modal -->
    <div class="modal fade" id="singModal" tabindex="-1" role="dialog" aria-labelledby="singModalLabel"
        aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="singModalLabel">Modal title</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div id="signArea">
                            <h2 class="tag-info">Put signature below,</h2>
                            <div id="canvas_div" class="sig sigWrapper">
                                <canvas class="sign-pad" id="sign-pad" width="400px;" height="200px;"></canvas>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-outline-warning" data-dismiss="modal">Close</button>
                    <button type="button" id="signature_clear_btn"
                        class="btn btn-elegant btn-outline-success btn-deep-orange">Clear</button>
                    <button type="button" user_id={{$user->id}} id="signature_save_btn"
                        class="btn btn-outline-primary">Save</button>
                </div>
            </div>
        </div>
    </div>
</div>
 <div class="row">
     <div class="modal fade" id="permissions" tabindex="-1" role="dialog" aria-labelledby="permissionsModalLabel"
        aria-hidden="true">
        <div class="modal-dialog modal-lg modal-dialog-scrollable" role="document">
            <div class="modal-content modal-lg">
                <div class="modal-header">
                <h5 class="modal-title" id="permissionsModalLabel">{{$user->name}} - Permissions:</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="col-lg-12 col-md-12 col-sm-12">
                        <form action="{{route('sync_permissions')}}" method="post">
                            {{ csrf_field() }}
                                <input type="hidden" value={{$user->id}} name="user_id">
                                <ul class="list-inline list-group-horizontal scrollbar-dusty-grass  block"
                                style="overflow-y: auto;overflow-x: hidden; height:400px; max-height:70%;">
                                    <div class="row m-auto">
                                        @foreach ($permissions as $perm)
                                        @php
                                        $checked = "";
                                            if($user->hasPermissionTo($perm->id)){
                                                $checked = "checked";
                                            }
                                        @endphp


                                        <div class=" col-lg-4 col-md-6 col-sm-12 form-check-inline p-1 m-1 border-bottom border-left">
                                            <label class="form-check-label">
                                            <input {{$checked}} type="checkbox" class="form-check-input" name="perms[]" value="{{$perm->id}}">
                                                <li class="list-inline-item flex-fill">{{$perm->name}}</li>
                                            </label>
                                        </div>
                                    @endforeach
                                    </div>
                                </ul>
                            <button type="submit" class="btn btn-sm btn-primary">Save</button>
                            </form>
                        </div>
                </div>
                {{-- <div class="modal-footer">
                    <button type="button" class="btn btn-outline-warning" data-dismiss="modal">Close</button>

                    <button type="button" user_id={{$user->id}} id="permissions_save_btn"
                        class="btn btn-outline-primary">Save</button>
                </div> --}}
            </div>
        </div>
    </div>

</div>
@endsection