Soud autocomplete

form/res-judicata/src/components/edit/Guide.vue

@@ -79,6 +79,18 @@
                 <b-step-item step="2" label="Soud">
                     <h1 class="title has-text-centered">K jakému soudu budete žalobu podávat?</h1>
                     <p>Podací soud je určen podle pravidla takzvané  místní příslušnosti.</p>
+                    <b-field label="Hledat soud">
+                        <b-autocomplete
+                            v-model="typingSoud"
+                            placeholder="například: okresní soud beroun"
+                            :open-on-focus="true"
+                            :data="filteredDataObj"
+                            field="name"
+                            @select="option => (selected = option)"
+                        >
+                        </b-autocomplete>
+                    </b-field>
+                    <hr />
                     <b-field label="Název soudu">
                         <b-input placeholder="Název soudu" v-model="zaloba.soud.nazev"></b-input>
                     </b-field>
@@ -218,6 +230,7 @@
 
 <script>
 import Zalovany from '@/components/edit/Zalovany.vue'
+const soudy = require('@/components/edit/soudy.json')
 
 export default {
     name: "Guide",
@@ -256,13 +269,34 @@ export default {
             }
             this.zaloba.datum = this.zaloba.datum.toLocaleDateString('cs-CZ')
             console.log("a")
-            /* eslint-disable no-debugger */
-            //debugger
-            /* eslint-enable no-debugger */
             this.$emit("zalobaguideclose",this.zaloba)
             this.$parent.close()
         }
     },
+    computed: {
+        filteredDataObj() {
+            return this.soudy.filter(option => {
+                return (
+                    option.name
+                        .toString()
+                        .toLowerCase()
+                        .indexOf(this.typingSoud.toLowerCase()) >= 0
+                )
+            })
+        }
+    },
+    watch: {
+        selected:{
+            handler(newVal) {
+                this.zaloba.soud.nazev = newVal.name || ""
+                this.zaloba.soud.sidlo.uliceacislopopisne = newVal.address.split(", ")[0]|| ""
+                this.zaloba.soud.sidlo.mesto = newVal.address.split(", ")[1] || ""
+                this.zaloba.soud.sidlo.psc = ""
+                this.zaloba.soud.sidlo.stat = "Česká republika"
+            },
+            deep: true
+        }
+    },
     data: () => {
         return {
             continuedisabled: false,
@@ -270,6 +304,9 @@ export default {
             hasNavigation: true,
             hasZastoupeni: false,
             isFormValid: false,
+            typingSoud: '',
+            selected: null,
+            soudy,
             zaloba: {
                 soud: {
                         nazev: "",