{"id":25962,"date":"2026-06-18T09:42:34","date_gmt":"2026-06-18T07:42:34","guid":{"rendered":"https:\/\/serveiseducatius.xtec.cat\/baixllobregat5\/?page_id=25962"},"modified":"2026-06-25T13:26:37","modified_gmt":"2026-06-25T11:26:37","slug":"consulta-el-calendari-disponible","status":"publish","type":"page","link":"https:\/\/serveiseducatius.xtec.cat\/baixllobregat5\/consulta-el-calendari-disponible\/","title":{"rendered":"Consulta el calendari disponible"},"content":{"rendered":"\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 CALENDARI D'OCUPACI\u00d3 \u00b7 Servei Educatiu Baix Llobregat V \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n<!-- Enganxa TOT aquest contingut en una P\u00c0GINA NOVA de WordPress, dins UN bloc \"HTML personalitzat\" -->\n<div class=\"bll5-cal\">\n<div class=\"bll5-cal-panel\">\n\n  <!-- \u2b07\ufe0f Canvia el href per la URL real de la teva p\u00e0gina \u00edndex \u2b07\ufe0f -->\n  <div class=\"cal-topbar\">\n    <a class=\"cal-back\" href=\"https:\/\/serveiseducatius.xtec.cat\/baixllobregat5\/portal-de-prestecs\/\">\n      <svg viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n        <line x1=\"19\" y1=\"12\" x2=\"5\" y2=\"12\"\/>\n        <polyline points=\"12 19 5 12 12 5\"\/>\n      <\/svg>\n      Tornar a l&#8217;inici\n    <\/a>\n    <div class=\"cal-topbar-actions\">\n      <a class=\"cal-back\" href=\"https:\/\/serveiseducatius.xtec.cat\/baixllobregat5\/sollicitud-prestec-equipaments\/\">Sol\u00b7licitud d&#8217;equipaments<\/a>\n      <a class=\"cal-back\" href=\"https:\/\/serveiseducatius.xtec.cat\/baixllobregat5\/sollicitud-de-maletes-i-recursos-didactics\/\">Sol\u00b7licitud de recursos did\u00e0ctics<\/a>\n    <\/div>\n  <\/div>\n\n  <section class=\"cal-hero\">\n    <div class=\"cal-badge\">Calendari d&#8217;ocupaci\u00f3<\/div>\n    <h1>Material reservat<\/h1>\n    <p>Consulta quin material est\u00e0 reservat i en quin estat.<\/p>\n  <\/section>\n\n  <div class=\"cal-nav\">\n    <button class=\"cal-arrow\" id=\"calPrev\" title=\"Mes anterior\">\u2039<\/button>\n    <div class=\"cal-month\" id=\"calMonth\">\u2014<\/div>\n    <button class=\"cal-arrow\" id=\"calNext\" title=\"Mes seg\u00fcent\">\u203a<\/button>\n    <button class=\"cal-today\" id=\"calToday\">Avui<\/button>\n  <\/div>\n\n  <!-- Llegenda d'estats -->\n  <div class=\"cal-legend\">\n    <span class=\"cal-leg-item\"><span class=\"cal-leg-dot\" style=\"background:#E8B400\"><\/span>Per recollir<\/span>\n    <span class=\"cal-leg-item\"><span class=\"cal-leg-dot\" style=\"background:#3FA34D\"><\/span>Al centre<\/span>\n    <span class=\"cal-leg-item\"><span class=\"cal-leg-dot\" style=\"background:#D64545\"><\/span>Pendent<\/span>\n  <\/div>\n\n  <div class=\"cal-status\" id=\"calStatus\">Carregant reserves\u2026<\/div>\n\n  <div class=\"cal-grid-wrap\">\n    <div class=\"cal-weekdays\">\n      <span>Dl<\/span><span>Dt<\/span><span>Dc<\/span><span>Dj<\/span><span>Dv<\/span><span>Ds<\/span><span>Dg<\/span>\n    <\/div>\n    <div class=\"cal-grid\" id=\"calGrid\"><\/div>\n  <\/div>\n\n  <!-- Detall del dia seleccionat -->\n  <div class=\"cal-detail\" id=\"calDetail\" style=\"display:none\">\n    <div class=\"cal-detail-head\">\n      <span id=\"calDetailDate\">\u2014<\/span>\n      <button class=\"cal-detail-close\" id=\"calDetailClose\">&times;<\/button>\n    <\/div>\n    <div id=\"calDetailBody\"><\/div>\n  <\/div>\n\n<\/div>\n<\/div>\n\n<style>\n.bll5-cal{\n  --bg:#F7F5F0; --surface:#fff; --surface2:#EFEDE8;\n  --border:rgba(0,0,0,0.08); --border2:rgba(0,0,0,0.13);\n  --text:#1A1917; --text2:#6B6860; --text3:#9B998F;\n  --accent:#1B5E8A; --accent-light:#E3EEF6;\n  --shadow:0 1px 3px rgba(0,0,0,0.06),0 4px 12px rgba(0,0,0,0.04);\n}\n.bll5-cal *, .bll5-cal *::before, .bll5-cal *::after{box-sizing:border-box;margin:0;padding:0;}\n.bll5-cal{font-family:'DM Sans',sans-serif;color:var(--text);}\n.bll5-cal .bll5-cal-panel{background:#F7F5F0 !important;max-width:1000px;margin:0 auto;padding:24px !important;border-radius:16px;}\n.bll5-cal .cal-topbar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;}\n.bll5-cal .cal-topbar-actions{display:flex;gap:10px;flex-wrap:wrap;}\n.bll5-cal .cal-back{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--accent);background:var(--surface);border:1px solid var(--border2);border-radius:20px;padding:7px 14px 7px 11px;text-decoration:none;transition:all .15s;}\n.bll5-cal .cal-back:hover{background:var(--accent);color:#fff;border-color:var(--accent);}\n.bll5-cal .cal-back svg{transition:transform .15s;}\n.bll5-cal .cal-back:hover svg{transform:translateX(-3px);}\n.bll5-cal .cal-hero{text-align:center;padding:2rem 1rem 1.5rem;max-width:640px;margin:0 auto;}\n.bll5-cal .cal-badge{display:inline-block;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#185FA5;background:#E6F1FB;padding:4px 14px;border-radius:20px;margin-bottom:1rem;}\n.bll5-cal .cal-hero h1{font-size:clamp(24px,4vw,34px);font-weight:600;letter-spacing:-.02em;margin-bottom:.5rem;}\n.bll5-cal .cal-hero p{font-size:14px;color:var(--text2);line-height:1.6;}\n.bll5-cal .cal-link{color:var(--accent);text-decoration:underline;}\n.bll5-cal .cal-nav{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:.8rem;}\n.bll5-cal .cal-arrow{width:36px;height:36px;border-radius:10px;border:1px solid var(--border2);background:var(--surface);color:var(--text);font-size:20px;line-height:1;cursor:pointer;transition:all .15s;}\n.bll5-cal .cal-arrow:hover{background:var(--surface2);}\n.bll5-cal .cal-month{font-size:17px;font-weight:600;min-width:190px;text-align:center;text-transform:capitalize;}\n.bll5-cal .cal-today{font-size:12px;font-weight:500;padding:7px 14px;border-radius:20px;border:1px solid var(--border2);background:var(--surface);color:var(--text2);cursor:pointer;transition:all .15s;margin-left:8px;}\n.bll5-cal .cal-today:hover{background:var(--accent);color:#fff;border-color:var(--accent);}\n.bll5-cal .cal-legend{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-bottom:1rem;}\n.bll5-cal .cal-leg-item{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text2);}\n.bll5-cal .cal-leg-dot{width:11px;height:11px;border-radius:3px;display:inline-block;}\n.bll5-cal .cal-status{text-align:center;font-size:13px;color:var(--text3);margin-bottom:1rem;}\n.bll5-cal .cal-grid-wrap{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:12px;box-shadow:var(--shadow);}\n.bll5-cal .cal-weekdays{display:grid !important;grid-template-columns:repeat(7,minmax(0,1fr)) !important;gap:6px;margin-bottom:6px;width:100%;}\n.bll5-cal .cal-weekdays span{text-align:center;font-size:11px;font-weight:600;color:var(--text3);text-transform:uppercase;letter-spacing:.04em;padding:4px 0;}\n.bll5-cal .cal-grid{display:grid !important;grid-template-columns:repeat(7,minmax(0,1fr)) !important;gap:6px;width:100%;}\n.bll5-cal .cal-cell{min-width:0;max-width:100%;min-height:78px;border:1px solid var(--border);border-radius:10px;padding:6px;background:var(--surface);display:flex !important;flex-direction:column;gap:3px;transition:border-color .12s;float:none !important;margin:0 !important;}\n.bll5-cal .cal-cell.empty{background:transparent;border:none;}\n.bll5-cal .cal-cell.has-busy{cursor:pointer;}\n.bll5-cal .cal-cell.has-busy:hover{border-color:var(--border2);}\n.bll5-cal .cal-cell.is-today{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset;}\n.bll5-cal .cal-daynum{font-size:12px;font-weight:600;color:var(--text2);}\n.bll5-cal .cal-cell.is-today .cal-daynum{color:var(--accent);}\n.bll5-cal .cal-pill{font-size:10px;font-weight:500;border-radius:5px;padding:2px 5px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff;}\n.bll5-cal .cal-more{font-size:10px;color:var(--text3);font-weight:500;padding:0 2px;}\n.bll5-cal .cal-detail{background:var(--surface);border:1px solid var(--accent);border-radius:14px;margin-top:1rem;overflow:hidden;box-shadow:var(--shadow);}\n.bll5-cal .cal-detail-head{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:var(--accent-light);border-bottom:1px solid var(--border);font-size:14px;font-weight:600;color:var(--accent);text-transform:capitalize;}\n.bll5-cal .cal-detail-close{background:none;border:none;font-size:22px;line-height:1;color:var(--text3);cursor:pointer;padding:0 4px;}\n.bll5-cal .cal-detail-close:hover{color:var(--text);}\n.bll5-cal #calDetailBody{padding:8px 16px 16px;}\n.bll5-cal .cal-detail-item{display:flex;align-items:flex-start;gap:10px;padding:10px 0;border-bottom:1px solid var(--border);}\n.bll5-cal .cal-detail-item:last-child{border-bottom:none;}\n.bll5-cal .cal-detail-dot{width:9px;height:9px;border-radius:3px;flex-shrink:0;margin-top:5px;}\n.bll5-cal .cal-detail-name{font-size:13.5px;font-weight:500;}\n.bll5-cal .cal-detail-meta{font-size:12px;color:var(--text2);margin-top:2px;}\n.bll5-cal .cal-detail-estat{display:inline-block;font-size:11px;font-weight:600;color:#fff;border-radius:10px;padding:1px 9px;margin-top:4px;}\n@media(max-width:560px){\n  .bll5-cal .cal-cell{min-height:60px;padding:4px;}\n  .bll5-cal .cal-pill{font-size:9px;}\n  .bll5-cal .cal-month{min-width:140px;font-size:15px;}\n  .bll5-cal .cal-topbar{justify-content:center;}\n  .bll5-cal .cal-topbar-actions{justify-content:center;}\n}\n<\/style>\n\n<script>\n\/\/ \u2b07\ufe0f\u2b07\ufe0f\u2b07\ufe0f ENGANXA AQU\u00cd LA MATEIXA URL DE GOOGLE APPS SCRIPT (acaba en \/exec) \u2b07\ufe0f\u2b07\ufe0f\u2b07\ufe0f\nvar CAL_SCRIPT_URL = 'https:\/\/script.google.com\/macros\/s\/AKfycbxtoHGRvUylRx4EMYhXUElJ3xShRBTHpSkgfipWjaPn21CsoOgoemZxFoz0oDFezHvycQ\/exec';\n\/\/ \u2b06\ufe0f\u2b06\ufe0f\u2b06\ufe0f \u2b06\ufe0f\u2b06\ufe0f\u2b06\ufe0f\n\n\/\/ Colors per a cada estat. Les claus estan en min\u00fascules.\n\/\/ Si un dia afegeixes un estat nou al full, posa'l aqu\u00ed amb el seu color.\nvar CAL_COLORS = {\n  'per recollir': '#E8B400',  \/\/ groc\n  'al centre':    '#3FA34D',  \/\/ verd\n  'pendent':      '#D64545'   \/\/ vermell\n};\nvar CAL_COLOR_DEFECTE = '#8A8A8A';  \/\/ gris per a estats desconeguts\n\nfunction calColorEstat(estat) {\n  var k = String(estat || '').toLowerCase().trim();\n  return CAL_COLORS[k] || CAL_COLOR_DEFECTE;\n}\n\nvar CAL_OCUPACIO = [];\nvar calView = new Date();      \/\/ mes que s'est\u00e0 mostrant\ncalView.setDate(1);\nvar MESOS = ['gener','febrer','mar\u00e7','abril','maig','juny','juliol','agost','setembre','octubre','novembre','desembre'];\n\nfunction calInit() {\n  document.getElementById('calPrev').addEventListener('click', function(){ calCanviMes(-1); });\n  document.getElementById('calNext').addEventListener('click', function(){ calCanviMes(1); });\n  document.getElementById('calToday').addEventListener('click', function(){ calView = new Date(); calView.setDate(1); calPinta(); });\n  document.getElementById('calDetailClose').addEventListener('click', function(){ document.getElementById('calDetail').style.display='none'; });\n  calPinta();\n  calCarrega();\n}\nif (document.readyState !== 'loading') { calInit(); }\nelse { document.addEventListener('DOMContentLoaded', calInit); }\n\nfunction calCanviMes(delta) {\n  calView.setMonth(calView.getMonth() + delta);\n  document.getElementById('calDetail').style.display = 'none';\n  calPinta();\n}\n\n\/\/ Carrega les reserves (doGet de l'Apps Script).\nfunction calCarrega() {\n  var st = document.getElementById('calStatus');\n  if (!CAL_SCRIPT_URL || CAL_SCRIPT_URL.indexOf('\/exec') === -1) {\n    st.textContent = '\u26a0\ufe0f Falta configurar la connexi\u00f3 amb Google.';\n    return;\n  }\n  fetch(CAL_SCRIPT_URL)\n    .then(function(r){ return r.json(); })\n    .then(function(data){\n      if (data && data.ok && data.ocupacio) {\n        CAL_OCUPACIO = data.ocupacio;\n        st.style.display = 'none';\n        calPinta();\n      } else {\n        st.textContent = 'No s\\'han pogut carregar les reserves.';\n      }\n    })\n    .catch(function(){ st.textContent = 'No s\\'han pogut carregar les reserves.'; });\n}\n\nfunction calData(s) {\n  var p = String(s).split('-');\n  if (p.length !== 3) return null;\n  return new Date(+p[0], +p[1]-1, +p[2], 12, 0, 0);\n}\nfunction calMateixDia(a, b) {\n  return a.getFullYear()===b.getFullYear() && a.getMonth()===b.getMonth() && a.getDate()===b.getDate();\n}\nfunction calReservesDelDia(dia) {\n  return CAL_OCUPACIO.filter(function(o){\n    var i = calData(o.inici), f = calData(o.retorn);\n    if (!i || !f) return false;\n    return dia >= i && dia <= f;\n  });\n}\n\nfunction calPinta() {\n  var any = calView.getFullYear();\n  var mes = calView.getMonth();\n  document.getElementById('calMonth').textContent = MESOS[mes] + ' ' + any;\n\n  var grid = document.getElementById('calGrid');\n  grid.innerHTML = '';\n\n  var primer = new Date(any, mes, 1);\n  var offset = (primer.getDay() + 6) % 7;  \/\/ setmana comen\u00e7a en dilluns\n  var diesMes = new Date(any, mes+1, 0).getDate();\n  var avui = new Date();\n\n  for (var k = 0; k < offset; k++) {\n    var buit = document.createElement('div');\n    buit.className = 'cal-cell empty';\n    grid.appendChild(buit);\n  }\n\n  for (var d = 1; d <= diesMes; d++) {\n    var dia = new Date(any, mes, d, 12, 0, 0);\n    var reserves = calReservesDelDia(dia);\n    var cell = document.createElement('div');\n    cell.className = 'cal-cell' + (reserves.length ? ' has-busy' : '') + (calMateixDia(dia, avui) ? ' is-today' : '');\n\n    var num = document.createElement('div');\n    num.className = 'cal-daynum';\n    num.textContent = d;\n    cell.appendChild(num);\n\n    var maxMostrar = 3;\n    reserves.slice(0, maxMostrar).forEach(function(o){\n      var pill = document.createElement('div');\n      pill.className = 'cal-pill';\n      pill.style.background = calColorEstat(o.estat);\n      pill.textContent = o.material || 'Reservat';\n      cell.appendChild(pill);\n    });\n    if (reserves.length > maxMostrar) {\n      var more = document.createElement('div');\n      more.className = 'cal-more';\n      more.textContent = '+' + (reserves.length - maxMostrar) + ' m\u00e9s';\n      cell.appendChild(more);\n    }\n\n    if (reserves.length) {\n      (function(diaSel, reservesSel){\n        cell.addEventListener('click', function(){ calMostraDetall(diaSel, reservesSel); });\n      })(dia, reserves);\n    }\n    grid.appendChild(cell);\n  }\n}\n\nfunction calMostraDetall(dia, reserves) {\n  var det = document.getElementById('calDetail');\n  var head = document.getElementById('calDetailDate');\n  var body = document.getElementById('calDetailBody');\n  var dies = ['diumenge','dilluns','dimarts','dimecres','dijous','divendres','dissabte'];\n  head.textContent = dies[dia.getDay()] + ', ' + dia.getDate() + ' de ' + MESOS[dia.getMonth()] + ' de ' + dia.getFullYear();\n  body.innerHTML = reserves.map(function(o){\n    var color = calColorEstat(o.estat);\n    var estatTxt = o.estat ? '<span class=\"cal-detail-estat\" style=\"background:' + color + '\">' + o.estat + '<\/span>' : '';\n    return '<div class=\"cal-detail-item\"><div class=\"cal-detail-dot\" style=\"background:' + color + '\"><\/div><div>'\n         + '<div class=\"cal-detail-name\">' + (o.material || 'Reservat') + '<\/div>'\n         + '<div class=\"cal-detail-meta\">Del ' + calLeg(o.inici) + ' al ' + calLeg(o.retorn) + '<\/div>'\n         + estatTxt\n         + '<\/div><\/div>';\n  }).join('');\n  det.style.display = 'block';\n  setTimeout(function(){ det.scrollIntoView({behavior:'smooth', block:'nearest'}); }, 50);\n}\n\nfunction calLeg(s) {\n  var p = String(s).split('-');\n  if (p.length === 3) return p[2] + '\/' + p[1] + '\/' + p[0];\n  return s;\n}\n<\/script>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Tornar a l&#8217;inici Sol\u00b7licitud d&#8217;equipaments Sol\u00b7licitud de recursos did\u00e0ctics Calendari d&#8217;ocupaci\u00f3 Material reservat Consulta quin material est\u00e0 reservat i en [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"close","template":"","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"normal-width-container","site-content-style":"unboxed","site-sidebar-style":"unboxed","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-25962","page","type-page","status-publish","hentry"],"post_mailing_queue_ids":[],"_links":{"self":[{"href":"https:\/\/serveiseducatius.xtec.cat\/baixllobregat5\/wp-json\/wp\/v2\/pages\/25962","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/serveiseducatius.xtec.cat\/baixllobregat5\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/serveiseducatius.xtec.cat\/baixllobregat5\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/serveiseducatius.xtec.cat\/baixllobregat5\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/serveiseducatius.xtec.cat\/baixllobregat5\/wp-json\/wp\/v2\/comments?post=25962"}],"version-history":[{"count":5,"href":"https:\/\/serveiseducatius.xtec.cat\/baixllobregat5\/wp-json\/wp\/v2\/pages\/25962\/revisions"}],"predecessor-version":[{"id":26092,"href":"https:\/\/serveiseducatius.xtec.cat\/baixllobregat5\/wp-json\/wp\/v2\/pages\/25962\/revisions\/26092"}],"wp:attachment":[{"href":"https:\/\/serveiseducatius.xtec.cat\/baixllobregat5\/wp-json\/wp\/v2\/media?parent=25962"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}