add "press enter to close" for time inputs (#11705)

* add "enter to close" for time inputs

* add menu closing to datetime in system filters
This commit is contained in:
Azri Kahar
2022-02-18 23:20:50 +08:00
committed by GitHub
parent 588a5410af
commit 0dadccb822
3 changed files with 42 additions and 10 deletions

View File

@@ -1,5 +1,5 @@
<template>
<v-menu :close-on-content-click="false" attached :disabled="disabled" full-height seamless>
<v-menu ref="dateTimeMenu" :close-on-content-click="false" attached :disabled="disabled" full-height seamless>
<template #activator="{ toggle, active }">
<v-input :active="active" clickable readonly :model-value="displayValue" :disabled="disabled" @click="toggle">
<template v-if="!disabled" #append>
@@ -15,6 +15,7 @@
:use-24="use24"
:model-value="value"
@update:model-value="$emit('input', $event)"
@close="dateTimeMenu?.deactivate"
/>
</v-menu>
</template>
@@ -53,6 +54,8 @@ export default defineComponent({
setup(props, { emit }) {
const { t } = useI18n();
const dateTimeMenu = ref();
const { displayValue } = useDisplayValue();
function useDisplayValue() {
@@ -93,7 +96,7 @@ export default defineComponent({
emit('input', null);
}
return { displayValue, unsetValue };
return { displayValue, unsetValue, dateTimeMenu };
},
});
</script>