Merge pull request 'Se crea submodulo mis documentos en worker' (!253) from hyervoni/salix-front-mindshore:features/ms_19_worker_my_documents into dev

Reviewed-on: verdnatura/salix-front#253
Reviewed-by: Javi Gallego <jgallego@verdnatura.es>
Reviewed-by: Javier Segarra <jsegarra@verdnatura.es>
Reviewed-by: Alex Moreno <alexm@verdnatura.es>

src/components/common/VnDms.vue

@@ -198,11 +198,13 @@ function addDefaultData(data) {
 en:
     contentTypesInfo: Allowed file types {allowedContentTypes}
     EntryDmsDescription: Reference {reference}
+    WorkersDescription: Working of employee id {reference}
     SupplierDmsDescription: Reference {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}
     SupplierDmsDescription: Referencia {reference}
 
 </i18n>

src/components/common/VnDmsList.vue

@@ -5,9 +5,11 @@ 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';
 
 const route = useRoute();
@@ -26,6 +28,15 @@ const $props = defineProps({
         type: String,
         default: null,
     },
+    deleteModel: {
+        type: String,
+        default: null,
+    },
+    downloadModel: {
+        type: String,
+        required: false,
+        default: null,
+    },
     defaultDmsCode: {
         type: String,
         required: true,
@@ -74,7 +85,7 @@ const dmsFilter = {
             ],
         },
     },
-    order: ['dmsFk DESC'],
+    where: { [$props.filter]: route.params.id },
 };
 
 const columns = computed(() => [
@@ -94,12 +105,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',
@@ -117,6 +128,7 @@ const columns = computed(() => [
         label: t('globals.description'),
         name: 'description',
         component: 'span',
+        props: (prop) => ({ value: prop.value?.toUpperCase() }),
     },
     {
         align: 'left',
@@ -136,21 +148,53 @@ 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',
         components: [
             {
                 component: QBtn,
+                name: 'download',
+                isDocuware: true,
                 props: () => ({
                     icon: 'cloud_download',
                     flat: true,
                     color: 'primary',
                 }),
-                click: (prop) => downloadFile(prop.row.id),
+                click: (prop) =>
+                    downloadFile(
+                        prop.row.id,
+                        $props.downloadModel,
+                        null,
+                        prop.row.download
+                    ),
             },
             {
                 component: QBtn,
+                name: 'edit',
+                external: false,
                 props: () => ({
                     icon: 'edit',
                     flat: true,
@@ -160,6 +204,8 @@ const columns = computed(() => [
             },
             {
                 component: QBtn,
+                name: 'delete',
+                external: false,
                 props: () => ({
                     icon: 'delete',
                     flat: true,
@@ -167,12 +213,24 @@ const columns = computed(() => [
                 }),
                 click: (prop) => deleteDms(prop.row.id),
             },
+            {
+                component: QBtn,
+                name: 'open',
+                external: true,
+                props: () => ({
+                    icon: 'open_in_new',
+                    flat: true,
+                    color: 'primary',
+                }),
+                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;
 }
 
@@ -186,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);
         });
@@ -206,84 +264,106 @@ function parseDms(data) {
     }
     return data;
 }
+
+async function open(url) {
+    window.open(url).focus();
+}
+
+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">
+        <template #body>
-            <QTd :props="props">
+            <QTable
-                <QTr :props="props">
+                :columns="columns"
-                    <component
+                :rows="rows"
-                        v-if="props.col.component"
+                class="full-width q-mt-md"
-                        :is="props.col.component"
+                hide-bottom
-                        v-bind="props.col.props && props.col.props(props)"
+                row-key="clientFk"
-                    >
+                :grid="$q.screen.lt.sm"
-                        <span
+            >
-                            v-if="props.col.component == 'span'"
+                <template #body-cell="props">
-                            style="white-space: wrap"
+                    <QTd :props="props">
-                            >{{ props.value }}</span
+                        <QTr :props="props">
-                        >
+                            <component
-                    </component>
+                                v-if="props.col.component"
-                </QTr>
+                                :is="props.col.component"
-
+                                v-bind="props.col.props && props.col.props(props)"
-                <div class="flex justify-center" v-if="props.col.name == 'options'">
+                            >
-                    <div v-for="button of props.col.components" :key="button.id">
+                                <span
-                        <component
+                                    v-if="props.col.component == 'span'"
-                            :is="button.component"
+                                    style="white-space: wrap"
-                            v-bind="button.props(props)"
+                                    >{{ props.value }}</span
-                            @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"
                                 >
-                                    <component
+                            </component>
-                                        :is="button.component"
+                        </QTr>
-                                        v-bind="button.props(col)"
+
-                                        @click="button.click(col)"
+                        <div class="row no-wrap" v-if="props.col.name == 'options'">
-                                    />
+                            <div v-for="button of props.col.components" :key="button.id">
-                                </div>
+                                <component
+                                    v-if="
+                                        shouldRenderButton(button, props.row.isDocuware)
+                                    "
+                                    :is="button.component"
+                                    v-bind="button.props(props)"
+                                    @click="button.click(props)"
+                                />
                             </div>
-                        </QItem>
+                        </div>
-                    </QList>
+                    </QTd>
-                </QCard>
+                </template>
-            </div>
+                <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"

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>

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');
             }
         });
 };

src/composables/downloadFile.js

@@ -1,11 +1,11 @@
 import { useSession } from 'src/composables/useSession';
 import { getUrl } from './getUrl';
 
-const {getTokenMultimedia} = useSession();
+const { getTokenMultimedia } = useSession();
-const token =  getTokenMultimedia();
+const token = getTokenMultimedia();
 
-export async function downloadFile(dmsId) {
+export async function downloadFile(id, model = 'dms', urlPath = '/downloadFile', url) {
     let appUrl = await getUrl('', 'lilium');
     appUrl = appUrl.replace('/#/', '');
-    window.open(`${appUrl}/api/dms/${dmsId}/downloadFile?access_token=${token}`);
+    window.open(url ?? `${appUrl}/api/${model}/${id}${urlPath}?access_token=${token}`);
 }

src/composables/useArrayData.js

@@ -97,7 +97,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 = [];

src/i18n/en/index.js

@@ -91,6 +91,8 @@ export default {
             log: 'Logs',
             parkingList: 'Parkings list',
         },
+        created: 'Created',
+        worker: 'Worker',
     },
     errors: {
         statusUnauthorized: 'Access denied',
@@ -864,6 +866,7 @@ export default {
             basicData: 'Basic data',
             notes: 'Notes',
             pda: 'PDA',
+            dms: 'My documentation',
             notifications: 'Notifications',
             pbx: 'Private Branch Exchange',
             log: 'Log',

src/i18n/es/index.js

@@ -91,6 +91,8 @@ export default {
             log: 'Historial',
             parkingList: 'Listado de parkings',
         },
+        created: 'Fecha creación',
+        worker: 'Trabajador',
     },
     errors: {
         statusUnauthorized: 'Acceso denegado',
@@ -863,6 +865,7 @@ export default {
             basicData: 'Datos básicos',
             notes: 'Notas',
             pda: 'PDA',
+            dms: 'Mi documentación',
             notifications: 'Notificaciones',
             pbx: 'Centralita',
             log: 'Historial',

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');
             }
         });
 };

src/pages/Worker/Card/WorkerDms.vue

@@ -0,0 +1,15 @@
+<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`"
+        update-model="Workers"
+        delete-model="WorkerDms"
+        download-model="WorkerDms"
+        default-dms-code="hhrrData"
+        filter="worker"
+    />
+</template>

src/router/modules/worker.js

@@ -19,6 +19,7 @@ export default {
             'WorkerNotificationsManager',
             'WorkerPBX',
             'WorkerLog',
+            'WorkerDms',
         ],
         departmentCard: ['BasicData'],
     },
@@ -127,6 +128,15 @@ export default {
                     },
                     component: () => import('src/pages/Worker/Card/WorkerPBX.vue'),
                 },
+                {
+                    name: 'WorkerDms',
+                    path: 'dms',
+                    meta: {
+                        title: 'dms',
+                        icon: 'cloud_upload',
+                    },
+                    component: () => import('src/pages/Worker/Card/WorkerDms.vue'),
+                },
                 {
                     name: 'WorkerLog',
                     path: 'log',