local-it/vikunja-frontend
0
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

feat: add close task popup link (#880)

Browse source 
Co-authored-by: kolaente <k@knt.li>
Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/880
Co-authored-by: konrad <k@knt.li>
Co-committed-by: konrad <k@knt.li>
This commit is contained in:
konrad 2021-10-21 20:00:45 +00:00 committed by Dominik Pschenitschni
parent c6b24dd8f1
commit 877b243c69
No known key found for this signature in database
GPG key ID: B257AC0149F43A77
4 changed files with 151 additions and 137 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
src/i18n/lang/en.json
View file

@ -527,6 +527,7 @@
"deleteSuccess": "The task has been deleted successfully.",
"belongsToList": "This task belongs to list '{list}'",
"due": "Due {at}",
"closePopup": "Close popup",
"delete": {
"header": "Delete this task",
"text1": "Are you sure you want to remove this task?",

2
src/icons.js
View file

@ -3,6 +3,7 @@ import {
faAlignLeft,
faAngleRight,
faArchive,
faArrowLeft,
faBars,
faBell,
faCalendar,
@ -67,6 +68,7 @@ import {FontAwesomeIcon} from '@fortawesome/vue-fontawesome'
library.add(faAlignLeft)
library.add(faAngleRight)
library.add(faArchive)
library.add(faArrowLeft)
library.add(faBars)
library.add(faBell)
library.add(faBellSlash)

283
src/views/tasks/TaskDetailView.vue
View file

@ -8,7 +8,7 @@
{{ getListTitle(parent.list) }}
</router-link>
</h6>
<checklist-summary :task="task"/>
<!-- Content and buttons -->
@ -246,138 +246,146 @@
<!-- Comments -->
<comments :can-write="canWrite" :task-id="taskId"/>
</div>
<div class="column is-one-third action-buttons" v-if="canWrite">
<x-button
:class="{'is-success': !task.done}"
:shadow="task.done"
@click="toggleTaskDone()"
class="is-outlined has-no-border"
icon="check-double"
type="secondary"
>
{{ task.done ? $t('task.detail.undone') : $t('task.detail.done') }}
</x-button>
<task-subscription
entity="task"
:entity-id="task.id"
:subscription="task.subscription"
@change="sub => task.subscription = sub"
/>
<x-button
@click="setFieldActive('assignees')"
@shortkey="setFieldActive('assignees')"
type="secondary"
v-shortkey="['a']">
<span class="icon is-small"><icon icon="users"/></span>
{{ $t('task.detail.actions.assign') }}
</x-button>
<x-button
@click="setFieldActive('labels')"
@shortkey="setFieldActive('labels')"
type="secondary"
v-shortkey="['l']"
icon="tags"
>
{{ $t('task.detail.actions.label') }}
</x-button>
<x-button
@click="setFieldActive('priority')"
type="secondary"
:icon="['far', 'star']"
>
{{ $t('task.detail.actions.priority') }}
</x-button>
<x-button
@click="setFieldActive('dueDate')"
@shortkey="setFieldActive('dueDate')"
type="secondary"
v-shortkey="['d']"
icon="calendar"
>
{{ $t('task.detail.actions.dueDate') }}
</x-button>
<x-button
@click="setFieldActive('startDate')"
type="secondary"
icon="calendar-week"
>
{{ $t('task.detail.actions.startDate') }}
</x-button>
<x-button
@click="setFieldActive('endDate')"
type="secondary"
icon="calendar-week"
>
{{ $t('task.detail.actions.endDate') }}
</x-button>
<x-button
@click="setFieldActive('reminders')"
type="secondary"
icon="history"
>
{{ $t('task.detail.actions.reminders') }}
</x-button>
<x-button
@click="setFieldActive('repeatAfter')"
type="secondary"
:icon="['far', 'clock']"
>
{{ $t('task.detail.actions.repeatAfter') }}
</x-button>
<x-button
@click="setFieldActive('percentDone')"
type="secondary"
icon="percent"
>
{{ $t('task.detail.actions.percentDone') }}
</x-button>
<x-button
@click="setFieldActive('attachments')"
@shortkey="setFieldActive('attachments')"
type="secondary"
v-shortkey="['f']"
icon="paperclip"
>
{{ $t('task.detail.actions.attachments') }}
</x-button>
<x-button
@click="setFieldActive('relatedTasks')"
@shortkey="setFieldActive('relatedTasks')"
type="secondary"
v-shortkey="['r']"
icon="tasks"
>
{{ $t('task.detail.actions.relatedTasks') }}
</x-button>
<x-button
@click="setFieldActive('moveList')"
type="secondary"
icon="list"
>
{{ $t('task.detail.actions.moveList') }}
</x-button>
<x-button
@click="setFieldActive('color')"
type="secondary"
icon="fill-drip"
>
{{ $t('task.detail.actions.color') }}
</x-button>
<x-button
@click="toggleFavorite"
type="secondary"
:icon="task.isFavorite ? 'star' : ['far', 'star']"
>
{{ task.isFavorite ? $t('task.detail.actions.unfavorite') : $t('task.detail.actions.favorite') }}
</x-button>
<x-button
@click="showDeleteModal = true"
icon="trash-alt"
:shadow="false"
class="is-danger is-outlined has-no-border"
>
{{ $t('task.detail.actions.delete') }}
</x-button>
<div class="column is-one-third action-buttons">
<a @click="$router.back()" class="is-fullwidth is-block has-text-centered mb-4" v-if="shouldShowClosePopup">
<icon icon="arrow-left"/>
{{ $t('task.detail.closePopup') }}
</a>
<template v-if="canWrite">
<x-button
:class="{'is-success': !task.done}"
:shadow="task.done"
@click="toggleTaskDone()"
class="is-outlined has-no-border"
icon="check-double"
type="secondary"
>
{{ task.done ? $t('task.detail.undone') : $t('task.detail.done') }}
</x-button>
<task-subscription
entity="task"
:entity-id="task.id"
:subscription="task.subscription"
@change="sub => task.subscription = sub"
/>
<x-button
@click="setFieldActive('assignees')"
@shortkey="setFieldActive('assignees')"
type="secondary"
v-shortkey="['a']">
<span class="icon is-small"><icon icon="users"/></span>
{{ $t('task.detail.actions.assign') }}
</x-button>
<x-button
@click="setFieldActive('labels')"
@shortkey="setFieldActive('labels')"
type="secondary"
v-shortkey="['l']"
icon="tags"
>
{{ $t('task.detail.actions.label') }}
</x-button>
<x-button
@click="setFieldActive('priority')"
type="secondary"
:icon="['far', 'star']"
>
{{ $t('task.detail.actions.priority') }}
</x-button>
<x-button
@click="setFieldActive('dueDate')"
@shortkey="setFieldActive('dueDate')"
type="secondary"
v-shortkey="['d']"
icon="calendar"
>
{{ $t('task.detail.actions.dueDate') }}
</x-button>
<x-button
@click="setFieldActive('startDate')"
type="secondary"
icon="calendar-week"
>
{{ $t('task.detail.actions.startDate') }}
</x-button>
<x-button
@click="setFieldActive('endDate')"
type="secondary"
icon="calendar-week"
>
{{ $t('task.detail.actions.endDate') }}
</x-button>
<x-button
@click="setFieldActive('reminders')"
type="secondary"
icon="history"
>
{{ $t('task.detail.actions.reminders') }}
</x-button>
<x-button
@click="setFieldActive('repeatAfter')"
type="secondary"
:icon="['far', 'clock']"
>
{{ $t('task.detail.actions.repeatAfter') }}
</x-button>
<x-button
@click="setFieldActive('percentDone')"
type="secondary"
icon="percent"
>
{{ $t('task.detail.actions.percentDone') }}
</x-button>
<x-button
@click="setFieldActive('attachments')"
@shortkey="setFieldActive('attachments')"
type="secondary"
v-shortkey="['f']"
icon="paperclip"
>
{{ $t('task.detail.actions.attachments') }}
</x-button>
<x-button
@click="setFieldActive('relatedTasks')"
@shortkey="setFieldActive('relatedTasks')"
type="secondary"
v-shortkey="['r']"
icon="tasks"
>
{{ $t('task.detail.actions.relatedTasks') }}
</x-button>
<x-button
@click="setFieldActive('moveList')"
type="secondary"
icon="list"
>
{{ $t('task.detail.actions.moveList') }}
</x-button>
<x-button
@click="setFieldActive('color')"
type="secondary"
icon="fill-drip"
>
{{ $t('task.detail.actions.color') }}
</x-button>
<x-button
@click="toggleFavorite"
type="secondary"
:icon="task.isFavorite ? 'star' : ['far', 'star']"
>
{{
task.isFavorite ? $t('task.detail.actions.unfavorite') : $t('task.detail.actions.favorite')
}}
</x-button>
<x-button
@click="showDeleteModal = true"
icon="trash-alt"
:shadow="false"
class="is-danger is-outlined has-no-border"
>
{{ $t('task.detail.actions.delete') }}
</x-button>
</template>
<!-- Created / Updated [by] -->
<p class="created">
@ -410,10 +418,10 @@
v-if="showDeleteModal"
>
<template #header><span>{{ $t('task.detail.delete.header') }}</span></template>
<template #text>
<p>{{ $t('task.detail.delete.text1') }}<br/>
{{ $t('task.detail.delete.text2') }}</p>
{{ $t('task.detail.delete.text2') }}</p>
</template>
</modal>
</transition>
@ -520,7 +528,7 @@ export default {
},
computed: {
taskId() {
const { id } = this.$route.params
const {id} = this.$route.params
return id === undefined ? id : Number(id)
},
currentList() {
@ -558,6 +566,9 @@ export default {
hasAttachments() {
return this.$store.state.attachments.attachments.length > 0
},
shouldShowClosePopup() {
return this.$route.name.includes('kanban')
},
},
methods: {
attachmentUpload(...args) {

2
src/views/tasks/TaskDetailViewModal.vue
View file

@ -57,7 +57,7 @@ export default {
font-size: 2rem;
@media screen and (max-width: $desktop) {
display: none;
color: $dark;
}
}
</style>