```
♻️ refactor(FlowReserve.js): Utilise sessionStorage au lieu de localStorage. ✨ feat(FlowAddToCart.js): Utilise sessionStorage pour les dates de réservation. ✨ feat(FlowDatePicker.js): Utilise sessionStorage pour conserver les dates. ```
This commit is contained in:
@@ -16,7 +16,7 @@ export class FlowAddToCart extends HTMLElement {
|
||||
|
||||
async addToCart() {
|
||||
// 1. Check Dates
|
||||
const dates = JSON.parse(localStorage.getItem('reservation_dates') || '{}');
|
||||
const dates = JSON.parse(sessionStorage.getItem('reservation_dates') || '{}');
|
||||
if (!dates.start || !dates.end) {
|
||||
// Open Date Picker if no dates
|
||||
document.dispatchEvent(new CustomEvent('open-date-picker'));
|
||||
@@ -45,25 +45,25 @@ export class FlowAddToCart extends HTMLElement {
|
||||
|
||||
if (data.dispo) {
|
||||
// 4. Add to Cart
|
||||
const list = JSON.parse(localStorage.getItem('pl_list') || '[]');
|
||||
const list = JSON.parse(sessionStorage.getItem('pl_list') || '[]');
|
||||
|
||||
// --- Save Options ---
|
||||
const selectedOptions = Array.from(document.querySelectorAll('.product-option-checkbox:checked'))
|
||||
.map(cb => cb.value);
|
||||
|
||||
const allOptions = JSON.parse(localStorage.getItem('pl_options') || '{}'); console.log(selectedOptions);
|
||||
const allOptions = JSON.parse(sessionStorage.getItem('pl_options') || '{}'); console.log(selectedOptions);
|
||||
if (selectedOptions.length > 0) {
|
||||
allOptions[this.productId] = selectedOptions;
|
||||
} else {
|
||||
delete allOptions[this.productId];
|
||||
}
|
||||
|
||||
localStorage.setItem('pl_options', JSON.stringify(allOptions));
|
||||
sessionStorage.setItem('pl_options', JSON.stringify(allOptions));
|
||||
// --------------------
|
||||
|
||||
if (!list.includes(this.productId)) {
|
||||
list.push(this.productId);
|
||||
localStorage.setItem('pl_list', JSON.stringify(list));
|
||||
sessionStorage.setItem('pl_list', JSON.stringify(list));
|
||||
window.dispatchEvent(new CustomEvent('cart:updated'));
|
||||
}
|
||||
|
||||
|
||||
@@ -17,8 +17,8 @@ export class FlowDatePicker extends HTMLElement {
|
||||
// Listen for global open event
|
||||
document.addEventListener('open-date-picker', () => this.openModal());
|
||||
|
||||
// Update header if dates exist in localStorage
|
||||
const storedDates = JSON.parse(localStorage.getItem('reservation_dates') || '{}');
|
||||
// Update header if dates exist in sessionStorage
|
||||
const storedDates = JSON.parse(sessionStorage.getItem('reservation_dates') || '{}');
|
||||
if (storedDates.start && storedDates.end) {
|
||||
const headerDisplay = document.getElementById('header-date-display');
|
||||
if (headerDisplay) {
|
||||
@@ -63,8 +63,8 @@ export class FlowDatePicker extends HTMLElement {
|
||||
ensureModalExists() {
|
||||
if (document.getElementById(this.modalId)) return;
|
||||
|
||||
// Recuperation des dates du localStorage
|
||||
const storedDates = JSON.parse(localStorage.getItem('reservation_dates') || '{}');
|
||||
// Recuperation des dates du sessionStorage
|
||||
const storedDates = JSON.parse(sessionStorage.getItem('reservation_dates') || '{}');
|
||||
const defaultStart = storedDates.start || '';
|
||||
const defaultEnd = storedDates.end || '';
|
||||
|
||||
@@ -134,7 +134,7 @@ export class FlowDatePicker extends HTMLElement {
|
||||
const endInput = modal.querySelector('#end_date');
|
||||
|
||||
const saveToLocalStorage = () => {
|
||||
localStorage.setItem('reservation_dates', JSON.stringify({
|
||||
sessionStorage.setItem('reservation_dates', JSON.stringify({
|
||||
start: startInput.value,
|
||||
end: endInput.value
|
||||
}));
|
||||
|
||||
@@ -45,7 +45,7 @@ export class FlowReserve extends HTMLAnchorElement {
|
||||
|
||||
getList() {
|
||||
try {
|
||||
return JSON.parse(localStorage.getItem(this.storageKey) || '[]');
|
||||
return JSON.parse(sessionStorage.getItem(this.storageKey) || '[]');
|
||||
} catch (e) {
|
||||
return [];
|
||||
}
|
||||
@@ -53,7 +53,7 @@ export class FlowReserve extends HTMLAnchorElement {
|
||||
|
||||
getOptions() {
|
||||
try {
|
||||
return JSON.parse(localStorage.getItem('pl_options') || '{}');
|
||||
return JSON.parse(sessionStorage.getItem('pl_options') || '{}');
|
||||
} catch (e) {
|
||||
return {};
|
||||
}
|
||||
@@ -62,13 +62,13 @@ export class FlowReserve extends HTMLAnchorElement {
|
||||
removeFromList(id) {
|
||||
let list = this.getList();
|
||||
list = list.filter(itemId => itemId.toString() !== id.toString());
|
||||
localStorage.setItem(this.storageKey, JSON.stringify(list));
|
||||
sessionStorage.setItem(this.storageKey, JSON.stringify(list));
|
||||
|
||||
// Remove options for this product
|
||||
const options = this.getOptions();
|
||||
if (options[id]) {
|
||||
delete options[id];
|
||||
localStorage.setItem('pl_options', JSON.stringify(options));
|
||||
sessionStorage.setItem('pl_options', JSON.stringify(options));
|
||||
}
|
||||
|
||||
window.dispatchEvent(new CustomEvent('cart:updated'));
|
||||
@@ -123,9 +123,9 @@ export class FlowReserve extends HTMLAnchorElement {
|
||||
|
||||
let dates = { start: null, end: null };
|
||||
try {
|
||||
dates = JSON.parse(localStorage.getItem('reservation_dates') || '{}');
|
||||
dates = JSON.parse(sessionStorage.getItem('reservation_dates') || '{}');
|
||||
} catch (e) {
|
||||
console.warn('Invalid reservation dates in localStorage for availability check');
|
||||
console.warn('Invalid reservation dates in sessionStorage for availability check');
|
||||
}
|
||||
|
||||
try {
|
||||
@@ -151,7 +151,7 @@ export class FlowReserve extends HTMLAnchorElement {
|
||||
currentList = currentList.filter(id => !data.unavailable_products_ids.includes(parseInt(id)) && !data.unavailable_products_ids.includes(String(id)));
|
||||
|
||||
if (currentList.length !== initialLength) {
|
||||
localStorage.setItem(this.storageKey, JSON.stringify(currentList));
|
||||
sessionStorage.setItem(this.storageKey, JSON.stringify(currentList));
|
||||
window.dispatchEvent(new CustomEvent('cart:updated'));
|
||||
console.warn('Produits indisponibles retirés du panier:', data.unavailable_products_ids);
|
||||
// Force refresh to update UI immediately
|
||||
@@ -229,12 +229,12 @@ export class FlowReserve extends HTMLAnchorElement {
|
||||
const ids = this.getList();
|
||||
const options = this.getOptions();
|
||||
|
||||
// Retrieve dates from localStorage
|
||||
// Retrieve dates from sessionStorage
|
||||
let dates = { start: null, end: null };
|
||||
try {
|
||||
dates = JSON.parse(localStorage.getItem('reservation_dates') || '{}');
|
||||
dates = JSON.parse(sessionStorage.getItem('reservation_dates') || '{}');
|
||||
} catch (e) {
|
||||
console.warn('Invalid reservation dates in localStorage');
|
||||
console.warn('Invalid reservation dates in sessionStorage');
|
||||
}
|
||||
|
||||
if (ids.length === 0) {
|
||||
@@ -282,7 +282,7 @@ export class FlowReserve extends HTMLAnchorElement {
|
||||
currentList = currentList.filter(id => !data.unavailable_products_ids.includes(parseInt(id)) && !data.unavailable_products_ids.includes(String(id))); // Handle string/int types
|
||||
|
||||
if (currentList.length !== initialLength) {
|
||||
localStorage.setItem(this.storageKey, JSON.stringify(currentList));
|
||||
sessionStorage.setItem(this.storageKey, JSON.stringify(currentList));
|
||||
window.dispatchEvent(new CustomEvent('cart:updated'));
|
||||
// We don't recurse here to avoid infinite loops, but the UI will update next time or we could just use the returned 'products' which already excludes them.
|
||||
console.warn('Certains produits ont été retirés car ils n\'existent plus:', data.unavailable_products_ids);
|
||||
@@ -433,9 +433,9 @@ export class FlowReserve extends HTMLAnchorElement {
|
||||
const options = this.getOptions();
|
||||
let dates = { start: null, end: null };
|
||||
try {
|
||||
dates = JSON.parse(localStorage.getItem('reservation_dates') || '{}');
|
||||
dates = JSON.parse(sessionStorage.getItem('reservation_dates') || '{}');
|
||||
} catch (error) {
|
||||
console.warn('Invalid reservation dates in localStorage');
|
||||
console.warn('Invalid reservation dates in sessionStorage');
|
||||
}
|
||||
|
||||
try {
|
||||
|
||||
Reference in New Issue
Block a user