From 3bcd4984f5215374960696bc60d499e913c8a3b1 Mon Sep 17 00:00:00 2001
From: carlosfonseca <carlos.fonseca@mindshore.io>
Date: Thu, 22 Feb 2024 05:11:02 -0500
Subject: [PATCH] Solucion a comentarios 17

---
 src/css/app.scss                              |  4 +
 .../Customer/Card/CustomerCreditContracts.vue |  2 +-
 .../Customer/Card/CustomerCreditOpinion.vue   | 94 ++++++++++++++++++-
 .../Customer/Card/CustomerFiscalData.vue      |  2 +-
 src/pages/Customer/Card/CustomerSummary.vue   |  5 +
 src/pages/Customer/Card/CustomerWebAccess.vue | 75 ++++++++-------
 .../CustomerCreditContractsInsurance.vue      |  6 +-
 src/router/modules/customer.js                | 13 +--
 8 files changed, 148 insertions(+), 53 deletions(-)

diff --git a/src/css/app.scss b/src/css/app.scss
index 66e7e3c37..65512eae8 100644
--- a/src/css/app.scss
+++ b/src/css/app.scss
@@ -66,6 +66,10 @@ body.body--dark {
     border-radius: 8px;
 }
 
+.card-width {
+    width: 800px;
+}
+
 .vn-card-list {
     width: 100%;
     max-width: 60em;
diff --git a/src/pages/Customer/Card/CustomerCreditContracts.vue b/src/pages/Customer/Card/CustomerCreditContracts.vue
index 04952e913..654bd1e91 100644
--- a/src/pages/Customer/Card/CustomerCreditContracts.vue
+++ b/src/pages/Customer/Card/CustomerCreditContracts.vue
@@ -129,7 +129,7 @@ const updateData = () => {
                         <QSeparator class="q-mx-lg" vertical />
 
                         <div class="flex">
-                            <div class="flex items-center">
+                            <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') }}:
diff --git a/src/pages/Customer/Card/CustomerCreditOpinion.vue b/src/pages/Customer/Card/CustomerCreditOpinion.vue
index 2746750ab..1eeae0f24 100644
--- a/src/pages/Customer/Card/CustomerCreditOpinion.vue
+++ b/src/pages/Customer/Card/CustomerCreditOpinion.vue
@@ -1,17 +1,22 @@
 <script setup>
-import { reactive, ref } from 'vue';
+import { computed, reactive, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRoute } from 'vue-router';
 
+import { QBtn } from 'quasar';
+
+import { toCurrency, toDateHourMin } from 'src/filters';
+
 import FetchData from 'components/FetchData.vue';
 import FormModel from 'components/FormModel.vue';
 import VnRow from 'components/ui/VnRow.vue';
 import VnInput from 'src/components/common/VnInput.vue';
+import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
 
 const { t } = useI18n();
 const route = useRoute();
 
-const informationOptions = ref([]);
+const rows = ref([]);
 
 const filter = {
     include: [
@@ -32,12 +37,64 @@ const initialData = reactive({
     rating: null,
     recommendedCredit: null,
 });
+
+const tableColumnComponents = {
+    since: {
+        component: 'span',
+        props: () => {},
+        event: () => {},
+    },
+    employee: {
+        component: QBtn,
+        props: () => ({ flat: true, color: 'blue' }),
+        event: () => {},
+    },
+    rating: {
+        component: 'span',
+        props: () => {},
+        event: () => {},
+    },
+    recommendedCredit: {
+        component: 'span',
+        props: () => {},
+        event: () => {},
+    },
+};
+
+const columns = computed(() => [
+    {
+        align: 'left',
+        field: 'created',
+        format: (value) => toDateHourMin(value),
+        label: t('Since'),
+        name: 'since',
+    },
+    {
+        align: 'left',
+        field: (row) => row.worker.user.nickname,
+        label: t('Employee'),
+        name: 'employee',
+    },
+    {
+        align: 'left',
+        field: 'rating',
+        label: t('Rating'),
+        name: 'rating',
+    },
+    {
+        align: 'left',
+        field: 'recommendedCredit',
+        format: (value) => toCurrency(value),
+        label: t('Recommended credit'),
+        name: 'recommendedCredit',
+    },
+]);
 </script>
 
 <template>
     <FetchData
         :filter="filter"
-        @on-fetch="(data) => (informationOptions = data)"
+        @on-fetch="(data) => (rows = data)"
         auto-load
         url="ClientInformas"
     />
@@ -68,10 +125,41 @@ const initialData = reactive({
             </VnRow>
         </template>
     </FormModel>
+
+    <QTable
+        :columns="columns"
+        :pagination="{ rowsPerPage: 0 }"
+        :rows="rows"
+        hide-bottom
+        row-key="id"
+        v-model:selected="selected"
+        class="q-pa-lg"
+    >
+        <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)"
+                    >
+                        {{ props.value }}
+                        <WorkerDescriptorProxy
+                            :id="props.row.workerFk"
+                            v-if="props.col.name === 'employee'"
+                        />
+                    </component>
+                </QTr>
+            </QTd>
+        </template>
+    </QTable>
 </template>
 
 <i18n>
 es:
     Rating: Clasificación
     Recommended credit: Crédito recomendado
+    Since: Desde
+    Employee: Empleado
 </i18n>
diff --git a/src/pages/Customer/Card/CustomerFiscalData.vue b/src/pages/Customer/Card/CustomerFiscalData.vue
index 0a5b6f596..f74cbc2c4 100644
--- a/src/pages/Customer/Card/CustomerFiscalData.vue
+++ b/src/pages/Customer/Card/CustomerFiscalData.vue
@@ -83,7 +83,7 @@ function handleLocation(data, location) {
                         :label="t('Sage transaction type')"
                         :options="typesTransactions"
                         hide-selected
-                        option-label="vat"
+                        option-label="transaction"
                         option-value="id"
                         v-model="data.sageTransactionTypeFk"
                     >
diff --git a/src/pages/Customer/Card/CustomerSummary.vue b/src/pages/Customer/Card/CustomerSummary.vue
index c35fa3bfa..8b4994f6e 100644
--- a/src/pages/Customer/Card/CustomerSummary.vue
+++ b/src/pages/Customer/Card/CustomerSummary.vue
@@ -287,3 +287,8 @@ const creditWarning = computed(() => {
         </template>
     </CardSummary>
 </template>
+
+<i18n>
+es:
+    Latest tickets: Últimos tickets
+</i18n>
diff --git a/src/pages/Customer/Card/CustomerWebAccess.vue b/src/pages/Customer/Card/CustomerWebAccess.vue
index 1dacba99e..e28331b86 100644
--- a/src/pages/Customer/Card/CustomerWebAccess.vue
+++ b/src/pages/Customer/Card/CustomerWebAccess.vue
@@ -135,42 +135,47 @@ const onSubmit = async () => {
         </QBtnGroup>
     </Teleport>
 
-    <QCard class="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>
+    <div class="full-width flex justify-center">
+        <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>
 
-                <VnRow class="row q-gutter-md q-mb-md">
-                    <div class="col">
-                        <VnInput :label="t('User')" clearable v-model="name" />
-                    </div>
-                    <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>
-            </QForm>
-        </QCardSection>
-    </QCard>
+                    <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>
+                </QForm>
+            </QCardSection>
+        </QCard>
+    </div>
 </template>
 
 <i18n>
diff --git a/src/pages/Customer/components/CustomerCreditContractsInsurance.vue b/src/pages/Customer/components/CustomerCreditContractsInsurance.vue
index ad2686bb6..ce880d4b5 100644
--- a/src/pages/Customer/components/CustomerCreditContractsInsurance.vue
+++ b/src/pages/Customer/components/CustomerCreditContractsInsurance.vue
@@ -69,7 +69,7 @@ const columns = computed(() => [
         url="CreditInsurances"
     />
 
-    <QPage class="column items-center q-pa-md">
+    <QPage class="column items-center q-pa-md" v-if="rows.length">
         <QTable
             :columns="columns"
             :pagination="{ rowsPerPage: 12 }"
@@ -93,6 +93,10 @@ const columns = computed(() => [
             </template>
         </QTable>
     </QPage>
+
+    <h5 class="flex justify-center color-vn-label" v-else>
+        {{ t('globals.noResults') }}
+    </h5>
 </template>
 
 <i18n>
diff --git a/src/router/modules/customer.js b/src/router/modules/customer.js
index 94e2d73ec..04e75b7ef 100644
--- a/src/router/modules/customer.js
+++ b/src/router/modules/customer.js
@@ -366,17 +366,6 @@ export default {
                         ],
                     },
                     children: [
-                        {
-                            path: 'credit-contracts',
-                            name: 'CustomerCreditContracts',
-                            meta: {
-                                title: 'creditContracts',
-                            },
-                            component: () =>
-                                import(
-                                    'src/pages/Customer/Card/CustomerCreditContracts.vue'
-                                ),
-                        },
                         {
                             path: 'credit-contracts',
                             name: 'CreditContractsCard',
@@ -439,7 +428,7 @@ export default {
                             {
                                 name: 'CustomerConsumption',
                                 title: 'consumption',
-                                icon: 'vn:lines',
+                                icon: 'show_chart',
                             },
                             {
                                 name: 'CustomerMandates',