ahtlon/deck
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

some UI changes

Browse Source 
Signed-off-by: Jakob <jakob.roehrl@web.de>
This commit is contained in:
Jakob
2019-10-10 11:06:51 +02:00
parent e69b5465bd
commit 0f2e735a20
1 changed files with 19 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
src/components/cards/CardItem.vue
View File

@@ -36,22 +36,21 @@
<ActionButton v-if="showArchived === false" icon="icon-user" @click="assignCardToMe()">{{ t('deck', 'Assign to me') }}</ActionButton> <ActionButton v-if="showArchived === false" icon="icon-user" @click="assignCardToMe()">{{ t('deck', 'Assign to me') }}</ActionButton>
<ActionButton icon="icon-archive" @click="archiveUnarchiveCard()">{{ t('deck', (showArchived ? 'Unarchive card' : 'Archive card')) }}</ActionButton> <ActionButton icon="icon-archive" @click="archiveUnarchiveCard()">{{ t('deck', (showArchived ? 'Unarchive card' : 'Archive card')) }}</ActionButton>
<ActionButton v-if="showArchived === false" icon="icon-delete" @click="deleteCard()">{{ t('deck', 'Delete card') }}</ActionButton> <ActionButton v-if="showArchived === false" icon="icon-delete" @click="deleteCard()">{{ t('deck', 'Delete card') }}</ActionButton>
<ActionButton icon="icon-external" @click.stop="modalShow=true">{{ t('deck', 'Move card') }}</ActionButton>
<ActionButton icon="icon-settings-dark" @click="openCard">{{ t('deck', 'Card details') }}</ActionButton> <ActionButton icon="icon-settings-dark" @click="openCard">{{ t('deck', 'Card details') }}</ActionButton>
<ActionButton icon="icon-settings-dark" @click.stop="modalShow=true">{{ t('deck', 'Move card') }}</ActionButton>
</Actions> </Actions>
</transition> </transition>
<modal v-if="modalShow" title="Move card to another board" @close="modalShow=false"> <modal v-if="modalShow" title="Move card to another board" @close="modalShow=false">
<div class="modal__content"> <div class="modal__content">
<Multiselect v-model="selectedBoard" :options="boards" label="title" <Multiselect :placeholder="t('deck', 'select board')" v-model="selectedBoard" :options="boards"
label="title"
@select="loadStacksFromBoard" /> @select="loadStacksFromBoard" />
<Multiselect v-model="selectedStack" :options="stacksFromBoard" label="title" /> <Multiselect :placeholder="t('deck', 'select stack')" v-model="selectedStack" :options="stacksFromBoard"
<button @click="moveCard"> label="title" />
<span class="icon-confirm" />{{ t('deck', 'Move card') }}
</button> <button :disabled="!isBoardAndStackChoosen" class="primary" @click="moveCard">{{ t('deck', 'Move card') }}</button>
<button @click="modalShow=false"> <button @click="modalShow=false">{{ t('deck', 'Cancel') }}</button>
<span class="icon-cancel" />{{ t('deck', 'Cancel') }}
</button>
</div> </div>
</modal> </modal>
@@ -130,6 +129,12 @@ export default {
}, },
currentCard() { currentCard() {
return this.$route.params.cardId === this.id return this.$route.params.cardId === this.id
},
isBoardAndStackChoosen() {
if (this.selectedBoard === '' || this.selectedStack === '') {
return false
}
return true
} }
}, },
methods: { methods: {
@@ -293,8 +298,11 @@ export default {
} }
.modal__content { .modal__content {
width: 50vw; width: 25vw;
text-align: center; text-align: center;
margin: 10vw 0; margin: 4vw 1vw;
}
.modal__content button{
float: right;
} }
</style> </style>