Hide UI elements that are not used when archived

Signed-off-by: Julius Härtl <jus@bitgrid.net>
This commit is contained in:
Julius Härtl
2020-05-23 17:58:37 +02:00
parent ddb59c8f66
commit 7b5bda4ed3
7 changed files with 18 additions and 11 deletions

View File

@@ -31,7 +31,7 @@
</p> </p>
</div> </div>
<div v-if="board" class="board-actions"> <div v-if="board" class="board-actions">
<div v-if="canManage && !showArchived" <div v-if="canManage && !showArchived && !board.archived"
id="stack-add" id="stack-add"
v-click-outside="hideAddStack"> v-click-outside="hideAddStack">
<Actions v-if="!isAddStackVisible" :title="t('deck', 'Add new list')"> <Actions v-if="!isAddStackVisible" :title="t('deck', 'Add new list')">

View File

@@ -25,7 +25,7 @@
<div class="stack"> <div class="stack">
<div v-click-outside="stopCardCreation" class="stack--header"> <div v-click-outside="stopCardCreation" class="stack--header">
<transition name="fade" mode="out-in"> <transition name="fade" mode="out-in">
<h3 v-if="!canManage"> <h3 v-if="!canManage || isArchived">
{{ stack.title }} {{ stack.title }}
</h3> </h3>
<h3 v-else-if="!editing" <h3 v-else-if="!editing"
@@ -42,12 +42,12 @@
value=""> value="">
</form> </form>
</transition> </transition>
<Actions v-if="canManage" :force-menu="true"> <Actions v-if="canManage && !isArchived" :force-menu="true">
<ActionButton icon="icon-delete" @click="deleteStack(stack)"> <ActionButton icon="icon-delete" @click="deleteStack(stack)">
{{ t('deck', 'Delete list') }} {{ t('deck', 'Delete list') }}
</ActionButton> </ActionButton>
</Actions> </Actions>
<Actions v-if="canEdit && !showArchived"> <Actions v-if="canEdit && !showArchived && !isArchived">
<ActionButton icon="icon-add" @click.stop="showAddCard=true"> <ActionButton icon="icon-add" @click.stop="showAddCard=true">
{{ t('deck', 'Add card') }} {{ t('deck', 'Add card') }}
</ActionButton> </ActionButton>
@@ -133,6 +133,7 @@ export default {
...mapGetters([ ...mapGetters([
'canManage', 'canManage',
'canEdit', 'canEdit',
'isArchived',
]), ]),
...mapState({ ...mapState({
showArchived: state => state.showArchived, showArchived: state => state.showArchived,

View File

@@ -24,11 +24,11 @@
<div :style="{ backgroundColor: `#${label.color}`, color:textColor(label.color) }" class="label-title"> <div :style="{ backgroundColor: `#${label.color}`, color:textColor(label.color) }" class="label-title">
<span>{{ label.title }}</span> <span>{{ label.title }}</span>
</div> </div>
<button v-if="canManage" <button v-if="canManage && !isArchived"
v-tooltip="t('deck', 'Edit')" v-tooltip="t('deck', 'Edit')"
class="icon-rename" class="icon-rename"
@click="clickEdit(label)" /> @click="clickEdit(label)" />
<button v-if="canManage" <button v-if="canManage && !isArchived"
v-tooltip="t('deck', 'Delete')" v-tooltip="t('deck', 'Delete')"
class="icon-delete" class="icon-delete"
@click="deleteLabel(label.id)" /> @click="deleteLabel(label.id)" />
@@ -55,7 +55,7 @@
</form> </form>
</template> </template>
</li> </li>
<button v-if="canManage" @click="clickShowAddLabel()"> <button v-if="canManage && !isArchived" @click="clickShowAddLabel()">
<span class="icon-add" />{{ t('deck', 'Add a new tag') }} <span class="icon-add" />{{ t('deck', 'Add a new tag') }}
</button> </button>
</ul> </ul>
@@ -88,6 +88,7 @@ export default {
...mapGetters({ ...mapGetters({
labels: 'currentBoardLabels', labels: 'currentBoardLabels',
canManage: 'canManage', canManage: 'canManage',
isArchived: 'isArchived',
}), }),
addLabelObjValidated() { addLabelObjValidated() {
if (this.addLabelObj.title === '') { if (this.addLabelObj.title === '') {

View File

@@ -31,7 +31,7 @@
class="card" class="card"
@click="openCard"> @click="openCard">
<div class="card-upper"> <div class="card-upper">
<h3 v-if="showArchived || !canEdit"> <h3 v-if="isArchived || showArchived || !canEdit">
{{ card.title }} {{ card.title }}
</h3> </h3>
<h3 v-else-if="!editing"> <h3 v-else-if="!editing">
@@ -109,6 +109,7 @@ export default {
}), }),
...mapGetters([ ...mapGetters([
'canEdit', 'canEdit',
'isArchived',
]), ]),
card() { card() {
return this.$store.getters.cardById(this.id) return this.$store.getters.cardById(this.id)

View File

@@ -23,7 +23,7 @@
<template> <template>
<div> <div>
<div @click.stop.prevent> <div @click.stop.prevent>
<Actions v-if="canEdit"> <Actions v-if="canEdit && !isArchived">
<ActionButton v-if="showArchived === false" icon="icon-user" @click="assignCardToMe()"> <ActionButton v-if="showArchived === false" icon="icon-user" @click="assignCardToMe()">
{{ t('deck', 'Assign to me') }} {{ t('deck', 'Assign to me') }}
</ActionButton> </ActionButton>
@@ -93,6 +93,7 @@ export default {
computed: { computed: {
...mapGetters([ ...mapGetters([
'canEdit', 'canEdit',
'isArchived',
]), ]),
...mapState({ ...mapState({
showArchived: state => state.showArchived, showArchived: state => state.showArchived,

View File

@@ -34,13 +34,13 @@
style="opacity: 0.5" /> style="opacity: 0.5" />
<template v-if="!deleted" slot="actions"> <template v-if="!deleted" slot="actions">
<ActionButton v-if="canManage" <ActionButton v-if="canManage && !board.archived"
icon="icon-rename" icon="icon-rename"
:close-after-click="true" :close-after-click="true"
@click="actionEdit"> @click="actionEdit">
{{ t('deck', 'Edit board') }} {{ t('deck', 'Edit board') }}
</ActionButton> </ActionButton>
<ActionButton v-if="canManage" <ActionButton v-if="canManage && !board.archived"
icon="icon-clone" icon="icon-clone"
:close-after-click="true" :close-after-click="true"
@click="actionClone"> @click="actionClone">

View File

@@ -122,6 +122,9 @@ export default new Vuex.Store({
canShare: state => { canShare: state => {
return state.currentBoard ? state.currentBoard.permissions.PERMISSION_SHARE : false return state.currentBoard ? state.currentBoard.permissions.PERMISSION_SHARE : false
}, },
isArchived: state => {
return state.currentBoard && state.currentBoard.archived
}
}, },
mutations: { mutations: {
setSearchQuery(state, searchQuery) { setSearchQuery(state, searchQuery) {