@extends('layouts.app')

@section('content')
    <div class="container">
        <div>
            <h2 class="pb-2">Editer le PAAT</h2>
        </div>

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

        <form method="POST" action="{{ route('paats.update', $paat->id) }}">
            @csrf
            {{ method_field('PUT') }}

            <!-- Date de début -->
            <div class="form-group row">
                <label for="date_debut" class="col-md-4 col-form-label text-md-right required">Date de début</label>
                <div class="col-md-6">
                    <input id="date_debut" type="text" class="form-control" name="date_debut" value="{{ old('date_debut', Carbon\Carbon::createFromFormat('Y-m-d', $paat->date_debut)->format('d/m/Y')) }}" required>
                </div>
            </div>

            <!-- Date de fin -->
            <div class="form-group row">
                <label for="date_fin" class="col-md-4 col-form-label text-md-right required">Date de fin</label>
                <div class="col-md-6">
                    <input id="date_fin" type="text" class="form-control" name="date_fin" value="{{ old('date_fin', Carbon\Carbon::createFromFormat('Y-m-d', $paat->date_fin)->format('d/m/Y')) }}" required>
                </div>
            </div>

            <!-- Description -->
            <div class="form-group row">
                <label for="description" class="col-md-4 col-form-label text-md-right required">Description</label>
                <div class="col-md-6">
                    <input id="description" type="text" class="form-control" name="description" value="{{ old('description', $paat->description) }}" required>
                </div>
            </div>

            <div class="form-group row mb-0">
                <div class="col-md-8 offset-md-4">
                    <button type="submit" class="btn btn-outline-success">
                        Sauvegarder
                    </button>
                    <a href="{{ route('paats.index') }}" class="btn btn-outline-warning">Annuler</a>
                </div>
            </div>
        </form>
    </div>
@endsection

@section('unique-js')
    <script>
        $(function() {
            var date_debut = flatpickr('#date_debut', {
                dateFormat: 'd/m/Y',
                maxDate: '31/12/{{ $paat->annee_reference }}',
                // Function appelée lorsque l'on ferme le selecteur de date début
                onClose: function(selectedDates, dateStr) {
                    // Permet de fixer la date minimale de la date de fin à la date de début pour ne pas pouvoir avoir une date de fin < date de début
                    date_fin.set('minDate', dateStr);
                },
            });
            var date_fin = flatpickr('#date_fin', {
                dateFormat: 'd/m/Y',
                maxDate: '31/12/{{ $paat->annee_reference }}',
                // Function appelée lorsque l'on ferme le selecteur de date fin
                onClose: function(selectedDates, dateStr) {
                    // Permet de fixer la date maximale de la date début à la date de fin pour ne pas pouvoir avoir une date de début > date de fin
                    date_debut.set('maxDate', dateStr);
                },
            });
        });
    </script>
@endsection