feat: add prop to maybe show selected date
This commit is contained in:
parent
60c3bf819b
commit
ac0182cbc2
|
@ -2,8 +2,8 @@
|
|||
<div class="datepicker-with-range-container">
|
||||
<popup>
|
||||
<template #trigger="{toggle}">
|
||||
<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">
|
||||
{{ buttonText }}
|
||||
</x-button>
|
||||
</template>
|
||||
<template #content="{isOpen}">
|
||||
|
@ -185,6 +185,13 @@ const {t} = useI18n()
|
|||
|
||||
const emit = defineEmits(['dateChanged'])
|
||||
|
||||
const props = defineProps({
|
||||
showSelectedOnButton: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
}
|
||||
})
|
||||
|
||||
// FIXME: This seems to always contain the default value - that breaks the picker
|
||||
const weekStart = computed<number>(() => store.state.auth.settings.weekStart ?? 0)
|
||||
const flatPickerConfig = computed(() => ({
|
||||
|
@ -257,6 +264,17 @@ function setDateRange(range: string[] | null) {
|
|||
const customRangeActive = computed<Boolean>(() => {
|
||||
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>
|
||||
|
|
|
@ -520,6 +520,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",
|
||||
|
|
Reference in New Issue