feat: implement modals with vue router 4 #816

Merged
konrad merged 62 commits from dpschen/frontend:feature/vue3-modals-with-router-4 into main 2022-02-05 16:49:04 +00:00
3 changed files with 16 additions and 23 deletions
Showing only changes of commit 76f4cca5fe - Show all commits

View File

@ -1,3 +1,5 @@
// Save the current list view to local storage
// We use local storage and not vuex here to make it persistent across reloads.
export const saveListView = (listId, routeName) => {
if (routeName.includes('settings.')) {
return

View File

@ -2,7 +2,7 @@ import { createRouter, createWebHistory, RouteLocation } from 'vue-router'
import {saveLastVisited} from '@/helpers/saveLastVisited'
import {store} from '@/store'
import {getListView} from '@/helpers/saveListView'
import {saveListView, getListView} from '@/helpers/saveListView'
import HomeComponent from '../views/Home'
import NotFoundComponent from '../views/404'
@ -244,9 +244,7 @@ const router = createRouter({
path: '/tasks/:id',
name: 'task.detail',
component: TaskDetailViewModal,
props: route => ({
taskId: parseInt(route.params.id),
}),
props: route => ({ taskId: parseInt(route.params.id) }),
},
{
path: '/tasks/by/upcoming',
@ -328,14 +326,16 @@ const router = createRouter({
{
path: '/lists/:listId',
name: 'list.index',
beforeEnter(to) {
redirect(to) {
// Redirect the user to list view by default
const savedListView = getListView(to.params.listId)
console.debug('Replaced list view with', savedListView)
return {
name: savedListView,
name: router.hasRoute(savedListView)
? savedListView
: 'list.list',
params: {listId: to.params.listId},
}
},
@ -344,33 +344,29 @@ const router = createRouter({
path: '/lists/:listId/list',
name: 'list.list',
component: ListList,
props: route => ({
listId: parseInt(route.params.listId),
}),
beforeEnter: (to) => saveListView(to.params.listId, to.name),
props: route => ({ listId: parseInt(route.params.listId) }),
},
{
path: '/lists/:listId/gantt',
name: 'list.gantt',
component: ListGantt,
props: route => ({
listId: parseInt(route.params.listId),
}),
beforeEnter: (to) => saveListView(to.params.listId, to.name),
props: route => ({ listId: parseInt(route.params.listId) }),
},
{
path: '/lists/:listId/table',
name: 'list.table',
component: ListTable,
props: route => ({
listId: parseInt(route.params.listId),
}),
beforeEnter: (to) => saveListView(to.params.listId, to.name),
props: route => ({ listId: parseInt(route.params.listId) }),
},
{
path: '/lists/:listId/kanban',
name: 'list.kanban',
component: ListKanban,
props: route => ({
listId: parseInt(route.params.listId),
}),
beforeEnter: (to) => saveListView(to.params.listId, to.name),
props: route => ({ listId: parseInt(route.params.listId) }),
},
{
path: '/teams',

View File

@ -59,7 +59,6 @@ import {store} from '@/store'
import {CURRENT_LIST} from '@/store/mutation-types'
import {getListTitle} from '@/helpers/getListTitle'
import {saveListView} from '@/helpers/saveListView'
import {saveListToHistory} from '@/modules/listHistory'
import { useTitle } from '@/composables/useTitle'
@ -76,10 +75,6 @@ const props = defineProps({
const route = useRoute()
// Save the current list view to local storage
// We use local storage and not vuex here to make it persistent across reloads.
saveListView(props.listId, props.viewName)
const listService = shallowRef(new ListService())
const loadedListId = ref(0)