Merge pull request '7199-devToTest_2316' (!282) from 7199-devToTest_2316 into test

Reviewed-on: verdnatura/salix-front#282 Reviewed-by: Carlos Satorres <carlossa@verdnatura.es>
2024-04-11 10:31:49 +00:00 · 2024-04-11 10:31:49 +00:00 · da8ed5d6b3
parent d98e5d78ff d99d934dab
commit da8ed5d6b3
47 changed files with 867 additions and 290 deletions
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@ -5,6 +5,14 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).

+## [2416.01] - 2024-04-18
+
+### Added
+
+### Fixed
+
+-   (General) => Se vuelven a mostrar los parámetros en la url al aplicar un filtro
+
 ## [2414.01] - 2024-04-04

 ### Added
--- a/cypress.config.js
+++ b/cypress.config.js
@ -3,6 +3,7 @@ const { defineConfig } = require('cypress');
 module.exports = defineConfig({
    e2e: {
        baseUrl: 'http://localhost:9000/',
+        experimentalStudio: true,
        fixturesFolder: 'test/cypress/fixtures',
        screenshotsFolder: 'test/cypress/screenshots',
        supportFile: 'test/cypress/support/index.js',
--- a/package.json
+++ b/package.json
@ -1,6 +1,6 @@
 {
    "name": "salix-front",
-    "version": "24.14.0",
+    "version": "24.16.0",
    "description": "Salix frontend",
    "productName": "Salix",
    "author": "Verdnatura",
--- a/src/components/CreateNewPostcodeForm.vue
+++ b/src/components/CreateNewPostcodeForm.vue
@ -28,8 +28,23 @@ const countriesOptions = ref([]);
 const provincesOptions = ref([]);
 const townsLocationOptions = ref([]);

-const onDataSaved = (dataSaved) => {
-    emit('onDataSaved', dataSaved);
+const onDataSaved = (formData) => {
+    const newPostcode = {
+        ...formData
+    };
+    const townObject = townsLocationOptions.value.find(
+        ({id}) => id === formData.townFk
+    );
+    newPostcode.town = townObject?.name;
+    const provinceObject = provincesOptions.value.find(
+        ({id}) => id === formData.provinceFk
+    );
+    newPostcode.province = provinceObject?.name;
+    const countryObject = countriesOptions.value.find(
+        ({id}) => id === formData.countryFk
+    );
+    newPostcode.country = countryObject?.country;
+    emit('onDataSaved', newPostcode);  
 };

 const onCityCreated = async ({ name, provinceFk }, formData) => {
@ -73,7 +88,7 @@ const onProvinceCreated = async ({ name }, formData) => {
        :title="t('New postcode')"
        :subtitle="t('Please, ensure you put the correct data!')"
        :form-initial-data="postcodeFormData"
-        @on-data-saved="onDataSaved($event)"
+        @on-data-saved="onDataSaved"
    >
        <template #form-inputs="{ data, validate }">
            <VnRow class="row q-gutter-md q-mb-md">
--- a/src/components/FetchData.vue
+++ b/src/components/FetchData.vue
@ -1,5 +1,5 @@
 <script setup>
-import { h, onMounted } from 'vue';
+import { onMounted } from 'vue';
 import axios from 'axios';

 const $props = defineProps({
--- a/src/components/FormModel.vue
+++ b/src/components/FormModel.vue
@ -101,8 +101,7 @@ onMounted(async () => {
 });

 onBeforeRouteLeave((to, from, next) => {
-    if (!hasChanges.value) next();
-
+    if (hasChanges.value)
        quasar.dialog({
            component: VnConfirm,
            componentProps: {
@ -111,6 +110,7 @@ onBeforeRouteLeave((to, from, next) => {
                promise: () => next(),
            },
        });
+    else next();
 });

 onUnmounted(() => {
@ -132,12 +132,12 @@ const formUrl = computed(() => $props.url);
 const defaultButtons = computed(() => ({
    save: {
        color: 'primary',
-        icon: 'restart_alt',
+        icon: 'save',
        label: 'globals.save',
    },
    reset: {
        color: 'primary',
-        icon: 'save',
+        icon: 'restart_alt',
        label: 'globals.reset',
    },
    ...$props.defaultButtons,
@ -227,6 +227,7 @@ watch(formUrl, async () => {
 defineExpose({
    save,
    isLoading,
+    hasChanges,
 });
 </script>
 <template>
@ -284,6 +285,9 @@ defineExpose({
    />
 </template>
 <style lang="scss" scoped>
+.q-notifications {
+    color: black;
+}
 #formModel {
    max-width: 800px;
    width: 100%;
--- a/src/components/FormModelPopup.vue
+++ b/src/components/FormModelPopup.vue
@ -78,6 +78,7 @@ defineExpose({
            <div class="q-mt-lg row justify-end">
                <QBtn
                    :label="t('globals.save')"
+                    :title="t('globals.save')"
                    type="submit"
                    color="primary"
                    :disabled="isLoading"
@ -85,6 +86,7 @@ defineExpose({
                />
                <QBtn
                    :label="t('globals.cancel')"
+                    :title="t('globals.cancel')"
                    type="reset"
                    color="primary"
                    flat
--- a/src/components/LeftMenuItem.vue
+++ b/src/components/LeftMenuItem.vue
@ -20,12 +20,7 @@ const itemComputed = computed(() => {
 });
 </script>
 <template>
-    <QItem
-        active-class="text-primary"
-        :to="{ name: itemComputed.name }"
-        clickable
-        v-ripple
-    >
+    <QItem active-class="bg-hover" :to="{ name: itemComputed.name }" clickable v-ripple>
        <QItemSection avatar v-if="itemComputed.icon">
            <QIcon :name="itemComputed.icon" />
        </QItemSection>
--- a/src/components/common/VnCurrency.vue
+++ b/src/components/common/VnCurrency.vue
@ -5,7 +5,7 @@ import { useCapitalize } from 'src/composables/useCapitalize';
 import VnInput from 'src/components/common/VnInput.vue';

 const props = defineProps({
-    modelValue: { type: String, default: '' },
+    modelValue: { type: [String, Number], default: '' },
 });

 const { t } = useI18n();
--- a/src/components/common/VnDms.vue
+++ b/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>
--- a/src/components/common/VnDmsList.vue
+++ b/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,16 +264,27 @@ 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
-    />
+    >
+        <template #body>
            <QTable
                :columns="columns"
                :rows="rows"
@ -240,9 +309,12 @@ function parseDms(data) {
                            </component>
                        </QTr>

-                <div class="flex justify-center" v-if="props.col.name == 'options'">
+                        <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)"
@ -272,6 +344,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)"
@ -284,6 +362,8 @@ function parseDms(data) {
                    </div>
                </template>
            </QTable>
+        </template>
+    </VnPaginate>
    <QDialog v-model="formDialog.show">
        <VnDms
            :model="updateModel ?? model"
--- a/src/components/common/VnLocation.vue
+++ b/src/components/common/VnLocation.vue
@ -88,6 +88,10 @@ function locationFilter(search = '') {
 function handleFetch(data) {
    postcodesOptions.value = data;
 }
+function onDataSaved(newPostcode) {
+    postcodesOptions.value.push(newPostcode);
+    value.value = newPostcode.code;
+}
 </script>
 <template>
    <FetchData
@ -111,11 +115,13 @@ function handleFetch(data) {
        clearable
    >
        <template #form>
-            <CreateNewPostcode @on-data-saved="locationFilter()" />
+            <CreateNewPostcode
+                @on-data-saved="onDataSaved"
+            />
        </template>
        <template #option="{ itemProps, opt }">
            <QItem v-bind="itemProps">
-                <QItemSection v-if="opt">
+                <QItemSection v-if="opt.code">
                    <QItemLabel>{{ opt.code }}</QItemLabel>
                    <QItemLabel caption>{{ showLabel(opt) }}</QItemLabel>
                </QItemSection>
--- a/src/components/common/VnLog.vue
+++ b/src/components/common/VnLog.vue
@ -1030,7 +1030,7 @@ en:
        ticketCreated: Created
        created: Created
        isChargedToMana: Charged to mana
-        hasToPickUp: Has to pick Up
+        pickup: Type of pickup
        dmsFk: Document ID
        text: Description
        claimStateFk: Claim State
@ -1069,7 +1069,7 @@ es:
        ticketCreated: Creado
        created: Creado
        isChargedToMana: Cargado a maná
-        hasToPickUp: Se debe recoger
+        pickup: Se debe recoger
        dmsFk: ID documento
        text: Descripción
        claimStateFk: Estado de la reclamación
--- a/src/components/ui/CardDescriptor.vue
+++ b/src/components/ui/CardDescriptor.vue
@ -157,7 +157,7 @@ const emit = defineEmits(['onFetch']);
            <div class="icons">
                <slot name="icons" :entity="entity" />
            </div>
-            <div class="actions">
+            <div class="actions justify-center">
                <slot name="actions" :entity="entity" />
            </div>
            <slot name="after" />
@ -176,22 +176,23 @@ const emit = defineEmits(['onFetch']);
 .body {
    background-color: var(--vn-section-color);
    .text-h5 {
+        font-size: 20px;
        padding-top: 5px;
-        padding-bottom: 5px;
+        padding-bottom: 0px;
    }
    .q-item {
        min-height: 20px;

        .link {
-            margin-left: 5px;
+            margin-left: 10px;
        }
    }
    .vn-label-value {
        display: flex;
-        padding: 2px 16px;
+        padding: 0px 16px;
        .label {
            color: var(--vn-label-color);
-            font-size: 12px;
+            font-size: 14px;

            &:not(:has(a))::after {
                content: ':';
@ -200,7 +201,7 @@ const emit = defineEmits(['onFetch']);
        .value {
            color: var(--vn-text-color);
            font-size: 14px;
-            margin-left: 12px;
+            margin-left: 4px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
@ -218,18 +219,19 @@ const emit = defineEmits(['onFetch']);
    overflow: hidden;
    text-overflow: ellipsis;
    span {
-        color: $primary;
+        color: var(--vn-text-color);
        font-weight: bold;
    }
 }
 .subtitle {
    color: var(--vn-text-color);
    font-size: 16px;
-    margin-bottom: 15px;
+    margin-bottom: 2px;
 }
 .list-box {
    .q-item__label {
        color: var(--vn-label-color);
+        padding-bottom: 0%;
    }
 }
 .descriptor {
@ -247,6 +249,7 @@ const emit = defineEmits(['onFetch']);
    }
    .actions {
        margin: 0 5px;
+        justify-content: center !important;
    }
 }
 </style>
--- a/src/components/ui/CardSummary.vue
+++ b/src/components/ui/CardSummary.vue
@ -74,7 +74,7 @@ async function fetch() {
                        </router-link>
                        <span v-else></span>
                    </slot>
-                    <slot name="header" :entity="entity">
+                    <slot name="header" :entity="entity" dense>
                        <VnLv :label="`${entity.id} -`" :value="entity.name" />
                    </slot>
                    <slot name="header-right">
@ -97,7 +97,6 @@ async function fetch() {

 .cardSummary {
    width: 100%;
-
    .summaryHeader {
        text-align: center;
        font-size: 20px;
@ -132,6 +131,7 @@ async function fetch() {
            padding: 7px;
            font-size: 16px;
            min-width: 275px;
+            box-shadow: none;

            .vn-label-value {
                display: flex;
--- a/src/components/ui/VnLinkPhone.vue
+++ b/src/components/ui/VnLinkPhone.vue
@ -15,7 +15,6 @@ const { t } = useI18n();
        color="primary"
        padding="none"
        :href="`sip:${props.phoneNumber}`"
-        :title="t('globals.microsip')"
        @click.stop
    />
 </template>
--- a/src/components/ui/VnPaginate.vue
+++ b/src/components/ui/VnPaginate.vue
@ -78,6 +78,7 @@ const arrayData = useArrayData(props.dataKey, {
    userParams: props.userParams,
    exprBuilder: props.exprBuilder,
 });
+const hasMoreData = ref();
 const store = arrayData.store;

 onMounted(() => {
@ -106,11 +107,10 @@ async function paginate() {

    isLoading.value = true;
    await arrayData.loadMore();
-
    if (!arrayData.hasMoreData.value) {
        if (store.userParamsChanged) arrayData.hasMoreData.value = true;
        store.userParamsChanged = false;
-        isLoading.value = false;
+        endPagination();
        return;
    }

@ -120,12 +120,15 @@ async function paginate() {
    pagination.value.sortBy = sortBy;
    pagination.value.descending = descending;

-    isLoading.value = false;
+    endPagination();
+}

+function endPagination() {
+    hasMoreData.value = arrayData.hasMoreData.value;
+    isLoading.value = false;
    emit('onFetch', store.data);
    emit('onPaginate');
 }
-
 async function onLoad(index, done) {
    if (!store.data) {
        return done();
@ -188,6 +191,9 @@ async function onLoad(index, done) {
            <QSpinner color="orange" size="md" />
        </div>
    </QInfiniteScroll>
+    <div v-if="!isLoading && 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 +210,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>
--- a/src/components/ui/VnSubToolbar.vue
+++ b/src/components/ui/VnSubToolbar.vue
@ -14,7 +14,7 @@ onUnmounted(() => {
 </script>

 <template>
-    <QToolbar class="justify-end sticky">
+    <QToolbar class="bg-vn-section-color justify-end sticky">
        <slot name="st-data">
            <div id="st-data"></div>
        </slot>
@ -24,6 +24,11 @@ onUnmounted(() => {
        </slot>
    </QToolbar>
 </template>
+<style lang="scss">
+.q-toolbar {
+    background: var(--vn-section-color);
+}
+</style>
 <style lang="scss" scoped>
 .sticky {
    position: sticky;
--- 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');
            }
        });
 };
--- a/src/composables/downloadFile.js
+++ b/src/composables/downloadFile.js
@ -4,8 +4,8 @@ import { getUrl } from './getUrl';
 const { getTokenMultimedia } = useSession();
 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}`);
 }
--- a/src/composables/useArrayData.js
+++ b/src/composables/useArrayData.js
@ -1,5 +1,5 @@
 import { onMounted, ref, computed } from 'vue';
-import { useRouter, useRoute } from 'vue-router';
+import { useRoute } from 'vue-router';
 import axios from 'axios';
 import { useArrayDataStore } from 'stores/useArrayDataStore';
 import { buildFilter } from 'filters/filterPanel';
@ -15,7 +15,6 @@ export function useArrayData(key, userOptions) {

    const store = arrayDataStore.get(key);
    const hasMoreData = ref(false);
-    const router = useRouter();
    const route = useRoute();
    let canceller = null;

@ -98,14 +97,14 @@ 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 = [];
            for (const row of response.data) store.data.push(row);
        } else {
            store.data = response.data;
-            if (!document.querySelectorAll('[role="dialog"]'))
+            if (!document.querySelectorAll('[role="dialog"]').length)
                updateRouter && updateStateParams();
        }

@ -188,11 +187,15 @@ export function useArrayData(key, userOptions) {
        if (store.userParams && Object.keys(store.userParams).length !== 0)
            query.params = JSON.stringify(store.userParams);

-        if (router)
-            router.replace({
-                path: route.path,
-                query: query,
-            });
+        const url = new URL(window.location.href);
+        const { hash: currentHash } = url;
+        const [currentRoute] = currentHash.split('?');
+
+        const params = new URLSearchParams();
+        for (const param in query) params.append(param, query[param]);
+
+        url.hash = currentRoute + '?' + params.toString();
+        window.history.pushState({}, '', url.hash);
    }

    const totalRows = computed(() => (store.data && store.data.length) || 0);
--- a/src/css/app.scss
+++ b/src/css/app.scss
@ -14,21 +14,15 @@ body.body--light {
    .q-header .q-toolbar {
        color: var(--font-color);
    }
-    .q-card,
-    .q-table,
-    .q-table__bottom,
-    .q-drawer {
-        background-color: var(--vn-section-color);
 }
-}
-
 body.body--dark {
-    --vn-section-color: #403c3c;
+    --vn-page-color: #222;
+    --vn-section-color: #3d3d3d;
    --vn-text-color: white;
    --vn-label-color: #a8a8a8;
    --vn-accent-color: #424242;

-    background-color: #222;
+    background-color: var(--vn-page-color);
 }

 a {
@ -76,6 +70,9 @@ select:-webkit-autofill {
 .bg-vn-section-color {
    background-color: var(--vn-section-color);
 }
+.bg-hover {
+    background-color: #666666;
+}

 .color-vn-text {
    color: var(--vn-text-color);
@ -85,6 +82,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);
@ -118,9 +120,36 @@ select:-webkit-autofill {
    content: ' *';
 }

-.q-chip {
+.q-card,
+.q-table,
+.q-table__bottom,
+.q-drawer {
+    background-color: var(--vn-section-color);
+}
+
+.q-chip,
+.q-notification__message,
+.q-notification__icon {
    color: black;
 }
+.q-notification--standard.bg-negative {
+    background-color: #fa3939 !important;
+}
+.q-notification--standard.bg-positive {
+    background-color: #a3d131 !important;
+}
+
+.q-tooltip {
+    background-color: var(--vn-page-color);
+    color: var(--font-color);
+    font-size: medium;
+}
+
+.q-card__actions {
+    justify-content: center;
+}
+
+/* q-notification row items-stretch q-notification--standard bg-negative text-white */

 input[type='number'] {
    -moz-appearance: textfield;
--- a/src/css/quasar.variables.scss
+++ b/src/css/quasar.variables.scss
@ -22,7 +22,7 @@ $warning: #f4b974;
 $success: $positive;
 $alert: $negative;
 $white: #fff;
-$dark: #3c3b3b;
+$dark: #3d3d3d;
 // custom
 $color-link: #66bfff;
 $color-spacer-light: #a3a3a31f;
--- a/src/i18n/en/index.js
+++ b/src/i18n/en/index.js
@ -48,7 +48,6 @@ export default {
        today: 'Today',
        yesterday: 'Yesterday',
        dateFormat: 'en-GB',
-        microsip: 'Open in MicroSIP',
        noSelectedRows: `You don't have any line selected`,
        downloadCSVSuccess: 'CSV downloaded successfully',
        reference: 'Reference',
@ -92,6 +91,8 @@ export default {
            log: 'Logs',
            parkingList: 'Parkings list',
        },
+        created: 'Created',
+        worker: 'Worker',
    },
    errors: {
        statusUnauthorized: 'Access denied',
@ -545,6 +546,7 @@ export default {
            assignedTo: 'Assigned',
            attendedBy: 'Attended by',
            created: 'Created',
+            pickup: 'Pickup',
            state: 'State',
            details: 'Details',
            item: 'Item',
@ -566,13 +568,19 @@ export default {
            responsible: 'Responsible',
            worker: 'Worker',
            redelivery: 'Redelivery',
+            null: 'No',
+            agency: 'Agency',
+            delivery: 'Delivery',
        },
        basicData: {
            customer: 'Customer',
            assignedTo: 'Assigned',
            created: 'Created',
            state: 'State',
-            picked: 'Picked',
+            pickup: 'Pickup',
+            null: 'No',
+            agency: 'Agency',
+            delivery: 'Delivery',
        },
        photo: {
            fileDescription: 'Claim id {claimId} from client {clientName} id {clientId}',
@ -852,12 +860,15 @@ export default {
        pageTitles: {
            workers: 'Workers',
            list: 'List',
-            basicData: 'Basic data',
            summary: 'Summary',
-            notifications: 'Notifications',
            workerCreate: 'New worker',
            department: 'Department',
+            basicData: 'Basic data',
+            notes: 'Notes',
            pda: 'PDA',
+            dms: 'My documentation',
+            notifications: 'Notifications',
+            pbx: 'Private Branch Exchange',
            log: 'Log',
        },
        list: {
--- a/src/i18n/es/index.js
+++ b/src/i18n/es/index.js
@ -49,7 +49,6 @@ export default {
        yesterday: 'Ayer',
        dateFormat: 'es-ES',
        noSelectedRows: `No tienes ninguna línea seleccionada`,
-        microsip: 'Abrir en MicroSIP',
        downloadCSVSuccess: 'Descarga de CSV exitosa',
        reference: 'Referencia',
        agency: 'Agencia',
@ -92,6 +91,8 @@ export default {
            log: 'Historial',
            parkingList: 'Listado de parkings',
        },
+        created: 'Fecha creación',
+        worker: 'Trabajador',
    },
    errors: {
        statusUnauthorized: 'Acceso denegado',
@ -544,6 +545,7 @@ export default {
            assignedTo: 'Asignada a',
            attendedBy: 'Atendida por',
            created: 'Creada',
+            pickup: 'Recogida',
            state: 'Estado',
            details: 'Detalles',
            item: 'Artículo',
@ -565,13 +567,19 @@ export default {
            responsible: 'Responsable',
            worker: 'Trabajador',
            redelivery: 'Devolución',
+            null: 'No',
+            agency: 'Agencia',
+            delivery: 'Reparto',
        },
        basicData: {
            customer: 'Cliente',
            assignedTo: 'Asignada a',
            created: 'Creada',
            state: 'Estado',
-            picked: 'Recogida',
+            pickup: 'Recogida',
+            null: 'No',
+            agency: 'Agencia',
+            delivery: 'Reparto',
        },
        photo: {
            fileDescription:
@ -851,12 +859,15 @@ export default {
        pageTitles: {
            workers: 'Trabajadores',
            list: 'Listado',
-            basicData: 'Datos básicos',
            summary: 'Resumen',
-            notifications: 'Notificaciones',
            workerCreate: 'Nuevo trabajador',
            department: 'Departamentos',
+            basicData: 'Datos básicos',
+            notes: 'Notas',
            pda: 'PDA',
+            dms: 'Mi documentación',
+            notifications: 'Notificaciones',
+            pbx: 'Centralita',
            log: 'Historial',
        },
        list: {
--- a/src/pages/Claim/Card/ClaimBasicData.vue
+++ b/src/pages/Claim/Card/ClaimBasicData.vue
@ -9,6 +9,7 @@ import VnRow from 'components/ui/VnRow.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 import VnInputDate from 'components/common/VnInputDate.vue';

+import axios from 'axios';
 import { useSession } from 'src/composables/useSession';

 const route = useRoute();
@ -24,7 +25,7 @@ const claimFilter = {
        'workerFk',
        'claimStateFk',
        'packages',
-        'hasToPickUp',
+        'pickup',
    ],
    include: [
        {
@ -50,6 +51,20 @@ function setClaimStates(data) {
    claimStates.value = data;
    claimStatesCopy.value = data;
 }
+let optionsList;
+async function getEnumValues() {
+    optionsList = [{ id: null, description: t('claim.basicData.null') }];
+    const { data } = await axios.get(`Applications/get-enum-values`, {
+        params: {
+            schema: 'vn',
+            table: 'claim',
+            column: 'pickup',
+        },
+    });
+    for (let value of data)
+        optionsList.push({ id: value, description: t(`claim.basicData.${value}`) });
+}
+getEnumValues();

 const workerFilter = {
    options: workers,
@ -168,13 +183,19 @@ const statesFilter = {
                        type="number"
                    />
                </div>
-            </VnRow>
-            <VnRow class="row q-gutter-md q-mb-md">
                <div class="col">
-                    <QCheckbox
-                        v-model="data.hasToPickUp"
-                        :label="t('claim.basicData.picked')"
-                    />
+                    <QSelect
+                        v-model="data.pickup"
+                        :options="optionsList"
+                        option-value="id"
+                        option-label="description"
+                        emit-value
+                        :label="t('claim.basicData.pickup')"
+                        map-options
+                        use-input
+                        :input-debounce="0"
+                    >
+                    </QSelect>
                </div>
            </VnRow>
        </template>
--- a/src/pages/Claim/Card/ClaimSummary.vue
+++ b/src/pages/Claim/Card/ClaimSummary.vue
@ -220,10 +220,9 @@ function openDialog(dmsId) {
                        />
                    </template>
                </VnLv>
-                <QCheckbox
-                    :label="t('claim.basicData.picked')"
-                    v-model="claim.hasToPickUp"
-                    :disable="true"
+                <VnLv
+                    :label="t('claim.summary.pickup')"
+                    :value="t(`claim.summary.${claim.pickup}`)"
                />
            </QCard>
            <QCard class="vn-three">
--- 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');
            }
        });
 };
--- a/src/pages/InvoiceIn/Card/InvoiceInVat.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInVat.vue
@ -32,6 +32,13 @@ const invoiceInFormRef = ref();
 const expensesRef = ref();
 const newExpenseRef = ref();

+defineProps({
+    actionIcon: {
+        type: String,
+        default: 'add',
+    },
+});
+
 const columns = computed(() => [
    {
        name: 'expense',
@ -207,17 +214,16 @@ async function addExpense() {
                                    @click.stop="value = null"
                                    class="cursor-pointer"
                                />
-                                <QBtn
-                                    padding="xs"
-                                    round
-                                    flat
-                                    icon="add_circle"
-                                    @click.stop="newExpenseRef.show()"
+                                <QIcon
+                                    @click.stop.prevent="newExpenseRef.show()"
+                                    :name="actionIcon"
+                                    size="xs"
+                                    class="default-icon"
                                >
                                    <QTooltip>
                                        {{ t('Create expense') }}
                                    </QTooltip>
-                                </QBtn>
+                                </QIcon>
                            </template>
                        </VnSelectFilter>
                    </QTd>
@ -470,6 +476,11 @@ async function addExpense() {
 .q-item {
    min-height: 0;
 }
+.default-icon {
+    cursor: pointer;
+    border-radius: 50px;
+    background-color: $primary;
+}
 </style>
 <i18n>
 es:
--- a/src/pages/InvoiceIn/InvoiceInFilter.vue
+++ b/src/pages/InvoiceIn/InvoiceInFilter.vue
@ -29,6 +29,7 @@ const suppliersRef = ref();
        order="nickname"
        limit="30"
        @on-fetch="(data) => (suppliers = data)"
+        auto-load
    />
    <VnFilterPanel :data-key="props.dataKey" :search-button="true">
        <template #tags="{ tag, formatFn }">
@ -38,46 +39,6 @@ const suppliersRef = ref();
            </div>
        </template>
        <template #body="{ params, searchFn }">
-            <QItem>
-                <QItemSection>
-                    <VnInput
-                        :label="t('Id or Supplier')"
-                        v-model="params.search"
-                        is-outlined
-                    >
-                        <template #prepend>
-                            <QIcon name="badge" size="sm"></QIcon>
-                        </template>
-                    </VnInput>
-                </QItemSection>
-            </QItem>
-            <QItem>
-                <QItemSection>
-                    <VnInput
-                        :label="useCapitalize(t('params.correctedFk'))"
-                        v-model="params.correctedFk"
-                        is-outlined
-                    >
-                        <template #prepend>
-                            <QIcon name="attachment" size="sm" />
-                        </template>
-                    </VnInput>
-                </QItemSection>
-            </QItem>
-            <QItem>
-                <QItemSection>
-                    <VnInput
-                        :label="t('params.supplierRef')"
-                        v-model="params.supplierRef"
-                        is-outlined
-                        lazy-rules
-                    >
-                        <template #prepend>
-                            <QIcon name="vn:client" size="sm"></QIcon>
-                        </template>
-                    </VnInput>
-                </QItemSection>
-            </QItem>
            <QItem>
                <QItemSection>
                    <VnSelectFilter
@ -97,29 +58,29 @@ const suppliersRef = ref();
            <QItem>
                <QItemSection>
                    <VnInput
-                        :label="t('params.fi')"
-                        v-model="params.fi"
+                        :label="t('params.supplierRef')"
+                        v-model="params.supplierRef"
                        is-outlined
                        lazy-rules
                    >
                        <template #prepend>
-                            <QIcon name="badge" size="sm"></QIcon>
+                            <QIcon name="vn:client" size="sm"></QIcon>
                        </template>
                    </VnInput>
                </QItemSection>
            </QItem>
            <QItem>
                    <QItemSection>
-                    <VnInput
-                        :label="t('params.serialNumber')"
-                        v-model="params.serialNumber"
+                        <VnInputDate
+                            :label="t('From')"
+                            v-model="params.from"
                            is-outlined
-                        lazy-rules
-                    >
-                        <template #prepend>
-                            <QIcon name="badge" size="sm"></QIcon>
-                        </template>
-                    </VnInput>
+                        />
+                    </QItemSection>
+                </QItem>
+                <QItem>
+                    <QItemSection>
+                        <VnInputDate :label="t('To')" v-model="params.to" is-outlined />
                    </QItemSection>
                </QItem>
            <QItem>
@ -152,6 +113,34 @@ const suppliersRef = ref();
                </QItemSection>
            </QItem>
            <QExpansionItem :label="t('More options')" expand-separator>
+                <QItem>
+                <QItemSection>
+                    <VnInput
+                        :label="t('params.fi')"
+                        v-model="params.fi"
+                        is-outlined
+                        lazy-rules
+                    >
+                        <template #prepend>
+                            <QIcon name="badge" size="sm"></QIcon>
+                        </template>
+                    </VnInput>
+                </QItemSection>
+            </QItem>
+            <QItem>
+                <QItemSection>
+                    <VnInput
+                        :label="t('params.serialNumber')"
+                        v-model="params.serialNumber"
+                        is-outlined
+                        lazy-rules
+                    >
+                        <template #prepend>
+                            <QIcon name="badge" size="sm"></QIcon>
+                        </template>
+                    </VnInput>
+                </QItemSection>
+            </QItem>
                <QItem>
                    <QItemSection>
                        <VnInput
@ -180,20 +169,6 @@ const suppliersRef = ref();
                        </VnInput>
                    </QItemSection>
                </QItem>
-                <QItem>
-                    <QItemSection>
-                        <VnInputDate
-                            :label="t('From')"
-                            v-model="params.from"
-                            is-outlined
-                        />
-                    </QItemSection>
-                </QItem>
-                <QItem>
-                    <QItemSection>
-                        <VnInputDate :label="t('To')" v-model="params.to" is-outlined />
-                    </QItemSection>
-                </QItem>
                <QItem>
                    <QItemSection>
                        <VnInputDate
--- a/src/pages/Login/LoginMain.vue
+++ b/src/pages/Login/LoginMain.vue
@ -55,7 +55,7 @@ async function onSubmit() {
        if (res.response?.data?.error?.code === 'REQUIRES_2FA') {
            Notify.create({
                message: t('login.twoFactorRequired'),
-                icon: 'phonelink_lock',
+                icon: 'phoneLink_lock',
                type: 'warning',
            });
            params.keepLogin = keepLogin.value;
--- a/src/pages/Route/RouteRoadmap.vue
+++ b/src/pages/Route/RouteRoadmap.vue
@ -277,7 +277,6 @@ function navigateToRoadmapSummary(event, row) {
 .route-list {
    width: 100%;
 }
-
 .table-actions {
    gap: 12px;
 }
--- a/src/pages/Worker/Card/WorkerBasicData.vue
+++ b/src/pages/Worker/Card/WorkerBasicData.vue
@ -0,0 +1,168 @@
+<script setup>
+import { ref } from 'vue';
+import { useRoute } from 'vue-router';
+import { useI18n } from 'vue-i18n';
+
+import FetchData from 'components/FetchData.vue';
+import FormModel from 'src/components/FormModel.vue';
+import VnRow from 'components/ui/VnRow.vue';
+import VnInput from 'src/components/common/VnInput.vue';
+import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
+
+const route = useRoute();
+const { t } = useI18n();
+
+const workersOptions = ref([]);
+const countriesOptions = ref([]);
+const educationLevelsOptions = ref([]);
+
+const workerFilter = {
+    include: [
+        {
+            relation: 'user',
+            scope: {
+                fields: ['name', 'emailVerified'],
+                include: { relation: 'emailUser', scope: { fields: ['email'] } },
+            },
+        },
+        { relation: 'sip', scope: { fields: ['extension', 'secret'] } },
+        { relation: 'department', scope: { include: { relation: 'department' } } },
+    ],
+};
+const workersFilter = {
+    fields: ['id', 'nickname'],
+    order: 'nickname ASC',
+    limit: 30,
+};
+const countriesFilter = {
+    fields: ['id', 'country', 'code'],
+    order: 'country ASC',
+    limit: 30,
+};
+const educationLevelsFilter = { fields: ['id', 'name'], order: 'name ASC', limit: 30 };
+
+const maritalStatus = [
+    { code: 'M', name: t('Married') },
+    { code: 'S', name: t('Single') },
+];
+</script>
+
+<template>
+    <FetchData
+        :filter="workersFilter"
+        @on-fetch="(data) => (workersOptions = data)"
+        auto-load
+        url="Workers/search"
+    />
+    <FetchData
+        :filter="countriesFilter"
+        @on-fetch="(data) => (countriesOptions = data)"
+        auto-load
+        url="Countries"
+    />
+    <FetchData
+        :filter="educationLevelsFilter"
+        @on-fetch="(data) => (educationLevelsOptions = data)"
+        auto-load
+        url="EducationLevels"
+    />
+
+    <FormModel
+        :filter="workerFilter"
+        :url="`Workers/${route.params.id}`"
+        auto-load
+        model="Worker"
+    >
+        <template #form="{ data }">
+            <VnRow class="row q-gutter-md q-mb-md">
+                <VnInput :label="t('Name')" clearable v-model="data.firstName" />
+                <VnInput :label="t('Last name')" clearable v-model="data.lastName" />
+            </VnRow>
+
+            <VnRow class="row q-gutter-md q-mb-md">
+                <VnInput v-model="data.phone" :label="t('Business phone')" clearable />
+                <VnInput
+                    v-model="data.mobileExtension"
+                    :label="t('Mobile extension')"
+                    clearable
+                />
+            </VnRow>
+
+            <VnRow class="row q-gutter-md q-mb-md">
+                <VnSelectFilter
+                    :label="t('Boss')"
+                    :options="workersOptions"
+                    hide-selected
+                    option-label="nickname"
+                    option-value="id"
+                    v-model="data.bossFk"
+                >
+                    <template #option="scope">
+                        <QItem v-bind="scope.itemProps">
+                            <QItemSection>
+                                <QItemLabel>{{ scope.opt?.name }}</QItemLabel>
+                                <QItemLabel caption>
+                                    {{ scope.opt?.nickname }},
+                                    {{ scope.opt?.code }}
+                                </QItemLabel>
+                            </QItemSection>
+                        </QItem>
+                    </template>
+                </VnSelectFilter>
+                <VnSelectFilter
+                    :label="t('Marital status')"
+                    :options="maritalStatus"
+                    hide-selected
+                    option-label="name"
+                    option-value="code"
+                    v-model="data.maritalStatus"
+                />
+            </VnRow>
+
+            <VnRow class="row q-gutter-md q-mb-md">
+                <VnSelectFilter
+                    :label="t('Origin country')"
+                    :options="countriesOptions"
+                    hide-selected
+                    option-label="country"
+                    option-value="id"
+                    v-model="data.originCountryFk"
+                />
+                <VnSelectFilter
+                    :label="t('Education level')"
+                    :options="educationLevelsOptions"
+                    hide-selected
+                    option-label="name"
+                    option-value="id"
+                    v-model="data.educationLevelFk"
+                />
+            </VnRow>
+
+            <VnRow class="row q-gutter-md q-mb-md">
+                <VnInput v-model="data.SSN" :label="t('SSN')" clearable />
+                <VnInput
+                    v-model="data.locker"
+                    type="number"
+                    :label="t('Locker')"
+                    clearable
+                />
+            </VnRow>
+        </template>
+    </FormModel>
+</template>
+
+<i18n>
+es:
+    Name: Nombre
+    Last name: Apellidos
+    Business phone: Teléfono de empresa
+    Mobile extension: Extensión móvil
+    Boss: Jefe
+    Marital status: Estado civil
+    Married: Casado/a
+    Single: Soltero/a
+    Origin country: País origen
+    Education level: Nivel educación
+    SSN: NSS
+    Locker: Taquilla
+</i18n>
--- a/src/pages/Worker/Card/WorkerDescriptor.vue
+++ b/src/pages/Worker/Card/WorkerDescriptor.vue
@ -1,5 +1,5 @@
 <script setup>
-import { computed, ref } from 'vue';
+import { computed, ref, watch } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 import { useSession } from 'src/composables/useSession';
@ -7,6 +7,7 @@ import CardDescriptor from 'src/components/ui/CardDescriptor.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 import VnLinkPhone from 'src/components/ui/VnLinkPhone.vue';
 import useCardDescription from 'src/composables/useCardDescription';
+import { useState } from 'src/composables/useState';

 const $props = defineProps({
    id: {
@ -23,6 +24,7 @@ const $props = defineProps({
 const route = useRoute();
 const { t } = useI18n();
 const { getTokenMultimedia } = useSession();
+const state = useState();

 const entityId = computed(() => {
    return $props.id || route.params.id;
@ -53,7 +55,18 @@ const filter = {
    ],
 };

-const sip = computed(() => worker.value?.sip && worker.value.sip.extension);
+const sip = ref(null);
+
+watch(
+    () => [worker.value?.sip?.extension, state.get('extension')],
+    ([newWorkerSip, newStateExtension], [oldWorkerSip, oldStateExtension]) => {
+        if (newStateExtension !== oldStateExtension || sip.value === oldStateExtension) {
+            sip.value = newStateExtension;
+        } else if (newWorkerSip !== oldWorkerSip && sip.value !== newStateExtension) {
+            sip.value = newWorkerSip;
+        }
+    }
+);

 function getWorkerAvatar() {
    const token = getTokenMultimedia();
--- a/src/pages/Worker/Card/WorkerDms.vue
+++ b/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>
--- a/src/pages/Worker/Card/WorkerNotes.vue
+++ b/src/pages/Worker/Card/WorkerNotes.vue
@ -0,0 +1,38 @@
+<script setup>
+import { useRoute } from 'vue-router';
+
+import VnNotes from 'src/components/ui/VnNotes.vue';
+
+const route = useRoute();
+
+const filter = {
+    order: 'created DESC',
+    where: { workerFk: route.params.id },
+    include: {
+        relation: 'worker',
+        scope: {
+            fields: ['id', 'firstName', 'lastName'],
+            include: {
+                relation: 'user',
+                scope: {
+                    fields: ['id', 'nickname'],
+                },
+            },
+        },
+    },
+};
+
+const body = {
+    workerFk: route.params.id,
+};
+</script>
+
+<template>
+    <VnNotes
+        style="overflow-y: auto"
+        :add-note="{ type: Boolean, default: true }"
+        url="WorkerObservations"
+        :filter="filter"
+        :body="body"
+    />
+</template>
--- a/src/pages/Worker/Card/WorkerPBX.vue
+++ b/src/pages/Worker/Card/WorkerPBX.vue
@ -0,0 +1,70 @@
+<script setup>
+import { watch, ref } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { useRoute } from 'vue-router';
+
+import { useState } from 'src/composables/useState';
+
+import FormModel from 'src/components/FormModel.vue';
+import VnRow from 'components/ui/VnRow.vue';
+import VnInput from 'src/components/common/VnInput.vue';
+
+const { t } = useI18n();
+const state = useState();
+const route = useRoute();
+const workerPBXForm = ref();
+const extension = ref(null);
+
+const filter = {
+    include: [
+        {
+            relation: 'sip',
+        },
+    ],
+};
+
+watch(
+    () => route.params.id,
+    () => state.set('extension', null)
+);
+
+const onFetch = (data) => {
+    state.set('extension', data?.sip?.extension);
+    extension.value = state.get('extension');
+};
+
+const updateModelValue = (data) => {
+    state.set('extension', data);
+    workerPBXForm.value.hasChanges = true;
+};
+</script>
+
+<template>
+    <FormModel
+        ref="workerPBXForm"
+        :filter="filter"
+        :url="`Workers/${route.params.id}`"
+        url-update="Sips"
+        auto-load
+        :mapper="
+            () => ({
+                userFk: +route.params.id,
+                extension,
+            })
+        "
+        model="DeviceProductionUser"
+        @on-fetch="onFetch"
+    >
+        <template #form="{}">
+            <VnRow class="row q-gutter-md q-mb-md">
+                <div class="col">
+                    <VnInput
+                        :label="t('worker.summary.sipExtension')"
+                        v-model="extension"
+                        @update:model-value="updateModelValue"
+                    />
+                </div>
+            </VnRow>
+        </template>
+    </FormModel>
+</template>
--- a/src/router/modules/worker.js
+++ b/src/router/modules/worker.js
@ -12,7 +12,15 @@ export default {
    redirect: { name: 'WorkerMain' },
    menus: {
        main: ['WorkerList', 'WorkerDepartment'],
-        card: ['WorkerNotificationsManager', 'WorkerPda', 'WorkerLog'],
+        card: [
+            'WorkerBasicData',
+            'WorkerNotes',
+            'WorkerPda',
+            'WorkerNotificationsManager',
+            'WorkerPBX',
+            'WorkerLog',
+            'WorkerDms',
+        ],
        departmentCard: ['BasicData'],
    },
    children: [
@ -66,6 +74,41 @@ export default {
                    },
                    component: () => import('src/pages/Worker/Card/WorkerSummary.vue'),
                },
+                {
+                    path: 'basic-data',
+                    name: 'WorkerBasicData',
+                    meta: {
+                        title: 'basicData',
+                        icon: 'vn:settings',
+                    },
+                    component: () => import('src/pages/Worker/Card/WorkerBasicData.vue'),
+                },
+                {
+                    path: 'notes',
+                    name: 'NotesCard',
+                    redirect: { name: 'WorkerNotes' },
+                    children: [
+                        {
+                            path: '',
+                            name: 'WorkerNotes',
+                            meta: {
+                                title: 'notes',
+                                icon: 'vn:notes',
+                            },
+                            component: () =>
+                                import('src/pages/Worker/Card/WorkerNotes.vue'),
+                        },
+                    ],
+                },
+                {
+                    name: 'WorkerPda',
+                    path: 'pda',
+                    meta: {
+                        title: 'pda',
+                        icon: 'phone_android',
+                    },
+                    component: () => import('src/pages/Worker/Card/WorkerPda.vue'),
+                },
                {
                    name: 'WorkerNotificationsManager',
                    path: 'notifications',
@ -77,13 +120,22 @@ export default {
                        import('src/pages/Worker/Card/WorkerNotificationsManager.vue'),
                },
                {
-                    name: 'WorkerPda',
-                    path: 'pda',
+                    path: 'pbx',
+                    name: 'WorkerPBX',
                    meta: {
-                        title: 'pda',
-                        icon: 'phone_android',
+                        title: 'pbx',
+                        icon: 'vn:pbx',
                    },
-                    component: () => import('src/pages/Worker/Card/WorkerPda.vue'),
+                    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',
--- a/test/cypress/integration/VnLocation.spec.js
+++ b/test/cypress/integration/VnLocation.spec.js
@ -8,41 +8,41 @@ describe('VnLocation', () => {
            cy.visit('/#/worker/create');
            cy.waitForElement('.q-card');
        });
-
       it('Show all options', function() {
            cy.get(inputLocation).click();
-        cy.get(locationOptions).should('have.length',5);
+            cy.get(locationOptions).should('have.length.at.least',5);
        });
-
       it('input filter location as "al"', function() {
            cy.get(inputLocation).click();
            cy.get(inputLocation).clear();
            cy.get(inputLocation).type('al');
-            cy.get(locationOptions).should('have.length',3);
+            cy.get(locationOptions).should('have.length.at.least',3);
        });
        it('input filter location as "ecuador"', function() {
            cy.get(inputLocation).click();
            cy.get(inputLocation).clear();
            cy.get(inputLocation).type('ecuador');
-            cy.get(locationOptions).should('have.length',1);
+            cy.get(locationOptions).should('have.length.at.least',1);
            cy.get(`${locationOptions}:nth-child(1)`).click();
            cy.get(':nth-child(3) > :nth-child(1) > .q-field > .q-field__inner > .q-field__control > :nth-child(2) > .q-icon').click();
-
        });
    });
    describe('Fiscal-data',()=>{
-    const inputLocation = ':nth-child(6) > :nth-child(1) > .q-field > .q-field__inner > .q-field__control';
-
        beforeEach(() => {
            cy.viewport(1280, 720);
            cy.login('developer');
            cy.visit('/#/supplier/567/fiscal-data', {timeout: 2000});
            cy.waitForElement('.q-card');
        });
-
-        it('Show locations options', function() {
-            cy.get(inputLocation).click();
-            cy.get(locationOptions).should('have.length', 5);
+        it('Create postCode', function() {
+            cy.get(':nth-child(6) > :nth-child(1) > .q-field > .q-field__inner > .q-field__control > :nth-child(3) > .q-icon').click();
+            cy.get(' .q-card > h1').should('have.text', 'New postcode');
+            cy.get('.q-card > :nth-child(4) > :nth-child(1) > .q-field > .q-field__inner > .q-field__control > :nth-child(1) > input').clear('12');
+            cy.get('.q-card > :nth-child(4) > :nth-child(1) > .q-field > .q-field__inner > .q-field__control > :nth-child(1) > input').type('1234453');
+            cy.selectOption('.q-dialog__inner > .column > #formModel > .q-card > :nth-child(4) > :nth-child(2) > .q-field > .q-field__inner > .q-field__control ', 'Valencia');
+            cy.selectOption('.q-dialog__inner > .column > #formModel > .q-card > :nth-child(5) > :nth-child(1) > .q-field > .q-field__inner > .q-field__control ', 'Province one');
+            cy.selectOption('.q-dialog__inner > .column > #formModel > .q-card > :nth-child(5) > :nth-child(2) > .q-field > .q-field__inner > .q-field__control ', 'España');
+            cy.get('.q-mt-lg > .q-btn--standard').click();
        });
    });
 })
--- a/test/cypress/integration/entry/entryDms.spec.js
+++ b/test/cypress/integration/entry/entryDms.spec.js
@ -5,37 +5,40 @@ describe('WagonTypeCreate', () => {
        cy.viewport(1920, 1080);
        cy.login('developer');
        cy.visit(`/#/entry/${entryId}/dms`);
-
    });

    it('should create edit and remove new dms', () => {
        cy.addRow();
-        cy.get('.icon-attach').click()
+        cy.get('.icon-attach').click();
        cy.get('.q-file').selectFile('test/cypress/fixtures/image.jpg', {
            force: true,
        });

-        cy.get("tbody > tr").then((value) => {
+        cy.get('tbody > tr').then((value) => {
+            const u = undefined;
+
            //Create and check if exist new row
            let newFileTd = Cypress.$(value).length;
            cy.get('.q-btn--standard > .q-btn__content > .block').click();
            expect(value).to.have.length(newFileTd++);
-            const newRowSelector = `tbody > :nth-child(${newFileTd})`
+            const newRowSelector = `tbody > :nth-child(${newFileTd})`;
            cy.waitForElement(newRowSelector);
+            cy.validateRow(newRowSelector, [u, u, u, u, 'ENTRADA ID 1']);

            //Edit new dms
-            const u = undefined;
-            cy.validateRow(newRowSelector, [u,u,u,u,'ENTRADA ID 1'])
-            cy.get(`tbody :nth-child(${newFileTd}) > .text-right > .flex > :nth-child(2) > .q-btn > .q-btn__content > .q-icon`).click();
-        })
-        // cy.log('newFileTd', newFileTd)
+            const newDescription = 'entry id 1 modified';
+            const textAreaSelector =
+                '.q-textarea > .q-field__inner > .q-field__control > .q-field__control-container';
+            cy.get(
+                `tbody :nth-child(${newFileTd}) > .text-right > .no-wrap > :nth-child(2) > .q-btn > .q-btn__content > .q-icon`
+            ).click();

-        // //Create and check if exist new row
-        // cy.log('newFileTd:', newFileTd);
-        // cy.get(`tbody :nth-child(${newFileTd}) > .text-right > .flex > :nth-child(2) > .q-btn > .q-btn__content > .q-icon`).click()
+            cy.get(textAreaSelector).clear();
+            cy.get(textAreaSelector).type(newDescription);
+            cy.saveCard();
+            cy.reload();

-        // cy.get(`tbody :nth-child(${newFileTd}) > :nth-child(5) > .q-tr > :nth-child(1) > span`).then((value) => {
-        //     cy.log(value)
-        // });
+            cy.validateRow(newRowSelector, [u, u, u, u, newDescription]);
+        });
    });
 });
--- a/test/cypress/integration/invoiceIn/invoiceInVat.spec.js
+++ b/test/cypress/integration/invoiceIn/invoiceInVat.spec.js
@ -37,6 +37,7 @@ describe('InvoiceInVat', () => {

    it('should throw an error if there are fields undefined', () => {
        cy.get(inputBtns).eq(0).click();
+        cy.get(':nth-child(1) > .q-td.q-table--col-auto-width > .q-field > .q-field__inner > .q-field__control > :nth-child(2) > .default-icon').click();
        cy.get(dialogBtns).eq(2).click();
        cy.get('.q-notification__message').should('have.text', "The code can't be empty");
    });
@ -44,7 +45,7 @@ describe('InvoiceInVat', () => {
    it('should correctly handle expense addition', () => {
        cy.get(inputBtns).eq(0).click();

-        cy.get(dialogInputs).eq(0).click();
+        cy.get(':nth-child(1) > .q-td.q-table--col-auto-width > .q-field > .q-field__inner > .q-field__control > :nth-child(2) > .default-icon').click();
        cy.get(dialogInputs).eq(0).type(randomInt);
        cy.get(dialogInputs).eq(1).click();
        cy.get(dialogInputs).eq(1).type('This is a dummy expense');
--- a/test/cypress/integration/vnSearchBar.spec.js
+++ b/test/cypress/integration/vnSearchBar.spec.js
@ -36,7 +36,7 @@ describe('VnSearchBar', () => {
    const checkCardListAndUrl = (expectedLength) => {
        cy.get(cardList).then(($cardList) => {
            expect($cardList.find('.q-card').length).to.equal(expectedLength);
-            cy.url().then((currentUrl) => expect(currentUrl).to.equal(url));
+            cy.url().then((currentUrl) => expect(currentUrl).to.contain(url));
        });
    };
 });
--- a/test/cypress/integration/worker/workerList.spec.js
+++ b/test/cypress/integration/worker/workerList.spec.js
@ -8,9 +8,9 @@ describe('WorkerList', () => {
    });

    it('should load workers', () => {
-        cy.get(workerFieldNames).eq(0).should('have.text', 'JessicaJones');
-        cy.get(workerFieldNames).eq(1).should('have.text', 'BruceBanner');
-        cy.get(workerFieldNames).eq(2).should('have.text', 'CharlesXavier');
+        cy.get(workerFieldNames).eq(0).should('have.text', 'jessicajones');
+        cy.get(workerFieldNames).eq(1).should('have.text', 'brucebanner');
+        cy.get(workerFieldNames).eq(2).should('have.text', 'charlesxavier');
    });

    it('should open the worker summary', () => {
--- a/test/cypress/integration/worker/workerNotificationsManager.spec.js
+++ b/test/cypress/integration/worker/workerNotificationsManager.spec.js
@ -60,7 +60,6 @@ describe('WorkerNotificationsManager', () => {
    it('should active a notification if you are their boss', () => {
        cy.login('salesBoss');
        cy.visit(`/#/worker/${salesPersonId}/notifications`);
-        cy.waitForElement(activeList);
        cy.waitForElement(availableList);

        cy.get(activeList)
--- a/test/cypress/integration/worker/workerSummary.spec.js
+++ b/test/cypress/integration/worker/workerSummary.spec.js
@ -6,7 +6,8 @@ describe('WorkerSummary', () => {
    });

    it('should load worker summary', () => {
-        cy.get('.summaryHeader > div').should('have.text', '19 - salesBoss salesBoss');
+        cy.waitForElement('.summaryHeader');
+        cy.get('.summaryHeader > div').should('have.text', '19 - salesboss salesboss');
        cy.get(':nth-child(1) > :nth-child(2) > .value > span').should(
            'have.text',
            'salesBossNick'
--- a/test/vitest/tests/components/common/VnLog.spec.js
+++ b/test/vitest/tests/components/common/VnLog.spec.js
@ -38,10 +38,10 @@ describe('VnLog', () => {
            action: 'update',
            changedModel: 'Claim',
            oldInstance: {
-                hasToPickUp: false,
+                pickup: null,
            },
            newInstance: {
-                hasToPickUp: true,
+                pickup: 'agency',
            },
            creationDate: '2023-09-18T12:25:34.000Z',
            changedModelId: '1',
--- a/test/vitest/tests/composables/useArrayData.spec.js
+++ b/test/vitest/tests/composables/useArrayData.spec.js
@ -0,0 +1,31 @@
+import { describe, expect, it, beforeAll } from 'vitest';
+import { axios } from 'app/test/vitest/helper';
+import { useArrayData } from 'composables/useArrayData';
+
+describe('useArrayData', () => {
+    let arrayData;
+    beforeAll(() => {
+        axios.get.mockResolvedValue({ data: [] });
+        arrayData = useArrayData('InvoiceIn', { url: 'invoice-in/list' });
+        Object.defineProperty(window.location, 'href', {
+            writable: true,
+            value: 'localhost:9000/invoice-in/list',
+        });
+
+        // Mock the window.history.pushState method within useArrayData
+        window.history.pushState = (data, title, url) => (window.location.href = url);
+
+        //  Mock the URL constructor within useArrayData
+        global.URL = class URL {
+            constructor(url) {
+                this.hash = url.split('localhost:9000/')[1];
+            }
+        };
+    });
+
+    it('should add the params to the url', async () => {
+        arrayData.store.userParams = { supplierFk: 2 };
+        arrayData.updateStateParams();
+        expect(window.location.href).contain('params=%7B%22supplierFk%22%3A2%7D');
+    });
+});