fix langs
This commit is contained in:
@ -1,34 +1,16 @@
|
||||
import { usePB } from "~/composables/usePB";
|
||||
import type {
|
||||
Country,
|
||||
Currencies,
|
||||
Currency,
|
||||
FooterListResponse,
|
||||
FrontMenu,
|
||||
GenericResponse,
|
||||
GenericResponseItems,
|
||||
PBFooterItem,
|
||||
Language,
|
||||
UIFrontMenu,
|
||||
UIMenuItem,
|
||||
} from "~/types";
|
||||
import { useStore } from "./store";
|
||||
import { ref, watch } from "vue";
|
||||
import { useMyFetch } from "#imports";
|
||||
// import { useSession } from "~/plugins/01_i18n";
|
||||
|
||||
// function buildTreeRecursive(
|
||||
// data: (PBMenuItem | UIMenuItem)[],
|
||||
// parentId: string
|
||||
// ): UIMenuItem[] {
|
||||
// const children = data.filter(
|
||||
// (item): item is UIMenuItem =>
|
||||
// item.id_parent === parentId && !item.is_default
|
||||
// );
|
||||
|
||||
// return children.map((item) => ({
|
||||
// ...item,
|
||||
// children: buildTreeRecursive(data, item.id),
|
||||
// }));
|
||||
// }
|
||||
|
||||
function buildTreeRecursive(
|
||||
data: (FrontMenu | UIFrontMenu)[],
|
||||
@ -46,9 +28,10 @@ function buildTreeRecursive(
|
||||
}
|
||||
|
||||
export const useMenuStore = defineStore("menuStore", () => {
|
||||
const pb = usePB();
|
||||
const store = useStore();
|
||||
const { $i18n } = useNuxtApp();
|
||||
// const session = useSession();
|
||||
const { $session } = useNuxtApp();
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
|
||||
@ -56,29 +39,43 @@ export const useMenuStore = defineStore("menuStore", () => {
|
||||
const openDropDown = ref(false);
|
||||
|
||||
const defaultMenu = ref();
|
||||
// const menu = ref<UIMenuItem[]>([]);
|
||||
// const menuItems = ref<MenuListResponse>();
|
||||
|
||||
const menu = ref<UIFrontMenu[]>([]);
|
||||
const menuItems = ref<FrontMenu[]>();
|
||||
|
||||
const footerItems = ref<FooterListResponse>();
|
||||
const countryList = ref<Country[]>();
|
||||
const currencies = ref<Currency[]>();
|
||||
const menu = ref([] as UIFrontMenu[]);
|
||||
const menuItems = ref([] as FrontMenu[]);
|
||||
|
||||
|
||||
// curr/country
|
||||
const selectedCountry = ref();
|
||||
const selectedPhoneCountry = ref();
|
||||
const selectedCurrency = ref<Currencies>();
|
||||
const selectedCountry = ref({} as Country);
|
||||
const selectedPhoneCountry = ref({} as Country);
|
||||
const selectedCurrency = ref({} as Currency);
|
||||
const selectedLanguage = ref({} as Language);
|
||||
|
||||
|
||||
const countries = ref([] as Country[]);
|
||||
const currencies = ref([] as Currency[]);
|
||||
const languages = ref([] as Language[]);
|
||||
|
||||
|
||||
const getLocales = async () => {
|
||||
const { data: countrriesList } = await useMyFetch<GenericResponse<Country[]>>(`/api/public/country/list`);
|
||||
countries.value = countrriesList;
|
||||
selectedCountry.value = countrriesList.find((country) => country.iso_code === $session.currentCountryIso.value) as Country;
|
||||
selectedPhoneCountry.value = countrriesList.find((country) => country.iso_code === $session.currentCountryIso.value) as Country;
|
||||
|
||||
|
||||
const { data: currenciesList } = await useMyFetch<GenericResponseItems<Currency[]>>(`/api/public/currencies`)
|
||||
currencies.value = currenciesList.items;
|
||||
selectedCurrency.value = currenciesList.items.find((currency) => currency.iso_code === $session.currentCurrencyIso.value) as Currency;
|
||||
|
||||
const { data: languagesList } = await useMyFetch<GenericResponseItems<Language[]>>(`/api/public/languages`)
|
||||
languages.value = languagesList.items;
|
||||
selectedLanguage.value = languagesList.items.find((language) => language.iso_code === $session.currentLanguageIso.value) as Language;
|
||||
};
|
||||
|
||||
|
||||
const loadMenu = async () => {
|
||||
try {
|
||||
// menuItems.value = (await pb
|
||||
// .collection("menu_view")
|
||||
// .getList<PBMenuItem>(1, 50, {
|
||||
// filter: `id_lang="${$i18n.locale.value}"&&active=true`,
|
||||
// sort: "position_id",
|
||||
// })) as MenuListResponse;
|
||||
|
||||
const { data } = await useMyFetch<GenericResponse<FrontMenu[]>>(
|
||||
`/api/public/front/menu`,
|
||||
@ -86,10 +83,6 @@ export const useMenuStore = defineStore("menuStore", () => {
|
||||
onErrorOccured: (err, status) => {
|
||||
console.log(err, status);
|
||||
},
|
||||
// onSuccess(data) {
|
||||
// console.log(data.data, "data");
|
||||
|
||||
// },
|
||||
}
|
||||
);
|
||||
|
||||
@ -97,7 +90,6 @@ export const useMenuStore = defineStore("menuStore", () => {
|
||||
|
||||
const root = data.find((item) => item.is_root) as UIFrontMenu;
|
||||
defaultMenu.value = data.find((item) => item.is_default);
|
||||
// console.log(menuNew, "data");
|
||||
if (root) {
|
||||
menu.value = buildTreeRecursive(data, root.id);
|
||||
} else {
|
||||
@ -105,70 +97,11 @@ export const useMenuStore = defineStore("menuStore", () => {
|
||||
menu.value = [];
|
||||
}
|
||||
|
||||
// const root = menuItems.value.items.find((item) => item.is_root);
|
||||
// defaultMenu.value = menuItems.value.items.find((item) => item.is_default);
|
||||
|
||||
// if (root) {
|
||||
// menu.value = buildTreeRecursive(menuItems.value.items, root.id);
|
||||
// store.currentPageID = menu.value[0]?.id_page || "";
|
||||
// } else {
|
||||
// console.warn("Root menu item not found");
|
||||
// menu.value = [];
|
||||
// }
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
};
|
||||
|
||||
const getCountryList = async () => {
|
||||
try {
|
||||
const { data } = await useMyFetch<GenericResponse<Country[]>>(
|
||||
`/api/public/country/list`,
|
||||
{
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
}
|
||||
);
|
||||
|
||||
// if (!res.ok) {
|
||||
// throw new Error(`HTTP error: ${res.status}`);
|
||||
// }
|
||||
|
||||
// const data = await res.json();
|
||||
countryList.value = data;
|
||||
if (countryList.value) selectedPhoneCountry.value = countryList.value[0];
|
||||
} catch (error) {
|
||||
console.error("getList error:", error);
|
||||
}
|
||||
};
|
||||
|
||||
const getCurrencies = async () => {
|
||||
try {
|
||||
const { data } = await useMyFetch<GenericResponseItems<Currency[]>>(
|
||||
`/api/public/currencies`,
|
||||
{
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
onErrorOccured: (_, status) => {
|
||||
throw new Error(`HTTP error: ${status}`);
|
||||
},
|
||||
}
|
||||
);
|
||||
|
||||
// if (!res.ok) {
|
||||
// throw new Error(`HTTP error: ${res.status}`);
|
||||
// }
|
||||
|
||||
// const data = await res.json();
|
||||
currencies.value = data.items;
|
||||
|
||||
// console.log(data.items, "data");
|
||||
} catch (error) {
|
||||
console.error("getList error:", error);
|
||||
}
|
||||
};
|
||||
|
||||
const navigateToItem = (item?: UIFrontMenu) => {
|
||||
if (item) {
|
||||
@ -189,115 +122,108 @@ export const useMenuStore = defineStore("menuStore", () => {
|
||||
};
|
||||
|
||||
function navigateToShop() {
|
||||
console.log(menuItems.value);
|
||||
|
||||
navigateToItem(menuItems.value?.find((item) => item.id === 5));
|
||||
}
|
||||
|
||||
// function redirectToPage(link_rewrite: string) {
|
||||
// const page = menuItems.value?.items.find(
|
||||
// (item) => item.link_rewrite === link_rewrite
|
||||
// );
|
||||
|
||||
// if (!page?.id_page || !page?.link_rewrite) {
|
||||
// console.warn(`Page not found or missing data for name: ${link_rewrite}`);
|
||||
// return;
|
||||
// }
|
||||
|
||||
// router.push({
|
||||
// params: {
|
||||
// id: page?.id_page,
|
||||
// slug: page?.link_rewrite,
|
||||
// },
|
||||
// });
|
||||
// }
|
||||
|
||||
const getFirstImage = () => {
|
||||
const getFirstImage = (size: "l" | "m" | "s" = "m", needbaseurl: boolean) => {
|
||||
const req = useRequestEvent();
|
||||
const url = useRequestURL();
|
||||
let img = "";
|
||||
// let img = "";
|
||||
const img: string[] = []
|
||||
for (const s in store.components) {
|
||||
store.components[s].section_img.map((item) => {
|
||||
img = `${req?.headers.get("x-forwarded-proto") || url.protocol}://${
|
||||
req?.headers.get("x-forwarded-host") || req?.headers.get("host")
|
||||
}/api/files/${store.components[s].image_collection}/${
|
||||
store.components[s].section_id
|
||||
}/${item}?thumb=400x0`;
|
||||
});
|
||||
if (img.length > 0) return img;
|
||||
if (store.components[s].front_section.img.length === 0) continue;
|
||||
img.push(`/api/public/file/${store.components[s].front_section.img[0]}_${size}.webp`)
|
||||
if (img.length > 0) break;;
|
||||
}
|
||||
if (img.length > 0) {
|
||||
if (needbaseurl) {
|
||||
return `${req?.headers.get("x-forwarded-proto") || url.protocol}://${req?.headers.get("x-forwarded-host") || url.host || req?.headers.get("host")}${img[0]}`;
|
||||
}
|
||||
return img[0];
|
||||
}
|
||||
return "";
|
||||
};
|
||||
|
||||
const headMeta = computed(() => {
|
||||
const item = menuItems.value?.items.find(
|
||||
(item) => item.id_page === route.params.id
|
||||
const item = menuItems.value?.find(
|
||||
(item) => item.id.toString() === route.params.id
|
||||
);
|
||||
return {
|
||||
title: item?.meta_title,
|
||||
|
||||
const meta = {
|
||||
title: item?.front_menu_lang[0].meta_title,
|
||||
htmlAttrs: {
|
||||
lang: $i18n.locale.value,
|
||||
},
|
||||
link: [{ rel: "manifest", href: "/api/manifest.json" }],
|
||||
link: [
|
||||
// { rel: "manifest", href: "/api/manifest.json" }
|
||||
],
|
||||
meta: [
|
||||
{
|
||||
hid: "description",
|
||||
name: "description",
|
||||
content: item?.meta_description,
|
||||
content: item?.front_menu_lang[0].meta_description,
|
||||
},
|
||||
{
|
||||
property: "og:title",
|
||||
content: item?.meta_title,
|
||||
content: item?.front_menu_lang[0].meta_title,
|
||||
},
|
||||
{
|
||||
property: "og:description",
|
||||
content: item?.meta_description,
|
||||
content: item?.front_menu_lang[0].meta_description,
|
||||
},
|
||||
{
|
||||
property: "og:image",
|
||||
content: getFirstImage(),
|
||||
content: getFirstImage("m", true),
|
||||
},
|
||||
{
|
||||
property: "twitter:title",
|
||||
content: item?.meta_title,
|
||||
content: item?.front_menu_lang[0].meta_title,
|
||||
},
|
||||
{
|
||||
property: "twitter:description",
|
||||
content: item?.meta_description,
|
||||
content: item?.front_menu_lang[0].meta_description,
|
||||
},
|
||||
{
|
||||
property: "twitter:image",
|
||||
content: getFirstImage(),
|
||||
content: getFirstImage("m", true),
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
const preload = getFirstImage("l", false);
|
||||
if (preload) {
|
||||
meta.link.push({ rel: "preload", as: "image", href: preload } as never);
|
||||
}
|
||||
|
||||
return meta;
|
||||
|
||||
});
|
||||
|
||||
watch($i18n.locale, async () => {
|
||||
// watches
|
||||
watch(() => $session.cookieData, async () => {
|
||||
await getLocales();
|
||||
await loadMenu();
|
||||
});
|
||||
await store.getMinValue();
|
||||
await store.getCalculator();
|
||||
}, { deep: true });
|
||||
|
||||
watch(selectedCurrency, () => {
|
||||
store.getCalculator();
|
||||
});
|
||||
return {
|
||||
menu,
|
||||
menuItems,
|
||||
footerItems,
|
||||
openMenu,
|
||||
openDropDown,
|
||||
countryList,
|
||||
currencies,
|
||||
languages,
|
||||
countries,
|
||||
selectedCountry,
|
||||
selectedCurrency,
|
||||
selectedPhoneCountry,
|
||||
selectedLanguage,
|
||||
defaultMenu,
|
||||
headMeta,
|
||||
navigateToShop,
|
||||
loadMenu,
|
||||
getCountryList,
|
||||
navigateToItem,
|
||||
// redirectToPage,
|
||||
getCurrencies,
|
||||
getLocales,
|
||||
};
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user