@extends('layouts.app')

@section('content')
    <div class="container-fluid">

        <a href="/avantages" class="discription">
            <img src="{{ asset('images/arrow_down.svg') }}" alt=""> Retour
        </a>
    </div><br>
    <div class="container-fluid">

        <form action="/avantages/store" method="post" enctype="multipart/form-data">
            @csrf
            <!-- <div class="form-group">
                        <label for="exampleInputinterets1">Type de réduction</label>
                        <select class="form-select" aria-label="Default select example" name="type">
                            <option hidden>Selectionner le type</option>
                            <option value="Commerciaux" @if (old('type') == 'Commerciaux') selected="selected" @endif>Commerciaux</option>
                            <option value="Educatif" @if (old('type') == 'Educatif') selected="selected" @endif>Educatif</option>
                        </select>
                        @error('type')
        <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
    @enderror
                    </div> -->

            <div class="card">
                <div class="card-header">
                    <h2>Ajouter un Avantage</h2>
                </div>
                <div class="card-body p-3">
                    @if ($errors->any())
                        <div class="alert alert-danger">
                            <ul>
                                @foreach ($errors->all() as $error)
                                    <li>{{ $error }}</li>
                                @endforeach
                            </ul>
                        </div>
                    @endif
                    <div class="row">
                        <div class="col-lg-6 col-md-6 col-12">
                            <div class="form-group">
                                <label for="exampleInputinterets1">Intérêts <sup>*</sup></label>
                                <select class="form-select" aria-label="Default select example" name="interet" required>
                                    <option hidden value="">Sélectionner l'intérêt correspondant à votre avantage
                                    </option>
                                    @foreach ($interets as $interet)
                                        <option value="{{ $interet->id }}"
                                            @if (old('interet') == $interet->id) selected="selected" @endif>
                                            {{ $interet->nom_interet }}</option>
                                    @endforeach
                                </select>
                                @error('interet')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </div>
                        </div>
                        <div class="col-lg-6 col-md-6 col-12">

                            <div class="form-group">
                                <label class="col-form-label">Image <sup>*</sup></label>
                                <input required type="file" class="form-control @error('image') is-invalid @enderror"
                                    name="image" id="selectImage">
                                <label class="col-form-label"><sub>Format acceptée : png, jpg</sub></label>
                                @error('image')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>L’image n’a pas pu être importée correctement</strong>
                                    </span>
                                @enderror
                                <img id="preview" src="#" alt="your image" class="mt-3" style="display:none;" />
                            </div>
                        </div>
                    </div>
                    <div class="row ">
                        <div class="col-lg-6 col-md-6 col-12">
                            <div class="form-group">
                                <label for="inputEmail4" class="form-label label mb-12"><br>Type de réduction
                                    <sup>*</sup></label>
                                <div style="display:flex">
                                    <div class="form-check" style="margin-right:25px">
                                        <input class="form-check-input @error('prtype') is-invalid @enderror" type="radio"
                                            name="prtype" id="exampleRadios1" value="1" checked>
                                        <label class="form-check-label" for="exampleRadios1">
                                            Pourcentage
                                        </label>
                                        @error('prtype')
                                            <span class="invalid-feedback" role="alert">
                                                <strong>{{ $message }}</strong>
                                            </span>
                                        @enderror
                                    </div>
                                    <div class="form-check">
                                        <input class="form-check-input @error('prtype') is-invalid @enderror" type="radio"
                                            name="prtype" id="exampleRadios2" value="0">
                                        <label class="form-check-label" for="exampleRadios2">
                                            Montant F CFA
                                        </label>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-6 col-md-6 col-12">
                            <div class="form-group">
                                <label for="exampleInputcategories1"><br>Réduction <sup>*</sup></label>
                                <input type="text" class="form-control @error('pourcentage') is-invalid @enderror"
                                    id="exampleInputcategories1" aria-describedby="categoriesHelp" placeholder="Réduction"
                                    required name="pourcentage" value="{{ old('pourcentage') }}">
                                @error('pourcentage')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </div>
                        </div>
                    </div>
                    <!-- <div class="row">
                            <div class="col-lg-12 col-md-12 col-12">
                                <div class="form-group">
                                    <label for="exampleInputcategories1">Nom de l’avantage <sup>*</sup></label>
                                    <input type="text" class="form-control @error('nom_coupon') is-invalid @enderror"
                                        id="exampleInputcategories1" aria-describedby="categoriesHelp" placeholder="Entrer le nom de l’avantage"
                                        required name="nom_coupon" value="{{ old('nom_coupon') }}">
                                    @error('nom_coupon')
        <span class="invalid-feedback" role="alert">
                                                <strong>{{ $message }}</strong>
                                            </span>
    @enderror
                                </div>
                            </div>
                        </div> -->
                    <div class="row">
                        <div class="col-lg-6 col-md-6 col-12">
                            <div class="form-group">
                                <label for="exampleInputcategories1">Nom de l’avantage </label>
                                <input type="text" class="form-control @error('nom_coupon') is-invalid @enderror"
                                    id="exampleInputcategories1" aria-describedby="categoriesHelp"
                                    placeholder="Entrer le nom de l’avantage" required name="nom_coupon"
                                    value="{{ old('nom_coupon', $avantages->nom_coupon ?? '') }}">
                                @error('nom_coupon')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </div>
                        </div>
                        <div class="col-lg-6 col-md-6 col-12">
                            <div class="form-group">
                                <label for="lieu">Lieu</label>
                                <input type="text" class="form-control @error('lieu') is-invalid @enderror"
                                    id="lieu" aria-describedby="categoriesHelp"
                                    placeholder="Renseigner le lieu où l'avantage est valide" required name="lieu"
                                    value="{{ old('lieu', $avantages->lieu ?? '') }}">
                                @error('lieu')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </div>
                        </div>

                    </div>
                    <div class="row">
                        <div class="col-lg-12 col-md-12 col-12">
                            <label for="date_start">Période de validité : <sup>*</sup></label>
                        </div>

                        <div class="col-lg-6 col-md-6 col-12">
                            <div class="form-group">

                                <br><span>Début <sup>*</span>
                                <input type="date" class="form-control @error('debut') is-invalid @enderror"
                                    id="date_start" aria-describedby="categoriesHelp" required name="debut"
                                    value="{{ old('debut') }}">
                                @error('fin')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                    <br>
                                @enderror
                            </div>
                        </div>
                        <div class="col-lg-6 col-md-6 col-12 mt-2">
                            <div class="form-group">
                                <label for="date_end">Fin <sup>*</label>
                                <input type="date" class="form-control @error('fin') is-invalid @enderror"
                                    id="date_end" aria-describedby="categoriesHelp" required name="fin"
                                    value="{{ old('fin') }}">

                                @error('debut')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-6 col-md-6 col-12">
                            @if (Auth::user()->role !== 2)
                                <div class="form-group">
                                    <label for="exampleInputinterets1">Point de vente <sup>*</sup></label>
                                    <select class="form-control pdv" aria-label="Default select example"
                                        name="partenaires[]" multiple="multiple" required>
                                        @foreach ($partenaires as $partenaire)
                                            <option value="{{ $partenaire->id }}">{{ $partenaire->name }}</option>
                                        @endforeach
                                    </select>
                                    @error('partenaire')
                                        <span class="invalid-feedback" role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>
                            @else
                                <input type="hidden" name="partenaire"
                                    value="{{ $partenaires ? $partenaires->id : '' }}">
                            @endif
                        </div>
                        <div class="col-lg-6 col-md-6 col-12">
                            
                            <div class="form-group">
                                <label for="exampleInputinterets1">Etat <sup>*</sup></label>
                                <select class="form-control etat" aria-label="Default select example"
                                    name="etat"  required>
                                        <option value="">Selectionnez l'état de l'avantage</option>
                                        <option value="online">En ligne</option>
                                        <option value="offline">Hors ligne</option>
                                        <option value="offline">En ligne / Hors Ligne</option>
                                </select>
                                @error('etat')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-12">
                            <div class="form-group">
                                <label for="exampleFormControlTextarea1">Description <sup>*</sup></label>
                                <textarea class="form-control @error('description') is-invalid @enderror" id="exampleFormControlTextarea1"
                                    name="description" rows="5" required>{{ trim(old('description')) }}</textarea>
                                @error('description')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </div>
                        </div>
                    </div>

                    <button type="submit" class="btn btn-success">Enregistrer</button>


                </div>
            </div>
        </form>
    </div>
@endsection

@push('scripts')
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.3/moment.min.js"></script>
    

    <script>
        $(document).ready(function() {
            // $('.pdv').select2({
            //     placeholder: 'Selectionner un point de vente'
            // });
            const addSelectAll = matches => {
                if (matches.length > 0) {
                // Insert a special "Select all matches" item at the start of the 
                // list of matched items.
                return [
                    {id: 'selectAll', text: 'Tous', matchIds: matches.map(match => match.id)},
                    ...matches
                ];
                }
            };

            const handleSelection = event => {
                if (event.params.data.id === 'selectAll') {
                $('.pdv').val(event.params.data.matchIds);
                $('.pdv').trigger('change');
                };
            };

            $('.pdv').select2({
                multiple: true,
                sorter: addSelectAll,
            });
            $('.etat').select2({
            });
            $('.pdv').on('select2:select', handleSelection);

            // Période de validités
            $("#date_start").prop("min", moment(new Date()).format('YYYY-MM-DD'));
            $("#date_end").prop("min", moment(new Date()).format('YYYY-MM-DD'));

            $("#date_start").change(function() {
                $("#date_end").prop("min", $(this).val());
                $("#date_end").val(""); //clear end date input when start date changes
            });
        });

            function initialize() {
                var input = document.getElementById('lieu');
                var autocomplete = new google.maps.places.Autocomplete(input);
                autocomplete.addListener("place_changed", function() {
                    const place = autocomplete.getPlace();
                    // Here you can get your coordinates like this
                    $('#latd').val(place.geometry.location.lat())
                    $('#lngd').val(place.geometry.location.lng())
                });
        }
    </script>
    <script
        src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBcF9VOXxKXMdDlJWsJxDKqo2P1lnV9g2A&libraries=places&v=weekly&sensor=true&signed_in=true&callback=initialize"
        defer></script>
@endpush