perf: refs #7134 use ForModelPopup

2024-12-09 14:20:03 +01:00 · 2024-12-09 14:20:03 +01:00 · 9121e79533
parent 34d08e4bfe
commit 9121e79533
3 changed files with 63 additions and 89 deletions
--- a/src/components/common/VnAccountNumber.vue
+++ b/src/components/common/VnAccountNumber.vue
@ -9,7 +9,7 @@ const $props = defineProps({
    },
    insertable: {
        type: Boolean,
-        default: false,
+        default: true,
    },
 });

@ -79,5 +79,10 @@ function accountShortToStandard() {
 </script>

 <template>
-    <QInput @keydown="handleKeydown" ref="vnInputRef" v-model="internalValue" />
+    <QInput
+        @keydown="handleKeydown"
+        ref="vnInputRef"
+        v-model="internalValue"
+        :maxlength="10"
+    />
 </template>
--- a/src/pages/Supplier/Card/SupplierFiscalData.vue
+++ b/src/pages/Supplier/Card/SupplierFiscalData.vue
@ -106,8 +106,6 @@ function handleLocation(data, location) {
                    :label="t('supplier.fiscalData.account')"
                    clearable
                    data-cy="supplierFiscalDataAccount"
-                    insertable
-                    :maxlength="10"
                />
                <VnSelect
                    :label="t('supplier.fiscalData.sageTaxTypeFk')"
--- a/src/pages/Supplier/Card/SupplierNewPayment.vue
+++ b/src/pages/Supplier/Card/SupplierNewPayment.vue
@ -9,7 +9,7 @@ import { useDialogPluginComponent } from 'quasar';
 import { usePrintService } from 'composables/usePrintService';
 import useNotify from 'src/composables/useNotify.js';
 import FetchData from 'components/FetchData.vue';
-import FormModel from 'components/FormModel.vue';
+import FormModelPopup from 'components/FormModelPopup.vue';
 import VnRow from 'components/ui/VnRow.vue';
 import VnInputDate from 'components/common/VnInputDate.vue';
 import VnInputNumber from 'components/common/VnInputNumber.vue';
@ -74,39 +74,44 @@ const filterRecordFindOne = {
 };

 const initialData = reactive({
-    amountPaid: $props.totalCredit,
-    supplierFk: route.params.id,
-    companyFk: $props.companyId,
-    bankFk: $props.bankId,
-    email: recordFindOne.value.email,
+    received: '2001-01-01T11:00:00.000Z',
+    supplierFk: '1',
+    amount: 123123,
    currencyFk: 1,
+    bankFk: 3,
+    concept: 'Credit Card, ',
+    amountToReturn: null,
+    orderBy: 'issued',
+    payMethodFk: 1,
+    bankingFees: 0,
+    companyFk: 442,
+    divisa: null,
 });

 onBeforeMount(() => {
-    urlCreate.value = `Suppliers/${route.params.id}/createReceipt`;
+    urlCreate.value = `Suppliers/${route.params.id}/createPayment`;
 });

 function setPaymentType(accounting) {
    if (!accounting) return;
    accountingType.value = accounting.accountingType;

-    initialData.description = [];
-    initialData.payed = Date.vnNew();
+    initialData.concept = [];
+    initialData.received = Date.vnNew();
    isCash.value = accountingType.value.code == 'cash';
    viewReceipt.value = isCash.value;
    if (accountingType.value.daysInFuture)
-        initialData.payed.setDate(
-            initialData.payed.getDate() + accountingType.value.daysInFuture
+        initialData.received.setDate(
+            initialData.received.getDate() + accountingType.value.daysInFuture
        );
    maxAmount.value = accountingType.value && accountingType.value.maxAmount;

-    if (accountingType.value.code == 'compensation')
-        return (initialData.description = '');
-    if (accountingType.value.receiptDescription)
-        initialData.description.push(accountingType.value.receiptDescription);
-    if (initialData.description) initialData.description.push(initialData.description);
+    if (accountingType.value.code == 'compensation') return (initialData.concept = '');
+    if (accountingType.value.receiptconcept)
+        initialData.concept.push(accountingType.value.receiptconcept);
+    if (initialData.concept) initialData.concept.push(initialData.concept);

-    initialData.description = initialData.description.join(', ');
+    initialData.concept = initialData.concept.join(', ');
 }

 const calculateFromAmount = (event) => {
@ -115,17 +120,18 @@ const calculateFromAmount = (event) => {
 };

 const calculateFromDeliveredAmount = (event) => {
-    initialData.amountToReturn = parseFloat(event) - initialData.amountPaid;
+    initialData.amountToReturn = parseFloat(event) - initialData.amount;
 };

 function onBeforeSave(data) {
-    const exceededAmount = data.amountPaid > maxAmount.value;
+    const exceededAmount = data.amount > maxAmount.value;
    if (isCash.value && exceededAmount)
        return notify(t('Amount exceeded', { maxAmount: maxAmount.value }), 'negative');

    if (isCash.value && shouldSendEmail.value && !data.email)
        return notify(t(`There is no assigned email for this supplier`), 'negative');

+    data.dueDate = data.received;
    data.bankFk = data.bankFk.id;
    return data;
 }
@ -144,25 +150,7 @@ async function onDataSaved(formData, { id }) {
    }
 }

-async function accountShortToStandard({ target: { value } }) {
-    if (!value) return (initialData.description = '');
-    initialData.compensationAccount = value.replace('.', '0'.repeat(11 - value.length));
-    const params = { bankAccount: initialData.compensationAccount };
-    const { data } = await axios(`Clients/getClientOrSupplierReference`, { params });
-    if (!data.clientId) {
-        initialData.description = t('Supplier Compensation Reference', {
-            supplierId: data.supplierId,
-            supplierName: data.supplierName,
-        });
-        return;
-    }
-    initialData.description = t('Client Compensation Reference', {
-        clientId: data.clientId,
-        clientName: data.clientName,
-    });
-}
-
-async function getAmountPaid() {
+async function getAmount() {
    const filter = {
        where: {
            supplierFk: route.params.id,
@ -170,7 +158,7 @@ async function getAmountPaid() {
        },
    };
    const { data } = await getSupplierRisk(filter);
-    initialData.amountPaid = (data?.length && data[0].amount) || undefined;
+    initialData.amount = (data?.length && data[0].amount) || undefined;
 }
 </script>

@ -195,7 +183,7 @@ async function getAmountPaid() {
            @on-fetch="(data) => (currenciesOptions = data)"
            auto-load
        />
-        <FormModel
+        <FormModelPopup
            ref="formModelRef"
            :form-initial-data="initialData"
            :observe-form-changes="false"
@ -203,7 +191,7 @@ async function getAmountPaid() {
            :mapper="onBeforeSave"
            @on-data-saved="onDataSaved"
        >
-            <template #form="{ data, validate }">
+            <template #form-inputs="{ data, validate }">
                <span ref="closeButton" class="row justify-end close-icon" v-close-popup>
                    <QIcon name="close" size="sm" />
                </span>
@ -213,7 +201,7 @@ async function getAmountPaid() {
                    <VnInputDate
                        :label="t('Date')"
                        :required="true"
-                        v-model="data.payed"
+                        v-model="data.received"
                    />
                    <VnSelect
                        :label="t('Company')"
@ -224,7 +212,7 @@ async function getAmountPaid() {
                        option-label="code"
                        option-value="id"
                        v-model="data.companyFk"
-                        @update:model-value="getAmountPaid()"
+                        @update:model-value="getAmount()"
                    />
                </VnRow>
                <VnRow>
@ -251,33 +239,30 @@ async function getAmountPaid() {
                            </QItem>
                        </template>
                    </VnSelect>
-                    <VnInputNumber
-                        :label="t('Amount')"
-                        :required="true"
-                        @update:model-value="calculateFromAmount($event)"
-                        clearable
-                        v-model.number="data.amountPaid"
+                    <VnSelect
+                        :label="t('supplier.billingData.payMethodFk')"
+                        v-model="data.payMethodFk"
+                        url="Paymethods"
+                        auto-load
+                        option-value="id"
+                        option-label="name"
+                        hide-selected
+                        :rules="validate('supplier.payMethodFk')"
                    />
                </VnRow>
-                <div v-if="data.bankFk?.accountingType?.code == 'compensation'">
-                    <div class="text-h6">
-                        {{ t('Compensation') }}
-                    </div>
-                    <VnRow>
-                        <VnAccountNumber
-                            :label="t('Compensation account')"
-                            clearable
-                            required
-                            v-model="data.compensationAccount"
-                            @blur="accountShortToStandard"
-                        />
-                    </VnRow>
-                </div>
+
+                <VnInputNumber
+                    :label="t('Amount')"
+                    :required="true"
+                    @update:model-value="calculateFromAmount($event)"
+                    clearable
+                    v-model.number="data.amount"
+                />
                <VnInput
                    :label="t('Reference')"
                    :required="true"
                    clearable
-                    v-model="data.description"
+                    v-model="data.concept"
                />

                <div v-if="data.bankFk?.accountingType?.code == 'cash'">
@ -305,7 +290,12 @@ async function getAmountPaid() {
                        v-if="$props.extraFields.includes('orderBy')"
                        :label="t('Type')"
                        v-model="data.orderBy"
-                        :options="['issued', ' bookEntried', ' booked', ' dueDate']"
+                        :options="[
+                            { id: 'issued', name: 'Fecha de expedición' },
+                            { id: 'bookEntried', name: 'Fecha de asiento' },
+                            { id: 'booked', name: 'Fecha contable' },
+                            { id: 'dueDate', name: 'Fecha de vencimiento' },
+                        ]"
                        option-value="id"
                        option-label="name"
                        hide-selected
@ -327,27 +317,8 @@ async function getAmountPaid() {
                        v-model="data.divisa"
                    />
                </VnRow>
-                <div class="q-mt-lg row justify-end">
-                    <QBtn
-                        :disabled="formModelRef.isLoading"
-                        :label="t('globals.cancel')"
-                        :loading="formModelRef.isLoading"
-                        class="q-ml-sm"
-                        color="primary"
-                        flat
-                        type="reset"
-                        v-close-popup
-                    />
-                    <QBtn
-                        :disabled="formModelRef.isLoading"
-                        :label="t('globals.save')"
-                        :loading="formModelRef.isLoading"
-                        color="primary"
-                        type="submit"
-                    />
-                </div>
            </template>
-        </FormModel>
+        </FormModelPopup>
    </QDialog>
 </template>