feat: add date math for filters #1342
|
@ -3,8 +3,8 @@
|
|||
<popup>
|
||||
<template #trigger="{toggle}">
|
||||
<slot name="trigger" :toggle="toggle">
|
||||
konrad marked this conversation as resolved
Outdated
|
||||
<x-button @click.prevent.stop="toggle()" type="secondary" :shadow="false" class="mb-2">
|
||||
{{ $t('task.show.select') }}
|
||||
<x-button @click.prevent.stop="toggle()" variant="secondary" :shadow="false" class="mb-2">
|
||||
konrad marked this conversation as resolved
Outdated
dpschen
commented
The styles (=props) selected for the button are hightly specific and create an indirect dependency to its indented use case. The latter might change in the future and then we have to remember this dependency. This is why I think it makes sense to remove at least the specific use case of this button. Since we wouldn't use it then at all anymore (since you need to overwrite the default slot) it might make it simpler to only define the slot. The styles (=props) selected for the button are hightly specific and create an indirect dependency to its indented use case. The latter might change in the future and then we have to remember this dependency. This is why I think it makes sense to remove at least the specific use case of this button. Since we wouldn't use it then at all anymore (since you need to overwrite the default slot) it might make it simpler to only define the slot.
konrad
commented
Moved everything to a slot. Moved everything to a slot.
|
||||
{{ buttonText }}
|
||||
</x-button>
|
||||
</slot>
|
||||
</template>
|
||||
|
@ -187,6 +187,13 @@ const {t} = useI18n()
|
|||
|
||||
const emit = defineEmits(['dateChanged'])
|
||||
|
||||
const props = defineProps({
|
||||
showSelectedOnButton: {
|
||||
konrad marked this conversation as resolved
Outdated
dpschen
commented
We could remove this prop if we would only expose the slot for the trigger. We could remove this prop if we would only expose the slot for the trigger.
konrad
commented
Done. Done.
|
||||
type: Boolean,
|
||||
default: false,
|
||||
}
|
||||
})
|
||||
|
||||
// FIXME: This seems to always contain the default value - that breaks the picker
|
||||
dpschen
commented
Continuing from #1261 (comment) With default value you mean the value of store.state.auth.settings.weekStart? Continuing from https://kolaente.dev/vikunja/frontend/pulls/1261#issuecomment-22675
With default value you mean the value of store.state.auth.settings.weekStart?
konrad
commented
As said in #1261:
As said in #1261:
> It's not reflected in the flatpicker config (below). That always contains `0` as week start, no matter what is set in store.
|
||||
const weekStart = computed<number>(() => store.state.auth.settings.weekStart ?? 0)
|
||||
const flatPickerConfig = computed(() => ({
|
||||
|
@ -259,6 +266,17 @@ function setDateRange(range: string[] | null) {
|
|||
const customRangeActive = computed<Boolean>(() => {
|
||||
konrad marked this conversation as resolved
Outdated
dpschen
commented
Not 100% sure but I think unnecesary: Adding the Not 100% sure but I think unnecesary: Adding the `<Boolean>` as definition here.
Regardless I think it should be `<boolean>` (lowercase "b")
konrad
commented
Changed. Changed.
|
||||
return !Object.values(dateRanges).some(el => from.value === el[0] && to.value === el[1])
|
||||
})
|
||||
|
||||
const buttonText = computed<string>(() => {
|
||||
if(props.showSelectedOnButton && from.value !== '' && to.value !== '') {
|
||||
return t('input.datepickerRange.fromto', {
|
||||
from: from.value,
|
||||
to: to.value,
|
||||
})
|
||||
}
|
||||
|
||||
return t('task.show.select')
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
|
@ -526,6 +526,7 @@
|
|||
"datepickerRange": {
|
||||
"to": "To",
|
||||
"from": "From",
|
||||
"fromto": "{from} to {to}",
|
||||
"math": {
|
||||
"canuse": "You can use date math to filter for relative dates.",
|
||||
"learnhow": "Check out how it works",
|
||||
|
|
Provide
buttonText
as slot prop aswellDone.