Make so clicking on cards will remove them from the decklist
All checks were successful
continuous-integration/drone/push Build is passing
continuous-integration/drone/pr Build is passing

This commit is contained in:
Hamcha 2019-09-10 15:11:39 +02:00
parent 10396b24f1
commit 31efb453bc
Signed by: hamcha
GPG key ID: 44AD3571EB09A39E
2 changed files with 21 additions and 2 deletions

View file

@ -1,6 +1,6 @@
<template>
<section class="decklist">
<article v-for="(card, i) in cards" :key="i">
<article @click="_drop(card)" v-for="(card, i) in cards" :key="i">
<div class="amt">{{ card.howmany }}</div>
<div class="fullname">
<div class="name">{{ card.data.Name }}</div>
@ -26,6 +26,7 @@
border: 1px solid $grey;
border-radius: 10px;
padding: 5px 3px;
cursor: pointer;
}
}
@ -70,5 +71,9 @@ export default class DeckList extends Vue {
private fullName(card: Card): string {
return cardFullName(card);
}
private _drop(slot: CardSlot) {
this.$emit("removed", slot);
}
}
</script>

View file

@ -58,7 +58,7 @@
<header>
<h1>{{ deckname }}</h1>
</header>
<DeckList :cards="decklist" />
<DeckList :cards="decklist" @removed="cardRemoved" />
</section>
</section>
</template>
@ -512,5 +512,19 @@ export default class DeckBuilder extends Vue {
const url = createPonyheadURL(this.decklist.map(c => c.data));
window.open(url, "_blank");
}
private cardRemoved(card: CardSlot) {
const idx = this.decklist.findIndex(c => c.data.ID == card.data.ID);
if (idx < 0) {
throw new Error("Removing card that isn't in the deck?");
}
const deckitem = this.decklist[idx];
deckitem.howmany -= 1;
if (deckitem.howmany <= 0) {
this.decklist.splice(idx, 1);
} else {
Vue.set(this.decklist, idx, deckitem);
}
}
}
</script>