@extends('layout.structure')
@section('title-tab')
    Proponi nuovo corso
@endsection
@section('title-page')
    Proponi nuovo corso
@endsection
@section('content')
    <div class="card shadow mb-4">
        <div class="card-body">
            <div class="form-group">
                <label for="title">Titolo</label>
                <input type="text" value="{{$offerCourse->title}}" class="form-control" id="title" name="title" placeholder="Inserisci titolo del corso">
            </div>
            <div class="form-group">
                <label for="area_id">Area</label>
                <select class="form-control" name="area_id" id="area_id">
                    <option value="">--</option>
                    @foreach($areas as $area)
                        <option value="{{$area->id}}"
                                @if($area->id == $offerCourse->course_area_id)
                                    selected="selected"
                                @endif
                        >{{$area->name}}</option>
                    @endforeach
                </select>
            </div>
            <div class="form-group">
                <label for="category_id">Categoria</label>
                <select class="form-control" name="category_id" id="category_id">
                    <option value="">--</option>
                    @foreach($categories as $category)
                        <option
                                value="{{$category->id}}"
                                @if($category->id == $offerCourse->course_category_id)
                                    selected="selected"
                                @endif
                        >{{$category->name}}</option>
                    @endforeach
                </select>
            </div>
            <div class="form-group">
                <label for="training_hours">Ore di tirocinio</label>
                <input type="number" value="0" class="form-control" id="training_hours" value="{{$offerCourse->training_hours}}" name="training_hours" >
            </div>
            <div class="form-group">
                <label for="cfu">Cfu acquisiti</label>
                <input type="number" value="0" class="form-control" id="cfu" name="cfu" value="{{$offerCourse->cfu}}">
            </div>
            <div class="form-group">
                <label for="duration_hours">Durata del corso</label>
                <input type="number" value="0" class="form-control" id="duration_hours" value="{{$offerCourse->duration_hours}}" name="duration_hours" >
            </div>

            <div id="box-details">

            </div>
            <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#modalDetail">
                Aggiungi campo di dettaglio <i class="fa fa-plus-circle"></i>
            </button>

        </div>
    </div>

    <!-- Modal -->
    <div class="modal fade" id="modalDetail" tabindex="-1" role="dialog" aria-labelledby="modalDetailLabel" aria-hidden="true">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="modalDetailLabel">Selezionare argomento</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body text-center">
                    <button type="button" class="btn btn-dark m-1 text-uppercase insert-text-detail" id="adempimenti_richiesti">adempimenti richiesti</button>
                    <button type="button" class="btn btn-dark m-1 text-uppercase insert-text-detail" id="attivita">attivita</button>
                    <button type="button" class="btn btn-dark m-1 text-uppercase insert-text-detail" id="coadiutore">coadiutore</button>
                    <button type="button" class="btn btn-dark m-1 text-uppercase insert-text-detail" id="comitato">comitato</button>
                    <button type="button" class="btn btn-dark m-1 text-uppercase insert-text-detail" id="competenze_abilita">competenze abilita</button>
                    <button type="button" class="btn btn-dark m-1 text-uppercase insert-text-detail" id="condizioni">condizioni</button>
                    <button type="button" class="btn btn-dark m-1 text-uppercase insert-text-detail" id="destinatari">destinatari</button>
                    <button type="button" class="btn btn-dark m-1 text-uppercase insert-text-detail" id="domanda_ammissione">domanda ammissione</button>
                    <button type="button" class="btn btn-dark m-1 text-uppercase insert-text-detail" id="finalita">finalita</button>
                    <button type="button" class="btn btn-dark m-1 text-uppercase insert-text-detail" id="informazioni">informazioni</button>
                    <button type="button" class="btn btn-dark m-1 text-uppercase insert-text-detail" id="iscrizione_studenti_stranieri">iscrizione studenti_stranieri</button>
                    <button type="button" class="btn btn-dark m-1 text-uppercase insert-text-detail" id="management_della_scuola">management della scuola</button>
                    <button type="button" class="btn btn-dark m-1 text-uppercase insert-text-detail" id="partner">partner</button>
                    <button type="button" class="btn btn-dark m-1 text-uppercase insert-text-detail" id="presentazione">presentazione</button>
                    <button type="button" class="btn btn-dark m-1 text-uppercase insert-text-detail" id="requisiti_ammissione">requisiti ammissione</button>
                    <button type="button" class="btn btn-dark m-1 text-uppercase insert-text-detail" id="riconoscimenti">riconoscimenti</button>
                    <button type="button" class="btn btn-dark m-1 text-uppercase insert-text-detail" id="sbocchi_occupazionali">sbocchi occupazionali</button>
                    <button type="button" class="btn btn-dark m-1 text-uppercase insert-text-detail" id="strumenti_didattici">strumenti didattici</button>
                    <button type="button" class="btn btn-dark m-1 text-uppercase insert-text-detail" id="titoli_ammissione">titoli ammissione</button>
                    <button type="button" class="btn btn-dark m-1 text-uppercase insert-text-detail" id="titolo_rilasciato">titolo rilasciato</button>
                    <button type="button" class="btn btn-dark m-1 text-uppercase insert-text-detail" id="trattamento_dati_personali">trattamento dati personali</button>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Chiudi</button>
                </div>
            </div>
        </div>
    </div>

@endsection
@section('head')
    @parent

@endsection
@section('footer')
    @parent
    <script>
        $('.insert-text-detail').on('click',function(){
            var idBox = $(this).attr('id');
            var nameBox = $(this).html().toUpperCase();

            var html = '<div class="form-group" id="box_'+idBox+'">' +
                '<label for="training_hours">'+nameBox+'  </label> <button type="button" class="btn btn-danger btn-sm float-right" onclick="restore_button_detail(\''+idBox+'\')"><i class="fa fa-minus"></i></button>' +
                '<textarea  class="form-control" name="+idBox+" ></textarea>' +
                '</div>'

            $('#box-details').append(html);
        });

        function restore_button_detail(id){
            $('#'+id).show();
            $('#box_'+id).remove();
        }
    </script>
@endsection