vikunja
/
frontend
Archived
6
39
Fork 49
Code Issues 1 Pull Requests 4 Projects Releases 26 Activity

feat: add date math for filters #1342

Merged
konrad merged 88 commits from feature/date-math into main 2022-03-28 17:30:43 +00:00
Conversation 2 Commits 88 Files Changed 18 +10 -10
1 changed files with 10 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit b274a796d4 - Show all commits

20
src/components/date/datepickerWithRange.vue
View File

@ -23,7 +23,7 @@
</div>
</template>
<script setup>
<script lang="ts" setup>
import flatPickr from 'vue-flatpickr-component'
import 'flatpickr/dist/flatpickr.css'
import {computed, ref, watch} from 'vue'
@ -35,7 +35,7 @@ const {t} = useI18n()
const emit = defineEmits(['dateChanged'])
const weekStart = computed(() => store.state.auth.settings.weekStart)
const weekStart = computed<number>(() => store.state.auth.settings.weekStart)
const flatPickerConfig = computed(() => ({
altFormat: t('date.altFormatLong'),
altInput: true,
@ -50,11 +50,11 @@ const flatPickerConfig = computed(() => ({
},
}))
const dateRange = ref('')
const dateRange = ref<string>('')
watch(
konrad marked this conversation as resolved
dpschen commented 2022-02-06 13:14:02 +00:00
Review
Copy Link

Use BaseButton

Use BaseButton
konrad commented 2022-02-06 17:52:16 +00:00
Review
Copy Link

Done.

Done.
() => dateRange.value,
newVal => {
(newVal: string | null) => {
if (newVal === null) {
return
}
@ -72,33 +72,33 @@ watch(
}
)
function formatDate(date) {
function formatDate(date: Date): string {
return format(date, 'yyyy-MM-dd HH:mm')
dpschen marked this conversation as resolved Outdated
dpschen commented 2022-02-06 13:15:42 +00:00
Outdated
Review
Copy Link

I think it's really cool, that we support this, but it would be cool, if we could break this down and explain it in our / simpler terms.

I think it's really cool, that we support this, but it would be cool, if we could break this down and explain it in our / simpler terms.
konrad commented 2022-02-06 17:53:56 +00:00
Outdated
Review
Copy Link

I think I'm already doing that but wanted to highlight for people who know the syntax from Elasticsearch or Grafana they can use it here as well.

Was there anything in the explanation you noticed as not quite understandable?

I think I'm already doing that but wanted to highlight for people who know the syntax from Elasticsearch or Grafana they can use it here as well. Was there anything in the explanation you noticed as not quite understandable?
dpschen commented 2022-02-06 19:19:07 +00:00
Outdated
Review
Copy Link

I didn't even check to be honest.
Was just something I though of while reading this.

I didn't even check to be honest. Was just something I though of while reading this.
👍 1
}
const datesToday = computed(() => {
const datesToday = computed<string>(() => {
const startDate = new Date()
const endDate = new Date((new Date()).setDate((new Date()).getDate() + 1))
return `${formatDate(startDate)} to ${formatDate(endDate)}`
})
const datesNextWeek = computed(() => {
const datesNextWeek = computed<string>(() => {
const startDate = new Date()
const endDate = new Date((new Date()).getTime() + 7 * 24 * 60 * 60 * 1000)
return `${formatDate(startDate)} to ${formatDate(endDate)}`
})
const datesNextMonth = computed(() => {
const datesNextMonth = computed<string>(() => {
const startDate = new Date()
const endDate = new Date((new Date()).setMonth((new Date()).getMonth() + 1))
return `${formatDate(startDate)} to ${formatDate(endDate)}`
})
function setDateRange(range) {
function setDateRange(range: string) {
dateRange.value = range
}
const customRangeActive = computed(() => {
const customRangeActive = computed<Boolean>(() => {
return dateRange.value !== datesToday.value &&
dateRange.value !== datesNextWeek.value &&
dateRange.value !== datesNextMonth.value