history ข้อมูลครอบครัว

This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2023-09-14 14:33:48 +07:00
parent c4d42eb66f
commit fc86ff1e22
3 changed files with 706 additions and 366 deletions

View file

@ -13,7 +13,7 @@
:addEmployee="statusAdd()"
/>
<q-form ref="myform" class="col-12">
<div class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs">
<div class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs">
<div class="col-12 row q-pb-sm q-pt-md">
<div class="col-xs-2 col-sm-1 text-weight-bold"> ดา</div>
<div class="q-gutter-sm">
@ -409,7 +409,7 @@
</div>
<div
class="row col-12 q-col-gutter-xs"
class="row col-12 q-col-gutter-xs"
v-for="(items, index) in familyData.childrens"
:key="index"
>
@ -586,90 +586,90 @@
:disable="true"
/>
</div>
<div class="col-xs-6 col-sm-2 col-md-2">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].fatherCitizenId"
:label="`${'เลขที่บัตรประชาชน'}`"
maxlength="13"
mask="#############"
/>
</div>
<div class="col-xs-12 col-sm-2 col-md-2">
<selector
:hide-dropdown-icon="true"
hide-bottom-space
:class="getClass(false)"
:readonly="true"
:borderless="true"
:rules="[(val:string) => !!val || `${'กรุณาเลือก คำนำหน้าชื่อ'}`]"
:outlined="false"
dense
lazy-rules
v-model="familyDataHistory[indexRow].fatherPrefixId"
emit-value
map-options
option-label="name"
:options="Ops.prefixOps"
option-value="id"
:label="`${'คำนำหน้าชื่อ'}`"
use-input
input-debounce="0"
@filter="(inputValue:any,
<div class="row col-12">
<div class="col-3">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].fatherCitizenId"
:label="`${'เลขที่บัตรประชาชน'}`"
maxlength="13"
mask="#############"
/>
</div>
<div class="col-2">
<selector
:hide-dropdown-icon="true"
hide-bottom-space
:class="getClass(false)"
:readonly="true"
:borderless="true"
:rules="[(val:string) => !!val || `${'กรุณาเลือก คำนำหน้าชื่อ'}`]"
:outlined="false"
dense
lazy-rules
v-model="familyDataHistory[indexRow].fatherPrefixId"
emit-value
map-options
option-label="name"
:options="Ops.prefixOps"
option-value="id"
:label="`${'คำนำหน้าชื่อ'}`"
input-debounce="0"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'prefixOps'
) "
/>
/>
</div>
<div class="col">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].fatherFirstName"
:rules="[(val:string) => !!val || `${'กรุณากรอก ชื่อ'}`]"
:label="`${'ชื่อ'}`"
/>
</div>
<div class="col">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].fatherLastName"
:rules="[(val:string) => !!val || `${'กรุณากรอก นามสกุล'}`]"
:label="`${'นามสกุล'}`"
/>
</div>
<div class="col">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].fatherCareer"
:label="`${'อาชีพ'}`"
/>
</div>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].fatherFirstName"
:rules="[(val:string) => !!val || `${'กรุณากรอก ชื่อ'}`]"
:label="`${'ชื่อ'}`"
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].fatherLastName"
:rules="[(val:string) => !!val || `${'กรุณากรอก นามสกุล'}`]"
:label="`${'นามสกุล'}`"
/>
</div>
<div class="col-xs-12 col-sm-2 col-md-2">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].fatherCareer"
:label="`${'อาชีพ'}`"
/>
</div>
<div class="col-12 q-pt-md q-pb-sm"><q-separator /></div>
<div class="col-xs-12 text-weight-bold">
มารดา
<q-radio
@ -691,89 +691,90 @@
:disable="true"
/>
</div>
<div class="col-xs-6 col-sm-2 col-md-2">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].motherCitizenId"
:label="`${'เลขที่บัตรประชาชน'}`"
maxlength="13"
mask="#############"
/>
</div>
<div class="col-xs-12 col-sm-2 col-md-2">
<selector
:hide-dropdown-icon="true"
hide-bottom-space
:class="getClass(false)"
:readonly="true"
:borderless="true"
:rules="[(val:string) => !!val || `${'กรุณาเลือก คำนำหน้าชื่อ'}`]"
:outlined="false"
dense
lazy-rules
v-model="familyDataHistory[indexRow].motherPrefixId"
emit-value
map-options
option-label="name"
:options="Ops.prefixOps"
option-value="id"
:label="`${'คำนำหน้าชื่อ'}`"
use-input
input-debounce="0"
@filter="(inputValue:any,
<div class="row col-12">
<div class="col-3">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].motherCitizenId"
:label="`${'เลขที่บัตรประชาชน'}`"
maxlength="13"
mask="#############"
/>
</div>
<div class="col-2">
<selector
:hide-dropdown-icon="true"
hide-bottom-space
:class="getClass(false)"
:readonly="true"
:borderless="true"
:rules="[(val:string) => !!val || `${'กรุณาเลือก คำนำหน้าชื่อ'}`]"
:outlined="false"
dense
lazy-rules
v-model="familyDataHistory[indexRow].motherPrefixId"
emit-value
map-options
option-label="name"
:options="Ops.prefixOps"
option-value="id"
:label="`${'คำนำหน้าชื่อ'}`"
input-debounce="0"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'prefixOps'
) "
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].motherFirstName"
:rules="[(val:string) => !!val || `${'กรุณากรอก ชื่อ'}`]"
:label="`${'ชื่อ'}`"
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].motherLastName"
:rules="[(val:string) => !!val || `${'กรุณากรอก นามสกุล'}`]"
:label="`${'นามสกุล'}`"
/>
</div>
<div class="col-xs-12 col-sm-2 col-md-2">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].motherCareer"
:label="`${'อาชีพ'}`"
/>
/>
</div>
<div class="col">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].motherFirstName"
:rules="[(val:string) => !!val || `${'กรุณากรอก ชื่อ'}`]"
:label="`${'ชื่อ'}`"
/>
</div>
<div class="col">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].motherLastName"
:rules="[(val:string) => !!val || `${'กรุณากรอก นามสกุล'}`]"
:label="`${'นามสกุล'}`"
/>
</div>
<div class="col">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].motherCareer"
:label="`${'อาชีพ'}`"
/>
</div>
</div>
<div class="col-12 q-pt-md q-pb-sm"><q-separator /></div>
<div class="col-xs-12 q-gutter-sm items-center flex q-my-sm">
<label class="text-weight-bold"> สมรส</label>
<q-radio
@ -827,120 +828,105 @@
/>
</div>
</div>
<div
class="col-xs-6 col-sm-2 col-md-2"
v-if="familyDataHistory[indexRow].couple == '1'"
>
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].coupleCitizenId"
:label="`${'เลขที่บัตรประชาชน'}`"
maxlength="13"
mask="#############"
/>
</div>
<div
class="col-xs-12 col-sm-2 col-md-2"
class="row col-12"
v-if="familyDataHistory[indexRow].couple == '1'"
>
<selector
:hide-dropdown-icon="true"
hide-bottom-space
:class="getClass(false)"
:readonly="true"
:borderless="true"
:rules="[(val:string) => !!val || `${'กรุณาเลือก คำนำหน้าชื่อ'}`]"
:outlined="false"
dense
lazy-rules
v-model="familyDataHistory[indexRow].couplePrefixId"
emit-value
map-options
option-label="name"
:options="Ops.prefixOps"
option-value="id"
:label="`${'คำนำหน้าชื่อ'}`"
use-input
input-debounce="0"
@filter="(inputValue:any,
<div class="col-3">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].coupleCitizenId"
:label="`${'เลขที่บัตรประชาชน'}`"
maxlength="13"
mask="#############"
/>
</div>
<div class="col-2">
<selector
:hide-dropdown-icon="true"
hide-bottom-space
:class="getClass(false)"
:readonly="true"
:borderless="true"
:rules="[(val:string) => !!val || `${'กรุณาเลือก คำนำหน้าชื่อ'}`]"
:outlined="false"
dense
lazy-rules
v-model="familyDataHistory[indexRow].couplePrefixId"
emit-value
map-options
option-label="name"
:options="Ops.prefixOps"
option-value="id"
:label="`${'คำนำหน้าชื่อ'}`"
input-debounce="0"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'prefixOps'
) "
/>
</div>
<div
class="col-xs-6 col-sm-3 col-md-3"
v-if="familyDataHistory[indexRow].couple == '1'"
>
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].coupleFirstName"
:rules="[(val:string) => !!val || `${'กรุณากรอก ชื่อ'}`]"
:label="`${'ชื่อ'}`"
/>
</div>
<div
class="col-xs-6 col-sm-3 col-md-3"
v-if="familyDataHistory[indexRow].couple == '1'"
>
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].coupleLastName"
:rules="[(val:string) => !!val || `${'กรุณากรอก นามสกุล'}`]"
:label="`${'นามสกุล'}`"
/>
</div>
<div
class="col-xs-6 col-sm-2 col-md-2"
v-if="familyDataHistory[indexRow].couple == '1'"
>
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].coupleLastNameOld"
:rules="[(val:string) => !!val || `${'กรุณากรอก นามสกุล(เดิม)'}`]"
:label="`${'นามสกุล(เดิม)'}`"
/>
</div>
<div
class="col-xs-12 col-sm-2 col-md-2"
v-if="familyDataHistory[indexRow].couple == '1'"
>
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].coupleCareer"
:label="`${'อาชีพ'}`"
/>
/>
</div>
<div class="col">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].coupleFirstName"
:rules="[(val:string) => !!val || `${'กรุณากรอก ชื่อ'}`]"
:label="`${'ชื่อ'}`"
/>
</div>
<div class="col">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].coupleLastName"
:rules="[(val:string) => !!val || `${'กรุณากรอก นามสกุล'}`]"
:label="`${'นามสกุล'}`"
/>
</div>
<div class="col">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].coupleLastNameOld"
:rules="[(val:string) => !!val || `${'กรุณากรอก นามสกุล(เดิม)'}`]"
:label="`${'นามสกุล(เดิม)'}`"
/>
</div>
<div class="col">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="familyDataHistory[indexRow].coupleCareer"
:label="`${'อาชีพ'}`"
/>
</div>
</div>
<div class="col-12 q-pt-md q-pb-sm"><q-separator /></div>
@ -977,86 +963,87 @@
:disable="true"
/>
</div>
<div class="col-xs-6 col-sm-2 col-md-2">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="items.childrenCitizenId"
:label="`${'เลขที่บัตรประชาชน'}`"
maxlength="13"
mask="#############"
/>
</div>
<div class="col-xs-6 col-sm-2 col-md-2">
<selector
:hide-dropdown-icon="true"
hide-bottom-space
:class="getClass(false)"
:readonly="true"
:borderless="true"
:rules="[(val:string) => !!val || `${'กรุณาเลือก คำนำหน้าชื่อ'}`]"
:outlined="false"
dense
lazy-rules
v-model="items.childrenPrefixId"
emit-value
map-options
option-label="name"
:options="Ops.prefixOps"
option-value="id"
:label="`${'คำนำหน้าชื่อ'}`"
use-input
input-debounce="0"
@filter="(inputValue:any,
<div class="row col-12">
<div class="col-3">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="items.childrenCitizenId"
:label="`${'เลขที่บัตรประชาชน'}`"
maxlength="13"
mask="#############"
/>
</div>
<div class="col-2">
<selector
:hide-dropdown-icon="true"
hide-bottom-space
:class="getClass(false)"
:readonly="true"
:borderless="true"
:rules="[(val:string) => !!val || `${'กรุณาเลือก คำนำหน้าชื่อ'}`]"
:outlined="false"
dense
lazy-rules
v-model="items.childrenPrefixId"
emit-value
map-options
option-label="name"
:options="Ops.prefixOps"
option-value="id"
:label="`${'คำนำหน้าชื่อ'}`"
input-debounce="0"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'prefixOps'
) "
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="items.childrenFirstName"
:rules="[(val:string) => !!val || `${'กรุณากรอก ชื่อ'}`]"
:label="`${'ชื่อ'}`"
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="items.childrenLastName"
:rules="[(val:string) => !!val || `${'กรุณากรอก นามสกุล'}`]"
:label="`${'นามสกุล'}`"
/>
</div>
<div class="col-xs-12 col-sm-2 col-md-2">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="items.childrenCareer"
:label="`${'อาชีพ'}`"
/>
/>
</div>
<div class="col">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="items.childrenFirstName"
:rules="[(val:string) => !!val || `${'กรุณากรอก ชื่อ'}`]"
:label="`${'ชื่อ'}`"
/>
</div>
<div class="col">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="items.childrenLastName"
:rules="[(val:string) => !!val || `${'กรุณากรอก นามสกุล'}`]"
:label="`${'นามสกุล'}`"
/>
</div>
<div class="col">
<q-input
:class="getClass(false)"
hide-bottom-space
:outlined="false"
dense
lazy-rules
:readonly="true"
:borderless="true"
v-model="items.childrenCareer"
:label="`${'อาชีพ'}`"
/>
</div>
</div>
</div>
</div>
@ -1126,7 +1113,14 @@ const route = useRoute();
const $q = useQuasar();
const mixin = useCounterMixin();
const { date2Thai, success, messageError, showLoader, hideLoader ,dialogConfirm} = mixin;
const {
date2Thai,
success,
messageError,
showLoader,
hideLoader,
dialogConfirm,
} = mixin;
const edit = ref<boolean>(false);
const fix = ref<boolean>(true);
const myform = ref<QForm | null>(null);
@ -1456,9 +1450,9 @@ const addData = async () => {
// await changeBirth(informaData.value.birthDate ?? new Date());
// });
};
const saveData = () =>{
dialogConfirm($q,() => Datasave())
}
const saveData = () => {
dialogConfirm($q, () => Datasave());
};
const Datasave = async () => {
await myform.value?.validate().then(async (success: boolean) => {
if (success) {