calc logic

components/calcValues.vue

@@ -4,6 +4,7 @@ import type { ralTypes } from '@/components/ral'
 
 import { predefLamelleColors, predefPillarColors } from '~/composables/useCalc';
 
+const lamelle_height = use_lamelle_height()
 const lamelles_count = use_lamelles_count()
 const fence_section = use_fence_section()
 const remove_pillar = use_remove_pillar()
@@ -17,7 +18,7 @@ const min_length = use_min_length()
 const parametric = reactive({
     length: {
         min: min_length.value,
-        max: 2466,
+        max: 2470,
         step: 1,
     },
     total_length: {
@@ -27,8 +28,8 @@ const parametric = reactive({
     },
     height: {
         min: 675,
-        max: 2400,
+        max: 2500,
-        step: 115,
+        step: lamelle_height.value * 1000,
     }
 })
 const form_state = reactive({
@@ -71,31 +72,38 @@ const changeParametres = () => {
     }
     form_state.total_length_mm = form_state.total_length * 1000
 
-    let { fence_length, total_length_mm, auto_length, length } = form_state
+    let { fence_length, total_length_mm, auto_length, length, full_sections } = form_state
     length = parseFloat(length.toString())
 
     if (auto_length) {
         let w = parametric.length.min
-        const max_sections = Math.ceil(total_length_mm / (parametric.length.min + fence_length))
+        const max_sections = Math.ceil((total_length_mm - fence_length) / (parametric.length.min + fence_length))
-        const min_sections = Math.ceil(total_length_mm / (parametric.length.max + fence_length))
+        const min_sections = Math.ceil((total_length_mm - fence_length) / (parametric.length.max + fence_length))
 
         for (let index = min_sections; index <= max_sections; index++) {
+            full_sections = index
             w = (total_length_mm - fence_length * (index - 1)) / index
-            if (w >= parametric.length.min && w <= parametric.length.max) {
+            if (
+                w >= parametric.length.min
+                && w <= parametric.length.max
+                && w * index <= total_length_mm
+            ) {
                 break
             }
         }
-        form_state.length = w
         length = w
     }
 
-    form_state.full_sections = Math.floor((total_length_mm - fence_length) / (length + fence_length))
+    if (((full_sections * length) + (full_sections * fence_length) + fence_length) <= total_length_mm) {
-    if (((form_state.full_sections * length) + (form_state.full_sections * fence_length) + fence_length) !== total_length_mm) {
+        form_state.extra_section = Math.floor((total_length_mm - fence_length) % length)
-        form_state.extra_section = Math.floor((total_length_mm - fence_length) % form_state.length)
     } else {
         form_state.extra_section = 0
     }
 
+    form_state.full_sections = full_sections
+    form_state.length = length
+    form_state.fence_length = fence_length
+
     total_length.value = form_state.total_length
     lamelles_count.value = lamelles
     fence_section.value = form_state.length * 0.001
@@ -124,12 +132,6 @@ const plurals = {
 </script>
 <template>
     <div class="container relative py-4">
-        <ClientOnly fallback-tag="div">
-            <template #fallback>
-                <div class="fallback">
-                    Загрузка 3D модели
-                </div>
-            </template>
         <form class="form">
             <div class="col-span-12 lg:col-span-6">
                 <div class="form-row">
@@ -137,8 +139,7 @@ const plurals = {
                         <label for="length">Длина ламельного блока, мм</label>
                         <input disabled :value="`${form_state.length} мм`" class="w-28" />
                         <input id="length" type="range" class="w-full" v-bind="parametric.length"
-                                v-model="form_state.length" :disabled="form_state.auto_length"
+                            v-model="form_state.length" :disabled="form_state.auto_length" :ref="form_refs.length" />
-                                :ref="form_refs.length" />
                     </div>
                     <div class="form-item w-full">
                         <label for="height">Высота забора, мм</label>
@@ -165,8 +166,8 @@ const plurals = {
                 <div class="form-row">
                     <div class="form-item">
                         <label for="lamelle_color">Цвет ламелей</label>
-                            <input id="lamelle_color" type="text" :value="getColorNameFromRal(lamelle_color)"
+                        <input id="lamelle_color" type="text" :value="getColorNameFromRal(lamelle_color)" class="w-60"
-                                class="w-60" disabled />
+                            disabled />
                         <ColorPicker :cb="setLamelleColor" />
                     </div>
                     <div class="form-item">
@@ -228,6 +229,5 @@ const plurals = {
                 <button @click.prevent="toggleModal">Рассчитать прямо сейчас</button>
             </div>
         </form>
-        </ClientOnly>
     </div>
 </template>

components/modal.vue

@@ -8,6 +8,7 @@ const { data: calculatorData } = await useFetch<ApiCalcType>(`${apiBase}/calcula
 
 const isModalOpen = useState('modal_open', () => false)
 
+const lamelle_height = useState<number>('lamelle_height')
 const lamelles_count = useState<number>('lamelles_count')
 const fence_section = useState<number>('fence_section')
 const pillar_color = useState<ralTypes>('pillar_color')
@@ -115,11 +116,11 @@ const total_txt = computed(() => {
     });
 
     const prices = {
-        pillar_length: discountValue * pillar,
+        pillar: discountValue * ((pillar * lam_count * lamelle_height.value) + pillar_base),
-        pillar: discountValue * ((pillar * lam_count * 0.115) + pillar_base),
+        lam_quad_regular: discountValue * lamelles_block * lam_count * lamelle_height.value * length_m,
-        lam_quad: discountValue * (lamelles_block * lam_count * 0.115),
+        lam_quad_extra: discountValue * lamelles_block * lam_count * lamelle_height.value * extra_m,
     }
-
+console.log(prices)
     const extra = {
         pillar: !remove_pillar.value && {
             txt: `Дополнительная секция, столб, 1 шт`,
@@ -127,7 +128,7 @@ const total_txt = computed(() => {
         },
         lamella: {
             txt: `Блок ламелей с направляющей, 1 шт`,
-            value: prices.lam_quad * extra_m * 1
+            value: prices.lam_quad_extra * 1
         },
 
     }
@@ -138,7 +139,7 @@ const total_txt = computed(() => {
         },
         lamella: {
             txt: `Блок ламелей с направляющей, ${sections} шт`,
-            value: prices.lam_quad * length_m * sections
+            value: prices.lam_quad_regular * sections
         },
     };
 

components/model/fence.vue

@@ -1,8 +1,9 @@
 <script setup lang="ts">
-import { BufferGeometry, Color, Matrix4, Vector3 } from 'three';
+import { BufferGeometry, Matrix4, Vector3 } from 'three';
 
 const props = defineProps(['index', 'models'])
 
+const lamelle_height = use_lamelle_height()
 const lamelles_count = use_lamelles_count()
 const fence_section = use_fence_section()
 const section_count = use_section_count()
@@ -10,7 +11,7 @@ const extra_section = use_extra_section()
 const remove_pillar = use_remove_pillar()
 const max_size = use_max_size()
 
-const lSize = 0.115
+const lSize = lamelle_height.value
 const bSize = 0.0235
 const pillar_size = 80 * 0.001
 

composables/useCalc.ts

@@ -5,6 +5,7 @@ export const predefLamelleColors = ['3009', '9003', '6027', '5024', '9001', '101
 
 const n = 2
 const min = 1300
+export const use_lamelle_height = () => useState<number>('lamelle_height', () => 0.115)
 export const use_lamelles_count = () => useState('lamelles_count', () => 14)
 export const use_fence_section = () => useState<number>('fence_section', () => min * 0.001)
 export const use_remove_pillar = () => useState<boolean>('remove_pillar', () => false)