summaryrefslogtreecommitdiff
path: root/app/src/pages/Steps
diff options
context:
space:
mode:
authorDaniel Weipert <code@drogueronin.de>2021-07-09 15:12:50 +0200
committerDaniel Weipert <code@drogueronin.de>2021-07-09 15:12:50 +0200
commit30c8c2f2b05bab8b962b51c0faeb282980324a5c (patch)
tree0088c91d7e44c76a966601d325bc53d1fdbc657e /app/src/pages/Steps
parent6563602fb39db8ae9a976784b62538cbcf3de108 (diff)
Splits UI into steps and enhances log messages
Diffstat (limited to 'app/src/pages/Steps')
-rw-r--r--app/src/pages/Steps/1-From.vue32
-rw-r--r--app/src/pages/Steps/2-To.vue51
-rw-r--r--app/src/pages/Steps/3-Migrate.vue111
3 files changed, 194 insertions, 0 deletions
diff --git a/app/src/pages/Steps/1-From.vue b/app/src/pages/Steps/1-From.vue
new file mode 100644
index 0000000..e1bd82e
--- /dev/null
+++ b/app/src/pages/Steps/1-From.vue
@@ -0,0 +1,32 @@
+<template>
+ <div>
+ <h1>From</h1>
+
+ <Panel v-model="from" />
+
+ <router-link to="/steps/2">
+ next
+ </router-link>
+ </div>
+</template>
+
+<script>
+import Panel from '~/components/Panel';
+
+export default {
+ components: {
+ Panel,
+ },
+
+ computed: {
+ from: {
+ set (value) {
+ this.$store.commit('setFrom', value);
+ },
+ get () {
+ return this.$store.state.from;
+ },
+ },
+ },
+};
+</script>
diff --git a/app/src/pages/Steps/2-To.vue b/app/src/pages/Steps/2-To.vue
new file mode 100644
index 0000000..1cce01d
--- /dev/null
+++ b/app/src/pages/Steps/2-To.vue
@@ -0,0 +1,51 @@
+<template>
+ <div>
+ <router-link to="/steps/1">
+ previous
+ </router-link>
+
+ <h1>To</h1>
+
+ <Panel v-model="to" @connect="connect" />
+
+ <router-link to="/steps/3">
+ next
+ </router-link>
+ </div>
+</template>
+
+<script>import Panel from '~/components/Panel';
+
+export default {
+ components: {
+ Panel,
+ },
+
+ computed: {
+ to: {
+ set (value) {
+ this.$store.commit('setTo', value);
+ },
+ get () {
+ return this.$store.state.to;
+ },
+ },
+ },
+
+ mounted () {
+ this.$electron.ipcRenderer.on('imap:listTree:to:reply', (event, folders) => {
+ this.to.folders = folders;
+ });
+
+ this.$electron.ipcRenderer.on('imap:to:error', (event, error) => {
+ this.to.error = error;
+ });
+ },
+
+ methods: {
+ connect () {
+ this.$electron.ipcRenderer.send('imap:listTree:to', JSON.parse(JSON.stringify(this.to)));
+ },
+ },
+};
+</script>
diff --git a/app/src/pages/Steps/3-Migrate.vue b/app/src/pages/Steps/3-Migrate.vue
new file mode 100644
index 0000000..c8d2e39
--- /dev/null
+++ b/app/src/pages/Steps/3-Migrate.vue
@@ -0,0 +1,111 @@
+<template>
+ <div>
+ <router-link to="/steps/2">
+ previous
+ </router-link>
+
+ <div>
+ From
+ <div class="input-group">
+ <input type="text" disabled :value="from.server"> <input type="text" disabled :value="from.port">
+ </div>
+ </div>
+ <div>
+ To
+ <div class="input-group">
+ <input type="text" disabled :value="to.server"> <input type="text" disabled :value="to.port">
+ </div>
+ </div>
+
+ <div>
+ Bedingungen
+ <br>
+ <input type="text">
+ </div>
+
+ <ul v-if="from.folders">
+ <Folders :folder="from.folders" />
+ </ul>
+
+ <button class="button" @click="migrate">
+ Migrate!
+ </button>
+
+ <div class="progress-screen">
+ <b>{{ progress }}</b>
+ <br>
+ <b>{{ progressMessages }}</b>
+ <br>
+ <div class="progress-screen__log">
+ <div v-for="(msg, idx) in log" :key="idx">
+ {{ msg }}
+ </div>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script>
+import Folders from '~/components/Folders';
+
+export default {
+ components: {
+ Folders,
+ },
+
+ data () {
+ return {
+ progress: '',
+ log: [],
+ progressMessages: '',
+ };
+ },
+
+ computed: {
+ from: {
+ set (value) {
+ this.$store.commit('setFrom', value);
+ },
+ get () {
+ return this.$store.state.from;
+ },
+ },
+ to: {
+ set (value) {
+ this.$store.commit('setTo', value);
+ },
+ get () {
+ return this.$store.state.to;
+ },
+ },
+ },
+
+ mounted () {
+ this.$electron.ipcRenderer.on('imap:listTree:from:reply', (event, folders) => {
+ this.from.folders = folders;
+ });
+ this.$electron.ipcRenderer.send('imap:listTree:from', JSON.parse(JSON.stringify(this.from)));
+
+ this.$electron.ipcRenderer.on('imap:migrate:progress', (event, progress) => {
+ this.progress = progress;
+ this.log.push(progress);
+ });
+ this.$electron.ipcRenderer.on('imap:migrate:progress:messages', (event, progress) => {
+ this.progressMessages = progress;
+ });
+ },
+
+ methods: {
+ async migrate () {
+ this.progress = '';
+ this.log = [];
+ this.progressMessages = '';
+
+ this.$electron.ipcRenderer.send('imap:migrate', JSON.parse(JSON.stringify({
+ from: this.from,
+ to: this.to,
+ })));
+ },
+ },
+};
+</script>