defuj/apkt-eis
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(filters): change code structure and data flow in filter type 1

Browse Source
This commit is contained in:
kur0nek-o
2024-02-09 14:24:09 +07:00
parent 62cbcc9c28
commit cb8e11b1e9
12 changed files with 838 additions and 560 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
src/components/DatePicker.vue
View File

@ -1,27 +1,41 @@
<script setup lang="ts">
import { useDateStore } from '@/stores/date';
import { PhCalendarBlank } from '@phosphor-icons/vue';
// import { useDateStore } from '@/stores/date';
import { PhCalendarBlank } from '@phosphor-icons/vue'
import { ref, watch } from 'vue'
import VueTailwindDatepicker from 'vue-tailwind-datepicker'
const dateValue = ref('')
const formatter = ref({
date: 'DD-MM-YYYY',
month: 'MMMM'
})
watch(dateValue, (newValue) => {
useDateStore().setDateValue(newValue);
const emit = defineEmits(['update:dateValue'])
watch(dateValue, (newValue) => {
emit('update:dateValue', newValue)
})
</script>
<template>
<div class="flex">
<vue-tailwind-datepicker v-model="dateValue" :formatter="formatter" separator=" s/d " :shortcuts="false"
:auto-apply="false" as-single use-range v-slot="{ value, placeholder }">
<vue-tailwind-datepicker
v-model="dateValue"
:formatter="formatter"
separator=" s/d "
:shortcuts="false"
:auto-apply="false"
as-single
use-range
v-slot="{ value, placeholder }"
>
<div class="flex">
<div class="flex-1">
<button type="button"
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">
<button
type="button"
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">
{{ value || placeholder }}
</span>
@ -31,4 +45,4 @@ watch(dateValue, (newValue) => {
</div>
</vue-tailwind-datepicker>
</div>
</template>
</template>