Last changes

src/components/common/FormModel.vue

@@ -133,14 +133,15 @@ async function fetch() {
     }
 }
 
-async function submit() {
+const submitForm = async evt => {
+    const isFormValid = await formModelRef.value.validate();
+    if (isFormValid) await save(evt);
+};
+
+async function save() {
     if (props.observeFormChanges && !hasChanges.value)
         return notify('noChanges', 'negative');
 
-    const isValid = await formModelRef.value.validate();
-    console.log('isValid', isValid);
-    if (!isValid) return;
-
     isLoading.value = true;
     try {
         const body = props.mapper
@@ -149,10 +150,9 @@ async function submit() {
         const method = props.urlCreate ? 'post' : 'patch';
         const url = props.urlCreate || props.urlUpdate || props.url;
 
-        let response;
+        await Promise.resolve(
-
+            props.saveFn ? props.saveFn(body) : api[method](url, body)
-        if (props.saveFn) await props.saveFn(body);
+        );
-        else await api[method](url, body);
 
         onSubmitSuccess();
         hasChanges.value = false;
@@ -163,18 +163,13 @@ async function submit() {
 
 defineExpose({
     formData,
-    submit
+    submitForm
 });
 </script>
 
 <template>
     <QCard class="form-container" v-bind="$attrs">
-        <QForm
+        <QForm ref="formModelRef" class="form" :class="separationBetweenInputs">
-            v-if="!isLoading"
-            ref="formModelRef"
-            class="form"
-            :class="separationBetweenInputs"
-        >
             <span v-if="title" class="text-h6 text-bold">
                 {{ title }}
             </span>
@@ -205,8 +200,9 @@ defineExpose({
                     rounded
                     no-caps
                     flat
+                    :loading="isLoading"
                     :disabled="!showBottomActions && !hasChanges"
-                    @click="submit()"
+                    @click="submitForm()"
                     data-cy="formModelDefaultSaveButton"
                 >
                     <QTooltip>{{ t('save') }}</QTooltip>
@@ -214,7 +210,6 @@ defineExpose({
                 <slot name="actions" :data="formData" />
             </component>
         </QForm>
-        <QSpinner v-else color="primary" size="3em" :thickness="2" />
     </QCard>
 </template>
 

src/pages/Account/AddressDetails.vue

@@ -110,6 +110,7 @@ onMounted(async () => {
             :form-initial-data="editAddressData"
             :title="t(isEditMode ? 'editAddress' : 'addAddress')"
             @on-data-saved="goBack()"
+            :show-bottom-actions="false"
         >
             <template #form="{ data }">
                 <VnInput