{% include 'partials/header.html.twig' %}

{% set info = get_global_parameters() %}
    <link rel="stylesheet" href="{{ asset('assets/libs/datatables.net/css/jquery.dataTables.min.css')}}">

    <script src="{{ asset('assets/libs/datatables.net/js/jquery.dataTables.min.js') }}"></script>
    <script src="{{ asset('assets/libs/datatables.net/js/dataTables.buttons.min.js') }}"></script>
    <script src="{{ asset('assets/libs/datatables.net/js/buttons.flash.min.js') }}"></script>
    <script src="{{ asset('assets/libs/datatables.net/js/buttons.html5.min.js') }}"></script>
    <script src="{{ asset('assets/libs/datatables.net/js/buttons.print.min.js') }}"></script>
    <script src="{{ asset('assets/libs/jszip/jszip.min.js') }}"></script>
    <script src="{{ asset('assets/libs/pdfmake/pdfmake.min.js') }}"></script>
    <script src="{{ asset('assets/libs/pdfmake/vfs_fonts.js') }}"></script>

 <div class="body-wrapper">
        <div class="container-fluid">

          <div class="card bg-primary-subtle card-body py-3">
            <div class="row align-items-center">
              <div class="col-12">
                <div class="d-sm-flex align-items-center justify-space-between">
                  <h4 class="mb-4 mb-sm-0 card-title">Paramètres de l'hôtel</h4>
                  
                </div>
              </div>
            </div>
          </div>


    <div class="card">
        <div class="card-body">
        <ul class="nav nav-pills user-profile-tab  sticky-top" id="pills-tab" role="tablist" style="top: 80px;z-index: 1020;background-color: white;">
            <li class="nav-item" role="presentation">
                <button class="nav-link position-relative rounded-0 active d-flex align-items-center justify-content-center bg-transparent fs-3 py-4" id="pills-account-tab" data-bs-toggle="pill" data-bs-target="#pills-account" type="button" role="tab" aria-controls="pills-account" aria-selected="true">
                    <i class="ti ti-building-skyscraper me-2 fs-6"></i>
                    <span class="d-none d-md-block">Hôtel</span> 
                </button>
            </li>
            <li class="nav-item" role="presentation">
                <button class="nav-link position-relative rounded-0 d-flex align-items-center justify-content-center bg-transparent fs-3 py-4" id="pills-livret-tab" data-bs-toggle="pill" data-bs-target="#pills-livret" type="button" role="tab" aria-controls="pills-livret" aria-selected="false">
                    <i class="ti ti-mood-smile me-2 fs-6"></i>
                    <span class="d-none d-md-block">Livret d'accueil</span> 
                </button>
            </li>
            <li class="nav-item" role="presentation">
                <button class="nav-link position-relative rounded-0 d-flex align-items-center justify-content-center bg-transparent fs-3 py-4" id="pills-menage-tab" data-bs-toggle="pill" data-bs-target="#pills-menage" type="button" role="tab" aria-controls="pills-menage" aria-selected="false">
                    <i class="ti ti-spray me-2 fs-6"></i>
                    <span class="d-none d-md-block">Ménage</span> 
                </button>
            </li>
            <li class="nav-item" role="presentation">
                <button class="nav-link position-relative rounded-0 d-flex align-items-center justify-content-center bg-transparent fs-3 py-4" id="pills-mail-tab" data-bs-toggle="pill" data-bs-target="#pills-mail" type="button" role="tab" aria-controls="pills-mail" aria-selected="false">
                    <i class="ti ti-mail me-2 fs-6"></i>
                    <span class="d-none d-md-block">Emails</span> 
                </button>
            </li>
            {% if info.bundle['planning'] is defined %}
                <li class="nav-item" role="presentation">
                    <button class="nav-link position-relative rounded-0 d-flex align-items-center justify-content-center bg-transparent fs-3 py-4" id="pills-planning-tab" data-bs-toggle="pill" data-bs-target="#pills-planning" type="button" role="tab" aria-controls="pills-planning" aria-selected="false">
                        <i class="ti ti-calendar me-2 fs-6"></i>
                        <span class="d-none d-md-block">Planning</span> 
                    </button>
                </li>
            {% endif %}
        </ul>
        <div class="card-body">
            <div class="tab-content" id="pills-tabContent">
                <div class="tab-pane fade show active" id="pills-account" role="tabpanel" aria-labelledby="pills-account-tab" tabindex="0">
                    {% include '@Hotel/settings/tabs/tab_hotel.html.twig' %}
                </div>

                <div class="tab-pane fade" id="pills-livret" role="tabpanel" aria-labelledby="pills-livret-tab" tabindex="0">
                    {% include '@Hotel/settings/tabs/tab_livretaccueil.html.twig' %}
                </div>

                <div class="tab-pane fade" id="pills-menage" role="tabpanel" aria-labelledby="pills-menage-tab" tabindex="0">
                    {% include '@Hotel/settings/tabs/tab_menage.html.twig' %}
                </div>

                <div class="tab-pane fade" id="pills-mail" role="tabpanel" aria-labelledby="pills-mail-tab" tabindex="0">
                    {% include '@Hotel/settings/tabs/tab_email.html.twig' %}
                </div>
                
                

                

                


            </div>
        </div>
    </div>
</div>

<script>

document.addEventListener('DOMContentLoaded', function () {
    // Récupérer le hash de l'URL (ex: #pills-documents)
    const hash = window.location.hash;

    if (hash) {
        // Sélectionner le bouton correspondant
        const tabButton = document.querySelector(`button[data-bs-target="${hash}"]`);
        if (tabButton) {
            // Utiliser Bootstrap Tab pour activer l'onglet
            const tab = new bootstrap.Tab(tabButton);
            tab.show();

            // Attendre un court moment avant de scroller
            setTimeout(() => {
                window.scrollBy({
                    top: -100, // Décalage vers le haut en pixels
                    behavior: 'smooth' // Animation du défilement
                });
            }, 1); // Ajuste le délai si nécessaire
        }
    }

    // Mettre à jour l'URL quand un onglet est sélectionné
    const tabButtons = document.querySelectorAll('button[data-bs-toggle="pill"]');
    tabButtons.forEach(button => {
        button.addEventListener('click', function () {
            window.location.hash = this.getAttribute('data-bs-target');
             // Attendre un court moment avant de scroller
                window.scrollBy({
                    top: -100, // Décalage vers le haut en pixels
                    behavior: 'smooth' // Animation du défilement
                });
        });
    });
});

    document.addEventListener('DOMContentLoaded', function () {
    // Sélectionner tous les switches
    const switches = document.querySelectorAll('.switch-control');

    switches.forEach(switchElement => {
        switchElement.addEventListener('click', function () {
            // Mettre tous les switches à false
            switches.forEach(el => {
                el.checked = false;
            });

            // Activer seulement celui qui est cliqué
            this.checked = true;

            // Récupérer l'ID du switch
            const switchId = this.getAttribute('data-id');

            // Envoyer la mise à jour au serveur avec fetch et AJAX
            fetch(Routing.generate('hotel_menage_update'), {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                    'X-CSRF-TOKEN': '{{ csrf_token("switch_update") }}'
                },
                body: JSON.stringify({
                    switchId: switchId,
                    switchState: this.checked
                })
            })
            .then(response => response.json())
            .then(data => {
                // Afficher une notification toast lorsque la mise à jour est réussie
                if (data.success) {
                    showToast('Le contrôle des chambre a été mis à jour avec succès !');
                } else {
                    showToast('Erreur lors de la mise à jour.', 'error');
                }
            })
            .catch(error => {
                showToast('Erreur lors de la mise à jour.', 'error');
            });
        });
    });
});


    function reloadToTab(tabId) {
        // Met à jour l'URL avec l'ID de l'onglet souhaité
        window.location.hash = tabId;

        // Recharge la page pour appliquer le changement
        window.location.reload();
    }

    function uploadLivretAccueil(inputElement) {
        const file = inputElement.files[0];

        if (!file) {
            return; // Aucun fichier sélectionné
        }

        // Créer un objet FormData pour envoyer le fichier
        const formData = new FormData();
        formData.append('document', file);

        // Envoyer le fichier au serveur via Fetch API
        fetch(Routing.generate('hotel_upload_livret'), {
            method: 'POST',
            headers: {
                'X-CSRF-TOKEN': '{{ csrf_token("hotel_upload_livret") }}'
            },
            body: formData
        })
        .then(response => response.json())
        .then(data => {
            if (data.success) {
                showToast('Le document a été enregistré avec succès !');
                reloadToTab('#pills-livret');  
            } else {
                showToast('Erreur lors de l\'enregistrement du document.', 'error');
            }
        })
        .catch(error => {
            showToast('Erreur lors de l\'enregistrement du document.', 'error');
            console.error('Erreur:', error);
        });
    }

    function deleteLivretAccueil() {

        // Envoyer le fichier au serveur via Fetch API
        fetch(Routing.generate('hotel_delete_livret'), {
            method: 'POST',
            headers: {
                'X-CSRF-TOKEN': '{{ csrf_token("hotel_upload_livret") }}'
            }
        })
        .then(response => response.json())
        .then(data => {
            if (data.success) {
                showToast('Le document a été supprimé avec succès !');
                reloadToTab('#pills-livret');                
            } else {
                showToast('Erreur lors de l\'enregistrement du document.', 'error');
            }
        })
        .catch(error => {
            showToast('Erreur lors de l\'enregistrement du document.', 'error');
            console.error('Erreur:', error);
        });
    }
    
</script>
{% include 'partials/modal/delete_modal.html.twig' %}    

{% include 'partials/footer.html.twig' %}n