Make sure to reset creation forms between 2 uses.

frontend/src/components/domains/DomainCreationForm.vue

@@ -1,7 +1,9 @@
 <template>
 <creation-form
+  ref="form"
   :title="'New domain'|translate"
   :steps="steps"
+  :form-getter="getForm"
   :form-observer-getter="getObserver"
   :validate-object="validateDomain"
   :summary-sections="summarySections"
@@ -199,8 +201,12 @@ export default {
     },
     close () {
       this.initDomain()
+      this.$refs.form.resetForm()
       this.$emit('close')
     },
+    getForm (step) {
+      return this.$refs[`form_${step}`]
+    },
     getObserver (step) {
       return this.$refs[`form_${step}`].$refs.observer
     },

frontend/src/components/domains/DomainDNSForm.vue

@@ -55,6 +55,9 @@ export default {
     }
   },
   methods: {
+    reset () {
+      this.form = {}
+    },
     update () {
       this.$emit('input', this.form)
     }

frontend/src/components/domains/DomainGeneralForm.vue

@@ -59,6 +59,9 @@ export default {
     }
   },
   methods: {
+    reset () {
+      this.form = {}
+    },
     update () {
       this.$emit('input', this.form)
     }

frontend/src/components/domains/DomainLimitationsForm.vue

@@ -58,6 +58,9 @@ export default {
     }
   },
   methods: {
+    reset () {
+      this.form = {}
+    },
     update () {
       this.$emit('input', this.form)
     }

frontend/src/components/domains/DomainOptionsForm.vue

@@ -57,6 +57,9 @@ export default {
     }
   },
   methods: {
+    reset () {
+      this.form = {}
+    },
     updatePassword (value) {
       if (value) {
         accounts.getRandomPassword().then(resp => {

frontend/src/components/domains/DomainTransportForm.vue

@@ -65,6 +65,9 @@ export default {
     }
   },
   methods: {
+    reset () {
+      this.form = {}
+    },
     resetForm (value) {
       this.$set(this.form, 'transport', { service: value.name, settings: {} })
       for (const setting of value.settings) {

frontend/src/components/identities/AccountAliasForm.vue

@@ -42,6 +42,10 @@ export default {
     }
   },
   methods: {
+    reset () {
+      this.currentAlias = ''
+      this.aliases = []
+    },
     async addAlias () {
       try {
         await accounts.validate({ aliases: [this.currentAlias] })

frontend/src/components/identities/AccountCreationForm.vue

@@ -1,7 +1,9 @@
 <template>
 <creation-form
+  ref="form"
   :title="'New account'|translate"
   :steps="steps"
+  :form-getter="getForm"
   :form-observer-getter="getObserver"
   :validate-object="validateAccount"
   :summary-sections="summarySections"
@@ -162,6 +164,9 @@ export default {
         random_password: true
       }
     },
+    getForm (step) {
+      return this.$refs[`form_${step}`]
+    },
     getObserver (step) {
       return this.$refs[`form_${step}`].$refs.observer
     },
@@ -170,6 +175,7 @@ export default {
     },
     close () {
       this.account = this.getInitialForm()
+      this.$refs.form.resetForm()
       this.$emit('close')
     },
     submit () {

frontend/src/components/identities/AccountGeneralForm.vue

@@ -74,6 +74,9 @@ export default {
     }
   },
   methods: {
+    reset () {
+      this.form = {}
+    },
     async validateForm () {
       return await this.$refs.observer.validate() && await this.$refs.passwordForm.validate()
     },

frontend/src/components/identities/AccountMailboxForm.vue

@@ -75,6 +75,11 @@ export default {
     }
   },
   methods: {
+    reset () {
+      this.form = {
+        mailbox: {}
+      }
+    },
     update () {
       this.$emit('input', this.form)
     }

frontend/src/components/identities/AccountRoleForm.vue

@@ -45,6 +45,9 @@ export default {
       return role !== undefined ? role.help : ''
     }
   },
+  methods: {
+    reset () { }
+  },
   data () {
     return {
       accountRoles: [

frontend/src/components/identities/AliasCreationForm.vue

@@ -1,7 +1,9 @@
 <template>
 <creation-form
+  ref="form"
   :title="'New alias'|translate"
   :steps="steps"
+  :form-getter="getForm"
   :form-observer-getter="getObserver"
   :validate-object="validateAlias"
   :summary-sections="summarySections"
@@ -78,6 +80,7 @@ export default {
   methods: {
     close () {
       this.alias = this.getInitialForm()
+      this.$refs.form.resetForm()
       this.$emit('close')
     },
     getInitialForm () {
@@ -87,6 +90,9 @@ export default {
         recipients: []
       }
     },
+    getForm (step) {
+      return this.$refs[`form_${step}`]
+    },
     getObserver (step) {
       return this.$refs[`form_${step}`].$refs.observer
     },

frontend/src/components/identities/AliasGeneralForm.vue

@@ -86,6 +86,9 @@ export default {
     }
   },
   methods: {
+    reset () {
+      this.form = {}
+    },
     updateAddress (value) {
       aliases.getRandomAddress().then(resp => {
         this.$set(this.form, 'address', `${resp.data.address}@${value.name}`)

frontend/src/components/identities/AliasRecipientForm.vue

@@ -42,6 +42,10 @@ export default {
     }
   },
   methods: {
+    reset () {
+      this.recipient = ''
+      this.recipients = []
+    },
     async addRecipient () {
       this.recipients.push(this.recipient)
       this.$emit('input', this.recipients)

frontend/src/components/tools/CreationForm.vue

@@ -84,6 +84,7 @@ export default {
     steps: Array,
     summarySections: Array,
     formObserverGetter: Function,
+    formGetter: Function,
     validateObject: Function
   },
   data () {
@@ -92,6 +93,19 @@ export default {
     }
   },
   methods: {
+    resetForm () {
+      this.currentStep = 1
+      this.steps.forEach((item, index) => {
+        const observer = this.formObserverGetter(index + 1)
+        if (observer !== undefined) {
+          observer.reset()
+        }
+        const form = this.formGetter(index + 1)
+        if (form !== undefined) {
+          form.reset()
+        }
+      })
+    },
     async close (withConfirm) {
       if (withConfirm) {
         const confirm = await this.$refs.confirm.open(
@@ -107,13 +121,7 @@ export default {
           return
         }
       }
-      this.currentStep = 1
-      this.steps.forEach((item, index) => {
-        const observer = this.formObserverGetter(index + 1)
-        if (observer !== undefined) {
-          observer.reset()
-        }
-      })
+      this.resetForm()
       this.$emit('close')
     },
     async goToNextStep (current, next) {
@@ -132,7 +140,6 @@ export default {
       }
       this.currentStep = next
     }
-
   }
 }
 </script>