feat: add date math for filters #1342
|
|
@ -47,6 +47,10 @@ import {LOADING, LOADING_MODULE} from '@/store/mutation-types'
|
|||
import LlamaCool from '@/assets/llama-cool.svg?component'
|
||||
import DatepickerWithRange from '@/components/date/datepickerWithRange'
|
||||
|
||||
function getNextWeekDate() {
|
||||
return new Date((new Date()).getTime() + 7 * 24 * 60 * 60 * 1000)
|
||||
}
|
||||
|
||||
export default {
|
||||
name: 'ShowTasks',
|
||||
components: {
|
||||
|
|
@ -62,8 +66,6 @@ export default {
|
|||
}
|
||||
},
|
||||
props: {
|
||||
startDate: Date,
|
||||
endDate: Date,
|
||||
showAll: Boolean,
|
||||
},
|
||||
created() {
|
||||
|
|
@ -84,14 +86,14 @@ export default {
|
|||
|
||||
return !isNaN(d)
|
||||
|
konrad marked this conversation as resolved
Outdated
|
||||
? d
|
||||
: this.startDate
|
||||
: new Date()
|
||||
},
|
||||
dateTo() {
|
||||
const d = new Date(Number(this.$route.query.to))
|
||||
|
konrad marked this conversation as resolved
Outdated
dpschen
commented
Readd route props Readd route props
konrad
commented
Changed it to route props. However, we still have a dependency on the router: every time when seleting a date in ShowTasks it will push the change to the route. I don't know how to change that without massively overengeneering everything so I'd say we leave it at that. Changed it to route props.
However, we still have a dependency on the router: every time when seleting a date in ShowTasks it will push the change to the route. I don't know how to change that without massively overengeneering everything so I'd say we leave it at that.
dpschen
commented
I think it's fine for now. I thought a while about this but also don't have a better soltion for this at the moment (except the v-model version) I think it's fine for now. I thought a while about this but also don't have a better soltion for this at the moment (except the v-model version)
|
||||
|
||||
return !isNaN(d)
|
||||
? d
|
||||
: this.endDate
|
||||
: getNextWeekDate()
|
||||
},
|
||||
|
konrad marked this conversation as resolved
Outdated
dpschen
commented
Unsure: I think eslint doesn't complain here if you use underscore ( Unsure: I think eslint doesn't complain here if you use underscore (`_`) to spread the unused variable.
dpschen
commented
Add Add `?.[0]` so we return the key, which is what we actually want to use and adjust variable name.
konrad
commented
Nope, does not seem to have an effect. > Unsure: I think eslint doesn't complain here if you use underscore (_) to spread the unused variable.
Nope, does not seem to have an effect.
konrad
commented
Done. > Add ?.[0] so we return the key, which is what we actually want to use and adjust variable name.
Done.
dpschen
commented
Interesting! > Nope, does not seem to have an effect.
Interesting!
|
||||
showNulls() {
|
||||
|
konrad marked this conversation as resolved
Outdated
dpschen
commented
Remove title var and return directly: Remove title var and return directly:
```js
if (typeof predefinedRange !== 'undefined') {
return t(`input.datepickerRange.ranges.${predefinedRangeKey}`)
} else {
return showAll
? t('task.show.titleCurrent')
: t('task.show.fromuntil', {
from: formatDate(dateFrom, 'PPP'),
until: formatDate(dateTo, 'PPP'),
})
}
konrad
commented
Done. Done.
|
||||
return this.$route.query.showNulls === 'true'
|
||||
|
|
|
|||
|
|
@ -1,20 +0,0 @@
|
|||
<template>
|
||||
<div class="content has-text-centered">
|
||||
<ShowTasks
|
||||
:end-date="endDate"
|
||||
:start-date="startDate"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue'
|
||||
import ShowTasks from './ShowTasks.vue'
|
||||
|
||||
function getNextWeekDate() {
|
||||
return new Date((new Date()).getTime() + 7 * 24 * 60 * 60 * 1000)
|
||||
}
|
||||
|
||||
const startDate = ref(new Date())
|
||||
const endDate = ref(getNextWeekDate())
|
||||
</script>
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
<template>
|
||||
<div class="content has-text-centered">
|
||||
<ShowTasks/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import ShowTasks from './ShowTasks.vue'
|
||||
</script>
|
||||
get value from props to remove dependency on route. Removing dependency from router makes the components easier reusable nested inside another view (which is what we do).