@extends('candidate.account')
@section('styles')
@parent
<link rel="stylesheet" href="{{asset("assets/css/candidate/CV/_cvlanguages.css")}}">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css">

@endsection

@section('cv_content')
<div class="account-details">
    <h3>Idiomas</h3>
    <form class="basic-info" id="form_languages" action="/ProfileController/c_save_cvlanguages" method="post">
        @csrf
        @if (!$candidate_cv->clanguages()->exists())
            <div class="form_modal_languages_remove form-group">
                <div class="form-group" id="repeater_languages">
                    <div data-repeater-list="fields_languages" id="repeater_languages_basic">
                        <div data-repeater-item class="contenedor-espacio">
                            <div class="row">
                                <div class="col-md-4">
                                    <div class="form-group">
                                        <select required name="lan_language" data-control="select2" data-placeholder="Selecciona una opción" class="form-select form-input-text language_select">
                                            <option value=""></option>
                                            @php
                                                $languages = json_decode(file_get_contents("languages.json"), true);
                                            @endphp
                                            @foreach($languages as $key => $value)
                                                @foreach ($value as $key2 => $value2)
                                                    @if ($key2 == "native")
                                                        <option value="{{$value2}}">{{$value2}}</option>
                                                    @endif
                                                @endforeach
                                            @endforeach
                                        </select>
                                    </div>
                                </div>

                                <div class="col-md-4">
                                    <div class="form-group">
                                        <select required name="lan_nivel" data-control="select2" data-placeholder="Selecciona una opción" class="form-select form-input-text nivel_select">
                                            <option value=""></option>
                                            <option value="1">Nativo</option>
                                            <option value="2">Básico</option>
                                            <option value="3">Medio</option>
                                            <option value="4">Avanzado</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="col-4 text-center">
                                    <a href="javascript:;" data-repeater-delete>
                                        <div class="btn btn-danger">
                                            <i class="fa-solid fa-trash"></i>
                                        </div>
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-12 text-center">
                        <button type="submit" class="account-btn" id="btn_save_languages">
                            <span id="span-save">Guardar cambios</span>
                            <span id="span-progress" style="display:none;">Validando...
                                <span class="spinner-border spinner-border-sm" role="status"></span>
                            </span>
                        </button>
                        <a href="javascript:;" data-repeater-create class="d-inline-block languages-add-button">
                            <div class="account-btn">
                                Agregar idioma
                            </div>
                        </a>
                    </div>
                </div>
            </div>
        @else
            <div class="form_modal_languages_remove form-group">
                <div class="form-group" id="repeater_languages">
                    <div data-repeater-list="fields_languages" id="repeater_languages_basic">
                        @foreach ($candidate_cv->clanguages as $clanguages)
                        <div data-repeater-item class="contenedor-espacio">
                            <div class="row">
                                <div class="col-md-4">
                                    <div class="form-group">
                                        <select required name="lan_language" data-control="select2" data-placeholder="Selecciona una opción" class="form-select form-input-text language_select">
                                            <option value=""></option>
                                            @php
                                                $languages = json_decode(file_get_contents("languages.json"), true);
                                            @endphp
                                            @foreach($languages as $key => $value)
                                                @foreach ($value as $key2 => $value2)
                                                    @if ($key2 == "native")
                                                        <option value="{{$value2}}"  {{($clanguages->language == $value2) ? "selected" : ""}}>{{$value2}}</option>
                                                    @endif
                                                @endforeach
                                            @endforeach
                                        </select>
                                    </div>
                                </div>

                                <div class="col-md-4">
                                    <div class="form-group">
                                        <select required name="lan_nivel" data-control="select2" data-placeholder="Selecciona una opción" class="form-select form-input-text nivel_select">
                                            <option value=""></option>
                                            <option value="1" {{($clanguages->nivel == "1") ? "selected" : ""}}>Nativo</option>
                                            <option value="2" {{($clanguages->nivel == "2") ? "selected" : ""}}>Básico</option>
                                            <option value="3" {{($clanguages->nivel == "3") ? "selected" : ""}}>Medio</option>
                                            <option value="4" {{($clanguages->nivel == "4") ? "selected" : ""}}>Avanzado</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="col-4 text-center">
                                    <a href="javascript:;" data-repeater-delete>
                                        <div class="btn btn-danger">
                                            <i class="fa-solid fa-trash"></i>
                                        </div>
                                    </a>
                                </div>
                            </div>
                        </div>
                        @endforeach
                    </div>
                    <div class="col-md-12 text-center">
                        <button type="submit" class="account-btn" id="btn_save_languages">
                            <span id="span-save">Guardar cambios</span>
                            <span id="span-progress" style="display:none;">Validando...
                                <span class="spinner-border spinner-border-sm" role="status"></span>
                            </span>
                        </button>
                        <a href="javascript:;" data-repeater-create class="d-inline-block languages-add-button">
                            <div class="account-btn">
                                Agregar idioma
                            </div>
                        </a>
                    </div>
                </div>
            </div>
        @endif
    </form>
</div>
@endsection

@section('scripts')
@parent

<script defer src="{{asset("assets/plugins/custom/formrepeater.bundle.js")}}"></script>
<script defer src="{{asset("assets/js/candidate/cv/_cvlanguages.js")}}"></script>
@endsection