newdesigngestionnaire/Vue/includes/scripts-footer.php

<script src="Bootstrap/js/jquery.min.js"></script>
<script src="Bootstrap/js/jquery-ui.js"></script>
<script src="Bootstrap/js/timer.jquery.js"></script>

<script src="Bootstrap/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>

<script src="https://cdn.datatables.net/1.13.6/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.13.6/js/dataTables.bootstrap5.min.js"></script>

<script src="https://cdn.datatables.net/buttons/2.4.1/js/dataTables.buttons.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
<script src="https://cdn.datatables.net/buttons/2.4.1/js/buttons.html5.min.js"></script>

<script src="Bootstrap_new/js/select2.min.js"></script>
<script src="Bootstrap_new/select/js/bootstrap-select.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11.14.1/dist/sweetalert2.all.min.js"></script>

<script src="Bootstrap/vendor/apexcharts/apexcharts.min.js"></script>
<script src="Bootstrap/vendor/chart.js/chart.umd.js"></script>
<script src="Bootstrap/vendor/echarts/echarts.min.js"></script>

<script src="Bootstrap/js/main.js"></script>


<?php if (est_anglophone()): ?>
  <script src="Js/datepicker-eng.js"></script>
<?php else: ?>
  <script src="Js/datepicker-fr.js"></script>
<?php endif; ?>

<script src="<?= $_SESSION['dossierSociete'] . '/Js/societe.js' ?>"></script>
<script src="Js/fonctions.js?ver=<?= defined('APP_VERSION') ? APP_VERSION : date('YmdHi') ?>"></script>

<script src="Js/html2pdf.js"></script>

<!-- ===== Conteneur AJAX gabarit ===== -->
<div id="div_ajaxgabarit"></div>

<!-- ===== Initialisation applicative ===== -->
<script type="text/javascript">
  /* Rafraîchissement du gabarit */
  raffraichier_gabarit();

  /* Timer messagerie (60s) */
  $(document).ready(function () {

    /* --- Panneau contexte : Drawer animé --- */
    $('#barre_laterale_d').hide();
    $('#showSideNav').hide(); // Masqué jusqu'au scroll ou action

    // Afficher le bouton déclencheur après un court délai
    setTimeout(function () {
      $('#showSideNav').fadeIn(300);
    }, 800);

    // Ouverture du panneau
    $('#showSideNav').on('click', function () {
      $('#barre_laterale_d').stop(true).show('slide', { direction: 'right' }, 350);
      $(this).fadeOut(150);
    });

    // Fermeture du panneau
    $('#hideSideNav').on('click', function () {
      $('#barre_laterale_d').stop(true).hide('slide', { direction: 'right' }, 350, function () {
        $('#showSideNav').fadeIn(200);
      });
    });

    // Fermeture en cliquant en dehors du panneau
    $(document).on('click', function (e) {
      if ($('#barre_laterale_d').is(':visible') &&
          !$(e.target).closest('#barre_laterale_d, #showSideNav').length) {
        $('#barre_laterale_d').stop(true).hide('slide', { direction: 'right' }, 300, function () {
          $('#showSideNav').fadeIn(200);
        });
      }
    });

    /* --- Timer messagerie --- */
    $('#timer').timer({
      duration: '60s',
      callback: function () {
        raffraichier_messagerie();
      },
      repeat: true
    });

    /* --- Select2 global --- */
    if ($.fn.select2) {
      $('select.select2, .select-field').each(function () {
        $(this).select2({ theme: 'bootstrap-5', width: '100%' });
      });
    }

    /* --- Bootstrap Select global --- */
    if ($.fn.selectpicker) {
      $('select.selectpicker').selectpicker('refresh');
    }

    /* --- Sidebar toggle ---
     * On désactive le listener natif de main.js (Bootstrap template) en
     * clonant le nœud DOM, ce qui supprime tous ses event listeners,
     * puis on rebranche notre propre logique.
     */
    (function () {
      var $btn = $('.toggle-sidebar-btn');
      if (!$btn.length) return;

      // Cloner pour vider les listeners attachés par main.js
      var $clone = $btn.clone(false);
      $btn.replaceWith($clone);

      $clone.on('click', function () {
        var isMobile = $(window).width() < 1200;

        if (isMobile) {
          // Mobile : slide complet via classe CSS
          $('#sidebar').toggleClass('sidebar-mobile-open');
        } else {
          // Desktop : basculer entre plein / icônes seules
          $('body').toggleClass('toggle-sidebar');
          // Forcer la fermeture des sous-menus collapse ouverts
          if ($('body').hasClass('toggle-sidebar')) {
            $('#sidebar .nav-content.show').collapse('hide');
          }
        }
      });
    })();

    /* --- Highlight ligne active DataTable au clic --- */
    $(document).on('click', '.table tbody tr', function () {
      $(this).closest('tbody').find('tr').removeClass('row-selected');
      $(this).addClass('row-selected');
    });

    /* --- Toastr config globale --- */
    if (typeof toastr !== 'undefined') {
      toastr.options = {
        positionClass: 'toast-top-right',
        timeOut: 4000,
        closeButton: true,
        progressBar: true,
        preventDuplicates: true,
        newestOnTop: true
      };
    }

  }); // end document.ready
</script>

<!-- Styles sidebar toggle + ligne sélectionnée -->
<style>
  /* ── Ligne DataTable sélectionnée ── */
  .table tbody tr.row-selected > td {
    background: rgba(26, 107, 74, 0.08) !important;
    border-left: 3px solid var(--color-accent, #0abf7c);
  }

  /* ── Transitions fluides (doivent être déclarées ici, APRÈS le CSS du template,
        pour ne pas être écrasées par Bootstrap/css/style.css) ── */
  #sidebar {
    transition: width 0.3s cubic-bezier(.4,0,.2,1),
                transform 0.3s cubic-bezier(.4,0,.2,1) !important;
    overflow: hidden !important;
    will-change: width;
  }
  #main {
    transition: margin-left 0.3s cubic-bezier(.4,0,.2,1) !important;
    will-change: margin-left;
  }

  /* ── Mode réduit (icônes seules) — desktop ── */
  body.toggle-sidebar #sidebar {
    width: 68px !important;
    min-width: 68px !important;
  }
  body.toggle-sidebar #main {
    margin-left: 68px !important;
  }
  /* Masquer textes et chevrons */
  body.toggle-sidebar #sidebar .nav-link span,
  body.toggle-sidebar #sidebar .nav-link .bi-chevron-down,
  body.toggle-sidebar #sidebar .sidebar-section-label {
    opacity: 0;
    width: 0;
    overflow: hidden;
    white-space: nowrap;
    display: inline-block; /* garder dans le flux mais invisible — évite le reflow brutal */
    transition: opacity 0.2s ease, width 0.2s ease;
  }
  body:not(.toggle-sidebar) #sidebar .nav-link span,
  body:not(.toggle-sidebar) #sidebar .nav-link .bi-chevron-down {
    opacity: 1;
    width: auto;
    transition: opacity 0.25s ease 0.05s, width 0.25s ease;
  }
  /* Centrer les icônes et agrandir légèrement */
  body.toggle-sidebar #sidebar .nav-link {
    justify-content: center !important;
    padding: 11px 0 !important;
  }
  body.toggle-sidebar #sidebar .nav-link i:first-child {
    font-size: 1.25rem !important;
    width: auto !important;
    margin: 0 !important;
  }
  /* Fermer les sous-menus */
  body.toggle-sidebar #sidebar .nav-content {
    display: none !important;
  }
  /* Tooltip natif au survol en mode réduit */
  body.toggle-sidebar #sidebar .nav-link {
    position: relative;
  }

  /* ── Mobile : slide depuis la gauche ── */
  @media (max-width: 1199px) {
    #sidebar {
      transform: translateX(-100%);
      width: var(--sidebar-width, 240px) !important;
    }
    #sidebar.sidebar-mobile-open {
      transform: translateX(0);
    }
    /* Overlay semi-transparent derrière le sidebar mobile */
    #sidebar.sidebar-mobile-open::after {
      content: '';
      position: fixed;
      inset: 0;
      background: rgba(0,0,0,0.35);
      z-index: -1;
    }
    #main {
      margin-left: 0 !important;
    }
  }
</style>

</body>
</html>