nodebb-plugin-equipment-calendar 5.0.0 → 6.0.0

package/library.js

@@ -35,12 +35,6 @@ const crypto = require('crypto');
 const plugin = {};
 const SETTINGS_KEY = 'equipmentCalendar';
 
-const EC_KEYS = {
-  reservationsZset: 'ec:reservations',
-  reservationKey: (id) => `ec:reservation:${id}`,
-  itemZset: (itemId) => `ec:item:${itemId}`,
-};
-
 const DEFAULT_SETTINGS = {
   creatorGroups: 'registered-users',
   approverGroup: 'administrators',
@@ -262,12 +256,21 @@ async function fetchHelloAssoItems(settings) {
 
   function pushItem(it, tierName) {
     if (!it) return;
-    const id = String(it.id || it.itemId || it.reference || it.slug || it.code || it.name || '').trim();
-    const name = String(it.name || it.label || it.title || '').trim() || (tierName ? String(tierName) : id);
-    if (!id || !name) return;
-    const amount = it.amount || it.price || it.unitPrice || it.totalAmount || it.initialAmount;
-    const priceCents = (typeof amount === 'number' ? amount : parseInt(amount, 10)) || 0;
-    out.push({ id, name, priceCents: String(priceCents), location: '' });
+    const id = String(it.id || it.itemId || it.productId || it.code || it.slug || '').trim();
+    const baseName = String(it.name || it.label || it.title || '').trim();
+    const name = (tierName && baseName) ? `${tierName} — ${baseName}` : (baseName || tierName || id);
+    let amount = it.amount ?? it.price ?? it.unitPrice ?? it.totalAmount ?? it.initialAmount ?? it.minimumAmount;
+    if (amount && typeof amount === 'object') {
+      amount = amount.amount ?? amount.value ?? amount.total ?? amount.price ?? amount.cents ?? amount.centAmount ?? 0;
+    }
+    let price = 0;
+    if (typeof amount === 'number') price = amount;
+    else if (typeof amount === 'string') {
+      const s = amount.replace(',', '.').replace(/[^0-9.\-]/g, '');
+      price = parseFloat(s) || 0;
+    }
+    if (!id) return;
+    out.push({ id, name, price, location: '' });
   }
 
   // Try a few known layouts
@@ -304,7 +307,7 @@ async function getActiveItems() {
   const items = (Array.isArray(rawItems) ? rawItems : []).map((it) => ({
     id: String(it.id || '').trim(),
     name: String(it.name || '').trim(),
-    price: Number(it.price || 0) || 0,
+    price: Number((it.price !== undefined ? it.price : it.priceCents) || 0) || 0,
     active: true,
   })).filter(it => it.id && it.name);
   return items;
@@ -354,6 +357,8 @@ async function getBookingRids(bookingId) {
 async function saveReservation(res) {
   await db.setObject(resKey(res.id), res);
   await db.sortedSetAdd(itemIndexKey(res.itemId), res.startMs, res.id);
+  // Global index for ACP listing
+  await db.sortedSetAdd('equipmentCalendar:reservations', res.startMs, res.id);
 }
 
 async function getReservation(id) {
@@ -546,28 +551,22 @@ function verifyWebhook(req, secret) {
 
 // --- Rendering helpers ---
 function toEvent(res, item, requesterName, canSeeRequester) {
-  const start = DateTime.fromMillis(res.startMs).toISO();
-  const end = DateTime.fromMillis(res.endMs).toISO();
-
-  let icon = '⏳';
+  const start = DateTime.fromMillis(res.startMs).toISODate();
+  const end = DateTime.fromMillis(res.endMs).toISODate();
   let className = 'ec-status-pending';
-  if (res.status === 'approved_waiting_payment') { icon = '💳'; className = 'ec-status-awaitpay'; }
-  if (res.status === 'paid_validated') { icon = '✅'; className = 'ec-status-valid'; }
-  if (res.status === 'rejected' || res.status === 'cancelled') { icon = '❌'; className = 'ec-status-cancel'; }
-
-  const titleParts = [icon, item ? item.name : res.itemId];
+  if (res.status === 'approved_waiting_payment' || res.status === 'approved') { className = 'ec-status-approved'; }
+  if (res.status === 'paid_validated' || res.status === 'paid') { className = 'ec-status-paid'; }
+  if (res.status === 'rejected' || res.status === 'cancelled') { className = 'ec-status-cancelled'; }
+  const titleParts = [item ? item.name : res.itemId];
   if (canSeeRequester && requesterName) titleParts.push(`- ${requesterName}`);
   return {
     id: res.id,
     title: titleParts.join(' '),
     start,
     end,
-    allDay: false,
-    className,
-    extendedProps: {
-      status: res.status,
-      itemId: res.itemId,
-    },
+    allDay: true,
+    classNames: [className],
+    extendedProps: { status: res.status, itemId: res.itemId },
   };
 }
 
@@ -653,9 +652,6 @@ plugin.init = async function (params) {
 
   // Page routes are attached via filter:router.page as well, but we also add directly to be safe:
   router.get('/equipment/calendar', middleware.buildHeader, renderCalendarPage);
-    router.get('/calendar', middleware.buildHeader, renderCalendarPage);
-    router.get('/api/calendar', middleware.buildHeader, renderCalendarPage);
-
   router.get('/equipment/approvals', middleware.buildHeader, renderApprovalsPage);
 
   router.post('/equipment/reservations/create', middleware.applyCSRF, handleCreateReservation);
@@ -690,6 +686,91 @@ plugin.addAdminRoutes = async function (params) {
 };
 
 
+async function renderAdminReservationsPage(req, res) {
+  if (!(await ensureIsAdmin(req, res))) return;
+
+  const settings = await getSettings();
+  const items = await getActiveItems(settings);
+  const itemById = {};
+  items.forEach(it => { itemById[it.id] = it; });
+
+  const status = String(req.query.status || ''); // optional filter
+  const itemId = String(req.query.itemId || ''); // optional filter
+  const q = String(req.query.q || '').trim();    // search rid/user/notes
+
+  const page = Math.max(1, parseInt(req.query.page, 10) || 1);
+  const perPage = Math.min(100, Math.max(10, parseInt(req.query.perPage, 10) || 50));
+
+  const allRids = await db.getSortedSetRevRange('equipmentCalendar:reservations', 0, -1);
+  const totalAll = allRids.length;
+
+  const rows = [];
+  for (const rid of allRids) {
+    // eslint-disable-next-line no-await-in-loop
+    const r = await db.getObject(`equipmentCalendar:reservation:${rid}`);
+    if (!r || !r.rid) continue;
+
+    if (status && String(r.status) !== status) continue;
+    if (itemId && String(r.itemId) !== itemId) continue;
+
+    const notes = String(r.notesUser || '');
+    const ridStr = String(r.rid || rid);
+    if (q) {
+      const hay = (ridStr + ' ' + String(r.uid || '') + ' ' + notes).toLowerCase();
+      if (!hay.includes(q.toLowerCase())) continue;
+    }
+
+    const startMs = parseInt(r.startMs, 10) || 0;
+    const endMs = parseInt(r.endMs, 10) || 0;
+    const createdAt = parseInt(r.createdAt, 10) || 0;
+
+    rows.push({
+      rid: ridStr,
+      itemId: String(r.itemId || ''),
+      itemName: (itemById[String(r.itemId || '')] && itemById[String(r.itemId || '')].name) || String(r.itemId || ''),
+      uid: String(r.uid || ''),
+      status: String(r.status || ''),
+      start: startMs ? new Date(startMs).toISOString() : '',
+      end: endMs ? new Date(endMs).toISOString() : '',
+      createdAt: createdAt ? new Date(createdAt).toISOString() : '',
+      notesUser: notes,
+    });
+  }
+
+  const total = rows.length;
+  const totalPages = Math.max(1, Math.ceil(total / perPage));
+  const safePage = Math.min(page, totalPages);
+  const startIndex = (safePage - 1) * perPage;
+  const pageRows = rows.slice(startIndex, startIndex + perPage);
+
+  const itemOptions = [{ id: '', name: 'Tous' }].concat(items.map(i => ({ id: i.id, name: i.name })));
+  const statusOptions = [
+    { id: '', name: 'Tous' },
+    { id: 'pending', name: 'pending' },
+    { id: 'approved', name: 'approved' },
+    { id: 'paid', name: 'paid' },
+    { id: 'rejected', name: 'rejected' },
+    { id: 'cancelled', name: 'cancelled' },
+  ];
+
+  res.render('admin/plugins/equipment-calendar-reservations', {
+    title: 'Equipment Calendar - Réservations',
+    settings,
+    rows: pageRows,
+    hasRows: pageRows.length > 0,
+    itemOptions: itemOptions.map(o => ({ ...o, selected: o.id === itemId })),
+    statusOptions: statusOptions.map(o => ({ ...o, selected: o.id === status })),
+    q,
+    page: safePage,
+    perPage,
+    total,
+    totalAll,
+    totalPages,
+    prevPage: safePage > 1 ? safePage - 1 : 0,
+    nextPage: safePage < totalPages ? safePage + 1 : 0,
+    actionBase: '/admin/plugins/equipment-calendar/reservations',
+  });
+}
 
 async function handleAdminApprove(req, res) {
   if (!(await ensureIsAdmin(req, res))) return;
@@ -849,6 +930,86 @@ async function handleHelloAssoCallback(req, res) {
   });
 }
 
+async function renderCalendarPage(req, res) {
+  const settings = await getSettings();
+  const items = await getActiveItems(settings);
+
+  const tz = settings.timezone || 'Europe/Paris';
+
+  // Determine range to render
+  const now = DateTime.now().setZone(tz);
+  const view = String(req.query.view || settings.defaultView || 'dayGridMonth');
+  const startQ = req.query.start;
+  const endQ = req.query.end;
+
+  let start, end;
+  if (startQ && endQ) {
+    const r = clampRange(String(startQ), String(endQ), tz);
+    start = r.start;
+    end = r.end;
+  } else {
+    // Default to current month range
+    start = now.startOf('month');
+    end = now.endOf('month').plus({ days: 1 });
+  }
+
+  // Load reservations for ALL items within range (so we can build availability client-side without extra requests)
+  const allReservations = [];
+  for (const it of items) {
+    // eslint-disable-next-line no-await-in-loop
+    const resForItem = await listReservationsForRange(it.id, start.toMillis(), end.toMillis());
+    for (const r of resForItem) allReservations.push(r);
+  }
+
+  const showRequesterToAll = String(settings.showRequesterToAll) === '1';
+  const isApprover = req.uid ? await canApprove(req.uid, settings) : false;
+
+  const requesterUids = Array.from(new Set(allReservations.map(r => r.uid))).filter(Boolean);
+  const users = requesterUids.length ? await user.getUsersData(requesterUids) : [];
+  const nameByUid = {};
+  (users || []).forEach(u => { nameByUid[u.uid] = u.username || ''; });
+
+  const itemById = {};
+  items.forEach(it => { itemById[it.id] = it; });
+
+  const events = allReservations
+    .filter(r => r.status !== 'rejected' && r.status !== 'cancelled')
+    .map(r => {
+      const item = itemById[r.itemId];
+      // Include item name in title so "all items" view is readable
+      const requesterName = nameByUid[r.uid] || '';
+      return toEvent(r, item, requesterName, isApprover || showRequesterToAll);
+    });
+
+  const canUserCreate = req.uid ? await canCreate(req.uid, settings) : false;
+
+  // We expose minimal reservation data for availability checks in the modal
+  const blocks = allReservations
+    .filter(r => statusBlocksItem(r.status))
+    .map(r => ({
+      itemId: r.itemId,
+      startMs: r.startMs,
+      endMs: r.endMs,
+      status: r.status,
+    }));
+
+  res.render('equipment-calendar/calendar', {
+    title: 'Réservation de matériel',
+    items,
+    view,
+    tz,
+    startISO: start.toISO(),
+    endISO: end.toISO(),
+    initialDateISO: start.toISODate(),
+    canCreate: canUserCreate,
+    canCreateJs: canUserCreate ? 'true' : 'false',
+    isApprover,
+    // events are base64 encoded to avoid template escaping issues
+    eventsB64: Buffer.from(JSON.stringify(events), 'utf8').toString('base64'),
+    blocksB64: Buffer.from(JSON.stringify(blocks), 'utf8').toString('base64'),
+    itemsB64: Buffer.from(JSON.stringify(items.map(i => ({ id: i.id, name: i.name, location: i.location }))), 'utf8').toString('base64'),
+  });
+}
 
 
 // --- Approvals page ---
@@ -1009,70 +1170,52 @@ async function createReservationForItem(req, res, settings, itemId, startMs, end
 
 async function handleCreateReservation(req, res) {
   try {
-    if (!req.uid) return res.status(403).json({ error: 'not-logged-in' });
-
     const settings = await getSettings();
-    const canCreate = await isUserInAnyGroups(req.uid, settings.creatorGroups);
-    if (!canCreate) return res.status(403).json({ error: 'forbidden' });
+    if (!req.uid || !(await canCreate(req.uid, settings))) {
+      return helpers.notAllowed(req, res);
+    }
 
-    const notesUser = String(req.body.notesUser || '').trim();
-    const itemIdsRaw = req.body.itemIds || req.body.itemId || [];
-    const itemIds = Array.isArray(itemIdsRaw) ? itemIdsRaw : String(itemIdsRaw || '').split(',').filter(Boolean);
-
-    const startMsRaw = parseInt(req.body.startMs, 10) || 0;
-    const endMsRaw = parseInt(req.body.endMs, 10) || 0;
-
-    const startDate = startMsRaw ? new Date(startMsRaw) : null;
-    const endDate = endMsRaw ? new Date(endMsRaw) : null;
-    const startMs = startDate ? Date.UTC(startDate.getUTCFullYear(), startDate.getUTCMonth(), startDate.getUTCDate()) : 0;
-    let endMs = 0;
-    if (endDate) {
-      endMs = Date.UTC(endDate.getUTCFullYear(), endDate.getUTCMonth(), endDate.getUTCDate());
-      if (endMs <= startMs) endMs = startMs + 24 * 60 * 60 * 1000;
+    const itemIdsRaw = req.body.itemIds || req.body.itemId || '';
+    const itemIds = (Array.isArray(itemIdsRaw) ? itemIdsRaw : String(itemIdsRaw))
+      .split(',')
+      .map(s => String(s).trim())
+      .filter(Boolean);
+
+    if (!itemIds.length) {
+      return res.status(400).send('itemIds required');
+    }
+
+    const tz = settings.timezone || 'Europe/Paris';
+    const start = DateTime.fromISO(String(req.body.start || ''), { zone: tz });
+    const end = DateTime.fromISO(String(req.body.end || ''), { zone: tz });
+    if (!start.isValid || !end.isValid) return res.status(400).send('Invalid dates');
+
+    // Normalize to whole days (no hours). End is exclusive.
+    const startDay = start.startOf('day');
+    let endDay = end.startOf('day');
+    if (endDay <= startDay) {
+      endDay = startDay.plus({ days: 1 });
     }
-    if (!startMs || !endMs) return res.status(400).json({ error: 'invalid-dates' });
-
-    const days = Math.max(1, Math.round((endMs - startMs) / (24 * 60 * 60 * 1000)));
-
-    const items = await getActiveItems();
-    const byId = {};
-    items.forEach((it) => { byId[String(it.id)] = it; });
-
-    const valid = itemIds.map(String).filter((id) => byId[id]);
-    if (!valid.length) return res.status(400).json({ error: 'unknown-item' });
-
-    const bookingId = generateId();
-    for (const itemId of valid) {
-      const it = byId[itemId];
-      const id = generateId();
-      const unitPrice = Number(it.price || 0) || 0;
-      const total = unitPrice * days;
-
-      const reservation = {
-        id,
-        bookingId,
-        uid: req.uid,
-        itemId,
-        itemName: it.name,
-        unitPrice,
-        days,
-        total,
-        notesUser,
-        startMs,
-        endMs,
-        status: 'pending',
-        createdAt: Date.now(),
-      };
-
-      await db.setObject(EC_KEYS.reservationKey(id), reservation);
-      await db.sortedSetAdd(EC_KEYS.reservationsZset, startMs, id);
-      await db.sortedSetAdd(EC_KEYS.itemZset(itemId), startMs, id);
+
+    const startMs = startDay.toMillis();
+    const endMs = endDay.toMillis();
+
+    const notesUser = String(req.body.notesUser || '').trim();
+
+    const bookingId = `${req.uid}:${Date.now()}:${Math.random().toString(36).slice(2, 8)}`;
+
+    // Create one reservation per item, linked by bookingId
+    const created = [];
+    for (const itemId of itemIds) {
+      const rid = await createReservationForItem(req, res, settings, itemId, startMs, endMs, notesUser, bookingId);
+      created.push(rid);
     }
 
-    res.redirect(nconf.get('relative_path') + '/calendar?created=1&bookingId=' + bookingId);
+    // Redirect to calendar with a success flag
+    return res.redirect('/equipment/calendar?requested=1');
   } catch (err) {
-    winston.error('[equipment-calendar] create error', err);
-    res.status(500).json({ error: 'internal-error' });
+    winston.error(err);
+    return res.status(500).send(err.message || 'Error');
   }
 }
 
@@ -1321,83 +1464,3 @@ function startPaymentTimeoutScheduler() {
 }
 
 module.exports = plugin;
-
-async function handleAdminReservationAction(req, res, action) {
-  const isAdmin = await user.isAdminOrGlobalMod(req.uid);
-  if (!isAdmin) return res.status(403).json({ error: 'forbidden' });
-
-  const id = String(req.params.id || '');
-  const key = EC_KEYS.reservationKey(id);
-  const r = await db.getObject(key);
-  if (!r || !r.id) return res.status(404).json({ error: 'not-found' });
-
-  if (action === 'delete') {
-    await db.delete(key);
-    await db.sortedSetRemove(EC_KEYS.reservationsZset, id);
-    if (r.itemId) await db.sortedSetRemove(EC_KEYS.itemZset(r.itemId), id);
-    return res.redirect(nconf.get('relative_path') + '/admin/plugins/equipment-calendar/reservations?done=1');
-  }
-
-  const status = action === 'approve' ? 'approved' : 'cancelled';
-  await db.setObjectField(key, 'status', status);
-  return res.redirect(nconf.get('relative_path') + '/admin/plugins/equipment-calendar/reservations?done=1');
-}
-
-async function renderAdminReservationsPage(req, res) {
-  const isAdmin = await user.isAdminOrGlobalMod(req.uid);
-  if (!isAdmin) return res.status(403).render('403', {});
-  const ids = await db.getSortedSetRevRange(EC_KEYS.reservationsZset, 0, 199);
-  const rowsRaw = await db.getObjects(ids.map(id => EC_KEYS.reservationKey(id)));
-  const rows = (rowsRaw || []).filter(Boolean).map((r) => {
-    const startMs = parseInt(r.startMs, 10) || 0;
-    const endMs = parseInt(r.endMs, 10) || 0;
-    return {
-      id: r.id,
-      bookingId: r.bookingId || '',
-      itemName: r.itemName || r.itemId,
-      startIso: startMs ? new Date(startMs).toISOString().slice(0,10) : '',
-      endIso: endMs ? new Date(endMs - 24*60*60*1000).toISOString().slice(0,10) : '',
-      days: parseInt(r.days, 10) || 1,
-      status: r.status || 'pending',
-      total: (Number(r.total || 0) || 0),
-    };
-  });
-  res.render('admin/plugins/equipment-calendar-reservations', { title: 'Réservations', rows, hasRows: rows.length>0, csrf: req.csrfToken(), done: String(req.query.done||'')==='1' });
-}
-
-async function getCalendarEvents() {
-  const ids = await db.getSortedSetRange(EC_KEYS.reservationsZset, 0, -1);
-  const rows = await db.getObjects(ids.map(id => EC_KEYS.reservationKey(id)));
-  return (rows || []).filter(Boolean).map((r) => {
-    const startMs = parseInt(r.startMs, 10) || 0;
-    const endMs = parseInt(r.endMs, 10) || 0;
-    const status = r.status || 'pending';
-    return {
-      id: r.id,
-      title: (r.itemName || 'Réservation'),
-      start: startMs ? new Date(startMs).toISOString().slice(0,10) : null,
-      end: endMs ? new Date(endMs).toISOString().slice(0,10) : null,
-      allDay: true,
-      classNames: ['ec-status-' + status],
-      extendedProps: { status, bookingId: r.bookingId || '' },
-    };
-  });
-}
-
-async function renderCalendarPage(req, res) {
-  const settings = await getSettings();
-  const canCreate = req.uid ? await isUserInAnyGroups(req.uid, settings.creatorGroups) : false;
-  const isApprover = req.uid ? await isUserInAnyGroups(req.uid, settings.approverGroup) : false;
-  const items = await getActiveItems();
-  const events = await getCalendarEvents();
-
-  res.render('equipment-calendar/calendar', {
-    title: 'Calendrier',
-    canCreate,
-    isApprover,
-    items,
-    eventsJson: JSON.stringify(events),
-    defaultView: settings.defaultView || 'dayGridMonth',
-    created: String(req.query.created || '') === '1',
-  });
-}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nodebb-plugin-equipment-calendar",
-  "version": "5.0.0",
+  "version": "6.0.0",
   "description": "Equipment reservation calendar for NodeBB (FullCalendar, approvals, HelloAsso payments)",
   "main": "library.js",
   "scripts": {

package/plugin.json

@@ -25,6 +25,6 @@
   "scripts": [
     "public/js/client.js"
   ],
-  "version": "0.8.0",
+  "version": "3.0.0-stable1",
   "minver": "4.7.1"
 }

package/public/js/client.js

@@ -93,8 +93,9 @@ require(['jquery', 'bootstrap'], function ($, bootstrap) {
     const events = Array.isArray(window.EC_EVENTS) ? window.EC_EVENTS : [];
 
     const calendar = new window.FullCalendar.Calendar(calendarEl, {
-        locale: 'fr',
-        headerToolbar: { left: 'prev,next today', center: 'title', right: 'dayGridMonth,dayGridWeek,listMonth,listWeek' },
+      initialView: 'dayGridMonth',
+      locale: 'fr',
+      headerToolbar: { left: 'prev,next today', center: 'title', right: 'dayGridMonth,dayGridWeek,listMonth,listWeek' },
       selectable: canCreate,
       selectMirror: true,
       events,

package/public/templates/admin/plugins/equipment-calendar-reservations.tpl

@@ -1,49 +1,104 @@
-
 <div class="acp-page-container">
   <div class="d-flex align-items-center justify-content-between flex-wrap gap-2">
-    <h1 class="mb-0">Réservations</h1>
-    <a class="btn btn-outline-secondary" href="/admin/plugins/equipment-calendar">Paramètres</a>
+    <h1 class="mb-0">Equipment Calendar</h1>
+    <div class="btn-group">
+      <a class="btn btn-outline-secondary" href="/admin/plugins/equipment-calendar">Paramètres</a>
+      <a class="btn btn-secondary active" href="/admin/plugins/equipment-calendar/reservations">Réservations</a>
+    </div>
   </div>
 
-  {{{ if done }}}
-  <script>
-    if (window.app && window.app.alertSuccess) window.app.alertSuccess('Action effectuée');
-  </script>
-  {{{ end }}}
+  <form method="get" action="/admin/plugins/equipment-calendar/reservations" class="card card-body mt-3 mb-3">
+    <div class="row g-2 align-items-end">
+      <div class="col-md-3">
+        <label class="form-label">Statut</label>
+        <select class="form-select" name="status">
+          {{{ each statusOptions }}}
+            <option value="{statusOptions.id}" {{{ if statusOptions.selected }}}selected{{{ end }}}>{statusOptions.name}</option>
+          {{{ end }}}
+        </select>
+      </div>
+      <div class="col-md-4">
+        <label class="form-label">Matériel</label>
+        <select class="form-select" name="itemId">
+          {{{ each itemOptions }}}
+            <option value="{itemOptions.id}" {{{ if itemOptions.selected }}}selected{{{ end }}}>{itemOptions.name}</option>
+          {{{ end }}}
+        </select>
+      </div>
+      <div class="col-md-3">
+        <label class="form-label">Recherche</label>
+        <input class="form-control" name="q" value="{q}" placeholder="rid, uid, note">
+      </div>
+      <div class="col-md-2">
+        <button class="btn btn-primary w-100" type="submit">Filtrer</button>
+      </div>
+    </div>
+  </form>
+
+  <div class="text-muted small mb-2">
+    Total (filtré) : <strong>{total}</strong> — Total (global) : <strong>{totalAll}</strong>
+  </div>
 
   {{{ if hasRows }}}
-  <div class="table-responsive mt-3">
+  <div class="table-responsive">
     <table class="table table-striped align-middle">
-      <thead><tr><th>ID</th><th>Matériel</th><th>Période</th><th>Jours</th><th>Statut</th><th>Total</th><th class="text-end">Actions</th></tr></thead>
+      <thead>
+        <tr>
+          <th>RID</th>
+          <th>Matériel</th>
+          <th>UID</th>
+          <th>Début</th>
+          <th>Fin</th>
+          <th>Statut</th>
+          <th>Créé</th>
+          <th>Note</th>
+          <th>Actions</th>
+        </tr>
+      </thead>
       <tbody>
-        <!-- BEGIN rows -->
+        {{{ each rows }}}
         <tr>
-          <td><code>{rows.id}</code><br><small class="text-muted">{rows.bookingId}</small></td>
+          <td><code>{rows.rid}</code></td>
           <td>{rows.itemName}</td>
-          <td>{rows.startIso} → {rows.endIso}</td>
-          <td>{rows.days}</td>
-          <td><span class="badge text-bg-secondary">{rows.status}</span></td>
-          <td>{rows.total} €</td>
-          <td class="text-end">
-            <form class="d-inline" method="post" action="/admin/plugins/equipment-calendar/reservations/{rows.id}/approve">
-              <input type="hidden" name="_csrf" value="{csrf}">
-              <button class="btn btn-sm btn-primary" type="submit">Approve</button>
+          <td>{rows.uid}</td>
+          <td><small>{rows.start}</small></td>
+          <td><small>{rows.end}</small></td>
+          <td><code>{rows.status}</code></td>
+          <td><small>{rows.createdAt}</small></td>
+          <td><small>{rows.notesUser}</small></td>
+          <td class="text-nowrap">
+            <form method="post" action="/admin/plugins/equipment-calendar/reservations/{rows.rid}/approve" class="d-inline">
+              <input type="hidden" name="_csrf" value="{config.csrf_token}">
+              <button class="btn btn-sm btn-success" type="submit">Approve</button>
             </form>
-            <form class="d-inline" method="post" action="/admin/plugins/equipment-calendar/reservations/{rows.id}/reject">
-              <input type="hidden" name="_csrf" value="{csrf}">
+            <form method="post" action="/admin/plugins/equipment-calendar/reservations/{rows.rid}/reject" class="d-inline ms-1">
+              <input type="hidden" name="_csrf" value="{config.csrf_token}">
               <button class="btn btn-sm btn-warning" type="submit">Reject</button>
             </form>
-            <form class="d-inline" method="post" action="/admin/plugins/equipment-calendar/reservations/{rows.id}/delete" onsubmit="return confirm('Supprimer ?');">
-              <input type="hidden" name="_csrf" value="{csrf}">
+            <form method="post" action="/admin/plugins/equipment-calendar/reservations/{rows.rid}/delete" class="d-inline ms-1" onsubmit="return confirm('Supprimer définitivement ?');">
+              <input type="hidden" name="_csrf" value="{config.csrf_token}">
               <button class="btn btn-sm btn-danger" type="submit">Delete</button>
             </form>
           </td>
         </tr>
-        <!-- END rows -->
+        {{{ end }}}
       </tbody>
     </table>
   </div>
+
+  <div class="d-flex justify-content-between align-items-center mt-3">
+    <div>Page {page} / {totalPages}</div>
+    <div class="btn-group">
+      {{{ if prevPage }}}
+      <a class="btn btn-outline-secondary" href="/admin/plugins/equipment-calendar/reservations?page={prevPage}&perPage={perPage}">Précédent</a>
+      {{{ end }}}
+      {{{ if nextPage }}}
+      <a class="btn btn-outline-secondary" href="/admin/plugins/equipment-calendar/reservations?page={nextPage}&perPage={perPage}">Suivant</a>
+      {{{ end }}}
+    </div>
+  </div>
+
   {{{ else }}}
-  <div class="alert alert-info mt-3">Aucune réservation.</div>
+    <div class="alert alert-info">Aucune réservation trouvée.</div>
   {{{ end }}}
 </div>

package/public/templates/admin/plugins/equipment-calendar.tpl

@@ -36,19 +36,6 @@
     </div>
 
     <div class="card card-body mb-3">
-      <h5>Affichage calendrier</h5>
-      <div class="mb-0">
-        <label class="form-label">Vue par défaut</label>
-        <select class="form-select" name="defaultView">
-          <option value="dayGridMonth">Mois</option>
-          <option value="dayGridWeek">Semaine</option>
-          <option value="listMonth">Liste (mois)</option>
-          <option value="listWeek">Liste (semaine)</option>
-        </select>
-      </div>
-    </div>
-
-<div class="card card-body mb-3">
       <h5>HelloAsso</h5>
       <div class="mb-3">
         <label class="form-label">API Base URL (prod/sandbox)</label>

package/public/templates/equipment-calendar/calendar.tpl

@@ -43,8 +43,8 @@
               <label class="form-label">Matériel</label>
               <select class="form-select" id="ec-item-ids" name="itemIds" multiple required>
         <!-- BEGIN items -->
-<option value="{items.id}" data-price="{items.price}">{items.name} — {items.price} €</option>
-<!-- END items -->
+        <option value="{items.id}" data-price="{items.price}">{items.name} — {items.price} €</option>
+        <!-- END items -->
 </select>
               <div class="form-text">Tu peux sélectionner plusieurs matériels.</div>
             </div>
@@ -84,9 +84,10 @@
 </script>
 
 <style>
+/* Event styling */
+.fc .fc-event-title { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
 .fc-event.ec-status-pending { background: rgba(108,117,125,.18); border-color: rgba(108,117,125,.45); }
 .fc-event.ec-status-approved { background: rgba(13,110,253,.18); border-color: rgba(13,110,253,.45); }
 .fc-event.ec-status-paid { background: rgba(25,135,84,.18); border-color: rgba(25,135,84,.45); }
 .fc-event.ec-status-cancelled { background: rgba(220,53,69,.10); border-color: rgba(220,53,69,.35); opacity:.65; text-decoration: line-through; }
-.fc .fc-event-title { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
 </style>