+
@@ -140,9 +147,18 @@
-
+
{{ ev.name }}
{{ ev.timeLabel }}
@@ -150,7 +166,7 @@
-
Les réservations refusées ne sont pas affichées dans le calendrier.
+
Seules les réservations acceptées sont affichées dans le calendrier.
@@ -178,11 +194,24 @@ const editForm = reactive({ bike_type: null })
const selectedBike = ref('all')
const calendarAnchor = ref(new Date())
+// Highlight and refs for booking cards
+const highlightId = ref(null)
+const bookingRefs = new Map()
+
onMounted(async () => {
await Promise.all([loadBikes(), loadBookings()])
if (!selectedBike.value && bikes.value.length) selectedBike.value = bikes.value[0]
- // Tick 'now' every minute for live status
setInterval(() => { now.value = new Date() }, 60 * 1000)
+ // Deep-link: if a hash like #booking-123 is present, scroll to it
+ try {
+ const hash = typeof window !== 'undefined' ? window.location.hash : ''
+ const m = /^#booking-(\d+)$/.exec(hash || '')
+ if (m) {
+ const id = Number(m[1])
+ // delay to ensure refs are populated
+ setTimeout(() => goToBooking(id), 50)
+ }
+ } catch {}
})
async function loadBikes() {
@@ -235,15 +264,50 @@ function safeHHmm(timeStr) {
return `${String(h).padStart(2,'0')}:${String(m).padStart(2,'0')}`
}
+function isISODateString(s) { return typeof s === 'string' && /^\d{4}-\d{2}-\d{2}/.test(s) }
+function isFRDateString(s) { return typeof s === 'string' && /^\d{2}\/\d{2}\/\d{4}$/.test(s) }
+function toISOFromFR(s) {
+ const m = /^(\d{2})\/(\d{2})\/(\d{4})$/.exec(s || '')
+ if (!m) return ''
+ const dd = m[1], mm = m[2], yyyy = m[3]
+ return `${yyyy}-${mm}-${dd}`
+}
+function toFRFromISO(s) {
+ const m = /^(\d{4})-(\d{2})-(\d{2})/.exec(s || '')
+ if (!m) return ''
+ const yyyy = m[1], mm = m[2], dd = m[3]
+ return `${dd}/${mm}/${yyyy}`
+}
+function normalizeISO(dateStr) {
+ if (isISODateString(dateStr)) return dateStr.slice(0, 10)
+ if (isFRDateString(dateStr)) return toISOFromFR(dateStr)
+ const d = new Date(dateStr)
+ if (!isNaN(d.getTime())) {
+ const yyyy = d.getFullYear()
+ const mm = String(d.getMonth() + 1).padStart(2, '0')
+ const dd = String(d.getDate()).padStart(2, '0')
+ return `${yyyy}-${mm}-${dd}`
+ }
+ return ''
+}
+function formatDateLabel(dateStr) {
+ if (isFRDateString(dateStr)) return dateStr
+ if (isISODateString(dateStr)) return toFRFromISO(dateStr)
+ const d = new Date(dateStr)
+ if (!isNaN(d.getTime())) return formatDate(d)
+ return ''
+}
+
function formatRange(b) {
- // Use raw times to avoid TZ issues; still compute if same day
- const s = parseDateTime(b.start_date, b.start_time)
- const e = parseDateTime(b.end_date, b.end_time, true)
- const sameDay = s.toDateString() === e.toDateString()
+ const isoS = normalizeISO(b.start_date)
+ const isoE = normalizeISO(b.end_date)
const st = safeHHmm(b.start_time)
const et = safeHHmm(b.end_time)
- if (sameDay) return `${formatDate(s)} ${st} → ${et}`
- return `${formatDate(s)} ${st} → ${formatDate(e)} ${et}`
+ const sameDay = isoS && isoE && isoS === isoE
+ const sLabel = formatDateLabel(b.start_date)
+ const eLabel = formatDateLabel(b.end_date)
+ if (sameDay) return `${sLabel} ${st} → ${et}`
+ return `${sLabel} ${st} → ${eLabel} ${et}`
}
function formatBikes(b) {
@@ -256,16 +320,36 @@ function formatBikes(b) {
}
function parseDateTime(dateStr, timeStr, end = false) {
- // dateStr = 'YYYY-MM-DD', timeStr = 'HH:MM' or null
- const [y, m, d] = (dateStr || '').split('-').map(Number)
+ // Accept 'YYYY-MM-DD', 'YYYY-MM-DDTHH:mm:ssZ', 'DD/MM/YYYY', or Date
+ let y, m, d
+ if (dateStr instanceof Date) {
+ y = dateStr.getFullYear(); m = dateStr.getMonth() + 1; d = dateStr.getDate()
+ } else if (typeof dateStr === 'string') {
+ const iso = /^(\d{4})-(\d{2})-(\d{2})/.exec(dateStr)
+ if (iso) { y = Number(iso[1]); m = Number(iso[2]); d = Number(iso[3]) }
+ else {
+ const fr = /^(\d{2})\/(\d{2})\/(\d{4})$/.exec(dateStr)
+ if (fr) { d = Number(fr[1]); m = Number(fr[2]); y = Number(fr[3]) }
+ else {
+ const dt = new Date(dateStr)
+ if (!isNaN(dt.getTime())) { y = dt.getFullYear(); m = dt.getMonth() + 1; d = dt.getDate() }
+ }
+ }
+ }
+ // Fallbacks
+ y = Number.isFinite(y) ? y : new Date().getFullYear()
+ m = Number.isFinite(m) ? m : 1
+ d = Number.isFinite(d) ? d : 1
+
let h = 0, min = 0
- if (timeStr && timeStr.includes(':')) {
+ if (timeStr && typeof timeStr === 'string' && timeStr.includes(':')) {
const [hh, mm] = timeStr.split(':').map(Number)
- h = hh; min = mm
+ h = Number.isFinite(hh) ? hh : 0
+ min = Number.isFinite(mm) ? mm : 0
} else if (end) {
h = 23; min = 59
}
- return new Date(y, (m || 1) - 1, d || 1, h, min, 0, 0)
+ return new Date(y, m - 1, d, h, min, 0, 0)
}
function formatDate(d) {
@@ -298,6 +382,44 @@ async function saveEdit(b) {
}
}
+// Actions: accept / refuse / restore / delete
+async function accept(b) {
+ try {
+ await api.updateBookingStatus(b.id, 'accepted')
+ await loadBookings()
+ } catch (e) {
+ error.value = `Erreur lors de l'acceptation (#${b.id}).`
+ }
+}
+
+async function refuse(b) {
+ try {
+ await api.updateBookingStatus(b.id, 'refused')
+ await loadBookings()
+ } catch (e) {
+ error.value = `Erreur lors du refus (#${b.id}).`
+ }
+}
+
+async function restore(b) {
+ try {
+ await api.updateBookingStatus(b.id, 'pending')
+ await loadBookings()
+ } catch (e) {
+ error.value = `Erreur lors de la restauration (#${b.id}).`
+ }
+}
+
+async function remove(b) {
+ try {
+ if (!confirm(`Supprimer la réservation #${b.id} ?`)) return
+ await api.deleteBooking(b.id)
+ await loadBookings()
+ } catch (e) {
+ error.value = `Erreur lors de la suppression (#${b.id}).`
+ }
+}
+
// UI status helper for filtering
function uiStatus(b) {
if (b.status === 'refused') return 'refused'
@@ -346,6 +468,37 @@ function goToday() { calendarAnchor.value = new Date() }
const gridTemplateDays = computed(() => ({ gridTemplateColumns: `80px repeat(7, minmax(0, 1fr))` }))
+function setBookingRef(id, el) {
+ if (el) bookingRefs.set(id, el)
+ else bookingRefs.delete(id)
+}
+function goToBooking(id) {
+ // Update URL hash for deep-linking
+ try { if (typeof window !== 'undefined') window.location.hash = `booking-${id}` } catch {}
+ // ensure the card exists (may be filtered out); switch filter to 'all' if needed
+ const has = bookingRefs.get(id)
+ if (!has) {
+ // temporarily switch to 'all' to ensure visibility
+ const prev = filter.value
+ filter.value = 'all'
+ // next tick-like delay
+ setTimeout(() => {
+ const el = bookingRefs.get(id)
+ if (el) {
+ el.scrollIntoView({ behavior: 'smooth', block: 'start' })
+ highlightId.value = id
+ setTimeout(() => { if (highlightId.value === id) highlightId.value = null }, 2500)
+ }
+ // restore previous filter after highlighting
+ setTimeout(() => { filter.value = prev }, 2800)
+ }, 0)
+ return
+ }
+ has.scrollIntoView({ behavior: 'smooth', block: 'start' })
+ highlightId.value = id
+ setTimeout(() => { if (highlightId.value === id) highlightId.value = null }, 2500)
+}
+
const dayEvents = computed(() => {
const map = Array.from({ length: 7 }, () => [])
if (!selectedBike.value) return map
@@ -354,7 +507,8 @@ const dayEvents = computed(() => {
const endOfWeek = new Date(weekStart.value)
endOfWeek.setDate(endOfWeek.getDate() + 7)
- const relevant = bookings.value.filter(b => b.status !== 'refused' && includesBike(b, selectedBike.value))
+ // Only accepted bookings appear on the calendar
+ const relevant = bookings.value.filter(b => b.status === 'accepted' && includesBike(b, selectedBike.value))
for (const b of relevant) {
const s = parseDateTime(b.start_date, b.start_time)
@@ -385,6 +539,7 @@ const dayEvents = computed(() => {
if (botMin <= visStart || topMin >= visEnd) continue
const ev = {
+ id: b.id,
dayIdx: i,
topMin,
bottomMin: botMin,
@@ -399,7 +554,7 @@ const dayEvents = computed(() => {
// Layout: simple column assignment to avoid overlap
for (let i = 0; i < 7; i++) {
const events = map[i].sort((a,b) => a.topMin - b.topMin)
- const cols = [] // each col is last bottomMin
+ const cols = []
for (const ev of events) {
let placed = false
for (let c = 0; c < cols.length; c++) {
@@ -431,7 +586,7 @@ function eventStyle(ev) {
}
-
+