Simplify submenu logic for due date notifications

Signed-off-by: Julius Härtl <jus@bitgrid.net>
This commit is contained in:
Julius Härtl
2020-11-06 15:36:48 +01:00
parent a590144867
commit 054363ccc4

View File

@@ -34,81 +34,85 @@
style="opacity: 0.5" /> style="opacity: 0.5" />
<template v-if="!deleted" slot="actions"> <template v-if="!deleted" slot="actions">
<ActionButton v-if="!showDueSettings" <template v-if="!isDueSubmenuActive">
icon="icon-more" <ActionButton
:close-after-click="true" icon="icon-more"
@click="actionDetails"> :close-after-click="true"
{{ t('deck', 'Board details') }} @click="actionDetails">
</ActionButton> {{ t('deck', 'Board details') }}
<ActionButton v-if="canManage && !board.archived && !showDueSettings" </ActionButton>
icon="icon-rename" <ActionButton v-if="canManage"
:close-after-click="true" icon="icon-rename"
@click="actionEdit"> :close-after-click="true"
{{ t('deck', 'Edit board') }} @click="actionEdit">
</ActionButton> {{ t('deck', 'Edit board') }}
<ActionButton v-if="canManage && !board.archived && !showDueSettings" </ActionButton>
icon="icon-clone" <ActionButton v-if="canManage"
:close-after-click="true" icon="icon-clone"
@click="actionClone"> :close-after-click="true"
{{ t('deck', 'Clone board') }} @click="actionClone">
</ActionButton> {{ t('deck', 'Clone board') }}
<ActionButton v-if="canManage && board.archived && !showDueSettings" </ActionButton>
icon="icon-archive" <ActionButton v-if="canManage"
:close-after-click="true" icon="icon-archive"
@click="actionUnarchive"> :close-after-click="true"
{{ t('deck', 'Unarchive board') }} @click="actionUnarchive">
</ActionButton> {{ t('deck', 'Unarchive board') }}
<ActionButton v-if="canManage && !board.archived && !showDueSettings" </ActionButton>
icon="icon-archive" <ActionButton v-if="canManage"
:close-after-click="true" icon="icon-archive"
@click="actionArchive"> :close-after-click="true"
{{ t('deck', 'Archive board') }} @click="actionArchive">
</ActionButton> {{ t('deck', 'Archive board') }}
</ActionButton>
<ActionButton v-if="board.acl.length === 0" :icon="board.settings['notify-due'] === 'off' ? 'icon-sound' : 'icon-sound-off'" @click="board.settings['notify-due'] === 'off' ? updateSetting('notify-due', 'all') : updateSetting('notify-due', 'off')">
{{ board.settings['notify-due'] === 'off' ? t('deck', 'Turn on due date reminders') : t('deck', 'Turn off due date reminders') }}
</ActionButton>
</template>
<!-- Due date reminder settings --> <!-- Due date reminder settings -->
<template v-if="isDueSubmenuActive">
<ActionButton
:icon="updateDueSetting ? 'icon-loading-small' : 'icon-view-previous'"
:disabled="updateDueSetting"
@click="isDueSubmenuActive=false">
{{ t('deck', 'Due date reminders') }}
</ActionButton>
<ActionButton v-if="showDueSettings" <ActionButton
:icon="updateDueSetting ? 'icon-loading-small' : 'icon-view-previous'" name="notification"
:disabled="updateDueSetting" icon="icon-sound"
@click="showDueSettings=false"> :disabled="updateDueSetting"
{{ t('deck', 'Due date reminders') }} :class="{ 'forced-active': board.settings['notify-due'] === 'all' }"
</ActionButton> @click="updateSetting('notify-due', 'all')">
{{ t('deck', 'All cards') }}
</ActionButton>
<ActionButton
name="notification"
icon="icon-user"
:disabled="updateDueSetting"
:class="{ 'forced-active': board.settings['notify-due'] === 'assigned' }"
@click="updateSetting('notify-due', 'assigned')">
{{ t('deck', 'Assigned cards') }}
</ActionButton>
<ActionButton
name="notification"
icon="icon-sound-off"
:disabled="updateDueSetting"
:class="{ 'forced-active': board.settings['notify-due'] === 'off' }"
@click="updateSetting('notify-due', 'off')">
{{ t('deck', 'No notifications') }}
</ActionButton>
</template>
<ActionButton v-else-if="board.acl.length > 0" <ActionButton v-else-if="board.acl.length > 0"
:title="t('deck', 'Due date reminders')" :title="t('deck', 'Due date reminders')"
:icon="dueDateReminderIcon" :icon="dueDateReminderIcon"
@click="showDueSettings=true"> @click="isDueSubmenuActive=true">
{{ dueDateReminderText }} {{ dueDateReminderText }}
</ActionButton> </ActionButton>
<ActionButton v-else :icon="board.settings['notify-due'] === 'off' ? 'icon-sound' : 'icon-sound-off'" @click="board.settings['notify-due'] === 'off' ? updateSetting('notify-due', 'all') : updateSetting('notify-due', 'off')">
{{ board.settings['notify-due'] === 'off' ? t('deck', 'Turn on due date reminders') : t('deck', 'Turn off due date reminders') }}
</ActionButton>
<ActionButton v-if="showDueSettings" <ActionButton v-if="canManage && !isDueSubmenuActive"
name="notification"
icon="icon-sound"
:disabled="updateDueSetting"
:class="{ 'forced-active': board.settings['notify-due'] === 'all' }"
@click="updateSetting('notify-due', 'all')">
{{ t('deck', 'All cards') }}
</ActionButton>
<ActionButton v-if="showDueSettings"
name="notification"
icon="icon-user"
:disabled="updateDueSetting"
:class="{ 'forced-active': board.settings['notify-due'] === 'assigned' }"
@click="updateSetting('notify-due', 'assigned')">
{{ t('deck', 'Assigned cards') }}
</ActionButton>
<ActionButton v-if="showDueSettings"
name="notification"
icon="icon-sound-off"
:disabled="updateDueSetting"
:class="{ 'forced-active': board.settings['notify-due'] === 'off' }"
@click="updateSetting('notify-due', 'off')">
{{ t('deck', 'No notifications') }}
</ActionButton>
<ActionButton v-if="canManage && !showDueSettings"
icon="icon-delete" icon="icon-delete"
:close-after-click="true" :close-after-click="true"
@click="actionDelete"> @click="actionDelete">
@@ -161,7 +165,7 @@ export default {
undoTimeoutHandle: null, undoTimeoutHandle: null,
editTitle: '', editTitle: '',
editColor: '', editColor: '',
showDueSettings: false, isDueSubmenuActive: false,
updateDueSetting: null, updateDueSetting: null,
} }
}, },
@@ -182,7 +186,7 @@ export default {
} }
}, },
canManage() { canManage() {
return this.board.permissions.PERMISSION_MANAGE return this.board.permissions.PERMISSION_MANAGE && !this.board.archived
}, },
dueDateReminderIcon() { dueDateReminderIcon() {
if (this.board.settings['notify-due'] === 'all') { if (this.board.settings['notify-due'] === 'all') {
@@ -304,7 +308,7 @@ export default {
const setting = {} const setting = {}
setting['board:' + this.board.id + ':' + key] = value setting['board:' + this.board.id + ':' + key] = value
await this.$store.dispatch('setConfig', setting) await this.$store.dispatch('setConfig', setting)
this.showDueSettings = false this.isDueSubmenuActive = false
this.updateDueSetting = null this.updateDueSetting = null
}, },
}, },