bx-935-calc #1
|
@ -4,7 +4,7 @@ const apiBase = config.public.apiBase
|
||||||
import k_logo from '@/assets/icons/logo.svg'
|
import k_logo from '@/assets/icons/logo.svg'
|
||||||
|
|
||||||
const { data: footerData } = await useFetch<ApiFooterType[]>(`${apiBase}/footer/?ordering=small_text`)
|
const { data: footerData } = await useFetch<ApiFooterType[]>(`${apiBase}/footer/?ordering=small_text`)
|
||||||
const { data: social_networkData } = await useFetch<ApiSocial_networkType[]>(`${apiBase}/social_network/`)
|
const { data: social_networkData } = await useFetch<ApiSocial_networkType[]>(`${apiBase}/social_network/`)
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<div class="footer" id="contacts">
|
<div class="footer" id="contacts">
|
||||||
|
|
|
@ -4,7 +4,7 @@ import type { ralTypes } from '@/components/ral'
|
||||||
|
|
||||||
const config = useRuntimeConfig()
|
const config = useRuntimeConfig()
|
||||||
const apiBase = config.public.apiBase
|
const apiBase = config.public.apiBase
|
||||||
const { data: calculatorData } = await useFetch(`${apiBase}/calculator/5/`)
|
const { data: calculatorData } = await useFetch<ApiCalcType>(`${apiBase}/calculator/5/`)
|
||||||
|
|
||||||
const isModalOpen = useState('modal_open', () => false)
|
const isModalOpen = useState('modal_open', () => false)
|
||||||
|
|
||||||
|
@ -95,25 +95,20 @@ const total_colors = computed(() => {
|
||||||
]
|
]
|
||||||
})
|
})
|
||||||
const total_txt = computed(() => {
|
const total_txt = computed(() => {
|
||||||
let { mortgage, pillar, lamella, rivets, bar, guide } = calculatorData.value
|
if (!calculatorData.value) return
|
||||||
mortgage = parseFloat(mortgage)
|
const pillar = parseFloat(calculatorData.value.pillar)
|
||||||
pillar = parseFloat(pillar)
|
const pillar_base = parseFloat(calculatorData.value.pillar_base)
|
||||||
lamella = parseFloat(lamella)
|
const lamelles_block = parseFloat(calculatorData.value.lamelles_block)
|
||||||
rivets = parseFloat(rivets)
|
|
||||||
bar = parseFloat(bar)
|
|
||||||
guide = parseFloat(guide)
|
|
||||||
const sections = section_count.value as number
|
const sections = section_count.value as number
|
||||||
const extra_m = extra_section.value as number * 0.001
|
const extra_m = extra_section.value as number * 0.001
|
||||||
const length_m = fence_section.value as number
|
const length_m = fence_section.value as number
|
||||||
const lam_count = lamelles_count.value as number
|
const lam_count = lamelles_count.value as number
|
||||||
|
|
||||||
const prices = {
|
const prices = {
|
||||||
pillar: mortgage + pillar,
|
pillar_length: pillar,
|
||||||
lamella: rivets * 2 + lamella * length_m,
|
pillar: (pillar * lam_count * 0.115) + pillar_base,
|
||||||
lamella_extra: rivets * 2 + lamella * extra_m,
|
lam_quad: lamelles_block * lam_count * 0.115,
|
||||||
guide: guide * lam_count * 0.115,
|
|
||||||
top: bar * length_m,
|
|
||||||
top_extra: bar * extra_m
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const extra = {
|
const extra = {
|
||||||
|
@ -122,16 +117,8 @@ const total_txt = computed(() => {
|
||||||
value: prices.pillar * 1
|
value: prices.pillar * 1
|
||||||
},
|
},
|
||||||
lamella: {
|
lamella: {
|
||||||
txt: `Дополнительная секция, ламели, ${lam_count} шт`,
|
txt: `Блок ламелей с направляющей, 1 шт`,
|
||||||
value: prices.lamella_extra * lam_count
|
value: prices.lam_quad * extra_m * 1
|
||||||
},
|
|
||||||
guide: {
|
|
||||||
txt: `Направляющие, 2 шт`,
|
|
||||||
value: prices.guide * 2
|
|
||||||
},
|
|
||||||
top: {
|
|
||||||
txt: `Верхняя планка`,
|
|
||||||
value: prices.top * 1
|
|
||||||
},
|
},
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@ -141,16 +128,8 @@ const total_txt = computed(() => {
|
||||||
value: prices.pillar * (1 + sections)
|
value: prices.pillar * (1 + sections)
|
||||||
},
|
},
|
||||||
lamella: {
|
lamella: {
|
||||||
txt: `Ламели, ${(lam_count * sections)} шт`,
|
txt: `Блок ламелей с направляющей, ${sections} шт`,
|
||||||
value: prices.lamella * (lam_count * sections)
|
value: prices.lam_quad * length_m * sections
|
||||||
},
|
|
||||||
guide: {
|
|
||||||
txt: `Направляющие, ${(2 * sections)} шт`,
|
|
||||||
value: prices.guide * (2 * sections)
|
|
||||||
},
|
|
||||||
top: {
|
|
||||||
txt: `Верхняя планка ${(1 + sections)} шт`,
|
|
||||||
value: prices.top * sections
|
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -180,7 +159,7 @@ const total_txt = computed(() => {
|
||||||
<input type="text" placeholder="Ваше имя" v-model="modal_data.name" @keyup="validate" />
|
<input type="text" placeholder="Ваше имя" v-model="modal_data.name" @keyup="validate" />
|
||||||
<input type="phone" placeholder="Номер телефона или e-mail" v-model="modal_data.phone"
|
<input type="phone" placeholder="Номер телефона или e-mail" v-model="modal_data.phone"
|
||||||
@keypress="validateInput" @keyup="validate" />
|
@keypress="validateInput" @keyup="validate" />
|
||||||
{{ total_txt.total[0] }}
|
{{ total_txt && total_txt.total[0] }}
|
||||||
<div class="flex gap-4">
|
<div class="flex gap-4">
|
||||||
<button class="not-prose" :disabled="modal_form.disabled" type="submit">Отправить</button>
|
<button class="not-prose" :disabled="modal_form.disabled" type="submit">Отправить</button>
|
||||||
<button class="not-prose" type="reset" @click="toggleModal">Отмена</button>
|
<button class="not-prose" type="reset" @click="toggleModal">Отмена</button>
|
||||||
|
|
|
@ -48,4 +48,12 @@ type ApiAdvantageType = {
|
||||||
id: number
|
id: number
|
||||||
title: string
|
title: string
|
||||||
content: string
|
content: string
|
||||||
|
}
|
||||||
|
|
||||||
|
type ApiCalcType = {
|
||||||
|
id: number
|
||||||
|
title: string
|
||||||
|
pillar: string
|
||||||
|
pillar_base: string
|
||||||
|
lamelles_block: string
|
||||||
}
|
}
|
Loading…
Reference in New Issue