components/modal.vue

@@ -30,12 +30,15 @@ type modalDataType = {
     phone?: string
     name?: string
     email?: string
+    policy: boolean
 }
 const modal_data = reactive<modalDataType>({
     email: undefined,
     phone: undefined,
-    name: undefined
+    name: undefined,
+    policy: true
 })
+
 const modal_form = reactive({
     disabled: true,
     errors: [],
@@ -62,13 +65,17 @@ const validate = () => {
 
     modal_form.disabled = true
     if (
+        (
             (modal_data.phone && phone_regexp.test(modal_data.phone))
             || (modal_data.email && email_regex.test(modal_data.email))
+        ) && modal_data.policy == true
     ) {
         modal_form.disabled = false
         return
     }
 }
+watch(modal_data, validate)
+
 const submit = async (e: any) => {
     goal('submit_form', modal_data)
     modal_state.show_status = 'loading'
@@ -202,13 +209,13 @@ const policy = () => {
             <template v-else-if="modal_state.show_form">
                 <h2>Оставьте контакты для связи </h2>
                 <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" />
                     <input type="phone" placeholder="Ваш номер телефона" v-model="modal_data.phone"
-                        @keypress="validateInput" @keyup="validate" />
-                    <input type="e-mail" placeholder="Ваш e-mail" v-model="modal_data.email" @keypress="validateInput"
-                        @keyup="validate" />
+                        @keypress="validateInput" />
+                    <input type="e-mail" placeholder="Ваш e-mail" v-model="modal_data.email"
+                        @keypress="validateInput" />
                     <div class="flex gap-4 justify-between items-center">
-                        <input type="checkbox" id="policy" />
+                        <input type="checkbox" id="policy" v-model="modal_data.policy" />
                         <label for="policy">Соглашение... <NuxtLink to="policy" @click="policy">cсылка</NuxtLink>
                         </label>
                     </div>