fix(02): resposive form and drawer

This commit is contained in:
puriphatt 2024-07-24 06:39:01 +00:00
parent 45398061c0
commit 0f7ec172f8
3 changed files with 60 additions and 35 deletions

View file

@ -31,17 +31,17 @@ defineProps<{
}>();
</script>
<template>
<div class="col-3 app-text-muted">
<div class="col-md-3 col-12 app-text-muted">
{{ title || $t('formDialogTitlePersonnel') }}
</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="input-first-name"
:dense="dense"
outlined
:readonly="readonly"
hide-bottom-space
class="col-3"
class="col-md-3 col-6"
:label="$t('formDialogInputFirstName')"
v-model="firstName"
:rules="[
@ -54,7 +54,7 @@ defineProps<{
outlined
:readonly="readonly"
hide-bottom-space
class="col-3"
class="col-md-3 col-6"
:label="$t('formDialogInputLastName')"
v-model="lastName"
:rules="[(val: string) => !!val || $t('formDialogInputLastNameValidate')]"
@ -65,7 +65,7 @@ defineProps<{
outlined
:readonly="readonly"
hide-bottom-space
class="col-3"
class="col-md-3 col-6"
:label="$t('formDialogInputFirstNameEN')"
v-model="firstNameEN"
:rules="[
@ -78,7 +78,7 @@ defineProps<{
outlined
:readonly="readonly"
hide-bottom-space
class="col-3"
class="col-md-3 col-6"
:label="$t('formDialogInputLastNameEN')"
v-model="lastNameEN"
:rules="[
@ -116,7 +116,7 @@ defineProps<{
emit-value
map-options
:label="$t('formDialogInputGender')"
class="col-3"
class="col-md-3 col-6"
option-label="label"
option-value="value"
v-model="gender"
@ -135,7 +135,7 @@ defineProps<{
:locale="$i18n.locale === 'th-th' ? 'th' : 'en'"
:enableTimePicker="false"
:disabled="readonly"
class="col-3"
class="col-md-3 col-6"
>
<template #year="{ value }">
{{ $i18n.locale === 'th-th' ? value + 543 : value }}
@ -190,7 +190,7 @@ defineProps<{
outlined
readonly
:label="$t('formDialogInputAge')"
class="col-3"
class="col-md-3 col-6"
:model-value="
birthDate?.toString() === 'Invalid Date' ||
birthDate?.toString() === undefined