First commit

components/ModalWikiURL.vue

@@ -0,0 +1,58 @@
+<template>
+  <modal :show="show" @close="$emit('close', false)">
+    <template v-slot:header>
+      <h2>Please copy your gbf.wiki collection URL below</h2>
+    </template>
+
+    <form @submit.prevent="getURL()" class="m-1">
+      <div class="mb-2">
+        <label for="url" class="">URL</label>
+        <input class="input w-full" id="url" ref="url" type="text" placeholder="URL" v-model="url" required autofocus>
+      </div>
+
+      <input class="btn btn-blue pt-2" type="submit" value="Import">
+    </form>
+  </modal>
+</template>
+
+<script>
+import Modal from './common/Modal.vue'
+
+export default {
+  model: {
+    prop: 'show',
+    event: 'close'
+  },
+  components: {
+    Modal
+  },
+  props: {
+    show: {
+      type: Boolean,
+      required: true
+    },
+  },
+  data() {
+    return {
+      url: "",
+    }
+  },
+  methods: {
+    getURL() {
+      this.$emit('import', this.url);
+      this.$emit('close', false);
+    },
+  },
+  watch: {
+    show() {
+      if (this.show === true) {
+        let self = this;
+        this.$nextTick().then(() => {
+          self.url = '';
+          self.$refs.url.focus();
+        });
+      }
+    }
+  }
+}
+</script>