fix: form date picker clear and icon
This commit is contained in:
parent
dc89a60eb4
commit
54e3876019
6 changed files with 103 additions and 68 deletions
|
|
@ -143,7 +143,7 @@ function deleteFile(name: string) {
|
||||||
name="mdi-close-circle"
|
name="mdi-close-circle"
|
||||||
class="cursor-pointer app-text-muted"
|
class="cursor-pointer app-text-muted"
|
||||||
size="sm"
|
size="sm"
|
||||||
@click="startDate = undefined"
|
@click.stop="startDate = undefined"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
</q-input>
|
</q-input>
|
||||||
|
|
@ -205,7 +205,7 @@ function deleteFile(name: string) {
|
||||||
name="mdi-close-circle"
|
name="mdi-close-circle"
|
||||||
class="cursor-pointer app-text-muted"
|
class="cursor-pointer app-text-muted"
|
||||||
size="sm"
|
size="sm"
|
||||||
@click="retireDate = undefined"
|
@click.stop="retireDate = undefined"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
</q-input>
|
</q-input>
|
||||||
|
|
|
||||||
|
|
@ -206,7 +206,7 @@ const branchNo = defineModel<number>('branchNo');
|
||||||
? readonly
|
? readonly
|
||||||
? dateFormat(registerDate)
|
? dateFormat(registerDate)
|
||||||
: dateFormat(registerDate, false, false, true)
|
: dateFormat(registerDate, false, false, true)
|
||||||
: ''
|
: undefined
|
||||||
"
|
"
|
||||||
@update:model-value="
|
@update:model-value="
|
||||||
(v) => {
|
(v) => {
|
||||||
|
|
|
||||||
|
|
@ -165,7 +165,7 @@ onMounted(async () => {
|
||||||
? readonly
|
? readonly
|
||||||
? dateFormat(payDate)
|
? dateFormat(payDate)
|
||||||
: dateFormat(payDate, false, false, true)
|
: dateFormat(payDate, false, false, true)
|
||||||
: ''
|
: undefined
|
||||||
"
|
"
|
||||||
@update:model-value="
|
@update:model-value="
|
||||||
(v) => {
|
(v) => {
|
||||||
|
|
|
||||||
|
|
@ -268,9 +268,16 @@ onMounted(async () => {
|
||||||
placeholder="DD/MM/YYYY"
|
placeholder="DD/MM/YYYY"
|
||||||
:mask="readonly ? '' : '##/##/####'"
|
:mask="readonly ? '' : '##/##/####'"
|
||||||
:model-value="
|
:model-value="
|
||||||
checkup.coverageStartDate && readonly
|
checkup.coverageStartDate
|
||||||
? dateFormat(checkup.coverageStartDate)
|
? readonly
|
||||||
: dateFormat(checkup.coverageStartDate, false, false, true)
|
? dateFormat(checkup.coverageStartDate)
|
||||||
|
: dateFormat(
|
||||||
|
checkup.coverageStartDate,
|
||||||
|
false,
|
||||||
|
false,
|
||||||
|
true,
|
||||||
|
)
|
||||||
|
: undefined
|
||||||
"
|
"
|
||||||
@update:model-value="
|
@update:model-value="
|
||||||
(v) => {
|
(v) => {
|
||||||
|
|
@ -291,10 +298,10 @@ onMounted(async () => {
|
||||||
<template v-slot:append>
|
<template v-slot:append>
|
||||||
<q-icon
|
<q-icon
|
||||||
v-if="checkup.coverageStartDate && !readonly"
|
v-if="checkup.coverageStartDate && !readonly"
|
||||||
name="mdi-close"
|
name="mdi-close-circle"
|
||||||
class="cursor-pointer"
|
class="cursor-pointer app-text-muted"
|
||||||
size="xs"
|
size="sm"
|
||||||
@click="checkup.coverageStartDate = undefined"
|
@click.stop="checkup.coverageStartDate = undefined"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
</q-input>
|
</q-input>
|
||||||
|
|
@ -327,9 +334,16 @@ onMounted(async () => {
|
||||||
placeholder="DD/MM/YYYY"
|
placeholder="DD/MM/YYYY"
|
||||||
:mask="readonly ? '' : '##/##/####'"
|
:mask="readonly ? '' : '##/##/####'"
|
||||||
:model-value="
|
:model-value="
|
||||||
checkup.coverageExpireDate && readonly
|
checkup.coverageExpireDate
|
||||||
? dateFormat(checkup.coverageExpireDate)
|
? readonly
|
||||||
: dateFormat(checkup.coverageExpireDate, false, false, true)
|
? dateFormat(checkup.coverageExpireDate)
|
||||||
|
: dateFormat(
|
||||||
|
checkup.coverageExpireDate,
|
||||||
|
false,
|
||||||
|
false,
|
||||||
|
true,
|
||||||
|
)
|
||||||
|
: undefined
|
||||||
"
|
"
|
||||||
@update:model-value="
|
@update:model-value="
|
||||||
(v) => {
|
(v) => {
|
||||||
|
|
@ -353,10 +367,10 @@ onMounted(async () => {
|
||||||
<template v-slot:append>
|
<template v-slot:append>
|
||||||
<q-icon
|
<q-icon
|
||||||
v-if="checkup.coverageExpireDate && !readonly"
|
v-if="checkup.coverageExpireDate && !readonly"
|
||||||
name="mdi-close"
|
name="mdi-close-circle"
|
||||||
class="cursor-pointer"
|
class="cursor-pointer app-text-muted"
|
||||||
size="xs"
|
size="sm"
|
||||||
@click="checkup.coverageExpireDate = undefined"
|
@click.stop="checkup.coverageExpireDate = undefined"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
</q-input>
|
</q-input>
|
||||||
|
|
|
||||||
|
|
@ -23,12 +23,14 @@ const addrOptions = reactive<{
|
||||||
|
|
||||||
const visaType = defineModel<string>('visaType');
|
const visaType = defineModel<string>('visaType');
|
||||||
const visaNumber = defineModel<string>('visaNumber');
|
const visaNumber = defineModel<string>('visaNumber');
|
||||||
const visaIssueDate = defineModel<Date | null>('visaIssueDate');
|
const visaIssueDate = defineModel<Date | null | string>('visaIssueDate');
|
||||||
const visaExpiryDate = defineModel<Date | null>('visaExpiryDate');
|
const visaExpiryDate = defineModel<Date | null | string>('visaExpiryDate');
|
||||||
const visaIssuingPlace = defineModel<string>('visaIssuingPlace');
|
const visaIssuingPlace = defineModel<string>('visaIssuingPlace');
|
||||||
const visaStayUntilDate = defineModel<Date | null>('visaStayUntilDate');
|
const visaStayUntilDate = defineModel<Date | null | string>(
|
||||||
|
'visaStayUntilDate',
|
||||||
|
);
|
||||||
const tm6Number = defineModel<string>('tm6Number');
|
const tm6Number = defineModel<string>('tm6Number');
|
||||||
const entryDate = defineModel<Date | null>('entryDate');
|
const entryDate = defineModel<Date | null | string>('entryDate');
|
||||||
|
|
||||||
const visaTypeOption =
|
const visaTypeOption =
|
||||||
defineModel<{ label: string; value: string }[]>('visaTypeOption');
|
defineModel<{ label: string; value: string }[]>('visaTypeOption');
|
||||||
|
|
@ -123,9 +125,11 @@ onMounted(async () => {
|
||||||
placeholder="DD/MM/YYYY"
|
placeholder="DD/MM/YYYY"
|
||||||
:mask="readonly ? '' : '##/##/####'"
|
:mask="readonly ? '' : '##/##/####'"
|
||||||
:model-value="
|
:model-value="
|
||||||
visaIssueDate && readonly
|
visaIssueDate
|
||||||
? dateFormat(visaIssueDate)
|
? readonly
|
||||||
: dateFormat(visaIssueDate, false, false, true)
|
? dateFormat(visaIssueDate)
|
||||||
|
: dateFormat(visaIssueDate, false, false, true)
|
||||||
|
: undefined
|
||||||
"
|
"
|
||||||
@update:model-value="
|
@update:model-value="
|
||||||
(v) => {
|
(v) => {
|
||||||
|
|
@ -150,9 +154,9 @@ onMounted(async () => {
|
||||||
<template v-slot:append>
|
<template v-slot:append>
|
||||||
<q-icon
|
<q-icon
|
||||||
v-if="visaIssueDate && !readonly"
|
v-if="visaIssueDate && !readonly"
|
||||||
name="mdi-close"
|
name="mdi-close-circle"
|
||||||
class="cursor-pointer"
|
class="cursor-pointer app-text-muted"
|
||||||
size="xs"
|
size="sm"
|
||||||
@click="visaIssueDate = undefined"
|
@click="visaIssueDate = undefined"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -188,9 +192,11 @@ onMounted(async () => {
|
||||||
placeholder="DD/MM/YYYY"
|
placeholder="DD/MM/YYYY"
|
||||||
:mask="readonly ? '' : '##/##/####'"
|
:mask="readonly ? '' : '##/##/####'"
|
||||||
:model-value="
|
:model-value="
|
||||||
visaExpiryDate && readonly
|
visaExpiryDate
|
||||||
? dateFormat(visaExpiryDate)
|
? readonly
|
||||||
: dateFormat(visaExpiryDate, false, false, true)
|
? dateFormat(visaExpiryDate)
|
||||||
|
: dateFormat(visaExpiryDate, false, false, true)
|
||||||
|
: undefined
|
||||||
"
|
"
|
||||||
@update:model-value="
|
@update:model-value="
|
||||||
(v) => {
|
(v) => {
|
||||||
|
|
@ -215,9 +221,9 @@ onMounted(async () => {
|
||||||
<template v-slot:append>
|
<template v-slot:append>
|
||||||
<q-icon
|
<q-icon
|
||||||
v-if="visaExpiryDate && !readonly"
|
v-if="visaExpiryDate && !readonly"
|
||||||
name="mdi-close"
|
name="mdi-close-circle"
|
||||||
class="cursor-pointer"
|
class="cursor-pointer app-text-muted"
|
||||||
size="xs"
|
size="sm"
|
||||||
@click="visaExpiryDate = undefined"
|
@click="visaExpiryDate = undefined"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -267,9 +273,11 @@ onMounted(async () => {
|
||||||
placeholder="DD/MM/YYYY"
|
placeholder="DD/MM/YYYY"
|
||||||
:mask="readonly ? '' : '##/##/####'"
|
:mask="readonly ? '' : '##/##/####'"
|
||||||
:model-value="
|
:model-value="
|
||||||
visaStayUntilDate && readonly
|
visaStayUntilDate
|
||||||
? dateFormat(visaStayUntilDate)
|
? readonly
|
||||||
: dateFormat(visaStayUntilDate, false, false, true)
|
? dateFormat(visaStayUntilDate)
|
||||||
|
: dateFormat(visaStayUntilDate, false, false, true)
|
||||||
|
: undefined
|
||||||
"
|
"
|
||||||
@update:model-value="
|
@update:model-value="
|
||||||
(v) => {
|
(v) => {
|
||||||
|
|
@ -295,9 +303,9 @@ onMounted(async () => {
|
||||||
<template v-slot:append>
|
<template v-slot:append>
|
||||||
<q-icon
|
<q-icon
|
||||||
v-if="visaStayUntilDate && !readonly"
|
v-if="visaStayUntilDate && !readonly"
|
||||||
name="mdi-close"
|
name="mdi-close-circle"
|
||||||
class="cursor-pointer"
|
class="cursor-pointer app-text-muted"
|
||||||
size="xs"
|
size="sm"
|
||||||
@click="visaStayUntilDate = undefined"
|
@click="visaStayUntilDate = undefined"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -346,9 +354,11 @@ onMounted(async () => {
|
||||||
placeholder="DD/MM/YYYY"
|
placeholder="DD/MM/YYYY"
|
||||||
:mask="readonly ? '' : '##/##/####'"
|
:mask="readonly ? '' : '##/##/####'"
|
||||||
:model-value="
|
:model-value="
|
||||||
entryDate && readonly
|
entryDate
|
||||||
? dateFormat(entryDate)
|
? readonly
|
||||||
: dateFormat(entryDate, false, false, true)
|
? dateFormat(entryDate)
|
||||||
|
: dateFormat(entryDate, false, false, true)
|
||||||
|
: undefined
|
||||||
"
|
"
|
||||||
@update:model-value="
|
@update:model-value="
|
||||||
(v) => {
|
(v) => {
|
||||||
|
|
@ -373,10 +383,10 @@ onMounted(async () => {
|
||||||
<template v-slot:append>
|
<template v-slot:append>
|
||||||
<q-icon
|
<q-icon
|
||||||
v-if="entryDate && !readonly"
|
v-if="entryDate && !readonly"
|
||||||
name="mdi-close"
|
name="mdi-close-circle"
|
||||||
class="cursor-pointer"
|
class="cursor-pointer app-text-muted"
|
||||||
size="xs"
|
size="sm"
|
||||||
@click="entryDate = undefined"
|
@click.stop="entryDate = undefined"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
</q-input>
|
</q-input>
|
||||||
|
|
|
||||||
|
|
@ -218,9 +218,11 @@ onMounted(async () => {
|
||||||
placeholder="DD/MM/YYYY"
|
placeholder="DD/MM/YYYY"
|
||||||
:mask="readonly ? '' : '##/##/####'"
|
:mask="readonly ? '' : '##/##/####'"
|
||||||
:model-value="
|
:model-value="
|
||||||
work.workEndDate && readonly
|
work.workEndDate
|
||||||
? dateFormat(work.workEndDate)
|
? readonly
|
||||||
: dateFormat(work.workEndDate, false, false, true)
|
? dateFormat(work.workEndDate)
|
||||||
|
: dateFormat(work.workEndDate, false, false, true)
|
||||||
|
: undefined
|
||||||
"
|
"
|
||||||
@update:model-value="
|
@update:model-value="
|
||||||
(v) => {
|
(v) => {
|
||||||
|
|
@ -241,10 +243,10 @@ onMounted(async () => {
|
||||||
<template v-slot:append>
|
<template v-slot:append>
|
||||||
<q-icon
|
<q-icon
|
||||||
v-if="work.workEndDate && !readonly"
|
v-if="work.workEndDate && !readonly"
|
||||||
name="mdi-close"
|
name="mdi-close-circle"
|
||||||
class="cursor-pointer"
|
class="cursor-pointer app-text-muted"
|
||||||
size="xs"
|
size="sm"
|
||||||
@click="work.workEndDate = undefined"
|
@click.stop="work.workEndDate = undefined"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
</q-input>
|
</q-input>
|
||||||
|
|
@ -288,9 +290,11 @@ onMounted(async () => {
|
||||||
placeholder="DD/MM/YYYY"
|
placeholder="DD/MM/YYYY"
|
||||||
:mask="readonly ? '' : '##/##/####'"
|
:mask="readonly ? '' : '##/##/####'"
|
||||||
:model-value="
|
:model-value="
|
||||||
work.workPermitIssuDate && readonly
|
work.workPermitIssuDate
|
||||||
? dateFormat(work.workPermitIssuDate)
|
? readonly
|
||||||
: dateFormat(work.workPermitIssuDate, false, false, true)
|
? dateFormat(work.workPermitIssuDate)
|
||||||
|
: dateFormat(work.workPermitIssuDate, false, false, true)
|
||||||
|
: undefined
|
||||||
"
|
"
|
||||||
@update:model-value="
|
@update:model-value="
|
||||||
(v) => {
|
(v) => {
|
||||||
|
|
@ -311,10 +315,10 @@ onMounted(async () => {
|
||||||
<template v-slot:append>
|
<template v-slot:append>
|
||||||
<q-icon
|
<q-icon
|
||||||
v-if="work.workPermitIssuDate && !readonly"
|
v-if="work.workPermitIssuDate && !readonly"
|
||||||
name="mdi-close"
|
name="mdi-close-circle"
|
||||||
class="cursor-pointer"
|
class="cursor-pointer app-text-muted"
|
||||||
size="xs"
|
size="sm"
|
||||||
@click="work.workPermitIssuDate = undefined"
|
@click.stop="work.workPermitIssuDate = undefined"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
</q-input>
|
</q-input>
|
||||||
|
|
@ -348,9 +352,16 @@ onMounted(async () => {
|
||||||
placeholder="DD/MM/YYYY"
|
placeholder="DD/MM/YYYY"
|
||||||
:mask="readonly ? '' : '##/##/####'"
|
:mask="readonly ? '' : '##/##/####'"
|
||||||
:model-value="
|
:model-value="
|
||||||
work.workPermitExpireDate && readonly
|
work.workPermitExpireDate
|
||||||
? dateFormat(work.workPermitExpireDate)
|
? readonly
|
||||||
: dateFormat(work.workPermitExpireDate, false, false, true)
|
? dateFormat(work.workPermitExpireDate)
|
||||||
|
: dateFormat(
|
||||||
|
work.workPermitExpireDate,
|
||||||
|
false,
|
||||||
|
false,
|
||||||
|
true,
|
||||||
|
)
|
||||||
|
: undefined
|
||||||
"
|
"
|
||||||
@update:model-value="
|
@update:model-value="
|
||||||
(v) => {
|
(v) => {
|
||||||
|
|
@ -371,10 +382,10 @@ onMounted(async () => {
|
||||||
<template v-slot:append>
|
<template v-slot:append>
|
||||||
<q-icon
|
<q-icon
|
||||||
v-if="work.workPermitExpireDate && !readonly"
|
v-if="work.workPermitExpireDate && !readonly"
|
||||||
name="mdi-close"
|
name="mdi-close-circle"
|
||||||
class="cursor-pointer"
|
class="cursor-pointer app-text-muted"
|
||||||
size="xs"
|
size="sm"
|
||||||
@click="work.workPermitExpireDate = undefined"
|
@click.stop="work.workPermitExpireDate = undefined"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
</q-input>
|
</q-input>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue