This commit is contained in:
2025-06-25 12:43:42 +02:00
parent 98a4125804
commit 9407253e69
26 changed files with 874 additions and 755 deletions

22
stores/frontSection.ts Normal file
View File

@ -0,0 +1,22 @@
export interface FrontPageSection {
id_front_page: number
id_position: number
id_section: number
front_section: FrontSection
}
export interface FrontSection {
id: number
name: string
img: string[]
component_name: string
is_no_lang: boolean
page_name: string
front_section_lang: FrontSectionLang[]
}
export interface FrontSectionLang {
data: unknown
id_front_section: number
id_lang: number
}

View File

@ -4,32 +4,39 @@ import type {
Currencies,
Currency,
FooterListResponse,
FrontMenu,
GenericResponse,
GenericResponseItems,
MenuListResponse,
PBFooterItem,
PBMenuItem,
UIFrontMenu,
UIMenuItem,
} from "~/types";
import { useStore } from "./store";
import { ref, watch } from "vue";
import { useMyFetch } from "#imports";
function buildTreeRecursive(
data: (PBMenuItem | UIMenuItem)[],
parentId: string
): UIMenuItem[] {
const children = data.filter(
(item): item is UIMenuItem =>
item.id_parent === parentId && !item.is_default
);
// 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),
}));
// return children.map((item) => ({
// ...item,
// children: buildTreeRecursive(data, item.id),
// }));
// }
function buildTreeRecursive(data: (FrontMenu | UIFrontMenu)[], parentId: number): UIFrontMenu[] {
const children = data.filter((item): item is UIFrontMenu => item.id_parent === parentId && !item.is_default);
return children.map((item) => ({ ...item, children: buildTreeRecursive(data, item.id) }));
}
export const useMenuStore = defineStore("menuStore", () => {
const pb = usePB();
const store = useStore();
@ -41,8 +48,11 @@ export const useMenuStore = defineStore("menuStore", () => {
const openDropDown = ref(false);
const defaultMenu = ref();
const menu = ref<UIMenuItem[]>([]);
const menuItems = ref<MenuListResponse>();
// const menu = ref<UIMenuItem[]>([]);
// const menuItems = ref<MenuListResponse>();
const menu = ref<UIFrontMenu[]>([]);
const menuItems = ref<FrontMenu[]>();
const footerItems = ref<FooterListResponse>();
const countryList = ref<Country[]>();
@ -55,23 +65,44 @@ export const useMenuStore = defineStore("menuStore", () => {
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;
// 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 root = menuItems.value.items.find((item) => item.is_root);
defaultMenu.value = menuItems.value.items.find((item) => item.is_default);
const { data } = await useMyFetch<GenericResponse<FrontMenu[]>>(`/api/public/front/menu`, {
onErrorOccured: (err, status) => {
console.log(err, status);
},
// onSuccess(data) {
// console.log(data.data, "data");
// },
})
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(menuItems.value.items, root.id);
store.currentPageID = menu.value[0]?.id_page || "";
menu.value = buildTreeRecursive(data, root.id);
} else {
console.warn("Root menu item not found");
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);
}
@ -91,7 +122,7 @@ export const useMenuStore = defineStore("menuStore", () => {
const getCountryList = async () => {
try {
const {data} = await useMyFetch<GenericResponse<Country[]>>(
const { data } = await useMyFetch<GenericResponse<Country[]>>(
`/api/public/country/list`,
{
headers: {
@ -116,7 +147,7 @@ export const useMenuStore = defineStore("menuStore", () => {
const getCurrencies = async () => {
try {
const {data} = await useMyFetch<GenericResponseItems<Currency[]>>(
const { data } = await useMyFetch<GenericResponseItems<Currency[]>>(
`/api/public/currencies`,
{
headers: {
@ -134,16 +165,16 @@ export const useMenuStore = defineStore("menuStore", () => {
currencies.value = data.items
// console.log(data.items, "data");
} catch (error) {
console.error("getList error:", error);
}
}
const navigateToItem = (item?: UIMenuItem) => {
const navigateToItem = (item?: UIFrontMenu) => {
if (item) {
router.push({
params: { slug: item.link_rewrite, id: item.id_page },
params: { slug: item.front_menu_lang[0].link_rewrite, id: item.id },
name: `id-slug___${$i18n.locale.value}`,
});
openDropDown.value = false;

View File

@ -1,17 +1,16 @@
import { useMyFetch } from "#imports";
import { usePB } from "~/composables/usePB";
// import { usePB } from "~/composables/usePB";
import type {
componentsListType,
GenericResponse,
PBPageItem,
PlanPrediction,
} from "~/types";
// import { useI18n } from "vue-i18n";
export const useStore = defineStore("store", () => {
const currentPageID = ref("");
const pb = usePB();
const { $i18n } = useNuxtApp();
// const pb = usePB();
// const { $i18n } = useNuxtApp();
// calculator
const monthlySavings = ref(137);
@ -23,17 +22,41 @@ export const useStore = defineStore("store", () => {
const email = ref();
const password = ref();
const components = ref({} as PBPageItem[]);
const components = ref({} as FrontPageSection[]);
// const getSections = async (id: string) => {
// pb.cancelRequest("menu_view");
// components.value = (
// await pb.collection<PBPageItem>("page_view").getList(1, 50, {
// filter: `id="${id}"&&(section_lang_id_lang="${
// $i18n.locale.value
// }"||section_is_no_lang=${true})`,
// sort: "page_section_id_position",
// })
// ).items as PBPageItem[];
// };
const getSections = async (id: string) => {
pb.cancelRequest("menu_view");
components.value = (
await pb.collection<PBPageItem>("page_view").getList(1, 50, {
filter: `id="${id}"&&(section_lang_id_lang="${
$i18n.locale.value
}"||section_is_no_lang=${true})`,
sort: "page_section_id_position",
})
).items as PBPageItem[];
// if(!id){
// id = useMenuStore().defaultMenu.id
// }
// console.log(useMenuStore().defaultMenu);
const {data} = await useMyFetch<GenericResponse<FrontPageSection[]>>(
`/api/public/front/sections/${id}`
)
// console.log(data, id, "data");
components.value = data
// return data
// pb.cancelRequest("menu_view");
// components.value = (
// await pb.collection<PBPageItem>("page_view").getList(1, 50, {
// filter: `id="${id}"&&(section_lang_id_lang="${
// $i18n.locale.value
// }"||section_is_no_lang=${true})`,
// sort: "page_section_id_position",
// })
// ).items as PBPageItem[];
};
async function getComponents(): Promise<componentsListType[]> {
@ -48,8 +71,8 @@ export const useStore = defineStore("store", () => {
const componentsList = [] as componentsListType[];
for (const child of children) {
const componentName = child.component_name;
const pageName = child.page_name;
const componentName = child.front_section.component_name;
// const pageName = child.front_section.page_name;
if (!componentName) continue;
try {
@ -58,12 +81,12 @@ export const useStore = defineStore("store", () => {
).default;
const nonReactiveComponent = markRaw(componentInstance);
componentsList.push({
name: componentName,
component: child,
component: child.front_section,
componentInstance: nonReactiveComponent,
data: child.section_lang_data,
// data: child.front_section.front_section_lang[0].data || {} as unknown,
// data: {}
});
} catch (error) {
console.error(`Failed to load component ${componentName}`, error);