ami/tl-vikunja
1
0
Fork 0
Code

fix: correctly resolve kanban board in the background when moving a task

Browse Source 
Resolves F-951
This commit is contained in:
kolaente 2023-07-10 18:10:14 +02:00
parent d5358793de
commit 8902c15f7e
No known key found for this signature in database
GPG Key ID: F40E70337AB24C9B
2 changed files with 26 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/composables/useRouteWithModal.ts
View File

@ -1,10 +1,12 @@
import { computed, shallowRef, watchEffect, h, type VNode } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import {computed, shallowRef, watchEffect, h, type VNode} from 'vue'
import {useRoute, useRouter} from 'vue-router'
import {useBaseStore} from '@/stores/base'
export function useRouteWithModal() {
const router = useRouter()
const route = useRoute()
const backdropView = computed(() => route.fullPath && window.history.state.backdropView)
const baseStore = useBaseStore()
const routeWithModal = computed(() => {
return backdropView.value
@ -44,6 +46,18 @@ export function useRouteWithModal() {
function closeModal() {
const historyState = computed(() => route.fullPath && window.history.state)
// If the current project was changed because the user moved the currently opened task while coming from kanban,
// we need to reflect that change in the route when they close the task modal.
// The last route is only available as resolved string, therefore we need to use a regex for matching here
const kanbanRouteMatch = new RegExp('\\/projects\\/\\d+\\/kanban', 'g')
const kanbanRouter = {name: 'project.kanban', params: {projectId: baseStore.currentProject?.id}}
if (kanbanRouteMatch.test(historyState.value.back)
&& baseStore.currentProject
&& historyState.value.back !== router.resolve(kanbanRouter).fullPath) {
router.push(kanbanRouter)
return
}
if (historyState.value) {
router.back()
} else {

26
src/views/project/ProjectKanban.vue
View File

@ -1,7 +1,7 @@
<template>
<ProjectWrapper
class="project-kanban"
:project-id="projectId"
:project-id="project.id"
viewName="kanban"
>
<template #header>
@ -224,7 +224,7 @@
</template>
<script setup lang="ts">
import {computed, nextTick, ref, watch, type PropType} from 'vue'
import {computed, nextTick, ref, watch} from 'vue'
import {useI18n} from 'vue-i18n'
import draggable from 'zhyswan-vuedraggable'
import {klona} from 'klona/lite'
@ -263,13 +263,6 @@ const DRAG_OPTIONS = {
const MIN_SCROLL_HEIGHT_PERCENT = 0.25
const props = defineProps({
projectId: {
type: Number as PropType<IProject['id']>,
required: true,
},
})
const {t} = useI18n({useScope: 'global'})
const baseStore = useBaseStore()
@ -340,10 +333,11 @@ const taskLoading = computed(() => taskStore.isLoading)
watch(
() => ({
projectId: props.projectId,
params: params.value,
project: project.value,
}),
({projectId, params}) => {
({params, project}) => {
const projectId = project.id
if (projectId === undefined) {
return
}
@ -483,7 +477,7 @@ async function addTaskToBucket(bucketId: IBucket['id']) {
const task = await taskStore.createNewTask({
title: newTaskText.value,
bucketId,
projectId: props.projectId,
projectId: project.value.id,
})
newTaskText.value = ''
kanbanStore.addTaskToBucket(task)
@ -505,7 +499,7 @@ async function createNewBucket() {
await kanbanStore.createBucket(new BucketModel({
title: newBucketTitle.value,
projectId: props.projectId,
projectId: project.value.id,
}))
newBucketTitle.value = ''
showNewBucketInput.value = false
@ -525,7 +519,7 @@ async function deleteBucket() {
await kanbanStore.deleteBucket({
bucket: new BucketModel({
id: bucketToDelete.value,
projectId: props.projectId,
projectId: project.value.id,
}),
params: params.value,
})
@ -612,7 +606,7 @@ async function toggleDoneBucket(bucket: IBucket) {
function collapseBucket(bucket: IBucket) {
collapsedBuckets.value[bucket.id] = true
saveCollapsedBucketState(props.projectId, collapsedBuckets.value)
saveCollapsedBucketState(project.value.id, collapsedBuckets.value)
}
function unCollapseBucket(bucket: IBucket) {
@ -621,7 +615,7 @@ function unCollapseBucket(bucket: IBucket) {
}
collapsedBuckets.value[bucket.id] = false
saveCollapsedBucketState(props.projectId, collapsedBuckets.value)
saveCollapsedBucketState(project.value.id, collapsedBuckets.value)
}
</script>