fence modal

components/calcValues.vue

@@ -8,6 +8,7 @@ const pillar_color = useState<ralTypes>('pillar_color', () => '3009')
 const lamelle_color = useState<ralTypes>('lamelle_color', () => '3004')
 const section_count = useState('section_count', () => 1)
 const extra_section = useState('extra_section', () => 0)
+const total_length = useState('total_length', () => 2000 * 0.001 * 2)
 
 const parametric = {
     length: {
@@ -79,6 +80,7 @@ const changeParametres = () => {
         } else {
             form_state.extra_section = 0
         }
+        extra_section.value = form_state.extra_section
 
         form_refs.total_length.value.setCustomValidity('')
         if (form_state.extra_section && form_state.extra_section < parametric.length.min) {
@@ -90,6 +92,8 @@ const changeParametres = () => {
                 form_state.length = parametric.length.min
             }
         }, 300)
+
+        total_length.value = form_state.total_length 
     }
 }
 

components/modal.vue

@@ -1,5 +1,7 @@
 <script setup lang="ts">
-import { getColorHexFromRal, getColorNameFromRal } from '@/components/ral'
+import { getColorNameFromRal } from '@/components/ral'
+import type { ralTypes } from '@/components/ral'
+
 const config = useRuntimeConfig()
 const apiBase = config.public.apiBase
 
@@ -10,6 +12,8 @@ const fence_section = useState<number>('fence_section')
 const pillar_color = useState<ralTypes>('pillar_color')
 const lamelle_color = useState<ralTypes>('lamelle_color')
 const section_count = useState('section_count')
+const extra_section = useState('extra_section')
+const total_length = useState('total_length')
 
 const toggleModal = () => {
     modal_data.phone = undefined
@@ -67,7 +71,14 @@ const submit = (e: any) => {
         },
         body: JSON.stringify({
             name: modal_data.name || `ref from site ${new Date}`,
-            phone: modal_data.phone
+            phone: modal_data.phone,
+            fence_info: `Ширина секции: ${fence_section.value}
+            Ламелей в секции: ${lamelles_count.value}
+            Всего секций: ${section_count.value}
+            Дополнительная секция: ${extra_section.value}
+            Общая длина забора: ${total_length.value}
+            Цвет ламелей ${lamelle_color.value} (${getColorNameFromRal(lamelle_color.value)})
+            Цвет столбов ${pillar_color.value} (${getColorNameFromRal(pillar_color.value)})`
         })
     })
     modal_data.phone = undefined
@@ -106,7 +117,7 @@ const submit = (e: any) => {
                         Цвет столба: {{ getColorNameFromRal(pillar_color) }}
                     </div>
                     <div>
-                        Цвет ламелей: {{getColorNameFromRal(lamelle_color) }}
+                        Цвет ламелей: {{ getColorNameFromRal(lamelle_color) }}
                     </div>
                 </div>
                 <div class="flex gap-4">

components/model/fence.vue

@@ -20,7 +20,7 @@ watch([fence_section, lamelles_count], () => {
     pillar_one_pos.value = fence_section.value * -0.5 - 0.01
     pillar_two_pos.value = fence_section.value * 0.5 + pillar_size + bSize - 0.01
 })
-const scale_koef = 3
+const scale_koef = 2.5
 const show_pillar_one = ref(props.index == 1)
 const show_pillar_two = ref(true)
 const make_translate_to_section = () => {