@extends('layout.adminapp')
@section('content')
    <style>
    .select2-results__option[aria-selected=true] {
    display: none;
}
        img.profile {
            clip-path: circle();
            width: 150px;
            height: 150px;
        }

        img.profile:hover {
            -webkit-filter: brightness(70%);
            -webkit-transition: all 1s ease;
            -moz-transition: all 1s ease;
            -o-transition: all 1s ease;
            -ms-transition: all 1s ease;
            transition: all 1s ease;
        }

        .centered {
            position: absolute;
            top: 50%;
            /* left: 50%; */
            transform: translate(-50%, -50%);
        }

        .img_wrap {
            position: relative;
            text-align: left;
        }
    </style>
    <div class="container-fluid">
        <a href="edit-seeker">Go Back</a>

        <!-- Outer Row -->
        <div class="row justify-content-center">

            <div class="col-xl-10 col-lg-12 col-md-9 my-5">

                <div class="card o-hidden border-0 shadow-lg my-5">

                    <!-- Nested Row within Card Body -->
                    <div class="row d-flex justify-content-center">
                        <div class="col-lg-6">
                            <div class="p-5">
                                @if (Session::has('status'))
                                    <div class="alert alert-success">
                                        <ul>
                                            <li>{{ Session::get('status') }}</li>
                                        </ul>
                                    </div>
                                @endif
                                <div class="text-center">
                                    <h1 class="h4 text-gray-900 mb-4">Edit Job Seeker</h1>
                                </div>
                                <div class="d-flex justify-content-between align-items-center">
                                <form action="{{ route('seeker-update-img') }}" method="POST"
                                    enctype="multipart/form-data">
                                    @csrf
                                    <div class="img_wrap">
                                        <img class="profile" id="image"
                                            src="{{ asset('images/jobseeker/' . $member['attachment']) }}" />
                                        <p class="centered" id="centered" style="display:none">Change Image.</p>
                                    </div>
                                    <input type="hidden" value="{{ $member['id'] }}" name="id" />
                                    <input type="file" id="myfile" name="image" style="display:none" />
                                    <input type="submit" id="submit" style="display:none">
                                </form>
                                
                                
                            </div>
                            
                                <form method="POST" action="update-jobseeker">
                                    @csrf
                                    <input type="hidden" name="id" value="{{ $member['id'] }}">
                                    <div class="form-group">
                                        <label for="name">Name</label>
                                        <input type="text" class="form-control form-control-user" name="name"
                                            value="{{ $member['name'] }}">
                                    </div>
                                    <div class="form-group">
                                        <label for="">Nationality</label>
                                        <input type="text" class="form-control form-control-user" name="nationality"
                                            value="{{ $member['nationality'] }}">
                                    </div>
                                    <div class="form-group">
                                        <label for="">Contact</label>
                                        <input type="text" class="form-control form-control-user" name="ph_no"
                                            value="{{ $member['phone_number'] }}">
                                    </div>
                                    <div class="form-group">
                                        <label for="">Email</label>
                                        <input type="text" class="form-control form-control-user" name="email"
                                            value="{{ $member['email'] }}">
                                    </div>
                                    <div class="form-group">
                                        <label for="">Date of Birth</label>
                                        <input type="date" class="form-control form-control-user" name="dob"
                                            value="{{ $member['dob'] }}">
                                    </div>
                                    <div class="form-group">
                                        <label for="">Gender</label>
                                        <input type="text" class="form-control form-control-user" name="gender"
                                            value="{{ $member['gender'] }}">
                                    </div>
                                    <div class="form-group">
                                        <label for="">Driving License</label>
                                        <input type="text" class="form-control form-control-user" name="driving_license"
                                            value="{{ $member['driving_license'] }}">
                                    </div>
                                    <div class="form-group">
                                        <label for="">Discription</label><br>
                                        <textarea name="description" class="form-control" rows="4">{{ $member['description'] }}</textarea>
                                    </div>
                                    <div class="form-group">
                                        <label for="">Join Availability</label>
                                        <input type="text" class="form-control form-control-user"
                                            name="join_availability" value="{{ $member['join_availability'] }}">
                                    </div>
                                    <div class="form-group">
                                        <!--<label for="">Expected Salary</label>-->
                                        <input type="hidden" class="form-control form-control-user" name="min"
                                            value="{{ $member['salary_min'] }}">
                                        <input type="hidden" class="form-control form-control- my-1" name="max"
                                            value="{{ $member['salary_max'] }}">
                                    </div>
                                    <div class="form-group">
                                        <label for="name">Skills</label>
                                        <!--@foreach($skill_name as $item)-->
                                        <!--<input type="text" class="form-control form-control-user" value="{{$item}}" readonly>-->
                                        <!--@endforeach-->
                                        <select  class="form-control form-control-user" name="skill[]" id="skill" multiple="multiple" required>
                                            @foreach($skill_name as $item)
                                            <option value="{{$item['id']}}" selected>{{$item['name']}}</option>
                                            @endforeach
                                            @foreach($skill as $item)
                                            <option value="{{$item['id']}}">{{$item['name']}}</option>
                                            @endforeach
                                        </select>
                                    </div>

                                    <button class="btn btn-primary btn-user btn-block" type="submit">
                                        UPDATE
                                    </button>

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

            </div>

        </div>

    </div>
@endsection
@section('script')
    <script>
        $('#image').click(function() {
            $('#myfile').click()
        });
        $('#myfile').change(function() {
            $('#submit').click()
        });
        // document.getElementById("image").onmouseover = function() 
        // {
        //     console.log("hover");
        //     document.getElementById('centered').style.display = "block";
        // }
        // document.getElementById("image").onmouseout = function() 
        // {
        //     console.log("hover");
        //     document.getElementById('centered').style.display = "none";
        // }
        $(document).ready(function(){
            $("#skill").select2({
        // theme: "classic",
        placeholder: "Select Skills",
          allowClear: true
        });
        })
    </script>
@endsection