Merge pull request '#8372 prevent double submit' (!1333) from 8372-fixDoubleRequest into dev

Reviewed-on: #1333
Reviewed-by: Alex Moreno <alexm@verdnatura.es>

src/boot/qformMixin.js

@@ -9,19 +9,19 @@ export default {
         if (!form) return;
         try {
             const inputsFormCard = form.querySelectorAll(
-                `input:not([disabled]):not([type="checkbox"])`
+                `input:not([disabled]):not([type="checkbox"])`,
             );
             if (inputsFormCard.length) {
                 focusFirstInput(inputsFormCard[0]);
             }
             const textareas = document.querySelectorAll(
-                'textarea:not([disabled]), [contenteditable]:not([disabled])'
+                'textarea:not([disabled]), [contenteditable]:not([disabled])',
             );
             if (textareas.length) {
                 focusFirstInput(textareas[textareas.length - 1]);
             }
             const inputs = document.querySelectorAll(
-                'form#formModel input:not([disabled]):not([type="checkbox"])'
+                'form#formModel input:not([disabled]):not([type="checkbox"])',
             );
             const input = inputs[0];
             if (!input) return;

src/components/FormModel.vue

@@ -113,7 +113,7 @@ const defaultButtons = computed(() => ({
         color: 'primary',
         icon: 'save',
         label: 'globals.save',
-        click: () => myForm.value.submit(),
+        click: () => myForm.value.onSubmit(false),
         type: 'submit',
     },
     reset: {
@@ -207,7 +207,8 @@ async function fetch() {
     }
 }
 
-async function save() {
+async function save(prevent = false) {
+    if (prevent) return;
     if ($props.observeFormChanges && !hasChanges.value)
         return notify('globals.noChanges', 'negative');
 
@@ -293,7 +294,7 @@ defineExpose({
         <QForm
             ref="myForm"
             v-if="formData"
-            @submit="save"
+            @submit="save(!!$event)"
             @reset="reset"
             class="q-pa-md"
             :style="maxWidth ? 'max-width: ' + maxWidth : ''"

src/components/FormModelPopup.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, computed, onMounted } from 'vue';
+import { ref, computed } from 'vue';
 import { useI18n } from 'vue-i18n';
 
 import FormModel from 'components/FormModel.vue';
@@ -70,37 +70,39 @@ defineExpose({
                     v-close-popup
                     z-max
                     @click="
-                        () => {
-                            isSaveAndContinue = false;
-                            emit('onDataCanceled');
-                        }
+                        isSaveAndContinue = false;
+                        emit('onDataCanceled');
                     "
                 />
                 <QBtn
                     :flat="showSaveAndContinueBtn"
                     :label="t('globals.save')"
                     :title="t('globals.save')"
-                    type="submit"
+                    @click="
+                        formModelRef.save();
+                        isSaveAndContinue = false;
+                    "
                     color="primary"
                     class="q-ml-sm"
                     :disabled="isLoading"
                     :loading="isLoading"
                     data-cy="FormModelPopup_save"
                     z-max
-                    @click="() => (isSaveAndContinue = false)"
                 />
                 <QBtn
                     v-if="showSaveAndContinueBtn"
                     :label="t('globals.isSaveAndContinue')"
                     :title="t('globals.isSaveAndContinue')"
-                    type="submit"
                     color="primary"
                     class="q-ml-sm"
                     :disabled="isLoading"
                     :loading="isLoading"
                     data-cy="FormModelPopup_isSaveAndContinue"
                     z-max
-                    @click="() => (isSaveAndContinue = true)"
+                    @click="
+                        isSaveAndContinue = true;
+                        formModelRef.save();
+                    "
                 />
             </div>
         </template>

src/pages/Customer/components/CustomerNewPayment.vue

@@ -84,7 +84,7 @@ function setPaymentType(accounting) {
     viewReceipt.value = isCash.value;
     if (accountingType.value.daysInFuture)
         initialData.payed.setDate(
-            initialData.payed.getDate() + accountingType.value.daysInFuture
+            initialData.payed.getDate() + accountingType.value.daysInFuture,
         );
     maxAmount.value = accountingType.value && accountingType.value.maxAmount;
 

test/cypress/integration/invoiceIn/invoiceInBasicData.spec.js

@@ -49,7 +49,7 @@ describe('InvoiceInBasicData', () => {
             'test/cypress/fixtures/image.jpg',
             {
                 force: true,
-            }
+            },
         );
         cy.get('[data-cy="FormModelPopup_save"]').click();
         cy.checkNotification('Data saved');

test/cypress/integration/wagon/wagonType/wagonTypeCreate.spec.js

@@ -9,7 +9,7 @@ describe('WagonTypeCreate', () => {
     it('should create a new wagon type and then delete it', () => {
         cy.get('.q-page-sticky > div > .q-btn').click();
         cy.get('input').first().type('Example for testing');
-        cy.get('button[type="submit"]').click();
+        cy.get('[data-cy="FormModelPopup_save"]').click();
         cy.get('[title="Remove"] > .q-btn__content > .q-icon').first().click();
     });
 });