เช็คเบอร์โทร
This commit is contained in:
parent
457164331d
commit
2f6ac4318c
3 changed files with 951 additions and 730 deletions
|
|
@ -9,12 +9,22 @@
|
||||||
:editData="false"
|
:editData="false"
|
||||||
/>
|
/>
|
||||||
<q-form ref="myform">
|
<q-form ref="myform">
|
||||||
<div class="row col-12 items-center q-col-gutter-x-sm q-col-gutter-y-xs">
|
<div
|
||||||
|
class="row col-12 items-center q-col-gutter-x-sm q-col-gutter-y-xs"
|
||||||
|
>
|
||||||
<div class="col-xs-12 col-sm-3 col-md-2">
|
<div class="col-xs-12 col-sm-3 col-md-2">
|
||||||
<q-select
|
<q-select
|
||||||
:class="getClass(status == 'checkRegister' || status == 'payment')"
|
:class="
|
||||||
:readonly="!(status == 'checkRegister' || status == 'payment')"
|
getClass(
|
||||||
:borderless="!(status == 'checkRegister' || status == 'payment')"
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
)
|
||||||
|
"
|
||||||
|
:readonly="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
|
:borderless="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
:rules="[(val) => !!val || `${'กรุณาเลือก คำนำหน้า'}`]"
|
:rules="[(val) => !!val || `${'กรุณาเลือก คำนำหน้า'}`]"
|
||||||
:outlined="status == 'checkRegister' || status == 'payment'"
|
:outlined="status == 'checkRegister' || status == 'payment'"
|
||||||
dense
|
dense
|
||||||
|
|
@ -30,12 +40,20 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 col-sm-3 col-md-3">
|
<div class="col-xs-12 col-sm-3 col-md-3">
|
||||||
<q-input
|
<q-input
|
||||||
:class="getClass(status == 'checkRegister' || status == 'payment')"
|
:class="
|
||||||
|
getClass(
|
||||||
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
)
|
||||||
|
"
|
||||||
:outlined="status == 'checkRegister' || status == 'payment'"
|
:outlined="status == 'checkRegister' || status == 'payment'"
|
||||||
dense
|
dense
|
||||||
lazy-rules
|
lazy-rules
|
||||||
:readonly="!(status == 'checkRegister' || status == 'payment')"
|
:readonly="
|
||||||
:borderless="!(status == 'checkRegister' || status == 'payment')"
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
|
:borderless="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
v-model="defaultContact.contactFirstname"
|
v-model="defaultContact.contactFirstname"
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอก ชื่อ'}`]"
|
:rules="[(val) => !!val || `${'กรุณากรอก ชื่อ'}`]"
|
||||||
:label="`${'ชื่อ'}`"
|
:label="`${'ชื่อ'}`"
|
||||||
|
|
@ -43,12 +61,20 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 col-sm-3 col-md-3">
|
<div class="col-xs-12 col-sm-3 col-md-3">
|
||||||
<q-input
|
<q-input
|
||||||
:class="getClass(status == 'checkRegister' || status == 'payment')"
|
:class="
|
||||||
|
getClass(
|
||||||
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
)
|
||||||
|
"
|
||||||
:outlined="status == 'checkRegister' || status == 'payment'"
|
:outlined="status == 'checkRegister' || status == 'payment'"
|
||||||
dense
|
dense
|
||||||
lazy-rules
|
lazy-rules
|
||||||
:readonly="!(status == 'checkRegister' || status == 'payment')"
|
:readonly="
|
||||||
:borderless="!(status == 'checkRegister' || status == 'payment')"
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
|
:borderless="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
v-model="defaultContact.contactLastname"
|
v-model="defaultContact.contactLastname"
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอก นามสกุล'}`]"
|
:rules="[(val) => !!val || `${'กรุณากรอก นามสกุล'}`]"
|
||||||
:label="`${'นามสกุล'}`"
|
:label="`${'นามสกุล'}`"
|
||||||
|
|
@ -56,12 +82,20 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 col-sm-3 col-md-4">
|
<div class="col-xs-12 col-sm-3 col-md-4">
|
||||||
<q-input
|
<q-input
|
||||||
:class="getClass(status == 'checkRegister' || status == 'payment')"
|
:class="
|
||||||
|
getClass(
|
||||||
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
)
|
||||||
|
"
|
||||||
:outlined="status == 'checkRegister' || status == 'payment'"
|
:outlined="status == 'checkRegister' || status == 'payment'"
|
||||||
dense
|
dense
|
||||||
lazy-rules
|
lazy-rules
|
||||||
:readonly="!(status == 'checkRegister' || status == 'payment')"
|
:readonly="
|
||||||
:borderless="!(status == 'checkRegister' || status == 'payment')"
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
|
:borderless="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
v-model="defaultContact.contactRelations"
|
v-model="defaultContact.contactRelations"
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกความสัมพันธ์'}`]"
|
:rules="[(val) => !!val || `${'กรุณากรอกความสัมพันธ์'}`]"
|
||||||
:label="`${'เกี่ยวข้องเป็น'}`"
|
:label="`${'เกี่ยวข้องเป็น'}`"
|
||||||
|
|
@ -72,21 +106,32 @@
|
||||||
:outlined="status == 'checkRegister' || status == 'payment'"
|
:outlined="status == 'checkRegister' || status == 'payment'"
|
||||||
dense
|
dense
|
||||||
:counter="
|
:counter="
|
||||||
status == 'checkRegister' || status == 'payment' ? true : false
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
? true
|
||||||
|
: false
|
||||||
"
|
"
|
||||||
lazy-rules
|
lazy-rules
|
||||||
type="tel"
|
type="tel"
|
||||||
mask="##########"
|
mask="##########"
|
||||||
maxlength="10"
|
maxlength="10"
|
||||||
:class="getClass(status == 'checkRegister' || status == 'payment')"
|
:class="
|
||||||
:readonly="!(status == 'checkRegister' || status == 'payment')"
|
getClass(
|
||||||
:borderless="!(status == 'checkRegister' || status == 'payment')"
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
)
|
||||||
|
"
|
||||||
|
:readonly="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
|
:borderless="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
v-model="defaultContact.contactTel"
|
v-model="defaultContact.contactTel"
|
||||||
:label="`${'โทรศัพท์'}`"
|
:label="`${'โทรศัพท์'}`"
|
||||||
:rules="[
|
:rules="[
|
||||||
(val) => val.length == 10 || `${'กรุณากรอก โทรศัพท์'}`,
|
(val) => !!val || '* กรุณากรอกข้อมูลหมายเลขโทรศัพท์',
|
||||||
(val) =>
|
(val) =>
|
||||||
/^[0-9]*$/.test(val) || `${'กรุณากรอกข้อมูลโทรศัพท์ให้ถูกต้อง'}`,
|
(val.length >= 9 && val.length <= 10) ||
|
||||||
|
'กรุณากรอกข้อมูลหมายเลขโทรศัพท์ให้ถูกต้อง',
|
||||||
]"
|
]"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -18,21 +18,33 @@
|
||||||
>
|
>
|
||||||
<div class="col-xs-12 col-sm-4 col-md-4">
|
<div class="col-xs-12 col-sm-4 col-md-4">
|
||||||
<q-input
|
<q-input
|
||||||
:class="getClass(status == 'checkRegister' || status == 'payment')"
|
:class="
|
||||||
|
getClass(
|
||||||
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
)
|
||||||
|
"
|
||||||
:outlined="status == 'checkRegister' || status == 'payment'"
|
:outlined="status == 'checkRegister' || status == 'payment'"
|
||||||
dense
|
dense
|
||||||
type="tel"
|
type="tel"
|
||||||
mask="#############"
|
mask="#############"
|
||||||
:counter="
|
:counter="
|
||||||
status == 'checkRegister' || status == 'payment' ? true : false
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
? true
|
||||||
|
: false
|
||||||
"
|
"
|
||||||
lazy-rules
|
lazy-rules
|
||||||
:readonly="!(status == 'checkRegister' || status == 'payment')"
|
:readonly="
|
||||||
:borderless="!(status == 'checkRegister' || status == 'payment')"
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
|
:borderless="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
v-model="defaultInformation.cardid"
|
v-model="defaultInformation.cardid"
|
||||||
maxlength="13"
|
maxlength="13"
|
||||||
:rules="[
|
:rules="[
|
||||||
(val) => val.length == 13 || `${'กรุณากรอก เลขประจำตัวประชาชน'}`,
|
(val) =>
|
||||||
|
val.length == 13 ||
|
||||||
|
`${'กรุณากรอก เลขประจำตัวประชาชน'}`,
|
||||||
(val) =>
|
(val) =>
|
||||||
/^[0-9]*$/.test(val) ||
|
/^[0-9]*$/.test(val) ||
|
||||||
`${'กรุณากรอกเลขประจำตัวประชาชนให้ถูกต้อง'}`,
|
`${'กรุณากรอกเลขประจำตัวประชาชนให้ถูกต้อง'}`,
|
||||||
|
|
@ -42,9 +54,17 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 col-sm-2 col-md-2">
|
<div class="col-xs-12 col-sm-2 col-md-2">
|
||||||
<q-select
|
<q-select
|
||||||
:class="getClass(status == 'checkRegister' || status == 'payment')"
|
:class="
|
||||||
:readonly="!(status == 'checkRegister' || status == 'payment')"
|
getClass(
|
||||||
:borderless="!(status == 'checkRegister' || status == 'payment')"
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
)
|
||||||
|
"
|
||||||
|
:readonly="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
|
:borderless="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
:rules="[(val) => !!val || `${'กรุณาเลือก คำนำหน้าชื่อ'}`]"
|
:rules="[(val) => !!val || `${'กรุณาเลือก คำนำหน้าชื่อ'}`]"
|
||||||
:outlined="status == 'checkRegister' || status == 'payment'"
|
:outlined="status == 'checkRegister' || status == 'payment'"
|
||||||
dense
|
dense
|
||||||
|
|
@ -60,12 +80,20 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 col-sm-3 col-md-3">
|
<div class="col-xs-12 col-sm-3 col-md-3">
|
||||||
<q-input
|
<q-input
|
||||||
:class="getClass(status == 'checkRegister' || status == 'payment')"
|
:class="
|
||||||
|
getClass(
|
||||||
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
)
|
||||||
|
"
|
||||||
:outlined="status == 'checkRegister' || status == 'payment'"
|
:outlined="status == 'checkRegister' || status == 'payment'"
|
||||||
dense
|
dense
|
||||||
lazy-rules
|
lazy-rules
|
||||||
:readonly="!(status == 'checkRegister' || status == 'payment')"
|
:readonly="
|
||||||
:borderless="!(status == 'checkRegister' || status == 'payment')"
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
|
:borderless="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
v-model="defaultInformation.firstname"
|
v-model="defaultInformation.firstname"
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอก ชื่อ'}`]"
|
:rules="[(val) => !!val || `${'กรุณากรอก ชื่อ'}`]"
|
||||||
:label="`${'ชื่อ'}`"
|
:label="`${'ชื่อ'}`"
|
||||||
|
|
@ -73,12 +101,20 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 col-sm-3 col-md-3">
|
<div class="col-xs-12 col-sm-3 col-md-3">
|
||||||
<q-input
|
<q-input
|
||||||
:class="getClass(status == 'checkRegister' || status == 'payment')"
|
:class="
|
||||||
|
getClass(
|
||||||
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
)
|
||||||
|
"
|
||||||
:outlined="status == 'checkRegister' || status == 'payment'"
|
:outlined="status == 'checkRegister' || status == 'payment'"
|
||||||
dense
|
dense
|
||||||
lazy-rules
|
lazy-rules
|
||||||
:readonly="!(status == 'checkRegister' || status == 'payment')"
|
:readonly="
|
||||||
:borderless="!(status == 'checkRegister' || status == 'payment')"
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
|
:borderless="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
v-model="defaultInformation.lastname"
|
v-model="defaultInformation.lastname"
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอก นามสกุล'}`]"
|
:rules="[(val) => !!val || `${'กรุณากรอก นามสกุล'}`]"
|
||||||
:label="`${'นามสกุล'}`"
|
:label="`${'นามสกุล'}`"
|
||||||
|
|
@ -97,9 +133,17 @@
|
||||||
:label="`${'สัญชาติ'}`"
|
:label="`${'สัญชาติ'}`"
|
||||||
/> -->
|
/> -->
|
||||||
<q-select
|
<q-select
|
||||||
:class="getClass(status == 'checkRegister' || status == 'payment')"
|
:class="
|
||||||
:readonly="!(status == 'checkRegister' || status == 'payment')"
|
getClass(
|
||||||
:borderless="!(status == 'checkRegister' || status == 'payment')"
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
)
|
||||||
|
"
|
||||||
|
:readonly="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
|
:borderless="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอก สัญชาติ'}`]"
|
:rules="[(val) => !!val || `${'กรุณากรอก สัญชาติ'}`]"
|
||||||
:outlined="status == 'checkRegister' || status == 'payment'"
|
:outlined="status == 'checkRegister' || status == 'payment'"
|
||||||
dense
|
dense
|
||||||
|
|
@ -111,9 +155,17 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 col-sm-3 col-md-3">
|
<div class="col-xs-12 col-sm-3 col-md-3">
|
||||||
<q-select
|
<q-select
|
||||||
:class="getClass(status == 'checkRegister' || status == 'payment')"
|
:class="
|
||||||
:readonly="!(status == 'checkRegister' || status == 'payment')"
|
getClass(
|
||||||
:borderless="!(status == 'checkRegister' || status == 'payment')"
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
)
|
||||||
|
"
|
||||||
|
:readonly="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
|
:borderless="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
:rules="[(val) => !!val || `${'กรุณาเลือก ศาสนา'}`]"
|
:rules="[(val) => !!val || `${'กรุณาเลือก ศาสนา'}`]"
|
||||||
:outlined="status == 'checkRegister' || status == 'payment'"
|
:outlined="status == 'checkRegister' || status == 'payment'"
|
||||||
dense
|
dense
|
||||||
|
|
@ -135,7 +187,9 @@
|
||||||
:enableTimePicker="false"
|
:enableTimePicker="false"
|
||||||
week-start="0"
|
week-start="0"
|
||||||
:max-date="new Date()"
|
:max-date="new Date()"
|
||||||
:disabled="!(status == 'checkRegister' || status == 'payment')"
|
:disabled="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
@update:modelValue="selectBirthDate"
|
@update:modelValue="selectBirthDate"
|
||||||
>
|
>
|
||||||
<template #year="{ year }">
|
<template #year="{ year }">
|
||||||
|
|
@ -147,19 +201,38 @@
|
||||||
<template #trigger>
|
<template #trigger>
|
||||||
<q-input
|
<q-input
|
||||||
:class="
|
:class="
|
||||||
getClass(status == 'checkRegister' || status == 'payment')
|
getClass(
|
||||||
|
status == 'checkRegister' ||
|
||||||
|
status == 'payment'
|
||||||
|
)
|
||||||
|
"
|
||||||
|
:outlined="
|
||||||
|
status == 'checkRegister' || status == 'payment'
|
||||||
"
|
"
|
||||||
:outlined="status == 'checkRegister' || status == 'payment'"
|
|
||||||
dense
|
dense
|
||||||
lazy-rules
|
lazy-rules
|
||||||
:readonly="!(status == 'checkRegister' || status == 'payment')"
|
:readonly="
|
||||||
:borderless="!(status == 'checkRegister' || status == 'payment')"
|
!(
|
||||||
|
status == 'checkRegister' ||
|
||||||
|
status == 'payment'
|
||||||
|
)
|
||||||
|
"
|
||||||
|
:borderless="
|
||||||
|
!(
|
||||||
|
status == 'checkRegister' ||
|
||||||
|
status == 'payment'
|
||||||
|
)
|
||||||
|
"
|
||||||
:model-value="
|
:model-value="
|
||||||
defaultInformation.birthDate == null
|
defaultInformation.birthDate == null
|
||||||
? null
|
? null
|
||||||
: date2Thai(defaultInformation.birthDate)
|
: date2Thai(defaultInformation.birthDate)
|
||||||
"
|
"
|
||||||
:rules="[(val) => !!val || `${'กรุณาเลือก วัน/เดือน/ปี เกิด'}`]"
|
:rules="[
|
||||||
|
(val) =>
|
||||||
|
!!val ||
|
||||||
|
`${'กรุณาเลือก วัน/เดือน/ปี เกิด'}`,
|
||||||
|
]"
|
||||||
:label="`${'วัน/เดือน/ปี เกิด'}`"
|
:label="`${'วัน/เดือน/ปี เกิด'}`"
|
||||||
>
|
>
|
||||||
<template v-slot:prepend>
|
<template v-slot:prepend>
|
||||||
|
|
@ -168,7 +241,8 @@
|
||||||
class="cursor-pointer"
|
class="cursor-pointer"
|
||||||
size="22px"
|
size="22px"
|
||||||
:style="
|
:style="
|
||||||
status == 'checkRegister' || status == 'payment'
|
status == 'checkRegister' ||
|
||||||
|
status == 'payment'
|
||||||
? 'color: var(--q-primary)'
|
? 'color: var(--q-primary)'
|
||||||
: 'color: var(--q-grey)'
|
: 'color: var(--q-grey)'
|
||||||
"
|
"
|
||||||
|
|
@ -181,7 +255,11 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 col-sm-3 col-md-3 q-pb-md">
|
<div class="col-xs-12 col-sm-3 col-md-3 q-pb-md">
|
||||||
<q-input
|
<q-input
|
||||||
:class="getClass(status == 'checkRegister' || status == 'payment')"
|
:class="
|
||||||
|
getClass(
|
||||||
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
)
|
||||||
|
"
|
||||||
dense
|
dense
|
||||||
lazy-rules
|
lazy-rules
|
||||||
readonly
|
readonly
|
||||||
|
|
@ -204,21 +282,31 @@
|
||||||
:outlined="status == 'checkRegister' || status == 'payment'"
|
:outlined="status == 'checkRegister' || status == 'payment'"
|
||||||
dense
|
dense
|
||||||
:counter="
|
:counter="
|
||||||
status == 'checkRegister' || status == 'payment' ? true : false
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
? true
|
||||||
|
: false
|
||||||
"
|
"
|
||||||
lazy-rules
|
lazy-rules
|
||||||
type="tel"
|
type="tel"
|
||||||
mask="##########"
|
mask="##########"
|
||||||
maxlength="10"
|
maxlength="10"
|
||||||
:class="getClass(status == 'checkRegister' || status == 'payment')"
|
:class="
|
||||||
:readonly="!(status == 'checkRegister' || status == 'payment')"
|
getClass(
|
||||||
:borderless="!(status == 'checkRegister' || status == 'payment')"
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
)
|
||||||
|
"
|
||||||
|
:readonly="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
|
:borderless="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
v-model="defaultInformation.tel"
|
v-model="defaultInformation.tel"
|
||||||
:rules="[
|
:rules="[
|
||||||
(val) => !!val || `${'กรุณากรอก เบอร์โทร'}`,
|
(val) => !!val || '* กรุณากรอกข้อมูลหมายเลขโทรศัพท์',
|
||||||
(val) => val.length == 10 || `${'กรุณากรอก เบอร์โทร'}`,
|
|
||||||
(val) =>
|
(val) =>
|
||||||
/^[0-9]*$/.test(val) || `${'กรุณากรอกข้อมูลเบอร์โทรให้ถูกต้อง'}`,
|
(val.length >= 9 && val.length <= 10) ||
|
||||||
|
'กรุณากรอกข้อมูลหมายเลขโทรศัพท์ให้ถูกต้อง',
|
||||||
]"
|
]"
|
||||||
:label="`${'เบอร์โทร'}`"
|
:label="`${'เบอร์โทร'}`"
|
||||||
/>
|
/>
|
||||||
|
|
@ -339,7 +427,11 @@
|
||||||
</div> -->
|
</div> -->
|
||||||
<div class="col-xs-12 col-sm-3 col-md-3 q-pb-md">
|
<div class="col-xs-12 col-sm-3 col-md-3 q-pb-md">
|
||||||
<q-input
|
<q-input
|
||||||
:class="getClass(status == 'checkRegister' || status == 'payment')"
|
:class="
|
||||||
|
getClass(
|
||||||
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
)
|
||||||
|
"
|
||||||
dense
|
dense
|
||||||
lazy-rules
|
lazy-rules
|
||||||
readonly
|
readonly
|
||||||
|
|
@ -355,10 +447,16 @@
|
||||||
class="containerimage row justify-center col-xs-6 col-sm-10 col-md-12"
|
class="containerimage row justify-center col-xs-6 col-sm-10 col-md-12"
|
||||||
>
|
>
|
||||||
<label for="file-upload" class="col-12 row">
|
<label for="file-upload" class="col-12 row">
|
||||||
<q-img v-if="img == ''" src="@/assets/avatar_user.jpg" class="col-12">
|
<q-img
|
||||||
|
v-if="img == ''"
|
||||||
|
src="@/assets/avatar_user.jpg"
|
||||||
|
class="col-12"
|
||||||
|
>
|
||||||
<div
|
<div
|
||||||
class="overlay"
|
class="overlay"
|
||||||
v-if="status == 'checkRegister' || status == 'payment'"
|
v-if="
|
||||||
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
"
|
||||||
>
|
>
|
||||||
<q-icon name="mdi-camera" />
|
<q-icon name="mdi-camera" />
|
||||||
<br />อัปเดต
|
<br />อัปเดต
|
||||||
|
|
@ -367,7 +465,9 @@
|
||||||
<q-img v-else :src="img" class="col-12">
|
<q-img v-else :src="img" class="col-12">
|
||||||
<div
|
<div
|
||||||
class="overlay"
|
class="overlay"
|
||||||
v-if="status == 'checkRegister' || status == 'payment'"
|
v-if="
|
||||||
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
"
|
||||||
>
|
>
|
||||||
<q-icon name="mdi-camera" />
|
<q-icon name="mdi-camera" />
|
||||||
<br />อัปเดต
|
<br />อัปเดต
|
||||||
|
|
@ -503,9 +603,13 @@ const fetchData = async () => {
|
||||||
defaultInformation.value.email =
|
defaultInformation.value.email =
|
||||||
keycloak.tokenParsed == null ? "" : keycloak.tokenParsed.email;
|
keycloak.tokenParsed == null ? "" : keycloak.tokenParsed.email;
|
||||||
defaultInformation.value.firstname =
|
defaultInformation.value.firstname =
|
||||||
keycloak.tokenParsed == null ? "" : keycloak.tokenParsed.given_name;
|
keycloak.tokenParsed == null
|
||||||
|
? ""
|
||||||
|
: keycloak.tokenParsed.given_name;
|
||||||
defaultInformation.value.lastname =
|
defaultInformation.value.lastname =
|
||||||
keycloak.tokenParsed == null ? "" : keycloak.tokenParsed.family_name;
|
keycloak.tokenParsed == null
|
||||||
|
? ""
|
||||||
|
: keycloak.tokenParsed.family_name;
|
||||||
})
|
})
|
||||||
.finally(() => {
|
.finally(() => {
|
||||||
hideLoader();
|
hideLoader();
|
||||||
|
|
@ -611,7 +715,8 @@ const selectBirthDate = async () => {
|
||||||
padding: 1%;
|
padding: 1%;
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
border: solid 2px rgba(168, 168, 168, 0.055) !important;
|
border: solid 2px rgba(168, 168, 168, 0.055) !important;
|
||||||
box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.048), 0 3px 6px 0 rgba(0, 0, 0, 0.097);
|
box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.048),
|
||||||
|
0 3px 6px 0 rgba(0, 0, 0, 0.097);
|
||||||
}
|
}
|
||||||
|
|
||||||
.overlay {
|
.overlay {
|
||||||
|
|
|
||||||
|
|
@ -16,48 +16,76 @@
|
||||||
label="ลูกจ้างประจำ"
|
label="ลูกจ้างประจำ"
|
||||||
color="teal"
|
color="teal"
|
||||||
val="prem"
|
val="prem"
|
||||||
:disable="!(status == 'checkRegister' || status == 'payment')"
|
:disable="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
/>
|
/>
|
||||||
<q-radio
|
<q-radio
|
||||||
v-model="defaultOccupation.positionType"
|
v-model="defaultOccupation.positionType"
|
||||||
label="ลูกจ้างชั่วคราว"
|
label="ลูกจ้างชั่วคราว"
|
||||||
color="teal"
|
color="teal"
|
||||||
val="temp"
|
val="temp"
|
||||||
:disable="!(status == 'checkRegister' || status == 'payment')"
|
:disable="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
/>
|
/>
|
||||||
<q-radio
|
<q-radio
|
||||||
v-model="defaultOccupation.positionType"
|
v-model="defaultOccupation.positionType"
|
||||||
label="ผู้ปฏิบัติงานอื่นในกรุงเทพมหานคร"
|
label="ผู้ปฏิบัติงานอื่นในกรุงเทพมหานคร"
|
||||||
color="teal"
|
color="teal"
|
||||||
val="other"
|
val="other"
|
||||||
:disable="!(status == 'checkRegister' || status == 'payment')"
|
:disable="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-12 row q-col-gutter-sm">
|
<div class="col-12 row q-col-gutter-sm">
|
||||||
<div class="col-4">
|
<div class="col-4">
|
||||||
<q-input
|
<q-input
|
||||||
:class="getClass(status == 'checkRegister' || status == 'payment')"
|
:class="
|
||||||
:outlined="status == 'checkRegister' || status == 'payment'"
|
getClass(
|
||||||
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
)
|
||||||
|
"
|
||||||
|
:outlined="
|
||||||
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
"
|
||||||
dense
|
dense
|
||||||
lazy-rules
|
lazy-rules
|
||||||
autogrow
|
autogrow
|
||||||
:readonly="!(status == 'checkRegister' || status == 'payment')"
|
:readonly="
|
||||||
:borderless="!(status == 'checkRegister' || status == 'payment')"
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
|
:borderless="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
v-model="defaultOccupation.position"
|
v-model="defaultOccupation.position"
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอก ชื่อตำแหน่ง'}`]"
|
:rules="[
|
||||||
|
(val) => !!val || `${'กรุณากรอก ชื่อตำแหน่ง'}`,
|
||||||
|
]"
|
||||||
:label="`${'ชื่อตำแหน่ง'}`"
|
:label="`${'ชื่อตำแหน่ง'}`"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-4">
|
<div class="col-4">
|
||||||
<q-input
|
<q-input
|
||||||
:class="getClass(status == 'checkRegister' || status == 'payment')"
|
:class="
|
||||||
:outlined="status == 'checkRegister' || status == 'payment'"
|
getClass(
|
||||||
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
)
|
||||||
|
"
|
||||||
|
:outlined="
|
||||||
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
"
|
||||||
dense
|
dense
|
||||||
lazy-rules
|
lazy-rules
|
||||||
type="number"
|
type="number"
|
||||||
autogrow
|
autogrow
|
||||||
:readonly="!(status == 'checkRegister' || status == 'payment')"
|
:readonly="
|
||||||
:borderless="!(status == 'checkRegister' || status == 'payment')"
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
|
:borderless="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
v-model="defaultOccupation.salary"
|
v-model="defaultOccupation.salary"
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอก เงินเดือน'}`]"
|
:rules="[(val) => !!val || `${'กรุณากรอก เงินเดือน'}`]"
|
||||||
:label="`${'เงินเดือน'}`"
|
:label="`${'เงินเดือน'}`"
|
||||||
|
|
@ -66,13 +94,23 @@
|
||||||
|
|
||||||
<div class="col-4">
|
<div class="col-4">
|
||||||
<q-input
|
<q-input
|
||||||
:class="getClass(status == 'checkRegister' || status == 'payment')"
|
:class="
|
||||||
:outlined="status == 'checkRegister' || status == 'payment'"
|
getClass(
|
||||||
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
)
|
||||||
|
"
|
||||||
|
:outlined="
|
||||||
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
"
|
||||||
dense
|
dense
|
||||||
lazy-rules
|
lazy-rules
|
||||||
autogrow
|
autogrow
|
||||||
:readonly="!(status == 'checkRegister' || status == 'payment')"
|
:readonly="
|
||||||
:borderless="!(status == 'checkRegister' || status == 'payment')"
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
|
:borderless="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
v-model="defaultOccupation.group"
|
v-model="defaultOccupation.group"
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอก กลุ่ม/ฝ่าย'}`]"
|
:rules="[(val) => !!val || `${'กรุณากรอก กลุ่ม/ฝ่าย'}`]"
|
||||||
:label="`${'กลุ่ม/ฝ่าย'}`"
|
:label="`${'กลุ่ม/ฝ่าย'}`"
|
||||||
|
|
@ -80,13 +118,23 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="col-4">
|
<div class="col-4">
|
||||||
<q-input
|
<q-input
|
||||||
:class="getClass(status == 'checkRegister' || status == 'payment')"
|
:class="
|
||||||
:outlined="status == 'checkRegister' || status == 'payment'"
|
getClass(
|
||||||
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
)
|
||||||
|
"
|
||||||
|
:outlined="
|
||||||
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
"
|
||||||
dense
|
dense
|
||||||
lazy-rules
|
lazy-rules
|
||||||
autogrow
|
autogrow
|
||||||
:readonly="!(status == 'checkRegister' || status == 'payment')"
|
:readonly="
|
||||||
:borderless="!(status == 'checkRegister' || status == 'payment')"
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
|
:borderless="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
v-model="defaultOccupation.pile"
|
v-model="defaultOccupation.pile"
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอก กอง'}`]"
|
:rules="[(val) => !!val || `${'กรุณากรอก กอง'}`]"
|
||||||
:label="`${'กอง'}`"
|
:label="`${'กอง'}`"
|
||||||
|
|
@ -94,13 +142,23 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="col-4">
|
<div class="col-4">
|
||||||
<q-input
|
<q-input
|
||||||
:class="getClass(status == 'checkRegister' || status == 'payment')"
|
:class="
|
||||||
:outlined="status == 'checkRegister' || status == 'payment'"
|
getClass(
|
||||||
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
)
|
||||||
|
"
|
||||||
|
:outlined="
|
||||||
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
"
|
||||||
dense
|
dense
|
||||||
lazy-rules
|
lazy-rules
|
||||||
autogrow
|
autogrow
|
||||||
:readonly="!(status == 'checkRegister' || status == 'payment')"
|
:readonly="
|
||||||
:borderless="!(status == 'checkRegister' || status == 'payment')"
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
|
:borderless="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
v-model="defaultOccupation.org"
|
v-model="defaultOccupation.org"
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอก สังกัด'}`]"
|
:rules="[(val) => !!val || `${'กรุณากรอก สังกัด'}`]"
|
||||||
:label="`${'สังกัด'}`"
|
:label="`${'สังกัด'}`"
|
||||||
|
|
@ -108,25 +166,38 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="col-4">
|
<div class="col-4">
|
||||||
<q-input
|
<q-input
|
||||||
:class="getClass(status == 'checkRegister' || status == 'payment')"
|
:class="
|
||||||
:outlined="status == 'checkRegister' || status == 'payment'"
|
getClass(
|
||||||
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
)
|
||||||
|
"
|
||||||
|
:outlined="
|
||||||
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
"
|
||||||
dense
|
dense
|
||||||
:counter="
|
:counter="
|
||||||
status == 'checkRegister' || status == 'payment' ? true : false
|
status == 'checkRegister' || status == 'payment'
|
||||||
|
? true
|
||||||
|
: false
|
||||||
"
|
"
|
||||||
maxlength="10"
|
maxlength="10"
|
||||||
lazy-rules
|
lazy-rules
|
||||||
type="tel"
|
type="tel"
|
||||||
mask="##########"
|
mask="##########"
|
||||||
autogrow
|
autogrow
|
||||||
:readonly="!(status == 'checkRegister' || status == 'payment')"
|
:readonly="
|
||||||
:borderless="!(status == 'checkRegister' || status == 'payment')"
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
|
:borderless="
|
||||||
|
!(status == 'checkRegister' || status == 'payment')
|
||||||
|
"
|
||||||
v-model="defaultOccupation.tel"
|
v-model="defaultOccupation.tel"
|
||||||
:rules="[
|
:rules="[
|
||||||
(val) => !!val || `${'กรุณากรอก เบอร์โทรที่ทำงาน'}`,
|
|
||||||
(val) => val.length == 10 || `${'กรุณากรอก เบอร์โทรที่ทำงาน'}`,
|
|
||||||
(val) =>
|
(val) =>
|
||||||
/^[0-9]*$/.test(val) || 'กรุณากรอก เบอร์โทรที่ทำงานให้ถูกต้อง',
|
!!val || '* กรุณากรอกข้อมูลหมายเลขโทรศัพท์',
|
||||||
|
(val) =>
|
||||||
|
(val.length >= 9 && val.length <= 10) ||
|
||||||
|
'กรุณากรอกข้อมูลหมายเลขโทรศัพท์ให้ถูกต้อง',
|
||||||
]"
|
]"
|
||||||
:label="`${'เบอร์โทรที่ทำงาน'}`"
|
:label="`${'เบอร์โทรที่ทำงาน'}`"
|
||||||
/>
|
/>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue