deck validation

frontend/src/components/Deck.vue

@@ -30,7 +30,12 @@
         </v-btn>
       </v-layout>
     </v-container>
-    <DeckEditor v-model="editing" :id="deck.id" :list="deck_list" />
+    <DeckEditor
+      :visible="editing"
+      :id="deck.id"
+      :value="deck_list"
+      @close="editing = false"
+    />
   </v-expansion-panel-content>
 </template>
 

frontend/src/components/forms/DeckEditor.vue

@@ -1,5 +1,5 @@
 <template>
-  <v-container v-if="value">
+  <v-container v-if="visible">
     <v-card flat>
       <v-alert :value="count !== 50" type="warning">
         {{ count }} cards detected! (Decks should have exactly 50 cards)
@@ -12,7 +12,7 @@
       <v-textarea
         ref="textarea"
         label="Edit Deck"
-        :value="list"
+        :value="value"
         rows="35"
         hint="Change card counts and/or serial numbers. Names will be updated accordingly!"
         style="font-family: monospace"
@@ -51,8 +51,8 @@ export default {
 
   props: {
     id: Number,
-    list: String,
-    value: Boolean
+    value: String,
+    visible: Boolean
   },
 
   data: () => ({
@@ -62,7 +62,15 @@ export default {
   }),
 
   computed: {
-    session: () => Cookies.get('session')
+    session: () => Cookies.get('session'),
+
+    new_deck() {
+      try {
+        return this.parse_deck(this.$refs.textarea)
+      } catch (e) {
+        return this.parse_deck(this.value)
+      }
+    }
   },
 
   methods: {
@@ -160,8 +168,7 @@ export default {
 
     close() {
       this.checked = false
-
-      this.$emit('input', false)
+      this.$emit('close')
     },
 
     check() {
@@ -191,14 +198,11 @@ export default {
         })
         .then(response => {
           if (response.data.success) {
+            this.$emit('change', new_deck)
             this.close()
           }
         })
     }
-  },
-
-  activated() {
-    console.log('Frosch')
   }
 }
 </script>