Dashboard LCJ<\/title>\r\n <link href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/flowbite\/2.2.1\/flowbite.min.css\" rel=\"stylesheet\">\r\n <link href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.1\/css\/all.min.css\" rel=\"stylesheet\">\r\n <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/chart.js\"><\/script>\r\n <style>\r\n :root {\r\n --primary: #2563eb;\r\n --secondary: #4f46e5;\r\n --success: #16a34a;\r\n --warning: #ca8a04;\r\n --error: #dc2626;\r\n --orange: #ea580c;\r\n --purple: #9333ea;\r\n --teal: #0d9488;\r\n }\r\n\r\n body {\r\n margin: 0;\r\n min-height: 100vh;\r\n background-color: #f1f5f9;\r\n font-family: system-ui, -apple-system, sans-serif;\r\n }\r\n\r\n .main-content {\r\n padding: 2rem;\r\n width: 100%;\r\n box-sizing: border-box;\r\n max-width: 100vw;\r\n overflow-x: hidden;\r\n }\r\n\r\n .header {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n margin-bottom: 2rem;\r\n padding: 1.5rem;\r\n background: white;\r\n border-radius: 0.5rem;\r\n box-shadow: 0 1px 3px rgba(0,0,0,0.1);\r\n }\r\n\r\n .quick-actions {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\r\n gap: 1.5rem;\r\n margin-bottom: 2rem;\r\n }\r\n\r\n .action-card {\r\n background: white;\r\n padding: 1.5rem;\r\n border-radius: 0.5rem;\r\n box-shadow: 0 1px 3px rgba(0,0,0,0.1);\r\n text-decoration: none;\r\n color: inherit;\r\n transition: transform 0.2s;\r\n display: flex;\r\n align-items: center;\r\n gap: 1rem;\r\n }\r\n\r\n .action-card:hover {\r\n transform: translateY(-2px);\r\n }\r\n\r\n .action-icon {\r\n width: 48px;\r\n height: 48px;\r\n border-radius: 12px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: white;\r\n font-size: 1.5rem;\r\n }\r\n\r\n .action-info h3 {\r\n margin: 0;\r\n font-size: 1.1rem;\r\n font-weight: 500;\r\n }\r\n\r\n .action-info p {\r\n margin: 0;\r\n font-size: 0.875rem;\r\n color: #64748b;\r\n }\r\n\r\n .stats-grid {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\r\n gap: 1.5rem;\r\n margin-bottom: 2rem;\r\n }\r\n\r\n .stats-card {\r\n background: white;\r\n padding: 1.5rem;\r\n border-radius: 0.5rem;\r\n box-shadow: 0 1px 3px rgba(0,0,0,0.1);\r\n }\r\n\r\n .stats-header {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n margin-bottom: 1rem;\r\n }\r\n\r\n .chart-container {\r\n position: relative;\r\n height: 400px;\r\n width: 100%;\r\n }\r\n\r\n .planning-section {\r\n background: white;\r\n border-radius: 0.5rem;\r\n box-shadow: 0 1px 3px rgba(0,0,0,0.1);\r\n margin: 2rem -2rem -2rem -2rem;\r\n overflow: hidden;\r\n }\r\n\r\n .planning-header {\r\n padding: 1.5rem;\r\n border-bottom: 1px solid #e2e8f0;\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n }\r\n\r\n .planning-iframe {\r\n width: 100%;\r\n height: calc(100vh - 400px);\r\n min-height: 600px;\r\n border: none;\r\n transform: scale(1);\r\n transform-origin: top left;\r\n }\r\n\r\n .next-update {\r\n display: inline-flex;\r\n align-items: center;\r\n padding: 0.5rem 1rem;\r\n background: rgba(37, 99, 235, 0.1);\r\n border-radius: 0.5rem;\r\n color: var(--primary);\r\n font-size: 0.875rem;\r\n }\r\n\r\n .tab-buttons {\r\n display: flex;\r\n gap: 1rem;\r\n margin-bottom: 2rem;\r\n padding: 0.5rem;\r\n background: white;\r\n border-radius: 0.5rem;\r\n box-shadow: 0 1px 3px rgba(0,0,0,0.1);\r\n }\r\n\r\n .tab-button {\r\n padding: 0.75rem 1.5rem;\r\n border: none;\r\n background: transparent;\r\n color: #64748b;\r\n border-radius: 0.5rem;\r\n cursor: pointer;\r\n transition: all 0.2s;\r\n }\r\n\r\n .tab-button.active {\r\n background: var(--primary);\r\n color: white;\r\n }\r\n\r\n .tab-content {\r\n display: none;\r\n }\r\n\r\n .tab-content.active {\r\n display: block;\r\n }\r\n\r\n .meeting-notes {\r\n background: white;\r\n padding: 2rem;\r\n border-radius: 0.5rem;\r\n box-shadow: 0 1px 3px rgba(0,0,0,0.1);\r\n margin-bottom: 2rem;\r\n }\r\n\r\n .meeting-section {\r\n margin-bottom: 1.5rem;\r\n padding-bottom: 1.5rem;\r\n border-bottom: 1px solid #e2e8f0;\r\n }\r\n\r\n .meeting-section:last-child {\r\n border-bottom: none;\r\n margin-bottom: 0;\r\n padding-bottom: 0;\r\n }\r\n\r\n @media (prefers-color-scheme: dark) {\r\n body {\r\n background-color: #0f172a;\r\n }\r\n\r\n .header, .action-card, .stats-card, .planning-section,\r\n .tab-buttons, .meeting-notes {\r\n background-color: #1e293b;\r\n border-color: #334155;\r\n }\r\n\r\n .action-info p {\r\n color: #94a3b8;\r\n }\r\n\r\n .tab-button {\r\n color: #94a3b8;\r\n }\r\n\r\n .tab-button.active {\r\n background: var(--primary);\r\n color: white;\r\n }\r\n }\r\n\r\n @media (max-width: 768px) {\r\n .main-content {\r\n padding: 1rem;\r\n }\r\n\r\n .quick-actions, .stats-grid {\r\n grid-template-columns: 1fr;\r\n }\r\n\r\n .planning-section {\r\n margin: 1rem -1rem -1rem -1rem;\r\n }\r\n\r\n .planning-iframe {\r\n height: 400px;\r\n }\r\n\r\n .tab-buttons {\r\n flex-wrap: wrap;\r\n }\r\n\r\n .tab-button {\r\n flex: 1 1 auto;\r\n text-align: center;\r\n padding: 0.5rem;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <main class=\"main-content\">\r\n <div class=\"header\">\r\n <h1 class=\"text-2xl font-bold text-gray-900 dark:text-white\">Le Comptoir JunaSol<\/h1>\r\n <div class=\"next-update\">\r\n <i class=\"fas fa-calendar-week mr-2\"><\/i>\r\n <span id=\"nextUpdate\"><\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"tab-buttons\">\r\n <button class=\"tab-button active\" data-tab=\"dashboard\">\r\n <i class=\"fas fa-chart-line mr-2\"><\/i>Tableau de bord\r\n <\/button>\r\n <button class=\"tab-button\" data-tab=\"actions\">\r\n <i class=\"fas fa-tasks mr-2\"><\/i>Actions rapides\r\n <\/button>\r\n <button class=\"tab-button\" data-tab=\"planning\">\r\n <i class=\"fas fa-calendar mr-2\"><\/i>Planning\r\n <\/button>\r\n <button class=\"tab-button\" data-tab=\"meeting\">\r\n <i class=\"fas fa-file-alt mr-2\"><\/i>Compte rendu\r\n <\/button>\r\n <\/div>\r\n \r\n <div id=\"dashboard\" class=\"tab-content active\">\r\n <div class=\"stats-grid\">\r\n <div class=\"stats-card\">\r\n <div class=\"stats-header\">\r\n <h2 class=\"text-lg font-semibold text-gray-900 dark:text-white\">Ventes Hebdomadaires<\/h2>\r\n <div class=\"data-controls\">\r\n <button id=\"toggleWeeklyView\">\r\n <i class=\"fas fa-chart-line mr-2\"><\/i>\r\n Changer vue\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n <div class=\"chart-container\">\r\n <canvas id=\"weeklyChart\"><\/canvas>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"stats-card\">\r\n <div class=\"stats-header\">\r\n <h2 class=\"text-lg font-semibold text-gray-900 dark:text-white\">Ventes Mensuelles<\/h2>\r\n <div class=\"data-controls\">\r\n <button id=\"toggleMonthlyView\">\r\n <i class=\"fas fa-chart-bar mr-2\"><\/i>\r\n Changer vue\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n <div class=\"chart-container\">\r\n <canvas id=\"monthlyChart\"><\/canvas>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div id=\"actions\" class=\"tab-content\">\r\n <div class=\"quick-actions\">\r\n <a href=\"https:\/\/dolibarr.lecomptoirjunasol.coop\/dolibarr\/\" target=\"_blank\" class=\"action-card\">\r\n <div class=\"action-icon\" style=\"background-color: var(--success)\">\r\n <i class=\"fas fa-database\"><\/i>\r\n <\/div>\r\n <div class=\"action-info\">\r\n <h3 class=\"dark:text-white\">Dolibarr<\/h3>\r\n <p>Syst\u00e8me de gestion<\/p>\r\n <\/div>\r\n <\/a>\r\n\r\n <a href=\"https:\/\/drive.google.com\/file\/d\/1tIcAXLRZy6L1Ofxq3IpiXAXgcu0uVqQy\/view?usp=drive_link\" target=\"_blank\" class=\"action-card\">\r\n <div class=\"action-icon\" style=\"background-color: var(--orange)\">\r\n <i class=\"fas fa-file-pdf\"><\/i>\r\n <\/div>\r\n <div class=\"action-info\">\r\n <h3 class=\"dark:text-white\">Formulaire Souscription<\/h3>\r\n <p>Personnes Physiques<\/p>\r\n <\/div>\r\n <\/a>\r\n\r\n <a href=\"https:\/\/drive.google.com\/drive\/folders\/1Th9pjNW6msJTICCBM1hS9eSoAHvaCneJ?usp=drive_link\" target=\"_blank\" class=\"action-card\">\r\n <div class=\"action-icon\" style=\"background-color: var(--primary)\">\r\n <i class=\"fas fa-folder\"><\/i>\r\n <\/div>\r\n <div class=\"action-info\">\r\n <h3 class=\"dark:text-white\">Documents<\/h3>\r\n <p>Dossier Google Drive<\/p>\r\n <\/div>\r\n <\/a>\r\n\r\n <a href=\"https:\/\/kdrive.infomaniak.com\/app\/share\/804086\/02cd95c4-62fc-488c-9ac4-41e4f3e1e4e5\" target=\"_blank\" class=\"action-card\">\r\n <div class=\"action-icon\" style=\"background-color: var(--warning)\">\r\n <i class=\"fas fa-hard-hat\"><\/i>\r\n <\/div>\r\n <div class=\"action-info\">\r\n <h3 class=\"dark:text-white\">Projets Travaux<\/h3>\r\n <p>Devis et suivis<\/p>\r\n <\/div>\r\n <\/a>\r\n\r\n <a href=\"https:\/\/kdrive.infomaniak.com\/app\/share\/804086\/ec806eef-af39-44f0-8dd5-3856fe3273ed\" target=\"_blank\" class=\"action-card\">\r\n <div class=\"action-icon\" style=\"background-color: var(--purple)\">\r\n <i class=\"fas fa-file-lines\"><\/i>\r\n <\/div>\r\n <div class=\"action-info\">\r\n <h3 class=\"dark:text-white\">Comptes Rendus<\/h3>\r\n <p>R\u00e9unions et d\u00e9cisions<\/p>\r\n <\/div>\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div id=\"planning\" class=\"tab-content\">\r\n <div class=\"planning-section\">\r\n <div class=\"planning-header\">\r\n <h2 class=\"text-xl font-bold text-gray-900 dark:text-white\">Planning des Facturiers<\/h2>\r\n <div class=\"flex items-center gap-4\">\r\n <span class=\"text-sm text-gray-500 dark:text-gray-400\">Mis \u00e0 jour en temps r\u00e9el<\/span>\r\n <\/div>\r\n <\/div>\r\n <iframe \r\n class=\"planning-iframe\"\r\n src=\"https:\/\/docs.google.com\/spreadsheets\/d\/e\/2PACX-1vTmcyvXivweeMMiNPiR-gMjVqrRfxeeGMK9w4TGCYKywDTCHr0dvJXDhxoF6He8fF6bcT5uVd-z3V3c\/pubhtml?gid=431090812&single=true&widget=true&headers=false\"\r\n allowfullscreen=\"true\">\r\n <\/iframe>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div id=\"meeting\" class=\"tab-content\">\r\n <div class=\"meeting-notes\">\r\n <h2 class=\"text-2xl font-bold mb-6 text-gray-900 dark:text-white\">\r\n Compte rendu r\u00e9union du conseil de gouvernance - mardi 14 janvier 2025\r\n <\/h2>\r\n\r\n <div class=\"meeting-section\">\r\n <h3 class=\"text-xl font-semibold mb-4 text-gray-900 dark:text-white\">Secr\u00e9taire de s\u00e9ance<\/h3>\r\n <p class=\"text-gray-700 dark:text-gray-300\">Monique<\/p>\r\n <\/div>\r\n\r\n <div class=\"meeting-section\">\r\n <h3 class=\"text-xl font-semibold mb-4 text-gray-900 dark:text-white\">Questions de gouvernance<\/h3>\r\n <p class=\"text-gray-700 dark:text-gray-300\">Fichier Actions : Actions (Tous)<\/p>\r\n <\/div>\r\n\r\n <div class=\"meeting-section\">\r\n <h3 class=\"text-xl font-semibold mb-4 text-gray-900 dark:text-white\">Ajout des nouveaux coop\u00e9rateurs (358)<\/h3>\r\n <div class=\"ml-4\">\r\n <h4 class=\"font-medium mb-2 text-gray-800 dark:text-gray-200\">Personnes physiques<\/h4>\r\n <ul class=\"list-disc ml-6 text-gray-700 dark:text-gray-300\">\r\n <li>B\u00e9n\u00e9dicte Leblanc-Gravel<\/li>\r\n <\/ul>\r\n <h4 class=\"font-medium mt-3 mb-2 text-gray-800 dark:text-gray-200\">Personnes morales<\/h4>\r\n <p class=\"text-gray-700 dark:text-gray-300\">RAS<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"meeting-section\">\r\n <h3 class=\"text-xl font-semibold mb-4 text-gray-900 dark:text-white\">Cl\u00f4ture comptable<\/h3>\r\n <p class=\"mb-2 text-gray-700 dark:text-gray-300\">Retour re\u00e7u le 3\/01\/2025<\/p>\r\n <div class=\"p-4 bg-green-50 dark:bg-green-900 rounded-lg\">\r\n <p class=\"text-green-800 dark:text-green-200\">\r\n Bonne sant\u00e9 de notre Scic, marge en progr\u00e8s, petit b\u00e9n\u00e9fice de 1 692\u20ac\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"meeting-section\">\r\n <h3 class=\"text-xl font-semibold mb-4 text-gray-900 dark:text-white\">Prochaine r\u00e9union<\/h3>\r\n <p class=\"text-gray-700 dark:text-gray-300\">\r\n Mardi 11 f\u00e9vrier ? A voir selon la date de l'AG.\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/main>\r\n\r\n <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/flowbite\/2.2.1\/flowbite.min.js\"><\/script>\r\n <script>\r\n let weeklyChart, monthlyChart;\r\n\r\n \/\/ Tab switching\r\n document.querySelectorAll('.tab-button').forEach(button => {\r\n button.addEventListener('click', () => {\r\n \/\/ Remove active class from all buttons and contents\r\n document.querySelectorAll('.tab-button').forEach(btn => btn.classList.remove('active'));\r\n document.querySelectorAll('.tab-content').forEach(content => content.classList.remove('active'));\r\n \r\n \/\/ Add active class to clicked button and corresponding content\r\n button.classList.add('active');\r\n document.getElementById(button.dataset.tab).classList.add('active');\r\n });\r\n });\r\n\r\n function generateRandomData(min, max, count) {\r\n return Array.from({length: count}, () => \r\n Math.floor(Math.random() * (max - min + 1)) + min\r\n );\r\n }\r\n\r\n function getNextWeekUpdate() {\r\n const now = new Date();\r\n const nextMonday = new Date(now);\r\n nextMonday.setDate(now.getDate() + ((1 + 7 - now.getDay()) % 7));\r\n nextMonday.setHours(0, 0, 0, 0);\r\n return nextMonday;\r\n }\r\n\r\n function updateNextUpdateDisplay() {\r\n const nextUpdate = getNextWeekUpdate();\r\n const nextUpdateStr = nextUpdate.toLocaleString('fr-FR', {\r\n weekday: 'long',\r\n day: 'numeric',\r\n month: 'long'\r\n });\r\n document.getElementById('nextUpdate').textContent = `Prochaine mise \u00e0 jour : ${nextUpdateStr}`;\r\n }\r\n\r\n function scheduleNextUpdate() {\r\n const now = new Date();\r\n const nextUpdate = getNextWeekUpdate();\r\n const timeUntilUpdate = nextUpdate.getTime() -\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Du lundi au Samedide 9h00 \u00e0 12h30et de 16h00 \u00e0 19h30 Dashboard LCJ Le Comptoir JunaSol Tableau de bord Actions rapides Planning Compte rendu Ventes Hebdomadaires Changer vue Ventes Mensuelles Changer vue Dolibarr Syst\u00e8me de gestion Formulaire Souscription Personnes Physiques Documents Dossier Google Drive Projets Travaux Devis et suivis Comptes Rendus R\u00e9unions et d\u00e9cisions Planning […]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_mc_calendar":[],"footnotes":""},"class_list":["post-204","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.lecomptoirjunasol.coop\/index.php?rest_route=\/wp\/v2\/pages\/204","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.lecomptoirjunasol.coop\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.lecomptoirjunasol.coop\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.lecomptoirjunasol.coop\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.lecomptoirjunasol.coop\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=204"}],"version-history":[{"count":20,"href":"https:\/\/www.lecomptoirjunasol.coop\/index.php?rest_route=\/wp\/v2\/pages\/204\/revisions"}],"predecessor-version":[{"id":3364,"href":"https:\/\/www.lecomptoirjunasol.coop\/index.php?rest_route=\/wp\/v2\/pages\/204\/revisions\/3364"}],"wp:attachment":[{"href":"https:\/\/www.lecomptoirjunasol.coop\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=204"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}