refactor: handle input require name en

public/option/option.json

@@ -1,5 +1,28 @@
 {
   "eng": {
+    "visaType": [
+      {
+        "label": "Non-LA",
+        "value": "nla"
+      },
+      {
+        "label": "Non-B",
+        "value": "nb"
+      },
+      {
+        "label": "TV.60",
+        "value": "tv60"
+      },
+      {
+        "label": "Non-TR",
+        "value": "ntr"
+      },
+      {
+        "label": "TV.30",
+        "value": "tv30"
+      }
+    ],
+
     "workerStatus": [
       {
         "label": "Normal",
@@ -1051,6 +1074,29 @@
   },
 
   "tha": {
+    "visaType": [
+      {
+        "label": "Non-LA",
+        "value": "nla"
+      },
+      {
+        "label": "Non-B",
+        "value": "nb"
+      },
+      {
+        "label": "ผผ.60",
+        "value": "tv60"
+      },
+      {
+        "label": "Non-TR",
+        "value": "ntr"
+      },
+      {
+        "label": "ผผ.30",
+        "value": "tv30"
+      }
+    ],
+
     "workerStatus": [
       {
         "label": "ปกติ",

src/boot/i18n.ts

@@ -2,6 +2,7 @@ import { defineBoot } from '#q-app/wrappers';
 import { createI18n } from 'vue-i18n';
 
 import messages from 'src/i18n';
+import { Lang } from 'src/utils/ui';
 
 export type MessageLanguages = keyof typeof messages;
 // Type-define 'eng' as the master schema for the resource
@@ -26,7 +27,7 @@ export const i18n = createI18n<
   MessageLanguages,
   false
 >({
-  locale: 'en-US',
+  locale: Lang.Thai,
   legacy: false,
   messages,
 });

src/components/02_personnel-management/FormPerson.vue

@@ -196,7 +196,11 @@ watch(
           class="col"
           :label="$t('personnel.form.firstName')"
           v-model="firstName"
-          :rules="[(val: string) => !!val || $t('form.error.required')]"
+          :rules="
+            employee
+              ? []
+              : [(val: string) => !!val || $t('form.error.required')]
+          "
         />
 
         <q-input
@@ -289,10 +293,22 @@ watch(
           class="col"
           label="Surname"
           v-model="lastNameEN"
-          :rules="[
+          :rules="
-            (val: string) =>
+            employee
-              !val || /^[A-Za-z\s]+$/.test(val) || $t('form.error.letterOnly'),
+              ? [
-          ]"
+                  (val: string) => !!val || $t('form.error.required'),
+                  (val: string) =>
+                    !val ||
+                    /^[A-Za-z\s]+$/.test(val) ||
+                    $t('form.error.letterOnly'),
+                ]
+              : [
+                  (val: string) =>
+                    !val ||
+                    /^[A-Za-z\s]+$/.test(val) ||
+                    $t('form.error.letterOnly'),
+                ]
+          "
         />
       </div>
 
@@ -394,11 +410,15 @@ watch(
         :readonly="readonly"
         :label="$t('form.birthDate')"
         :disabled-dates="disabledAfterToday"
-        :rules="[
+        :rules="
-          (val: string) =>
+          employee
-            !!val ||
+            ? []
-            $t('form.error.selectField', { field: $t('form.birthDate') }),
+            : [
-        ]"
+                (val: string) =>
+                  !!val ||
+                  $t('form.error.selectField', { field: $t('form.birthDate') }),
+              ]
+        "
       />
 
       <q-input
@@ -480,7 +500,6 @@ watch(
         :hide-dropdown-icon="readonly"
         :for="`${prefixId}-select-gender`"
         :label="$t('form.gender')"
-        :rules="[(val: string) => !!val || $t('form.error.required')]"
         @filter="genderFilter"
       >
         <template v-slot:no-option>
@@ -513,7 +532,6 @@ watch(
         :hide-dropdown-icon="readonly"
         :for="`${prefixId}-select-nationality`"
         :label="$t('general.nationality')"
-        :rules="[(val: string) => !!val || $t('form.error.required')]"
         @filter="nationalityFilter"
       >
         <template v-slot:no-option>

src/components/03_customer-management/FormEmployeeOther.vue

@@ -106,7 +106,7 @@ const employeeOther = defineModel<EmployeeOtherCreate>('employeeOther');
           :readonly="readonly || employeeOther.statusSave"
           hide-bottom-space
           class="col-md-3 col-6"
-          :label="$t('form.firstName')"
+          :label="$t('general.nativeLanguage', { msg: $t('form.firstName') })"
           :model-value="employeeOther.fatherFirstName"
           @update:model-value="
             (v) =>
@@ -122,7 +122,7 @@ const employeeOther = defineModel<EmployeeOtherCreate>('employeeOther');
           :readonly="readonly || employeeOther.statusSave"
           hide-bottom-space
           class="col-md-3 col-6"
-          :label="$t('form.lastName')"
+          :label="$t('general.nativeLanguage', { msg: $t('form.lastName') })"
           :model-value="employeeOther.fatherLastName"
           @update:model-value="
             (v) =>
@@ -177,7 +177,7 @@ const employeeOther = defineModel<EmployeeOtherCreate>('employeeOther');
           :readonly="readonly || employeeOther.statusSave"
           hide-bottom-space
           class="col-md-3 col-6"
-          :label="$t('form.firstName')"
+          :label="$t('general.nativeLanguage', { msg: $t('form.firstName') })"
           :model-value="employeeOther.motherFirstName"
           @update:model-value="
             (v) =>
@@ -193,7 +193,7 @@ const employeeOther = defineModel<EmployeeOtherCreate>('employeeOther');
           :readonly="readonly || employeeOther.statusSave"
           hide-bottom-space
           class="col-md-3 col-6"
-          :label="$t('form.lastName')"
+          :label="$t('general.nativeLanguage', { msg: $t('form.lastName') })"
           :model-value="employeeOther.motherLastName"
           @update:model-value="
             (v) =>

src/components/03_customer-management/FormEmployeePassport.vue

@@ -103,7 +103,7 @@ onMounted(() => {
       'label',
     );
     passportIssuingCountryFilter = selectFilterOptionRefMod(
-      ref(optionStore.globalOption.nationality),
+      ref(optionStore.rawOption?.eng.nationality),
       passportIssuingCountryOptions,
       'label',
     );
@@ -121,13 +121,13 @@ onMounted(() => {
     );
 
     genderFilter = selectFilterOptionRefMod(
-      ref(optionStore.globalOption?.gender),
+      ref(optionStore.rawOption?.eng.gender),
       genderOptions,
       'label',
     );
 
     nationalityFilter = selectFilterOptionRefMod(
-      ref(optionStore.globalOption?.nationality),
+      ref(optionStore.rawOption?.eng.nationality),
       nationalityOptions,
       'label',
     );
@@ -152,7 +152,7 @@ watch(
     );
 
     passportIssuingCountryFilter = selectFilterOptionRefMod(
-      ref(optionStore.globalOption.nationality),
+      ref(optionStore.rawOption?.eng.nationality),
       passportIssuingCountryOptions,
       'label',
     );
@@ -164,13 +164,13 @@ watch(
     );
 
     genderFilter = selectFilterOptionRefMod(
-      ref(optionStore.globalOption?.gender),
+      ref(optionStore.rawOption?.eng.gender),
       genderOptions,
       'label',
     );
 
     nationalityFilter = selectFilterOptionRefMod(
-      ref(optionStore.globalOption?.nationality),
+      ref(optionStore.rawOption?.eng.nationality),
       nationalityOptions,
       'label',
     );

src/components/03_customer-management/FormEmployeeVisa.vue

@@ -92,7 +92,7 @@ let workerTypeFilter: (
 
 onMounted(() => {
   visaTypeFilter = selectFilterOptionRefMod(
-    ref(optionStore.globalOption?.nationality),
+    ref(optionStore.globalOption?.visaType),
     visaTypeOptions,
     'label',
   );

src/i18n/eng.ts

@@ -153,6 +153,7 @@ export default {
     tableOfContent: 'Table of Contents',
     draw: 'Draw',
     newUpload: 'New Upload',
+    nativeLanguage: '{msg} Native Language',
   },
 
   menu: {

src/i18n/tha.ts

@@ -153,6 +153,7 @@ export default {
     tableOfContent: 'สารบัญ',
     draw: 'วาด',
     newUpload: 'อัปโหลดใหม่',
+    nativeLanguage: '{msg} ภาษาต้นทาง',
   },
 
   menu: {

src/pages/03_customer-management/MainPage.vue

@@ -2918,6 +2918,7 @@ const emptyCreateDialog = ref(false);
               class="q-mb-xl"
             />
             <AddressForm
+              disabledRule
               id="form-personal-address"
               prefix-id="form-employee"
               :readonly="!employeeFormState.isEmployeeEdit"
@@ -4871,6 +4872,7 @@ const emptyCreateDialog = ref(false);
               <AddressForm
                 id="drawer-form-personal-address"
                 employee
+                disabledRule
                 v-model:address="currentFromDataEmployee.address"
                 v-model:address-en="currentFromDataEmployee.addressEN"
                 v-model:moo="currentFromDataEmployee.moo"

src/stores/options/index.ts

@@ -75,6 +75,7 @@ const useOptionStore = defineStore('optionStore', () => {
   }
 
   return {
+    rawOption,
     globalOption,
     mapOption,
   };