@extends('admin.layouts.main-layout')
@section('content')
    <!-- Content Header (Page header) -->
    <div class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1 class="m-0">Edit Candidate Missing Fields</h1>
                </div>
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                      <li class="breadcrumb-item"><a href="{{route('ai-missingfield.index')}}">AI Missing Field Candidates</a></li>
                      <li class="breadcrumb-item active">Edit Candidate</li>
                    </ol>
                </div>
            </div><!-- /.row -->
        </div><!-- /.container-fluid -->
    </div>
    <section class="content">
        <div class="container-fluid">
            <div class="card card-light">
                    @if ($errors->any())
                        <div class="alert alert-danger alert-dismissible">
                            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                            Please resolve following errors:
                            <ul>
                                @foreach ($errors->all() as $error)
                                    <li>{{ $error }}</li>
                                @endforeach
                            </ul>
                        </div>
                    @endif
                    <form method="POST" id="updateCandidate" action="{{ route('ai-missingfield.update', ['id'=>$missingFieldCandidate->id]) }}">
                    @csrf
                    <input type="hidden" value="{{$missingFieldCandidate->candidate_id}}" name="candidate_id" />
                    <div class="card-body">
                        <div class="alert alert-danger alert-dismissible d-none">
                            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                            <i class="icon fas fa-check"></i>
                            <span id="alertMessage"></span>
                        </div>
                        <div class="row">
                            <div class="col-12">
                                <div class="form-group">
                                    <label>Candidate Name: </label><br>
                                    {{$missingFieldCandidate->candidate->full_name}}
                                </div>
                            </div>

                            <div class="col-12">
                                <div class="form-group">
                                    <label>Firm Name: </label><br>
                                    {{$missingFieldCandidate->candidate->firm->name}}
                                </div>
                            </div>

                            <div class="col-12">
                                <div class="form-group">
                                    <label>Url: </label><br>
                                    <a href="{{$missingFieldCandidate->candidate->url}}" target="_blank">{{$missingFieldCandidate->candidate->url}}</a>
                                </div>
                            </div>
                            @php
                                $fields = $missingFieldCandidate->missing_fields;
                            @endphp

                            @if (in_array('jd_year', $fields))
                            <div class="col-12">
                                <div class="form-group">
                                    <label for="jd_year">Graduation Year: </label>
                                    <input type="text" class="form-control" name="jd_year" value="{{$missingFieldCandidate->candidate->jd_year}}" id="jd_year" placeholder="enter graduation year">
                                    <span class="invalid-feedback jd_year" role="alert">
                                        <span></span>
                                    </span>
                                </div>
                            </div>
                            @endif

                            @if (in_array('email', $fields))
                            <div class="col-12">
                                <div class="form-group">
                                    <label for="email">Email Address: </label>
                                    <input type="text" class="form-control" name="email" value="{{$missingFieldCandidate->candidate->email}}" id="email" placeholder="enter email address">
                                    <span class="invalid-feedback email" role="alert">
                                        <span></span>
                                    </span>
                                </div>
                            </div>
                            @endif

                            @php
                                $candidateFirmOffices = $missingFieldCandidate->candidate->firmOffices->pluck('id')->toArray();
                                $candidateTitles = $missingFieldCandidate->candidate->titles->pluck('id')->toArray();
                            @endphp
                            @if (in_array('title', $fields))
                            <div class="col-12">
                                <div class="form-group">
                                    <label for="first_name">Title: </label>
                                    <select class="select2" multiple name="title[]" id="title" style="width: 100%;">
                                        <option value="">-select-</option>
                                        @foreach ($existingTitles as $title)
                                            <option value="{{ $title->id }}" {{ in_array($title->id, $candidateTitles) ? 'selected' : '' }}>{{ $title->name }}</option>
                                        @endforeach
                                    </select>
                                    <span class="invalid-feedback title" role="alert">
                                        <span></span>
                                    </span>
                                </div>
                            </div>
                            @endif

                            @if (in_array('location', $fields))
                            <div class="col-12">
                                <div class="form-group">
                                    <label for="first_name">Firm Office: </label>
                                    <select class="select2" multiple name="firm_office[]" id="firm_office" style="width: 100%;">
                                        <option value="">-select-</option>
                                        @foreach ($missingFieldCandidate->candidate->firm->Offices as $office)
                                            @if($office->status == config('constants.status.default.inactive'))
                                                @continue
                                            @endif
                                            <option value="{{ $office->id }}" {{ in_array($office->id, $candidateFirmOffices) ? 'selected' : '' }}  >{{ $office->name }}</option>
                                        @endforeach
                                    </select>
                                    <span class="invalid-feedback firm_office" role="alert">
                                        <span></span>
                                    </span>
                                </div>
                            </div>
                            @endif
                        </div>
                    </div>
                    <!-- /.card-body -->

                    <div class="card-footer">
                        <button type="submit" class="btn btn-primary">Update</button>
                    </div>
                </form>
            </div>
        </div>
    </section>
@endsection
@section('footerJsCode')

<script>
    $(function () {
      $('#updateCandidate').validate({
        rules: {
            'title[]': {
                required: true,
                minlength: 1
            },
            'firm_office[]': {
                required: true,
                minlength: 1
            },
            'email': {
                required: true,
                email: true,
                normalizer: function(value) {
                    return $.trim(value);
                }
            },
            'jd_year': {
                required: true,
                normalizer: function(value) {
                    return $.trim(value);
                }
            },
        },
        messages: {
            'title[]': {
                required: "This field is required."
            },
            'firm_office[]': {
                required: "This field is required."
            },
            'email': {
                required: "This field is required.",
                email: "Please enter a valid email address."
            },
            'jd_year': {
                required: "This field is required."
            }

        },
        errorElement: 'span',
        errorPlacement: function (error, element) {
          error.addClass('invalid-feedback');
          element.closest('.form-group').append(error);
        },
        highlight: function (element, errorClass, validClass) {
          $(element).addClass('is-invalid');
        },
        unhighlight: function (element, errorClass, validClass) {
          $(element).removeClass('is-invalid');
        },
        submitHandler: function(form, event) {
            event.preventDefault();
            ajaxFormUrl = $(form).attr("action");
            data = $(form).serialize();
            method = $(form).attr("method");
            submitAjaxForm();
        }
      });
    });

    function submitAjaxForm()
    {
        $('.alert-danger').addClass('d-none');
        $.ajax({
            url: ajaxFormUrl,
            type: method,
            data: data,
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
            beforeSend: function() {
                ajaxRequestCount = 1;
            },
            success: function (response) {
                if (response.redirect) {
                    window.location.href = response.redirect;
                }
            },
            error: function(xhr, status, error) {
                ajaxRequestCount = 0;
                $.each(xhr.responseJSON.errors, function (key, item) {
                    $(".invalid-feedback."+key).find('span').text(item);
                    $(".invalid-feedback."+key ).css('display','block');
                });
                if(xhr.responseJSON.error) {
                    $('.alert-danger #alertMessage').text(xhr.responseJSON.message);
                    $('.alert-danger').removeClass('d-none');
                }
            }
        });
    }
    </script>

@endsection