vikunja/frontend
Archived
6
39
Fork 48
Code Issues 1 Pull Requests 4 Projects Releases 26 Activity

fix: related tasks add button and task dates in read only view #1268

Merged
konrad merged 5 commits from fix/read-only-layout into main 2022-02-06 15:58:53 +00:00
Conversation 2 Commits 5 Files Changed 3 +234 -227
3 changed files with 234 additions and 227 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 8ba693a446 - Show all commits

39
src/components/tasks/partials/createdUpdated.vue Normal file
View File

@ -0,0 +1,39 @@
<template>
<p class="created">
<i18n-t keypath="task.detail.created">
<span v-tooltip="formatDate(task.created)">{{ formatDateSince(task.created) }}</span>
{{ task.createdBy.getDisplayName() }}
</i18n-t>
<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>
</template>
<template v-if="task.done">
<br/>
<i18n-t keypath="task.detail.doneAt">
<span v-tooltip="doneFormatted">{{ doneSince }}</span>
</i18n-t>
</template>
</p>
</template>
<script lang="ts" setup>
import {computed, defineProps} from 'vue'
import TaskModel from '@/models/task'
import {formatDateLong, formatDateSince} from '@/helpers/time/formatDate'
const {task} = defineProps({
konrad marked this conversation as resolved Outdated
dpschen commented 2022-01-04 20:36:22 +00:00
Outdated
Review
Copy Link

As the failing test says:

/drone/src/src/components/tasks/partials/createdUpdated.vue
  28:7  error  Destructuring the `props` will cause the value to lose reactivity  vue/no-setup-props-destructure
  32:3  error  Missing trailing comma                                             comma-dangle

*EDIT: you can however use toRefs and then use task.value

As the failing test says: ``` /drone/src/src/components/tasks/partials/createdUpdated.vue 28:7 error Destructuring the `props` will cause the value to lose reactivity vue/no-setup-props-destructure 32:3 error Missing trailing comma comma-dangle ``` ***EDIT:** you can however use [toRefs](https://v3.vuejs.org/api/refs-api.html#torefs) and then use `task.value`
konrad commented 2022-01-08 11:41:43 +00:00
Outdated
Review
Copy Link

Changed it to use toRefs.

Changed it to use `toRefs`.
task: {
type: TaskModel,
required: true,
}
})
const updatedSince = computed(() => formatDateSince(task.updated))
const updatedFormatted = computed(() => formatDateLong(task.updated))
const doneSince = computed(() => formatDateSince(task.doneAt))
const doneFormatted = computed(() => formatDateLong(task.doneAt))
</script>

2
src/components/tasks/partials/relatedTasks.vue
View File

@ -1,7 +1,7 @@
<template>
<div class="task-relations">
<x-button
v-if="Object.keys(relatedTasks).length > 0"
v-if="editEnabled && Object.keys(relatedTasks).length > 0"
@click="showNewRelationForm = !showNewRelationForm"
class="is-pulled-right add-task-relation-button"
:class="{'is-active': showNewRelationForm}"

46
src/views/tasks/TaskDetailView.vue
View File

@ -246,8 +246,8 @@
<!-- Comments -->
<comments :can-write="canWrite" :task-id="taskId"/>
</div>
<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">
<div class="column is-one-third action-buttons" v-if="canWrite || shouldShowClosePopup">
<a @click="$router.back()" class="is-fullwidth is-block has-text-centered mb-4">
konrad marked this conversation as resolved Outdated
dpschen commented 2022-01-04 20:38:02 +00:00
Outdated
Review
Copy Link

Should be a <BaseButton>

Should be a `<BaseButton>`
konrad commented 2022-01-08 11:45:52 +00:00
Outdated
Review
Copy Link

Done.

Done.
<icon icon="arrow-left"/>
{{ $t('task.detail.closePopup') }}
</a>
@ -386,33 +386,11 @@
</template>
<!-- Created / Updated [by] -->
<p class="created">
<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 -->
<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/>
<time :datetime="formatISO(task.doneAt)" v-tooltip="doneFormatted">
<i18n-t keypath="task.detail.doneAt">
<span>{{ doneSince }}</span>
</i18n-t>
</time>
</template>
</p>
<created-updated :task="task"/>
</div>
</div>
<!-- Created / Updated [by] -->
<created-updated :task="task" v-if="!canWrite && !shouldShowClosePopup"/>
</div>
<transition name="modal">
@ -459,12 +437,14 @@ import {CURRENT_LIST} from '@/store/mutation-types'
import {uploadFile} from '@/helpers/attachments'
import ChecklistSummary from '../../components/tasks/partials/checklist-summary'
import CreatedUpdated from '@/components/tasks/partials/createdUpdated'
export default {
name: 'TaskDetailView',
compatConfig: { ATTR_FALSE_VALUE: false },
components: {
CreatedUpdated,
ChecklistSummary,
TaskSubscription,
Datepicker,
@ -560,18 +540,6 @@ export default {
canWrite() {
return typeof this.task !== 'undefined' && typeof this.task.maxRight !== 'undefined' && this.task.maxRight > rights.READ
},
updatedSince() {
return this.formatDateSince(this.task.updated)
},
updatedFormatted() {
return this.formatDate(this.task.updated)
},
doneSince() {
return this.formatDateSince(this.task.doneAt)
},
doneFormatted() {
return this.formatDate(this.task.doneAt)
},
hasAttachments() {
return this.$store.state.attachments.attachments.length > 0
},