From b8a56391228a063af726c87c4313a28e1aab5909 Mon Sep 17 00:00:00 2001
From: carlosfonseca <carlos.fonseca@mindshore.io>
Date: Thu, 25 Jan 2024 17:29:24 -0500
Subject: [PATCH 1/3] Se crea tarjeta de historial

---
 src/pages/Customer/Card/CustomerBalance.vue   |   3 +-
 src/pages/Customer/Card/CustomerLog.vue       | 252 +++++++++++++++++-
 src/pages/Customer/Card/CustomerNotes.vue     |  34 +++
 .../Customer/Card/CustomerRecoveries.vue      |  33 +++
 4 files changed, 319 insertions(+), 3 deletions(-)

diff --git a/src/pages/Customer/Card/CustomerBalance.vue b/src/pages/Customer/Card/CustomerBalance.vue
index 5d296881fb..65c260a028 100644
--- a/src/pages/Customer/Card/CustomerBalance.vue
+++ b/src/pages/Customer/Card/CustomerBalance.vue
@@ -146,6 +146,7 @@ onBeforeMount(() => {
 });
 
 const getData = () => {
+    stateStore.rightDrawer = true;
     getReceipts();
     getClientRisks();
 };
@@ -158,7 +159,6 @@ const getReceipts = async () => {
     };
     const { data } = await axios.get('Receipts/filter', { params });
     rows.value = data;
-    stateStore.rightDrawer = true;
 };
 
 const getClientRisks = async () => {
@@ -170,7 +170,6 @@ const getClientRisks = async () => {
         params: { filter: JSON.stringify(filter) },
     });
     clientRisks.value = data;
-    console.log(clientRisks.value[0].amount);
 };
 
 const showNewPaymentDialog = () => {
diff --git a/src/pages/Customer/Card/CustomerLog.vue b/src/pages/Customer/Card/CustomerLog.vue
index fe59bf2dc4..4d0a0c8389 100644
--- a/src/pages/Customer/Card/CustomerLog.vue
+++ b/src/pages/Customer/Card/CustomerLog.vue
@@ -1,3 +1,253 @@
+<script setup>
+import { onBeforeMount, ref } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { useRoute } from 'vue-router';
+
+import axios from 'axios';
+
+import { useStateStore } from 'stores/useStateStore';
+
+import VnInput from 'src/components/common/VnInput.vue';
+import VnInputDate from 'src/components/common/VnInputDate.vue';
+import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
+
+const { t } = useI18n();
+const route = useRoute();
+const stateStore = useStateStore();
+
+const clientLogsModelsOptions = ref([]);
+const clientLogsOptions = ref([]);
+const clientLogsEditorsOptions = ref([]);
+const radioButtonValue = ref('all');
+const insert = ref(false);
+const update = ref(false);
+const deletes = ref(false);
+const select = ref(false);
+const inq = ref([]);
+
+const filterClientLogsEditors = {
+    fields: ['id', 'nickname', 'name', 'image'],
+    order: 'nickname',
+    limit: 30,
+};
+
+onBeforeMount(() => {
+    getData();
+});
+
+const getData = () => {
+    stateStore.rightDrawer = true;
+    getClientLogsModels();
+    getClientLogs();
+};
+
+const getClientLogsModels = async () => {
+    const filter = { order: ['changedModel'] };
+    const { data } = await axios.get(`ClientLogs/${route.params.id}/models`, {
+        params: { filter: JSON.stringify(filter) },
+    });
+    clientLogsModelsOptions.value = data;
+};
+
+const getClientLogs = async (value, status) => {
+    let neq = 'all';
+    if (status === 'neq') {
+        neq = value;
+    } else {
+        setInq(value, status);
+    }
+    const filter = {
+        fields: [
+            'id',
+            'originFk',
+            'userFk',
+            'action',
+            'changedModel',
+            'oldInstance',
+            'newInstance',
+            'creationDate',
+            'changedModel',
+            'changedModelId',
+            'changedModelValue',
+            'description',
+        ],
+        include: [
+            {
+                relation: 'user',
+                scope: {
+                    fields: ['nickname', 'name', 'image'],
+                    include: { relation: 'worker', scope: { fields: ['id'] } },
+                },
+            },
+        ],
+        order: ['creationDate DESC', 'id DESC'],
+        limit: 20,
+        where: {
+            and: [
+                { originFk: `${route.params.id}` },
+                { userFk: { neq } },
+                { action: { inq: inq.value } },
+            ],
+        },
+    };
+    const { data } = await axios.get('ClientLogs', {
+        params: { filter: JSON.stringify(filter) },
+    });
+    clientLogsOptions.value = data;
+};
+
+const setInq = (value, status) => {
+    if (status) {
+        if (!inq.value.includes(value)) {
+            inq.value.push(value);
+        }
+    } else {
+        inq.value = inq.value.filter((item) => item !== value);
+    }
+};
+</script>
+
 <template>
-    <div class="flex justify-center">Log</div>
+    <FetchData
+        :filter="filterClientLogsEditors"
+        @on-fetch="(data) => (clientLogsEditorsOptions = data)"
+        auto-load
+        :url="`ClientLogs/${route.params.id}/editors`"
+    />
+
+    <h5 class="flex justify-center label-color">
+        {{ t('globals.noResults') }}
+    </h5>
+
+    <QDrawer :width="256" show-if-above side="right" v-model="stateStore.rightDrawer">
+        <div class="q-mt-sm q-px-md">
+            <VnInput :label="t('Search')">
+                <template #append>
+                    <QIcon name="info" class="cursor-pointer">
+                        <QTooltip>
+                            {{ t('Search by id or concept') }}
+                        </QTooltip>
+                    </QIcon>
+                </template>
+            </VnInput>
+            <VnSelectFilter
+                :label="t('Entity')"
+                :options="companiesOptions"
+                class="q-mt-md"
+                hide-selected
+                option-label="name"
+                option-value="id"
+            />
+
+            <div class="q-mt-lg">
+                <QRadio
+                    :dark="true"
+                    :label="t('All')"
+                    @update:model-value="getClientLogs($event, 'neq')"
+                    dense
+                    v-model="radioButtonValue"
+                    val="all"
+                />
+            </div>
+            <div class="q-mt-md">
+                <QRadio
+                    :dark="true"
+                    :label="t('User')"
+                    @update:model-value="getClientLogs($event, 'neq')"
+                    dense
+                    v-model="radioButtonValue"
+                    val="user"
+                />
+            </div>
+            <div class="q-mt-md">
+                <QRadio
+                    :dark="true"
+                    :label="t('System')"
+                    @update:model-value="getClientLogs($event, 'neq')"
+                    dense
+                    v-model="radioButtonValue"
+                    val="system"
+                />
+            </div>
+
+            <VnSelectFilter
+                :label="t('User')"
+                :options="[]"
+                class="q-mt-sm"
+                hide-selected
+                option-label="name"
+                option-value="id"
+            />
+            <VnInput :label="t('Changes')" class="q-mt-sm">
+                <template #append>
+                    <QIcon name="info" class="cursor-pointer">
+                        <QTooltip>
+                            {{ t('Search by changes') }}
+                        </QTooltip>
+                    </QIcon>
+                </template>
+            </VnInput>
+
+            <div class="q-mt-md">
+                <QCheckbox
+                    :label="t('Creates')"
+                    @update:model-value="getClientLogs('insert', $event)"
+                    v-model="insert"
+                />
+            </div>
+            <div>
+                <QCheckbox
+                    :label="t('Edits')"
+                    @update:model-value="getClientLogs('update', $event)"
+                    v-model="update"
+                />
+            </div>
+            <div>
+                <QCheckbox
+                    :label="t('Deletes')"
+                    @update:model-value="getClientLogs('delete', $event)"
+                    v-model="deletes"
+                />
+            </div>
+            <div>
+                <QCheckbox
+                    :label="t('Accesses')"
+                    @update:model-value="getClientLogs('select', $event)"
+                    v-model="select"
+                />
+            </div>
+
+            <VnInputDate :label="t('Date')" class="q-mt-sm" />
+            <VnInput :label="t('To')" class="q-mt-md" />
+        </div>
+    </QDrawer>
+
+    <QPageSticky
+        :offset="[18, 18]"
+        v-if="radioButtonValue !== 'all' || insert || update || deletes || select"
+    >
+        <QBtn color="primary" fab icon="filter_alt_off" />
+        <QTooltip>
+            {{ t('Quit filter') }}
+        </QTooltip>
+    </QPageSticky>
 </template>
+
+<i18n>
+es:
+    Search: Buscar
+    Search by id or concept: xxx
+    Entity: Entidad
+    All: Todo
+    User: Usuario
+    System: Sistema
+    Changes: Cambios
+    Search by changes: xxx
+    Creates: Crea
+    Edits: Modifica
+    Deletes: Elimina
+    Accesses: Accede
+    Date: Fecha
+    To: Hasta
+    Quit filter: Quitar filtro
+</i18n>
diff --git a/src/pages/Customer/Card/CustomerNotes.vue b/src/pages/Customer/Card/CustomerNotes.vue
index 0909758f31..95c3befe87 100644
--- a/src/pages/Customer/Card/CustomerNotes.vue
+++ b/src/pages/Customer/Card/CustomerNotes.vue
@@ -6,6 +6,40 @@ import { date } from 'quasar';
 
 import VnPaginate from 'src/components/ui/VnPaginate.vue';
 
+const response = {
+    fields: [
+        'id',
+        'originFk',
+        'userFk',
+        'action',
+        'changedModel',
+        'oldInstance',
+        'newInstance',
+        'creationDate',
+        'changedModel',
+        'changedModelId',
+        'changedModelValue',
+        'description',
+    ],
+    include: [
+        {
+            relation: 'user',
+            scope: {
+                fields: ['nickname', 'name', 'image'],
+                include: { relation: 'worker', scope: { fields: ['id'] } },
+            },
+        },
+    ],
+    order: ['creationDate DESC', 'id DESC'],
+    limit: 20,
+    where: {
+        and: [
+            { originFk: '1' },
+            { userFk: { neq: null } },
+            { action: { inq: ['insert', 'update', 'delete', 'select'] } },
+        ],
+    },
+};
 const { t } = useI18n();
 const route = useRoute();
 const router = useRouter();
diff --git a/src/pages/Customer/Card/CustomerRecoveries.vue b/src/pages/Customer/Card/CustomerRecoveries.vue
index 7247145f2f..df5c7f6e27 100644
--- a/src/pages/Customer/Card/CustomerRecoveries.vue
+++ b/src/pages/Customer/Card/CustomerRecoveries.vue
@@ -11,6 +11,39 @@ import { toCurrency } from 'src/filters';
 
 import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
 
+const response = {
+    fields: [
+        'id',
+        'originFk',
+        'userFk',
+        'action',
+        'changedModel',
+        'oldInstance',
+        'newInstance',
+        'creationDate',
+        'changedModel',
+        'changedModelId',
+        'changedModelValue',
+        'description',
+    ],
+    include: [
+        {
+            relation: 'user',
+            scope: {
+                fields: ['nickname', 'name', 'image'],
+                include: { relation: 'worker', scope: { fields: ['id'] } },
+            },
+        },
+    ],
+    order: ['creationDate DESC', 'id DESC'],
+    limit: 20,
+    where: {
+        and: [
+            { originFk: '1' },
+            { action: { inq: ['insert', 'update', 'delete', 'select'] } },
+        ],
+    },
+};
 const { t } = useI18n();
 const route = useRoute();
 const router = useRouter();

From 41e5945021340a02f1dd45acd6b6c87f56d7e95f Mon Sep 17 00:00:00 2001
From: carlosfonseca <carlos.fonseca@mindshore.io>
Date: Fri, 26 Jan 2024 10:59:13 -0500
Subject: [PATCH 2/3] Correccion se elimina datos de prueba

---
 src/pages/Customer/Card/CustomerNotes.vue     | 34 -------------------
 .../Customer/Card/CustomerRecoveries.vue      | 33 ------------------
 2 files changed, 67 deletions(-)

diff --git a/src/pages/Customer/Card/CustomerNotes.vue b/src/pages/Customer/Card/CustomerNotes.vue
index 95c3befe87..0909758f31 100644
--- a/src/pages/Customer/Card/CustomerNotes.vue
+++ b/src/pages/Customer/Card/CustomerNotes.vue
@@ -6,40 +6,6 @@ import { date } from 'quasar';
 
 import VnPaginate from 'src/components/ui/VnPaginate.vue';
 
-const response = {
-    fields: [
-        'id',
-        'originFk',
-        'userFk',
-        'action',
-        'changedModel',
-        'oldInstance',
-        'newInstance',
-        'creationDate',
-        'changedModel',
-        'changedModelId',
-        'changedModelValue',
-        'description',
-    ],
-    include: [
-        {
-            relation: 'user',
-            scope: {
-                fields: ['nickname', 'name', 'image'],
-                include: { relation: 'worker', scope: { fields: ['id'] } },
-            },
-        },
-    ],
-    order: ['creationDate DESC', 'id DESC'],
-    limit: 20,
-    where: {
-        and: [
-            { originFk: '1' },
-            { userFk: { neq: null } },
-            { action: { inq: ['insert', 'update', 'delete', 'select'] } },
-        ],
-    },
-};
 const { t } = useI18n();
 const route = useRoute();
 const router = useRouter();
diff --git a/src/pages/Customer/Card/CustomerRecoveries.vue b/src/pages/Customer/Card/CustomerRecoveries.vue
index df5c7f6e27..7247145f2f 100644
--- a/src/pages/Customer/Card/CustomerRecoveries.vue
+++ b/src/pages/Customer/Card/CustomerRecoveries.vue
@@ -11,39 +11,6 @@ import { toCurrency } from 'src/filters';
 
 import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
 
-const response = {
-    fields: [
-        'id',
-        'originFk',
-        'userFk',
-        'action',
-        'changedModel',
-        'oldInstance',
-        'newInstance',
-        'creationDate',
-        'changedModel',
-        'changedModelId',
-        'changedModelValue',
-        'description',
-    ],
-    include: [
-        {
-            relation: 'user',
-            scope: {
-                fields: ['nickname', 'name', 'image'],
-                include: { relation: 'worker', scope: { fields: ['id'] } },
-            },
-        },
-    ],
-    order: ['creationDate DESC', 'id DESC'],
-    limit: 20,
-    where: {
-        and: [
-            { originFk: '1' },
-            { action: { inq: ['insert', 'update', 'delete', 'select'] } },
-        ],
-    },
-};
 const { t } = useI18n();
 const route = useRoute();
 const router = useRouter();

From 9fcbd5bc402e33a09a0fcee4ee3fd0f134a59cf9 Mon Sep 17 00:00:00 2001
From: carlosfonseca <carlos.fonseca@mindshore.io>
Date: Sat, 27 Jan 2024 18:53:35 -0500
Subject: [PATCH 3/3] Se modifica las peticiones en el componente

---
 src/pages/Customer/Card/CustomerLog.vue | 123 +++++++++++++-----------
 1 file changed, 66 insertions(+), 57 deletions(-)

diff --git a/src/pages/Customer/Card/CustomerLog.vue b/src/pages/Customer/Card/CustomerLog.vue
index 4d0a0c8389..36d79959d5 100644
--- a/src/pages/Customer/Card/CustomerLog.vue
+++ b/src/pages/Customer/Card/CustomerLog.vue
@@ -3,10 +3,9 @@ import { onBeforeMount, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRoute } from 'vue-router';
 
-import axios from 'axios';
-
 import { useStateStore } from 'stores/useStateStore';
 
+import FetchData from 'components/FetchData.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 import VnInputDate from 'src/components/common/VnInputDate.vue';
 import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
@@ -15,6 +14,9 @@ const { t } = useI18n();
 const route = useRoute();
 const stateStore = useStateStore();
 
+const clientLogs = ref(null);
+const urlClientLogsEditors = ref(null);
+const urlClientLogsModels = ref(null);
 const clientLogsModelsOptions = ref([]);
 const clientLogsOptions = ref([]);
 const clientLogsEditorsOptions = ref([]);
@@ -23,77 +25,71 @@ const insert = ref(false);
 const update = ref(false);
 const deletes = ref(false);
 const select = ref(false);
+const neq = ref(null);
 const inq = ref([]);
 
+const filterClientLogs = {
+    fields: [
+        'id',
+        'originFk',
+        'userFk',
+        'action',
+        'changedModel',
+        'oldInstance',
+        'newInstance',
+        'creationDate',
+        'changedModel',
+        'changedModelId',
+        'changedModelValue',
+        'description',
+    ],
+    include: [
+        {
+            relation: 'user',
+            scope: {
+                fields: ['nickname', 'name', 'image'],
+                include: { relation: 'worker', scope: { fields: ['id'] } },
+            },
+        },
+    ],
+    order: ['creationDate DESC', 'id DESC'],
+    limit: 20,
+};
 const filterClientLogsEditors = {
     fields: ['id', 'nickname', 'name', 'image'],
     order: 'nickname',
     limit: 30,
 };
+const filterClientLogsModels = { order: ['changedModel'] };
+const urlBase = `ClientLogs/${route.params.id}`;
 
 onBeforeMount(() => {
-    getData();
+    stateStore.rightDrawer = true;
+    filterClientLogs.where = {
+        and: [
+            { originFk: `${route.params.id}` },
+            { userFk: { neq: radioButtonValue.value } },
+            { action: { inq: inq.value } },
+        ],
+    };
+    urlClientLogsEditors.value = `${urlBase}/editors`;
+    urlClientLogsModels.value = `${urlBase}/models`;
 });
 
-const getData = () => {
-    stateStore.rightDrawer = true;
-    getClientLogsModels();
-    getClientLogs();
-};
-
-const getClientLogsModels = async () => {
-    const filter = { order: ['changedModel'] };
-    const { data } = await axios.get(`ClientLogs/${route.params.id}/models`, {
-        params: { filter: JSON.stringify(filter) },
-    });
-    clientLogsModelsOptions.value = data;
-};
-
 const getClientLogs = async (value, status) => {
-    let neq = 'all';
     if (status === 'neq') {
-        neq = value;
+        neq.value = value;
     } else {
         setInq(value, status);
     }
-    const filter = {
-        fields: [
-            'id',
-            'originFk',
-            'userFk',
-            'action',
-            'changedModel',
-            'oldInstance',
-            'newInstance',
-            'creationDate',
-            'changedModel',
-            'changedModelId',
-            'changedModelValue',
-            'description',
+    filterClientLogs.where = {
+        and: [
+            { originFk: `${route.params.id}` },
+            { userFk: { neq: neq.value } },
+            { action: { inq: inq.value } },
         ],
-        include: [
-            {
-                relation: 'user',
-                scope: {
-                    fields: ['nickname', 'name', 'image'],
-                    include: { relation: 'worker', scope: { fields: ['id'] } },
-                },
-            },
-        ],
-        order: ['creationDate DESC', 'id DESC'],
-        limit: 20,
-        where: {
-            and: [
-                { originFk: `${route.params.id}` },
-                { userFk: { neq } },
-                { action: { inq: inq.value } },
-            ],
-        },
     };
-    const { data } = await axios.get('ClientLogs', {
-        params: { filter: JSON.stringify(filter) },
-    });
-    clientLogsOptions.value = data;
+    clientLogs.value?.fetch();
 };
 
 const setInq = (value, status) => {
@@ -108,11 +104,24 @@ const setInq = (value, status) => {
 </script>
 
 <template>
+    <FetchData
+        :filter="filterClientLogs"
+        @on-fetch="(data) => (clientLogsOptions = data)"
+        auto-load
+        url="ClientLogs"
+        ref="clientLogs"
+    />
     <FetchData
         :filter="filterClientLogsEditors"
         @on-fetch="(data) => (clientLogsEditorsOptions = data)"
         auto-load
-        :url="`ClientLogs/${route.params.id}/editors`"
+        :url="urlClientLogsEditors"
+    />
+    <FetchData
+        :filter="filterClientLogsModels"
+        @on-fetch="(data) => (clientLogsModelsOptions = data)"
+        auto-load
+        :url="urlClientLogsModels"
     />
 
     <h5 class="flex justify-center label-color">
@@ -132,7 +141,7 @@ const setInq = (value, status) => {
             </VnInput>
             <VnSelectFilter
                 :label="t('Entity')"
-                :options="companiesOptions"
+                :options="[]"
                 class="q-mt-md"
                 hide-selected
                 option-label="name"