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

fix: 01 form responsive

Browse source
This commit is contained in:
puriphatt 2024-07-23 04:57:35 +00:00
parent c05e26f36b
commit 331a45ad4e
7 changed files with 145 additions and 119 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -113,10 +113,13 @@ watch(districtId, fetchSubDistrict);
</div>
<div class="col-12 row q-col-gutter-y-md">
<div class="col-3 q-pl-xl app-text-muted">
<div
class="col-md-3 col-12 app-text-muted"
:class="{ 'q-pl-xl': !$q.screen.xs }"
>
{{ addressTitle || $t('formDialogTitleAddressPure') }}
</div>
<div class="col-9 row q-col-gutter-md">
<div class="col-md-9 col-12 row q-col-gutter-md">
<q-input
:for="`${id !== undefined ? `input-address-${id}` : 'input-address'}`"
:dense="dense"
@ -149,7 +152,7 @@ watch(districtId, fetchSubDistrict);
option-value="id"
option-label="name"
:label="$t('province')"
class="col-3"
class="col-md-3 col-6"
:options="addrOptions.provinceOps"
:rules="
disabledRule
@ -176,7 +179,7 @@ watch(districtId, fetchSubDistrict);
option-value="id"
option-label="name"
:label="$t('district')"
class="col-3"
class="col-md-3 col-6"
:options="addrOptions.districtOps"
:rules="
disabledRule
@ -202,7 +205,7 @@ watch(districtId, fetchSubDistrict);
option-value="id"
option-label="name"
:label="$t('subDistrict')"
class="col-3"
class="col-md-3 col-6"
:options="addrOptions.subDistrictOps"
:rules="
disabledRule
@ -221,14 +224,17 @@ watch(districtId, fetchSubDistrict);
outlined
readonly
:label="$t('zipCode')"
class="col-3"
class="col-md-3 col-6"
v-model="zipCode"
/>
</div>
<div class="col-3 q-pl-xl app-text-muted">
<div
class="col-md-3 col-12 app-text-muted"
:class="{ 'q-pl-xl': !$q.screen.xs }"
>
{{ addressTitleEN || $t('formDialogTitleAddressPureEN') }}
</div>
<div class="col-9 row q-col-gutter-md">
<div class="col-md-9 col-12 row q-col-gutter-md">
<q-input
:for="`${id !== undefined ? `input-address-en-${id}` : 'input-address-en'}`"
:dense="dense"
@ -261,7 +267,7 @@ watch(districtId, fetchSubDistrict);
option-value="id"
option-label="nameEN"
:label="$t('province')"
class="col-3"
class="col-md-3 col-6"
:options="addrOptions.provinceOps"
:rules="
disabledRule
@ -287,7 +293,7 @@ watch(districtId, fetchSubDistrict);
option-value="id"
option-label="nameEN"
:label="$t('district')"
class="col-3"
class="col-md-3 col-6"
:options="addrOptions.districtOps"
:rules="
disabledRule
@ -313,7 +319,7 @@ watch(districtId, fetchSubDistrict);
option-value="id"
option-label="nameEN"
:label="$t('subDistrict')"
class="col-3"
class="col-md-3 col-6"
:options="addrOptions.subDistrictOps"
:rules="
disabledRule
@ -334,7 +340,7 @@ watch(districtId, fetchSubDistrict);
readonly
zip="zip-en"
:label="$t('zipCode')"
class="col-3"
class="col-md-3 col-6"
v-model="zipCode"
/>
</div>