diff --git a/src/components/@inputs/PostalCode.vue b/src/components/@inputs/PostalCode.vue index 2957e33..9678fab 100644 --- a/src/components/@inputs/PostalCode.vue +++ b/src/components/@inputs/PostalCode.vue @@ -53,15 +53,15 @@ export default defineComponent({ return formattedDate; }); - - postalCodeValid.value.isValid = true; if(!dates.length) { quasarNotify({ type: "erro", message: `No tenemos fechas de entrega posibles para este código postal`, }); setFieldError("postalCode", M.fiveLength); - postalCodeValid.value.isValid = false; + postalCodeValid.value.isValid = false; + } else { + postalCodeValid.value.isValid = true; } postalCodeValid.value.dataOptions = dates; diff --git a/src/components/quasar-components/carousel/VerticalCarouselImgs.vue b/src/components/quasar-components/carousel/VerticalCarouselImgs.vue index 783f788..fbffce8 100644 --- a/src/components/quasar-components/carousel/VerticalCarouselImgs.vue +++ b/src/components/quasar-components/carousel/VerticalCarouselImgs.vue @@ -44,8 +44,8 @@ export default defineComponent({ const { navPos, screenWidth, slide, target } = useVerticalCarouselImgs(); const formStore = useFormStore(); - const { getItem } = useLocalStorage(); - const localValues = getItem("availability"); + const { getItemSession } = useLocalStorage(); + const localValues = getItemSession("availability"); const lengthCp = 5; const { postalCodeValid } = storeToRefs(formStore); @@ -63,7 +63,7 @@ export default defineComponent({ if (e.target.value.length === lengthCp && isEventKeyActive) { if (e.key === 'Enter') { e.preventDefault(); - modalDate.click(); + if(postalCodeValid.value.isValid) modalDate.click(); isEventKeyActive = false; } } diff --git a/src/hooks/useCheckoutForm.js b/src/hooks/useCheckoutForm.js index 42dafe5..c0f1219 100644 --- a/src/hooks/useCheckoutForm.js +++ b/src/hooks/useCheckoutForm.js @@ -11,7 +11,7 @@ import { checkoutSchema } from "src/utils/zod/schemas"; import { useLocalStorage } from "./useLocalStorage"; export function useCheckoutForm() { - const { addItem, getItem, removeItem } = useLocalStorage(); + const { addItem, getItem, getItemSession, removeItem } = useLocalStorage(); //! Elements ref const postalCodeRef = ref(null); @@ -26,7 +26,7 @@ export function useCheckoutForm() { const { handleCheckoutData } = formStore; const availability = - availabilityForm.value.dateExpired || getItem("availability"); + availabilityForm.value.dateExpired || getItemSession("availability"); const phoneData = ref({ country: { diff --git a/src/hooks/useLocalStorage.js b/src/hooks/useLocalStorage.js index fdf2e41..02fc3bb 100644 --- a/src/hooks/useLocalStorage.js +++ b/src/hooks/useLocalStorage.js @@ -1,4 +1,4 @@ -import { LocalStorage } from "quasar"; +import { LocalStorage, SessionStorage } from "quasar"; export function useLocalStorage() { /** @@ -12,6 +12,15 @@ export function useLocalStorage() { LocalStorage.set(`@${key}`, stringifyValue); }; + /** + * Adds an item to SessionStorage. + * @param {string} key - The key of the item to be added. + * @param {*} value - The value of the item to be added. + */ + const addItemSession = (key, value) => { + SessionStorage.set(`@${key}`, stringifyValue); + } + /** * Retrieves an item from the local storage based on the provided key. * @@ -25,6 +34,19 @@ export function useLocalStorage() { return data || []; }; + /** + * Retrieves an item from the local storage based on the provided key. + * + * @param {string} key - The key of the item to retrieve. + * @returns {Object|Array} - The retrieved item from the local storage. If the key is "availability", it returns an object, otherwise it returns an array. + */ + const getItemSession = (key) => { + const data = JSON.parse(SessionStorage.getItem(`@${key}`)); + + if (key === "availability") return data || {}; + return data || []; + }; + /** * Remove an item from local storage. * @@ -38,5 +60,7 @@ export function useLocalStorage() { addItem, getItem, removeItem, + addItemSession, + getItemSession }; } diff --git a/src/hooks/usePostalCalendar.js b/src/hooks/usePostalCalendar.js index 4a8d503..e2cffad 100644 --- a/src/hooks/usePostalCalendar.js +++ b/src/hooks/usePostalCalendar.js @@ -26,7 +26,7 @@ import { useLocalStorage } from "./useLocalStorage"; export function usePostalCalendar({ modalItem = "", type = "home" }) { const route = useRoute(); const { push } = useRouter(); - const { addItem, getItem, removeItem } = useLocalStorage(); + const { addItem, getItemSession, removeItem } = useLocalStorage(); const modalStore = useModalStore(); @@ -48,7 +48,7 @@ export function usePostalCalendar({ modalItem = "", type = "home" }) { plantas: "Floranet Plantas", ramos: "Floranet Ramos", }; - const availability = ref(getItem("availability")); + const availability = ref(getItemSession("availability")); const availabilityFormKeys = computed(() => { return Object.fromEntries( diff --git a/src/pages/CategoryPage.vue b/src/pages/CategoryPage.vue index ccf4e5d..3d88b4e 100644 --- a/src/pages/CategoryPage.vue +++ b/src/pages/CategoryPage.vue @@ -37,7 +37,7 @@ export default defineComponent({ setup() { const route = useRoute(); const { push } = useRouter(); - const { getItem } = useLocalStorage(); + const { getItemSession } = useLocalStorage(); const { isAvailabilityEmpty } = usePostalCalendar({}); const mobileStore = useMobileStore(); @@ -54,7 +54,7 @@ export default defineComponent({ const { getProducts } = cartStore; const isOpenOrder = ref(false); - const availabilityStoraged = ref(getItem("availability")); + const availabilityStoraged = ref(getItemSession("availability")); const isNotAllCategory = computed(() => { return route.path.split("/")[2] !== "all"; }); diff --git a/src/pages/ProductPage.vue b/src/pages/ProductPage.vue index d904147..5383388 100644 --- a/src/pages/ProductPage.vue +++ b/src/pages/ProductPage.vue @@ -43,12 +43,12 @@ export default defineComponent({ }, setup() { const route = useRoute(); - const { getItem } = useLocalStorage(); + const { getItemSession } = useLocalStorage(); const formStore = useFormStore(); const { availability: availabilityForm } = storeToRefs(formStore); - const availability = ref(getItem("availability")); + const availability = ref(getItemSession("availability")); const availabilityFormKeys = computed(() => { return Object.fromEntries( Object.entries(availabilityForm.value).filter( diff --git a/src/stores/cart.js b/src/stores/cart.js index ba45295..57e3563 100644 --- a/src/stores/cart.js +++ b/src/stores/cart.js @@ -9,7 +9,7 @@ import { useFormStore } from "./forms"; export const useCartStore = defineStore("cart", () => { const { push } = useRouter(); - const { addItem, getItem } = useLocalStorage(); + const { addItem, getItem, getItemSession } = useLocalStorage(); const formStore = useFormStore(); const { availability: availabilityForm } = storeToRefs(formStore); @@ -36,7 +36,7 @@ export const useCartStore = defineStore("cart", () => { //! Variables const cart = ref(getItem("cart")); - const availability = ref(getItem("availability")); + const availability = ref(getItemSession("availability")); const addCartLoadingBtn = ref(false); const routeId = ref(null);