From 38d3d49ecb697c18f6e1b5f02c385e88d19107ba Mon Sep 17 00:00:00 2001
From: carlosfonseca <carlos.fonseca@mindshore.io>
Date: Tue, 12 Mar 2024 16:24:27 -0500
Subject: [PATCH] Solucion a comentarios 34

---
 src/css/fonts/icon.eot:Zone.Identifier        |   3 -
 src/css/fonts/icon.svg:Zone.Identifier        |   3 -
 src/css/fonts/icon.ttf:Zone.Identifier        |   3 -
 src/css/fonts/icon.woff:Zone.Identifier       |   3 -
 src/css/fonts/selection.json:Zone.Identifier  |   3 -
 src/css/icons.scss.css:Zone.Identifier        |   3 -
 src/css/icons.scss:Zone.Identifier            |   3 -
 src/i18n/en/index.js                          |   8 +-
 src/i18n/es/index.js                          |   8 +-
 src/pages/Customer/Card/CustomerBalance.vue   | 278 +++++++-----------
 .../Customer/Card/CustomerCreditContracts.vue | 152 +++++-----
 .../Customer/Card/CustomerCreditOpinion.vue   |   1 -
 src/pages/Customer/Card/CustomerWebAccess.vue |  54 ++--
 .../components/CustomerAddressCreate.vue      | 119 ++++----
 .../CustomerCreditContractsCreate.vue         |   1 -
 .../components/CustomerCreditCreate.vue       |  35 ++-
 .../CustomerFileManagementCreate.vue          |  21 +-
 .../components/CustomerFileManagementEdit.vue |  23 +-
 .../components/CustomerNewCustomsAgent.vue    |   1 -
 19 files changed, 313 insertions(+), 409 deletions(-)
 delete mode 100644 src/css/fonts/icon.eot:Zone.Identifier
 delete mode 100644 src/css/fonts/icon.svg:Zone.Identifier
 delete mode 100644 src/css/fonts/icon.ttf:Zone.Identifier
 delete mode 100644 src/css/fonts/icon.woff:Zone.Identifier
 delete mode 100644 src/css/fonts/selection.json:Zone.Identifier
 delete mode 100644 src/css/icons.scss.css:Zone.Identifier
 delete mode 100644 src/css/icons.scss:Zone.Identifier

diff --git a/src/css/fonts/icon.eot:Zone.Identifier b/src/css/fonts/icon.eot:Zone.Identifier
deleted file mode 100644
index 133a3af6f..000000000
--- a/src/css/fonts/icon.eot:Zone.Identifier
+++ /dev/null
@@ -1,3 +0,0 @@
-[ZoneTransfer]
-ZoneId=3
-ReferrerUrl=C:\Users\cmari\Downloads\Salix-font1.68.zip
diff --git a/src/css/fonts/icon.svg:Zone.Identifier b/src/css/fonts/icon.svg:Zone.Identifier
deleted file mode 100644
index 133a3af6f..000000000
--- a/src/css/fonts/icon.svg:Zone.Identifier
+++ /dev/null
@@ -1,3 +0,0 @@
-[ZoneTransfer]
-ZoneId=3
-ReferrerUrl=C:\Users\cmari\Downloads\Salix-font1.68.zip
diff --git a/src/css/fonts/icon.ttf:Zone.Identifier b/src/css/fonts/icon.ttf:Zone.Identifier
deleted file mode 100644
index 133a3af6f..000000000
--- a/src/css/fonts/icon.ttf:Zone.Identifier
+++ /dev/null
@@ -1,3 +0,0 @@
-[ZoneTransfer]
-ZoneId=3
-ReferrerUrl=C:\Users\cmari\Downloads\Salix-font1.68.zip
diff --git a/src/css/fonts/icon.woff:Zone.Identifier b/src/css/fonts/icon.woff:Zone.Identifier
deleted file mode 100644
index 133a3af6f..000000000
--- a/src/css/fonts/icon.woff:Zone.Identifier
+++ /dev/null
@@ -1,3 +0,0 @@
-[ZoneTransfer]
-ZoneId=3
-ReferrerUrl=C:\Users\cmari\Downloads\Salix-font1.68.zip
diff --git a/src/css/fonts/selection.json:Zone.Identifier b/src/css/fonts/selection.json:Zone.Identifier
deleted file mode 100644
index 133a3af6f..000000000
--- a/src/css/fonts/selection.json:Zone.Identifier
+++ /dev/null
@@ -1,3 +0,0 @@
-[ZoneTransfer]
-ZoneId=3
-ReferrerUrl=C:\Users\cmari\Downloads\Salix-font1.68.zip
diff --git a/src/css/icons.scss.css:Zone.Identifier b/src/css/icons.scss.css:Zone.Identifier
deleted file mode 100644
index 133a3af6f..000000000
--- a/src/css/icons.scss.css:Zone.Identifier
+++ /dev/null
@@ -1,3 +0,0 @@
-[ZoneTransfer]
-ZoneId=3
-ReferrerUrl=C:\Users\cmari\Downloads\Salix-font1.68.zip
diff --git a/src/css/icons.scss:Zone.Identifier b/src/css/icons.scss:Zone.Identifier
deleted file mode 100644
index 133a3af6f..000000000
--- a/src/css/icons.scss:Zone.Identifier
+++ /dev/null
@@ -1,3 +0,0 @@
-[ZoneTransfer]
-ZoneId=3
-ReferrerUrl=C:\Users\cmari\Downloads\Salix-font1.68.zip
diff --git a/src/i18n/en/index.js b/src/i18n/en/index.js
index 4722d0576..3c46eb140 100644
--- a/src/i18n/en/index.js
+++ b/src/i18n/en/index.js
@@ -176,11 +176,11 @@ export default {
             securedCredit: 'Secured credit',
             payMethod: 'Pay method',
             debt: 'Debt',
-            isDisabled: 'Customer is disabled',
-            isFrozen: 'Customer is frozen',
-            webAccountInactive: 'Web account inactive',
+            isFrozen: 'Customer frozen',
             hasDebt: 'Customer has debt',
-            notChecked: 'Customer not checked',
+            isDisabled: 'Customer inactive',
+            notChecked: 'Customer no checked',
+            webAccountInactive: 'Web account inactive',
             noWebAccess: 'Web access is disabled',
             businessType: 'Business type',
             passwordRequirements:
diff --git a/src/i18n/es/index.js b/src/i18n/es/index.js
index e69f92b6d..3724d3ba0 100644
--- a/src/i18n/es/index.js
+++ b/src/i18n/es/index.js
@@ -175,11 +175,11 @@ export default {
             securedCredit: 'Crédito asegurado',
             payMethod: 'Método de pago',
             debt: 'Riesgo',
-            isDisabled: 'El cliente está desactivado',
-            isFrozen: 'El cliente está congelado',
+            isFrozen: 'Cliente congelado',
+            hasDebt: 'Cliente con riesgo',
+            isDisabled: 'Cliente inactivo',
+            notChecked: 'Cliente no comprobado',
             webAccountInactive: 'Sin acceso web',
-            hasDebt: 'El cliente tiene riesgo',
-            notChecked: 'El cliente no está comprobado',
             noWebAccess: 'El acceso web está desactivado',
             businessType: 'Tipo de negocio',
             passwordRequirements:
diff --git a/src/pages/Customer/Card/CustomerBalance.vue b/src/pages/Customer/Card/CustomerBalance.vue
index bd8337346..ec836935c 100644
--- a/src/pages/Customer/Card/CustomerBalance.vue
+++ b/src/pages/Customer/Card/CustomerBalance.vue
@@ -46,62 +46,6 @@ const filter = {
     where: { clientFk: route.params.id, companyFk: user.value.companyFk },
 };
 
-const tableColumnComponents = {
-    date: {
-        component: 'span',
-        props: () => {},
-        event: () => {},
-    },
-    creationDate: {
-        component: 'span',
-        props: () => {},
-        event: () => {},
-    },
-    employee: {
-        component: QBtn,
-        props: () => ({ flat: true, color: 'blue', noCaps: true }),
-        event: () => {},
-    },
-    reference: {
-        component: 'div',
-        props: () => {},
-        event: () => {},
-    },
-    bank: {
-        component: 'span',
-        props: () => {},
-        event: () => {},
-    },
-    debit: {
-        component: 'span',
-        props: () => {},
-        event: () => {},
-    },
-    havings: {
-        component: 'span',
-        props: () => {},
-        event: () => {},
-    },
-    balance: {
-        component: 'span',
-        props: () => {},
-        event: () => {},
-    },
-    conciliated: {
-        component: QCheckbox,
-        props: (prop) => ({
-            disable: true,
-            'model-value': Boolean(prop.value),
-        }),
-        event: () => {},
-    },
-    actions: {
-        component: 'div',
-        props: () => {},
-        event: () => {},
-    },
-};
-
 const columns = computed(() => [
     {
         align: 'left',
@@ -151,8 +95,8 @@ const columns = computed(() => [
     },
     {
         align: 'left',
-        field: (value) => value.debit - value.credit,
-        format: (value) => toCurrency(value),
+        field: 'balance',
+        format: (value) => value && toCurrency(value),
         label: t('Balance'),
         name: 'balance',
     },
@@ -190,6 +134,16 @@ const getData = () => {
 };
 
 const onFetch = (data) => {
+    if (clientRisks.value?.length && data.length) {
+        data[0].balance = clientRisks.value[0]?.amount || 0;
+
+        data.reduce((prev, curr) => {
+            const netMovement = prev.debit - prev.credit;
+            curr.balance = prev.balance - netMovement;
+            return curr;
+        });
+    }
+
     receiptsData.value = data;
 };
 
@@ -213,10 +167,10 @@ const updateCompanyId = (id) => {
     getData();
 };
 
-const saveFieldValue = async (event) => {
+const saveFieldValue = async (row) => {
     try {
-        const payload = { description: event.value };
-        await axios.patch(`Receipts/${event.key}`, payload);
+        const payload = { description: row.description };
+        await axios.patch(`Receipts/${row.id}`, payload);
     } catch (err) {
         return err;
     }
@@ -228,13 +182,6 @@ const sendEmailAction = () => {
 </script>
 
 <template>
-    <FetchData
-        :filter="filterCompanies"
-        @on-fetch="(data) => (companiesOptions = data)"
-        auto-load
-        url="Companies"
-    />
-
     <FetchData
         :filter="filter"
         @on-fetch="(data) => (clientRisks = data)"
@@ -242,6 +189,12 @@ const sendEmailAction = () => {
         ref="clientRisksRef"
         url="ClientRisks"
     />
+    <FetchData
+        :filter="filterCompanies"
+        @on-fetch="(data) => (companiesOptions = data)"
+        auto-load
+        url="Companies"
+    />
 
     <VnPaginate
         auto-load
@@ -261,116 +214,91 @@ const sendEmailAction = () => {
                 class="full-width q-mt-md"
                 row-key="id"
             >
-                <template #body-cell="props">
-                    <QTd :props="props">
-                        <QTr :props="props" class="cursor-pointer">
-                            <component
-                                :is="tableColumnComponents[props.col.name].component"
-                                class="col-content"
-                                v-bind="
-                                    tableColumnComponents[props.col.name].props(props)
-                                "
-                                @click="
-                                    tableColumnComponents[props.col.name].event(props)
-                                "
-                            >
-                                <template
-                                    v-if="
-                                        props.col.name !== 'conciliated' &&
-                                        props.col.name !== 'reference' &&
-                                        props.col.name !== 'actions'
-                                    "
-                                >
-                                    {{ props.value }}
-                                </template>
+                <template #body-cell-employee="{ row }">
+                    <QTd auto-width @click.stop>
+                        <QBtn color="blue" flat no-caps>{{ row.userName }}</QBtn>
+                        <WorkerDescriptorProxy :id="row.clientFk" />
+                    </QTd>
+                </template>
 
-                                <template v-if="props.col.name === 'reference'">
-                                    <div v-if="props.row.isInvoice">
-                                        <QBtn color="blue" dense flat>
-                                            {{ t('bill', { ref: props.value }) }}
-                                        </QBtn>
-                                        <InvoiceOutDescriptorProxy
-                                            :id="props.row.id"
-                                            v-if="props.col.name === 'reference'"
-                                        />
-                                    </div>
-                                    <VnInput
-                                        @keyup.enter="saveFieldValue(props)"
-                                        autofocus
-                                        clearable
-                                        dense
-                                        v-model="props.row.description"
-                                        v-else
-                                    />
-                                </template>
+                <template #body-cell-reference="{ row }">
+                    <QTd auto-width @click.stop v-if="row.isInvoice">
+                        <QBtn color="blue" dense flat>
+                            {{ t('bill', { ref: row.description }) }}
+                        </QBtn>
+                        <InvoiceOutDescriptorProxy :id="row.id" />
+                    </QTd>
+                    <QTd v-else>
+                        <VnInput
+                            @keyup.enter="saveFieldValue(row)"
+                            autofocus
+                            clearable
+                            dense
+                            v-model="row.description"
+                        />
+                    </QTd>
+                </template>
 
-                                <template
-                                    v-if="
-                                        props.col.name === 'actions' &&
-                                        props.row.isCompensation
-                                    "
-                                >
-                                    <QIcon
-                                        @click.stop="showDialog = true"
-                                        class="q-ml-md"
-                                        color="primary"
-                                        name="add"
-                                        size="sm"
+                <template #body-cell-conciliated="{ row }">
+                    <QTd align="center">
+                        <QCheckbox :model-value="row.isConciliate === 1" />
+                    </QTd>
+                </template>
+
+                <template #body-cell-actions="{ row }">
+                    <QTd align="center">
+                        <QIcon
+                            @click.stop="showDialog = true"
+                            class="q-ml-md"
+                            color="primary"
+                            name="add"
+                            size="sm"
+                            v-if="row.isCompensation"
+                        >
+                            <QTooltip>
+                                {{ t('Send compensation') }}
+                            </QTooltip>
+                        </QIcon>
+
+                        <QDialog v-model="showDialog">
+                            <QCard class="q-pa-sm">
+                                <QCardSection>
+                                    <span
+                                        ref="closeButton"
+                                        class="flex justify-end color-vn-label"
+                                        v-close-popup
                                     >
-                                        <QTooltip>
-                                            {{ t('Send compensation') }}
-                                        </QTooltip>
-                                    </QIcon>
-
-                                    <QDialog v-model="showDialog">
-                                        <QCard class="q-pa-sm">
-                                            <QCardSection>
-                                                <span
-                                                    ref="closeButton"
-                                                    class="flex justify-end color-vn-label"
-                                                    v-close-popup
-                                                >
-                                                    <QIcon name="close" size="sm" />
-                                                </span>
-                                                <div class="text-h6">
-                                                    {{ t('Send compensation') }}
-                                                </div>
-                                            </QCardSection>
-                                            <QCardSection>
-                                                <div>
-                                                    {{
-                                                        t(
-                                                            'Do you want to report compensation to the client by mail?'
-                                                        )
-                                                    }}
-                                                </div>
-                                            </QCardSection>
-                                            <QCardActions
-                                                class="flex justify-end q-mb-sm"
-                                            >
-                                                <QBtn
-                                                    :label="t('globals.cancel')"
-                                                    color="primary"
-                                                    flat
-                                                    v-close-popup
-                                                />
-                                                <QBtn
-                                                    :label="t('globals.save')"
-                                                    @click="sendEmailAction"
-                                                    class="q-ml-sm"
-                                                    color="primary"
-                                                />
-                                            </QCardActions>
-                                        </QCard>
-                                    </QDialog>
-                                </template>
-
-                                <WorkerDescriptorProxy
-                                    :id="props.row.clientFk"
-                                    v-if="props.col.name === 'userName'"
-                                />
-                            </component>
-                        </QTr>
+                                        <QIcon name="close" size="sm" />
+                                    </span>
+                                    <div class="text-h6">
+                                        {{ t('Send compensation') }}
+                                    </div>
+                                </QCardSection>
+                                <QCardSection>
+                                    <div>
+                                        {{
+                                            t(
+                                                'Do you want to report compensation to the client by mail?'
+                                            )
+                                        }}
+                                    </div>
+                                </QCardSection>
+                                <QCardActions class="flex justify-end q-mb-sm">
+                                    <QBtn
+                                        :label="t('globals.cancel')"
+                                        color="primary"
+                                        flat
+                                        v-close-popup
+                                    />
+                                    <QBtn
+                                        :label="t('globals.save')"
+                                        @click="sendEmailAction"
+                                        class="q-ml-sm"
+                                        color="primary"
+                                    />
+                                </QCardActions>
+                            </QCard>
+                        </QDialog>
                     </QTd>
                 </template>
             </QTable>
diff --git a/src/pages/Customer/Card/CustomerCreditContracts.vue b/src/pages/Customer/Card/CustomerCreditContracts.vue
index 11acb226c..1729ac076 100644
--- a/src/pages/Customer/Card/CustomerCreditContracts.vue
+++ b/src/pages/Customer/Card/CustomerCreditContracts.vue
@@ -92,87 +92,91 @@ const updateData = () => {
                                 'is-active': !item.finished,
                             }"
                         >
-                            <QCardSection class="flex q-py-none">
-                                <div
-                                    class="flex items-center q-ml-md cursor-pointer"
-                                    v-if="!item.finished"
-                                >
-                                    <QIcon
-                                        @click.stop="openDialog(item)"
-                                        color="primary"
-                                        name="lock"
-                                        size="md"
+                            <QCardSection
+                                class="full-width flex justify-between q-py-none"
+                            >
+                                <div class="width-state flex">
+                                    <div
+                                        class="flex items-center cursor-pointer q-mr-md"
+                                        v-if="!item.finished"
                                     >
-                                        <QTooltip>{{ t('Close contract') }}</QTooltip>
-                                    </QIcon>
-                                </div>
+                                        <QIcon
+                                            @click.stop="openDialog(item)"
+                                            color="primary"
+                                            name="lock"
+                                            size="md"
+                                            style="font-variation-settings: 'FILL' 1"
+                                        >
+                                            <QTooltip>{{ t('Close contract') }}</QTooltip>
+                                        </QIcon>
+                                    </div>
 
-                                <div class="q-ml-lg">
-                                    <div class="flex q-mb-xs">
-                                        <div class="q-mr-sm color-vn-label">
-                                            {{ t('Since') }}:
+                                    <div>
+                                        <div class="flex q-mb-xs">
+                                            <div class="q-mr-sm color-vn-label">
+                                                {{ t('Since') }}:
+                                            </div>
+                                            <div class="text-weight-bold">
+                                                {{ toDate(item.started) }}
+                                            </div>
                                         </div>
-                                        <div class="text-weight-bold">
-                                            {{ toDate(item.started) }}
+                                        <div class="flex">
+                                            <div class="q-mr-sm color-vn-label">
+                                                {{ t('To') }}:
+                                            </div>
+                                            <div class="text-weight-bold">
+                                                {{ toDate(item.finished) }}
+                                            </div>
                                         </div>
                                     </div>
-                                    <div class="flex">
-                                        <div class="q-mr-sm color-vn-label">
-                                            {{ t('To') }}:
+                                </div>
+
+                                <QSeparator vertical />
+
+                                <div class="width-data flex">
+                                    <div
+                                        class="full-width flex justify-between items-center"
+                                        v-if="item?.insurances.length"
+                                    >
+                                        <div class="flex">
+                                            <div class="color-vn-label q-mr-xs">
+                                                {{ t('Credit') }}:
+                                            </div>
+                                            <div class="text-weight-bold">
+                                                {{ item.insurances[0].credit }}
+                                            </div>
                                         </div>
-                                        <div class="text-weight-bold">
-                                            {{ toDate(item.finished) }}
+                                        <div class="flex">
+                                            <div class="color-vn-label q-mr-xs">
+                                                {{ t('Grade') }}:
+                                            </div>
+                                            <div class="text-weight-bold">
+                                                {{ item.insurances[0].grade || '-' }}
+                                            </div>
+                                        </div>
+                                        <div class="flex">
+                                            <div class="color-vn-label q-mr-xs">
+                                                {{ t('Date') }}:
+                                            </div>
+                                            <div class="text-weight-bold">
+                                                {{ toDate(item.insurances[0].created) }}
+                                            </div>
+                                        </div>
+                                        <div class="flex items-center cursor-pointer">
+                                            <QIcon
+                                                @click.stop="openViewCredit(item)"
+                                                color="primary"
+                                                name="preview"
+                                                size="md"
+                                            >
+                                                <QTooltip>{{
+                                                    t('View credits')
+                                                }}</QTooltip>
+                                            </QIcon>
                                         </div>
                                     </div>
                                 </div>
                             </QCardSection>
-
-                            <QSeparator class="q-mx-lg" vertical />
-
-                            <div class="flex">
-                                <div
-                                    class="flex items-center"
-                                    v-if="item?.insurances.length"
-                                >
-                                    <div class="flex q-mr-xl">
-                                        <div class="q-mr-sm color-vn-label">
-                                            {{ t('Credit') }}:
-                                        </div>
-                                        <div class="text-weight-bold">
-                                            {{ item.insurances[0].credit }}
-                                        </div>
-                                    </div>
-                                    <div class="flex q-mr-xl">
-                                        <div class="q-mr-sm color-vn-label">
-                                            {{ t('Grade') }}:
-                                        </div>
-                                        <div class="text-weight-bold">
-                                            {{ item.insurances[0].grade || '-' }}
-                                        </div>
-                                    </div>
-                                    <div class="flex">
-                                        <div class="q-mr-sm color-vn-label">
-                                            {{ t('Date') }}:
-                                        </div>
-                                        <div class="text-weight-bold">
-                                            {{ toDate(item.insurances[0].created) }}
-                                        </div>
-                                    </div>
-                                </div>
-
-                                <div
-                                    class="flex items-center q-ml-lg q-mr-md cursor-pointer"
-                                >
-                                    <QIcon
-                                        @click.stop="openViewCredit(item)"
-                                        color="primary"
-                                        name="preview"
-                                        size="md"
-                                    >
-                                        <QTooltip>{{ t('View credits') }}</QTooltip>
-                                    </QIcon>
-                                </div>
-                            </div>
                         </QCard>
                     </div>
                     <h5 class="flex justify-center color-vn-label" v-else>
@@ -207,6 +211,12 @@ const updateData = () => {
 .is-active {
     background-color: var(--vn-light-gray);
 }
+.width-state {
+    width: 30%;
+}
+.width-data {
+    width: 65%;
+}
 </style>
 
 <i18n>
diff --git a/src/pages/Customer/Card/CustomerCreditOpinion.vue b/src/pages/Customer/Card/CustomerCreditOpinion.vue
index e203679da..8c16f087f 100644
--- a/src/pages/Customer/Card/CustomerCreditOpinion.vue
+++ b/src/pages/Customer/Card/CustomerCreditOpinion.vue
@@ -95,7 +95,6 @@ const columns = computed(() => [
     />
 
     <FormModel
-        :form-initial-data="{}"
         :observe-form-changes="false"
         :url-create="`Clients/${route.params.id}/setRating`"
     >
diff --git a/src/pages/Customer/Card/CustomerWebAccess.vue b/src/pages/Customer/Card/CustomerWebAccess.vue
index e28331b86..0cf1384ab 100644
--- a/src/pages/Customer/Card/CustomerWebAccess.vue
+++ b/src/pages/Customer/Card/CustomerWebAccess.vue
@@ -139,39 +139,29 @@ const onSubmit = async () => {
         <QCard class="card-width q-pa-lg">
             <QCardSection>
                 <QForm>
-                    <VnRow class="row q-gutter-md q-mb-md">
-                        <div class="col">
-                            <QCheckbox :label="t('Enable web access')" v-model="active" />
-                        </div>
-                    </VnRow>
+                    <QCheckbox :label="t('Enable web access')" v-model="active" />
 
-                    <VnRow class="row q-gutter-md q-mb-md">
-                        <div class="col">
-                            <VnInput :label="t('User')" clearable v-model="name" />
-                        </div>
-                    </VnRow>
-
-                    <VnRow class="row q-gutter-md q-mb-md">
-                        <div class="col">
-                            <VnInput
-                                :label="t('Recovery email')"
-                                :rules="validate('client.email')"
-                                clearable
-                                type="email"
-                                v-model="email"
-                            >
-                                <template #append>
-                                    <QIcon name="info" class="cursor-pointer">
-                                        <QTooltip>{{
-                                            t(
-                                                'This email is used for user to regain access their account'
-                                            )
-                                        }}</QTooltip>
-                                    </QIcon>
-                                </template>
-                            </VnInput>
-                        </div>
-                    </VnRow>
+                    <div class="q-px-sm">
+                        <VnInput :label="t('User')" clearable v-model="name" />
+                        <VnInput
+                            :label="t('Recovery email')"
+                            :rules="validate('client.email')"
+                            clearable
+                            type="email"
+                            v-model="email"
+                            class="q-mt-sm"
+                        >
+                            <template #append>
+                                <QIcon name="info" class="cursor-pointer">
+                                    <QTooltip>{{
+                                        t(
+                                            'This email is used for user to regain access their account'
+                                        )
+                                    }}</QTooltip>
+                                </QIcon>
+                            </template>
+                        </VnInput>
+                    </div>
                 </QForm>
             </QCardSection>
         </QCard>
diff --git a/src/pages/Customer/components/CustomerAddressCreate.vue b/src/pages/Customer/components/CustomerAddressCreate.vue
index 30d4acf82..752024944 100644
--- a/src/pages/Customer/components/CustomerAddressCreate.vue
+++ b/src/pages/Customer/components/CustomerAddressCreate.vue
@@ -84,79 +84,64 @@ function handleLocation(data, location) {
         </template>
 
         <template #form="{ data, validate }">
-            <VnRow class="row q-gutter-md q-mb-md">
-                <div class="col">
-                    <QCheckbox :label="t('Default')" v-model="data.isDefaultAddress" />
-                </div>
-            </VnRow>
+            <QCheckbox :label="t('Default')" v-model="data.isDefaultAddress" />
 
             <VnRow class="row q-gutter-md q-mb-md">
-                <div class="col">
-                    <VnInput :label="t('Consignee')" clearable v-model="data.nickname" />
-                </div>
-                <div class="col">
-                    <VnInput
-                        :label="t('Street address')"
-                        clearable
-                        v-model="data.street"
-                    />
-                </div>
+                <VnInput :label="t('Consignee')" clearable v-model="data.nickname" />
+
+                <VnInput :label="t('Street address')" clearable v-model="data.street" />
             </VnRow>
 
-            <VnRow class="row q-gutter-md q-mb-md">
-                <div class="col">
-                    <VnLocation
-                        :rules="validate('Worker.postcode')"
-                        :roles-allowed-to-create="['deliveryAssistant']"
-                        :options="postcodesOptions"
-                        v-model="data.location"
-                        @update:model-value="(location) => handleLocation(data, location)"
-                    ></VnLocation>
-                </div>
-                <div class="col">
-                    <VnSelectFilter
-                        :label="t('Agency')"
-                        :options="agencyModes"
-                        :rules="validate('route.agencyFk')"
-                        hide-selected
-                        option-label="name"
-                        option-value="id"
-                        v-model="data.agencyModeFk"
-                    />
-                </div>
-                <div class="col">
-                    <VnInput :label="t('Phone')" clearable v-model="data.phone" />
-                </div>
-                <div class="col">
-                    <VnInput :label="t('Mobile')" clearable v-model="data.mobile" />
-                </div>
-            </VnRow>
+            <VnLocation
+                :rules="validate('Worker.postcode')"
+                :roles-allowed-to-create="['deliveryAssistant']"
+                :options="postcodesOptions"
+                v-model="data.location"
+                @update:model-value="(location) => handleLocation(data, location)"
+            />
+
+            <div class="row justify-between q-gutter-md q-mb-md">
+                <VnSelectFilter
+                    :label="t('Agency')"
+                    :options="agencyModes"
+                    :rules="validate('route.agencyFk')"
+                    hide-selected
+                    option-label="name"
+                    option-value="id"
+                    v-model="data.agencyModeFk"
+                    class="col"
+                />
+                <VnInput class="col" :label="t('Phone')" clearable v-model="data.phone" />
+                <VnInput
+                    class="col"
+                    :label="t('Mobile')"
+                    clearable
+                    v-model="data.mobile"
+                />
+            </div>
 
             <VnRow class="row q-gutter-md q-mb-md">
-                <div class="col">
-                    <VnSelectFilter
-                        :label="t('Incoterms')"
-                        :options="incoterms"
-                        hide-selected
-                        option-label="name"
-                        option-value="code"
-                        v-model="data.incotermsFk"
-                    />
-                </div>
-                <div class="col">
-                    <VnSelectDialog
-                        :label="t('Customs agent')"
-                        :options="customsAgents"
-                        hide-selected
-                        option-label="fiscalName"
-                        option-value="id"
-                        v-model="data.customsAgentFk"
-                    >
-                        <template #form>
-                            <CustomerNewCustomsAgent @on-data-saved="refreshData()" />
-                        </template>
-                    </VnSelectDialog>
-                </div>
+                <VnSelectFilter
+                    :label="t('Incoterms')"
+                    :options="incoterms"
+                    hide-selected
+                    option-label="name"
+                    option-value="code"
+                    v-model="data.incotermsFk"
+                />
+
+                <VnSelectDialog
+                    :label="t('Customs agent')"
+                    :options="customsAgents"
+                    hide-selected
+                    option-label="fiscalName"
+                    option-value="id"
+                    v-model="data.customsAgentFk"
+                >
+                    <template #form>
+                        <CustomerNewCustomsAgent @on-data-saved="refreshData()" />
+                    </template>
+                </VnSelectDialog>
             </VnRow>
         </template>
     </FormModel>
diff --git a/src/pages/Customer/components/CustomerCreditContractsCreate.vue b/src/pages/Customer/components/CustomerCreditContractsCreate.vue
index d8361faa7..d902e7a97 100644
--- a/src/pages/Customer/components/CustomerCreditContractsCreate.vue
+++ b/src/pages/Customer/components/CustomerCreditContractsCreate.vue
@@ -25,7 +25,6 @@ const toCustomerCreditContracts = () => {
     <FormModel
         :form-initial-data="initialData"
         :observe-form-changes="false"
-        :default-actions="true"
         url-create="creditClassifications/createWithInsurance"
         @on-data-saved="toCustomerCreditContracts()"
     >
diff --git a/src/pages/Customer/components/CustomerCreditCreate.vue b/src/pages/Customer/components/CustomerCreditCreate.vue
index 3671f1001..ae6d4de89 100644
--- a/src/pages/Customer/components/CustomerCreditCreate.vue
+++ b/src/pages/Customer/components/CustomerCreditCreate.vue
@@ -1,15 +1,22 @@
 <script setup>
-import { reactive } from 'vue';
+import { ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRoute, useRouter } from 'vue-router';
 
+import FetchData from 'components/FetchData.vue';
 import FormModel from 'components/FormModel.vue';
-import VnRow from 'components/ui/VnRow.vue';
 
 const { t } = useI18n();
 const route = useRoute();
 const router = useRouter();
 
+const initialData = ref({});
+
+const setClient = (data) => {
+    console.log(data.credit);
+    initialData.value.credit = data.credit;
+};
+
 const toCustomerCredits = () => {
     router.push({
         name: 'CustomerCredits',
@@ -21,8 +28,15 @@ const toCustomerCredits = () => {
 </script>
 
 <template>
+    <FetchData
+        :filter="filter"
+        @on-fetch="setClient"
+        auto-load
+        :url="`Clients/${route.params.id}/getCard`"
+    />
+
     <FormModel
-        :form-initial-data="{}"
+        :form-initial-data="initialData"
         :observe-form-changes="false"
         :url-update="`/Clients/${route.params.id}`"
         @on-data-saved="toCustomerCredits()"
@@ -38,15 +52,12 @@ const toCustomerCredits = () => {
         </template>
 
         <template #form="{ data }">
-            <VnRow class="row q-gutter-md q-mb-md">
-                <div class="col">
-                    <QInput
-                        :label="t('Credit')"
-                        type="number"
-                        v-model.number="data.credit"
-                    />
-                </div>
-            </VnRow>
+            <QInput
+                :label="t('Credit')"
+                clearable
+                type="number"
+                v-model.number="data.credit"
+            />
         </template>
     </FormModel>
 </template>
diff --git a/src/pages/Customer/components/CustomerFileManagementCreate.vue b/src/pages/Customer/components/CustomerFileManagementCreate.vue
index 6d76c2b72..8970eaaaf 100644
--- a/src/pages/Customer/components/CustomerFileManagementCreate.vue
+++ b/src/pages/Customer/components/CustomerFileManagementCreate.vue
@@ -57,18 +57,21 @@ watch([client, findOne], ([newClient, newFindOne]) => {
 const saveData = async () => {
     try {
         const formData = new FormData();
+        const files = dms.value.files;
 
-        if (dms.value.files) {
-            for (let i = 0; i < dms.value.files.length; i++)
-                formData.append(dms.value.files[i].name, dms.value.files[i]);
+        if (files && files.length > 0) {
+            for (let file of files) {
+                formData.append(file.name, file);
+            }
             dms.value.hasFileAttached = true;
+
+            const url = `clients/${route.params.id}/uploadFile`;
+            await axios.post(url, formData, {
+                params: dms.value,
+            });
+            notify('globals.dataSaved', 'positive');
+            toCustomerFileManagement();
         }
-        const url = `clients/${route.params.id}/uploadFile`;
-        await axios.post(url, formData, {
-            params: dms.value,
-        });
-        notify('globals.dataSaved', 'positive');
-        toCustomerFileManagement();
     } catch (error) {
         notify(error.message, 'negative');
     }
diff --git a/src/pages/Customer/components/CustomerFileManagementEdit.vue b/src/pages/Customer/components/CustomerFileManagementEdit.vue
index f1279b938..b5e0d4b7d 100644
--- a/src/pages/Customer/components/CustomerFileManagementEdit.vue
+++ b/src/pages/Customer/components/CustomerFileManagementEdit.vue
@@ -43,20 +43,21 @@ const setCurrentDms = (data) => {
 const saveData = async () => {
     try {
         const formData = new FormData();
+        const files = dms.value.files;
 
-        if (dms.value.files) {
-            for (let i = 0; i < dms.value.files.length; i++)
-                formData.append(dms.value.files[i].name, dms.value.files[i]);
+        if (files && files.length > 0) {
+            for (let file of files) {
+                formData.append(file.name, file);
+            }
             dms.value.hasFileAttached = true;
+
+            const url = `dms/${route.params.dmsId}/updateFile`;
+            await axios.post(url, formData, {
+                params: dms.value,
+            });
+            notify('globals.dataSaved', 'positive');
+            toCustomerFileManagement();
         }
-
-        const url = `dms/${route.params.dmsId}/updateFile`;
-        await axios.post(url, formData, {
-            params: dms.value,
-        });
-
-        notify('globals.dataSaved', 'positive');
-        toCustomerFileManagement();
     } catch (error) {
         notify(error.message, 'negative');
     }
diff --git a/src/pages/Customer/components/CustomerNewCustomsAgent.vue b/src/pages/Customer/components/CustomerNewCustomsAgent.vue
index 44c94f0d9..062fd0254 100644
--- a/src/pages/Customer/components/CustomerNewCustomsAgent.vue
+++ b/src/pages/Customer/components/CustomerNewCustomsAgent.vue
@@ -17,7 +17,6 @@ const onDataSaved = (dataSaved) => {
 
 <template>
     <FormModelPopup
-        :form-initial-data="{}"
         :title="t('New customs agent')"
         @on-data-saved="onDataSaved($event)"
         model="customer"