fix: all date picker input

This commit is contained in:
puriphatt 2024-07-17 10:49:36 +00:00
parent dedb589b99
commit 7b262d34d7
8 changed files with 240 additions and 49 deletions

View file

@ -2,8 +2,10 @@
import useUserStore from 'src/stores/user';
import { UserAttachmentDelete } from 'src/stores/user/types';
import { dialog } from 'src/stores/utils';
import { dateFormat } from 'src/utils/datetime';
import { dateFormat, parseAndFormatDate } from 'src/utils/datetime';
import { useI18n } from 'vue-i18n';
const { locale } = useI18n();
const userStore = useUserStore();
const userId = defineModel<string>('userId');
@ -83,6 +85,7 @@ function deleteFile(name: string) {
v-model="registrationNo"
/>
<VueDatePicker
id="input-startDate"
utc
autoApply
:dark="$q.dark.isActive"
@ -106,7 +109,20 @@ function deleteFile(name: string) {
:dense="dense"
outlined
:readonly="readonly"
:model-value="startDate ? dateFormat(startDate) : ''"
placeholder="DD/MM/YYYY"
:mask="readonly ? '' : '##/##/####'"
:model-value="
startDate && readonly
? dateFormat(startDate)
: dateFormat(startDate, false, false, true)
"
@update:model-value="
(v) => {
if (v && v.toString().length === 10) {
startDate = parseAndFormatDate(v, locale);
}
}
"
>
<template v-slot:prepend>
<q-icon
@ -153,7 +169,20 @@ function deleteFile(name: string) {
:dense="dense"
outlined
:readonly="readonly"
:model-value="retireDate ? dateFormat(retireDate) : ''"
placeholder="DD/MM/YYYY"
:mask="readonly ? '' : '##/##/####'"
:model-value="
retireDate && readonly
? dateFormat(retireDate)
: dateFormat(retireDate, false, false, true)
"
@update:model-value="
(v) => {
if (v && v.toString().length === 10) {
retireDate = parseAndFormatDate(v, locale);
}
}
"
>
<template v-slot:prepend>
<q-icon

View file

@ -6,7 +6,9 @@ import {
parseAndFormatDate,
disabledAfterToday,
} from 'src/utils/datetime';
import { useI18n } from 'vue-i18n';
const { locale } = useI18n();
const optionStore = useOptionStore();
const firstName = defineModel<string>('firstName');
@ -143,14 +145,8 @@ defineProps<{
</template>
<template #trigger>
<q-input
id="input-birth-date"
for="input-birth-date"
hide-bottom-space
:mask="
birthDate?.toString() === 'Invalid Date' ||
birthDate?.toString() === undefined
? '##/##/####'
: ''
"
placeholder="DD/MM/YYYY"
:label="$t('formDialogInputBirthDate')"
:dense="dense"
@ -160,15 +156,19 @@ defineProps<{
(val: string) =>
!!val || $t('selectValidate') + $t('formDialogInputBirthDate'),
]"
:model-value="birthDate ? dateFormat(birthDate) : ''"
:mask="readonly ? '' : '##/##/####'"
:model-value="
birthDate && readonly
? dateFormat(birthDate)
: dateFormat(birthDate, false, false, true)
"
@update:model-value="
(v) => {
if (v && v.toString().length === 10) {
const today = new Date();
const date = parseAndFormatDate(v);
const date = parseAndFormatDate(v, locale);
birthDate = date && date > today ? today : date;
}
if (v && v.toString().length === 0) birthDate = '';
}
"
>