wip - twitter banner template

frontend/src/views/twitter_banner/PersonInput.vue

@@ -6,11 +6,20 @@ import InputHeading from "../../components/inputs/InputHeading.vue"
 <script>
 export default {
     components: { InputHeading, VueSelect },
-    props: ['name', 'important', 'zIndex', 'modelValue', 'options'],
-    emits: ['update:modelValue'],
+    props: [
+        'name',
+        'important',
+        'zIndex',
+        'mainImage',
+        'personName',
+        'personTwitter',
+        'defaultSelection',
+        'options'
+    ],
+    emits: ['update:mainImage', 'update:personName', 'update:personTwitter'],
     data () {
         return {
-            selectedOption: this.modelValue
+            selectedOption: this.defaultSelection
         }
     },
     watch: {
@@ -27,9 +36,9 @@ export default {
                 }
             )
 
-            value.mainImage = mainImage
-
-            this.$emit('update:modelValue', value)
+            this.$emit('update:mainImage', mainImage)
+            this.$emit('update:personName', value.personName)
+            this.$emit('update:personTwitter', value.personTwitter)
         }
     }
 }

frontend/src/views/twitter_banner/TwitterBanner.vue

@@ -68,7 +68,7 @@ export default {
         }
 
         return {
-            selectedOption: personOptions.klara,
+            defaultSelection: personOptions.klara,
             personOptions: personOptions,
             mainImage: null,
             mainText: null,
@@ -104,13 +104,6 @@ export default {
                 deep: true
             }
         )
-    },
-    watch: {
-        selectedOption (value) {
-            this.mainImage = value.mainImage
-            this.personName = value.title
-            this.personTwitter = value.personTwitter
-        }
     }
 }
 </script>
@@ -135,7 +128,10 @@ export default {
             <template v-slot:right>
                 <PersonInput
                     name="Člověk"
-                    v-model="selectedOption"
+                    v-model:mainImage="mainImage"
+                    v-model:personName="personName"
+                    v-model:personTwitter="personTwitter"
+                    :defaultSelection="defaultSelection"
                     :options="Object.values(personOptions)"
                     :important="true"
                     zIndex="10"