components/modal.vue

@@ -4,7 +4,7 @@ import type { ralTypes } from '@/components/ral'
 
 const config = useRuntimeConfig()
 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)
 
@@ -95,25 +95,20 @@ const total_colors = computed(() => {
     ]
 })
 const total_txt = computed(() => {
-    let { mortgage, pillar, lamella, rivets, bar, guide } = calculatorData.value
-    mortgage = parseFloat(mortgage)
-    pillar = parseFloat(pillar)
-    lamella = parseFloat(lamella)
-    rivets = parseFloat(rivets)
-    bar = parseFloat(bar)
-    guide = parseFloat(guide)
+    if (!calculatorData.value) return
+    const pillar = parseFloat(calculatorData.value.pillar)
+    const pillar_base = parseFloat(calculatorData.value.pillar_base)
+    const lamelles_block = parseFloat(calculatorData.value.lamelles_block)
+
     const sections = section_count.value as number
     const extra_m = extra_section.value as number * 0.001
     const length_m = fence_section.value as number
     const lam_count = lamelles_count.value as number
 
     const prices = {
-        pillar: mortgage + pillar,
-        lamella: rivets * 2 + lamella * length_m,
-        lamella_extra: rivets * 2 + lamella * extra_m,
-        guide: guide * lam_count * 0.115,
-        top: bar * length_m,
-        top_extra: bar * extra_m
+        pillar_length: pillar,
+        pillar: (pillar * lam_count * 0.115) + pillar_base,
+        lam_quad: lamelles_block * lam_count * 0.115,
     }
 
     const extra = {
@@ -122,16 +117,8 @@ const total_txt = computed(() => {
             value: prices.pillar * 1
         },
         lamella: {
-            txt: `Дополнительная секция, ламели, ${lam_count} шт`,
-            value: prices.lamella_extra * lam_count
-        },
-        guide: {
-            txt: `Направляющие, 2 шт`,
-            value: prices.guide * 2
-        },
-        top: {
-            txt: `Верхняя планка`,
-            value: prices.top * 1
+            txt: `Блок ламелей с направляющей, 1 шт`,
+            value: prices.lam_quad * extra_m * 1
         },
 
     }
@@ -141,16 +128,8 @@ const total_txt = computed(() => {
             value: prices.pillar * (1 + sections)
         },
         lamella: {
-            txt: `Ламели, ${(lam_count * sections)} шт`,
-            value: prices.lamella * (lam_count * sections)
-        },
-        guide: {
-            txt: `Направляющие, ${(2 * sections)} шт`,
-            value: prices.guide * (2 * sections)
-        },
-        top: {
-            txt: `Верхняя планка ${(1 + sections)} шт`,
-            value: prices.top * sections
+            txt: `Блок ламелей с направляющей, ${sections} шт`,
+            value: prices.lam_quad * length_m * sections
         },
     }
 
@@ -180,7 +159,7 @@ const total_txt = computed(() => {
                     <input type="text" placeholder="Ваше имя" v-model="modal_data.name" @keyup="validate" />
                     <input type="phone" placeholder="Номер телефона или e-mail" v-model="modal_data.phone"
                         @keypress="validateInput" @keyup="validate" />
-                    {{ total_txt.total[0] }}
+                    {{ total_txt && total_txt.total[0] }}
                     <div class="flex gap-4">
                         <button class="not-prose" :disabled="modal_form.disabled" type="submit">Отправить</button>
                         <button class="not-prose" type="reset" @click="toggleModal">Отмена</button>

types/index.d.ts

@@ -49,3 +49,11 @@ type ApiAdvantageType = {
     title: string
     content: string
 }
+
+type ApiCalcType = {
+    id: number
+    title: string
+    pillar: string
+    pillar_base: string
+    lamelles_block: string
+}