From aa2db28edab94ee3f0da0771c3e71337697399d6 Mon Sep 17 00:00:00 2001
From: carlosfonseca <carlos.fonseca@mindshore.io>
Date: Fri, 22 Mar 2024 08:30:54 -0500
Subject: [PATCH 1/8] Se crea submodulo mis documentos en worker

---
 src/css/app.scss                              |   5 +
 src/i18n/en/index.js                          |   5 +-
 src/i18n/es/index.js                          |   5 +-
 src/pages/Worker/Card/WorkerDms.vue           | 164 +++++++++++
 .../Worker/components/WorkerDmsActions.vue    |  96 +++++++
 .../Worker/components/WorkerDmsCreate.vue     | 262 ++++++++++++++++++
 .../Worker/components/WorkerDmsDelete.vue     |  82 ++++++
 src/pages/Worker/components/WorkerDmsEdit.vue | 246 ++++++++++++++++
 src/router/modules/worker.js                  |  31 ++-
 9 files changed, 891 insertions(+), 5 deletions(-)
 create mode 100644 src/pages/Worker/Card/WorkerDms.vue
 create mode 100644 src/pages/Worker/components/WorkerDmsActions.vue
 create mode 100644 src/pages/Worker/components/WorkerDmsCreate.vue
 create mode 100644 src/pages/Worker/components/WorkerDmsDelete.vue
 create mode 100644 src/pages/Worker/components/WorkerDmsEdit.vue

diff --git a/src/css/app.scss b/src/css/app.scss
index 3baa60c9b..c52cdb5d2 100644
--- a/src/css/app.scss
+++ b/src/css/app.scss
@@ -85,6 +85,11 @@ select:-webkit-autofill {
     color: $white;
 }
 
+.card-width {
+    max-width: 800px;
+    width: 100%;
+}
+
 .vn-card {
     background-color: var(--vn-section-color);
     color: var(--vn-text-color);
diff --git a/src/i18n/en/index.js b/src/i18n/en/index.js
index 80744b83d..197e94582 100644
--- a/src/i18n/en/index.js
+++ b/src/i18n/en/index.js
@@ -837,6 +837,7 @@ export default {
             workerCreate: 'New worker',
             department: 'Department',
             pda: 'PDA',
+            dms: 'My documentation',
         },
         list: {
             name: 'Name',
@@ -955,7 +956,7 @@ export default {
             roadmap: 'Roadmap',
             summary: 'Summary',
             basicData: 'Basic Data',
-            stops: 'Stops'
+            stops: 'Stops',
         },
     },
     roadmap: {
@@ -963,7 +964,7 @@ export default {
             roadmap: 'Roadmap',
             summary: 'Summary',
             basicData: 'Basic Data',
-            stops: 'Stops'
+            stops: 'Stops',
         },
     },
     route: {
diff --git a/src/i18n/es/index.js b/src/i18n/es/index.js
index 37ba8da85..61896a283 100644
--- a/src/i18n/es/index.js
+++ b/src/i18n/es/index.js
@@ -837,6 +837,7 @@ export default {
             workerCreate: 'Nuevo trabajador',
             department: 'Departamentos',
             pda: 'PDA',
+            dms: 'Mi documentación',
         },
         list: {
             name: 'Nombre',
@@ -955,7 +956,7 @@ export default {
             roadmap: 'Troncales',
             summary: 'Resumen',
             basicData: 'Datos básicos',
-            stops: 'Paradas'
+            stops: 'Paradas',
         },
     },
     roadmap: {
@@ -963,7 +964,7 @@ export default {
             roadmap: 'Troncales',
             summary: 'Resumen',
             basicData: 'Datos básicos',
-            stops: 'Paradas'
+            stops: 'Paradas',
         },
     },
     route: {
diff --git a/src/pages/Worker/Card/WorkerDms.vue b/src/pages/Worker/Card/WorkerDms.vue
new file mode 100644
index 000000000..144e3edee
--- /dev/null
+++ b/src/pages/Worker/Card/WorkerDms.vue
@@ -0,0 +1,164 @@
+<script setup>
+import { computed, ref, watch } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { useRoute, useRouter } from 'vue-router';
+
+import { downloadFile } from 'src/composables/downloadFile';
+import { toDateHour } from 'src/filters';
+
+import FetchData from 'components/FetchData.vue';
+import WorkerDmsActions from '../components/WorkerDmsActions.vue';
+
+const { t } = useI18n();
+const route = useRoute();
+const router = useRouter();
+
+const workerDmsRef = ref(null);
+const rows = ref([]);
+
+const filter = { where: { worker: route.params.id }, order: ['dmsFk DESC'], limit: 20 };
+
+const columns = computed(() => [
+    {
+        align: 'left',
+        field: 'dmsFk',
+        label: t('Id'),
+        name: 'id',
+    },
+    {
+        align: 'left',
+        field: 'hardCopyNumber',
+        label: t('Order'),
+        name: 'order',
+    },
+    {
+        align: 'left',
+        field: 'reference',
+        label: t('Reference'),
+        name: 'reference',
+    },
+    {
+        align: 'left',
+        field: 'description',
+        label: t('Description'),
+        name: 'description',
+    },
+    {
+        align: 'left',
+        field: 'hasFile',
+        label: t('Original'),
+        name: 'original',
+    },
+    {
+        align: 'left',
+        field: 'file',
+        label: t('File'),
+        name: 'file',
+    },
+    {
+        align: 'left',
+        field: 'created',
+        label: t('Created'),
+        name: 'created',
+        format: (value) => toDateHour(value),
+    },
+    {
+        align: 'right',
+        field: 'actions',
+        label: '',
+        name: 'actions',
+    },
+]);
+
+watch(
+    () => route.params.id,
+    (newValue) => {
+        filter.where.worker = newValue;
+        setData();
+    }
+);
+
+const setData = () => {
+    workerDmsRef.value.fetch();
+};
+
+const toWorkerDmsCreate = () => {
+    router.push({ name: 'WorkerDmsCreate' });
+};
+</script>
+
+<template>
+    <FetchData
+        ref="workerDmsRef"
+        :filter="filter"
+        @on-fetch="(data) => (rows = data)"
+        auto-load
+        :url="`WorkerDms/${route.params.id}/filter`"
+    />
+
+    <QPage class="column items-center q-pa-md">
+        <QTable
+            :columns="columns"
+            :pagination="{ rowsPerPage: 12 }"
+            :rows="rows"
+            class="full-width q-mt-md"
+            row-key="id"
+            v-if="rows?.length"
+        >
+            <template #body-cell-order="{ row }">
+                <QTd>
+                    <QChip class="chip-color" square>{{ row.hardCopyNumber }}</QChip>
+                </QTd>
+            </template>
+
+            <template #body-cell-original="{ row }">
+                <QTd>
+                    <QCheckbox :model-value="row.hasFile === 1" disable />
+                </QTd>
+            </template>
+
+            <template #body-cell-file="{ row }">
+                <QTd>
+                    <QBtn @click.stop="downloadFile(row.dmsFk)" color="blue" flat no-caps>
+                        {{ row.file }}
+                    </QBtn>
+                </QTd>
+            </template>
+
+            <template #body-cell-actions="{ row }">
+                <QTd>
+                    <WorkerDmsActions :id="row.dmsFk" :promise="setData" />
+                </QTd>
+            </template>
+        </QTable>
+
+        <h5 class="flex justify-center color-vn-label" v-else>
+            {{ t('globals.noResults') }}
+        </h5>
+    </QPage>
+
+    <QPageSticky :offset="[18, 18]">
+        <QBtn @click.stop="toWorkerDmsCreate()" color="primary" fab icon="add" />
+        <QTooltip>
+            {{ t('Upload file') }}
+        </QTooltip>
+    </QPageSticky>
+</template>
+
+<style scoped>
+.chip-color {
+    background-color: var(--vn-label);
+}
+</style>
+
+<i18n>
+es:
+    Id: Id
+    Order: Orden
+    Reference: Referencia
+    Description: Descripción
+    File: Archivo
+    Original: Original
+    Created: Fecha creación
+    Upload file: Subir fichero
+</i18n>
diff --git a/src/pages/Worker/components/WorkerDmsActions.vue b/src/pages/Worker/components/WorkerDmsActions.vue
new file mode 100644
index 000000000..9a8e4816e
--- /dev/null
+++ b/src/pages/Worker/components/WorkerDmsActions.vue
@@ -0,0 +1,96 @@
+<script setup>
+import { useI18n } from 'vue-i18n';
+import { useRoute, useRouter } from 'vue-router';
+
+import { useQuasar } from 'quasar';
+
+import { downloadFile } from 'src/composables/downloadFile';
+
+import WorkerDmsDelete from 'src/pages/Worker/components/WorkerDmsDelete.vue';
+
+const { t } = useI18n();
+const quasar = useQuasar();
+const route = useRoute();
+const router = useRouter();
+
+const $props = defineProps({
+    id: {
+        type: Number,
+        required: true,
+    },
+    promise: {
+        type: Function,
+        required: true,
+    },
+});
+
+const setDownloadFile = () => downloadFile($props.id);
+
+const toWorkerDmsEdit = () => {
+    router.push({
+        name: 'WorkerDmsEdit',
+        params: {
+            id: route.params.id,
+            dmsId: $props.id,
+        },
+    });
+};
+
+const showWorkerDmsDeleteDialog = () => {
+    quasar.dialog({
+        component: WorkerDmsDelete,
+        componentProps: {
+            id: $props.id,
+            promise: setData,
+        },
+    });
+};
+
+const setData = () => {
+    $props.promise();
+};
+</script>
+
+<template>
+    <div>
+        <QIcon
+            @click.stop="setDownloadFile"
+            color="primary"
+            name="cloud_download"
+            size="sm"
+        >
+            <QTooltip>
+                {{ t('actionFile', { action: t('globals.download') }) }}
+            </QTooltip>
+        </QIcon>
+        <QIcon
+            @click.stop="toWorkerDmsEdit"
+            class="q-ml-md"
+            color="primary"
+            name="edit"
+            size="sm"
+        >
+            <QTooltip>
+                {{ t('actionFile', { action: t('globals.edit') }) }}
+            </QTooltip>
+        </QIcon>
+        <QIcon
+            @click.stop="showWorkerDmsDeleteDialog"
+            class="q-ml-md"
+            color="primary"
+            name="delete"
+            size="sm"
+        >
+            <QTooltip>
+                {{ t('actionFile', { action: t('globals.remove') }) }}
+            </QTooltip>
+        </QIcon>
+    </div>
+</template>
+
+<i18n>
+en:
+    actionFile: '{action} file'
+es:
+    actionFile: '{action} fichero'
+</i18n>
diff --git a/src/pages/Worker/components/WorkerDmsCreate.vue b/src/pages/Worker/components/WorkerDmsCreate.vue
new file mode 100644
index 000000000..d38e044ca
--- /dev/null
+++ b/src/pages/Worker/components/WorkerDmsCreate.vue
@@ -0,0 +1,262 @@
+<script setup>
+import { onBeforeMount, ref, watch } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { useRoute, useRouter } from 'vue-router';
+
+import axios from 'axios';
+
+import { useState } from 'src/composables/useState';
+import { useValidator } from 'src/composables/useValidator';
+import useNotify from 'src/composables/useNotify';
+
+import FetchData from 'components/FetchData.vue';
+import VnRow from 'components/ui/VnRow.vue';
+import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
+import VnInput from 'src/components/common/VnInput.vue';
+
+const { notify } = useNotify();
+const { t } = useI18n();
+const { validate } = useValidator();
+const route = useRoute();
+const router = useRouter();
+const state = useState();
+const user = state.getUser();
+
+const filterFindOne = { where: { code: 'paymentsLaw' } };
+const filterCompanies = { order: ['code'] };
+const filterWarehouses = { order: ['name'] };
+
+const inputFileRef = ref();
+const client = ref({});
+const findOne = ref([]);
+const allowedContentTypes = ref([]);
+const optionsCompanies = ref([]);
+const optionsWarehouses = ref([]);
+const optionsDmsTypes = ref([]);
+const isLoading = ref(false);
+const dms = ref({
+    hasFile: false,
+});
+
+onBeforeMount(() => {
+    const { companyFk, warehouseFk } = user.value;
+    dms.value.reference = route.params.id;
+    dms.value.companyId = companyFk;
+    dms.value.warehouseId = warehouseFk;
+});
+
+watch([client, findOne], ([newClient, newFindOne]) => {
+    dms.value.description = t('clientFileDescription', {
+        dmsTypeName: newFindOne.name?.toUpperCase(),
+        clientName: newClient.name?.toUpperCase(),
+        clientId: newClient.id,
+    });
+    dms.value.dmsTypeId = newFindOne.id;
+});
+
+const saveData = async () => {
+    try {
+        const formData = new FormData();
+        const files = dms.value.files;
+
+        if (files && files.length > 0) {
+            for (let file of files) {
+                formData.append(file.name, file);
+            }
+            dms.value.hasFileAttached = true;
+
+            const url = `Workers/${route.params.id}/uploadFile`;
+            await axios.post(url, formData, {
+                params: dms.value,
+            });
+            notify('globals.dataSaved', 'positive');
+            toWorkerDms();
+        }
+    } catch (error) {
+        notify(error.message, 'negative');
+    }
+};
+
+const toWorkerDms = () => {
+    router.push({ name: 'WorkerDms' });
+};
+</script>
+
+<template>
+    <fetch-data
+        @on-fetch="(data) => (client = data)"
+        auto-load
+        :url="`Clients/${route.params.id}/getCard`"
+    />
+    <fetch-data
+        :filter="filterFindOne"
+        @on-fetch="(data) => (findOne = data)"
+        auto-load
+        url="DmsTypes/findOne"
+    />
+    <fetch-data
+        @on-fetch="(data) => (allowedContentTypes = data)"
+        auto-load
+        url="DmsContainers/allowedContentTypes"
+    />
+    <fetch-data
+        :filter="filterCompanies"
+        @on-fetch="(data) => (optionsCompanies = data)"
+        auto-load
+        url="Companies"
+    />
+    <fetch-data
+        :filter="filterWarehouses"
+        @on-fetch="(data) => (optionsWarehouses = data)"
+        auto-load
+        url="Warehouses"
+    />
+    <fetch-data
+        :filter="filterWarehouses"
+        @on-fetch="(data) => (optionsDmsTypes = data)"
+        auto-load
+        url="DmsTypes"
+    />
+
+    <Teleport to="#st-actions">
+        <QBtnGroup push class="q-gutter-x-sm">
+            <QBtn
+                :disabled="isLoading"
+                :label="t('globals.cancel')"
+                :loading="isLoading"
+                @click="toWorkerDms"
+                color="primary"
+                flat
+                icon="close"
+            />
+            <QBtn
+                :disabled="isLoading"
+                :label="t('globals.save')"
+                :loading="isLoading"
+                @click.stop="saveData"
+                color="primary"
+                icon="save"
+            />
+        </QBtnGroup>
+    </Teleport>
+
+    <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">
+                            <VnInput
+                                :label="t('Reference')"
+                                clearable
+                                v-model="dms.reference"
+                            />
+                        </div>
+                        <div class="col">
+                            <VnSelectFilter
+                                :label="t('Company')"
+                                :options="optionsCompanies"
+                                :rules="validate('entry.companyFk')"
+                                option-label="code"
+                                option-value="id"
+                                v-model="dms.companyId"
+                            />
+                        </div>
+                    </VnRow>
+
+                    <VnRow class="row q-gutter-md q-mb-md">
+                        <div class="col">
+                            <VnSelectFilter
+                                :label="t('Warehouse')"
+                                :options="optionsWarehouses"
+                                option-label="name"
+                                option-value="id"
+                                v-model="dms.warehouseId"
+                            />
+                        </div>
+                        <div class="col">
+                            <VnSelectFilter
+                                :label="t('Type')"
+                                :options="optionsDmsTypes"
+                                option-label="name"
+                                option-value="id"
+                                v-model="dms.dmsTypeId"
+                            />
+                        </div>
+                    </VnRow>
+
+                    <VnRow class="row q-gutter-md q-mb-md">
+                        <div class="col">
+                            <VnInput
+                                :label="t('Description')"
+                                :rules="validate('route.description')"
+                                clearable
+                                type="textarea"
+                                v-model="dms.description"
+                            />
+                        </div>
+                    </VnRow>
+
+                    <VnRow class="row q-gutter-md q-mb-md">
+                        <div class="col">
+                            <QFile
+                                ref="inputFileRef"
+                                class="required"
+                                :label="t('File')"
+                                v-model="dms.files"
+                                multiple
+                                :accept="allowedContentTypes.join(',')"
+                                clearable
+                                clear-icon="close"
+                            >
+                                <template #append>
+                                    <QBtn
+                                        icon="vn:attach"
+                                        flat
+                                        round
+                                        padding="xs"
+                                        @click="inputFileRef.pickFiles()"
+                                    >
+                                        <QTooltip>
+                                            {{ t('Select a file') }}
+                                        </QTooltip>
+                                    </QBtn>
+                                    <QBtn icon="info" flat round padding="xs">
+                                        <QTooltip max-width="30rem">
+                                            {{
+                                                `${t(
+                                                    'Allowed content types'
+                                                )}: ${allowedContentTypes.join(', ')}`
+                                            }}
+                                        </QTooltip>
+                                    </QBtn>
+                                </template>
+                            </QFile>
+                        </div>
+                    </VnRow>
+
+                    <QCheckbox
+                        :label="t('Generate identifier for original file')"
+                        v-model="dms.hasFile"
+                    />
+                </QForm>
+            </QCardSection>
+        </QCard>
+    </div>
+</template>
+
+<i18n>
+en:
+    clientFileDescription: '{dmsTypeName} FROM CLIENT {clientName} ID {clientId}'
+es:
+    Reference: Referencia
+    Company: Empresa
+    Warehouse: Almacén
+    Type: Tipo
+    Description: Descripción
+    clientFileDescription: '{dmsTypeName} DEL CLIENTE {clientName} ID {clientId}'
+    File: Fichero
+    Select a file: Selecciona un fichero
+    Allowed content types: Tipos de archivo permitidos
+    Generate identifier for original file: Generar identificador para archivo original
+</i18n>
diff --git a/src/pages/Worker/components/WorkerDmsDelete.vue b/src/pages/Worker/components/WorkerDmsDelete.vue
new file mode 100644
index 000000000..5e1b98b24
--- /dev/null
+++ b/src/pages/Worker/components/WorkerDmsDelete.vue
@@ -0,0 +1,82 @@
+<script setup>
+import { ref } from 'vue';
+import { useI18n } from 'vue-i18n';
+
+import { useDialogPluginComponent } from 'quasar';
+import axios from 'axios';
+
+import useNotify from 'src/composables/useNotify';
+
+const $props = defineProps({
+    id: {
+        type: Number,
+        required: true,
+    },
+    promise: {
+        type: Function,
+        required: true,
+    },
+});
+
+const { dialogRef } = useDialogPluginComponent();
+const { notify } = useNotify();
+const { t } = useI18n();
+
+const closeButton = ref(null);
+
+const isLoading = ref(false);
+
+const deleteDms = async () => {
+    isLoading.value = true;
+    try {
+        await axios.post(`WorkerDms/${$props.id}/removeFile`);
+        if ($props.promise) await $props.promise();
+        notify('globals.dataDeleted', 'positive');
+    } catch (error) {
+        notify(error.message, 'negative');
+    } finally {
+        closeButton.value.click();
+        isLoading.value = false;
+    }
+};
+</script>
+
+<template>
+    <QDialog ref="dialogRef">
+        <QCard class="q-pa-md q-mb-md">
+            <span ref="closeButton" class="row justify-end close-icon" v-close-popup>
+                <QIcon name="close" size="sm" />
+            </span>
+
+            <QCardSection>
+                <div class="mt-1 text-h6">{{ t('This file will be deleted') }}</div>
+                <div>{{ t('Are you sure you want to continue?') }}</div>
+            </QCardSection>
+
+            <QCardActions class="flex justify-end">
+                <QBtn
+                    :disabled="isLoading"
+                    :label="t('globals.cancel')"
+                    :loading="isLoading"
+                    class="q-mr-xl"
+                    color="primary"
+                    flat
+                    v-close-popup
+                />
+                <QBtn
+                    :disabled="isLoading"
+                    :label="t('globals.save')"
+                    :loading="isLoading"
+                    @click.stop="deleteDms"
+                    color="primary"
+                />
+            </QCardActions>
+        </QCard>
+    </QDialog>
+</template>
+
+<i18n>
+es:
+    This file will be deleted: Este fichero va a ser borrado
+    Are you sure you want to continue?: ¿Seguro que quieres continuar?
+</i18n>
diff --git a/src/pages/Worker/components/WorkerDmsEdit.vue b/src/pages/Worker/components/WorkerDmsEdit.vue
new file mode 100644
index 000000000..8e84c6326
--- /dev/null
+++ b/src/pages/Worker/components/WorkerDmsEdit.vue
@@ -0,0 +1,246 @@
+<script setup>
+import { ref } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { useRoute, useRouter } from 'vue-router';
+
+import axios from 'axios';
+
+import { useValidator } from 'src/composables/useValidator';
+import useNotify from 'src/composables/useNotify';
+
+import FetchData from 'components/FetchData.vue';
+import VnRow from 'components/ui/VnRow.vue';
+import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
+import VnInput from 'src/components/common/VnInput.vue';
+
+const { notify } = useNotify();
+const { t } = useI18n();
+const { validate } = useValidator();
+const route = useRoute();
+const router = useRouter();
+
+const filterCompanies = { order: ['code'] };
+const filterWarehouses = { order: ['name'] };
+
+const inputFileRef = ref();
+const allowedContentTypes = ref([]);
+const optionsCompanies = ref([]);
+const optionsWarehouses = ref([]);
+const optionsDmsTypes = ref([]);
+const isLoading = ref(false);
+const dms = ref({
+    hasFile: true,
+});
+
+const setCurrentDms = (data) => {
+    dms.value.reference = data.reference;
+    dms.value.companyId = data.companyFk;
+    dms.value.warehouseId = data.warehouseFk;
+    dms.value.dmsTypeId = data.dmsTypeFk;
+    dms.value.description = data.description;
+    dms.value.hasFile = data.hasFile;
+};
+
+const saveData = async () => {
+    try {
+        const formData = new FormData();
+        console.log(formData);
+        const files = dms.value.files;
+        console.log(files);
+
+        dms.value.hasFileAttached = files ? true : false;
+        const url = `dms/${route.params.dmsId}/updateFile`;
+
+        if (files && files.length > 0) {
+            for (let file of files) {
+                formData.append(file.name, file);
+            }
+
+            await axios.post(url, formData, {
+                params: dms.value,
+            });
+            notify('globals.dataSaved', 'positive');
+        } else {
+            await axios.post(url, dms.value);
+        }
+
+        toWorkerDms();
+    } catch (error) {
+        notify(error.message, 'negative');
+    }
+};
+
+const toWorkerDms = () => {
+    router.push({ name: 'WorkerDms' });
+};
+</script>
+
+<template>
+    <fetch-data :url="`Dms/${route.params.dmsId}`" @on-fetch="setCurrentDms" auto-load />
+    <fetch-data
+        @on-fetch="(data) => (allowedContentTypes = data)"
+        auto-load
+        url="DmsContainers/allowedContentTypes"
+    />
+    <fetch-data
+        :filter="filterCompanies"
+        @on-fetch="(data) => (optionsCompanies = data)"
+        auto-load
+        url="Companies"
+    />
+    <fetch-data
+        :filter="filterWarehouses"
+        @on-fetch="(data) => (optionsWarehouses = data)"
+        auto-load
+        url="Warehouses"
+    />
+    <fetch-data
+        :filter="filterWarehouses"
+        @on-fetch="(data) => (optionsDmsTypes = data)"
+        auto-load
+        url="DmsTypes"
+    />
+
+    <Teleport to="#st-actions">
+        <QBtnGroup push class="q-gutter-x-sm">
+            <QBtn
+                :disabled="isLoading"
+                :label="t('globals.cancel')"
+                :loading="isLoading"
+                @click="toWorkerDms"
+                color="primary"
+                flat
+                icon="close"
+            />
+            <QBtn
+                :disabled="isLoading"
+                :label="t('globals.save')"
+                :loading="isLoading"
+                @click.stop="saveData"
+                color="primary"
+                icon="save"
+            />
+        </QBtnGroup>
+    </Teleport>
+
+    <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">
+                            <VnInput
+                                :label="t('Reference')"
+                                clearable
+                                v-model="dms.reference"
+                            />
+                        </div>
+                        <div class="col">
+                            <VnSelectFilter
+                                :label="t('Company')"
+                                :options="optionsCompanies"
+                                :rules="validate('entry.companyFk')"
+                                option-label="code"
+                                option-value="id"
+                                v-model="dms.companyId"
+                            />
+                        </div>
+                    </VnRow>
+
+                    <VnRow class="row q-gutter-md q-mb-md">
+                        <div class="col">
+                            <VnSelectFilter
+                                :label="t('Warehouse')"
+                                :options="optionsWarehouses"
+                                option-label="name"
+                                option-value="id"
+                                v-model="dms.warehouseId"
+                            />
+                        </div>
+                        <div class="col">
+                            <VnSelectFilter
+                                :label="t('Type')"
+                                :options="optionsDmsTypes"
+                                option-label="name"
+                                option-value="id"
+                                v-model="dms.dmsTypeId"
+                            />
+                        </div>
+                    </VnRow>
+
+                    <VnRow class="row q-gutter-md q-mb-md">
+                        <div class="col">
+                            <VnInput
+                                :label="t('Description')"
+                                :rules="validate('route.description')"
+                                clearable
+                                type="textarea"
+                                v-model="dms.description"
+                            />
+                        </div>
+                    </VnRow>
+
+                    <VnRow class="row q-gutter-md q-mb-md">
+                        <div class="col">
+                            <QFile
+                                ref="inputFileRef"
+                                class="required"
+                                :label="t('File')"
+                                v-model="dms.files"
+                                multiple
+                                :accept="allowedContentTypes.join(',')"
+                                clearable
+                                clear-icon="close"
+                            >
+                                <template #append>
+                                    <QBtn
+                                        icon="vn:attach"
+                                        flat
+                                        round
+                                        padding="xs"
+                                        @click="inputFileRef.pickFiles()"
+                                    >
+                                        <QTooltip>
+                                            {{ t('Select a file') }}
+                                        </QTooltip>
+                                    </QBtn>
+                                    <QBtn icon="info" flat round padding="xs">
+                                        <QTooltip max-width="30rem">
+                                            {{
+                                                `${t(
+                                                    'Allowed content types'
+                                                )}: ${allowedContentTypes.join(', ')}`
+                                            }}
+                                        </QTooltip>
+                                    </QBtn>
+                                </template>
+                            </QFile>
+                        </div>
+                    </VnRow>
+
+                    <QCheckbox
+                        :label="t('Generate identifier for original file')"
+                        v-model="dms.hasFile"
+                        disable
+                    />
+                </QForm>
+            </QCardSection>
+        </QCard>
+    </div>
+</template>
+
+<i18n>
+en:
+    clientFileDescription: '{dmsTypeName} FROM CLIENT {clientName} ID {clientId}'
+es:
+    Reference: Referencia
+    Company: Empresa
+    Warehouse: Almacén
+    Type: Tipo
+    Description: Descripción
+    clientFileDescription: '{dmsTypeName} DEL CLIENTE {clientName} ID {clientId}'
+    File: Fichero
+    Select a file: Selecciona un fichero
+    Allowed content types: Tipos de archivo permitidos
+    Generate identifier for original file: Generar identificador para archivo original
+</i18n>
diff --git a/src/router/modules/worker.js b/src/router/modules/worker.js
index 1c722afe8..a3b2d52dc 100644
--- a/src/router/modules/worker.js
+++ b/src/router/modules/worker.js
@@ -12,7 +12,7 @@ export default {
     redirect: { name: 'WorkerMain' },
     menus: {
         main: ['WorkerList', 'WorkerDepartment'],
-        card: ['WorkerNotificationsManager', 'WorkerPda'],
+        card: ['WorkerNotificationsManager', 'WorkerPda', 'WorkerDms'],
         departmentCard: ['BasicData'],
     },
     children: [
@@ -85,6 +85,35 @@ export default {
                     },
                     component: () => import('src/pages/Worker/Card/WorkerPda.vue'),
                 },
+                {
+                    path: 'dms',
+                    name: 'DmsCard',
+                    redirect: { name: 'WorkerDms' },
+                    children: [
+                        {
+                            path: '',
+                            name: 'WorkerDms',
+                            meta: {
+                                title: 'dms',
+                                icon: 'cloud_upload',
+                            },
+                            component: () =>
+                                import('src/pages/Worker/Card/WorkerDms.vue'),
+                        },
+                        {
+                            path: 'create',
+                            name: 'WorkerDmsCreate',
+                            component: () =>
+                                import('src/pages/Worker/components/WorkerDmsCreate.vue'),
+                        },
+                        {
+                            path: ':dmsId/edit',
+                            name: 'WorkerDmsEdit',
+                            component: () =>
+                                import('src/pages/Worker/components/WorkerDmsEdit.vue'),
+                        },
+                    ],
+                },
             ],
         },
     ],

From 627d3bbe85a38232de80a5d92bb67aee98a38291 Mon Sep 17 00:00:00 2001
From: carlosfonseca <carlos.fonseca@mindshore.io>
Date: Mon, 25 Mar 2024 16:00:47 -0500
Subject: [PATCH 2/8] Se implementan las correcciones a los comentarios

---
 src/pages/Worker/Card/WorkerDms.vue           |  36 ++-
 .../Worker/components/WorkerDmsActions.vue    |  16 +-
 .../Worker/components/WorkerDmsCreate.vue     | 277 ++----------------
 src/pages/Worker/components/WorkerDmsEdit.vue | 262 +++--------------
 src/router/modules/worker.js                  |  32 +-
 5 files changed, 103 insertions(+), 520 deletions(-)

diff --git a/src/pages/Worker/Card/WorkerDms.vue b/src/pages/Worker/Card/WorkerDms.vue
index 144e3edee..f794f6b17 100644
--- a/src/pages/Worker/Card/WorkerDms.vue
+++ b/src/pages/Worker/Card/WorkerDms.vue
@@ -1,22 +1,27 @@
 <script setup>
 import { computed, ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { useRoute, useRouter } from 'vue-router';
+import { useRoute } from 'vue-router';
+
+import { useQuasar } from 'quasar';
 
 import { downloadFile } from 'src/composables/downloadFile';
 import { toDateHour } from 'src/filters';
 
 import FetchData from 'components/FetchData.vue';
+import WorkerDmsCreate from '../components/WorkerDmsCreate.vue';
 import WorkerDmsActions from '../components/WorkerDmsActions.vue';
 
 const { t } = useI18n();
+const quasar = useQuasar();
 const route = useRoute();
-const router = useRouter();
 
-const workerDmsRef = ref(null);
+const findOne = ref([]);
 const rows = ref([]);
+const workerDmsRef = ref(null);
 
 const filter = { where: { worker: route.params.id }, order: ['dmsFk DESC'], limit: 20 };
+const filterFindOne = { where: { code: 'hhrrData' } };
 
 const columns = computed(() => [
     {
@@ -82,8 +87,15 @@ const setData = () => {
     workerDmsRef.value.fetch();
 };
 
-const toWorkerDmsCreate = () => {
-    router.push({ name: 'WorkerDmsCreate' });
+const showWorkerDmsCreate = () => {
+    quasar.dialog({
+        component: WorkerDmsCreate,
+        componentProps: {
+            id: Number(route.params.id),
+            defaultDmsCode: findOne.value.code,
+            promise: setData,
+        },
+    });
 };
 </script>
 
@@ -95,6 +107,12 @@ const toWorkerDmsCreate = () => {
         auto-load
         :url="`WorkerDms/${route.params.id}/filter`"
     />
+    <fetch-data
+        :filter="filterFindOne"
+        @on-fetch="(data) => (findOne = data)"
+        auto-load
+        url="DmsTypes/findOne"
+    />
 
     <QPage class="column items-center q-pa-md">
         <QTable
@@ -107,7 +125,9 @@ const toWorkerDmsCreate = () => {
         >
             <template #body-cell-order="{ row }">
                 <QTd>
-                    <QChip class="chip-color" square>{{ row.hardCopyNumber }}</QChip>
+                    <QChip class="chip-color" square v-if="row.hardCopyNumber">{{
+                        row.hardCopyNumber
+                    }}</QChip>
                 </QTd>
             </template>
 
@@ -138,7 +158,7 @@ const toWorkerDmsCreate = () => {
     </QPage>
 
     <QPageSticky :offset="[18, 18]">
-        <QBtn @click.stop="toWorkerDmsCreate()" color="primary" fab icon="add" />
+        <QBtn @click.stop="showWorkerDmsCreate" color="primary" fab icon="add" />
         <QTooltip>
             {{ t('Upload file') }}
         </QTooltip>
@@ -147,7 +167,7 @@ const toWorkerDmsCreate = () => {
 
 <style scoped>
 .chip-color {
-    background-color: var(--vn-label);
+    background-color: var(--vn-label-color);
 }
 </style>
 
diff --git a/src/pages/Worker/components/WorkerDmsActions.vue b/src/pages/Worker/components/WorkerDmsActions.vue
index 9a8e4816e..2a6ab1ce3 100644
--- a/src/pages/Worker/components/WorkerDmsActions.vue
+++ b/src/pages/Worker/components/WorkerDmsActions.vue
@@ -1,17 +1,15 @@
 <script setup>
 import { useI18n } from 'vue-i18n';
-import { useRoute, useRouter } from 'vue-router';
 
 import { useQuasar } from 'quasar';
 
 import { downloadFile } from 'src/composables/downloadFile';
 
 import WorkerDmsDelete from 'src/pages/Worker/components/WorkerDmsDelete.vue';
+import WorkerDmsEdit from './WorkerDmsEdit.vue';
 
 const { t } = useI18n();
 const quasar = useQuasar();
-const route = useRoute();
-const router = useRouter();
 
 const $props = defineProps({
     id: {
@@ -26,12 +24,12 @@ const $props = defineProps({
 
 const setDownloadFile = () => downloadFile($props.id);
 
-const toWorkerDmsEdit = () => {
-    router.push({
-        name: 'WorkerDmsEdit',
-        params: {
-            id: route.params.id,
+const showWorkerDmsEdit = () => {
+    quasar.dialog({
+        component: WorkerDmsEdit,
+        componentProps: {
             dmsId: $props.id,
+            promise: setData,
         },
     });
 };
@@ -64,7 +62,7 @@ const setData = () => {
             </QTooltip>
         </QIcon>
         <QIcon
-            @click.stop="toWorkerDmsEdit"
+            @click.stop="showWorkerDmsEdit"
             class="q-ml-md"
             color="primary"
             name="edit"
diff --git a/src/pages/Worker/components/WorkerDmsCreate.vue b/src/pages/Worker/components/WorkerDmsCreate.vue
index d38e044ca..f9afdddeb 100644
--- a/src/pages/Worker/components/WorkerDmsCreate.vue
+++ b/src/pages/Worker/components/WorkerDmsCreate.vue
@@ -1,262 +1,37 @@
 <script setup>
-import { onBeforeMount, ref, watch } from 'vue';
-import { useI18n } from 'vue-i18n';
-import { useRoute, useRouter } from 'vue-router';
+import { useDialogPluginComponent } from 'quasar';
 
-import axios from 'axios';
+import VnDms from 'src/components/common/VnDms.vue';
 
-import { useState } from 'src/composables/useState';
-import { useValidator } from 'src/composables/useValidator';
-import useNotify from 'src/composables/useNotify';
+const { dialogRef } = useDialogPluginComponent();
 
-import FetchData from 'components/FetchData.vue';
-import VnRow from 'components/ui/VnRow.vue';
-import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
-import VnInput from 'src/components/common/VnInput.vue';
-
-const { notify } = useNotify();
-const { t } = useI18n();
-const { validate } = useValidator();
-const route = useRoute();
-const router = useRouter();
-const state = useState();
-const user = state.getUser();
-
-const filterFindOne = { where: { code: 'paymentsLaw' } };
-const filterCompanies = { order: ['code'] };
-const filterWarehouses = { order: ['name'] };
-
-const inputFileRef = ref();
-const client = ref({});
-const findOne = ref([]);
-const allowedContentTypes = ref([]);
-const optionsCompanies = ref([]);
-const optionsWarehouses = ref([]);
-const optionsDmsTypes = ref([]);
-const isLoading = ref(false);
-const dms = ref({
-    hasFile: false,
+const $props = defineProps({
+    id: {
+        type: Number,
+        required: true,
+    },
+    defaultDmsCode: {
+        type: String,
+        required: true,
+    },
+    promise: {
+        type: Function,
+        required: true,
+    },
 });
 
-onBeforeMount(() => {
-    const { companyFk, warehouseFk } = user.value;
-    dms.value.reference = route.params.id;
-    dms.value.companyId = companyFk;
-    dms.value.warehouseId = warehouseFk;
-});
-
-watch([client, findOne], ([newClient, newFindOne]) => {
-    dms.value.description = t('clientFileDescription', {
-        dmsTypeName: newFindOne.name?.toUpperCase(),
-        clientName: newClient.name?.toUpperCase(),
-        clientId: newClient.id,
-    });
-    dms.value.dmsTypeId = newFindOne.id;
-});
-
-const saveData = async () => {
-    try {
-        const formData = new FormData();
-        const files = dms.value.files;
-
-        if (files && files.length > 0) {
-            for (let file of files) {
-                formData.append(file.name, file);
-            }
-            dms.value.hasFileAttached = true;
-
-            const url = `Workers/${route.params.id}/uploadFile`;
-            await axios.post(url, formData, {
-                params: dms.value,
-            });
-            notify('globals.dataSaved', 'positive');
-            toWorkerDms();
-        }
-    } catch (error) {
-        notify(error.message, 'negative');
-    }
-};
-
-const toWorkerDms = () => {
-    router.push({ name: 'WorkerDms' });
+const onDataSaved = async () => {
+    if ($props.promise) await $props.promise();
 };
 </script>
 
 <template>
-    <fetch-data
-        @on-fetch="(data) => (client = data)"
-        auto-load
-        :url="`Clients/${route.params.id}/getCard`"
-    />
-    <fetch-data
-        :filter="filterFindOne"
-        @on-fetch="(data) => (findOne = data)"
-        auto-load
-        url="DmsTypes/findOne"
-    />
-    <fetch-data
-        @on-fetch="(data) => (allowedContentTypes = data)"
-        auto-load
-        url="DmsContainers/allowedContentTypes"
-    />
-    <fetch-data
-        :filter="filterCompanies"
-        @on-fetch="(data) => (optionsCompanies = data)"
-        auto-load
-        url="Companies"
-    />
-    <fetch-data
-        :filter="filterWarehouses"
-        @on-fetch="(data) => (optionsWarehouses = data)"
-        auto-load
-        url="Warehouses"
-    />
-    <fetch-data
-        :filter="filterWarehouses"
-        @on-fetch="(data) => (optionsDmsTypes = data)"
-        auto-load
-        url="DmsTypes"
-    />
-
-    <Teleport to="#st-actions">
-        <QBtnGroup push class="q-gutter-x-sm">
-            <QBtn
-                :disabled="isLoading"
-                :label="t('globals.cancel')"
-                :loading="isLoading"
-                @click="toWorkerDms"
-                color="primary"
-                flat
-                icon="close"
-            />
-            <QBtn
-                :disabled="isLoading"
-                :label="t('globals.save')"
-                :loading="isLoading"
-                @click.stop="saveData"
-                color="primary"
-                icon="save"
-            />
-        </QBtnGroup>
-    </Teleport>
-
-    <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">
-                            <VnInput
-                                :label="t('Reference')"
-                                clearable
-                                v-model="dms.reference"
-                            />
-                        </div>
-                        <div class="col">
-                            <VnSelectFilter
-                                :label="t('Company')"
-                                :options="optionsCompanies"
-                                :rules="validate('entry.companyFk')"
-                                option-label="code"
-                                option-value="id"
-                                v-model="dms.companyId"
-                            />
-                        </div>
-                    </VnRow>
-
-                    <VnRow class="row q-gutter-md q-mb-md">
-                        <div class="col">
-                            <VnSelectFilter
-                                :label="t('Warehouse')"
-                                :options="optionsWarehouses"
-                                option-label="name"
-                                option-value="id"
-                                v-model="dms.warehouseId"
-                            />
-                        </div>
-                        <div class="col">
-                            <VnSelectFilter
-                                :label="t('Type')"
-                                :options="optionsDmsTypes"
-                                option-label="name"
-                                option-value="id"
-                                v-model="dms.dmsTypeId"
-                            />
-                        </div>
-                    </VnRow>
-
-                    <VnRow class="row q-gutter-md q-mb-md">
-                        <div class="col">
-                            <VnInput
-                                :label="t('Description')"
-                                :rules="validate('route.description')"
-                                clearable
-                                type="textarea"
-                                v-model="dms.description"
-                            />
-                        </div>
-                    </VnRow>
-
-                    <VnRow class="row q-gutter-md q-mb-md">
-                        <div class="col">
-                            <QFile
-                                ref="inputFileRef"
-                                class="required"
-                                :label="t('File')"
-                                v-model="dms.files"
-                                multiple
-                                :accept="allowedContentTypes.join(',')"
-                                clearable
-                                clear-icon="close"
-                            >
-                                <template #append>
-                                    <QBtn
-                                        icon="vn:attach"
-                                        flat
-                                        round
-                                        padding="xs"
-                                        @click="inputFileRef.pickFiles()"
-                                    >
-                                        <QTooltip>
-                                            {{ t('Select a file') }}
-                                        </QTooltip>
-                                    </QBtn>
-                                    <QBtn icon="info" flat round padding="xs">
-                                        <QTooltip max-width="30rem">
-                                            {{
-                                                `${t(
-                                                    'Allowed content types'
-                                                )}: ${allowedContentTypes.join(', ')}`
-                                            }}
-                                        </QTooltip>
-                                    </QBtn>
-                                </template>
-                            </QFile>
-                        </div>
-                    </VnRow>
-
-                    <QCheckbox
-                        :label="t('Generate identifier for original file')"
-                        v-model="dms.hasFile"
-                    />
-                </QForm>
-            </QCardSection>
-        </QCard>
-    </div>
+    <QDialog ref="dialogRef">
+        <VnDms
+            :default-dms-code="$props.defaultDmsCode"
+            :url="`Workers/${$props.id}/uploadFile`"
+            @on-data-saved="onDataSaved"
+            model="WorkerDmsCreate"
+        />
+    </QDialog>
 </template>
-
-<i18n>
-en:
-    clientFileDescription: '{dmsTypeName} FROM CLIENT {clientName} ID {clientId}'
-es:
-    Reference: Referencia
-    Company: Empresa
-    Warehouse: Almacén
-    Type: Tipo
-    Description: Descripción
-    clientFileDescription: '{dmsTypeName} DEL CLIENTE {clientName} ID {clientId}'
-    File: Fichero
-    Select a file: Selecciona un fichero
-    Allowed content types: Tipos de archivo permitidos
-    Generate identifier for original file: Generar identificador para archivo original
-</i18n>
diff --git a/src/pages/Worker/components/WorkerDmsEdit.vue b/src/pages/Worker/components/WorkerDmsEdit.vue
index 8e84c6326..7656fe09f 100644
--- a/src/pages/Worker/components/WorkerDmsEdit.vue
+++ b/src/pages/Worker/components/WorkerDmsEdit.vue
@@ -1,246 +1,56 @@
 <script setup>
 import { ref } from 'vue';
-import { useI18n } from 'vue-i18n';
-import { useRoute, useRouter } from 'vue-router';
 
-import axios from 'axios';
-
-import { useValidator } from 'src/composables/useValidator';
-import useNotify from 'src/composables/useNotify';
+import { useDialogPluginComponent } from 'quasar';
 
 import FetchData from 'components/FetchData.vue';
-import VnRow from 'components/ui/VnRow.vue';
-import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
-import VnInput from 'src/components/common/VnInput.vue';
+import VnDms from 'src/components/common/VnDms.vue';
 
-const { notify } = useNotify();
-const { t } = useI18n();
-const { validate } = useValidator();
-const route = useRoute();
-const router = useRouter();
+const { dialogRef } = useDialogPluginComponent();
 
-const filterCompanies = { order: ['code'] };
-const filterWarehouses = { order: ['name'] };
+const $props = defineProps({
+    dmsId: {
+        type: Number,
+        required: true,
+    },
+    defaultDmsCode: {
+        type: String,
+        required: false,
+    },
+    promise: {
+        type: Function,
+        required: true,
+    },
+});
 
-const inputFileRef = ref();
-const allowedContentTypes = ref([]);
-const optionsCompanies = ref([]);
-const optionsWarehouses = ref([]);
-const optionsDmsTypes = ref([]);
-const isLoading = ref(false);
-const dms = ref({
+const initialData = ref({
     hasFile: true,
+    id: $props.dmsId,
 });
 
 const setCurrentDms = (data) => {
-    dms.value.reference = data.reference;
-    dms.value.companyId = data.companyFk;
-    dms.value.warehouseId = data.warehouseFk;
-    dms.value.dmsTypeId = data.dmsTypeFk;
-    dms.value.description = data.description;
-    dms.value.hasFile = data.hasFile;
+    initialData.value.reference = data.reference;
+    initialData.value.companyFk = data.companyFk;
+    initialData.value.warehouseFk = data.warehouseFk;
+    initialData.value.dmsTypeFk = data.dmsTypeFk;
+    initialData.value.description = data.description;
+    initialData.value.hasFile = data.hasFile;
 };
 
-const saveData = async () => {
-    try {
-        const formData = new FormData();
-        console.log(formData);
-        const files = dms.value.files;
-        console.log(files);
-
-        dms.value.hasFileAttached = files ? true : false;
-        const url = `dms/${route.params.dmsId}/updateFile`;
-
-        if (files && files.length > 0) {
-            for (let file of files) {
-                formData.append(file.name, file);
-            }
-
-            await axios.post(url, formData, {
-                params: dms.value,
-            });
-            notify('globals.dataSaved', 'positive');
-        } else {
-            await axios.post(url, dms.value);
-        }
-
-        toWorkerDms();
-    } catch (error) {
-        notify(error.message, 'negative');
-    }
-};
-
-const toWorkerDms = () => {
-    router.push({ name: 'WorkerDms' });
+const onDataSaved = async () => {
+    if ($props.promise) await $props.promise();
 };
 </script>
 
 <template>
-    <fetch-data :url="`Dms/${route.params.dmsId}`" @on-fetch="setCurrentDms" auto-load />
-    <fetch-data
-        @on-fetch="(data) => (allowedContentTypes = data)"
-        auto-load
-        url="DmsContainers/allowedContentTypes"
-    />
-    <fetch-data
-        :filter="filterCompanies"
-        @on-fetch="(data) => (optionsCompanies = data)"
-        auto-load
-        url="Companies"
-    />
-    <fetch-data
-        :filter="filterWarehouses"
-        @on-fetch="(data) => (optionsWarehouses = data)"
-        auto-load
-        url="Warehouses"
-    />
-    <fetch-data
-        :filter="filterWarehouses"
-        @on-fetch="(data) => (optionsDmsTypes = data)"
-        auto-load
-        url="DmsTypes"
-    />
+    <fetch-data :url="`Dms/${$props.dmsId}`" @on-fetch="setCurrentDms" auto-load />
 
-    <Teleport to="#st-actions">
-        <QBtnGroup push class="q-gutter-x-sm">
-            <QBtn
-                :disabled="isLoading"
-                :label="t('globals.cancel')"
-                :loading="isLoading"
-                @click="toWorkerDms"
-                color="primary"
-                flat
-                icon="close"
-            />
-            <QBtn
-                :disabled="isLoading"
-                :label="t('globals.save')"
-                :loading="isLoading"
-                @click.stop="saveData"
-                color="primary"
-                icon="save"
-            />
-        </QBtnGroup>
-    </Teleport>
-
-    <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">
-                            <VnInput
-                                :label="t('Reference')"
-                                clearable
-                                v-model="dms.reference"
-                            />
-                        </div>
-                        <div class="col">
-                            <VnSelectFilter
-                                :label="t('Company')"
-                                :options="optionsCompanies"
-                                :rules="validate('entry.companyFk')"
-                                option-label="code"
-                                option-value="id"
-                                v-model="dms.companyId"
-                            />
-                        </div>
-                    </VnRow>
-
-                    <VnRow class="row q-gutter-md q-mb-md">
-                        <div class="col">
-                            <VnSelectFilter
-                                :label="t('Warehouse')"
-                                :options="optionsWarehouses"
-                                option-label="name"
-                                option-value="id"
-                                v-model="dms.warehouseId"
-                            />
-                        </div>
-                        <div class="col">
-                            <VnSelectFilter
-                                :label="t('Type')"
-                                :options="optionsDmsTypes"
-                                option-label="name"
-                                option-value="id"
-                                v-model="dms.dmsTypeId"
-                            />
-                        </div>
-                    </VnRow>
-
-                    <VnRow class="row q-gutter-md q-mb-md">
-                        <div class="col">
-                            <VnInput
-                                :label="t('Description')"
-                                :rules="validate('route.description')"
-                                clearable
-                                type="textarea"
-                                v-model="dms.description"
-                            />
-                        </div>
-                    </VnRow>
-
-                    <VnRow class="row q-gutter-md q-mb-md">
-                        <div class="col">
-                            <QFile
-                                ref="inputFileRef"
-                                class="required"
-                                :label="t('File')"
-                                v-model="dms.files"
-                                multiple
-                                :accept="allowedContentTypes.join(',')"
-                                clearable
-                                clear-icon="close"
-                            >
-                                <template #append>
-                                    <QBtn
-                                        icon="vn:attach"
-                                        flat
-                                        round
-                                        padding="xs"
-                                        @click="inputFileRef.pickFiles()"
-                                    >
-                                        <QTooltip>
-                                            {{ t('Select a file') }}
-                                        </QTooltip>
-                                    </QBtn>
-                                    <QBtn icon="info" flat round padding="xs">
-                                        <QTooltip max-width="30rem">
-                                            {{
-                                                `${t(
-                                                    'Allowed content types'
-                                                )}: ${allowedContentTypes.join(', ')}`
-                                            }}
-                                        </QTooltip>
-                                    </QBtn>
-                                </template>
-                            </QFile>
-                        </div>
-                    </VnRow>
-
-                    <QCheckbox
-                        :label="t('Generate identifier for original file')"
-                        v-model="dms.hasFile"
-                        disable
-                    />
-                </QForm>
-            </QCardSection>
-        </QCard>
-    </div>
+    <QDialog ref="dialogRef">
+        <VnDms
+            :default-initialData-code="$props.defaultDmsCode"
+            @on-data-saved="onDataSaved"
+            model="WorkerDmsEdit"
+            :form-initial-data="initialData"
+        />
+    </QDialog>
 </template>
-
-<i18n>
-en:
-    clientFileDescription: '{dmsTypeName} FROM CLIENT {clientName} ID {clientId}'
-es:
-    Reference: Referencia
-    Company: Empresa
-    Warehouse: Almacén
-    Type: Tipo
-    Description: Descripción
-    clientFileDescription: '{dmsTypeName} DEL CLIENTE {clientName} ID {clientId}'
-    File: Fichero
-    Select a file: Selecciona un fichero
-    Allowed content types: Tipos de archivo permitidos
-    Generate identifier for original file: Generar identificador para archivo original
-</i18n>
diff --git a/src/router/modules/worker.js b/src/router/modules/worker.js
index a3b2d52dc..c0fe6e1fa 100644
--- a/src/router/modules/worker.js
+++ b/src/router/modules/worker.js
@@ -86,33 +86,13 @@ export default {
                     component: () => import('src/pages/Worker/Card/WorkerPda.vue'),
                 },
                 {
+                    name: 'WorkerDms',
                     path: 'dms',
-                    name: 'DmsCard',
-                    redirect: { name: 'WorkerDms' },
-                    children: [
-                        {
-                            path: '',
-                            name: 'WorkerDms',
-                            meta: {
-                                title: 'dms',
-                                icon: 'cloud_upload',
-                            },
-                            component: () =>
-                                import('src/pages/Worker/Card/WorkerDms.vue'),
-                        },
-                        {
-                            path: 'create',
-                            name: 'WorkerDmsCreate',
-                            component: () =>
-                                import('src/pages/Worker/components/WorkerDmsCreate.vue'),
-                        },
-                        {
-                            path: ':dmsId/edit',
-                            name: 'WorkerDmsEdit',
-                            component: () =>
-                                import('src/pages/Worker/components/WorkerDmsEdit.vue'),
-                        },
-                    ],
+                    meta: {
+                        title: 'dms',
+                        icon: 'cloud_upload',
+                    },
+                    component: () => import('src/pages/Worker/Card/WorkerDms.vue'),
                 },
             ],
         },

From 0d6d18b8c8ddd9046f84a5ad71d54ccba0b7a379 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Wed, 27 Mar 2024 20:33:35 -0300
Subject: [PATCH 3/8] Apply VnDmsList component and add docuware action

---
 src/components/common/VnDmsList.vue           |  33 +++-
 src/composables/downloadFile.js               |   9 +-
 src/composables/getUrl.js                     |  24 +++
 src/pages/Worker/Card/WorkerDms.vue           | 185 +-----------------
 .../Worker/components/WorkerDmsActions.vue    |  94 ---------
 .../Worker/components/WorkerDmsCreate.vue     |  37 ----
 .../Worker/components/WorkerDmsDelete.vue     |  82 --------
 src/pages/Worker/components/WorkerDmsEdit.vue |  56 ------
 8 files changed, 67 insertions(+), 453 deletions(-)
 delete mode 100644 src/pages/Worker/components/WorkerDmsActions.vue
 delete mode 100644 src/pages/Worker/components/WorkerDmsCreate.vue
 delete mode 100644 src/pages/Worker/components/WorkerDmsDelete.vue
 delete mode 100644 src/pages/Worker/components/WorkerDmsEdit.vue

diff --git a/src/components/common/VnDmsList.vue b/src/components/common/VnDmsList.vue
index 23e00f5d9..9bf90230d 100644
--- a/src/components/common/VnDmsList.vue
+++ b/src/components/common/VnDmsList.vue
@@ -9,6 +9,7 @@ import FetchData from 'components/FetchData.vue';
 import VnDms from 'src/components/common/VnDms.vue';
 import VnConfirm from 'components/ui/VnConfirm.vue';
 import { downloadFile } from 'src/composables/downloadFile';
+import { getUrlFindOne } from 'composables/getUrl';
 
 const route = useRoute();
 const quasar = useQuasar();
@@ -142,15 +143,17 @@ const columns = computed(() => [
         components: [
             {
                 component: QBtn,
+                name: 'download',
                 props: () => ({
                     icon: 'cloud_download',
                     flat: true,
                     color: 'primary',
                 }),
-                click: (prop) => downloadFile(prop.row.id),
+                click: (prop) => downloadFile(prop.row.id, prop.row.isDocuware),
             },
             {
                 component: QBtn,
+                name: 'edit',
                 props: () => ({
                     icon: 'edit',
                     flat: true,
@@ -160,6 +163,7 @@ const columns = computed(() => [
             },
             {
                 component: QBtn,
+                name: 'delete',
                 props: () => ({
                     icon: 'delete',
                     flat: true,
@@ -167,6 +171,16 @@ const columns = computed(() => [
                 }),
                 click: (prop) => deleteDms(prop.row.id),
             },
+            {
+                component: QBtn,
+                name: 'openDocuware',
+                props: () => ({
+                    icon: 'open_in_new',
+                    flat: true,
+                    color: 'primary',
+                }),
+                click: () => openDocuware(),
+            },
         ],
     },
 ]);
@@ -206,6 +220,16 @@ function parseDms(data) {
     }
     return data;
 }
+
+async function openDocuware() {
+    const url = await getUrlFindOne('WebClient', 'docuware');
+    if (url) window.open(url).focus();
+}
+
+function shouldRenderButton(buttonName, isDocuware = false) {
+    // Renderizar el botón si no se llama 'openDocuware' o (se llama 'openDocuware' y props.row.isDocuware = true)
+    return buttonName !== 'openDocuware' || (buttonName === 'openDocuware' && isDocuware);
+}
 </script>
 <template>
     <FetchData
@@ -243,6 +267,7 @@ function parseDms(data) {
                 <div class="flex justify-center" v-if="props.col.name == 'options'">
                     <div v-for="button of props.col.components" :key="button.id">
                         <component
+                            v-if="shouldRenderButton(button.name, props.row.isDocuware)"
                             :is="button.component"
                             v-bind="button.props(props)"
                             @click="button.click(props)"
@@ -272,6 +297,12 @@ function parseDms(data) {
                                     class="row"
                                 >
                                     <component
+                                        v-if="
+                                            shouldRenderButton(
+                                                button.name,
+                                                props.row.isDocuware
+                                            )
+                                        "
                                         :is="button.component"
                                         v-bind="button.props(col)"
                                         @click="button.click(col)"
diff --git a/src/composables/downloadFile.js b/src/composables/downloadFile.js
index b26dec731..45162f81b 100644
--- a/src/composables/downloadFile.js
+++ b/src/composables/downloadFile.js
@@ -1,11 +1,12 @@
 import { useSession } from 'src/composables/useSession';
 import { getUrl } from './getUrl';
 
-const {getTokenMultimedia} = useSession();
-const token =  getTokenMultimedia();
+const { getTokenMultimedia } = useSession();
+const token = getTokenMultimedia();
 
-export async function downloadFile(dmsId) {
+export async function downloadFile(dmsId, isDocuware = false) {
     let appUrl = await getUrl('', 'lilium');
     appUrl = appUrl.replace('/#/', '');
-    window.open(`${appUrl}/api/dms/${dmsId}/downloadFile?access_token=${token}`);
+    const urlPath = isDocuware ? '/docuwareDownload' : '/downloadFile';
+    window.open(`${appUrl}/api/dms/${dmsId}${urlPath}?access_token=${token}`);
 }
diff --git a/src/composables/getUrl.js b/src/composables/getUrl.js
index 1e6aec4c6..7b7103562 100644
--- a/src/composables/getUrl.js
+++ b/src/composables/getUrl.js
@@ -1,4 +1,7 @@
 import axios from 'axios';
+import useNotify from 'src/composables/useNotify.js';
+
+const { notify } = useNotify();
 
 export async function getUrl(route, app = 'salix') {
     let url;
@@ -8,3 +11,24 @@ export async function getUrl(route, app = 'salix') {
     });
     return url;
 }
+
+export async function getUrlFindOne(route, app = 'salix') {
+    try {
+        const env = process.env.NODE_ENV;
+
+        const filter = {
+            where: { and: [{ appName: app }, { environment: env }] },
+        };
+
+        const { data } = await axios.get('Urls/findOne', {
+            params: { filter: JSON.stringify(filter) },
+        });
+
+        if (!data) return null;
+
+        return data.url + route;
+    } catch (err) {
+        notify('Direction not found', 'negative');
+        console.error('Error finding url: ', err);
+    }
+}
diff --git a/src/pages/Worker/Card/WorkerDms.vue b/src/pages/Worker/Card/WorkerDms.vue
index f794f6b17..d0c5cf5e5 100644
--- a/src/pages/Worker/Card/WorkerDms.vue
+++ b/src/pages/Worker/Card/WorkerDms.vue
@@ -1,184 +1,11 @@
 <script setup>
-import { computed, ref, watch } from 'vue';
-import { useI18n } from 'vue-i18n';
-import { useRoute } from 'vue-router';
-
-import { useQuasar } from 'quasar';
-
-import { downloadFile } from 'src/composables/downloadFile';
-import { toDateHour } from 'src/filters';
-
-import FetchData from 'components/FetchData.vue';
-import WorkerDmsCreate from '../components/WorkerDmsCreate.vue';
-import WorkerDmsActions from '../components/WorkerDmsActions.vue';
-
-const { t } = useI18n();
-const quasar = useQuasar();
-const route = useRoute();
-
-const findOne = ref([]);
-const rows = ref([]);
-const workerDmsRef = ref(null);
-
-const filter = { where: { worker: route.params.id }, order: ['dmsFk DESC'], limit: 20 };
-const filterFindOne = { where: { code: 'hhrrData' } };
-
-const columns = computed(() => [
-    {
-        align: 'left',
-        field: 'dmsFk',
-        label: t('Id'),
-        name: 'id',
-    },
-    {
-        align: 'left',
-        field: 'hardCopyNumber',
-        label: t('Order'),
-        name: 'order',
-    },
-    {
-        align: 'left',
-        field: 'reference',
-        label: t('Reference'),
-        name: 'reference',
-    },
-    {
-        align: 'left',
-        field: 'description',
-        label: t('Description'),
-        name: 'description',
-    },
-    {
-        align: 'left',
-        field: 'hasFile',
-        label: t('Original'),
-        name: 'original',
-    },
-    {
-        align: 'left',
-        field: 'file',
-        label: t('File'),
-        name: 'file',
-    },
-    {
-        align: 'left',
-        field: 'created',
-        label: t('Created'),
-        name: 'created',
-        format: (value) => toDateHour(value),
-    },
-    {
-        align: 'right',
-        field: 'actions',
-        label: '',
-        name: 'actions',
-    },
-]);
-
-watch(
-    () => route.params.id,
-    (newValue) => {
-        filter.where.worker = newValue;
-        setData();
-    }
-);
-
-const setData = () => {
-    workerDmsRef.value.fetch();
-};
-
-const showWorkerDmsCreate = () => {
-    quasar.dialog({
-        component: WorkerDmsCreate,
-        componentProps: {
-            id: Number(route.params.id),
-            defaultDmsCode: findOne.value.code,
-            promise: setData,
-        },
-    });
-};
+import VnDmsList from 'src/components/common/VnDmsList.vue';
 </script>
-
 <template>
-    <FetchData
-        ref="workerDmsRef"
-        :filter="filter"
-        @on-fetch="(data) => (rows = data)"
-        auto-load
-        :url="`WorkerDms/${route.params.id}/filter`"
+    <VnDmsList
+        model="WorkerDms"
+        update-model="Workers"
+        default-dms-code="hhrrData"
+        filter="workerFk"
     />
-    <fetch-data
-        :filter="filterFindOne"
-        @on-fetch="(data) => (findOne = data)"
-        auto-load
-        url="DmsTypes/findOne"
-    />
-
-    <QPage class="column items-center q-pa-md">
-        <QTable
-            :columns="columns"
-            :pagination="{ rowsPerPage: 12 }"
-            :rows="rows"
-            class="full-width q-mt-md"
-            row-key="id"
-            v-if="rows?.length"
-        >
-            <template #body-cell-order="{ row }">
-                <QTd>
-                    <QChip class="chip-color" square v-if="row.hardCopyNumber">{{
-                        row.hardCopyNumber
-                    }}</QChip>
-                </QTd>
-            </template>
-
-            <template #body-cell-original="{ row }">
-                <QTd>
-                    <QCheckbox :model-value="row.hasFile === 1" disable />
-                </QTd>
-            </template>
-
-            <template #body-cell-file="{ row }">
-                <QTd>
-                    <QBtn @click.stop="downloadFile(row.dmsFk)" color="blue" flat no-caps>
-                        {{ row.file }}
-                    </QBtn>
-                </QTd>
-            </template>
-
-            <template #body-cell-actions="{ row }">
-                <QTd>
-                    <WorkerDmsActions :id="row.dmsFk" :promise="setData" />
-                </QTd>
-            </template>
-        </QTable>
-
-        <h5 class="flex justify-center color-vn-label" v-else>
-            {{ t('globals.noResults') }}
-        </h5>
-    </QPage>
-
-    <QPageSticky :offset="[18, 18]">
-        <QBtn @click.stop="showWorkerDmsCreate" color="primary" fab icon="add" />
-        <QTooltip>
-            {{ t('Upload file') }}
-        </QTooltip>
-    </QPageSticky>
 </template>
-
-<style scoped>
-.chip-color {
-    background-color: var(--vn-label-color);
-}
-</style>
-
-<i18n>
-es:
-    Id: Id
-    Order: Orden
-    Reference: Referencia
-    Description: Descripción
-    File: Archivo
-    Original: Original
-    Created: Fecha creación
-    Upload file: Subir fichero
-</i18n>
diff --git a/src/pages/Worker/components/WorkerDmsActions.vue b/src/pages/Worker/components/WorkerDmsActions.vue
deleted file mode 100644
index 2a6ab1ce3..000000000
--- a/src/pages/Worker/components/WorkerDmsActions.vue
+++ /dev/null
@@ -1,94 +0,0 @@
-<script setup>
-import { useI18n } from 'vue-i18n';
-
-import { useQuasar } from 'quasar';
-
-import { downloadFile } from 'src/composables/downloadFile';
-
-import WorkerDmsDelete from 'src/pages/Worker/components/WorkerDmsDelete.vue';
-import WorkerDmsEdit from './WorkerDmsEdit.vue';
-
-const { t } = useI18n();
-const quasar = useQuasar();
-
-const $props = defineProps({
-    id: {
-        type: Number,
-        required: true,
-    },
-    promise: {
-        type: Function,
-        required: true,
-    },
-});
-
-const setDownloadFile = () => downloadFile($props.id);
-
-const showWorkerDmsEdit = () => {
-    quasar.dialog({
-        component: WorkerDmsEdit,
-        componentProps: {
-            dmsId: $props.id,
-            promise: setData,
-        },
-    });
-};
-
-const showWorkerDmsDeleteDialog = () => {
-    quasar.dialog({
-        component: WorkerDmsDelete,
-        componentProps: {
-            id: $props.id,
-            promise: setData,
-        },
-    });
-};
-
-const setData = () => {
-    $props.promise();
-};
-</script>
-
-<template>
-    <div>
-        <QIcon
-            @click.stop="setDownloadFile"
-            color="primary"
-            name="cloud_download"
-            size="sm"
-        >
-            <QTooltip>
-                {{ t('actionFile', { action: t('globals.download') }) }}
-            </QTooltip>
-        </QIcon>
-        <QIcon
-            @click.stop="showWorkerDmsEdit"
-            class="q-ml-md"
-            color="primary"
-            name="edit"
-            size="sm"
-        >
-            <QTooltip>
-                {{ t('actionFile', { action: t('globals.edit') }) }}
-            </QTooltip>
-        </QIcon>
-        <QIcon
-            @click.stop="showWorkerDmsDeleteDialog"
-            class="q-ml-md"
-            color="primary"
-            name="delete"
-            size="sm"
-        >
-            <QTooltip>
-                {{ t('actionFile', { action: t('globals.remove') }) }}
-            </QTooltip>
-        </QIcon>
-    </div>
-</template>
-
-<i18n>
-en:
-    actionFile: '{action} file'
-es:
-    actionFile: '{action} fichero'
-</i18n>
diff --git a/src/pages/Worker/components/WorkerDmsCreate.vue b/src/pages/Worker/components/WorkerDmsCreate.vue
deleted file mode 100644
index f9afdddeb..000000000
--- a/src/pages/Worker/components/WorkerDmsCreate.vue
+++ /dev/null
@@ -1,37 +0,0 @@
-<script setup>
-import { useDialogPluginComponent } from 'quasar';
-
-import VnDms from 'src/components/common/VnDms.vue';
-
-const { dialogRef } = useDialogPluginComponent();
-
-const $props = defineProps({
-    id: {
-        type: Number,
-        required: true,
-    },
-    defaultDmsCode: {
-        type: String,
-        required: true,
-    },
-    promise: {
-        type: Function,
-        required: true,
-    },
-});
-
-const onDataSaved = async () => {
-    if ($props.promise) await $props.promise();
-};
-</script>
-
-<template>
-    <QDialog ref="dialogRef">
-        <VnDms
-            :default-dms-code="$props.defaultDmsCode"
-            :url="`Workers/${$props.id}/uploadFile`"
-            @on-data-saved="onDataSaved"
-            model="WorkerDmsCreate"
-        />
-    </QDialog>
-</template>
diff --git a/src/pages/Worker/components/WorkerDmsDelete.vue b/src/pages/Worker/components/WorkerDmsDelete.vue
deleted file mode 100644
index 5e1b98b24..000000000
--- a/src/pages/Worker/components/WorkerDmsDelete.vue
+++ /dev/null
@@ -1,82 +0,0 @@
-<script setup>
-import { ref } from 'vue';
-import { useI18n } from 'vue-i18n';
-
-import { useDialogPluginComponent } from 'quasar';
-import axios from 'axios';
-
-import useNotify from 'src/composables/useNotify';
-
-const $props = defineProps({
-    id: {
-        type: Number,
-        required: true,
-    },
-    promise: {
-        type: Function,
-        required: true,
-    },
-});
-
-const { dialogRef } = useDialogPluginComponent();
-const { notify } = useNotify();
-const { t } = useI18n();
-
-const closeButton = ref(null);
-
-const isLoading = ref(false);
-
-const deleteDms = async () => {
-    isLoading.value = true;
-    try {
-        await axios.post(`WorkerDms/${$props.id}/removeFile`);
-        if ($props.promise) await $props.promise();
-        notify('globals.dataDeleted', 'positive');
-    } catch (error) {
-        notify(error.message, 'negative');
-    } finally {
-        closeButton.value.click();
-        isLoading.value = false;
-    }
-};
-</script>
-
-<template>
-    <QDialog ref="dialogRef">
-        <QCard class="q-pa-md q-mb-md">
-            <span ref="closeButton" class="row justify-end close-icon" v-close-popup>
-                <QIcon name="close" size="sm" />
-            </span>
-
-            <QCardSection>
-                <div class="mt-1 text-h6">{{ t('This file will be deleted') }}</div>
-                <div>{{ t('Are you sure you want to continue?') }}</div>
-            </QCardSection>
-
-            <QCardActions class="flex justify-end">
-                <QBtn
-                    :disabled="isLoading"
-                    :label="t('globals.cancel')"
-                    :loading="isLoading"
-                    class="q-mr-xl"
-                    color="primary"
-                    flat
-                    v-close-popup
-                />
-                <QBtn
-                    :disabled="isLoading"
-                    :label="t('globals.save')"
-                    :loading="isLoading"
-                    @click.stop="deleteDms"
-                    color="primary"
-                />
-            </QCardActions>
-        </QCard>
-    </QDialog>
-</template>
-
-<i18n>
-es:
-    This file will be deleted: Este fichero va a ser borrado
-    Are you sure you want to continue?: ¿Seguro que quieres continuar?
-</i18n>
diff --git a/src/pages/Worker/components/WorkerDmsEdit.vue b/src/pages/Worker/components/WorkerDmsEdit.vue
deleted file mode 100644
index 7656fe09f..000000000
--- a/src/pages/Worker/components/WorkerDmsEdit.vue
+++ /dev/null
@@ -1,56 +0,0 @@
-<script setup>
-import { ref } from 'vue';
-
-import { useDialogPluginComponent } from 'quasar';
-
-import FetchData from 'components/FetchData.vue';
-import VnDms from 'src/components/common/VnDms.vue';
-
-const { dialogRef } = useDialogPluginComponent();
-
-const $props = defineProps({
-    dmsId: {
-        type: Number,
-        required: true,
-    },
-    defaultDmsCode: {
-        type: String,
-        required: false,
-    },
-    promise: {
-        type: Function,
-        required: true,
-    },
-});
-
-const initialData = ref({
-    hasFile: true,
-    id: $props.dmsId,
-});
-
-const setCurrentDms = (data) => {
-    initialData.value.reference = data.reference;
-    initialData.value.companyFk = data.companyFk;
-    initialData.value.warehouseFk = data.warehouseFk;
-    initialData.value.dmsTypeFk = data.dmsTypeFk;
-    initialData.value.description = data.description;
-    initialData.value.hasFile = data.hasFile;
-};
-
-const onDataSaved = async () => {
-    if ($props.promise) await $props.promise();
-};
-</script>
-
-<template>
-    <fetch-data :url="`Dms/${$props.dmsId}`" @on-fetch="setCurrentDms" auto-load />
-
-    <QDialog ref="dialogRef">
-        <VnDms
-            :default-initialData-code="$props.defaultDmsCode"
-            @on-data-saved="onDataSaved"
-            model="WorkerDmsEdit"
-            :form-initial-data="initialData"
-        />
-    </QDialog>
-</template>

From f6e140e369f54bf41c77fb3fd05e584e740eeaa7 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Tue, 9 Apr 2024 08:28:00 -0300
Subject: [PATCH 4/8] Apply workerDms changes

---
 src/components/common/VnDms.vue               |   2 +
 src/components/common/VnDmsList.vue           | 225 +++++++++++-------
 src/components/ui/VnPaginate.vue              |  15 +-
 src/components/ui/VnTree.vue                  |   2 +-
 src/composables/downloadFile.js               |   5 +-
 src/composables/getUrl.js                     |  24 --
 src/composables/useArrayData.js               |   2 +-
 src/i18n/en/index.js                          |   2 +
 src/i18n/es/index.js                          |   2 +
 .../Department/Card/DepartmentDescriptor.vue  |   2 +-
 src/pages/Worker/Card/WorkerDms.vue           |   7 +-
 11 files changed, 163 insertions(+), 125 deletions(-)

diff --git a/src/components/common/VnDms.vue b/src/components/common/VnDms.vue
index 08255f8a5..daef5940b 100644
--- a/src/components/common/VnDms.vue
+++ b/src/components/common/VnDms.vue
@@ -198,9 +198,11 @@ function addDefaultData(data) {
 en:
     contentTypesInfo: Allowed file types {allowedContentTypes}
     EntryDmsDescription: Reference {reference}
+    WorkersDescription: Working of employee id {reference}
 es:
     Generate identifier for original file: Generar identificador para archivo original
     contentTypesInfo: Tipos de archivo permitidos {allowedContentTypes}
     EntryDmsDescription: Referencia {reference}
+    WorkersDescription: Laboral del empleado {reference}
 
 </i18n>
diff --git a/src/components/common/VnDmsList.vue b/src/components/common/VnDmsList.vue
index 9bf90230d..8c3ffc807 100644
--- a/src/components/common/VnDmsList.vue
+++ b/src/components/common/VnDmsList.vue
@@ -5,11 +5,12 @@ import { useRoute } from 'vue-router';
 import { useQuasar, QCheckbox, QBtn, QInput } from 'quasar';
 import axios from 'axios';
 
-import FetchData from 'components/FetchData.vue';
+import VnPaginate from 'components/ui/VnPaginate.vue';
 import VnDms from 'src/components/common/VnDms.vue';
 import VnConfirm from 'components/ui/VnConfirm.vue';
+import VnInputDate from 'components/common/VnInputDate.vue';
+import VnUserLink from '../ui/VnUserLink.vue';
 import { downloadFile } from 'src/composables/downloadFile';
-import { getUrlFindOne } from 'composables/getUrl';
 
 const route = useRoute();
 const quasar = useQuasar();
@@ -27,6 +28,11 @@ const $props = defineProps({
         type: String,
         default: null,
     },
+    downloadModel: {
+        type: String,
+        required: false,
+        default: null,
+    },
     defaultDmsCode: {
         type: String,
         required: true,
@@ -75,7 +81,7 @@ const dmsFilter = {
             ],
         },
     },
-    order: ['dmsFk DESC'],
+    where: { [$props.filter]: route.params.id },
 };
 
 const columns = computed(() => [
@@ -95,12 +101,12 @@ const columns = computed(() => [
         props: (prop) => ({
             readonly: true,
             borderless: true,
-            'model-value': prop.row.dmsType.name,
+            'model-value': prop.row.dmsType?.name,
         }),
     },
     {
         align: 'left',
-        field: 'order',
+        field: 'hardCopyNumber',
         label: t('globals.order'),
         name: 'order',
         component: 'span',
@@ -118,6 +124,7 @@ const columns = computed(() => [
         label: t('globals.description'),
         name: 'description',
         component: 'span',
+        props: (prop) => ({ value: prop.value?.toUpperCase() }),
     },
     {
         align: 'left',
@@ -137,6 +144,28 @@ const columns = computed(() => [
         name: 'file',
         component: 'span',
     },
+    {
+        align: 'left',
+        field: 'worker',
+        label: t('globals.worker'),
+        name: 'worker',
+        component: VnUserLink,
+        props: (prop) => ({
+            name: prop.row.worker?.user?.name.toLowerCase(),
+            workerId: prop.row.worker?.id,
+        }),
+    },
+    {
+        align: 'left',
+        field: 'created',
+        label: t('globals.created'),
+        name: 'created',
+        component: VnInputDate,
+        props: (prop) => ({
+            disable: true,
+            'model-value': prop.row.created,
+        }),
+    },
     {
         field: 'options',
         name: 'options',
@@ -144,16 +173,24 @@ const columns = computed(() => [
             {
                 component: QBtn,
                 name: 'download',
+                isDocuware: true,
                 props: () => ({
                     icon: 'cloud_download',
                     flat: true,
                     color: 'primary',
                 }),
-                click: (prop) => downloadFile(prop.row.id, prop.row.isDocuware),
+                click: (prop) =>
+                    downloadFile(
+                        prop.row.id,
+                        $props.downloadModel,
+                        null,
+                        prop.row.download
+                    ),
             },
             {
                 component: QBtn,
                 name: 'edit',
+                external: false,
                 props: () => ({
                     icon: 'edit',
                     flat: true,
@@ -164,6 +201,7 @@ const columns = computed(() => [
             {
                 component: QBtn,
                 name: 'delete',
+                external: false,
                 props: () => ({
                     icon: 'delete',
                     flat: true,
@@ -173,20 +211,22 @@ const columns = computed(() => [
             },
             {
                 component: QBtn,
-                name: 'openDocuware',
+                name: 'open',
+                external: true,
                 props: () => ({
                     icon: 'open_in_new',
                     flat: true,
                     color: 'primary',
                 }),
-                click: () => openDocuware(),
+                click: (prop) => open(prop.row.url),
             },
         ],
     },
 ]);
 
 function setData(data) {
-    const newData = data.map((value) => value.dms);
+    const newData = data.map((value) => value.dms || value);
+    newData.sort((a, b) => new Date(b.created) - new Date(a.created));
     rows.value = newData;
 }
 
@@ -221,100 +261,105 @@ function parseDms(data) {
     return data;
 }
 
-async function openDocuware() {
-    const url = await getUrlFindOne('WebClient', 'docuware');
-    if (url) window.open(url).focus();
+async function open(url) {
+    window.open(url).focus();
 }
 
-function shouldRenderButton(buttonName, isDocuware = false) {
-    // Renderizar el botón si no se llama 'openDocuware' o (se llama 'openDocuware' y props.row.isDocuware = true)
-    return buttonName !== 'openDocuware' || (buttonName === 'openDocuware' && isDocuware);
+function shouldRenderButton(button, isExternal = false) {
+    if (button.name == 'download') return true;
+    return button.external === isExternal;
 }
 </script>
 <template>
-    <FetchData
+    <VnPaginate
         ref="dmsRef"
+        :data-key="$props.model"
         :url="$props.model"
         :filter="dmsFilter"
-        :where="{ [$props.filter]: route.params.id }"
+        :order="['dmsFk DESC']"
+        :auto-load="true"
         @on-fetch="setData"
-        auto-load
-    />
-    <QTable
-        :columns="columns"
-        :rows="rows"
-        class="full-width q-mt-md"
-        hide-bottom
-        row-key="clientFk"
-        :grid="$q.screen.lt.sm"
     >
-        <template #body-cell="props">
-            <QTd :props="props">
-                <QTr :props="props">
-                    <component
-                        v-if="props.col.component"
-                        :is="props.col.component"
-                        v-bind="props.col.props && props.col.props(props)"
-                    >
-                        <span
-                            v-if="props.col.component == 'span'"
-                            style="white-space: wrap"
-                            >{{ props.value }}</span
-                        >
-                    </component>
-                </QTr>
-
-                <div class="flex justify-center" v-if="props.col.name == 'options'">
-                    <div v-for="button of props.col.components" :key="button.id">
-                        <component
-                            v-if="shouldRenderButton(button.name, props.row.isDocuware)"
-                            :is="button.component"
-                            v-bind="button.props(props)"
-                            @click="button.click(props)"
-                        />
-                    </div>
-                </div>
-            </QTd>
-        </template>
-        <template #item="props">
-            <div class="q-pa-xs col-xs-12 col-sm-6 grid-style-transition">
-                <QCard
-                    bordered
-                    flat
-                    @keyup.ctrl.enter.stop="claimDevelopmentForm?.saveChanges()"
-                >
-                    <QSeparator />
-                    <QList dense>
-                        <QItem v-for="col in props.cols" :key="col.name">
-                            <div v-if="col.name != 'options'" class="row">
-                                <span class="labelColor">{{ col.label }}:</span>
-                                <span>{{ col.value }}</span>
-                            </div>
-                            <div v-if="col.name == 'options'" class="row">
-                                <div
-                                    v-for="button of col.components"
-                                    :key="button.id"
-                                    class="row"
+        <template #body>
+            <QTable
+                :columns="columns"
+                :rows="rows"
+                class="full-width q-mt-md"
+                hide-bottom
+                row-key="clientFk"
+                :grid="$q.screen.lt.sm"
+            >
+                <template #body-cell="props">
+                    <QTd :props="props">
+                        <QTr :props="props">
+                            <component
+                                v-if="props.col.component"
+                                :is="props.col.component"
+                                v-bind="props.col.props && props.col.props(props)"
+                            >
+                                <span
+                                    v-if="props.col.component == 'span'"
+                                    style="white-space: wrap"
+                                    >{{ props.value }}</span
                                 >
-                                    <component
-                                        v-if="
-                                            shouldRenderButton(
-                                                button.name,
-                                                props.row.isDocuware
-                                            )
-                                        "
-                                        :is="button.component"
-                                        v-bind="button.props(col)"
-                                        @click="button.click(col)"
-                                    />
-                                </div>
+                            </component>
+                        </QTr>
+
+                        <div class="row no-wrap" v-if="props.col.name == 'options'">
+                            <div v-for="button of props.col.components" :key="button.id">
+                                <component
+                                    v-if="
+                                        shouldRenderButton(button, props.row.isDocuware)
+                                    "
+                                    :is="button.component"
+                                    v-bind="button.props(props)"
+                                    @click="button.click(props)"
+                                />
                             </div>
-                        </QItem>
-                    </QList>
-                </QCard>
-            </div>
+                        </div>
+                    </QTd>
+                </template>
+                <template #item="props">
+                    <div class="q-pa-xs col-xs-12 col-sm-6 grid-style-transition">
+                        <QCard
+                            bordered
+                            flat
+                            @keyup.ctrl.enter.stop="claimDevelopmentForm?.saveChanges()"
+                        >
+                            <QSeparator />
+                            <QList dense>
+                                <QItem v-for="col in props.cols" :key="col.name">
+                                    <div v-if="col.name != 'options'" class="row">
+                                        <span class="labelColor">{{ col.label }}:</span>
+                                        <span>{{ col.value }}</span>
+                                    </div>
+                                    <div v-if="col.name == 'options'" class="row">
+                                        <div
+                                            v-for="button of col.components"
+                                            :key="button.id"
+                                            class="row"
+                                        >
+                                            <component
+                                                v-if="
+                                                    shouldRenderButton(
+                                                        button.name,
+                                                        props.row.isDocuware
+                                                    )
+                                                "
+                                                :is="button.component"
+                                                v-bind="button.props(col)"
+                                                @click="button.click(col)"
+                                            />
+                                        </div>
+                                    </div>
+                                </QItem>
+                            </QList>
+                        </QCard>
+                    </div>
+                </template>
+            </QTable>
         </template>
-    </QTable>
+    </VnPaginate>
     <QDialog v-model="formDialog.show">
         <VnDms
             :model="updateModel ?? model"
diff --git a/src/components/ui/VnPaginate.vue b/src/components/ui/VnPaginate.vue
index d1b2f5ccb..4cb2e6d6e 100644
--- a/src/components/ui/VnPaginate.vue
+++ b/src/components/ui/VnPaginate.vue
@@ -110,7 +110,7 @@ async function paginate() {
     if (!arrayData.hasMoreData.value) {
         if (store.userParamsChanged) arrayData.hasMoreData.value = true;
         store.userParamsChanged = false;
-        isLoading.value = false;
+        endPagination();
         return;
     }
 
@@ -120,12 +120,14 @@ async function paginate() {
     pagination.value.sortBy = sortBy;
     pagination.value.descending = descending;
 
-    isLoading.value = false;
+    endPagination();
+}
 
+function endPagination() {
+    isLoading.value = false;
     emit('onFetch', store.data);
     emit('onPaginate');
 }
-
 async function onLoad(index, done) {
     if (!store.data) {
         return done();
@@ -188,6 +190,12 @@ async function onLoad(index, done) {
             <QSpinner color="orange" size="md" />
         </div>
     </QInfiniteScroll>
+    <div
+        v-if="!isLoading && arrayData.hasMoreData"
+        class="w-full flex justify-center q-mt-md"
+    >
+        <QBtn color="primary" :label="t('Load more data')" @click="paginate()" />
+    </div>
 </template>
 
 <style lang="scss" scoped>
@@ -204,4 +212,5 @@ async function onLoad(index, done) {
 es:
     No data to display: Sin datos que mostrar
     No results found: No se han encontrado resultados
+    Load more data: Cargar más resultados
 </i18n>
diff --git a/src/components/ui/VnTree.vue b/src/components/ui/VnTree.vue
index 9a99124c6..13aa05635 100644
--- a/src/components/ui/VnTree.vue
+++ b/src/components/ui/VnTree.vue
@@ -76,7 +76,7 @@ const removeNode = (node) => {
                 notify(t('department.departmentRemoved'), 'positive');
                 await fetchNodeLeaves(parentFk);
             } catch (err) {
-                console.log('Error removing department');
+                console.error('Error removing department');
             }
         });
 };
diff --git a/src/composables/downloadFile.js b/src/composables/downloadFile.js
index 45162f81b..12639dcd6 100644
--- a/src/composables/downloadFile.js
+++ b/src/composables/downloadFile.js
@@ -4,9 +4,8 @@ import { getUrl } from './getUrl';
 const { getTokenMultimedia } = useSession();
 const token = getTokenMultimedia();
 
-export async function downloadFile(dmsId, isDocuware = false) {
+export async function downloadFile(id, model = 'dms', urlPath = '/downloadFile', url) {
     let appUrl = await getUrl('', 'lilium');
     appUrl = appUrl.replace('/#/', '');
-    const urlPath = isDocuware ? '/docuwareDownload' : '/downloadFile';
-    window.open(`${appUrl}/api/dms/${dmsId}${urlPath}?access_token=${token}`);
+    window.open(url ?? `${appUrl}/api/${model}/${id}${urlPath}?access_token=${token}`);
 }
diff --git a/src/composables/getUrl.js b/src/composables/getUrl.js
index 7b7103562..1e6aec4c6 100644
--- a/src/composables/getUrl.js
+++ b/src/composables/getUrl.js
@@ -1,7 +1,4 @@
 import axios from 'axios';
-import useNotify from 'src/composables/useNotify.js';
-
-const { notify } = useNotify();
 
 export async function getUrl(route, app = 'salix') {
     let url;
@@ -11,24 +8,3 @@ export async function getUrl(route, app = 'salix') {
     });
     return url;
 }
-
-export async function getUrlFindOne(route, app = 'salix') {
-    try {
-        const env = process.env.NODE_ENV;
-
-        const filter = {
-            where: { and: [{ appName: app }, { environment: env }] },
-        };
-
-        const { data } = await axios.get('Urls/findOne', {
-            params: { filter: JSON.stringify(filter) },
-        });
-
-        if (!data) return null;
-
-        return data.url + route;
-    } catch (err) {
-        notify('Direction not found', 'negative');
-        console.error('Error finding url: ', err);
-    }
-}
diff --git a/src/composables/useArrayData.js b/src/composables/useArrayData.js
index b6b81f2d5..d32eeb32e 100644
--- a/src/composables/useArrayData.js
+++ b/src/composables/useArrayData.js
@@ -98,7 +98,7 @@ export function useArrayData(key, userOptions) {
 
         const { limit } = filter;
 
-        hasMoreData.value = response.data.length === limit;
+        hasMoreData.value = response.data.length >= limit;
 
         if (append) {
             if (!store.data) store.data = [];
diff --git a/src/i18n/en/index.js b/src/i18n/en/index.js
index ff86aec4c..793fc42fd 100644
--- a/src/i18n/en/index.js
+++ b/src/i18n/en/index.js
@@ -92,6 +92,8 @@ export default {
             log: 'Logs',
             parkingList: 'Parkings list',
         },
+        created: 'Created',
+        worker: 'Worker',
     },
     errors: {
         statusUnauthorized: 'Access denied',
diff --git a/src/i18n/es/index.js b/src/i18n/es/index.js
index fbf8bc230..74e289039 100644
--- a/src/i18n/es/index.js
+++ b/src/i18n/es/index.js
@@ -92,6 +92,8 @@ export default {
             log: 'Historial',
             parkingList: 'Listado de parkings',
         },
+        created: 'Fecha creación',
+        worker: 'Trabajador',
     },
     errors: {
         statusUnauthorized: 'Acceso denegado',
diff --git a/src/pages/Department/Card/DepartmentDescriptor.vue b/src/pages/Department/Card/DepartmentDescriptor.vue
index 7049d4145..e60a8c91b 100644
--- a/src/pages/Department/Card/DepartmentDescriptor.vue
+++ b/src/pages/Department/Card/DepartmentDescriptor.vue
@@ -63,7 +63,7 @@ const removeDepartment = () => {
                 router.push({ name: 'WorkerDepartment' });
                 notify('department.departmentRemoved', 'positive');
             } catch (err) {
-                console.log('Error removing department');
+                console.error('Error removing department');
             }
         });
 };
diff --git a/src/pages/Worker/Card/WorkerDms.vue b/src/pages/Worker/Card/WorkerDms.vue
index d0c5cf5e5..aef18d138 100644
--- a/src/pages/Worker/Card/WorkerDms.vue
+++ b/src/pages/Worker/Card/WorkerDms.vue
@@ -1,11 +1,14 @@
 <script setup>
 import VnDmsList from 'src/components/common/VnDmsList.vue';
+import { useRoute } from 'vue-router';
+const route = useRoute();
 </script>
 <template>
     <VnDmsList
-        model="WorkerDms"
+        :model="`WorkerDms/${route.params.id}/filter`"
         update-model="Workers"
+        download-model="WorkerDms"
         default-dms-code="hhrrData"
-        filter="workerFk"
+        filter="worker"
     />
 </template>

From e88194eb88235bca0a8b2a328e3b1a03a2d7393d Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Tue, 9 Apr 2024 16:00:12 -0300
Subject: [PATCH 5/8] Update worker dms model prop

---
 src/pages/Worker/Card/WorkerDms.vue | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/src/pages/Worker/Card/WorkerDms.vue b/src/pages/Worker/Card/WorkerDms.vue
index aef18d138..eee42857c 100644
--- a/src/pages/Worker/Card/WorkerDms.vue
+++ b/src/pages/Worker/Card/WorkerDms.vue
@@ -1,11 +1,10 @@
 <script setup>
 import VnDmsList from 'src/components/common/VnDmsList.vue';
-import { useRoute } from 'vue-router';
-const route = useRoute();
 </script>
+
 <template>
     <VnDmsList
-        :model="`WorkerDms/${route.params.id}/filter`"
+        model="WorkerDms"
         update-model="Workers"
         download-model="WorkerDms"
         default-dms-code="hhrrData"

From 39af4278a688309d5543f56a84da523a986f040f Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Wed, 10 Apr 2024 08:27:30 -0300
Subject: [PATCH 6/8] Add delete model to worker dms

---
 src/components/common/VnDmsList.vue | 6 +++++-
 src/pages/Worker/Card/WorkerDms.vue | 6 ++++--
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/src/components/common/VnDmsList.vue b/src/components/common/VnDmsList.vue
index 8c3ffc807..cc184703d 100644
--- a/src/components/common/VnDmsList.vue
+++ b/src/components/common/VnDmsList.vue
@@ -28,6 +28,10 @@ const $props = defineProps({
         type: String,
         default: null,
     },
+    deleteModel: {
+        type: String,
+        default: null,
+    },
     downloadModel: {
         type: String,
         required: false,
@@ -240,7 +244,7 @@ function deleteDms(dmsFk) {
             },
         })
         .onOk(async () => {
-            await axios.post(`${$props.model}/${dmsFk}/removeFile`);
+            await axios.post($props.deleteModel ?? `${$props.model}/${dmsFk}/removeFile`);
             const index = rows.value.findIndex((row) => row.id == dmsFk);
             rows.value.splice(index, 1);
         });
diff --git a/src/pages/Worker/Card/WorkerDms.vue b/src/pages/Worker/Card/WorkerDms.vue
index eee42857c..faf89b245 100644
--- a/src/pages/Worker/Card/WorkerDms.vue
+++ b/src/pages/Worker/Card/WorkerDms.vue
@@ -1,11 +1,13 @@
 <script setup>
 import VnDmsList from 'src/components/common/VnDmsList.vue';
+import { useRoute } from 'vue-router';
+const route = useRoute();
 </script>
-
 <template>
     <VnDmsList
-        model="WorkerDms"
+        :model="`WorkerDms/${route.params.id}/filter`"
         update-model="Workers"
+        :delete-model="`WorkerDms/${route.params.id}/removeFile`"
         download-model="WorkerDms"
         default-dms-code="hhrrData"
         filter="worker"

From 9ae79a5631639f023f175eb7d8996107a3394f82 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Wed, 10 Apr 2024 08:43:57 -0300
Subject: [PATCH 7/8] Add translation again

---
 src/i18n/es/index.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/i18n/es/index.js b/src/i18n/es/index.js
index 6d54e52ec..c19eb0764 100644
--- a/src/i18n/es/index.js
+++ b/src/i18n/es/index.js
@@ -865,6 +865,7 @@ export default {
             basicData: 'Datos básicos',
             notes: 'Notas',
             pda: 'PDA',
+            dms: 'Mi documentación',
             notifications: 'Notificaciones',
             pbx: 'Centralita',
             log: 'Historial',

From e676933942d9987894360c93e6dbbe021897c932 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Wed, 10 Apr 2024 08:59:05 -0300
Subject: [PATCH 8/8] Update worker dms remove

---
 src/components/common/VnDmsList.vue | 2 +-
 src/pages/Worker/Card/WorkerDms.vue | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/common/VnDmsList.vue b/src/components/common/VnDmsList.vue
index cc184703d..f70146c58 100644
--- a/src/components/common/VnDmsList.vue
+++ b/src/components/common/VnDmsList.vue
@@ -244,7 +244,7 @@ function deleteDms(dmsFk) {
             },
         })
         .onOk(async () => {
-            await axios.post($props.deleteModel ?? `${$props.model}/${dmsFk}/removeFile`);
+            await axios.post(`${$props.deleteModel ?? $props.model}/${dmsFk}/removeFile`);
             const index = rows.value.findIndex((row) => row.id == dmsFk);
             rows.value.splice(index, 1);
         });
diff --git a/src/pages/Worker/Card/WorkerDms.vue b/src/pages/Worker/Card/WorkerDms.vue
index faf89b245..a4f7ef5a9 100644
--- a/src/pages/Worker/Card/WorkerDms.vue
+++ b/src/pages/Worker/Card/WorkerDms.vue
@@ -7,7 +7,7 @@ const route = useRoute();
     <VnDmsList
         :model="`WorkerDms/${route.params.id}/filter`"
         update-model="Workers"
-        :delete-model="`WorkerDms/${route.params.id}/removeFile`"
+        delete-model="WorkerDms"
         download-model="WorkerDms"
         default-dms-code="hhrrData"
         filter="worker"