Différences

Ci-dessous, les différences entre deux révisions de la page.

--- gni:app:gfd:gfd [03/07/2026 07:45] – ajean
+++ gni:app:gfd:gfd [02/09/2026 15:28] (Version actuelle) – ajean
@@ Ligne 1: / Ligne 1: @@
 ~~NOCACHE~~
 <PHP>
-$PAGES = [
-    ['titre' => 'Présentation GFD',        'url' => '/doku.php?id=gni:app:gfd:presentation', 'desc' => 'Connexion, gestion des frais, aide utilisateur', 'color' => '#1A4A7A', 'bg' => '#E6F1FB', 'icon' => '<path d="M3 13l2-6h14l2 6M5 13h14v5H5z"/><circle cx="7.5" cy="18" r="1.5"/><circle cx="16.5" cy="18" r="1.5"/>'],
-    ['titre' => 'FAQ GFD',                 'url' => '/doku.php?id=gni:app:gfd:faq',          'desc' => 'Questions fréquemment posées sur GFD',           'color' => '#0F6E56', 'bg' => '#E1F5EE', 'icon' => '<circle cx="12" cy="12" r="10"/><path d="M9.09 9a3 3 0 015.83 1c0 2-3 3-3 3M12 17h.01"/>'],
-    ['titre' => 'Liste des guides',        'url' => '/doku.php?id=gni:app:gfd:tutos',        'desc' => 'Tous les tutoriels pas à pas GFD',               'color' => '#BA7517', 'bg' => '#FEF3C7', 'icon' => '<path d="M4 19.5A2.5 2.5 0 016.5 17H20"/><path d="M6.5 2H20v20H6.5A2.5 2.5 0 014 19.5v-15A2.5 2.5 0 016.5 2z"/>'],
-    ['titre' => 'Textes réglementaires',   'url' => '/doku.php?id=gni:app:gfd:textes',       'desc' => 'Décrets, circulaires et barèmes officiels',      'color' => '#7F77DD', 'bg' => '#F0EFFF', 'icon' => '<path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6z"/><path d="M14 2v6h6"/><path d="M9 13h6M9 17h6"/>'],
-    ['titre' => 'GLPI - Support GFD',      'url' => 'https://glpi.gretani.com',              'desc' => 'Ouvrir un ticket pour toute demande liée à GFD', 'color' => '#D85A30', 'bg' => '#FEF0EB', 'icon' => '<path d="M9 11l3 3L22 4"/><path d="M21 12v7a2 2 0 01-2 2H5a2 2 0 01-2-2V5a2 2 0 012-2h11"/>'],
-];
 echo '
 <style>
-.gfdidx-wrap { font-family: Arial, sans-serif; font-size: 14px; color: #333; width: 100%; }
+.gfd-wrap { font-family: Arial, sans-serif; font-size: 14px; color: #333; max-width: 780px; }
-.gfdidx-title { font-size: 20px; font-weight: 700; color: #1a2d4a; margin-bottom: 6px; }
+.gfd-title { font-size: 20px; font-weight: 700; color: #1a2d4a; margin-bottom: 6px; }
-.gfdidx-intro { font-size: 13px; color: #666; margin-bottom: 22px; border-left: 3px solid #378ADD; padding: 6px 0 6px 14px; line-height: 1.6; }
+.gfd-intro { font-size: 13px; color: #666; margin-bottom: 28px; border-left: 3px solid #378ADD; padding: 6px 0 6px 14px; line-height: 1.6; }
-.gfdidx-cards { display: flex; flex-wrap: wrap; gap: 14px; }
-.gfdidx-card { background: #fff; border: 0.5px solid #dde3ec; border-radius: 12px; padding: 1.2rem 1.4rem; text-decoration: none; display: block; flex: 1 1 220px; min-width: 220px; transition: border-color 0.15s, background 0.15s; }
+.gfd-section { margin-bottom: 26px; }
-.gfdidx-card:hover { text-decoration: none; }
+.gfd-section-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
-.gfdidx-card-top { display: flex; justify-content: space-between; align-items: flex-start; }
+.gfd-section-num { flex-shrink: 0; width: 32px; height: 32px; border-radius: 50%; background: #1A4A7A; color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 14px; }
-.gfdidx-card-icon { width: 40px; height: 40px; border-radius: 10px; display: flex; align-items: center; justify-content: center; margin-bottom: 14px; }
+.gfd-section-title { font-size: 16px; font-weight: 700; color: #1a2d4a; }
-.gfdidx-card-icon svg { width: 19px; height: 19px; }
-.gfdidx-card-arrow { font-size: 18px; color: #ccc; }
+.gfd-block { background: #fff; border: 0.5px solid #dde3ec; border-radius: 12px; padding: 18px 20px; margin-bottom: 14px; }
-.gfdidx-card-title { font-size: 14px; font-weight: 700; color: #1a2d4a; margin-bottom: 4px; }
+.gfd-block:last-child { margin-bottom: 0; }
-.gfdidx-card-desc { font-size: 12px; color: #999; line-height: 1.4; }
+.gfd-block-title { font-size: 13.5px; font-weight: 700; color: #1A4A7A; margin-bottom: 10px; }
+.gfd-subblock-title { font-size: 12.5px; font-weight: 700; color: #666; margin: 12px 0 6px; }
+.gfd-subblock-title:first-child { margin-top: 0; }
+.gfd-text { font-size: 13px; color: #444; line-height: 1.75; margin-bottom: 10px; }
+.gfd-text:last-child { margin-bottom: 0; }
+.gfd-text a { color: #1A4A7A; font-weight: 600; text-decoration: none; }
+.gfd-text a:hover { text-decoration: underline; }
+.gfd-warning-inline { display: inline-block; background: #FEF3C7; color: #B45309; font-weight: 700; padding: 1px 8px; border-radius: 4px; }
+.gfd-btn { display: inline-flex; align-items: center; gap: 8px; background: #1A4A7A; color: #fff !important; font-weight: 600; padding: 9px 18px; border-radius: 8px; text-decoration: none !important; font-size: 12.5px; margin-top: 4px; margin-right: 8px; }
+.gfd-btn:hover { background: #378ADD; }
+.gfd-btn-secondary { background: #0F6E56; }
+.gfd-btn-secondary:hover { background: #1D9E75; }
+.gfd-callout { background: #FEF3C7; border: 1px solid #FCD34D; border-left: 4px solid #F59E0B; border-radius: 0 8px 8px 0; padding: 14px 18px; font-size: 13px; color: #92400E; margin-top: 10px; }
+.gfd-check-list { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
+.gfd-check-item { display: flex; align-items: flex-start; gap: 10px; font-size: 13px; color: #444; line-height: 1.6; }
+.gfd-check-item svg { flex-shrink: 0; margin-top: 3px; }
+.gfd-final { background: #E1F5EE; border: 1px solid #b9e6d3; border-radius: 12px; padding: 18px 20px; }
 </style>';
-echo '<div class="gfdidx-wrap">';
-echo '<div class="gfdidx-title">La Gestion des Frais de Déplacements (GFD)</div>';
+echo '<div class="gfd-wrap">';
-echo '<p class="gfdidx-intro">Vous trouverez ici toutes les informations et ressources liées à la gestion des frais de déplacements.</p>';
-echo '<div class="gfdidx-cards">';
+echo '<div class="gfd-title">La Gestion des Frais de Déplacements (GFD)</div>';
-foreach ($PAGES as $p) {
-    $titre  = htmlspecialchars($p['titre']);
+echo '<p class="gfd-intro">L\'entière gestion des déplacements doit se faire au travers du logiciel GFD pour tous les personnels, de la demande préalable de déplacement jusqu\'à la saisie des états de frais.</p>';
-    $desc   = htmlspecialchars($p['desc']);
-    $url    = htmlspecialchars($p['url']);
-    $target = (strpos($p['url'], 'http') === 0) ? " target='_blank'" : '';
+// ─────────────────────────────────────────────
-    echo "<a class='gfdidx-card' href='{$url}'{$target}
+// Section 1 : Accès et connexion
-        onmouseover=\"this.style.borderColor='{$p['color']}';this.style.background='{$p['bg']}'\"
+// ─────────────────────────────────────────────
-        onmouseout=\"this.style.borderColor='#dde3ec';this.style.background='#fff'\">
-        <div class='gfdidx-card-top'>
+echo '<div class="gfd-section">';
-            <div class='gfdidx-card-icon' style='background:{$p['bg']}'>
-                <svg viewBox='0 0 24 24' fill='none' stroke='{$p['color']}' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'>{$p['icon']}</svg>
+echo '<div class="gfd-section-head">
-            </div>
+        <div class="gfd-section-num">1</div>
-            <span class='gfdidx-card-arrow'>→</span>
+        <div class="gfd-section-title">Accès et connexion</div>
-        </div>
+      </div>';
-        <div class='gfdidx-card-title'>{$titre}</div>
-        <div class='gfdidx-card-desc'>{$desc}</div>
+echo '<div class="gfd-block">';
-    </a>";
-}
+echo '<p class="gfd-text">
+Les utilisateurs ont accès au portail à l\'adresse :
+<a href="https://gfd.gretani.com/pv2/Login.jsp" target="_blank">gfd.gretani.com</a>
+</p>';
+echo '<p class="gfd-text">
+Lors de la première connexion, votre identifiant et votre mot de passe sont :
+<sup>re</sup> lettre du prénom – Nom (Ex : MJOUVE / MJOUVE).
+</p>';
+echo '<p class="gfd-text">
+Vous devez <span class="gfd-warning-inline">OBLIGATOIREMENT</span>
+changer votre mot de passe lors de cette première connexion pour garantir la confidentialité des accès :
+</p>';
+echo '<p class="gfd-text">
+Sous votre nom, en haut à droite, cliquez sur <strong>Mon compte</strong>,
+puis <strong>Changer de mot de passe</strong>.<br>
+Une fois que c\'est fait, cliquez sur <strong>Enregistrer</strong> puis <strong>Déconnexion</strong>.<br>
+Vous vous connectez ensuite avec votre nouveau mot de passe.
+</p>';
+echo '<a class="gfd-btn"
+href="https://files.gretani.com/gni/gfd/tutos/Guide_GFD_Connexion.pdf"
+target="_blank">
+<svg viewBox="0 0 24 24" width="14" height="14" fill="none" stroke="#fff" stroke-width="2">
+<path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6z"/>
+<path d="M14 2v6h6"/>
+</svg>
+Tutoriel de connexion
+</a>';
 echo '</div>';
 echo '</div>';
+// ─────────────────────────────────────────────
+// Section 2 : Gestion des Frais
+// ─────────────────────────────────────────────
+echo '<div class="gfd-section">';
+echo '<div class="gfd-section-head">
+        <div class="gfd-section-num">2</div>
+        <div class="gfd-section-title">Gestion des Frais</div>
+      </div>';
+// Étape 1
+echo '<div class="gfd-block">';
+echo '<div class="gfd-block-title">
+a. Étape 1 : la gestion du véhicule personnel
+</div>';
+echo '<p class="gfd-text">
+Avant toute chose, vous devez avoir préalablement numérisé votre carte grise et votre attestation d\'assurance comportant des dates :
+ce sont des pièces obligatoires dans le système.
+</p>';
+echo '<p class="gfd-text">
+La carte grise doit être à votre nom.
+Si ce n\'est pas le cas, il faudra nous transmettre une preuve d\'affiliation
+(exemple : livret de famille).
+</p>';
+echo '<p class="gfd-text">
+Vous devez transmettre ces justificatifs au gestionnaire des Frais de Déplacements "GFD"
+par l\'intermédiaire du service
+<a href="https://glpi.gretani.com" target="_blank">GLPI</a>
+de ticket (rubrique Applicatifs/GFD)
+ou, pour les vacataires, par email uniquement sur l\'adresse
+<a href="mailto:gfd@gretani.com">gfd@gretani.com</a>.
+</p>';
+echo '</div>';
+// Étape 2
+echo '<div class="gfd-block">';
+echo '<div class="gfd-block-title">
+b. Étape 2 : les Ordres de mission
+</div>';
+echo '<div class="gfd-subblock-title">
+Cas 1 – Vous avez un ordre de Mission Permanent
+</div>';
+echo '<p class="gfd-text">
+Le document a été préalablement établi et visé,
+vous le trouverez dans votre espace personnel.
+</p>';
+echo '<div class="gfd-subblock-title">
+Cas 2 – Vous devez compléter un OMI (Ordre de Mission Individuel)
+</div>';
+echo '<p class="gfd-text">
+L\'OMI doit être complété <strong>avant</strong> de partir en déplacement
+(un contrôle des dates est opéré par le système).
+</p>';
+echo '</div>';
+// Étape 3
+echo '<div class="gfd-block">';
+echo '<div class="gfd-block-title">
+c. Étape 3 : la saisie des Frais
+</div>';
+echo '<p class="gfd-text">
+Une fois votre véhicule renseigné, votre « Autorisation d\'Utilisation du Véhicule » (AUV)
+et votre OMI et/ou OMP visé par l\'ordonnateur (VISA7),
+vous pourrez commencer la saisie de vos frais.
+</p>';
+echo '<p class="gfd-text">
+Une fois le déplacement réalisé,
+vous devrez saisir vos frais accompagnés de vos justificatifs directement dans l\'outil.
+</p>';
+echo '<div class="gfd-callout">
+<strong>Nous n\'acceptons aucun autre canal.</strong>
+</div>';
+echo '</div>';
+echo '</div>';
+// ─────────────────────────────────────────────
+// Section 3 : Aide utilisateur
+// ─────────────────────────────────────────────
+echo '<div class="gfd-section">';
+echo '<div class="gfd-section-head">
+        <div class="gfd-section-num">3</div>
+        <div class="gfd-section-title">Aide utilisateur</div>
+      </div>';
+echo '<div class="gfd-block">';
+$base = defined('DOKU_BASE') ? DOKU_BASE : '/';
+echo '<p class="gfd-text">
+Une <a href="' . htmlspecialchars($base . 'doku.php?id=gni:app:gfd:tutos') . '">
+liste des guides
+</a>
+est disponible et reprend tous les éléments utiles.
+</p>';
+echo '<p class="gfd-text">
+Nous avons alimenté une
+<a href="https://gni.gretani.com/doku.php?id=gni:app:gfd:faq" target="_blank">
+FAQ
+</a>
+qui reprend les questions les plus fréquemment posées.
+</p>';
+echo '<p class="gfd-text">
+Enfin, vous trouverez tous les
+<a href="https://glpi.gretani.com" target="_blank">
+GLPI
+</a>
+relatifs aux frais de déplacements.
+</p>';
+echo '<div class="gfd-callout">
+Pour toute demande, merci d\'utiliser <strong>UNIQUEMENT</strong>
+le service GLPI de ticket avec la thématique GFD.
+Merci de bien renseigner votre ticket,
+les gestionnaires vous contacteront directement si besoin.
+</div>';
+echo '</div>';
+echo '</div>';
+// ─────────────────────────────────────────────
+// Section 4 : Conclusion
+// ─────────────────────────────────────────────
+echo '<div class="gfd-section">';
+echo '<div class="gfd-section-head">
+        <div class="gfd-section-num">4</div>
+        <div class="gfd-section-title">Conclusion</div>
+      </div>';
+echo '<div class="gfd-final">';
+echo '<p class="gfd-text">
+GFD nous permet de fluidifier le traitement des frais de déplacement.
+</p>';
+echo '<p class="gfd-text">
+Ergonomique, le portail simplifie et sécurise les demandes de déplacement et la saisie des frais :
+</p>';
+echo '<div class="gfd-check-list">';
+echo '<div class="gfd-check-item">
+<svg viewBox="0 0 24 24" width="16" height="16"
+fill="none" stroke="#1D9E75" stroke-width="2"
+stroke-linecap="round" stroke-linejoin="round">
+<path d="M22 11.08V12a10 10 0 11-5.93-9.14"/>
+<path d="M22 4L12 14.01l-3-3"/>
+</svg>
+<span>
+L\'ensemble des visas est intégré dans l\'outil ⇒ plus de signature
+</span>
+</div>';
+echo '<div class="gfd-check-item">
+<svg viewBox="0 0 24 24" width="16" height="16"
+fill="none" stroke="#1D9E75" stroke-width="2"
+stroke-linecap="round" stroke-linejoin="round">
+<path d="M22 11.08V12a10 10 0 11-5.93-9.14"/>
+<path d="M22 4L12 14.01l-3-3"/>
+</svg>
+<span>
+Les pièces sont conservées et accessibles dans votre espace
+</span>
+</div>';
+echo '</div>';
+echo '</div>';
+echo '</div>';
+echo '</div>';
 </PHP>