chamomind/jws-frontend
chamomind/jws-frontend
7
0
Fork 0
Code Issues Projects Releases Packages 1 Wiki Activity Actions

fix: form employee disable rule validate

Browse source
This commit is contained in:
puriphatt 2024-06-12 09:08:43 +00:00
parent 70664067e5
commit 60431904ce
5 changed files with 131 additions and 59 deletions
Download patch file Download diff file Expand all files Collapse all files

107
src/components/02_personnel-management/FormAddress.vue
View file

@ -15,6 +15,7 @@ defineProps<{
readonly?: boolean;
separator?: boolean;
employee?: boolean;
disabledRule?: boolean;
}>();
const adrressStore = useAddressStore();
@ -116,10 +117,15 @@ watch(districtId, fetchSubDistrict);
class="col-12"
v-model="address"
lazy-rules
:rules="[
(val) =>
(val && val.length > 0) || $t('formDialogInputAddressValidate'),
]"
:rules="
disabledRule
? []
: [
(val) =>
(val && val.length > 0) ||
$t('formDialogInputAddressValidate'),
]
"
/>
<q-select
id="select-province"
@ -138,10 +144,15 @@ watch(districtId, fetchSubDistrict);
class="col-3"
:options="addrOptions.provinceOps"
lazy-rules
:rules="[
(val) =>
(val && val.length > 0) || $t('formDialogInputProvinceValidate'),
]"
:rules="
disabledRule
? []
: [
(val) =>
(val && val.length > 0) ||
$t('formDialogInputProvinceValidate'),
]
"
@update:model-value="districtId = subDistrictId = zipCode = null"
/>
<q-select
@ -161,10 +172,15 @@ watch(districtId, fetchSubDistrict);
class="col-3"
:options="addrOptions.districtOps"
lazy-rules
:rules="[
(val) =>
(val && val.length > 0) || $t('formDialogInputDistrictValidate'),
]"
:rules="
disabledRule
? []
: [
(val) =>
(val && val.length > 0) ||
$t('formDialogInputDistrictValidate'),
]
"
@update:model-value="subDistrictId = zipCode = null"
/>
<q-select
@ -184,11 +200,15 @@ watch(districtId, fetchSubDistrict);
class="col-3"
:options="addrOptions.subDistrictOps"
lazy-rules
:rules="[
(val) =>
(val && val.length > 0) ||
$t('formDialogInputSubDistrictValidate'),
]"
:rules="
disabledRule
? []
: [
(val) =>
(val && val.length > 0) ||
$t('formDialogInputSubDistrictValidate'),
]
"
@update:model-value="(v: string) => selectSubDistrict(v)"
/>
<q-input
@ -217,10 +237,15 @@ watch(districtId, fetchSubDistrict);
class="col-12"
v-model="addressEN"
lazy-rules
:rules="[
(val) =>
(val && val.length > 0) || $t('formDialogInputAddressValidate'),
]"
:rules="
disabledRule
? []
: [
(val) =>
(val && val.length > 0) ||
$t('formDialogInputAddressValidate'),
]
"
/>
<q-select
id="select-province-en"
@ -239,10 +264,15 @@ watch(districtId, fetchSubDistrict);
class="col-3"
:options="addrOptions.provinceOps"
lazy-rules
:rules="[
(val) =>
(val && val.length > 0) || $t('formDialogInputProvinceValidate'),
]"
:rules="
disabledRule
? []
: [
(val) =>
(val && val.length > 0) ||
$t('formDialogInputProvinceValidate'),
]
"
@update:model-value="districtId = subDistrictId = zipCode = null"
/>
<q-select
@ -262,10 +292,15 @@ watch(districtId, fetchSubDistrict);
class="col-3"
:options="addrOptions.districtOps"
lazy-rules
:rules="[
(val) =>
(val && val.length > 0) || $t('formDialogInputDistrictValidate'),
]"
:rules="
disabledRule
? []
: [
(val) =>
(val && val.length > 0) ||
$t('formDialogInputDistrictValidate'),
]
"
@update:model-value="subDistrictId = zipCode = null"
/>
<q-select
@ -285,11 +320,15 @@ watch(districtId, fetchSubDistrict);
class="col-3"
:options="addrOptions.subDistrictOps"
lazy-rules
:rules="[
(val) =>
(val && val.length > 0) ||
$t('formDialogInputSubDistrictValidate'),
]"
:rules="
disabledRule
? []
: [
(val) =>
(val && val.length > 0) ||
$t('formDialogInputSubDistrictValidate'),
]
"
@update:model-value="(v: string) => selectSubDistrict(v)"
/>
<q-input

2
src/components/02_personnel-management/InfoForm.vue
View file

@ -9,6 +9,7 @@ defineProps<{
addressTitleEN?: string;
noAddress?: boolean;
noPaddingTab?: boolean;
disabledRule?: boolean;
}>();
const address = defineModel('address', { default: '' });
@ -75,6 +76,7 @@ const tabsList = defineModel<{ name: string; label: string }[]>('tabsList');
outlined
separator
:readonly="readonly"
:disabledRule="disabledRule"
v-model:address="address"
v-model:addressEN="addressEN"
v-model:provinceId="provinceId"

75
src/components/03_customer-management/FormEmployeeVisa.vue
View file

@ -71,11 +71,11 @@ onMounted(async () => {
class="col-3"
:options="visaTypeOption"
lazy-rules
:rules="[
/>
<!-- :rules="[
(val: string) =>
!!val || $t('selectValidate') + $t('formDialogInputVisaType'),
]"
/>
]" -->
<q-input
for="input-visa-no"
:dense="dense"
@ -86,11 +86,11 @@ onMounted(async () => {
class="col-3"
:label="$t('formDialogInputVisaNo')"
v-model="visaNumber"
:rules="[
/>
<!-- :rules="[
(val: string) =>
!!val || $t('inputValidate') + $t('formDialogInputVisaNo'),
]"
/>
]" -->
<VueDatePicker
id="date-picker-visa-issuance"
utc
@ -115,11 +115,11 @@ onMounted(async () => {
:readonly="readonly"
:borderless="readonly"
:model-value="visaIssueDate ? dateFormat(visaIssueDate) : ''"
:rules="[
>
<!-- :rules="[
(val: string) =>
!!val || $t('selectValidate') + $t('formDialogInputVisaIssuance'),
]"
>
]" -->
<template v-slot:prepend>
<q-icon
size="xs"
@ -128,6 +128,15 @@ onMounted(async () => {
color="positive"
/>
</template>
<template v-slot:append>
<q-icon
v-if="visaIssueDate && !readonly"
name="mdi-close"
class="cursor-pointer"
size="xs"
@click="visaIssueDate = undefined"
/>
</template>
</q-input>
</template>
</VueDatePicker>
@ -155,11 +164,11 @@ onMounted(async () => {
:readonly="readonly"
:borderless="readonly"
:model-value="visaExpiryDate ? dateFormat(visaExpiryDate) : ''"
:rules="[
>
<!-- :rules="[
(val: string) =>
!!val || $t('selectValidate') + $t('formDialogInputVisaExpire'),
]"
>
]" -->
<template v-slot:prepend>
<q-icon
size="xs"
@ -168,6 +177,15 @@ onMounted(async () => {
color="positive"
/>
</template>
<template v-slot:append>
<q-icon
v-if="visaExpiryDate && !readonly"
name="mdi-close"
class="cursor-pointer"
size="xs"
@click="visaExpiryDate = undefined"
/>
</template>
</q-input>
</template>
</VueDatePicker>
@ -181,11 +199,11 @@ onMounted(async () => {
class="col-6"
:label="$t('formDialogInputVisaPlace')"
v-model="visaIssuingPlace"
:rules="[
/>
<!-- :rules="[
(val: string) =>
!!val || $t('selectValidate') + $t('formDialogInputVisaPlace'),
]"
/>
]" -->
<VueDatePicker
id="date-picker-visa-until"
utc
@ -210,12 +228,12 @@ onMounted(async () => {
:readonly="readonly"
:borderless="readonly"
:model-value="visaStayUntilDate ? dateFormat(visaStayUntilDate) : ''"
:rules="[
>
<!-- :rules="[
(val: string) =>
!!val ||
$t('selectValidate') + $t('formDialogInputVisaStayUntil'),
]"
>
]" -->
<template v-slot:prepend>
<q-icon
size="xs"
@ -246,11 +264,11 @@ onMounted(async () => {
class="col-6"
:label="$t('formDialogInputVisaTM6')"
v-model="tm6Number"
:rules="[
/>
<!-- :rules="[
(val: string) =>
!!val || $t('inputValidate') + $t('formDialogInputVisaTM6'),
]"
/>
]" -->
<VueDatePicker
id="date-picker-visa-enter"
utc
@ -274,11 +292,11 @@ onMounted(async () => {
:readonly="readonly"
:borderless="readonly"
:model-value="entryDate ? dateFormat(entryDate) : ''"
:rules="[
>
<!-- :rules="[
(val: string) =>
!!val || $t('selectValidate') + $t('formDialogInputVisaEnter'),
]"
>
]" -->
<template v-slot:prepend>
<q-icon
size="xs"
@ -287,6 +305,15 @@ onMounted(async () => {
color="positive"
/>
</template>
<template v-slot:append>
<q-icon
v-if="entryDate && !readonly"
name="mdi-close"
class="cursor-pointer"
size="xs"
@click="entryDate = undefined"
/>
</template>
</q-input>
</template>
</VueDatePicker>

2
src/components/FormDialog.vue
View file

@ -18,6 +18,7 @@ defineProps<{
maxWidth?: number;
employee?: boolean;
noAddress?: boolean;
disabledRule?: boolean;
submit?: (...args: unknown[]) => void;
close?: (...args: unknown[]) => void;
}>();
@ -159,6 +160,7 @@ const tabsList = defineModel<{ name: string; label: string }[]>('tabsList');
:employee="employee"
:title="titleFormAddress"
:separator="addressSeparator"
:disabledRule="disabledRule"
v-model:address="address"
v-model:addressEN="addressEN"
v-model:provinceId="provinceId"

4
src/pages/03_customer-management/MainPage.vue
View file

@ -1466,8 +1466,9 @@ watch(fieldSelectedCustomer, async () => {
</FormDialog>
<FormDialog
v-model:modal="dialogEmployee"
employee
disabledRule
v-model:modal="dialogEmployee"
addressSeparator
:noAddress="formDataEmployeeTab !== 'personalInfo'"
:noPaddingTab="
@ -2284,6 +2285,7 @@ watch(fieldSelectedCustomer, async () => {
v-model:districtId="formDataEmployee.districtId"
v-model:subDistrictId="formDataEmployee.subDistrictId"
v-model:zipCode="formDataEmployee.zipCode"
disabledRule
>
<template #person-card>
<div class="q-ma-md">