@ramathibodi/nuxt-commons 4.0.14 → 4.0.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/module.json +1 -1
- package/dist/runtime/components/device/IdCardButton.d.vue.ts +2 -2
- package/dist/runtime/components/device/IdCardButton.vue.d.ts +2 -2
- package/dist/runtime/components/dialog/Confirm.d.vue.ts +1 -1
- package/dist/runtime/components/dialog/Confirm.vue.d.ts +1 -1
- package/dist/runtime/components/dialog/default/Confirm.d.vue.ts +2 -2
- package/dist/runtime/components/dialog/default/Confirm.vue.d.ts +2 -2
- package/dist/runtime/components/dialog/default/Notify.d.vue.ts +3 -3
- package/dist/runtime/components/dialog/default/Notify.vue.d.ts +3 -3
- package/dist/runtime/components/dialog/default/VerifyUser.d.vue.ts +2 -2
- package/dist/runtime/components/dialog/default/VerifyUser.vue.d.ts +2 -2
- package/dist/runtime/components/form/Birthdate.vue +6 -0
- package/dist/runtime/components/form/CheckboxGroup.d.vue.ts +1 -1
- package/dist/runtime/components/form/CheckboxGroup.vue +47 -46
- package/dist/runtime/components/form/CheckboxGroup.vue.d.ts +1 -1
- package/dist/runtime/components/form/Date.d.vue.ts +5 -1
- package/dist/runtime/components/form/Date.vue +19 -2
- package/dist/runtime/components/form/Date.vue.d.ts +5 -1
- package/dist/runtime/components/form/DateTime.d.vue.ts +1 -1
- package/dist/runtime/components/form/DateTime.vue.d.ts +1 -1
- package/dist/runtime/components/form/Login.d.vue.ts +1 -1
- package/dist/runtime/components/form/Login.vue.d.ts +1 -1
- package/dist/runtime/components/form/Pad.d.vue.ts +1 -1
- package/dist/runtime/components/form/Pad.vue.d.ts +1 -1
- package/dist/runtime/components/form/Time.d.vue.ts +1 -1
- package/dist/runtime/components/form/Time.vue +2 -1
- package/dist/runtime/components/form/Time.vue.d.ts +1 -1
- package/dist/runtime/components/form/images/Capture.d.vue.ts +1 -1
- package/dist/runtime/components/form/images/Capture.vue.d.ts +1 -1
- package/dist/runtime/components/label/Field.d.vue.ts +1 -1
- package/dist/runtime/components/label/Field.vue.d.ts +1 -1
- package/dist/runtime/labs/Calendar.d.vue.ts +4 -4
- package/dist/runtime/labs/Calendar.vue.d.ts +4 -4
- package/package.json +1 -1
package/dist/module.json
CHANGED
|
@@ -17,16 +17,16 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
|
|
|
17
17
|
reader: null;
|
|
18
18
|
disableWhileLoading: boolean;
|
|
19
19
|
}>>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
|
|
20
|
-
error: (err: unknown) => any;
|
|
21
20
|
loading: (loading: boolean) => any;
|
|
21
|
+
error: (err: unknown) => any;
|
|
22
22
|
read: (payload: PatientRegisterPayload) => any;
|
|
23
23
|
}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<Props>, {
|
|
24
24
|
withPhoto: boolean;
|
|
25
25
|
reader: null;
|
|
26
26
|
disableWhileLoading: boolean;
|
|
27
27
|
}>>> & Readonly<{
|
|
28
|
-
onError?: ((err: unknown) => any) | undefined;
|
|
29
28
|
onLoading?: ((loading: boolean) => any) | undefined;
|
|
29
|
+
onError?: ((err: unknown) => any) | undefined;
|
|
30
30
|
onRead?: ((payload: PatientRegisterPayload) => any) | undefined;
|
|
31
31
|
}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
32
32
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
@@ -17,16 +17,16 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
|
|
|
17
17
|
reader: null;
|
|
18
18
|
disableWhileLoading: boolean;
|
|
19
19
|
}>>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
|
|
20
|
-
error: (err: unknown) => any;
|
|
21
20
|
loading: (loading: boolean) => any;
|
|
21
|
+
error: (err: unknown) => any;
|
|
22
22
|
read: (payload: PatientRegisterPayload) => any;
|
|
23
23
|
}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<Props>, {
|
|
24
24
|
withPhoto: boolean;
|
|
25
25
|
reader: null;
|
|
26
26
|
disableWhileLoading: boolean;
|
|
27
27
|
}>>> & Readonly<{
|
|
28
|
-
onError?: ((err: unknown) => any) | undefined;
|
|
29
28
|
onLoading?: ((loading: boolean) => any) | undefined;
|
|
29
|
+
onError?: ((err: unknown) => any) | undefined;
|
|
30
30
|
onRead?: ((payload: PatientRegisterPayload) => any) | undefined;
|
|
31
31
|
}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
32
32
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
@@ -21,9 +21,9 @@ declare const __VLS_base: import("vue").DefineComponent<DialogProps, {}, {}, {},
|
|
|
21
21
|
"onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
|
|
22
22
|
"onUpdate:result"?: ((value: boolean) => any) | undefined;
|
|
23
23
|
}>, {
|
|
24
|
+
title: string;
|
|
24
25
|
message: string;
|
|
25
26
|
width: string;
|
|
26
|
-
title: string;
|
|
27
27
|
buttonTrueText: string;
|
|
28
28
|
buttonFalseText: string;
|
|
29
29
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
@@ -21,9 +21,9 @@ declare const __VLS_base: import("vue").DefineComponent<DialogProps, {}, {}, {},
|
|
|
21
21
|
"onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
|
|
22
22
|
"onUpdate:result"?: ((value: boolean) => any) | undefined;
|
|
23
23
|
}>, {
|
|
24
|
+
title: string;
|
|
24
25
|
message: string;
|
|
25
26
|
width: string;
|
|
26
|
-
title: string;
|
|
27
27
|
buttonTrueText: string;
|
|
28
28
|
buttonFalseText: string;
|
|
29
29
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
@@ -23,10 +23,10 @@ declare const __VLS_base: import("vue").DefineComponent<DialogProps, {}, {}, {},
|
|
|
23
23
|
onResolve?: ((value: boolean) => any) | undefined;
|
|
24
24
|
onReject?: ((value: any) => any) | undefined;
|
|
25
25
|
}>, {
|
|
26
|
-
message: string;
|
|
27
|
-
width: string;
|
|
28
26
|
title: string;
|
|
29
27
|
type: "primary" | "success" | "warning" | "info" | "error";
|
|
28
|
+
message: string;
|
|
29
|
+
width: string;
|
|
30
30
|
buttonTrueText: string;
|
|
31
31
|
buttonFalseText: string;
|
|
32
32
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
@@ -23,10 +23,10 @@ declare const __VLS_base: import("vue").DefineComponent<DialogProps, {}, {}, {},
|
|
|
23
23
|
onResolve?: ((value: boolean) => any) | undefined;
|
|
24
24
|
onReject?: ((value: any) => any) | undefined;
|
|
25
25
|
}>, {
|
|
26
|
-
message: string;
|
|
27
|
-
width: string;
|
|
28
26
|
title: string;
|
|
29
27
|
type: "primary" | "success" | "warning" | "info" | "error";
|
|
28
|
+
message: string;
|
|
29
|
+
width: string;
|
|
30
30
|
buttonTrueText: string;
|
|
31
31
|
buttonFalseText: string;
|
|
32
32
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
@@ -13,11 +13,11 @@ declare const __VLS_export: import("vue").DefineComponent<DialogProps, {}, {}, {
|
|
|
13
13
|
"onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
|
|
14
14
|
onResolve?: ((value: boolean) => any) | undefined;
|
|
15
15
|
}>, {
|
|
16
|
-
message: string;
|
|
17
|
-
width: string;
|
|
18
16
|
title: string;
|
|
19
|
-
type: "primary" | "success" | "warning" | "info" | "error";
|
|
20
17
|
buttonText: string;
|
|
18
|
+
type: "primary" | "success" | "warning" | "info" | "error";
|
|
19
|
+
message: string;
|
|
20
|
+
width: string;
|
|
21
21
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
22
22
|
declare const _default: typeof __VLS_export;
|
|
23
23
|
export default _default;
|
|
@@ -13,11 +13,11 @@ declare const __VLS_export: import("vue").DefineComponent<DialogProps, {}, {}, {
|
|
|
13
13
|
"onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
|
|
14
14
|
onResolve?: ((value: boolean) => any) | undefined;
|
|
15
15
|
}>, {
|
|
16
|
-
message: string;
|
|
17
|
-
width: string;
|
|
18
16
|
title: string;
|
|
19
|
-
type: "primary" | "success" | "warning" | "info" | "error";
|
|
20
17
|
buttonText: string;
|
|
18
|
+
type: "primary" | "success" | "warning" | "info" | "error";
|
|
19
|
+
message: string;
|
|
20
|
+
width: string;
|
|
21
21
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
22
22
|
declare const _default: typeof __VLS_export;
|
|
23
23
|
export default _default;
|
|
@@ -17,10 +17,10 @@ declare const __VLS_export: import("vue").DefineComponent<DialogProps, {}, {}, {
|
|
|
17
17
|
onResolve?: ((value: string) => any) | undefined;
|
|
18
18
|
onReject?: ((value: any) => any) | undefined;
|
|
19
19
|
}>, {
|
|
20
|
-
message: string;
|
|
21
|
-
width: string;
|
|
22
20
|
title: string;
|
|
23
21
|
type: "primary" | "success" | "warning" | "info" | "error";
|
|
22
|
+
message: string;
|
|
23
|
+
width: string;
|
|
24
24
|
confirmButtonText: string;
|
|
25
25
|
cancelButtonText: string;
|
|
26
26
|
fixedUsername: boolean | string;
|
|
@@ -17,10 +17,10 @@ declare const __VLS_export: import("vue").DefineComponent<DialogProps, {}, {}, {
|
|
|
17
17
|
onResolve?: ((value: string) => any) | undefined;
|
|
18
18
|
onReject?: ((value: any) => any) | undefined;
|
|
19
19
|
}>, {
|
|
20
|
-
message: string;
|
|
21
|
-
width: string;
|
|
22
20
|
title: string;
|
|
23
21
|
type: "primary" | "success" | "warning" | "info" | "error";
|
|
22
|
+
message: string;
|
|
23
|
+
width: string;
|
|
24
24
|
confirmButtonText: string;
|
|
25
25
|
cancelButtonText: string;
|
|
26
26
|
fixedUsername: boolean | string;
|
|
@@ -43,6 +43,9 @@ const computedRules = computed(() => {
|
|
|
43
43
|
return ["DateHappen"];
|
|
44
44
|
}
|
|
45
45
|
});
|
|
46
|
+
const currentYear = (/* @__PURE__ */ new Date()).getFullYear();
|
|
47
|
+
const birthdateYearRange = computed(() => [currentYear - 120, currentYear]);
|
|
48
|
+
const maxBirthdate = /* @__PURE__ */ new Date();
|
|
46
49
|
const dobFormat = computed(() => {
|
|
47
50
|
let displayFormat = void 0;
|
|
48
51
|
if (dobPrecisionSelected.value == "yearMonth") {
|
|
@@ -64,6 +67,9 @@ const dobFormat = computed(() => {
|
|
|
64
67
|
:flow="props.flow"
|
|
65
68
|
:format="dobFormat"
|
|
66
69
|
:rules="computedRules"
|
|
70
|
+
:year-range="birthdateYearRange"
|
|
71
|
+
:max-date="maxBirthdate"
|
|
72
|
+
reverse-years
|
|
67
73
|
>
|
|
68
74
|
<template #append="{ isReadonly, isDisabled, activatorProps, toggleMenuOpen }">
|
|
69
75
|
<span
|
|
@@ -13,7 +13,7 @@ interface Props extends /* @vue-ignore */ InstanceType<typeof VCheckbox['$props'
|
|
|
13
13
|
declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<Props>, {
|
|
14
14
|
inline: boolean;
|
|
15
15
|
}>>, {
|
|
16
|
-
validate: () => boolean
|
|
16
|
+
validate: () => Promise<boolean>;
|
|
17
17
|
reset: () => void;
|
|
18
18
|
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
19
19
|
"update:modelValue": (...args: any[]) => void;
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
<script setup>
|
|
2
|
-
import { ref, watch, computed } from "vue";
|
|
2
|
+
import { ref, watch, computed, nextTick } from "vue";
|
|
3
3
|
import { VCheckbox } from "vuetify/components/VCheckbox";
|
|
4
|
-
import {
|
|
4
|
+
import { VInput } from "vuetify/components/VInput";
|
|
5
|
+
import { filter, head, reject } from "lodash-es";
|
|
5
6
|
const props = defineProps({
|
|
6
7
|
items: { type: Array, required: true },
|
|
7
8
|
label: { type: String, required: false },
|
|
@@ -12,26 +13,20 @@ const props = defineProps({
|
|
|
12
13
|
const emit = defineEmits(["update:modelValue"]);
|
|
13
14
|
const values = ref([]);
|
|
14
15
|
const valuesOther = ref();
|
|
15
|
-
const
|
|
16
|
-
const
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
touched.value = true;
|
|
21
|
-
return !computedRules.value;
|
|
16
|
+
const inputRef = ref();
|
|
17
|
+
const validationValue = computed(() => values.value.length ? values.value : null);
|
|
18
|
+
const validate = async () => {
|
|
19
|
+
const errors = await inputRef.value?.validate() ?? [];
|
|
20
|
+
return errors.length === 0;
|
|
22
21
|
};
|
|
23
22
|
const reset = () => {
|
|
24
|
-
|
|
23
|
+
inputRef.value?.resetValidation();
|
|
25
24
|
};
|
|
26
25
|
defineExpose({ validate, reset });
|
|
27
|
-
const
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
return join(rules, ",");
|
|
32
|
-
}
|
|
33
|
-
});
|
|
34
|
-
const showError = computed(() => touched.value && !!computedRules.value);
|
|
26
|
+
const onInteract = async () => {
|
|
27
|
+
await nextTick();
|
|
28
|
+
inputRef.value?.validate();
|
|
29
|
+
};
|
|
35
30
|
const computedOther = computed(() => {
|
|
36
31
|
const itemOther = filter(props.items, { value: "other" });
|
|
37
32
|
return head(itemOther);
|
|
@@ -59,33 +54,39 @@ watch(props.modelValue, () => {
|
|
|
59
54
|
</script>
|
|
60
55
|
|
|
61
56
|
<template>
|
|
62
|
-
<
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
:value="item.value"
|
|
68
|
-
density="compact"
|
|
69
|
-
hide-details
|
|
70
|
-
:error="showError"
|
|
71
|
-
:="$attrs"
|
|
72
|
-
:label="item.label"
|
|
73
|
-
@update:model-value="onUserInput"
|
|
74
|
-
/>
|
|
75
|
-
</div>
|
|
76
|
-
<v-text-field
|
|
77
|
-
v-if="computedOther"
|
|
78
|
-
v-model="valuesOther"
|
|
79
|
-
hide-details
|
|
80
|
-
:error="showError"
|
|
81
|
-
:="$attrs"
|
|
82
|
-
:label="computedOther.label"
|
|
83
|
-
@update:model-value="onUserInput"
|
|
84
|
-
/>
|
|
85
|
-
<label
|
|
86
|
-
v-if="showError"
|
|
87
|
-
class="text-error text-subtitle-2 ml-1"
|
|
57
|
+
<v-input
|
|
58
|
+
ref="inputRef"
|
|
59
|
+
:model-value="validationValue"
|
|
60
|
+
:rules="props.rules"
|
|
61
|
+
hide-details="auto"
|
|
88
62
|
>
|
|
89
|
-
{
|
|
90
|
-
|
|
63
|
+
<template #default="{ isValid }">
|
|
64
|
+
<div class="w-100">
|
|
65
|
+
<label class="text-body-1 opacity-60">{{ props.label }}</label>
|
|
66
|
+
<div :class="`d-flex ${inline ? 'flex-row' : 'flex-column'}`">
|
|
67
|
+
<v-checkbox
|
|
68
|
+
v-for="item in computeItems"
|
|
69
|
+
:key="item.value"
|
|
70
|
+
v-model="values"
|
|
71
|
+
:value="item.value"
|
|
72
|
+
density="compact"
|
|
73
|
+
hide-details
|
|
74
|
+
:error="isValid === false"
|
|
75
|
+
:="$attrs"
|
|
76
|
+
:label="item.label"
|
|
77
|
+
@update:model-value="onInteract"
|
|
78
|
+
/>
|
|
79
|
+
</div>
|
|
80
|
+
<v-text-field
|
|
81
|
+
v-if="computedOther"
|
|
82
|
+
v-model="valuesOther"
|
|
83
|
+
hide-details
|
|
84
|
+
:error="isValid === false"
|
|
85
|
+
:="$attrs"
|
|
86
|
+
:label="computedOther.label"
|
|
87
|
+
@update:model-value="onInteract"
|
|
88
|
+
/>
|
|
89
|
+
</div>
|
|
90
|
+
</template>
|
|
91
|
+
</v-input>
|
|
91
92
|
</template>
|
|
@@ -13,7 +13,7 @@ interface Props extends /* @vue-ignore */ InstanceType<typeof VCheckbox['$props'
|
|
|
13
13
|
declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<Props>, {
|
|
14
14
|
inline: boolean;
|
|
15
15
|
}>>, {
|
|
16
|
-
validate: () => boolean
|
|
16
|
+
validate: () => Promise<boolean>;
|
|
17
17
|
reset: () => void;
|
|
18
18
|
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
19
19
|
"update:modelValue": (...args: any[]) => void;
|
|
@@ -12,6 +12,8 @@ interface Props extends /* @vue-ignore */ InstanceType<typeof VTextField['$props
|
|
|
12
12
|
flow?: ('month' | 'year' | 'calendar' | 'time' | 'minutes' | 'hours' | 'seconds')[];
|
|
13
13
|
rules?: typeof VTextField['rules'];
|
|
14
14
|
defaultDate?: boolean | string;
|
|
15
|
+
yearRange?: [number, number];
|
|
16
|
+
reverseYears?: boolean;
|
|
15
17
|
}
|
|
16
18
|
declare function resetDatePicker(): void;
|
|
17
19
|
declare function toggleMenuOpen(trigger: string): void;
|
|
@@ -42,11 +44,12 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
|
|
|
42
44
|
pickerOnly: boolean;
|
|
43
45
|
flow: () => never[];
|
|
44
46
|
defaultDate: boolean;
|
|
47
|
+
reverseYears: boolean;
|
|
45
48
|
}>>, {
|
|
46
49
|
reset: typeof resetDatePicker;
|
|
47
50
|
validate: typeof validate;
|
|
48
51
|
resetValidation: typeof resetValidation;
|
|
49
|
-
isValid: boolean | null | undefined
|
|
52
|
+
isValid: import("vue").ComputedRef<boolean | null | undefined>;
|
|
50
53
|
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
51
54
|
"update:modelValue": (...args: any[]) => void;
|
|
52
55
|
}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<Props>, {
|
|
@@ -55,6 +58,7 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
|
|
|
55
58
|
pickerOnly: boolean;
|
|
56
59
|
flow: () => never[];
|
|
57
60
|
defaultDate: boolean;
|
|
61
|
+
reverseYears: boolean;
|
|
58
62
|
}>>> & Readonly<{
|
|
59
63
|
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
|
|
60
64
|
}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
@@ -17,7 +17,9 @@ const props = defineProps({
|
|
|
17
17
|
pickerOnly: { type: Boolean, required: false, default: false },
|
|
18
18
|
flow: { type: Array, required: false, default: () => [] },
|
|
19
19
|
rules: { type: null, required: false },
|
|
20
|
-
defaultDate: { type: [Boolean, String], required: false, default: false }
|
|
20
|
+
defaultDate: { type: [Boolean, String], required: false, default: false },
|
|
21
|
+
yearRange: { type: Array, required: false },
|
|
22
|
+
reverseYears: { type: Boolean, required: false, default: false }
|
|
21
23
|
});
|
|
22
24
|
const emit = defineEmits(["update:modelValue"]);
|
|
23
25
|
const computedRules = computed(() => {
|
|
@@ -157,18 +159,31 @@ function validate() {
|
|
|
157
159
|
function resetValidation() {
|
|
158
160
|
textFieldRef.value?.resetValidation();
|
|
159
161
|
}
|
|
162
|
+
const isValid = computed(() => textFieldRef.value?.isValid);
|
|
160
163
|
defineExpose({
|
|
161
164
|
reset: resetDatePicker,
|
|
162
165
|
validate,
|
|
163
166
|
resetValidation,
|
|
164
|
-
isValid
|
|
167
|
+
isValid
|
|
165
168
|
});
|
|
166
169
|
</script>
|
|
167
170
|
|
|
168
171
|
<template>
|
|
172
|
+
<!--
|
|
173
|
+
The picker mounts lazily (no `eager`) and the menu opens with no transition.
|
|
174
|
+
@vuepic/vue-datepicker measures the year/month overlay height and computes its
|
|
175
|
+
scroll-to-active position once, in onMounted. If the picker is pre-mounted in a
|
|
176
|
+
hidden menu (eager) or measured mid open-transition, that measurement reads a
|
|
177
|
+
zero-height grid, so the overlay falls back to the fixed `modeHeight` with the
|
|
178
|
+
cells unpainted and only corrects on a later tick — the #248 "year overlay shows
|
|
179
|
+
a few years then waits a while to finish rendering" symptom. Mounting lazily and
|
|
180
|
+
opening with the content already at full size lets the picker measure correctly
|
|
181
|
+
on first paint. (eager pre-mount was the original #248 fix and reintroduced the bug.)
|
|
182
|
+
-->
|
|
169
183
|
<v-menu
|
|
170
184
|
v-model="isMenuOpen"
|
|
171
185
|
:open-on-click="false"
|
|
186
|
+
:transition="false"
|
|
172
187
|
>
|
|
173
188
|
<template #activator="{ props: activatorProps }">
|
|
174
189
|
<v-text-field
|
|
@@ -203,6 +218,8 @@ defineExpose({
|
|
|
203
218
|
:flow="datepickerFlow"
|
|
204
219
|
:min-date="props.minDate"
|
|
205
220
|
:max-date="props.maxDate"
|
|
221
|
+
:year-range="props.yearRange"
|
|
222
|
+
:reverse-years="props.reverseYears"
|
|
206
223
|
auto-apply
|
|
207
224
|
inline
|
|
208
225
|
:locale="datepickerLocale"
|
|
@@ -12,6 +12,8 @@ interface Props extends /* @vue-ignore */ InstanceType<typeof VTextField['$props
|
|
|
12
12
|
flow?: ('month' | 'year' | 'calendar' | 'time' | 'minutes' | 'hours' | 'seconds')[];
|
|
13
13
|
rules?: typeof VTextField['rules'];
|
|
14
14
|
defaultDate?: boolean | string;
|
|
15
|
+
yearRange?: [number, number];
|
|
16
|
+
reverseYears?: boolean;
|
|
15
17
|
}
|
|
16
18
|
declare function resetDatePicker(): void;
|
|
17
19
|
declare function toggleMenuOpen(trigger: string): void;
|
|
@@ -42,11 +44,12 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
|
|
|
42
44
|
pickerOnly: boolean;
|
|
43
45
|
flow: () => never[];
|
|
44
46
|
defaultDate: boolean;
|
|
47
|
+
reverseYears: boolean;
|
|
45
48
|
}>>, {
|
|
46
49
|
reset: typeof resetDatePicker;
|
|
47
50
|
validate: typeof validate;
|
|
48
51
|
resetValidation: typeof resetValidation;
|
|
49
|
-
isValid: boolean | null | undefined
|
|
52
|
+
isValid: import("vue").ComputedRef<boolean | null | undefined>;
|
|
50
53
|
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
51
54
|
"update:modelValue": (...args: any[]) => void;
|
|
52
55
|
}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<Props>, {
|
|
@@ -55,6 +58,7 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
|
|
|
55
58
|
pickerOnly: boolean;
|
|
56
59
|
flow: () => never[];
|
|
57
60
|
defaultDate: boolean;
|
|
61
|
+
reverseYears: boolean;
|
|
58
62
|
}>>> & Readonly<{
|
|
59
63
|
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
|
|
60
64
|
}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
@@ -22,9 +22,9 @@ declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {},
|
|
|
22
22
|
}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
|
|
23
23
|
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
|
|
24
24
|
}>, {
|
|
25
|
-
readonly: boolean;
|
|
26
25
|
locale: "TH" | "EN";
|
|
27
26
|
format: dateFormat | string;
|
|
27
|
+
readonly: boolean;
|
|
28
28
|
dense: boolean;
|
|
29
29
|
pickerOnly: boolean;
|
|
30
30
|
defaultDate: boolean | string;
|
|
@@ -22,9 +22,9 @@ declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {},
|
|
|
22
22
|
}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
|
|
23
23
|
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
|
|
24
24
|
}>, {
|
|
25
|
-
readonly: boolean;
|
|
26
25
|
locale: "TH" | "EN";
|
|
27
26
|
format: dateFormat | string;
|
|
27
|
+
readonly: boolean;
|
|
28
28
|
dense: boolean;
|
|
29
29
|
pickerOnly: boolean;
|
|
30
30
|
defaultDate: boolean | string;
|
|
@@ -15,8 +15,8 @@ declare const __VLS_base: import("vue").DefineComponent<Props, {}, {}, {}, {}, i
|
|
|
15
15
|
}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
|
|
16
16
|
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
|
|
17
17
|
}>, {
|
|
18
|
-
loading: boolean;
|
|
19
18
|
title: string;
|
|
19
|
+
loading: boolean;
|
|
20
20
|
errorMessages: string;
|
|
21
21
|
hint: string;
|
|
22
22
|
btnSubmit: string;
|
|
@@ -15,8 +15,8 @@ declare const __VLS_base: import("vue").DefineComponent<Props, {}, {}, {}, {}, i
|
|
|
15
15
|
}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
|
|
16
16
|
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
|
|
17
17
|
}>, {
|
|
18
|
-
loading: boolean;
|
|
19
18
|
title: string;
|
|
19
|
+
loading: boolean;
|
|
20
20
|
errorMessages: string;
|
|
21
21
|
hint: string;
|
|
22
22
|
btnSubmit: string;
|
|
@@ -681,9 +681,9 @@ declare const __VLS_base: import("vue").DefineComponent<Props, {
|
|
|
681
681
|
}>, {
|
|
682
682
|
disabled: boolean;
|
|
683
683
|
readonly: boolean;
|
|
684
|
-
parentTemplates: string | string[];
|
|
685
684
|
isolated: boolean;
|
|
686
685
|
decoration: object;
|
|
686
|
+
parentTemplates: string | string[];
|
|
687
687
|
dirtyClass: string;
|
|
688
688
|
dirtyOnCreate: boolean;
|
|
689
689
|
sanitizeDelay: number;
|
|
@@ -681,9 +681,9 @@ declare const __VLS_base: import("vue").DefineComponent<Props, {
|
|
|
681
681
|
}>, {
|
|
682
682
|
disabled: boolean;
|
|
683
683
|
readonly: boolean;
|
|
684
|
-
parentTemplates: string | string[];
|
|
685
684
|
isolated: boolean;
|
|
686
685
|
decoration: object;
|
|
686
|
+
parentTemplates: string | string[];
|
|
687
687
|
dirtyClass: string;
|
|
688
688
|
dirtyOnCreate: boolean;
|
|
689
689
|
sanitizeDelay: number;
|
|
@@ -17,7 +17,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
|
|
|
17
17
|
reset: typeof reset;
|
|
18
18
|
validate: typeof validate;
|
|
19
19
|
resetValidation: typeof resetValidation;
|
|
20
|
-
isValid: boolean | null | undefined
|
|
20
|
+
isValid: import("vue").ComputedRef<boolean | null | undefined>;
|
|
21
21
|
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
22
22
|
"update:modelValue": (...args: any[]) => void;
|
|
23
23
|
}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<Props>, {
|
|
@@ -96,11 +96,12 @@ function validate() {
|
|
|
96
96
|
function resetValidation() {
|
|
97
97
|
textFieldRef.value?.resetValidation();
|
|
98
98
|
}
|
|
99
|
+
const isValid = computed(() => textFieldRef.value?.isValid);
|
|
99
100
|
defineExpose({
|
|
100
101
|
reset,
|
|
101
102
|
validate,
|
|
102
103
|
resetValidation,
|
|
103
|
-
isValid
|
|
104
|
+
isValid
|
|
104
105
|
});
|
|
105
106
|
</script>
|
|
106
107
|
|
|
@@ -17,7 +17,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
|
|
|
17
17
|
reset: typeof reset;
|
|
18
18
|
validate: typeof validate;
|
|
19
19
|
resetValidation: typeof resetValidation;
|
|
20
|
-
isValid: boolean | null | undefined
|
|
20
|
+
isValid: import("vue").ComputedRef<boolean | null | undefined>;
|
|
21
21
|
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
22
22
|
"update:modelValue": (...args: any[]) => void;
|
|
23
23
|
}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<Props>, {
|
|
@@ -78,10 +78,10 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {
|
|
|
78
78
|
}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
|
|
79
79
|
"onUpdate:modelValue"?: ((value: string | undefined) => any) | undefined;
|
|
80
80
|
}>, {
|
|
81
|
+
buttonText: string;
|
|
81
82
|
disabled: boolean;
|
|
82
83
|
maxWidth: string | number;
|
|
83
84
|
readonly: boolean;
|
|
84
|
-
buttonText: string;
|
|
85
85
|
imageFormat: ImageFormat;
|
|
86
86
|
autoStart: boolean;
|
|
87
87
|
fileOnly: boolean;
|
|
@@ -78,10 +78,10 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {
|
|
|
78
78
|
}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
|
|
79
79
|
"onUpdate:modelValue"?: ((value: string | undefined) => any) | undefined;
|
|
80
80
|
}>, {
|
|
81
|
+
buttonText: string;
|
|
81
82
|
disabled: boolean;
|
|
82
83
|
maxWidth: string | number;
|
|
83
84
|
readonly: boolean;
|
|
84
|
-
buttonText: string;
|
|
85
85
|
imageFormat: ImageFormat;
|
|
86
86
|
autoStart: boolean;
|
|
87
87
|
fileOnly: boolean;
|
|
@@ -22,8 +22,8 @@ type __VLS_Slots = {} & {
|
|
|
22
22
|
};
|
|
23
23
|
declare const __VLS_base: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {
|
|
24
24
|
value: string | null;
|
|
25
|
-
size: "large" | "medium";
|
|
26
25
|
label: string;
|
|
26
|
+
size: "large" | "medium";
|
|
27
27
|
horizontal: boolean;
|
|
28
28
|
truncate: boolean;
|
|
29
29
|
notFoundText: string;
|
|
@@ -22,8 +22,8 @@ type __VLS_Slots = {} & {
|
|
|
22
22
|
};
|
|
23
23
|
declare const __VLS_base: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {
|
|
24
24
|
value: string | null;
|
|
25
|
-
size: "large" | "medium";
|
|
26
25
|
label: string;
|
|
26
|
+
size: "large" | "medium";
|
|
27
27
|
horizontal: boolean;
|
|
28
28
|
truncate: boolean;
|
|
29
29
|
notFoundText: string;
|
|
@@ -18,18 +18,18 @@ interface CalendarProps {
|
|
|
18
18
|
mode: 'dayGridMonth' | 'timeGridDay';
|
|
19
19
|
}
|
|
20
20
|
declare const __VLS_export: import("vue").DefineComponent<CalendarProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
21
|
-
dialog: (...args: any[]) => void;
|
|
22
21
|
select: (...args: any[]) => void;
|
|
22
|
+
dialog: (...args: any[]) => void;
|
|
23
23
|
}, string, import("vue").PublicProps, Readonly<CalendarProps> & Readonly<{
|
|
24
|
-
onDialog?: ((...args: any[]) => any) | undefined;
|
|
25
24
|
onSelect?: ((...args: any[]) => any) | undefined;
|
|
25
|
+
onDialog?: ((...args: any[]) => any) | undefined;
|
|
26
26
|
}>, {
|
|
27
|
-
height: string | number;
|
|
28
|
-
mode: "dayGridMonth" | "timeGridDay";
|
|
29
27
|
locale: "th" | "en";
|
|
30
28
|
toolBarLeft: string;
|
|
31
29
|
toolBarCenter: string;
|
|
32
30
|
toolBarRight: string;
|
|
31
|
+
height: string | number;
|
|
32
|
+
mode: "dayGridMonth" | "timeGridDay";
|
|
33
33
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
34
34
|
declare const _default: typeof __VLS_export;
|
|
35
35
|
export default _default;
|
|
@@ -18,18 +18,18 @@ interface CalendarProps {
|
|
|
18
18
|
mode: 'dayGridMonth' | 'timeGridDay';
|
|
19
19
|
}
|
|
20
20
|
declare const __VLS_export: import("vue").DefineComponent<CalendarProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
21
|
-
dialog: (...args: any[]) => void;
|
|
22
21
|
select: (...args: any[]) => void;
|
|
22
|
+
dialog: (...args: any[]) => void;
|
|
23
23
|
}, string, import("vue").PublicProps, Readonly<CalendarProps> & Readonly<{
|
|
24
|
-
onDialog?: ((...args: any[]) => any) | undefined;
|
|
25
24
|
onSelect?: ((...args: any[]) => any) | undefined;
|
|
25
|
+
onDialog?: ((...args: any[]) => any) | undefined;
|
|
26
26
|
}>, {
|
|
27
|
-
height: string | number;
|
|
28
|
-
mode: "dayGridMonth" | "timeGridDay";
|
|
29
27
|
locale: "th" | "en";
|
|
30
28
|
toolBarLeft: string;
|
|
31
29
|
toolBarCenter: string;
|
|
32
30
|
toolBarRight: string;
|
|
31
|
+
height: string | number;
|
|
32
|
+
mode: "dayGridMonth" | "timeGridDay";
|
|
33
33
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
34
34
|
declare const _default: typeof __VLS_export;
|
|
35
35
|
export default _default;
|