<!-- Ajoutez dans le fichier Twig pour la création d'un établissement -->
{% block body %}
    <h1>Créer un établissement</h1>

    {{ form_start(form) }}
        <div class="row">
            <div class="col-md-6">
                {{ form_row(form.numero_uai) }}
                {{ form_row(form.secteur) }}
                {{ form_row(form.appellation_officielle) }}
                {{ form_row(form.adresse) }}
                {{ form_row(form.code_postal) }}
                {{ form_row(form.commune) }}
                {{ form_row(form.latitude) }}
                {{ form_row(form.longitude) }}
            </div>
            <div class="col-md-6">
                {{ form_row(form.nature_uai) }}
                {{ form_row(form.nature_libe) }}
                {{ form_row(form.etat_etablissement_libe) }}
                {{ form_row(form.code_departement) }}
                {{ form_row(form.code_region) }}
                {{ form_row(form.code_academie) }}
                {{ form_row(form.code_commune) }}
                {{ form_row(form.departement) }}
                {{ form_row(form.region) }}
                {{ form_row(form.academie) }}
                {{ form_row(form.type_contrat) }}
                {{ form_row(form.libelle_type_contrat) }}
                {{ form_row(form.code_ministere) }}
                {{ form_row(form.libelle_ministere) }}
                {{ form_row(form.date_ouverture) }}
            </div>
        </div>

        <!-- Carte Leaflet pour Latitude et Longitude -->
        <div class="map-container">
            <div id="map" style="height: 400px;"></div>
        </div>

        <div class="d-flex justify-content-end mt-4">
            <button type="submit" class="btn btn-primary">Créer</button>
        </div>
    {{ form_end(form) }}


    <!-- Intégration de Leaflet avec OpenStreetMap -->
    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css" />
    <link rel="stylesheet" href="{{ asset('css/style.css') }}" />
    <script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js"></script>
    <script>
        // Initialisation de la carte Leaflet
        var map = L.map('map').setView([48.8566, 2.3522], 10); // Position initiale (Paris)

        // Ajouter OpenStreetMap comme fond de carte
        L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
            attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
        }).addTo(map);

        // Ajouter un marqueur draggable à la carte
        var marker = L.marker([48.8566, 2.3522], { draggable: true }).addTo(map);

        // Fonction qui se déclenche lors d'un clic sur la carte
        map.on('click', function(e) {
            var lat = e.latlng.lat;
            var lng = e.latlng.lng;

            // Déplacer le marqueur
            marker.setLatLng([lat, lng]);

            // Mettre à jour les champs visibles avec les nouvelles coordonnées
            document.getElementById('etablissement_latitude').value = lat;
            document.getElementById('etablissement_longitude').value = lng;
        });
    </script>
{% endblock %}
