Started import work

frontend/src/views/imap_migration/ProviderEdit.vue

@@ -0,0 +1,28 @@
+<template>
+<div>
+  <span class="text-h4"><translate>Edit provider</translate></span>
+  <div class="mt-4" />
+  <provider-form :provider="provider" />
+</div>
+</template>
+
+<script>
+import providers from '@/api/imap_migration/providers'
+import ProviderForm from '@/components/imap_migration/ProviderForm'
+
+export default {
+  components: {
+    ProviderForm
+  },
+  data () {
+    return {
+      provider: {}
+    }
+  },
+  mounted () {
+    providers.getProvider(this.$route.params.id).then(resp => {
+      this.provider = resp.data
+    })
+  }
+}
+</script>

frontend/src/views/imap_migration/Providers.vue

@@ -0,0 +1,56 @@
+<template>
+<div>
+  <v-toolbar flat>
+    <v-toolbar-title><translate>Providers</translate></v-toolbar-title>
+    <v-spacer />
+    <v-btn
+      offset-y
+      color="primary"
+      @click="showProviderWizard = true"
+      >
+      <v-icon left>mdi-plus</v-icon>
+      <translate>New</translate>
+    </v-btn>
+  </v-toolbar>
+  <providers-list />
+
+  <v-dialog
+    v-model="showProviderWizard"
+    fullscreen
+    scrollable
+    transition="dialog-bottom-transition"
+    >
+    <provider-creation-form @close="showProviderWizard = false" />
+      <template v-slot:help>
+        <ul>
+          <li><em>domain; name; quota; default mailbox quota; enabled</em></li>
+          <li><em>domainalias; name; targeted domain; enabled</em></li>
+        </ul>
+      </template>
+  </v-dialog>
+
+</div>
+</template>
+
+<script>
+import ProviderCreationForm from '@/components/imap_migration/ProviderCreationForm'
+import ProvidersList from '@/components/imap_migration/ProvidersList'
+
+export default {
+  components: {
+    ProviderCreationForm,
+    ProvidersList
+  },
+  data () {
+    return {
+      showProviderWizard: false
+    }
+  }
+}
+</script>
+
+<style scoped>
+.v-toolbar {
+  background-color: #f7f8fa !important;
+}
+</style>