refactor: add rules

src/components/form/AddressForm.vue

@@ -305,7 +305,14 @@ watch(districtId, fetchSubDistrict);
           :rules="
             disabledRule
               ? []
-              : [(val) => (val && val.length > 0) || $t('form.error.required')]
+              : [
+                  (val) => (val && val.length > 0) || $t('form.error.required'),
+                  (val) =>
+                    (val && val.length === 11 && /[0-9]+/.test(val)) ||
+                    $t('form.error.invalidCustomeMessage', {
+                      msg: $t('form.error.requireLength', { msg: 11 }),
+                    }),
+                ]
           "
         />
         <q-input

src/pages/03_customer-management/components/employer/EmployerFormAbout.vue

@@ -382,7 +382,11 @@ watch(
           class="col"
           label="Name"
           v-model="firstNameEN"
-          :rules="[(val: string) => !!val || $t('form.error.required')]"
+          :rules="[
+            (val: string) => !!val || $t('form.error.required'),
+            (val: string) =>
+              /^[A-Za-z]+$/.test(val) || $t('form.error.letterOnly'),
+          ]"
         />
         <q-input
           :for="`${prefixId}-input-last-name`"
@@ -393,7 +397,11 @@ watch(
           class="col"
           label="Surname"
           v-model="lastNameEN"
-          :rules="[(val: string) => !!val || $t('form.error.required')]"
+          :rules="[
+            (val: string) => !!val || $t('form.error.required'),
+            (val: string) =>
+              /^[A-Za-z]+$/.test(val) || $t('form.error.letterOnly'),
+          ]"
         />
       </div>