forked from vikunja/frontend
90 lines
2.9 KiB
Vue
90 lines
2.9 KiB
Vue
<template>
|
|
<div class="loader-container" :class="{ 'is-loading': listService.loading}">
|
|
<div class="content">
|
|
<router-link :to="{ name: 'editList', params: { id: list.id } }" class="icon settings is-medium">
|
|
<icon icon="cog" size="2x"/>
|
|
</router-link>
|
|
<h1 :style="{ 'opacity': list.title === '' ? '0': '1' }">{{ list.title === '' ? 'Loading...': list.title}}</h1>
|
|
<div class="notification is-warning" v-if="list.isArchived">
|
|
This list is archived.
|
|
It is not possible to create new or edit tasks or it.
|
|
</div>
|
|
<div class="switch-view">
|
|
<router-link :to="{ name: 'showList', params: { id: list.id } }" :class="{'is-active': $route.params.type !== 'gantt' && $route.params.type !== 'table'}">List</router-link>
|
|
<router-link :to="{ name: 'showListWithType', params: { id: list.id, type: 'gantt' } }" :class="{'is-active': $route.params.type === 'gantt'}">Gantt</router-link>
|
|
<router-link :to="{ name: 'showListWithType', params: { id: list.id, type: 'table' } }" :class="{'is-active': $route.params.type === 'table'}">Table</router-link>
|
|
</div>
|
|
</div>
|
|
|
|
<gantt :list="list" v-if="$route.params.type === 'gantt'"/>
|
|
<table-view :list="list" v-else-if="$route.params.type === 'table'"/>
|
|
<show-list-task :the-list="list" v-else/>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import auth from '../../auth'
|
|
import router from '../../router'
|
|
|
|
import ShowListTask from '../tasks/ShowListTasks'
|
|
import Gantt from '../tasks/Gantt'
|
|
|
|
import ListModel from '../../models/list'
|
|
import ListService from '../../services/list'
|
|
import authType from '../../models/authTypes'
|
|
import TableView from '../tasks/TableView'
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
listID: this.$route.params.id,
|
|
listService: ListService,
|
|
list: ListModel,
|
|
}
|
|
},
|
|
components: {
|
|
TableView,
|
|
Gantt,
|
|
ShowListTask,
|
|
},
|
|
beforeMount() {
|
|
// Check if the user is already logged in, if so, redirect him to the homepage
|
|
if (!auth.user.authenticated && auth.user.infos.type !== authType.LINK_SHARE) {
|
|
router.push({name: 'home'})
|
|
}
|
|
|
|
// If the type is invalid, redirect the user
|
|
if (
|
|
auth.user.authenticated &&
|
|
auth.user.infos.type !== authType.LINK_SHARE &&
|
|
this.$route.params.type !== 'gantt' &&
|
|
this.$route.params.type !== 'table' &&
|
|
this.$route.params.type !== ''
|
|
) {
|
|
router.push({name: 'showList', params: { id: this.$route.params.id }})
|
|
}
|
|
},
|
|
created() {
|
|
this.listService = new ListService()
|
|
this.list = new ListModel()
|
|
this.loadList()
|
|
},
|
|
watch: {
|
|
// call again the method if the route changes
|
|
'$route.path': 'loadList'
|
|
},
|
|
methods: {
|
|
loadList() {
|
|
// We create an extra list object instead of creating it in this.list because that would trigger a ui update which would result in bad ux.
|
|
let list = new ListModel({id: this.$route.params.id})
|
|
this.listService.get(list)
|
|
.then(r => {
|
|
this.$set(this, 'list', r)
|
|
})
|
|
.catch(e => {
|
|
this.error(e, this)
|
|
})
|
|
},
|
|
}
|
|
}
|
|
</script> |