Merge branch 'main' into feature/vue3-modals-with-router-4
# Conflicts: # src/router/index.ts # src/views/tasks/TaskDetailView.vue
This commit is contained in:
@ -254,4 +254,13 @@ export default {
|
||||
background-color: var(--primary-dark);
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
@keyframes wave {
|
||||
10% {
|
||||
transform: translate(0, 0);
|
||||
background-color: var(--primary);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
@ -24,17 +24,17 @@ export const MIGRATORS: IMigratorRecord = {
|
||||
todoist: {
|
||||
id: 'todoist',
|
||||
name: 'Todoist',
|
||||
icon: todoistIcon,
|
||||
icon: todoistIcon as string,
|
||||
},
|
||||
trello: {
|
||||
id: 'trello',
|
||||
name: 'Trello',
|
||||
icon: trelloIcon,
|
||||
icon: trelloIcon as string,
|
||||
},
|
||||
'microsoft-todo': {
|
||||
id: 'microsoft-todo',
|
||||
name: 'Microsoft Todo',
|
||||
icon: microsoftTodoIcon,
|
||||
icon: microsoftTodoIcon as string,
|
||||
},
|
||||
'vikunja-file': {
|
||||
id: 'vikunja-file',
|
||||
|
@ -1,15 +1,19 @@
|
||||
<template>
|
||||
<div class="content namespaces-list loader-container" :class="{'is-loading': loading}">
|
||||
<x-button :to="{name: 'namespace.create'}" class="new-namespace" icon="plus">
|
||||
{{ $t('namespace.create.title') }}
|
||||
</x-button>
|
||||
<x-button :to="{name: 'filters.create'}" class="new-namespace" icon="filter">
|
||||
{{ $t('filters.create.title') }}
|
||||
</x-button>
|
||||
<div class="content loader-container" :class="{'is-loading': loading}" v-cy="'namespaces-list'">
|
||||
<header class="namespace-header">
|
||||
<fancycheckbox v-model="showArchived" @change="saveShowArchivedState" v-cy="'show-archived-check'">
|
||||
{{ $t('namespace.showArchived') }}
|
||||
</fancycheckbox>
|
||||
|
||||
<fancycheckbox class="show-archived-check" v-model="showArchived" @change="saveShowArchivedState">
|
||||
{{ $t('namespace.showArchived') }}
|
||||
</fancycheckbox>
|
||||
<div class="action-buttons">
|
||||
<x-button :to="{name: 'filters.create'}" icon="filter">
|
||||
{{ $t('filters.create.title') }}
|
||||
</x-button>
|
||||
<x-button :to="{name: 'namespace.create'}" icon="plus" v-cy="'new-namespace'">
|
||||
{{ $t('namespace.create.title') }}
|
||||
</x-button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<p class="has-text-centered has-text-grey mt-4 is-italic" v-if="namespaces.length === 0">
|
||||
{{ $t('namespace.noneAvailable') }}
|
||||
@ -18,7 +22,7 @@
|
||||
</router-link>
|
||||
</p>
|
||||
|
||||
<div :key="`n${n.id}`" class="namespace" v-for="n in namespaces">
|
||||
<section :key="`n${n.id}`" class="namespace" v-for="n in namespaces">
|
||||
<x-button
|
||||
:to="{name: 'list.create', params: {namespaceId: n.id}}"
|
||||
class="is-pulled-right"
|
||||
@ -38,12 +42,12 @@
|
||||
{{ $t('namespace.unarchive') }}
|
||||
</x-button>
|
||||
|
||||
<h1>
|
||||
<span>{{ getNamespaceTitle(n) }}</span>
|
||||
<h2 class="namespace-title">
|
||||
<span v-cy="'namespace-title'">{{ getNamespaceTitle(n) }}</span>
|
||||
<span class="is-archived" v-if="n.isArchived">
|
||||
{{ $t('namespace.archived') }}
|
||||
</span>
|
||||
</h1>
|
||||
</h2>
|
||||
|
||||
<p class="has-text-centered has-text-grey mt-4 is-italic" v-if="n.lists.length === 0">
|
||||
{{ $t('namespace.noLists') }}
|
||||
@ -60,7 +64,7 @@
|
||||
:show-archived="showArchived"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -103,47 +107,53 @@ export default {
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.namespaces-list {
|
||||
.button.new-namespace {
|
||||
float: right;
|
||||
margin-left: 1rem;
|
||||
.namespace-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
|
||||
@media screen and (max-width: $mobile) {
|
||||
float: none;
|
||||
width: 100%;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: $tablet) {
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
|
||||
.show-archived-check {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
.action-buttons {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
gap: 1rem;
|
||||
|
||||
.namespace {
|
||||
&:not(:last-child) {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
@media screen and (max-width: $tablet) {
|
||||
width: 100%;
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
}
|
||||
}
|
||||
|
||||
h1 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.namespace {
|
||||
& + & {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.is-archived {
|
||||
font-size: 0.75rem;
|
||||
border: 1px solid var(--grey-500);
|
||||
color: $grey !important;
|
||||
padding: 2px 4px;
|
||||
border-radius: 3px;
|
||||
font-family: $vikunja-font;
|
||||
background: var(--white-translucent);
|
||||
margin-left: .5rem;
|
||||
}
|
||||
.namespace-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.lists {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
}
|
||||
}
|
||||
.is-archived {
|
||||
font-size: 0.75rem;
|
||||
border: 1px solid var(--grey-500);
|
||||
color: $grey !important;
|
||||
padding: 2px 4px;
|
||||
border-radius: 3px;
|
||||
font-family: $vikunja-font;
|
||||
background: var(--white-translucent);
|
||||
margin-left: .5rem;
|
||||
}
|
||||
|
||||
.lists {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
}
|
||||
</style>
|
@ -44,7 +44,7 @@ import Message from '@/components/misc/message.vue'
|
||||
const {t} = useI18n()
|
||||
useTitle(t('sharing.authenticating'))
|
||||
|
||||
async function useAuth() {
|
||||
function useAuth() {
|
||||
const store = useStore()
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
@ -75,21 +75,21 @@ async function useAuth() {
|
||||
password: password.value,
|
||||
})
|
||||
router.push({name: 'list.list', params: {listId}})
|
||||
} catch (e) {
|
||||
} catch (e: any) {
|
||||
if (e.response?.data?.code === 13001) {
|
||||
authenticateWithPassword.value = true
|
||||
return
|
||||
}
|
||||
|
||||
// TODO: Put this logic in a global errorMessage handler method which checks all auth codes
|
||||
let errorMessage = t('sharing.error')
|
||||
let err = t('sharing.error')
|
||||
if (e.response?.data?.message) {
|
||||
errorMessage = e.response.data.message
|
||||
err = e.response.data.message
|
||||
}
|
||||
if (e.response?.data?.code === 13002) {
|
||||
errorMessage = t('sharing.invalidPassword')
|
||||
err = t('sharing.invalidPassword')
|
||||
}
|
||||
errorMessage.value = errorMessage
|
||||
errorMessage.value = err
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
|
@ -9,7 +9,7 @@
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue'
|
||||
import ShowTasks from './ShowTasks'
|
||||
import ShowTasks from './ShowTasks.vue'
|
||||
|
||||
function getNextWeekDate() {
|
||||
return new Date((new Date()).getTime() + 7 * 24 * 60 * 60 * 1000)
|
||||
|
@ -386,22 +386,28 @@
|
||||
|
||||
<!-- Created / Updated [by] -->
|
||||
<p class="created">
|
||||
<i18n-t keypath="task.detail.created">
|
||||
<span v-tooltip="formatDate(task.created)">{{ formatDateSince(task.created) }}</span>
|
||||
{{ task.createdBy.getDisplayName() }}
|
||||
</i18n-t>
|
||||
<time :datetime="formatISO(task.created)" v-tooltip="formatDate(task.created)">
|
||||
<i18n-t keypath="task.detail.created">
|
||||
<span>{{ formatDateSince(task.created) }}</span>
|
||||
{{ task.createdBy.getDisplayName() }}
|
||||
</i18n-t>
|
||||
</time>
|
||||
<template v-if="+new Date(task.created) !== +new Date(task.updated)">
|
||||
<br/>
|
||||
<!-- Computed properties to show the actual date every time it gets updated -->
|
||||
<i18n-t keypath="task.detail.updated">
|
||||
<span v-tooltip="updatedFormatted">{{ updatedSince }}</span>
|
||||
</i18n-t>
|
||||
<time :datetime="formatISO(task.updated)" v-tooltip="updatedFormatted">
|
||||
<i18n-t keypath="task.detail.updated">
|
||||
<span>{{ updatedSince }}</span>
|
||||
</i18n-t>
|
||||
</time>
|
||||
</template>
|
||||
<template v-if="task.done">
|
||||
<br/>
|
||||
<i18n-t keypath="task.detail.doneAt">
|
||||
<span v-tooltip="doneFormatted">{{ doneSince }}</span>
|
||||
</i18n-t>
|
||||
<time :datetime="formatISO(task.doneAt)" v-tooltip="doneFormatted">
|
||||
<i18n-t keypath="task.detail.doneAt">
|
||||
<span>{{ doneSince }}</span>
|
||||
</i18n-t>
|
||||
</time>
|
||||
</template>
|
||||
</p>
|
||||
</div>
|
||||
@ -633,7 +639,6 @@ export default {
|
||||
}
|
||||
|
||||
this.task = await this.$store.dispatch('tasks/update', this.task)
|
||||
this.setActiveFields()
|
||||
|
||||
if (!showNotification) {
|
||||
return
|
||||
@ -877,7 +882,7 @@ $flash-background-duration: 750ms;
|
||||
}
|
||||
|
||||
.action-buttons {
|
||||
a.button {
|
||||
.button {
|
||||
width: 100%;
|
||||
margin-bottom: .5rem;
|
||||
justify-content: left;
|
||||
@ -939,5 +944,13 @@ $flash-background-duration: 750ms;
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
@keyframes flash-background {
|
||||
0% {
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include modal-transition();
|
||||
</style>
|
Reference in New Issue
Block a user