sep 21 fixes (#9060)

* remove `classSelected` on adding new pinned gear

* use show::modal on buyModal / selectMembersModal instead of v-if=item

* show::modal for buyQuestModal - fix bundles class

* fix buy potion

* fix open selectMembersModal (after changing to shop::modal)

website/client/app.vue

@@ -9,7 +9,7 @@
       .container-fluid
         app-header
         buyModal(
-          :item="selectedItemToBuy",
+          :item="selectedItemToBuy || {}",
           :withPin="true",
           @change="resetItemToBuy($event)",
           @buyPressed="customPurchase($event)",
@@ -17,9 +17,8 @@
 
         )
         selectMembersModal(
-          :item="selectedCardToBuy",
+          :item="selectedSpellToBuy || {}",
           :group="user.party",
-          @change="resetCardToBuy($event)",
           @memberSelected="memberSelected($event)",
         )
 
@@ -92,7 +91,7 @@ export default {
   data () {
     return {
       selectedItemToBuy: null,
-      selectedCardToBuy: null,
+      selectedSpellToBuy: null,
 
       sound: {
         oggSource: '',
@@ -128,6 +127,12 @@ export default {
 
     this.$root.$on('buyModal::showItem', (item) => {
       this.selectedItemToBuy = item;
+      this.$root.$emit('show::modal', 'buy-modal');
+    });
+
+    this.$root.$on('selectMembersModal::showItem', (item) => {
+      this.selectedSpellToBuy = item;
+      this.$root.$emit('show::modal', 'select-member-modal');
     });
 
     // @TODO split up this file, it's too big
@@ -272,11 +277,6 @@ export default {
         this.selectedItemToBuy = null;
       }
     },
-    resetCardToBuy ($event) {
-      if (!$event) {
-        this.selectedCardToBuy = null;
-      }
-    },
     itemSelected (item) {
       this.selectedItemToBuy = item;
     },
@@ -292,15 +292,20 @@ export default {
     customPurchase (item) {
       if (item.purchaseType === 'card') {
         if (this.user.party._id) {
-          this.selectedCardToBuy = item;
+          this.selectedSpellToBuy = item;
+
+          this.$root.$emit('hide::modal', 'buy-modal');
+          this.$root.$emit('show::modal', 'select-member-modal');
         } else {
           this.error(this.$t('errorNotInParty'));
         }
       }
     },
     memberSelected (member) {
-      this.$store.dispatch('user:castSpell', {key: this.selectedCardToBuy.key, targetId: member.id});
-      this.selectedCardToBuy = null;
+      this.$store.dispatch('user:castSpell', {key: this.selectedSpellToBuy.key, targetId: member.id});
+      this.selectedSpellToBuy = null;
+
+      this.$root.$emit('hide::modal', 'select-member-modal');
     },
     hideLoadingScreen () {
       const loadingScreen = document.getElementById('loading-screen');