@include('layouts.commons.success')
@include('layouts.commons.errors')

<div>
    <h4>Planning</h4>
    <div class="row custom-frame pt-3">
        @if(sizeof($projet->taches) > 0)
            <div class="col-12 my-5 planification"></div>
        @else
            <div class="col-12 my-5">
                <h4>Planning non renseigné.</h4>
            </div>
        @endif
    </div>


    <h4>Procédure en cours</h4>
    <div class="row custom-frame pt-3">
        <form id="projet-onglet-planification" method="post" action="{{ route('planification.store', $projet->id) }}" class="col-12 my-5">
            @csrf
            <div class="container">
                <div class="row">
                  <div class="col text-center">Préparation</div>
                  <div class="col text-center">Rédaction</div>
                  <div class="col text-center">Publicité</div>
                  <div class="col text-center">Suivi procédure</div>
                  <div class="col text-center">Clôture</div>
                </div>
                <div class="row">
                    <div class="col-10 offset-1">
                        <input type="range" class="custom-range" min="0" max="4" step="1" id="statut_procedure_range" name="statut_procedure_range" value="{{ $projet->statut_procedure === null ? 0 : array_search($projet->statut_procedure, PLANIFICATION::PLANIFICATION_ORDERED) }}">
                    </div>
                </div>
            </div>
        </form>
    </div>

    <div class="row">
        <div class="col-12">
            <div class="form-group row text-right">
                <div class="col-sm-12">
                    <a href="{{ route('projets.index') }}" class="btn btn-outline-warning">Annuler</a>
                    @if(Auth::user()->can('edit_projet') && $editable)
                        <button type="submit" class="btn btn-outline-success" form="projet-onglet-planification">
                            Sauvegarder
                        </button>
                    @endif
                </div>
            </div>
        </div>
    </div>
</div>

<script>
    $(function() {
        $('.planification').gantt({
            source: {!! json_encode($projet->planification()) !!},
            navigate: 'scroll',
            scale: 'days',
            maxScale: 'months',
            minScale: 'days',
            itemsPerPage: {{ sizeof($projet->planification()) }},
            scrollToToday: false,
            dow: ['D','L','Ma','Me','J','V','S']
        });

        $(".planification").popover({
            selector: '.bar',
            content: function _getItemText() {
                return this.textContent;
            },
            container: '.planification',
            trigger: 'hover',
            placement : 'top'
        });
    });
</script>