diff --git a/components/CartPopup.vue b/components/CartPopup.vue index 9cc57ab..c3c05b1 100644 --- a/components/CartPopup.vue +++ b/components/CartPopup.vue @@ -2,9 +2,9 @@
-
- {{ checkoutStore.products.length }} + {{ checkoutStore.totalNumberOfProducts }}
diff --git a/components/HeaderBlock.vue b/components/HeaderBlock.vue index 3cb890b..c2b8ff9 100644 --- a/components/HeaderBlock.vue +++ b/components/HeaderBlock.vue @@ -23,7 +23,7 @@
+ @click="menuStore.navigateToItem(menuStore.menuItems?.find((item:any) => item.id === 11))">
{{ userStore.user }}
@@ -60,10 +60,7 @@
+ menuStore.navigateToItem(menuStore.menuItems?.find((item:any) => item.id === 11)) " />
{{ userStore.user }}
@@ -122,10 +119,7 @@
+ menuStore.navigateToItem(menuStore.menuItems?.find((item:any) => item.id === 11)) " />
{{ userStore.user }}
@@ -195,12 +189,7 @@
- +
diff --git a/components/section/FooterBlock.vue b/components/section/FooterBlock.vue index f5ce3a1..da816c1 100644 --- a/components/section/FooterBlock.vue +++ b/components/section/FooterBlock.vue @@ -12,7 +12,7 @@ {{ item }}
- {{ $t("Footer.Lei") }} + {{ $t("footer_lei") }}
diff --git a/components/section/InvestmentBlock.vue b/components/section/InvestmentBlock.vue new file mode 100644 index 0000000..4f57da0 --- /dev/null +++ b/components/section/InvestmentBlock.vue @@ -0,0 +1,248 @@ + + + diff --git a/components/section/InvestmentZone.vue b/components/section/InvestmentZone.vue index 8461bb6..0ec91a4 100644 --- a/components/section/InvestmentZone.vue +++ b/components/section/InvestmentZone.vue @@ -73,22 +73,11 @@

{{ $t("monthly_savings") }}

-

- {{ store.monthlySavings }} - {{ menuStore.selectedCurrency?.sign }} +

+ {{ formater.price(store.monthlySavings) }}

- +
@@ -99,14 +88,7 @@ {{ store.storagePeriod }}

- +
- {{ menuStore.selectedCurrency?.sign }} {{ store.totalInvestment }} + {{ formater.price(store.totalInvestment) }}
- - {{ - component.front_section_lang[0].data.button - }} - + + + {{ component.front_section_lang[0].data.button }} + +
@@ -168,9 +147,11 @@ defineProps<{ const store = useStore() const menuStore = useMenuStore() +const { $session } = useNuxtApp() const itemCount = ref(4) const productStore = useProductStore() +const formater = useFormater(useNuxtApp()) async function updateItemCount() { const width = window.innerWidth @@ -185,6 +166,10 @@ watch(itemCount, async () => { await productStore.getList(itemCount.value) }) +watch($session.cookieData, async () => { + await productStore.getList(itemCount.value) +}) + onMounted(async () => { await updateItemCount() window.addEventListener('resize', updateItemCount) diff --git a/components/section/MainProducts.vue b/components/section/MainProducts.vue index baa8ae0..0431b39 100644 --- a/components/section/MainProducts.vue +++ b/components/section/MainProducts.vue @@ -43,6 +43,7 @@ defineProps<{ const menuStore = useMenuStore() const itemCount = ref(4) const productStore = useProductStore() +const { $session } = useNuxtApp() async function updateItemCount() { const width = window.innerWidth @@ -57,6 +58,10 @@ watch(itemCount, async () => { await productStore.getList(itemCount.value) }) +watch($session.cookieData, async () => { + await productStore.getList(itemCount.value) +}) + onMounted(async () => { await updateItemCount() window.addEventListener('resize', updateItemCount) diff --git a/components/section/Product.vue b/components/section/Product.vue index 49f42db..da80c1c 100644 --- a/components/section/Product.vue +++ b/components/section/Product.vue @@ -29,7 +29,7 @@

- {{ product.formatted_price }} + {{ formater.price(product.price) }}

-
+
-
+
+ ">
@@ -115,7 +115,7 @@ .link_rewrite, }, query: { prod_id: item?.id, name: item?.link_rewrite }, - }"> + }" @click.stop.prevent="scrollToTop">
pics { -// alert('add to cart product: ' + p.name) -// } +function scrollToTop() { + productBlockRef.value?.scrollIntoView({ behavior: 'smooth' }) +} const formatPrice = (p: number) => { const formatdecimal = new Intl.NumberFormat( diff --git a/components/section/RegistrationMain.vue b/components/section/RegistrationMain.vue index 0c38e86..0e95906 100644 --- a/components/section/RegistrationMain.vue +++ b/components/section/RegistrationMain.vue @@ -94,12 +94,7 @@

- {{ - component.front_section_lang - && component.front_section_lang[0].data.account_types.find( - (item) => item.name === modelValue, - )?.name - }} + {{ component.front_section_lang.at(0).data.account_types.find((item: any) => item.name === modelValue)?.name }}

diff --git a/components/section/ShopMain.vue b/components/section/ShopMain.vue index fcfd168..1548fbb 100644 --- a/components/section/ShopMain.vue +++ b/components/section/ShopMain.vue @@ -350,10 +350,7 @@ async function loadMoreProducts() { qParams.append('p', `${page.value}`) qParams.append('elems', `${elems.value}`) - qParams.append( - 'features', - selectedFilters.value.length > 0 ? selectedFilters.value : null, - ) + qParams.append('features', selectedFilters.value.length > 0 ? `${selectedFilters.value}` : '') try { const { data } = await useMyFetch>( @@ -395,7 +392,7 @@ const changeCategory = (item: CategoryItem) => { categoryId.value = item.id } -watch(selectedFilters, async (newQuestion: string) => { +watch(selectedFilters, async (newQuestion) => { if (newQuestion) { page.value = 1 reachedEnd.value = false @@ -407,7 +404,7 @@ watch(selectedFilters, async (newQuestion: string) => { qParams.append('elems', `${elems.value}`) qParams.append( 'features', - selectedFilters.value.length > 0 ? selectedFilters.value : null, + selectedFilters.value.length > 0 ? `${selectedFilters.value}` : '', ) try { @@ -443,7 +440,7 @@ watch(categoryId, async (newCategoryId) => { qParams.append('elems', `${elems.value}`) qParams.append( 'features', - selectedFilters.value.length > 0 ? selectedFilters.value : null, + selectedFilters.value.length > 0 ? `${selectedFilters.value}` : '', ) try { diff --git a/composables/useFormater.ts b/composables/useFormater.ts new file mode 100644 index 0000000..577f28f --- /dev/null +++ b/composables/useFormater.ts @@ -0,0 +1,30 @@ +import type { NuxtApp } from '#app' + +export const useFormater = (nuxtApp: NuxtApp) => { + return new Formater(nuxtApp) +} + +class Formater { + private session + constructor(nuxtApp: NuxtApp) { + const { $session } = nuxtApp + this.session = $session + } + + price(p: number) { + const formatdecimal = new Intl.NumberFormat( + this.session.cookieData.value.country.iso_code, + { + style: 'decimal', + maximumFractionDigits: this.session.cookieData.value.currency.precision, + minimumFractionDigits: this.session.cookieData.value.currency.precision, + }, + ) + if (this.session.cookieData.value.currency.suffix) { + return this.session.cookieData.value.currency.sign + ' ' + formatdecimal.format(p) + } + else { + return formatdecimal.format(p) + ' ' + this.session.cookieData.value.currency.sign + } + } +} diff --git a/pages/[id]/[slug].vue b/pages/[id]/[slug].vue index b812df5..26899b1 100644 --- a/pages/[id]/[slug].vue +++ b/pages/[id]/[slug].vue @@ -15,10 +15,6 @@ import ScrollTrigger from 'gsap/ScrollTrigger' gsap.registerPlugin(ScrollTrigger) -watch(useColorMode(), (color) => { - console.log(color) -}) - onMounted(() => { const anim = gsap.fromTo( 'h1', diff --git a/plugins/02_initLoad.ts b/plugins/02_initLoad.ts index 90d320a..17848bf 100644 --- a/plugins/02_initLoad.ts +++ b/plugins/02_initLoad.ts @@ -5,6 +5,8 @@ export default defineNuxtPlugin(async () => { await menuStore.loadMenu() await menuStore.getLocales() const store = useStore() - await store.getMinValue() + await store.getMinMaxRange() await store.getCalculator() + const userStore = useUserStore() + await userStore.checkIsLogged() }) diff --git a/stores/checkoutStore.ts b/stores/checkoutStore.ts index 09dcc7f..44d32b2 100644 --- a/stores/checkoutStore.ts +++ b/stores/checkoutStore.ts @@ -21,6 +21,7 @@ export const useCheckoutStore = defineStore('checkoutStore', () => { const vNote = ref('') const legalValidation = ref(false) const termsValidation = ref(false) + const totalNumberOfProducts = ref(0) // get address list const addressesList = ref() @@ -265,6 +266,13 @@ export const useCheckoutStore = defineStore('checkoutStore', () => { }, ) + totalNumberOfProducts.value = 0 + if (data.cart_items && Array.isArray(data.cart_items)) { + for (const item of data.cart_items) { + totalNumberOfProducts.value = totalNumberOfProducts.value + item.quantity + } + } + products.value = data.cart_items fullPrice.value = data.total_value fullProductsPrice.value = data.total_value @@ -551,6 +559,7 @@ export const useCheckoutStore = defineStore('checkoutStore', () => { paymentMethods, currentPayment, fullAddress, + totalNumberOfProducts, vLegal, vTerms, diff --git a/stores/investmentStore.ts b/stores/investmentStore.ts new file mode 100644 index 0000000..4e5b960 --- /dev/null +++ b/stores/investmentStore.ts @@ -0,0 +1,49 @@ +// import { useMyFetch } from '#imports' + +import type { CalculatorOutput, GenericResponse } from '~/types' + +export const useInvestmentStore = defineStore('investmentStore', () => { + const store = useStore() + // const monthlySavings = ref(store.monthlySavings || 100) + // const yearsNumber = ref(store.storagePeriod || 10) + + const calculationResult = ref({} as CalculatorOutput) + + const minYear = 1 + const maxYear = 20 + + const { $session: session } = useNuxtApp() + watch(session.cookieData, async () => { + await getCalculator() + }, { deep: true }) + + const getCalculator = async () => { + const query = new URLSearchParams({ + monthly_deposit: String(store.monthlySavings), + years: String(store.storagePeriod), + format: 'svg', + grid: 'false', + legend: 'false', + title: 'false', + ingots_bought_dots: 'true', + draw_linear: 'true', + annotations: 'false', + show_real_value: 'false', + series_stroke_width: '1', + // colors: '#004f3d,#004f3d,#004f3d,#004f3d,#000', + colors: '#9a7f62,#9a7f62,#9a7f62,#9a7f62,#000', + }) + + const { data } = await useMyFetch>(`/api/public/plan-prediction/easy/chart?${query.toString()}`) + calculationResult.value = data + } + + return { + // monthlySavings, + // yearsNumber, + minYear, + maxYear, + calculationResult, + getCalculator, + } +}) diff --git a/stores/menuStore.ts b/stores/menuStore.ts index bbe9ccd..72eb6a0 100644 --- a/stores/menuStore.ts +++ b/stores/menuStore.ts @@ -171,6 +171,10 @@ export const useMenuStore = defineStore('menuStore', () => { return menuItems.value?.find(item => item.id === 15) } + function getInvestmentCalculatorMenu() { + return menuItems.value?.find(item => item.id === 16) + } + const getFirstImage = (size: 'l' | 'm' | 's' = 'm', needbaseurl: boolean) => { const req = useRequestEvent() const url = useRequestURL() @@ -273,7 +277,7 @@ export const useMenuStore = defineStore('menuStore', () => { async () => { await getLocales() await loadMenu() - await store.getMinValue() + await store.getMinMaxRange() await store.getCalculator() }, { deep: true }, @@ -309,5 +313,6 @@ export const useMenuStore = defineStore('menuStore', () => { getContactMenu, getShopMenu, getRegistrationMenu, + getInvestmentCalculatorMenu, } }) diff --git a/stores/store.ts b/stores/store.ts index e16067b..6a58518 100644 --- a/stores/store.ts +++ b/stores/store.ts @@ -5,6 +5,7 @@ import type { PlanPrediction, } from '~/types' import type { FrontPageSection } from '~/types/frontSection' +import type { MinMaxRange } from '~/types/planPrediction' export const useStore = defineStore('store', () => { const currentPageID = ref('') @@ -13,7 +14,7 @@ export const useStore = defineStore('store', () => { const monthlySavings = ref(137) const storagePeriod = ref(10) const totalInvestment: Ref = ref(0) - const minValue = ref() + const minMaxRange = ref({} as MinMaxRange) const components = ref({} as FrontPageSection[]) @@ -84,10 +85,10 @@ export const useStore = defineStore('store', () => { } } - async function getMinValue() { + async function getMinMaxRange() { try { - const { data } = await useMyFetch>( - '/api/public/plan-prediction/free/minimum', + const { data } = await useMyFetch>( + '/api/public/front/minmaxinvestment', { headers: { 'Content-Type': 'application/json', @@ -98,23 +99,32 @@ export const useStore = defineStore('store', () => { }, ) - minValue.value = data + minMaxRange.value = data } catch (error) { console.error('getList error:', error) } } + const getMinAmount = computed(() => { + return Math.ceil(minMaxRange.value.min) + }) + const getMaxAmount = computed(() => { + return Math.ceil(minMaxRange.value.max) + }) + return { currentPageID, components, totalInvestment, monthlySavings, storagePeriod, - minValue, + minMaxRange, getCalculator, getComponents, getSections, - getMinValue, + getMinMaxRange, + getMinAmount, + getMaxAmount, } }) diff --git a/types/index.ts b/types/index.ts index beae437..02eb0f6 100644 --- a/types/index.ts +++ b/types/index.ts @@ -112,11 +112,6 @@ export interface GenericResponseChildren { status: number } -export type { - InvestmentPiece, - PlanPrediction, - PeriodToFirstPiece, -} from './planPrediction' export type { Product, ProductItem, @@ -128,3 +123,4 @@ export type { } from './product' export type { FrontMenu, FrontMenuLang, UIFrontMenu } from './frontMenu' export type { Contact, Footer, FooterDoc, FooterPdf } from './footer' +export type { CalculatorOutput, PlanPrediction, FeatureCalculator, InvestmentPiece, PeriodToFirstPiece } from './planPrediction' diff --git a/types/planPrediction.ts b/types/planPrediction.ts index 4f7d31f..969eb17 100644 --- a/types/planPrediction.ts +++ b/types/planPrediction.ts @@ -1,3 +1,8 @@ +export interface CalculatorOutput { + calculator_output: PlanPrediction + chart: string +} + export interface PlanPrediction { total_investement_value: number total_input_price_increase: number @@ -23,10 +28,10 @@ export interface InvestmentPiece { currency_conversion_rate: string max_comission_value: number average_input_price_increase: number - features: Feature[] + features: FeatureCalculator[] } -export interface Feature { +export interface FeatureCalculator { feature_id: number feature: string value_id: number @@ -38,3 +43,8 @@ export interface PeriodToFirstPiece { months: number days: number } + +export interface MinMaxRange { + min: number + max: number +}