MZA Rendez-vous Manager<\/title>\n<style>\n:root{\n --bg:#07111f;--panel:#0d1b2a;--panel2:#12263a;--line:#29435f;\n --text:#f5f7fb;--muted:#aab8c8;--gold:#d4af37;--gold2:#f4d77a;\n --ok:#2ecc71;--warn:#f39c12;--danger:#e74c3c;--info:#3498db;\n}\n*{box-sizing:border-box}\nbody{margin:0;background:linear-gradient(180deg,#06101d,#0b1726 52%,#07111f);color:var(--text);font-family:Arial,Helvetica,sans-serif}\nbutton,input,select,textarea{font:inherit}\n.wrap{max-width:1650px;margin:auto;padding:22px}\n.header{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:20px 22px;border:1px solid var(--line);background:#0d1b2a;border-radius:18px;position:sticky;top:10px;z-index:30}\n.brand{font-weight:900;font-size:20px}.brand small{display:block;color:var(--gold2);font-size:12px;margin-top:4px}\n.pill{padding:8px 12px;border:1px solid rgba(212,175,55,.6);border-radius:999px;color:var(--gold2)}\n.hero{text-align:center;padding:46px 10px 24px}\n.hero h1{font-size:clamp(34px,5vw,64px);margin:0 0 12px;letter-spacing:-2px}\n.hero h1 span{color:var(--gold2)}\n.hero p{color:var(--muted);max-width:1000px;margin:auto;line-height:1.6}\n.stats{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin:16px 0}\n.stat{padding:18px;border:1px solid var(--line);border-radius:16px;background:#0b1827}\n.stat span{color:var(--muted);font-size:12px}.stat b{display:block;font-size:24px;margin-top:8px}\n.card{border:1px solid var(--line);background:linear-gradient(180deg,#102238,#0a1726);border-radius:20px;padding:22px;margin:16px 0}\n.card h2{margin:0 0 6px}.sub{color:var(--muted);margin:0 0 18px}\n.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}\n.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}\n.field{display:flex;flex-direction:column;gap:6px}\n.field label{font-size:12px;font-weight:800;color:#d8e2ec}\n.field input,.field select,.field textarea{padding:13px 14px;border:1px solid #35516e;border-radius:12px;background:#081421;color:#fff;outline:none}\n.field textarea{min-height:90px;resize:vertical}\n.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}\n.btn{padding:12px 16px;border-radius:11px;border:0;cursor:pointer;font-weight:900}\n.btn-primary{background:linear-gradient(90deg,var(--gold),var(--gold2));color:#18130b}\n.btn-ghost{background:#102238;color:#fff;border:1px solid #37536f}\n.toolbar{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:12px}\n.search{min-width:240px;flex:1;padding:12px 14px;border:1px solid #35516e;border-radius:11px;background:#081421;color:#fff}\n.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:14px}\ntable{width:100%;border-collapse:collapse;min-width:1200px}\nth,td{padding:12px 10px;border-bottom:1px solid #21384f;text-align:left;font-size:13px}\nth{background:#0a1726;color:var(--gold2)}\n.badge{display:inline-block;padding:6px 9px;border-radius:999px;font-size:11px;font-weight:900}\n.ok{background:#173a2a;color:#b8ffd0}.warn{background:#4d2e10;color:#ffd7a3}.bad{background:#4a1717;color:#ffd0d0}.info{background:#113b52;color:#a7e4ff}\n.mini{padding:7px 9px;border-radius:8px;border:1px solid #35516e;background:#102238;color:#fff;cursor:pointer}\n.notice{padding:12px 14px;border:1px solid #33506d;border-radius:12px;background:#102238;color:#dbe7f3;margin-top:12px}\n.calendar{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}\n.day{min-height:120px;border:1px solid var(--line);border-radius:12px;background:#0a1726;padding:10px}\n.day b{display:block;color:var(--gold2);margin-bottom:8px}\n.appt{padding:7px;border-radius:8px;background:#102238;border:1px solid #35516e;margin:5px 0;font-size:11px}\n@media(max-width:1200px){.grid{grid-template-columns:repeat(2,1fr)}.stats{grid-template-columns:repeat(3,1fr)}}\n@media(max-width:800px){.calendar{grid-template-columns:1fr}.day{min-height:auto}}\n@media(max-width:700px){.grid,.grid2,.stats{grid-template-columns:1fr}.header{position:static;align-items:flex-start;flex-direction:column}.wrap{padding:12px}}\n@media print{.header,.hero,.actions,.toolbar,.no-print{display:none!important}body{background:#fff;color:#000}.card,.stat,.day{background:#fff;color:#000;border:1px solid #aaa}th{background:#eee;color:#000}}\n<\/style>\n<\/head>\n<body>\n<div class=\"wrap\">\n <div class=\"header\">\n <div class=\"brand\">MAROC ZAIN ACADEMY <small>RENDEZ-VOUS MANAGER\u2122<\/small><\/div>\n <div class=\"pill\">Admissions \u2022 Entreprises \u2022 Formateurs \u2022 Orientation<\/div>\n <\/div>\n\n <section class=\"hero\">\n <h1>Gestionnaire des <span>rendez-vous<\/span><\/h1>\n <p>Centralisez les entretiens d’admission, rendez-vous entreprises, orientations, r\u00e9unions formateurs et rendez-vous administratifs dans une seule interface.<\/p>\n <\/section>\n\n <section class=\"stats\">\n <div class=\"stat\"><span>Total rendez-vous<\/span><b id=\"stTotal\">0<\/b><\/div>\n <div class=\"stat\"><span>Confirm\u00e9s<\/span><b id=\"stConfirmed\">0<\/b><\/div>\n <div class=\"stat\"><span>\u00c0 confirmer<\/span><b id=\"stPending\">0<\/b><\/div>\n <div class=\"stat\"><span>Termin\u00e9s<\/span><b id=\"stDone\">0<\/b><\/div>\n <div class=\"stat\"><span>Annul\u00e9s<\/span><b id=\"stCancelled\">0<\/b><\/div>\n <div class=\"stat\"><span>Priorit\u00e9 haute<\/span><b id=\"stHigh\">0<\/b><\/div>\n <\/section>\n\n <section class=\"card\">\n <h2>Nouveau rendez-vous<\/h2>\n <p class=\"sub\">Cr\u00e9ez un rendez-vous avec toutes les informations utiles au suivi.<\/p>\n <div class=\"grid\">\n <div class=\"field\"><label>Type de rendez-vous<\/label>\n <select id=\"aType\">\n <option>Entretien d’admission<\/option>\n <option>Orientation p\u00e9dagogique<\/option>\n <option>Rendez-vous entreprise<\/option>\n <option>R\u00e9union formateur<\/option>\n <option>Rendez-vous administratif<\/option>\n <option>Suivi apprenant<\/option>\n <option>Visite partenaire<\/option>\n <option>Autre<\/option>\n <\/select>\n <\/div>\n <div class=\"field\"><label>Nom \/ Organisation<\/label><input id=\"aName\" placeholder=\"Nom du candidat ou entreprise\"><\/div>\n <div class=\"field\"><label>Contact<\/label><input id=\"aContact\" placeholder=\"+212 ... \/ email\"><\/div>\n <div class=\"field\"><label>Responsable MZA<\/label><input id=\"aOwner\" placeholder=\"Nom du responsable\"><\/div>\n <div class=\"field\"><label>Date<\/label><input id=\"aDate\" type=\"date\"><\/div>\n <div class=\"field\"><label>Heure<\/label><input id=\"aTime\" type=\"time\"><\/div>\n <div class=\"field\"><label>Dur\u00e9e (minutes)<\/label><input id=\"aDuration\" type=\"number\" min=\"5\" value=\"30\"><\/div>\n <div class=\"field\"><label>Mode<\/label>\n <select id=\"aMode\"><option>Pr\u00e9sentiel<\/option><option>Visioconf\u00e9rence<\/option><option>T\u00e9l\u00e9phone<\/option><\/select>\n <\/div>\n <div class=\"field\"><label>Lieu \/ lien visio<\/label><input id=\"aLocation\" placeholder=\"Salle \/ adresse \/ lien\"><\/div>\n <div class=\"field\"><label>Priorit\u00e9<\/label>\n <select id=\"aPriority\"><option>Normale<\/option><option>Haute<\/option><option>Urgente<\/option><\/select>\n <\/div>\n <div class=\"field\"><label>Statut<\/label>\n <select id=\"aStatus\"><option>\u00c0 confirmer<\/option><option>Confirm\u00e9<\/option><option>Termin\u00e9<\/option><option>Annul\u00e9<\/option><\/select>\n <\/div>\n <div class=\"field\"><label>Rappel<\/label>\n <select id=\"aReminder\"><option>24 h avant<\/option><option>2 h avant<\/option><option>1 h avant<\/option><option>Aucun<\/option><\/select>\n <\/div>\n <\/div>\n <div class=\"field\" style=\"margin-top:12px\"><label>Objet \/ notes<\/label><textarea id=\"aNotes\" placeholder=\"Objet du rendez-vous, \u00e9l\u00e9ments \u00e0 pr\u00e9parer, pi\u00e8ces \u00e0 apporter...\"><\/textarea><\/div>\n <div class=\"actions\">\n <button class=\"btn btn-primary\" onclick=\"addAppointment()\">Cr\u00e9er le rendez-vous<\/button>\n <button class=\"btn btn-ghost\" onclick=\"seedDemo()\">Charger un exemple<\/button>\n <\/div>\n <\/section>\n\n <section class=\"card\">\n <div class=\"toolbar\">\n <div>\n <h2 style=\"margin:0\">Planning des rendez-vous<\/h2>\n <p class=\"sub\" style=\"margin:4px 0 0\">Recherche et filtrage rapide.<\/p>\n <\/div>\n <div style=\"display:flex;gap:8px;flex-wrap:wrap;flex:1\">\n <input class=\"search\" id=\"search\" placeholder=\"Rechercher nom, entreprise, responsable...\" oninput=\"renderAppointments()\">\n <select class=\"search\" id=\"filterStatus\" onchange=\"renderAppointments()\">\n <option value=\"\">Tous les statuts<\/option>\n <option>\u00c0 confirmer<\/option><option>Confirm\u00e9<\/option><option>Termin\u00e9<\/option><option>Annul\u00e9<\/option>\n <\/select>\n <\/div>\n <\/div>\n <div class=\"table-wrap\">\n <table>\n <thead>\n <tr><th>Date<\/th><th>Heure<\/th><th>Type<\/th><th>Nom \/ Organisation<\/th><th>Responsable MZA<\/th><th>Mode<\/th><th>Priorit\u00e9<\/th><th>Statut<\/th><th>Rappel<\/th><th>Actions<\/th><\/tr>\n <\/thead>\n <tbody id=\"appointmentBody\"><\/tbody>\n <\/table>\n <\/div>\n <\/section>\n\n <section class=\"card\">\n <h2>Vue calendrier simplifi\u00e9e<\/h2>\n <p class=\"sub\">Les 7 prochains jours disposant de rendez-vous.<\/p>\n <div class=\"calendar\" id=\"calendarView\"><\/div>\n <\/section>\n\n <section class=\"card\">\n <h2>Suivi & export<\/h2>\n <div class=\"actions no-print\">\n <button class=\"btn btn-ghost\" onclick=\"window.print()\">Imprimer<\/button>\n <button class=\"btn btn-ghost\" onclick=\"exportCSV()\">Exporter CSV<\/button>\n <button class=\"btn btn-primary\" onclick=\"saveAll()\">Sauvegarder<\/button>\n <button class=\"btn btn-ghost\" onclick=\"loadAll()\">Charger<\/button>\n <\/div>\n <div class=\"notice\" id=\"notice\">Aucune action enregistr\u00e9e.<\/div>\n <\/section>\n<\/div>\n\n<script>\nlet appointments=[];\n\nfunction addAppointment(){\n if(!aName.value.trim() || !aDate.value || !aTime.value){alert(\"Nom, date et heure sont obligatoires.\");return;}\n appointments.push({\n id:Date.now(),type:aType.value,name:aName.value.trim(),contact:aContact.value.trim(),owner:aOwner.value.trim(),\n date:aDate.value,time:aTime.value,duration:+aDuration.value||30,mode:aMode.value,location:aLocation.value.trim(),\n priority:aPriority.value,status:aStatus.value,reminder:aReminder.value,notes:aNotes.value.trim()\n });\n clearForm();renderAll();notice.textContent=\"Rendez-vous cr\u00e9\u00e9.\";\n}\n\nfunction clearForm(){\n aName.value=\"\";aContact.value=\"\";aOwner.value=\"\";aDate.value=\"\";aTime.value=\"\";aDuration.value=30;\n aLocation.value=\"\";aNotes.value=\"\";aPriority.value=\"Normale\";aStatus.value=\"\u00c0 confirmer\";aReminder.value=\"24 h avant\";\n}\n\nfunction statusClass(s){return s===\"Confirm\u00e9\"?\"ok\":s===\"\u00c0 confirmer\"?\"warn\":s===\"Termin\u00e9\"?\"info\":\"bad\"}\nfunction priorityClass(p){return p===\"Urgente\"?\"bad\":p===\"Haute\"?\"warn\":\"info\"}\n\nfunction renderAppointments(){\n const q=search.value.toLowerCase(), fs=filterStatus.value;\n appointmentBody.innerHTML=\"\";\n appointments\n .filter(a=>{\n const hay=[a.type,a.name,a.contact,a.owner,a.mode,a.location,a.priority,a.status,a.notes].join(\" \").toLowerCase();\n return hay.includes(q)&&(!fs||a.status===fs);\n })\n .sort((a,b)=>(a.date+a.time).localeCompare(b.date+b.time))\n .forEach(a=>{\n appointmentBody.insertAdjacentHTML(\"beforeend\",`<tr>\n <td><b>${a.date}<\/b><\/td><td>${a.time}<\/td><td>${a.type}<\/td><td>${a.name}<\/td><td>${a.owner||\"\u2014\"}<\/td>\n <td>${a.mode}<\/td><td><span class=\"badge ${priorityClass(a.priority)}\">${a.priority}<\/span><\/td>\n <td><span class=\"badge ${statusClass(a.status)}\">${a.status}<\/span><\/td><td>${a.reminder}<\/td>\n <td>\n <button class=\"mini\" onclick=\"cycleStatus(${a.id})\">Statut<\/button>\n <button class=\"mini\" onclick=\"duplicateAppointment(${a.id})\">Dupliquer<\/button>\n <button class=\"mini\" onclick=\"deleteAppointment(${a.id})\">Suppr.<\/button>\n <\/td>\n <\/tr>`);\n });\n}\n\nfunction cycleStatus(id){\n const a=appointments.find(x=>x.id===id); if(!a)return;\n const arr=[\"\u00c0 confirmer\",\"Confirm\u00e9\",\"Termin\u00e9\",\"Annul\u00e9\"];\n a.status=arr[(arr.indexOf(a.status)+1)%arr.length];\n renderAll();\n}\n\nfunction duplicateAppointment(id){\n const a=appointments.find(x=>x.id===id); if(!a)return;\n appointments.push({...a,id:Date.now(),status:\"\u00c0 confirmer\"});\n renderAll();notice.textContent=\"Rendez-vous dupliqu\u00e9.\";\n}\n\nfunction deleteAppointment(id){\n if(!confirm(\"Supprimer ce rendez-vous ?\"))return;\n appointments=appointments.filter(a=>a.id!==id);renderAll();\n}\n\nfunction updateStats(){\n stTotal.textContent=appointments.length;\n stConfirmed.textContent=appointments.filter(a=>a.status===\"Confirm\u00e9\").length;\n stPending.textContent=appointments.filter(a=>a.status===\"\u00c0 confirmer\").length;\n stDone.textContent=appointments.filter(a=>a.status===\"Termin\u00e9\").length;\n stCancelled.textContent=appointments.filter(a=>a.status===\"Annul\u00e9\").length;\n stHigh.textContent=appointments.filter(a=>a.priority===\"Haute\"||a.priority===\"Urgente\").length;\n}\n\nfunction renderCalendar(){\n calendarView.innerHTML=\"\";\n const dates=[...new Set(appointments.filter(a=>a.status!==\"Annul\u00e9\").map(a=>a.date))].sort().slice(0,7);\n if(!dates.length){\n calendarView.innerHTML='<div class=\"notice\">Aucun rendez-vous \u00e0 afficher.<\/div>';return;\n }\n dates.forEach(d=>{\n const list=appointments.filter(a=>a.date===d && a.status!==\"Annul\u00e9\").sort((a,b)=>a.time.localeCompare(b.time));\n calendarView.insertAdjacentHTML(\"beforeend\",`<div class=\"day\"><b>${d}<\/b>${list.map(a=>`<div class=\"appt\"><strong>${a.time}<\/strong> \u2014 ${a.name}<br>${a.type}<\/div>`).join(\"\")}<\/div>`);\n });\n}\n\nfunction saveAll(){\n localStorage.setItem(\"mzaAppointmentsManager\",JSON.stringify(appointments));\n notice.textContent=\"Rendez-vous sauvegard\u00e9s sur cet appareil.\";\n}\nfunction loadAll(){\n const raw=localStorage.getItem(\"mzaAppointmentsManager\");\n if(!raw){notice.textContent=\"Aucune sauvegarde trouv\u00e9e.\";return;}\n appointments=JSON.parse(raw)||[];renderAll();notice.textContent=\"Rendez-vous charg\u00e9s.\";\n}\nfunction exportCSV(){\n const rows=[[\"Date\",\"Heure\",\"Type\",\"Nom\/Organisation\",\"Contact\",\"Responsable MZA\",\"Dur\u00e9e\",\"Mode\",\"Lieu\/Lien\",\"Priorit\u00e9\",\"Statut\",\"Rappel\",\"Notes\"]];\n appointments.forEach(a=>rows.push([a.date,a.time,a.type,a.name,a.contact,a.owner,a.duration,a.mode,a.location,a.priority,a.status,a.reminder,a.notes]));\n const csv=rows.map(r=>r.map(v=>`\"${String(v??\"\").replaceAll('\"','\"\"')}\"`).join(\";\")).join(\"\\n\");\n const blob=new Blob([\"\\ufeff\"+csv],{type:\"text\/csv;charset=utf-8;\"});const url=URL.createObjectURL(blob);\n const a=document.createElement(\"a\");a.href=url;a.download=\"mza-rendez-vous.csv\";a.click();URL.revokeObjectURL(url);\n}\nfunction seedDemo(){\n appointments=[\n {id:101,type:\"Entretien d'admission\",name:\"Candidat MZA\",contact:\"+212 6 00 00 00 00\",owner:\"Admissions MZA\",date:\"2026-09-07\",time:\"10:00\",duration:30,mode:\"Pr\u00e9sentiel\",location:\"MZA Academy\",priority:\"Haute\",status:\"Confirm\u00e9\",reminder:\"24 h avant\",notes:\"Apporter CV et copie CIN.\"},\n {id:102,type:\"Rendez-vous entreprise\",name:\"Direction RH - Entreprise partenaire\",contact:\"\",owner:\"Direction MZA\",date:\"2026-09-08\",time:\"15:00\",duration:60,mode:\"Visioconf\u00e9rence\",location:\"Lien visio \u00e0 transmettre\",priority:\"Urgente\",status:\"\u00c0 confirmer\",reminder:\"2 h avant\",notes:\"Diagnostic des besoins en formation.\"},\n {id:103,type:\"R\u00e9union formateur\",name:\"\u00c9quipe p\u00e9dagogique a\u00e9rien\",contact:\"\",owner:\"Direction p\u00e9dagogique\",date:\"2026-09-09\",time:\"11:30\",duration:45,mode:\"Pr\u00e9sentiel\",location:\"Salle Atlas\",priority:\"Normale\",status:\"Confirm\u00e9\",reminder:\"24 h avant\",notes:\"Planning sessions octobre.\"}\n ];\n renderAll();notice.textContent=\"Exemple charg\u00e9.\";\n}\nfunction renderAll(){renderAppointments();renderCalendar();updateStats()}\nrenderAll();\n<\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>MZA Rendez-vous Manager MAROC ZAIN ACADEMY RENDEZ-VOUS MANAGER\u2122 Admissions \u2022 Entreprises \u2022 Formateurs \u2022 Orientation Gestionnaire des rendez-vous Centralisez les entretiens d’admission, rendez-vous entreprises, orientations, r\u00e9unions formateurs et rendez-vous administratifs dans une seule interface. Total rendez-vous0 Confirm\u00e9s0 \u00c0 confirmer0 Termin\u00e9s0 Annul\u00e9s0 Priorit\u00e9 haute0 Nouveau rendez-vous Cr\u00e9ez un rendez-vous avec toutes les informations utiles au suivi. […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-578","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/maroczain.com\/scolaire.maroczain.com\/wp-json\/wp\/v2\/pages\/578","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/maroczain.com\/scolaire.maroczain.com\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/maroczain.com\/scolaire.maroczain.com\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/maroczain.com\/scolaire.maroczain.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/maroczain.com\/scolaire.maroczain.com\/wp-json\/wp\/v2\/comments?post=578"}],"version-history":[{"count":1,"href":"https:\/\/maroczain.com\/scolaire.maroczain.com\/wp-json\/wp\/v2\/pages\/578\/revisions"}],"predecessor-version":[{"id":580,"href":"https:\/\/maroczain.com\/scolaire.maroczain.com\/wp-json\/wp\/v2\/pages\/578\/revisions\/580"}],"wp:attachment":[{"href":"https:\/\/maroczain.com\/scolaire.maroczain.com\/wp-json\/wp\/v2\/media?parent=578"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":578,"date":"2026-09-08T08:07:15","date_gmt":"2026-09-08T08:07:15","guid":{"rendered":"https:\/\/maroczain.com\/scolaire.maroczain.com\/?page_id=578"},"modified":"2026-09-08T08:07:15","modified_gmt":"2026-09-08T08:07:15","slug":"gestionnaire-des-rendez-vous","status":"publish","type":"page","link":"https:\/\/maroczain.com\/scolaire.maroczain.com\/gestionnaire-des-rendez-vous\/","title":{"rendered":"Gestionnaire des rendez-vous"},"content":{"rendered":"\n\n\n\n\n\nMZA Rendez-vous Manager<\/title>\n<style>\n:root{\n --bg:#07111f;--panel:#0d1b2a;--panel2:#12263a;--line:#29435f;\n --text:#f5f7fb;--muted:#aab8c8;--gold:#d4af37;--gold2:#f4d77a;\n --ok:#2ecc71;--warn:#f39c12;--danger:#e74c3c;--info:#3498db;\n}\n*{box-sizing:border-box}\nbody{margin:0;background:linear-gradient(180deg,#06101d,#0b1726 52%,#07111f);color:var(--text);font-family:Arial,Helvetica,sans-serif}\nbutton,input,select,textarea{font:inherit}\n.wrap{max-width:1650px;margin:auto;padding:22px}\n.header{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:20px 22px;border:1px solid var(--line);background:#0d1b2a;border-radius:18px;position:sticky;top:10px;z-index:30}\n.brand{font-weight:900;font-size:20px}.brand small{display:block;color:var(--gold2);font-size:12px;margin-top:4px}\n.pill{padding:8px 12px;border:1px solid rgba(212,175,55,.6);border-radius:999px;color:var(--gold2)}\n.hero{text-align:center;padding:46px 10px 24px}\n.hero h1{font-size:clamp(34px,5vw,64px);margin:0 0 12px;letter-spacing:-2px}\n.hero h1 span{color:var(--gold2)}\n.hero p{color:var(--muted);max-width:1000px;margin:auto;line-height:1.6}\n.stats{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin:16px 0}\n.stat{padding:18px;border:1px solid var(--line);border-radius:16px;background:#0b1827}\n.stat span{color:var(--muted);font-size:12px}.stat b{display:block;font-size:24px;margin-top:8px}\n.card{border:1px solid var(--line);background:linear-gradient(180deg,#102238,#0a1726);border-radius:20px;padding:22px;margin:16px 0}\n.card h2{margin:0 0 6px}.sub{color:var(--muted);margin:0 0 18px}\n.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}\n.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}\n.field{display:flex;flex-direction:column;gap:6px}\n.field label{font-size:12px;font-weight:800;color:#d8e2ec}\n.field input,.field select,.field textarea{padding:13px 14px;border:1px solid #35516e;border-radius:12px;background:#081421;color:#fff;outline:none}\n.field textarea{min-height:90px;resize:vertical}\n.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}\n.btn{padding:12px 16px;border-radius:11px;border:0;cursor:pointer;font-weight:900}\n.btn-primary{background:linear-gradient(90deg,var(--gold),var(--gold2));color:#18130b}\n.btn-ghost{background:#102238;color:#fff;border:1px solid #37536f}\n.toolbar{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:12px}\n.search{min-width:240px;flex:1;padding:12px 14px;border:1px solid #35516e;border-radius:11px;background:#081421;color:#fff}\n.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:14px}\ntable{width:100%;border-collapse:collapse;min-width:1200px}\nth,td{padding:12px 10px;border-bottom:1px solid #21384f;text-align:left;font-size:13px}\nth{background:#0a1726;color:var(--gold2)}\n.badge{display:inline-block;padding:6px 9px;border-radius:999px;font-size:11px;font-weight:900}\n.ok{background:#173a2a;color:#b8ffd0}.warn{background:#4d2e10;color:#ffd7a3}.bad{background:#4a1717;color:#ffd0d0}.info{background:#113b52;color:#a7e4ff}\n.mini{padding:7px 9px;border-radius:8px;border:1px solid #35516e;background:#102238;color:#fff;cursor:pointer}\n.notice{padding:12px 14px;border:1px solid #33506d;border-radius:12px;background:#102238;color:#dbe7f3;margin-top:12px}\n.calendar{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}\n.day{min-height:120px;border:1px solid var(--line);border-radius:12px;background:#0a1726;padding:10px}\n.day b{display:block;color:var(--gold2);margin-bottom:8px}\n.appt{padding:7px;border-radius:8px;background:#102238;border:1px solid #35516e;margin:5px 0;font-size:11px}\n@media(max-width:1200px){.grid{grid-template-columns:repeat(2,1fr)}.stats{grid-template-columns:repeat(3,1fr)}}\n@media(max-width:800px){.calendar{grid-template-columns:1fr}.day{min-height:auto}}\n@media(max-width:700px){.grid,.grid2,.stats{grid-template-columns:1fr}.header{position:static;align-items:flex-start;flex-direction:column}.wrap{padding:12px}}\n@media print{.header,.hero,.actions,.toolbar,.no-print{display:none!important}body{background:#fff;color:#000}.card,.stat,.day{background:#fff;color:#000;border:1px solid #aaa}th{background:#eee;color:#000}}\n<\/style>\n<\/head>\n<body>\n<div class=\"wrap\">\n <div class=\"header\">\n <div class=\"brand\">MAROC ZAIN ACADEMY <small>RENDEZ-VOUS MANAGER\u2122<\/small><\/div>\n <div class=\"pill\">Admissions \u2022 Entreprises \u2022 Formateurs \u2022 Orientation<\/div>\n <\/div>\n\n <section class=\"hero\">\n <h1>Gestionnaire des <span>rendez-vous<\/span><\/h1>\n <p>Centralisez les entretiens d’admission, rendez-vous entreprises, orientations, r\u00e9unions formateurs et rendez-vous administratifs dans une seule interface.<\/p>\n <\/section>\n\n <section class=\"stats\">\n <div class=\"stat\"><span>Total rendez-vous<\/span><b id=\"stTotal\">0<\/b><\/div>\n <div class=\"stat\"><span>Confirm\u00e9s<\/span><b id=\"stConfirmed\">0<\/b><\/div>\n <div class=\"stat\"><span>\u00c0 confirmer<\/span><b id=\"stPending\">0<\/b><\/div>\n <div class=\"stat\"><span>Termin\u00e9s<\/span><b id=\"stDone\">0<\/b><\/div>\n <div class=\"stat\"><span>Annul\u00e9s<\/span><b id=\"stCancelled\">0<\/b><\/div>\n <div class=\"stat\"><span>Priorit\u00e9 haute<\/span><b id=\"stHigh\">0<\/b><\/div>\n <\/section>\n\n <section class=\"card\">\n <h2>Nouveau rendez-vous<\/h2>\n <p class=\"sub\">Cr\u00e9ez un rendez-vous avec toutes les informations utiles au suivi.<\/p>\n <div class=\"grid\">\n <div class=\"field\"><label>Type de rendez-vous<\/label>\n <select id=\"aType\">\n <option>Entretien d’admission<\/option>\n <option>Orientation p\u00e9dagogique<\/option>\n <option>Rendez-vous entreprise<\/option>\n <option>R\u00e9union formateur<\/option>\n <option>Rendez-vous administratif<\/option>\n <option>Suivi apprenant<\/option>\n <option>Visite partenaire<\/option>\n <option>Autre<\/option>\n <\/select>\n <\/div>\n <div class=\"field\"><label>Nom \/ Organisation<\/label><input id=\"aName\" placeholder=\"Nom du candidat ou entreprise\"><\/div>\n <div class=\"field\"><label>Contact<\/label><input id=\"aContact\" placeholder=\"+212 ... \/ email\"><\/div>\n <div class=\"field\"><label>Responsable MZA<\/label><input id=\"aOwner\" placeholder=\"Nom du responsable\"><\/div>\n <div class=\"field\"><label>Date<\/label><input id=\"aDate\" type=\"date\"><\/div>\n <div class=\"field\"><label>Heure<\/label><input id=\"aTime\" type=\"time\"><\/div>\n <div class=\"field\"><label>Dur\u00e9e (minutes)<\/label><input id=\"aDuration\" type=\"number\" min=\"5\" value=\"30\"><\/div>\n <div class=\"field\"><label>Mode<\/label>\n <select id=\"aMode\"><option>Pr\u00e9sentiel<\/option><option>Visioconf\u00e9rence<\/option><option>T\u00e9l\u00e9phone<\/option><\/select>\n <\/div>\n <div class=\"field\"><label>Lieu \/ lien visio<\/label><input id=\"aLocation\" placeholder=\"Salle \/ adresse \/ lien\"><\/div>\n <div class=\"field\"><label>Priorit\u00e9<\/label>\n <select id=\"aPriority\"><option>Normale<\/option><option>Haute<\/option><option>Urgente<\/option><\/select>\n <\/div>\n <div class=\"field\"><label>Statut<\/label>\n <select id=\"aStatus\"><option>\u00c0 confirmer<\/option><option>Confirm\u00e9<\/option><option>Termin\u00e9<\/option><option>Annul\u00e9<\/option><\/select>\n <\/div>\n <div class=\"field\"><label>Rappel<\/label>\n <select id=\"aReminder\"><option>24 h avant<\/option><option>2 h avant<\/option><option>1 h avant<\/option><option>Aucun<\/option><\/select>\n <\/div>\n <\/div>\n <div class=\"field\" style=\"margin-top:12px\"><label>Objet \/ notes<\/label><textarea id=\"aNotes\" placeholder=\"Objet du rendez-vous, \u00e9l\u00e9ments \u00e0 pr\u00e9parer, pi\u00e8ces \u00e0 apporter...\"><\/textarea><\/div>\n <div class=\"actions\">\n <button class=\"btn btn-primary\" onclick=\"addAppointment()\">Cr\u00e9er le rendez-vous<\/button>\n <button class=\"btn btn-ghost\" onclick=\"seedDemo()\">Charger un exemple<\/button>\n <\/div>\n <\/section>\n\n <section class=\"card\">\n <div class=\"toolbar\">\n <div>\n <h2 style=\"margin:0\">Planning des rendez-vous<\/h2>\n <p class=\"sub\" style=\"margin:4px 0 0\">Recherche et filtrage rapide.<\/p>\n <\/div>\n <div style=\"display:flex;gap:8px;flex-wrap:wrap;flex:1\">\n <input class=\"search\" id=\"search\" placeholder=\"Rechercher nom, entreprise, responsable...\" oninput=\"renderAppointments()\">\n <select class=\"search\" id=\"filterStatus\" onchange=\"renderAppointments()\">\n <option value=\"\">Tous les statuts<\/option>\n <option>\u00c0 confirmer<\/option><option>Confirm\u00e9<\/option><option>Termin\u00e9<\/option><option>Annul\u00e9<\/option>\n <\/select>\n <\/div>\n <\/div>\n <div class=\"table-wrap\">\n <table>\n <thead>\n <tr><th>Date<\/th><th>Heure<\/th><th>Type<\/th><th>Nom \/ Organisation<\/th><th>Responsable MZA<\/th><th>Mode<\/th><th>Priorit\u00e9<\/th><th>Statut<\/th><th>Rappel<\/th><th>Actions<\/th><\/tr>\n <\/thead>\n <tbody id=\"appointmentBody\"><\/tbody>\n <\/table>\n <\/div>\n <\/section>\n\n <section class=\"card\">\n <h2>Vue calendrier simplifi\u00e9e<\/h2>\n <p class=\"sub\">Les 7 prochains jours disposant de rendez-vous.<\/p>\n <div class=\"calendar\" id=\"calendarView\"><\/div>\n <\/section>\n\n <section class=\"card\">\n <h2>Suivi & export<\/h2>\n <div class=\"actions no-print\">\n <button class=\"btn btn-ghost\" onclick=\"window.print()\">Imprimer<\/button>\n <button class=\"btn btn-ghost\" onclick=\"exportCSV()\">Exporter CSV<\/button>\n <button class=\"btn btn-primary\" onclick=\"saveAll()\">Sauvegarder<\/button>\n <button class=\"btn btn-ghost\" onclick=\"loadAll()\">Charger<\/button>\n <\/div>\n <div class=\"notice\" id=\"notice\">Aucune action enregistr\u00e9e.<\/div>\n <\/section>\n<\/div>\n\n<script>\nlet appointments=[];\n\nfunction addAppointment(){\n if(!aName.value.trim() || !aDate.value || !aTime.value){alert(\"Nom, date et heure sont obligatoires.\");return;}\n appointments.push({\n id:Date.now(),type:aType.value,name:aName.value.trim(),contact:aContact.value.trim(),owner:aOwner.value.trim(),\n date:aDate.value,time:aTime.value,duration:+aDuration.value||30,mode:aMode.value,location:aLocation.value.trim(),\n priority:aPriority.value,status:aStatus.value,reminder:aReminder.value,notes:aNotes.value.trim()\n });\n clearForm();renderAll();notice.textContent=\"Rendez-vous cr\u00e9\u00e9.\";\n}\n\nfunction clearForm(){\n aName.value=\"\";aContact.value=\"\";aOwner.value=\"\";aDate.value=\"\";aTime.value=\"\";aDuration.value=30;\n aLocation.value=\"\";aNotes.value=\"\";aPriority.value=\"Normale\";aStatus.value=\"\u00c0 confirmer\";aReminder.value=\"24 h avant\";\n}\n\nfunction statusClass(s){return s===\"Confirm\u00e9\"?\"ok\":s===\"\u00c0 confirmer\"?\"warn\":s===\"Termin\u00e9\"?\"info\":\"bad\"}\nfunction priorityClass(p){return p===\"Urgente\"?\"bad\":p===\"Haute\"?\"warn\":\"info\"}\n\nfunction renderAppointments(){\n const q=search.value.toLowerCase(), fs=filterStatus.value;\n appointmentBody.innerHTML=\"\";\n appointments\n .filter(a=>{\n const hay=[a.type,a.name,a.contact,a.owner,a.mode,a.location,a.priority,a.status,a.notes].join(\" \").toLowerCase();\n return hay.includes(q)&&(!fs||a.status===fs);\n })\n .sort((a,b)=>(a.date+a.time).localeCompare(b.date+b.time))\n .forEach(a=>{\n appointmentBody.insertAdjacentHTML(\"beforeend\",`<tr>\n <td><b>${a.date}<\/b><\/td><td>${a.time}<\/td><td>${a.type}<\/td><td>${a.name}<\/td><td>${a.owner||\"\u2014\"}<\/td>\n <td>${a.mode}<\/td><td><span class=\"badge ${priorityClass(a.priority)}\">${a.priority}<\/span><\/td>\n <td><span class=\"badge ${statusClass(a.status)}\">${a.status}<\/span><\/td><td>${a.reminder}<\/td>\n <td>\n <button class=\"mini\" onclick=\"cycleStatus(${a.id})\">Statut<\/button>\n <button class=\"mini\" onclick=\"duplicateAppointment(${a.id})\">Dupliquer<\/button>\n <button class=\"mini\" onclick=\"deleteAppointment(${a.id})\">Suppr.<\/button>\n <\/td>\n <\/tr>`);\n });\n}\n\nfunction cycleStatus(id){\n const a=appointments.find(x=>x.id===id); if(!a)return;\n const arr=[\"\u00c0 confirmer\",\"Confirm\u00e9\",\"Termin\u00e9\",\"Annul\u00e9\"];\n a.status=arr[(arr.indexOf(a.status)+1)%arr.length];\n renderAll();\n}\n\nfunction duplicateAppointment(id){\n const a=appointments.find(x=>x.id===id); if(!a)return;\n appointments.push({...a,id:Date.now(),status:\"\u00c0 confirmer\"});\n renderAll();notice.textContent=\"Rendez-vous dupliqu\u00e9.\";\n}\n\nfunction deleteAppointment(id){\n if(!confirm(\"Supprimer ce rendez-vous ?\"))return;\n appointments=appointments.filter(a=>a.id!==id);renderAll();\n}\n\nfunction updateStats(){\n stTotal.textContent=appointments.length;\n stConfirmed.textContent=appointments.filter(a=>a.status===\"Confirm\u00e9\").length;\n stPending.textContent=appointments.filter(a=>a.status===\"\u00c0 confirmer\").length;\n stDone.textContent=appointments.filter(a=>a.status===\"Termin\u00e9\").length;\n stCancelled.textContent=appointments.filter(a=>a.status===\"Annul\u00e9\").length;\n stHigh.textContent=appointments.filter(a=>a.priority===\"Haute\"||a.priority===\"Urgente\").length;\n}\n\nfunction renderCalendar(){\n calendarView.innerHTML=\"\";\n const dates=[...new Set(appointments.filter(a=>a.status!==\"Annul\u00e9\").map(a=>a.date))].sort().slice(0,7);\n if(!dates.length){\n calendarView.innerHTML='<div class=\"notice\">Aucun rendez-vous \u00e0 afficher.<\/div>';return;\n }\n dates.forEach(d=>{\n const list=appointments.filter(a=>a.date===d && a.status!==\"Annul\u00e9\").sort((a,b)=>a.time.localeCompare(b.time));\n calendarView.insertAdjacentHTML(\"beforeend\",`<div class=\"day\"><b>${d}<\/b>${list.map(a=>`<div class=\"appt\"><strong>${a.time}<\/strong> \u2014 ${a.name}<br>${a.type}<\/div>`).join(\"\")}<\/div>`);\n });\n}\n\nfunction saveAll(){\n localStorage.setItem(\"mzaAppointmentsManager\",JSON.stringify(appointments));\n notice.textContent=\"Rendez-vous sauvegard\u00e9s sur cet appareil.\";\n}\nfunction loadAll(){\n const raw=localStorage.getItem(\"mzaAppointmentsManager\");\n if(!raw){notice.textContent=\"Aucune sauvegarde trouv\u00e9e.\";return;}\n appointments=JSON.parse(raw)||[];renderAll();notice.textContent=\"Rendez-vous charg\u00e9s.\";\n}\nfunction exportCSV(){\n const rows=[[\"Date\",\"Heure\",\"Type\",\"Nom\/Organisation\",\"Contact\",\"Responsable MZA\",\"Dur\u00e9e\",\"Mode\",\"Lieu\/Lien\",\"Priorit\u00e9\",\"Statut\",\"Rappel\",\"Notes\"]];\n appointments.forEach(a=>rows.push([a.date,a.time,a.type,a.name,a.contact,a.owner,a.duration,a.mode,a.location,a.priority,a.status,a.reminder,a.notes]));\n const csv=rows.map(r=>r.map(v=>`\"${String(v??\"\").replaceAll('\"','\"\"')}\"`).join(\";\")).join(\"\\n\");\n const blob=new Blob([\"\\ufeff\"+csv],{type:\"text\/csv;charset=utf-8;\"});const url=URL.createObjectURL(blob);\n const a=document.createElement(\"a\");a.href=url;a.download=\"mza-rendez-vous.csv\";a.click();URL.revokeObjectURL(url);\n}\nfunction seedDemo(){\n appointments=[\n {id:101,type:\"Entretien d'admission\",name:\"Candidat MZA\",contact:\"+212 6 00 00 00 00\",owner:\"Admissions MZA\",date:\"2026-09-07\",time:\"10:00\",duration:30,mode:\"Pr\u00e9sentiel\",location:\"MZA Academy\",priority:\"Haute\",status:\"Confirm\u00e9\",reminder:\"24 h avant\",notes:\"Apporter CV et copie CIN.\"},\n {id:102,type:\"Rendez-vous entreprise\",name:\"Direction RH - Entreprise partenaire\",contact:\"\",owner:\"Direction MZA\",date:\"2026-09-08\",time:\"15:00\",duration:60,mode:\"Visioconf\u00e9rence\",location:\"Lien visio \u00e0 transmettre\",priority:\"Urgente\",status:\"\u00c0 confirmer\",reminder:\"2 h avant\",notes:\"Diagnostic des besoins en formation.\"},\n {id:103,type:\"R\u00e9union formateur\",name:\"\u00c9quipe p\u00e9dagogique a\u00e9rien\",contact:\"\",owner:\"Direction p\u00e9dagogique\",date:\"2026-09-09\",time:\"11:30\",duration:45,mode:\"Pr\u00e9sentiel\",location:\"Salle Atlas\",priority:\"Normale\",status:\"Confirm\u00e9\",reminder:\"24 h avant\",notes:\"Planning sessions octobre.\"}\n ];\n renderAll();notice.textContent=\"Exemple charg\u00e9.\";\n}\nfunction renderAll(){renderAppointments();renderCalendar();updateStats()}\nrenderAll();\n<\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>MZA Rendez-vous Manager MAROC ZAIN ACADEMY RENDEZ-VOUS MANAGER\u2122 Admissions \u2022 Entreprises \u2022 Formateurs \u2022 Orientation Gestionnaire des rendez-vous Centralisez les entretiens d’admission, rendez-vous entreprises, orientations, r\u00e9unions formateurs et rendez-vous administratifs dans une seule interface. Total rendez-vous0 Confirm\u00e9s0 \u00c0 confirmer0 Termin\u00e9s0 Annul\u00e9s0 Priorit\u00e9 haute0 Nouveau rendez-vous Cr\u00e9ez un rendez-vous avec toutes les informations utiles au suivi. […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-578","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/maroczain.com\/scolaire.maroczain.com\/wp-json\/wp\/v2\/pages\/578","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/maroczain.com\/scolaire.maroczain.com\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/maroczain.com\/scolaire.maroczain.com\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/maroczain.com\/scolaire.maroczain.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/maroczain.com\/scolaire.maroczain.com\/wp-json\/wp\/v2\/comments?post=578"}],"version-history":[{"count":1,"href":"https:\/\/maroczain.com\/scolaire.maroczain.com\/wp-json\/wp\/v2\/pages\/578\/revisions"}],"predecessor-version":[{"id":580,"href":"https:\/\/maroczain.com\/scolaire.maroczain.com\/wp-json\/wp\/v2\/pages\/578\/revisions\/580"}],"wp:attachment":[{"href":"https:\/\/maroczain.com\/scolaire.maroczain.com\/wp-json\/wp\/v2\/media?parent=578"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}