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] 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 5d296881f..65c260a02 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 fe59bf2dc..4d0a0c838 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 0909758f3..95c3befe8 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 7247145f2..df5c7f6e2 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();