bx-935-calc #1

Merged
ksenia_mikhailova merged 15 commits from bx-935-calc into main 2024-07-03 14:57:08 +03:00
2 changed files with 38 additions and 40 deletions
Showing only changes of commit a236c8a3c0 - Show all commits

View File

@ -191,11 +191,12 @@ const plurals = {
</div> </div>
</div> </div>
<div class="col-span-12 lg:col-span-8 prose min-w-full"> <div class="col-span-12 lg:col-span-8 prose min-w-full">
<template v-if="(form_state.total_length * 1000) >= parametric.length.min">
<p> <p>
Забор общей длиной {{ form_state.total_length }}{{ '\xa0' }}м, Забор общей длиной {{ form_state.total_length }}{{ '\xa0' }}м,
{{ section_count }} {{ section_count }}
<Plural :n="section_count" :forms="plurals.section" /> по <Plural :n="section_count" :forms="plurals.section" /> по
{{ `${parseInt(form_state.length).toFixed(2)}\xa0мм` }}{{ {{ `${parseFloat(form_state.length.toString()).toFixed(2)}\xa0мм` }}{{
form_state.extra_section ? ` и 1 дополнительная секция form_state.extra_section ? ` и 1 дополнительная секция
длиной ${form_state.extra_section.toFixed(2)}\xa0мм` : '' }}. длиной ${form_state.extra_section.toFixed(2)}\xa0мм` : '' }}.
</p> </p>
@ -206,7 +207,7 @@ const plurals = {
</template> </template>
{{ section_count * lamelles_count }} {{ section_count * lamelles_count }}
<Plural :n="section_count * lamelles_count" :forms="plurals.lamelle" /> <Plural :n="section_count * lamelles_count" :forms="plurals.lamelle" />
{{ `длиной ${parseInt(form_state.length).toFixed(2)}\xa0мм` }}<template {{ `длиной ${parseFloat(form_state.length.toString()).toFixed(2)}\xa0мм` }}<template
v-if="form_state.extra_section"> v-if="form_state.extra_section">
{{ ` и ${~~(!!form_state.extra_section.toFixed(2)) * lamelles_count}` }} {{ ` и ${~~(!!form_state.extra_section.toFixed(2)) * lamelles_count}` }}
<Plural :n="~~(!!form_state.extra_section) * lamelles_count" :forms="plurals.lamelle" /> <Plural :n="~~(!!form_state.extra_section) * lamelles_count" :forms="plurals.lamelle" />
@ -218,6 +219,7 @@ const plurals = {
ламели: {{ getColorNameFromRal(lamelle_color)?.toLowerCase() }}; ламели: {{ getColorNameFromRal(lamelle_color)?.toLowerCase() }};
столбы: {{ getColorNameFromRal(pillar_color)?.toLowerCase() }}. столбы: {{ getColorNameFromRal(pillar_color)?.toLowerCase() }}.
</p> </p>
</template>
</div> </div>
<div class="prose col-span-4"> <div class="prose col-span-4">
<p v-if="form_state.extra_section" class="text-ioprim"> <p v-if="form_state.extra_section" class="text-ioprim">

View File

@ -51,19 +51,16 @@ const validateInput = (evt: KeyboardEvent) => {
return return
} }
} }
const validate = () => { const validate = () => {
const phone_regexp = /^\+?[\d\s-()]{0,14}\d{11}$/ const phone_regexp = /^\+?[\d\s-()]{0,14}\d{11}$/
const email_regex = /^[\w-\.]+@([\w-]+\.)+[\w-]{2,4}$/ const email_regex = /^[\w-\.]+@([\w-]+\.)+[\w-]{2,4}$/
if (!modal_data.phone) {
modal_form.disabled = true modal_form.disabled = true
return if (
} (modal_data.phone && phone_regexp.test(modal_data.phone))
if (modal_data.phone.length < 3) { || (modal_data.email && email_regex.test(modal_data.email))
modal_form.disabled = true ) {
return
}
if (phone_regexp.test(modal_data.phone) || email_regex.test(modal_data.phone)) {
modal_form.disabled = false modal_form.disabled = false
return return
} }
@ -167,7 +164,7 @@ const total_txt = computed(() => {
<div class="modal"> <div class="modal">
<template v-if="modal_state.show_form"> <template v-if="modal_state.show_form">
<h2>Оставьте контакты для связи </h2> <h2>Оставьте контакты для связи </h2>
<form @submit.prevent="submit"> <form @submit.prevent="submit" ref="form">
<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="Ваш номер телефона" v-model="modal_data.phone" <input type="phone" placeholder="Ваш номер телефона" v-model="modal_data.phone"
@keypress="validateInput" @keyup="validate" /> @keypress="validateInput" @keyup="validate" />
@ -196,9 +193,8 @@ const total_txt = computed(() => {
</p> </p>
</template> </template>
</div> </div>
<div class="flex gap-4"> <div class="flex gap-4 justify-center">
<button class="not-prose" @click="openForm">Отправить расчет на эл. почту</button> <button class="not-prose" @click="openForm">Отправить расчет на e-mail</button>
<button class="not-prose neutral" @click="toggleModal">Закрыть окно</button>
</div> </div>
</template> </template>
</div> </div>