瀏覽代碼

add phone number validation to contact page

Olivier Massot 1 年之前
父節點
當前提交
b3b1c058fb
共有 2 個文件被更改,包括 639 次插入791 次删除
  1. 5 1
      components/Contact/Form.vue
  2. 634 790
      yarn.lock

+ 5 - 1
components/Contact/Form.vue

@@ -83,9 +83,9 @@
           </v-col>
 
           <v-col cols="12" md="6">
-            <!-- TODO: remplacer par un input dédié aux nums de téléphone -->
             <v-text-field
               v-model="phone"
+              :rules="[validatePhone]"
               label="Téléphone*"
               type="tel"
             />
@@ -251,6 +251,9 @@ const validatePostalCode = (postalCode: string | null) =>
 const validateEmail = (email: string | null) =>
   (!!email && /.+@.+\..+/.test(email)) || "L'adresse e-mail doit être valide";
 
+const validatePhone = (email: string | null) =>
+  (!!email && /^((\+|00)33\s?|0)[67]([\s.]?\d{2}){4}$/.test(email)) || "Le numéro de téléphone doit être valide";
+
 const validateStructureName = (structureName: string | null) =>
   !!structureName || "Le nom de la structure est requis";
 
@@ -265,6 +268,7 @@ const valid: ComputedRef<boolean> = computed(() => {
     validateSurname(surname.value) === true &&
     validatePostalCode(postalCode.value) === true &&
     validateEmail(email.value) === true &&
+    validatePhone(phone.value) === true &&
     validateStructureName(structureName.value) === true &&
     validateMessageLength(message.value) === true &&
     privacyPolicy.value === true &&

文件差異過大導致無法顯示
+ 634 - 790
yarn.lock


部分文件因文件數量過多而無法顯示