fix(03): form validate rule and i18n

This commit is contained in:
puriphatt 2024-09-11 09:56:38 +07:00
parent aa42f1dcfc
commit effa640c6d
3 changed files with 33 additions and 23 deletions

View file

@ -121,8 +121,11 @@ watch(
:for="`${prefixId}-select-passport-type`" :for="`${prefixId}-select-passport-type`"
:label="$t('customerEmployee.form.passportType')" :label="$t('customerEmployee.form.passportType')"
:rules="[ :rules="[
(val: string) => (val) =>
!!val || $t('selectValidate') + $t('formDialogInputPassportType'), (val && val.length > 0) ||
$t('form.error.selectField', {
field: $t('customerEmployee.form.passportType'),
}),
]" ]"
@filter="passportTypeFilter" @filter="passportTypeFilter"
> >
@ -143,10 +146,7 @@ watch(
:class="{ 'col-12': ocr, 'col-6': !ocr, 'col-md-3': !ocr }" :class="{ 'col-12': ocr, 'col-6': !ocr, 'col-md-3': !ocr }"
:label="$t('customerEmployee.form.passportNo')" :label="$t('customerEmployee.form.passportNo')"
v-model="passportNumber" v-model="passportNumber"
:rules="[ :rules="[(val) => (val && val.length > 0) || $t('form.error.required')]"
(val: string) =>
!!val || $t('inputValidate') + $t('formDialogInputPassportNo'),
]"
/> />
<q-input <q-input
:for="`${prefixId}-input-passport-ref`" :for="`${prefixId}-input-passport-ref`"
@ -174,10 +174,7 @@ watch(
:class="{ 'col-12': ocr, 'col-6': !ocr, 'col-md-3': !ocr }" :class="{ 'col-12': ocr, 'col-6': !ocr, 'col-md-3': !ocr }"
:label="$t('customerEmployee.form.passportPlace')" :label="$t('customerEmployee.form.passportPlace')"
v-model="passportIssuingPlace" v-model="passportIssuingPlace"
:rules="[ :rules="[(val) => (val && val.length > 0) || $t('form.error.required')]"
(val: string) =>
!!val || $t('inputValidate') + $t('formDialogInputWPassportPlace'),
]"
/> />
<q-select <q-select
outlined outlined
@ -200,9 +197,11 @@ watch(
:for="`${prefixId}-select-passport-country`" :for="`${prefixId}-select-passport-country`"
:label="$t('customerEmployee.form.passportIssuer')" :label="$t('customerEmployee.form.passportIssuer')"
:rules="[ :rules="[
(val: string) => (val) =>
!!val || (val && val.length > 0) ||
$t('selectValidate') + $t('formDialogInputPassportCountry'), $t('form.error.selectField', {
field: $t('customerEmployee.form.passportIssuer'),
}),
]" ]"
@filter="passportIssuingCountryFilter" @filter="passportIssuingCountryFilter"
> >
@ -222,9 +221,11 @@ watch(
:class="{ 'col-md-3': !ocr }" :class="{ 'col-md-3': !ocr }"
:readonly="readonly" :readonly="readonly"
:rules="[ :rules="[
(val: string) => (val) =>
!!val || (val && val.length > 0) ||
$t('selectValidate') + $t('formDialogInputPassportIssuance'), $t('form.error.selectField', {
field: $t('customerEmployee.form.passportIssueDate'),
}),
]" ]"
/> />
<DatePicker <DatePicker
@ -235,8 +236,11 @@ watch(
:class="{ 'col-md-3': !ocr }" :class="{ 'col-md-3': !ocr }"
:readonly="readonly" :readonly="readonly"
:rules="[ :rules="[
(val: string) => (val) =>
!!val || $t('selectValidate') + $t('formDialogInputPassportExpire'), (val && val.length > 0) ||
$t('form.error.selectField', {
field: $t('customerEmployee.form.passportExpireDate'),
}),
]" ]"
/> />
</div> </div>

View file

@ -155,7 +155,7 @@ onMounted(() => {
(val: string) => (val: string) =>
!!val || !!val ||
$t('form.error.selectField', { $t('form.error.selectField', {
field: $t('customer.form.employerBranch'), field: $t('customerEmployee.branch'),
}), }),
]" ]"
> >

View file

@ -344,8 +344,11 @@ function formatCode(input: string | undefined, type: 'code' | 'number') {
:label="$t('customer.form.firstNameEN')" :label="$t('customer.form.firstNameEN')"
for="input-first-name-en" for="input-first-name-en"
v-model="firstNameEN" v-model="firstNameEN"
:rules="[(val) => /^[A-Za-z]+$/.test(val)]" :rules="[
:error-message="$t('form.error.letterOnly')" (val: string) => !!val || $t('form.error.required'),
(val: string) =>
/^[A-Za-z]+$/.test(val) || $t('form.error.letterOnly'),
]"
/> />
<q-input <q-input
dense dense
@ -356,8 +359,11 @@ function formatCode(input: string | undefined, type: 'code' | 'number') {
:label="$t('customer.form.lastNameEN')" :label="$t('customer.form.lastNameEN')"
for="input-last-name-en" for="input-last-name-en"
v-model="lastNameEN" v-model="lastNameEN"
:rules="[(val) => /^[A-Za-z]+$/.test(val)]" :rules="[
:error-message="$t('form.error.letterOnly')" (val: string) => !!val || $t('form.error.required'),
(val: string) =>
/^[A-Za-z]+$/.test(val) || $t('form.error.letterOnly'),
]"
/> />
</div> </div>