ปรับ ui สรรหาสอบคัดเลือก

This commit is contained in:
Kittapath 2023-10-02 00:21:32 +07:00
parent 9b910afc6e
commit 178a6ac8c7
10 changed files with 752 additions and 1184 deletions

View file

@ -16,7 +16,7 @@
<div
class="row col-xs-12 col-sm-12 col-md-10 items-center q-col-gutter-x-sm q-col-gutter-y-xs"
>
<div class="col-xs-12 col-sm-2 col-md-2">
<div class="col-xs-12 col-sm-3 col-md-3">
<q-select
:class="getClass(status == 'checkRegister' || status == 'payment')"
:readonly="!(status == 'checkRegister' || status == 'payment')"
@ -34,7 +34,7 @@
:label="`${'คำนำหน้าชื่อ'}`"
/>
</div>
<div class="col-xs-12 col-sm-5 col-md-5">
<div class="col-xs-12 col-sm-3 col-md-3">
<q-input
:class="getClass(status == 'checkRegister' || status == 'payment')"
:outlined="status == 'checkRegister' || status == 'payment'"
@ -47,7 +47,7 @@
:label="`${'ชื่อ'}`"
/>
</div>
<div class="col-xs-12 col-sm-5 col-md-5">
<div class="col-xs-12 col-sm-3 col-md-3">
<q-input
:class="getClass(status == 'checkRegister' || status == 'payment')"
:outlined="status == 'checkRegister' || status == 'payment'"
@ -73,6 +73,24 @@
:label="`${'สัญชาติ'}`"
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3">
<q-select
:class="getClass(status == 'checkRegister' || status == 'payment')"
:readonly="!(status == 'checkRegister' || status == 'payment')"
:borderless="!(status == 'checkRegister' || status == 'payment')"
:rules="[(val) => !!val || `${'กรุณาเลือก ศาสนา'}`]"
:outlined="status == 'checkRegister' || status == 'payment'"
dense
lazy-rules
v-model="defaultInformation.religionId"
emit-value
map-options
option-label="name"
:options="religionOptions"
option-value="id"
:label="`${'ศาสนา'}`"
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3">
<datepicker
v-model="defaultInformation.birthDate"
@ -145,21 +163,26 @@
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3">
<q-select
<q-input
:outlined="status == 'checkRegister' || status == 'payment'"
dense
:counter="
status == 'checkRegister' || status == 'payment' ? true : false
"
lazy-rules
type="tel"
mask="##########"
maxlength="10"
:class="getClass(status == 'checkRegister' || status == 'payment')"
:readonly="!(status == 'checkRegister' || status == 'payment')"
:borderless="!(status == 'checkRegister' || status == 'payment')"
:rules="[(val) => !!val || `${'กรุณาเลือก ศาสนา'}`]"
:outlined="status == 'checkRegister' || status == 'payment'"
dense
lazy-rules
v-model="defaultInformation.religionId"
emit-value
map-options
option-label="name"
:options="religionOptions"
option-value="id"
:label="`${'ศาสนา'}`"
v-model="defaultInformation.tel"
:rules="[
(val) => val.length == 10 || `${'กรุณากรอก เบอร์โทร'}`,
(val) =>
/^[0-9]*$/.test(val) || `${'กรุณากรอกข้อมูลเบอร์โทรให้ถูกต้อง'}`,
]"
:label="`${'เบอร์โทร'}`"
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3">
@ -276,30 +299,7 @@
</template>
</datepicker>
</div> -->
<div class="col-xs-12 col-sm-3 col-md-3">
<q-input
:outlined="status == 'checkRegister' || status == 'payment'"
dense
:counter="
status == 'checkRegister' || status == 'payment' ? true : false
"
lazy-rules
type="tel"
mask="##########"
maxlength="10"
:class="getClass(status == 'checkRegister' || status == 'payment')"
:readonly="!(status == 'checkRegister' || status == 'payment')"
:borderless="!(status == 'checkRegister' || status == 'payment')"
v-model="defaultInformation.tel"
:rules="[
(val) => val.length == 10 || `${'กรุณากรอก โทรศัพท์'}`,
(val) =>
/^[0-9]*$/.test(val) || `${'กรุณากรอกข้อมูลโทรศัพท์ให้ถูกต้อง'}`,
]"
:label="`${'โทรศัพท์'}`"
/>
</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
:outlined="status == 'checkRegister' || status == 'payment'"
dense
@ -322,7 +322,7 @@
]"
:label="`${'โทรศัพท์มือถือ'}`"
/>
</div>
</div> -->
<div class="col-xs-12 col-sm-3 col-md-3 q-pb-md">
<q-input
:class="getClass(status == 'checkRegister' || status == 'payment')"