Refactor DatePicker component
This commit is contained in:
parent
1605b41be1
commit
e8ed93af03
@ -27,7 +27,7 @@ const customShortcuts = () => {
|
|||||||
return [new Date(date.setFullYear(date.getFullYear() - 1)), new Date()];
|
return [new Date(date.setFullYear(date.getFullYear() - 1)), new Date()];
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
];
|
];
|
||||||
};
|
};
|
||||||
watch(dateValue, (newValue) => {
|
watch(dateValue, (newValue) => {
|
||||||
@ -37,22 +37,12 @@ watch(dateValue, (newValue) => {
|
|||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="flex">
|
<div class="flex">
|
||||||
<vue-tailwind-datepicker
|
<vue-tailwind-datepicker v-model="dateValue" :formatter="formatter" separator=" s/d " :shortcuts="customShortcuts"
|
||||||
v-model="dateValue"
|
:auto-apply="true" as-single use-range v-slot="{ value, placeholder }">
|
||||||
:formatter="formatter"
|
|
||||||
separator=" s/d "
|
|
||||||
:shortcuts="customShortcuts"
|
|
||||||
:auto-apply="true"
|
|
||||||
as-single
|
|
||||||
use-range
|
|
||||||
v-slot="{ value, placeholder }"
|
|
||||||
>
|
|
||||||
<div class="flex">
|
<div class="flex">
|
||||||
<div class="flex-1">
|
<div class="flex-1">
|
||||||
<button
|
<button type="button"
|
||||||
type="button"
|
class="flex items-center justify-between w-full px-4 py-2 text-sm leading-6 text-gray-900 bg-gray-200 border-0 border-transparent rounded-lg placeholder:text-gray-400 outline-0 focus:outline-0 focus:border-0 focus:ring-0">
|
||||||
class="w-full flex items-center justify-between px-4 py-2 text-sm leading-6 placeholder:text-gray-400 text-gray-900 border-0 border-transparent rounded-lg outline-0 bg-gray-200 focus:outline-0 focus:border-0 focus:ring-0"
|
|
||||||
>
|
|
||||||
<span class="text-gray-900">
|
<span class="text-gray-900">
|
||||||
{{ value || placeholder }}
|
{{ value || placeholder }}
|
||||||
</span>
|
</span>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user