From 9d7fd3d52ace0222f5f8f8c21217e4052d500cc8 Mon Sep 17 00:00:00 2001 From: Marek Goc Date: Wed, 25 Jun 2025 15:55:50 +0200 Subject: [PATCH] fix langs --- plugins/i18n.ts | 124 +++++++++++++++++++++++++++--- {stores => types}/frontSection.ts | 0 types/index.ts | 114 ++++----------------------- 3 files changed, 132 insertions(+), 106 deletions(-) rename {stores => types}/frontSection.ts (100%) diff --git a/plugins/i18n.ts b/plugins/i18n.ts index 900d767..d37831b 100644 --- a/plugins/i18n.ts +++ b/plugins/i18n.ts @@ -1,22 +1,119 @@ import type { VueI18n } from "vue-i18n"; -import { usePB } from "~/composables/usePB"; -import type { GenericResponse } from "~/types"; +import type { RouteLocation, Router } from "vue-router"; +import type { CookieData, GenericResponse } from "~/types"; + + +// Extend the NuxtApp type +declare module '#app' { + interface NuxtApp { + $session: Session; + } +} + +declare module 'vue' { + interface ComponentCustomProperties { + $session: Session; + } +} + + + +export class Session { + + cookieData = reactive({} as CookieData); + urlParams = new URLSearchParams() + currentLanguageIso = ref("" as string ) + currentCountryIso = ref("" as string ) + currentCurrencyIso = ref("" as string ) + + route = {} as RouteLocation + router = {} as Router + + i18n = {} as VueI18n + + constructor(i18n: VueI18n, router: Router) { + this.route = router.currentRoute.value + this.router = router + this.i18n = i18n + + + this.setLanguage(this.route.query?.lang_iso ? this.route.query?.lang_iso as string : unref(i18n.locale)) + this.setCountry(this.route.query?.country_iso ? this.route.query?.country_iso as string : "") + this.setCurrency(this.route.query?.currency_iso ? this.route.query?.currency_iso as string : "") + } + + + async loadSession() { + this.setQueryParams() + const { data } = await useMyFetch>(`/api/public/cookie?${this.urlParams.toString()}`, { + headers: { + "Content-Type": "application/json", + }, + onErrorOccured: (_, status) => { + throw new Error(`HTTP error: ${status}`); + }, + }); + this.cookieData = data; + this.currentCountryIso.value = this.cookieData.country.iso_code + this.currentLanguageIso.value = this.cookieData.language.iso_code + this.currentCurrencyIso.value = this.cookieData.currency.iso_code + } + + setLanguage(iso: string) { + this.currentLanguageIso.value = iso + } + + setCurrency(iso: string) { + this.currentCurrencyIso.value = iso + } + + setCountry(iso: string) { + this.currentCountryIso.value = iso + } + + setQueryParams() { + if (this.currentLanguageIso.value.length > 0) { + this.urlParams.set("lang_iso", this.currentLanguageIso.value) + } else { + this.urlParams.delete("lang_iso") + } + + if (this.currentCountryIso.value.length > 0) { + this.urlParams.set("country_iso", this.currentCountryIso.value) + } else { + this.urlParams.delete("country_iso") + } + + if (this.currentCurrencyIso.value.length > 0) { + this.urlParams.set("currency_iso", this.currentCurrencyIso.value) + } else { + this.urlParams.delete("currency_iso") + } + } + +} + + + +let session = {} as Session; + +export const useSession = () => session; export default defineNuxtPlugin(async (nuxtApp) => { const loaded = [] as Array; - const i18n = nuxtApp.$i18n as VueI18n; - const pb = usePB(); + const { $i18n: i18n } = nuxtApp as unknown as { $i18n: VueI18n }; + const { $router: router } = nuxtApp as unknown as { $router: Router }; i18n.onBeforeLanguageSwitch = async (oldLocale, newLocale) => { + if (import.meta.browser) { + session.setLanguage(newLocale) + await session.loadSession() + } + if (loaded.includes(newLocale)) return; try { - // const translation = await pb.collection("translation").getList(1, 1, { - // expand: "id_lang", - // filter: `id_lang.iso='${newLocale}'`, - // }); - const { data } = await useMyFetch>( "/api/public/front/translation" ); @@ -29,4 +126,13 @@ export default defineNuxtPlugin(async (nuxtApp) => { throw err; } }; + + + + + session = new Session(i18n, router) + + await session.loadSession(); + nuxtApp.vueApp.provide("session", session); + }); diff --git a/stores/frontSection.ts b/types/frontSection.ts similarity index 100% rename from stores/frontSection.ts rename to types/frontSection.ts diff --git a/types/index.ts b/types/index.ts index 9312c53..9733c50 100644 --- a/types/index.ts +++ b/types/index.ts @@ -1,110 +1,14 @@ import type { DefineComponent } from "vue"; +import type { FrontSection } from "~/types/frontSection"; -export interface ListResponse { - page: number; - perPage: number; - totalItems: number; - totalPages: number; -} -export interface PBMenuItem { - page: number; - page_name: string; - perPage: number; - totalItems: number; - totalPages: number; - is_root: boolean; - is_default: boolean; - id_page: string; - id: string; - id_parent: string; - url: string; - name: string; - link_rewrite: string; - active: boolean; - collectionId: string; - collectionName: string; - created: string; - link_title: string; - meta_description: string; - meta_title: string; - position_id: number; - updated: string; -} - -export interface PBFooterItem { - id: string; - id_lang: string; - address: string; - phone: string; - email: string; - contact_info: Array<{ - field: keyof PBFooterItem; - title: string; - }>; - data: Array<{ - title: string; - items: Array; - }>; - company_info: Array<{ - data: string; - title: string; - }>; -} - -// export interface PBPageItem { -// collectionId: string; -// collectionName: string; -// component_name: string; -// id: string; -// image_collection: string; -// page_created: string; -// page_id: string; -// page_name: string; -// page_section_id_position: number; -// page_updated: string; -// section_id: string; -// section_img: string[]; -// section_lang_created: string; -// section_lang_data: SectionLangData; -// section_lang_id_lang: string; -// section_name: string; -// } - -// export interface SectionLangData { -// title: string; -// description: string; -// button: string; -// button_call: string; -// } - -export interface UIMenuItem extends PBMenuItem { - children?: UIMenuItem[]; -} - -export interface MenuListResponse extends ListResponse { - items: PBMenuItem[]; -} - -export interface FooterListResponse extends ListResponse { - items: PBFooterItem[]; -} export type componentsListType = { name: string; component: FrontSection; componentInstance: DefineComponent; - // data: unknown; }; -// menuStore -// export type CountryList = { -// call_prefix: string; -// currency_iso_code: string; -// iso_code: string; -// name: string; -// } - export type Countries = { call_prefix: string; currency_iso_code: string; @@ -170,6 +74,7 @@ export interface Country { name: string; } + export interface Currency { iso_code: string; name: string; @@ -181,6 +86,21 @@ export interface Currency { suffix: boolean; } +export interface Language { + id: number + name: string + iso_code: string + lang_code: string + date_format: string + date_format_short: string + rtl: boolean + is_default: boolean + active: boolean +} + +export interface CookieData { country: Country, currency: Currency, language: Language } + + export interface CartItem { cart_item_id: number; link_rewrite: string;