Merge branch 'dev' of https://gitea.verdnatura.es/verdnatura/salix-front into 7663-setWeight

2024-09-02 17:02:58 +02:00 · 2024-09-02 17:02:58 +02:00 · 1824d9a0e9
parent 3aa3d2d8d4 6c113e33fd
commit 1824d9a0e9
82 changed files with 1937 additions and 1359 deletions
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@ -1,3 +1,141 @@
+# Version 24.36 - 2024-08-27
+
+### Added 🆕
+
+-   feat(FormModel): trim data by default by:alexm
+-   feat(orderBasicData): add notes by:alexm
+-   feat(orderList): correct create order by:alexm
+-   feat(orderList): use orderFilter and fixed this by:alexm
+-   feat: #7323 handle workerPhoto (origin/7323_workerPhoto, 7323_workerPhoto) by:Javier Segarra
+-   feat: add recover password and reset password by:alexm
+-   feat: refs #7346 add seriaType option by:jgallego
+-   feat: refs #7346 elimino === by:jgallego
+-   feat: refs #7346 formdata uses serialType by:jgallego
+-   feat: refs #7346 refactor by:jgallego
+-   feat: refs #7346 sonarLint warnings (origin/7346-invoiceOutMultilple, 7346-invoiceOutMultilple) by:jgallego
+-   feat: refs #7710 uses cloneAll by:jgallego
+-   fix: refs #7717 fix OrderList table filters' and summary table style by:Jon
+
+### Changed 📦
+
+-   feat: refs #7346 refactor by:jgallego
+-   perf: date fields (mindshore/feature/TicketFutureFilter, feature/TicketFutureFilter) by:Javier Segarra
+-   perf: refs #7717 right menu filter by:Jon
+-   perf: use ref at component start by:Javier Segarra
+-   refactor: refs #7717 delete useless function and import by:Jon
+-   refactor: refs #7717 deleted useless code by:Jon
+
+### Fixed 🛠️
+
+-   feat(orderList): use orderFilter and fixed this by:alexm
+-   fix(VnTable): orderBy v-model by:alexm
+-   fix(account_card): redirection by:carlossa
+-   fix(orderLines): reload when delete and redirect when confirm by:alexm
+-   fix: #6336 ClaimListStates by:Javier Segarra
+-   fix: account subsections cards by:carlossa
+-   fix: duplicate key by:Jon
+-   fix: order description to vnTable by:alexm
+-   fix: orderCatalogFilter order by:alexm
+-   fix: quasar build warnings (6336_claim_fix_states) by:Javier Segarra
+-   fix: refs #7717 fix OrderList table filters' and summary table style by:Jon
+-   fix: refs #7717 fix basic data form & minor errors by:Jon
+-   fix: refs #7717 fix catalog filter, searchbar redirect and search by:Jon
+-   fix: refs #7717 fix catalog searchbar and worker tests(refs #7323) by:Jon
+-   fix: refs #7717 fix order sections by:Jon
+-   fix: refs #7717 fix volume and lines redirect by:Jon
+-   fix: refs #7717 fixed searchbar filter with rightmenu filters' applied by:Jon
+-   fix: test by:alexm
+-   fix: ticketDescriptorMenu by:Javier Segarra
+-   refs #7355 account fixes by:carlossa
+
+# Version 24.34 - 2024-08-20
+
+### Added 🆕
+
+-   chore: #6900 order params by:jorgep
+-   chore: refs #6900 drop console log by:jorgep
+-   chore: refs #6900 drop vnCurrency by:jorgep
+-   chore: refs #6900 fix e2e tests by:jorgep
+-   chore: refs #6900 mv rectificative logic by:jorgep
+-   chore: refs #6900 responsive code by:jorgep
+-   chore: refs #7283 drop array types by:jorgep
+-   chore: refs #7283 drop import by:jorgep
+-   chore: refs #7283 fix e2e logout by:jorgep
+-   chore: refs #7283 update VnAvatar title handling by:jorgep
+-   chore: refs #7323 fix test by:jorgep
+-   chore: refs #7323 remove unused import by:jorgep
+-   chore: refs #7323drop commented code by:jorgep
+-   feat(VnCard): use props searchbar by:alexm
+-   feat(customer): improve basicData to balance by:alexm
+-   feat(customer_balance): refs #6943 add functionality from salix by:alexm
+-   feat(customer_balance): refs #6943 translations by:alexm
+-   feat: refs #6130 husky commitLint config by:pablone
+-   feat: refs #6130 husky hooks by:pablone
+-   feat: refs #6900 add InvoiceInSerial by:jorgep
+-   feat: refs #6900 add locale by:jorgep
+-   feat: refs #6900 use VnTable & sort filter fields by:jorgep
+-   feat: refs #7323 add flex-wrap by:jorgep
+-   feat: refs #7323 add my account" btn & fix models log selectable by:jorgep
+-   feat: refs #7323 improve test by:jorgep
+
+### Changed 📦
+
+-   refactor(customer_log: use VnLog by:alexm
+-   refactor(customer_recovery): to vnTable by:alexm
+-   refactor(customer_webAccess): FormModel by:alexm
+-   refactor: refs #7283 update avatar size and color by:jorgep
+
+### Fixed 🛠️
+
+-   chore: refs #6900 fix e2e tests by:jorgep
+-   chore: refs #7283 fix e2e logout by:jorgep
+-   chore: refs #7323 fix test by:jorgep
+-   feat: refs #7323 add my account" btn & fix models log selectable by:jorgep
+-   fix #7355 fix acls list by:carlossa
+-   fix(VnFilterPanel): emit userParams better by:alexm
+-   fix(claim_summary): url links (HEAD -> 7864_testToMaster_2434, origin/test, origin/7864_testToMaster_2434, test) by:alexm
+-   fix(customer_sms: fix reload by:alexm
+-   fix(twoFactor): unify code login and twoFactor by:alexm
+-   fix: VnCard VnSearchbar props by:alexm
+-   fix: accountMailAlias by:alexm
+-   fix: refs #6130 add commit lint modules by:pablone
+-   fix: refs #6130 pnpm-lock.yml by:pablone
+-   fix: refs #6900 improve loading by:jorgep
+-   fix: refs #6900 improve logic (origin/6900-addSerial) by:jorgep
+-   fix: refs #6900 improve logic by:jorgep
+-   fix: refs #6900 rectificative btn reactivity by:jorgep
+-   fix: refs #6900 use type number by:jorgep
+-   fix: refs #6900 vat & dueday by:jorgep
+-   fix: refs #6900 vat, dueday & intrastat by:jorgep
+-   fix: refs #6989 show entity name & default time from config table by:jorgep
+-   fix: refs #7283 basicData locale by:jorgep
+-   fix: refs #7283 itemLastEntries filter by:jorgep
+-   fix: refs #7283 itemTags & VnImg by:jorgep
+-   fix: refs #7283 locale by:jorgep
+-   fix: refs #7283 min-width vnImg by:jorgep
+-   fix: refs #7283 use vnAvatar & add optional zoom by:jorgep
+-   fix: refs #7283 userPanel pic by:jorgep
+-   fix: refs #7323 add department popup by:jorgep
+-   fix: refs #7323 add locale by:jorgep
+-   fix: refs #7323 css righ menu by:jorgep
+-   fix: refs #7323 data-key & add select by:jorgep
+-   fix: refs #7323 load all opts by:jorgep
+-   fix: refs #7323 righ menu bug by:jorgep
+-   fix: refs #7323 use global locale by:jorgep
+-   fix: refs #7323 use workerFilter (origin/7323-warmfix-fixErrors) by:jorgep
+-   fix: refs #7323 vnsubtoolbar css by:jorgep
+-   fix: refs #7323 wrong css by:jorgep
+-   refs #7355 fix Rol, alias by:carlossa
+-   refs #7355 fix accountAlias by:carlossa
+-   refs #7355 fix alias summary by:carlossa
+-   refs #7355 fix conflicts by:carlossa
+-   refs #7355 fix create Rol by:carlossa
+-   refs #7355 fix list by:carlossa
+-   refs #7355 fix lists redirects summary by:carlossa
+-   refs #7355 fix roles by:carlossa
+-   refs #7355 fix search exprBuilder by:carlossa
+-   refs #7355 fix vnTable by:carlossa
+
 # Version 24.32 - 2024-08-06

 ### Added 🆕
--- a/package.json
+++ b/package.json
@ -1,6 +1,6 @@
 {
    "name": "salix-front",
-    "version": "24.34.0",
+    "version": "24.36.0",
    "description": "Salix frontend",
    "productName": "Salix",
    "author": "Verdnatura",
--- a/src/boot/mainShortcutMixin.js
+++ b/src/boot/mainShortcutMixin.js
@ -0,0 +1,23 @@
+import routes from 'src/router/modules';
+
+import { useRouter } from 'vue-router';
+export default {
+    mounted: function () {
+        const router = useRouter();
+        const keyBindingMap = routes
+            .filter((route) => route.meta.keyBinding)
+            .reduce((map, route) => {
+                map[route.meta.keyBinding.toLowerCase()] = route.path;
+                return map;
+            }, {});
+        const handleKeyDown = (event) => {
+            const { ctrlKey, altKey, key } = event;
+            event.preventDefault();
+            if (ctrlKey && altKey && keyBindingMap[key]) {
+                router.push(keyBindingMap[key]);
+            }
+        };
+
+        window.addEventListener('keydown', handleKeyDown);
+    },
+};
--- a/src/boot/quasar.js
+++ b/src/boot/quasar.js
@ -1,6 +1,8 @@
 import { boot } from 'quasar/wrappers';
 import qFormMixin from './qformMixin';
+import mainShortcutMixin from './mainShortcutMixin';

 export default boot(({ app }) => {
    app.mixin(qFormMixin);
+    app.mixin(mainShortcutMixin);
 });
--- a/src/components/VnTable/VnTable.vue
+++ b/src/components/VnTable/VnTable.vue
@ -107,7 +107,7 @@ const orders = ref(parseOrder(routeQuery.filter?.order));
 const CrudModelRef = ref({});
 const showForm = ref(false);
 const splittedColumns = ref({ columns: [] });
-const columnsVisibilitySkiped = ref();
+const columnsVisibilitySkipped = ref();
 const createForm = ref();

 const tableModes = [
@ -135,7 +135,7 @@ onMounted(() => {
            ? CARD_MODE
            : $props.defaultMode;
    stateStore.rightDrawer = true;
-    columnsVisibilitySkiped.value = [
+    columnsVisibilitySkipped.value = [
        ...splittedColumns.value.columns
            .filter((c) => c.visible == false)
            .map((c) => c.name),
@ -332,296 +332,280 @@ defineExpose({
        </QScrollArea>
    </QDrawer>
    <!-- class in div to fix warn-->
-    <div class="q-px-md">
-        <CrudModel
-            v-bind="$attrs"
-            :limit="20"
-            ref="CrudModelRef"
-            @on-fetch="(...args) => emit('onFetch', ...args)"
-            :search-url="searchUrl"
-            :disable-infinite-scroll="isTableMode"
-            @save-changes="reload"
-            :has-sub-toolbar="$attrs['hasSubToolbar'] ?? isEditable"
-            :auto-load="hasParams || $attrs['auto-load']"
-        >
-            <template
-                v-for="(_, slotName) in $slots"
-                #[slotName]="slotData"
-                :key="slotName"
+
+    <CrudModel
+        v-bind="$attrs"
+        :class="$attrs['class'] ?? 'q-px-md'"
+        :limit="20"
+        ref="CrudModelRef"
+        @on-fetch="(...args) => emit('onFetch', ...args)"
+        :search-url="searchUrl"
+        :disable-infinite-scroll="isTableMode"
+        @save-changes="reload"
+        :has-sub-toolbar="$attrs['hasSubToolbar'] ?? isEditable"
+        :auto-load="hasParams || $attrs['auto-load']"
+    >
+        <template v-for="(_, slotName) in $slots" #[slotName]="slotData" :key="slotName">
+            <slot :name="slotName" v-bind="slotData ?? {}" :key="slotName" />
+        </template>
+        <template #body="{ rows }">
+            <QTable
+                v-bind="table"
+                class="vnTable"
+                :columns="splittedColumns.columns"
+                :rows="rows"
+                v-model:selected="selected"
+                :grid="!isTableMode"
+                table-header-class="bg-header"
+                card-container-class="grid-three"
+                flat
+                :style="isTableMode && `max-height: ${tableHeight}`"
+                virtual-scroll
+                @virtual-scroll="
+                    (event) =>
+                        event.index > rows.length - 2 &&
+                        CrudModelRef.vnPaginateRef.paginate()
+                "
+                @row-click="(_, row) => rowClickFunction && rowClickFunction(row)"
+                @update:selected="emit('update:selected', $event)"
            >
-                <slot :name="slotName" v-bind="slotData ?? {}" :key="slotName" />
-            </template>
-            <template #body="{ rows }">
-                <QTable
-                    v-bind="table"
-                    class="vnTable"
-                    :columns="splittedColumns.columns"
-                    :rows="rows"
-                    v-model:selected="selected"
-                    :grid="!isTableMode"
-                    table-header-class="bg-header"
-                    card-container-class="grid-three"
-                    flat
-                    :style="isTableMode && `max-height: ${tableHeight}`"
-                    virtual-scroll
-                    @virtual-scroll="
-                        (event) =>
-                            event.index > rows.length - 2 &&
-                            CrudModelRef.vnPaginateRef.paginate()
-                    "
-                    @row-click="(_, row) => rowClickFunction && rowClickFunction(row)"
-                    @update:selected="emit('update:selected', $event)"
-                >
-                    <template #top-left v-if="!$props.withoutHeader">
-                        <slot name="top-left"></slot>
-                    </template>
-                    <template #top-right v-if="!$props.withoutHeader">
-                        <VnVisibleColumn
-                            v-if="isTableMode"
-                            v-model="splittedColumns.columns"
-                            :table-code="tableCode ?? route.name"
-                            :skip="columnsVisibilitySkiped"
-                        />
-                        <QBtnToggle
-                            v-model="mode"
-                            toggle-color="primary"
-                            class="bg-vn-section-color"
-                            dense
-                            :options="tableModes"
-                        />
-                        <QBtn
-                            v-if="$props.rightSearch"
-                            icon="filter_alt"
-                            class="bg-vn-section-color q-ml-md"
-                            dense
-                            @click="stateStore.toggleRightDrawer()"
-                        />
-                    </template>
-                    <template #header-cell="{ col }">
-                        <QTh v-if="col.visible ?? true">
-                            <div
-                                class="column self-start q-ml-xs ellipsis"
-                                :class="`text-${col?.align ?? 'left'}`"
-                                :style="$props.columnSearch ? 'height: 75px' : ''"
-                            >
-                                <div
-                                    class="row items-center no-wrap"
-                                    style="height: 30px"
-                                >
-                                    <VnTableOrder
-                                        v-model="orders[col.orderBy ?? col.name]"
-                                        :name="col.orderBy ?? col.name"
-                                        :label="col?.label"
-                                        :data-key="$attrs['data-key']"
-                                        :search-url="searchUrl"
-                                    />
-                                </div>
-                                <VnTableFilter
-                                    v-if="$props.columnSearch"
-                                    :column="col"
-                                    :show-title="true"
+                <template #top-left v-if="!$props.withoutHeader">
+                    <slot name="top-left"></slot>
+                </template>
+                <template #top-right v-if="!$props.withoutHeader">
+                    <VnVisibleColumn
+                        v-if="isTableMode"
+                        v-model="splittedColumns.columns"
+                        :table-code="tableCode ?? route.name"
+                        :skip="columnsVisibilitySkipped"
+                    />
+                    <QBtnToggle
+                        v-model="mode"
+                        toggle-color="primary"
+                        class="bg-vn-section-color"
+                        dense
+                        :options="tableModes.filter((mode) => !mode.disable)"
+                    />
+                    <QBtn
+                        v-if="$props.rightSearch"
+                        icon="filter_alt"
+                        class="bg-vn-section-color q-ml-md"
+                        dense
+                        @click="stateStore.toggleRightDrawer()"
+                    />
+                </template>
+                <template #header-cell="{ col }">
+                    <QTh v-if="col.visible ?? true">
+                        <div
+                            class="column self-start q-ml-xs ellipsis"
+                            :class="`text-${col?.align ?? 'left'}`"
+                            :style="$props.columnSearch ? 'height: 75px' : ''"
+                        >
+                            <div class="row items-center no-wrap" style="height: 30px">
+                                <QTooltip v-if="col.toolTip">{{ col.toolTip }}</QTooltip>
+                                <VnTableOrder
+                                    v-model="orders[col.orderBy ?? col.name]"
+                                    :name="col.orderBy ?? col.name"
+                                    :label="col?.label"
                                    :data-key="$attrs['data-key']"
-                                    v-model="params[columnName(col)]"
                                    :search-url="searchUrl"
-                                    class="full-width"
                                />
                            </div>
-                        </QTh>
-                    </template>
-                    <template #header-cell-tableActions>
-                        <QTh auto-width class="sticky" />
-                    </template>
-                    <template #body-cell-tableStatus="{ col, row }">
-                        <QTd auto-width :class="getColAlign(col)">
-                            <VnTableChip
-                                :columns="splittedColumns.columnChips"
+                            <VnTableFilter
+                                v-if="$props.columnSearch"
+                                :column="col"
+                                :show-title="true"
+                                :data-key="$attrs['data-key']"
+                                v-model="params[columnName(col)]"
+                                :search-url="searchUrl"
+                                class="full-width"
+                            />
+                        </div>
+                    </QTh>
+                </template>
+                <template #header-cell-tableActions>
+                    <QTh auto-width class="sticky" />
+                </template>
+                <template #body-cell-tableStatus="{ col, row }">
+                    <QTd auto-width :class="getColAlign(col)">
+                        <VnTableChip :columns="splittedColumns.columnChips" :row="row">
+                            <template #afterChip>
+                                <slot name="afterChip" :row="row"></slot>
+                            </template>
+                        </VnTableChip>
+                    </QTd>
+                </template>
+                <template #body-cell="{ col, row, rowIndex }">
+                    <!-- Columns -->
+                    <QTd
+                        auto-width
+                        class="no-margin q-px-xs"
+                        :class="[getColAlign(col), col.columnClass]"
+                        v-if="col.visible ?? true"
+                        @click.ctrl="
+                            ($event) =>
+                                rowCtrlClickFunction && rowCtrlClickFunction($event, row)
+                        "
+                    >
+                        <slot
+                            :name="`column-${col.name}`"
+                            :col="col"
+                            :row="row"
+                            :row-index="rowIndex"
+                        >
+                            <VnTableColumn
+                                :column="col"
                                :row="row"
-                            >
-                                <template #afterChip>
-                                    <slot name="afterChip" :row="row"></slot>
-                                </template>
-                            </VnTableChip>
-                        </QTd>
-                    </template>
-                    <template #body-cell="{ col, row, rowIndex }">
-                        <!-- Columns -->
-                        <QTd
-                            auto-width
-                            class="no-margin q-px-xs"
-                            :class="[getColAlign(col), col.columnClass]"
-                            v-if="col.visible ?? true"
-                            @click.ctrl="
-                                ($event) =>
-                                    rowCtrlClickFunction &&
-                                    rowCtrlClickFunction($event, row)
+                                :is-editable="col.isEditable ?? isEditable"
+                                v-model="row[col.name]"
+                                component-prop="columnField"
+                            />
+                        </slot>
+                    </QTd>
+                </template>
+                <template #body-cell-tableActions="{ col, row }">
+                    <QTd
+                        auto-width
+                        :class="getColAlign(col)"
+                        class="sticky no-padding"
+                        @click="stopEventPropagation($event)"
+                    >
+                        <QBtn
+                            v-for="(btn, index) of col.actions"
+                            :key="index"
+                            :title="btn.title"
+                            :icon="btn.icon"
+                            class="q-px-sm"
+                            flat
+                            :class="
+                                btn.isPrimary ? 'text-primary-light' : 'color-vn-text '
+                            "
+                            :style="`visibility: ${
+                                (btn.show && btn.show(row)) ?? true ? 'visible' : 'hidden'
+                            }`"
+                            @click="btn.action(row)"
+                        />
+                    </QTd>
+                </template>
+                <template #item="{ row, colsMap }">
+                    <component
+                        :is="$props.redirect ? 'router-link' : 'span'"
+                        :to="`/${$props.redirect}/` + row.id"
+                    >
+                        <QCard
+                            bordered
+                            flat
+                            class="row no-wrap justify-between cursor-pointer"
+                            @click="
+                                (_, row) => {
+                                    $props.rowClick && $props.rowClick(row);
+                                }
                            "
                        >
-                            <slot
-                                :name="`column-${col.name}`"
-                                :col="col"
-                                :row="row"
-                                :row-index="rowIndex"
-                            >
-                                <VnTableColumn
-                                    :column="col"
-                                    :row="row"
-                                    :is-editable="col.isEditable ?? isEditable"
-                                    v-model="row[col.name]"
-                                    component-prop="columnField"
-                                />
-                            </slot>
-                        </QTd>
-                    </template>
-                    <template #body-cell-tableActions="{ col, row }">
-                        <QTd
-                            auto-width
-                            :class="getColAlign(col)"
-                            class="sticky no-padding"
-                            @click="stopEventPropagation($event)"
-                        >
-                            <QBtn
-                                v-for="(btn, index) of col.actions"
-                                :key="index"
-                                :title="btn.title"
-                                :icon="btn.icon"
-                                class="q-px-sm"
-                                flat
-                                :class="
-                                    btn.isPrimary
-                                        ? 'text-primary-light'
-                                        : 'color-vn-text '
-                                "
-                                :style="`visibility: ${
-                                    (btn.show && btn.show(row)) ?? true
-                                        ? 'visible'
-                                        : 'hidden'
-                                }`"
-                                @click="btn.action(row)"
-                            />
-                        </QTd>
-                    </template>
-                    <template #item="{ row, colsMap }">
-                        <component
-                            :is="$props.redirect ? 'router-link' : 'span'"
-                            :to="`/${$props.redirect}/` + row.id"
-                        >
-                            <QCard
-                                bordered
-                                flat
-                                class="row no-wrap justify-between cursor-pointer"
-                                @click="
-                                    (_, row) => {
-                                        $props.rowClick && $props.rowClick(row);
-                                    }
-                                "
+                            <QCardSection
+                                vertical
+                                class="no-margin no-padding"
+                                :class="colsMap.tableActions ? 'w-80' : 'fit'"
                            >
+                                <!-- Chips -->
                                <QCardSection
-                                    vertical
-                                    class="no-margin no-padding"
-                                    :class="colsMap.tableActions ? 'w-80' : 'fit'"
+                                    v-if="splittedColumns.chips.length"
+                                    class="no-margin q-px-xs q-py-none"
                                >
-                                    <!-- Chips -->
-                                    <QCardSection
-                                        v-if="splittedColumns.chips.length"
-                                        class="no-margin q-px-xs q-py-none"
+                                    <VnTableChip
+                                        :columns="splittedColumns.chips"
+                                        :row="row"
                                    >
-                                        <VnTableChip
-                                            :columns="splittedColumns.chips"
-                                            :row="row"
-                                        >
-                                            <template #afterChip>
-                                                <slot name="afterChip" :row="row"></slot>
-                                            </template>
-                                        </VnTableChip>
-                                    </QCardSection>
-                                    <!-- Title -->
-                                    <QCardSection
-                                        v-if="splittedColumns.title"
-                                        class="q-pl-sm q-py-none text-primary-light text-bold text-h6 cardEllipsis"
+                                        <template #afterChip>
+                                            <slot name="afterChip" :row="row"></slot>
+                                        </template>
+                                    </VnTableChip>
+                                </QCardSection>
+                                <!-- Title -->
+                                <QCardSection
+                                    v-if="splittedColumns.title"
+                                    class="q-pl-sm q-py-none text-primary-light text-bold text-h6 cardEllipsis"
+                                >
+                                    <span
+                                        :title="row[splittedColumns.title.name]"
+                                        @click="stopEventPropagation($event)"
+                                        class="cursor-text"
                                    >
-                                        <span
-                                            :title="row[splittedColumns.title.name]"
-                                            @click="stopEventPropagation($event)"
-                                            class="cursor-text"
-                                        >
-                                            {{ row[splittedColumns.title.name] }}
-                                        </span>
-                                    </QCardSection>
-                                    <!-- Fields -->
-                                    <QCardSection
-                                        class="q-pl-sm q-pr-lg q-py-xs"
-                                        :class="$props.cardClass"
+                                        {{ row[splittedColumns.title.name] }}
+                                    </span>
+                                </QCardSection>
+                                <!-- Fields -->
+                                <QCardSection
+                                    class="q-pl-sm q-pr-lg q-py-xs"
+                                    :class="$props.cardClass"
+                                >
+                                    <div
+                                        v-for="(
+                                            col, index
+                                        ) of splittedColumns.cardVisible"
+                                        :key="col.name"
+                                        class="fields"
                                    >
-                                        <div
-                                            v-for="(
-                                                col, index
-                                            ) of splittedColumns.cardVisible"
-                                            :key="col.name"
-                                            class="fields"
+                                        <VnLv
+                                            :label="
+                                                !col.component && col.label
+                                                    ? `${col.label}:`
+                                                    : ''
+                                            "
                                        >
-                                            <VnLv
-                                                :label="
-                                                    !col.component && col.label
-                                                        ? `${col.label}:`
-                                                        : ''
-                                                "
-                                            >
-                                                <template #value>
-                                                    <span
-                                                        @click="
-                                                            stopEventPropagation($event)
-                                                        "
+                                            <template #value>
+                                                <span
+                                                    @click="stopEventPropagation($event)"
+                                                >
+                                                    <slot
+                                                        :name="`column-${col.name}`"
+                                                        :col="col"
+                                                        :row="row"
+                                                        :row-index="index"
                                                    >
-                                                        <slot
-                                                            :name="`column-${col.name}`"
-                                                            :col="col"
+                                                        <VnTableColumn
+                                                            :column="col"
                                                            :row="row"
-                                                            :row-index="index"
-                                                        >
-                                                            <VnTableColumn
-                                                                :column="col"
-                                                                :row="row"
-                                                                :is-editable="false"
-                                                                v-model="row[col.name]"
-                                                                component-prop="columnField"
-                                                                :show-label="true"
-                                                            />
-                                                        </slot>
-                                                    </span>
-                                                </template>
-                                            </VnLv>
-                                        </div>
-                                    </QCardSection>
+                                                            :is-editable="false"
+                                                            v-model="row[col.name]"
+                                                            component-prop="columnField"
+                                                            :show-label="true"
+                                                        />
+                                                    </slot>
+                                                </span>
+                                            </template>
+                                        </VnLv>
+                                    </div>
                                </QCardSection>
-                                <!-- Actions -->
-                                <QCardSection
-                                    v-if="colsMap.tableActions"
-                                    class="column flex-center w-10 no-margin q-pa-xs q-gutter-y-xs"
-                                    @click="stopEventPropagation($event)"
-                                >
-                                    <QBtn
-                                        v-for="(btn, index) of splittedColumns.actions
-                                            .actions"
-                                        :key="index"
-                                        :title="btn.title"
-                                        :icon="btn.icon"
-                                        class="q-pa-xs"
-                                        flat
-                                        :class="
-                                            btn.isPrimary
-                                                ? 'text-primary-light'
-                                                : 'color-vn-text '
-                                        "
-                                        @click="btn.action(row)"
-                                    />
-                                </QCardSection>
-                            </QCard>
-                        </component>
-                    </template>
-                </QTable>
-            </template>
-        </CrudModel>
-    </div>
+                            </QCardSection>
+                            <!-- Actions -->
+                            <QCardSection
+                                v-if="colsMap.tableActions"
+                                class="column flex-center w-10 no-margin q-pa-xs q-gutter-y-xs"
+                                @click="stopEventPropagation($event)"
+                            >
+                                <QBtn
+                                    v-for="(btn, index) of splittedColumns.actions
+                                        .actions"
+                                    :key="index"
+                                    :title="btn.title"
+                                    :icon="btn.icon"
+                                    class="q-pa-xs"
+                                    flat
+                                    :class="
+                                        btn.isPrimary
+                                            ? 'text-primary-light'
+                                            : 'color-vn-text '
+                                    "
+                                    @click="btn.action(row)"
+                                />
+                            </QCardSection>
+                        </QCard>
+                    </component>
+                </template>
+            </QTable>
+        </template>
+    </CrudModel>
    <QPageSticky v-if="create" :offset="[20, 20]" style="z-index: 2">
        <QBtn @click="showForm = !showForm" color="primary" fab icon="add" />
        <QTooltip>
--- a/src/components/common/VnCard.vue
+++ b/src/components/common/VnCard.vue
@ -8,7 +8,6 @@ import VnSubToolbar from '../ui/VnSubToolbar.vue';
 import VnSearchbar from 'components/ui/VnSearchbar.vue';
 import LeftMenu from 'components/LeftMenu.vue';
 import RightMenu from 'components/common/RightMenu.vue';
-
 const props = defineProps({
    dataKey: { type: String, required: true },
    baseUrl: { type: String, default: undefined },
@ -74,7 +73,7 @@ if (props.baseUrl) {
        <QPage>
            <VnSubToolbar />
            <div :class="[useCardSize(), $attrs.class]">
-                <RouterView />
+                <RouterView :key="route.fullPath" />
            </div>
        </QPage>
    </QPageContainer>
--- a/src/components/common/VnInputDate.vue
+++ b/src/components/common/VnInputDate.vue
@ -3,7 +3,7 @@ import { onMounted, watch, computed, ref } from 'vue';
 import { date } from 'quasar';
 import { useI18n } from 'vue-i18n';

-const model = defineModel({ type: String });
+const model = defineModel({ type: [String, Date] });
 const $props = defineProps({
    isOutlined: {
        type: Boolean,
--- a/src/components/common/VnInputTime.vue
+++ b/src/components/common/VnInputTime.vue
@ -1,5 +1,5 @@
 <script setup>
-import { watch, computed, ref, nextTick } from 'vue';
+import { computed, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { date } from 'quasar';

@ -14,13 +14,13 @@ const props = defineProps({
        default: false,
    },
 });
+const initialDate = ref(model.value);
 const { t } = useI18n();
 const requiredFieldRule = (val) => !!val || t('globals.fieldRequired');

 const dateFormat = 'HH:mm';
 const isPopupOpen = ref();
 const hover = ref();
-const inputRef = ref();

 const styleAttrs = computed(() => {
    return props.isOutlined
@ -50,7 +50,8 @@ const formattedTime = computed({
            }
            if (!props.timeOnly) {
                const [hh, mm] = time.split(':');
-                const date = new Date(model.value ? model.value : null);
+
+                const date = new Date(model.value ? model.value : initialDate.value);
                date.setHours(hh, mm, 0);
                time = date?.toISOString();
            }
@ -62,37 +63,10 @@ const formattedTime = computed({
 function dateToTime(newDate) {
    return date.formatDate(new Date(newDate), dateFormat);
 }
-
-watch(
-    () => model.value,
-    (val) => (formattedTime.value = val),
-    { immediate: true }
-);
-
-watch(
-    () => formattedTime.value,
-    async (val) => {
-        let position = 3;
-        const input = inputRef.value?.getNativeElement();
-        if (!val || !input) return;
-
-        let [hh, mm] = val.split(':');
-        hh = parseInt(hh);
-        if (hh >= 10 || mm != '00') return;
-
-        await nextTick();
-        await nextTick();
-        if (!hh) position = 0;
-        input.setSelectionRange(position, position);
-    },
-    { immediate: true }
-);
 </script>
-
 <template>
    <div @mouseover="hover = true" @mouseleave="hover = false">
        <QInput
-            ref="inputRef"
            class="vn-input-time"
            mask="##:##"
            placeholder="--:--"
@ -102,7 +76,7 @@ watch(
            style="min-width: 100px"
            :rules="$attrs.required ? [requiredFieldRule] : null"
            @click="isPopupOpen = false"
-            @focus="inputRef.getNativeElement().setSelectionRange(0, 0)"
+            type="time"
        >
            <template #append>
                <QIcon
@ -149,6 +123,11 @@ watch(
    border-style: solid;
 }
 </style>
+<style lang="scss" scoped>
+:deep(input[type='time']::-webkit-calendar-picker-indicator) {
+    display: none;
+}
+</style>
 <i18n>
    es:
        Open time: Abrir tiempo
--- a/src/components/common/VnSelect.vue
+++ b/src/components/common/VnSelect.vue
@ -73,6 +73,14 @@ const $props = defineProps({
        type: Boolean,
        default: true,
    },
+    params: {
+        type: Object,
+        default: null,
+    },
+    noOne: {
+        type: Boolean,
+        default: false,
+    },
 });

 const { t } = useI18n();
@ -85,6 +93,11 @@ const myOptionsOriginal = ref([]);
 const vnSelectRef = ref();
 const dataRef = ref();
 const lastVal = ref();
+const noOneText = t('globals.noOne');
+const noOneOpt = ref({
+    [optionValue.value]: false,
+    [optionLabel.value]: noOneText,
+});

 const value = computed({
    get() {
@ -100,9 +113,11 @@ watch(options, (newValue) => {
    setOptions(newValue);
 });

-watch(modelValue, (newValue) => {
+watch(modelValue, async (newValue) => {
    if (!myOptions.value.some((option) => option[optionValue.value] == newValue))
-        fetchFilter(newValue);
+        await fetchFilter(newValue);
+
+    if ($props.noOne) myOptions.value.unshift(noOneOpt.value);
 });

 onMounted(() => {
@ -153,13 +168,19 @@ async function fetchFilter(val) {
            ? optionValue.value
            : optionFilter.value ?? optionLabel.value);

-    const defaultWhere = $props.useLike
-        ? { [key]: { like: `%${val}%` } }
-        : { [key]: val };
+    let defaultWhere = {};
+    if ($props.filterOptions.length) {
+        defaultWhere = $props.filterOptions.reduce((obj, prop) => {
+            if (!obj.or) obj.or = [];
+            obj.or.push({ [prop]: getVal(val) });
+            return obj;
+        }, {});
+    } else defaultWhere = { [key]: getVal(val) };
    const where = { ...(val ? defaultWhere : {}), ...$props.where };
    const fetchOptions = { where, include, limit };
    if (fields) fetchOptions.fields = fields;
    if (sortBy) fetchOptions.order = sortBy;
+
    return dataRef.value.fetch(fetchOptions);
 }

@ -180,6 +201,9 @@ async function filterHandler(val, update) {
    } else newOptions = filter(val, myOptionsOriginal.value);
    update(
        () => {
+            if ($props.noOne && noOneText.toLowerCase().includes(val.toLowerCase()))
+                newOptions.unshift(noOneOpt.value);
+
            myOptions.value = newOptions;
        },
        (ref) => {
@ -194,6 +218,8 @@ async function filterHandler(val, update) {
 function nullishToTrue(value) {
    return value ?? true;
 }
+
+const getVal = (val) => ($props.useLike ? { like: `%${val}%` } : val);
 </script>

 <template>
@ -205,6 +231,7 @@ function nullishToTrue(value) {
        :limit="limit"
        :sort-by="sortBy"
        :fields="fields"
+        :params="params"
    />
    <QSelect
        v-model="value"
--- a/src/components/ui/VnConfirm.vue
+++ b/src/components/ui/VnConfirm.vue
@ -15,7 +15,7 @@ const props = defineProps({
        default: null,
    },
    message: {
-        type: String,
+        type: [String, Boolean],
        default: null,
    },
    data: {
@ -35,7 +35,10 @@ defineEmits(['confirm', ...useDialogPluginComponent.emits]);
 const { dialogRef, onDialogOK } = useDialogPluginComponent();

 const title = props.title || t('Confirm');
-const message = props.message || t('Are you sure you want to continue?');
+const message =
+    props.message ||
+    (props.message !== false ? t('Are you sure you want to continue?') : false);
+
 const isLoading = ref(false);

 async function confirm() {
@ -61,12 +64,12 @@ async function confirm() {
                    size="xl"
                    v-if="icon"
                />
-                <span class="text-h6 text-grey">{{ title }}</span>
+                <span class="text-h6">{{ title }}</span>
                <QSpace />
                <QBtn icon="close" :disable="isLoading" flat round dense v-close-popup />
            </QCardSection>
            <QCardSection class="row items-center">
-                <span v-html="message"></span>
+                <span v-if="message !== false" v-html="message" />
                <slot name="customHTML"></slot>
            </QCardSection>
            <QCardActions align="right">
--- a/src/components/ui/VnFilterPanel.vue
+++ b/src/components/ui/VnFilterPanel.vue
@ -24,7 +24,7 @@ const $props = defineProps({
        type: Boolean,
        default: true,
    },
-    unRemovableParams: {
+    unremovableParams: {
        type: Array,
        required: false,
        default: () => [],
@ -148,7 +148,7 @@ async function clearFilters() {
        arrayData.reset(['skip', 'filter.skip', 'page']);
        // Filtrar los params no removibles
        const removableFilters = Object.keys(userParams.value).filter((param) =>
-            $props.unRemovableParams.includes(param)
+            $props.unremovableParams.includes(param)
        );
        const newParams = {};
        // Conservar solo los params que no son removibles
@ -180,10 +180,10 @@ const tagsList = computed(() => {
 });

 const tags = computed(() => {
-    return tagsList.value.filter((tag) => !($props.customTags || []).includes(tag.key));
+    return tagsList.value.filter((tag) => !($props.customTags || []).includes(tag.label));
 });
 const customTags = computed(() =>
-    tagsList.value.filter((tag) => ($props.customTags || []).includes(tag.key))
+    tagsList.value.filter((tag) => ($props.customTags || []).includes(tag.label))
 );

 async function remove(key) {
@ -268,7 +268,7 @@ function sanitizer(params) {
                    <VnFilterPanelChip
                        v-for="chip of tags"
                        :key="chip.label"
-                        :removable="!unRemovableParams.includes(chip.label)"
+                        :removable="!unremovableParams?.includes(chip.label)"
                        @remove="remove(chip.label)"
                    >
                        <slot name="tags" :tag="chip" :format-fn="formatValue">
--- a/src/components/ui/VnPaginate.vue
+++ b/src/components/ui/VnPaginate.vue
@ -10,6 +10,10 @@ const props = defineProps({
        type: String,
        required: true,
    },
+    class: {
+        type: String,
+        default: '',
+    },
    autoLoad: {
        type: Boolean,
        default: false,
@ -215,7 +219,7 @@ defineExpose({ fetch, addFilter, paginate });
        v-if="store.data"
        @load="onLoad"
        :offset="offset"
-        class="full-width"
+        :class="['full-width', props.class]"
        :disable="disableInfiniteScroll || !store.hasMoreData"
        v-bind="$attrs"
    >
--- a/src/components/ui/VnSearchbar.vue
+++ b/src/components/ui/VnSearchbar.vue
@ -121,7 +121,7 @@ async function search() {
        <QForm @submit="search" id="searchbarForm">
            <VnInput
                id="searchbar"
-                v-model="searchText"
+                v-model.trim="searchText"
                :placeholder="t(props.label)"
                dense
                standout
--- a/src/composables/getDateQBadgeColor.js
+++ b/src/composables/getDateQBadgeColor.js
@ -7,5 +7,5 @@ export function getDateQBadgeColor(date) {
    let comparation = today - timeTicket;

    if (comparation == 0) return 'warning';
-    if (comparation < 0) return 'negative';
+    if (comparation < 0) return 'success';
 }
--- a/src/css/app.scss
+++ b/src/css/app.scss
@ -253,7 +253,6 @@ input::-webkit-inner-spin-button {
        }
        td {
            font-size: 11pt;
-            border-top: 1px solid var(--vn-page-color);
            border-collapse: collapse;
        }
    }
--- a/src/filters/date.js
+++ b/src/filters/date.js
@ -20,21 +20,21 @@ export function isValidDate(date) {
 * Converts a given date to a specific format.
 *
 * @param {number|string|Date} date - The date to be formatted.
+ * @param {Object} opts - Optional parameters to customize the output format.
 * @returns {string} The formatted date as a string in 'dd/mm/yyyy' format. If the provided date is not valid, an empty string is returned.
 *
 * @example
 * // returns "02/12/2022"
 * toDateFormat(new Date(2022, 11, 2));
 */
-export function toDateFormat(date, locale = 'es-ES') {
-    if (!isValidDate(date)) {
-        return '';
-    }
-    return new Date(date).toLocaleDateString(locale, {
-        year: 'numeric',
-        month: '2-digit',
-        day: '2-digit',
-    });
+export function toDateFormat(date, locale = 'es-ES', opts = {}) {
+    if (!isValidDate(date)) return '';
+
+    const format = Object.assign(
+        { year: 'numeric', month: '2-digit', day: '2-digit' },
+        opts
+    );
+    return new Date(date).toLocaleDateString(locale, format);
 }

 /**
--- a/src/filters/dateRange.js
+++ b/src/filters/dateRange.js
@ -1,7 +1,7 @@
 export default function dateRange(value) {
    const minHour = new Date(value);
    minHour.setHours(0, 0, 0, 0);
-    const maxHour = new Date();
+    const maxHour = new Date(value);
    maxHour.setHours(23, 59, 59, 59);

    return [minHour, maxHour];
--- a/src/i18n/locale/en.yml
+++ b/src/i18n/locale/en.yml
@ -94,6 +94,7 @@ globals:
    from: From
    to: To
    notes: Notes
+    refresh: Refresh
    pageTitles:
        logIn: Login
        summary: Summary
@ -255,6 +256,9 @@ globals:
        twoFactor: Two factor
        recoverPassword: Recover password
        resetPassword: Reset password
+        ticketsMonitor: Tickets monitor
+        clientsActionsMonitor: Clients and actions
+        serial: Serial
    created: Created
    worker: Worker
    now: Now
@ -268,6 +272,7 @@ globals:
        subtitle: Are you sure exit without saving?
    createInvoiceIn: Create invoice in
    myAccount: My account
+    noOne: No one
 errors:
    statusUnauthorized: Access denied
    statusInternalServerError: An internal server error has ocurred
@ -454,6 +459,7 @@ entry:
            travelFk: Travel
            isExcludedFromAvailable: Inventory
            isRaid: Raid
+            invoiceAmount: Import
    summary:
        commission: Commission
        currency: Currency
@ -1122,9 +1128,12 @@ travel:
            agency: Agency
            shipped: Shipped
            landed: Landed
+            shipHour: Shipment Hour
+            landHour: Landing Hour
            warehouseIn: Warehouse in
            warehouseOut: Warehouse out
            totalEntries: Total entries
+            totalEntriesTooltip: Total entries
    summary:
        confirmed: Confirmed
        entryId: Entry Id
--- a/src/i18n/locale/es.yml
+++ b/src/i18n/locale/es.yml
@ -94,6 +94,7 @@ globals:
    from: Desde
    to: Hasta
    notes: Notas
+    refresh: Actualizar
    pageTitles:
        logIn: Inicio de sesión
        summary: Resumen
@ -257,6 +258,9 @@ globals:
        twoFactor: Doble factor
        recoverPassword: Recuperar contraseña
        resetPassword: Restablecer contraseña
+        ticketsMonitor: Monitor de tickets
+        clientsActionsMonitor: Clientes y acciones
+        serial: Facturas por serie
    created: Fecha creación
    worker: Trabajador
    now: Ahora
@ -270,6 +274,7 @@ globals:
        subtitle: ¿Seguro que quiere salir sin guardar?
    createInvoiceIn: Crear factura recibida
    myAccount: Mi cuenta
+    noOne: Nadie
 errors:
    statusUnauthorized: Acceso denegado
    statusInternalServerError: Ha ocurrido un error interno del servidor
@ -453,6 +458,7 @@ entry:
            travelFk: Envio
            isExcludedFromAvailable: Inventario
            isRaid: Redada
+            invoiceAmount: Importe
    summary:
        commission: Comisión
        currency: Moneda
@ -1099,11 +1105,14 @@ travel:
            id: Id
            ref: Referencia
            agency: Agencia
-            shipped: Enviado
-            landed: Llegada
-            warehouseIn: Almacén de salida
-            warehouseOut: Almacén de entrada
-            totalEntries: Total de entradas
+            shipped: F.envío
+            shipHour: Hora de envío
+            landHour: Hora de llegada
+            landed: F.entrega
+            warehouseIn: Alm.salida
+            warehouseOut: Alm.entrada
+            totalEntries: ∑
+            totalEntriesTooltip: Entradas totales
    summary:
        confirmed: Confirmado
        entryId: Id entrada
@ -1268,6 +1277,7 @@ components:
        clone: Clonar
        openCard: Ficha
        openSummary: Detalles
+        viewSummary: Vista previa
    cardDescriptor:
        mainList: Listado principal
        summary: Resumen
--- a/src/pages/Account/AccountAcls.vue
+++ b/src/pages/Account/AccountAcls.vue
@ -141,6 +141,7 @@ const deleteAcl = async ({ id }) => {
            formInitialData: {},
        }"
        order="id DESC"
+        :disable-option="{ card: true }"
        :columns="columns"
        default-mode="table"
        :right-search="true"
--- a/src/pages/Account/AccountAliasList.vue
+++ b/src/pages/Account/AccountAliasList.vue
@ -21,24 +21,21 @@ const columns = computed(() => [
    {
        align: 'left',
        name: 'id',
-        label: t('id'),
+        label: t('Id'),
        isId: true,
-        field: 'id',
        cardVisible: true,
    },
    {
        align: 'left',
        name: 'alias',
-        label: t('alias'),
-        field: 'alias',
+        label: t('Alias'),
        cardVisible: true,
        create: true,
    },
    {
        align: 'left',
        name: 'description',
-        label: t('description'),
-        field: 'description',
+        label: t('Description'),
        cardVisible: true,
        create: true,
    },
@ -69,9 +66,17 @@ const columns = computed(() => [
        }"
        order="id DESC"
        :columns="columns"
+        :disable-option="{ card: true }"
        default-mode="table"
        redirect="account/alias"
        :is-editable="true"
        :use-model="true"
    />
 </template>
+
+<i18n>
+    es:
+        Id: Id
+        Alias: Alias
+        Description: Descripción
+</i18n>
--- a/src/pages/Account/AccountList.vue
+++ b/src/pages/Account/AccountList.vue
@ -14,15 +14,23 @@ const columns = computed(() => [
    {
        align: 'left',
        name: 'id',
-        label: t('id'),
+        label: t('Id'),
        isId: true,
        field: 'id',
        cardVisible: true,
+        columnFilter: {
+            component: 'select',
+            name: 'search',
+            attrs: {
+                url: 'VnUsers/preview',
+                fields: ['id', 'name'],
+            },
+        },
    },
    {
        align: 'left',
        name: 'username',
-        label: t('nickname'),
+        label: t('Nickname'),
        isTitle: true,
        component: 'input',
        columnField: {
@ -37,7 +45,7 @@ const columns = computed(() => [
    {
        align: 'left',
        name: 'name',
-        label: t('name'),
+        label: t('Name'),
        component: 'input',
        columnField: {
            component: null,
@ -65,6 +73,7 @@ const columns = computed(() => [
                title: t('View Summary'),
                icon: 'preview',
                action: (row) => viewSummary(row.id, AccountSummary),
+                isPrimary: true,
            },
        ],
    },
@ -108,3 +117,10 @@ const exprBuilder = (param, value) => {
        :use-model="true"
    />
 </template>
+
+<i18n>
+    es:
+        Id: Id
+        Nickname: Nickname
+        Name: Nombre
+</i18n>
--- a/src/pages/Account/Card/AccountCard.vue
+++ b/src/pages/Account/Card/AccountCard.vue
@ -15,7 +15,6 @@ const { t } = useI18n();
            url: 'VnUsers/preview',
            label: t('account.search'),
            info: t('account.searchInfo'),
-            searchUrl: 'table',
        }"
    />
 </template>
--- a/src/pages/Account/Card/AccountDescriptor.vue
+++ b/src/pages/Account/Card/AccountDescriptor.vue
@ -72,7 +72,7 @@ const hasAccount = ref(false);
            </VnImg>
        </template>
        <template #body="{ entity }">
-            <VnLv :label="t('account.card.nickname')" :value="entity.nickname" />
+            <VnLv :label="t('account.card.nickname')" :value="entity.name" />
            <VnLv :label="t('account.card.role')" :value="entity.role.name" />
        </template>
        <template #actions="{ entity }">
--- a/src/pages/Account/Card/AccountPrivileges.vue
+++ b/src/pages/Account/Card/AccountPrivileges.vue
@ -1,5 +1,5 @@
 <script setup>
-import { ref } from 'vue';
+import { ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRoute } from 'vue-router';

@ -12,17 +12,14 @@ const route = useRoute();

 const rolesOptions = ref([]);
 const formModelRef = ref();
+watch(
+    () => route.params.id,
+    () => formModelRef.value.reset()
+);
 </script>
 <template>
    <FetchData url="VnRoles" auto-load @on-fetch="(data) => (rolesOptions = data)" />
-    <FormModel
-        ref="formModelRef"
-        model="AccountPrivileges"
-        :url="`VnUsers/${route.params.id}/privileges`"
-        :url-create="`VnUsers/${route.params.id}/privileges`"
-        auto-load
-        @on-data-saved="formModelRef.fetch()"
-    >
+    <FormModel ref="formModelRef" model="AccountPrivileges" url="VnUsers" auto-load>
        <template #form="{ data }">
            <div class="q-gutter-y-sm">
                <QCheckbox
--- a/src/pages/Account/Card/AccountSummary.vue
+++ b/src/pages/Account/Card/AccountSummary.vue
@ -48,7 +48,7 @@ const filter = {
                        <QIcon name="open_in_new" />
                    </router-link>
                </QCardSection>
-                <VnLv :label="t('account.card.nickname')" :value="account.nickname" />
+                <VnLv :label="t('account.card.nickname')" :value="account.name" />
                <VnLv :label="t('account.card.role')" :value="account.role.name" />
            </QCard>
        </template>
--- a/src/pages/Account/Role/AccountRoles.vue
+++ b/src/pages/Account/Role/AccountRoles.vue
@ -21,24 +21,30 @@ const columns = computed(() => [
    {
        align: 'left',
        name: 'id',
-        label: t('id'),
+        label: t('Id'),
        isId: true,
        columnFilter: {
            inWhere: true,
+            component: 'select',
+            name: 'search',
+            attrs: {
+                url: 'VnRoles',
+                fields: ['id', 'name'],
+            },
        },
        cardVisible: true,
    },
    {
        align: 'left',
        name: 'name',
-        label: t('name'),
+        label: t('Name'),
        cardVisible: true,
        create: true,
    },
    {
        align: 'left',
        name: 'description',
-        label: t('description'),
+        label: t('Description'),
        cardVisible: true,
        create: true,
    },
@ -51,6 +57,7 @@ const columns = computed(() => [
                title: t('View Summary'),
                icon: 'preview',
                action: (row) => viewSummary(row.id, RoleSummary),
+                isPrimary: true,
            },
        ],
    },
@ -93,8 +100,16 @@ const exprBuilder = (param, value) => {
            },
        }"
        order="id ASC"
+        :disable-option="{ card: true }"
        :columns="columns"
        default-mode="table"
        redirect="account/role"
    />
 </template>
+
+<i18n>
+    es:
+        Id: Id
+        Description: Descripción
+        Name: Nombre
+</i18n>
--- a/src/pages/Claim/Card/ClaimSummary.vue
+++ b/src/pages/Claim/Card/ClaimSummary.vue
@ -36,8 +36,6 @@ const $props = defineProps({

 const entityId = computed(() => $props.id || route.params.id);
 const ClaimStates = ref([]);
-const claimUrl = ref();
-const salixUrl = ref();
 const claimDmsRef = ref();
 const claimDms = ref([]);
 const multimediaDialog = ref();
@ -152,11 +150,6 @@ const developmentColumns = ref([
    },
 ]);

-onMounted(async () => {
-    salixUrl.value = await getUrl('');
-    claimUrl.value = salixUrl.value + `claim/${entityId.value}/`;
-});
-
 async function getClaimDms() {
    claimDmsFilter.value.where = { claimFk: entityId.value };
    await claimDmsRef.value.fetch();
@ -177,10 +170,15 @@ function openDialog(dmsId) {
    multimediaSlide.value = dmsId;
    multimediaDialog.value = true;
 }
+
 async function changeState(value) {
    await axios.patch(`Claims/updateClaim/${entityId.value}`, { claimStateFk: value });
    router.go(route.fullPath);
 }
+
+function claimUrl(section) {
+    return '#/claim/' + entityId.value + '/' + section;
+}
 </script>

 <template>
@ -234,7 +232,7 @@ async function changeState(value) {
        <template #body="{ entity: { claim, salesClaimed, developments } }">
            <QCard class="vn-one" v-if="$route.name != 'ClaimSummary'">
                <VnTitle
-                    :url="`#/claim/${entityId}/basic-data`"
+                    :url="claimUrl('basic-data')"
                    :text="t('globals.pageTitles.basicData')"
                />
                <VnLv :label="t('claim.created')" :value="toDate(claim.created)" />
@ -275,7 +273,7 @@ async function changeState(value) {
                />
            </QCard>
            <QCard class="vn-two">
-                <VnTitle :url="`#/claim/${entityId}/notes`" :text="t('claim.notes')" />
+                <VnTitle :url="claimUrl('notes')" :text="t('claim.notes')" />
                <ClaimNotes
                    :id="entityId"
                    :add-note="false"
@ -284,7 +282,7 @@ async function changeState(value) {
                />
            </QCard>
            <QCard class="vn-two" v-if="claimDms?.length">
-                <VnTitle :url="`#/claim/${entityId}/photos`" :text="t('claim.photos')" />
+                <VnTitle :url="claimUrl('photos')" :text="t('claim.photos')" />
                <div class="container max-container-height" style="overflow: auto">
                    <div
                        class="multimedia-container"
@ -326,7 +324,7 @@ async function changeState(value) {
                </div>
            </QCard>
            <QCard class="vn-max" v-if="salesClaimed.length > 0">
-                <VnTitle :url="`#/claim/${entityId}/lines`" :text="t('claim.details')" />
+                <VnTitle :url="claimUrl('lines')" :text="t('claim.details')" />
                <QTable
                    :columns="detailsColumns"
                    :rows="salesClaimed"
@ -365,7 +363,7 @@ async function changeState(value) {
                </QTable>
            </QCard>
            <QCard class="vn-max" v-if="developments.length > 0">
-                <VnTitle :url="claimUrl + 'development'" :text="t('claim.development')" />
+                <VnTitle :url="claimUrl('development')" :text="t('claim.development')" />
                <QTable
                    :columns="developmentColumns"
                    :rows="developments"
@ -390,7 +388,7 @@ async function changeState(value) {
                </QTable>
            </QCard>
            <QCard class="vn-max">
-                <VnTitle :url="claimUrl + 'action'" :text="t('claim.actions')" />
+                <VnTitle :url="claimUrl('action')" :text="t('claim.actions')" />
                <div id="slider-container" class="q-px-xl q-py-md">
                    <QSlider
                        v-model="claim.responsibility"
--- a/src/pages/Claim/ClaimList.vue
+++ b/src/pages/Claim/ClaimList.vue
@ -79,7 +79,7 @@ const columns = computed(() => [
        align: 'left',
        label: t('claim.state'),
        format: ({ stateCode }) =>
-            claimFilterRef.value?.states.find(({code}) => code === stateCode)
+            claimFilterRef.value?.states.find(({ code }) => code === stateCode)
                ?.description,
        name: 'stateCode',
        chip: {
@ -100,7 +100,7 @@ const columns = computed(() => [
        name: 'tableActions',
        actions: [
            {
-                title: t('Client ticket list'),
+                title: t('components.smartCard.viewSummary'),
                icon: 'preview',
                action: (row) => viewSummary(row.id, ClaimSummary),
            },
--- a/src/pages/Customer/Card/CustomerBasicData.vue
+++ b/src/pages/Customer/Card/CustomerBasicData.vue
@ -97,7 +97,12 @@ const title = ref();
                    :rules="validate('client.salesPersonFk')"
                    :use-like="false"
                    :emit-value="false"
-                    @update:model-value="(val) => (title = val?.nickname)"
+                    @update:model-value="
+                        (val) => {
+                            title = val?.nickname;
+                            data.salesPersonFk = val?.id;
+                        }
+                    "
                >
                    <template #prepend>
                        <VnAvatar
--- a/src/pages/Customer/CustomerList.vue
+++ b/src/pages/Customer/CustomerList.vue
@ -357,7 +357,7 @@ const columns = computed(() => [
                isPrimary: true,
            },
            {
-                title: t('Client ticket list'),
+                title: t('components.smartCard.viewSummary'),
                icon: 'preview',
                action: (row) => viewSummary(row.id, CustomerSummary),
            },
--- a/src/pages/Entry/Card/EntryBasicData.vue
+++ b/src/pages/Entry/Card/EntryBasicData.vue
@ -19,8 +19,6 @@ const { t } = useI18n();
 const { hasAny } = useRole();
 const isAdministrative = () => hasAny(['administrative']);

-const suppliersOptions = ref([]);
-const travelsOptions = ref([]);
 const companiesOptions = ref([]);
 const currenciesOptions = ref([]);

@ -29,20 +27,6 @@ const onFilterTravelSelected = (formData, id) => {
 };
 </script>
 <template>
-    <FetchData
-        url="Suppliers"
-        :filter="{ fields: ['id', 'nickname'] }"
-        order="nickname"
-        @on-fetch="(data) => (suppliersOptions = data)"
-        auto-load
-    />
-    <FetchData
-        url="Travels/filter"
-        :filter="{ fields: ['id', 'warehouseInName'] }"
-        order="id"
-        @on-fetch="(data) => (travelsOptions = data)"
-        auto-load
-    />
    <FetchData
        ref="companiesRef"
        url="Companies"
@ -71,9 +55,10 @@ const onFilterTravelSelected = (formData, id) => {
                <VnSelect
                    :label="t('entry.basicData.supplier')"
                    v-model="data.supplierFk"
-                    :options="suppliersOptions"
+                    url="Suppliers"
                    option-value="id"
                    option-label="nickname"
+                    :fields="['id', 'nickname']"
                    hide-selected
                    :required="true"
                    map-options
@ -92,7 +77,8 @@ const onFilterTravelSelected = (formData, id) => {
                <VnSelectDialog
                    :label="t('entry.basicData.travel')"
                    v-model="data.travelFk"
-                    :options="travelsOptions"
+                    url="Travels/filter"
+                    :fields="['id', 'warehouseInName']"
                    option-value="id"
                    option-label="warehouseInName"
                    map-options
--- a/src/pages/Entry/EntryFilter.vue
+++ b/src/pages/Entry/EntryFilter.vue
@ -20,7 +20,6 @@ const props = defineProps({

 const currenciesOptions = ref([]);
 const companiesOptions = ref([]);
-const suppliersOptions = ref([]);

 const stateStore = useStateStore();
 onMounted(async () => {
@ -45,14 +44,6 @@ onMounted(async () => {
        @on-fetch="(data) => (currenciesOptions = data)"
        auto-load
    />
-    <FetchData
-        url="Suppliers"
-        :filter="{ fields: ['id', 'nickname', 'name'] }"
-        order="nickname"
-        @on-fetch="(data) => (suppliersOptions = data)"
-        auto-load
-    />
-
    <VnFilterPanel :data-key="props.dataKey" :search-button="true">
        <template #tags="{ tag, formatFn }">
            <div class="q-gutter-x-xs">
@ -135,9 +126,11 @@ onMounted(async () => {
                        :label="t('params.supplierFk')"
                        v-model="params.supplierFk"
                        @update:model-value="searchFn()"
-                        :options="suppliersOptions"
+                        url="Suppliers"
                        option-value="id"
                        option-label="name"
+                        :fields="['id', 'name', 'nickname']"
+                        sort-by="nickname"
                        hide-selected
                        dense
                        outlined
--- a/src/pages/Entry/EntryList.vue
+++ b/src/pages/Entry/EntryList.vue
@ -7,11 +7,19 @@ import { useStateStore } from 'stores/useStateStore';
 import VnTable from 'components/VnTable/VnTable.vue';
 import RightMenu from 'src/components/common/RightMenu.vue';
 import { toDate } from 'src/filters';
+import { useSummaryDialog } from 'src/composables/useSummaryDialog';
+import EntrySummary from './Card/EntrySummary.vue';
+import VnUserLink from 'components/ui/VnUserLink.vue';
+import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
+import CustomerDescriptorProxy from '../Customer/Card/CustomerDescriptorProxy.vue';
+import SupplierDescriptorProxy from 'src/pages/Supplier/Card/SupplierDescriptorProxy.vue';
+import TravelDescriptorProxy from 'src/pages/Travel/Card/TravelDescriptorProxy.vue';

 const stateStore = useStateStore();
 const { t } = useI18n();
 const tableRef = ref();

+const { viewSummary } = useSummaryDialog();
 const entryFilter = {
    include: [
        {
@ -142,6 +150,12 @@ const columns = computed(() => [
        create: true,
        format: (row, dashIfEmpty) => dashIfEmpty(row.travelRef),
    },
+    {
+        align: 'left',
+        label: t('entry.list.tableVisibleColumns.invoiceAmount'),
+        name: 'invoiceAmount',
+        cardVisible: true,
+    },
    {
        align: 'left',
        label: t('entry.list.tableVisibleColumns.isExcludedFromAvailable'),
@ -168,6 +182,18 @@ const columns = computed(() => [
            inWhere: true,
        },
    },
+    {
+        align: 'right',
+        name: 'tableActions',
+        actions: [
+            {
+                title: t('components.smartCard.viewSummary'),
+                icon: 'preview',
+                action: (row) => viewSummary(row.id, EntrySummary),
+                isPrimary: true,
+            },
+        ],
+    },
 ]);
 onMounted(async () => {
    stateStore.rightDrawer = true;
@ -201,7 +227,20 @@ onMounted(async () => {
        redirect="entry"
        auto-load
        :right-search="false"
-    />
+    >
+        <template #column-supplierFk="{ row }">
+            <span class="link" @click.stop>
+                {{ row.supplierName }}
+                <SupplierDescriptorProxy :id="row.supplierFk" />
+            </span>
+        </template>
+        <template #column-travelFk="{ row }">
+            <span class="link" @click.stop>
+                {{ row.travelRef }}
+                <TravelDescriptorProxy :id="row.travelFk" />
+            </span>
+        </template>
+    </VnTable>
 </template>

 <i18n>
--- a/src/pages/InvoiceIn/Card/InvoiceInDueDay.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInDueDay.vue
@ -18,6 +18,7 @@ const { notify } = useNotify();
 const { t } = useI18n();
 const arrayData = useArrayData();
 const invoiceIn = computed(() => arrayData.store.data);
+const currency = computed(() => invoiceIn.value?.currency?.code);

 const rowsSelected = ref([]);
 const banks = ref([]);
@ -139,9 +140,9 @@ const getTotalAmount = (rows) => rows.reduce((acc, { amount }) => acc + +amount,
                    <QTd>
                        <VnInputNumber
                            :class="{
-                                'no-pointer-events': !isNotEuro(invoiceIn.currency.code),
+                                'no-pointer-events': !isNotEuro(currency),
                            }"
-                            :disable="!isNotEuro(invoiceIn.currency.code)"
+                            :disable="!isNotEuro(currency)"
                            v-model="row.foreignValue"
                            clearable
                            clear-icon="close"
@ -154,9 +155,7 @@ const getTotalAmount = (rows) => rows.reduce((acc, { amount }) => acc + +amount,
                        <QTd />
                        <QTd />
                        <QTd>
-                            {{
-                                toCurrency(getTotalAmount(rows), invoiceIn.currency.code)
-                            }}
+                            {{ toCurrency(getTotalAmount(rows), currency) }}
                        </QTd>
                        <QTd />
                    </QTr>
@ -208,11 +207,9 @@ const getTotalAmount = (rows) => rows.reduce((acc, { amount }) => acc + +amount,
                                        :label="t('Foreign value')"
                                        class="full-width"
                                        :class="{
-                                            'no-pointer-events': !isNotEuro(
-                                                invoiceIn.currency.code
-                                            ),
+                                            'no-pointer-events': !isNotEuro(currency),
                                        }"
-                                        :disable="!isNotEuro(invoiceIn.currency.code)"
+                                        :disable="!isNotEuro(currency)"
                                        v-model="props.row.foreignValue"
                                        clearable
                                        clear-icon="close"
--- a/src/pages/InvoiceIn/Card/InvoiceInVat.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInVat.vue
@ -242,11 +242,12 @@ const formatOpt = (row, { model, options }, prop) => {
                </template>
                <template #body-cell-taxablebase="{ row }">
                    <QTd>
+                        {{ currency }}
                        <VnInputNumber
                            :class="{
-                                'no-pointer-events': isNotEuro(invoiceIn.currency.code),
+                                'no-pointer-events': isNotEuro(currency),
                            }"
-                            :disable="isNotEuro(invoiceIn.currency.code)"
+                            :disable="isNotEuro(currency)"
                            label=""
                            clear-icon="close"
                            v-model="row.taxableBase"
@ -312,9 +313,9 @@ const formatOpt = (row, { model, options }, prop) => {
                    <QTd>
                        <VnInputNumber
                            :class="{
-                                'no-pointer-events': !isNotEuro(invoiceIn.currency.code),
+                                'no-pointer-events': !isNotEuro(currency),
                            }"
-                            :disable="!isNotEuro(invoiceIn.currency.code)"
+                            :disable="!isNotEuro(currency)"
                            v-model="row.foreignValue"
                        />
                    </QTd>
@ -361,12 +362,10 @@ const formatOpt = (row, { model, options }, prop) => {
                                    <VnInputNumber
                                        :label="t('Taxable base')"
                                        :class="{
-                                            'no-pointer-events': isNotEuro(
-                                                invoiceIn.currency.code
-                                            ),
+                                            'no-pointer-events': isNotEuro(currency),
                                        }"
                                        class="full-width"
-                                        :disable="isNotEuro(invoiceIn.currency.code)"
+                                        :disable="isNotEuro(currency)"
                                        clear-icon="close"
                                        v-model="props.row.taxableBase"
                                        clearable
@ -427,11 +426,9 @@ const formatOpt = (row, { model, options }, prop) => {
                                        :label="t('Foreign value')"
                                        class="full-width"
                                        :class="{
-                                            'no-pointer-events': !isNotEuro(
-                                                invoiceIn.currency.code
-                                            ),
+                                            'no-pointer-events': !isNotEuro(currency),
                                        }"
-                                        :disable="!isNotEuro(invoiceIn.currency.code)"
+                                        :disable="!isNotEuro(currency)"
                                        v-model="props.row.foreignValue"
                                    />
                                </QItem>
--- a/src/pages/InvoiceIn/Serial/InvoiceInSerial.vue
+++ b/src/pages/InvoiceIn/Serial/InvoiceInSerial.vue
@ -0,0 +1,68 @@
+<script setup>
+import { ref, computed, onBeforeMount } from 'vue';
+import { useRoute } from 'vue-router';
+import { useI18n } from 'vue-i18n';
+import axios from 'axios';
+import VnTable from 'src/components/VnTable/VnTable.vue';
+import RightMenu from 'src/components/common/RightMenu.vue';
+import InvoiceInSerialFilter from './InvoiceInSerialFilter.vue';
+
+const { t } = useI18n();
+
+const cols = computed(() => [
+    {
+        align: 'left',
+        name: 'serial',
+        label: t('Serial'),
+        columnFilter: false,
+    },
+    {
+        align: 'left',
+        name: 'pending',
+        label: t('Pending'),
+        columnFilter: false,
+    },
+    {
+        align: 'left',
+        name: 'total',
+        label: 'Total',
+        columnFilter: false,
+    },
+]);
+
+const daysAgo = ref();
+
+onBeforeMount(async () => {
+    const tableParam = useRoute().query.table;
+
+    if (tableParam) daysAgo.value = JSON.parse(tableParam).daysAgo;
+    else
+        daysAgo.value = (
+            await axios.get('InvoiceInConfigs/findOne', {
+                params: { filter: { fields: ['daysAgo'] } },
+            })
+        ).data?.daysAgo;
+});
+</script>
+<template>
+    <RightMenu>
+        <template #right-panel>
+            <InvoiceInSerialFilter data-key="InvoiceInSerial" />
+        </template>
+    </RightMenu>
+    <VnTable
+        v-if="!isNaN(daysAgo)"
+        data-key="InvoiceInSerial"
+        url="InvoiceIns/getSerial"
+        :columns="cols"
+        :right-search="false"
+        :user-params="{ daysAgo }"
+        :disable-option="{ card: true }"
+        auto-load
+    />
+</template>
+<i18n>
+es:
+    Serial: Serie
+    Pending: Pendiente
+</i18n>
--- a/src/pages/InvoiceIn/Serial/InvoiceInSerialFilter.vue
+++ b/src/pages/InvoiceIn/Serial/InvoiceInSerialFilter.vue
@ -0,0 +1,53 @@
+<script setup>
+import { useI18n } from 'vue-i18n';
+import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
+import VnInput from 'src/components/common/VnInput.vue';
+import VnInputNumber from 'src/components/common/VnInputNumber.vue';
+defineProps({ dataKey: { type: String, required: true } });
+
+const { t } = useI18n();
+</script>
+<template>
+    <VnFilterPanel :data-key="dataKey" :search-button="true">
+        <template #tags="{ tag, formatFn }">
+            <div class="q-gutter-x-xs">
+                <strong>{{ t(`params.${tag.label}`) }}: </strong>
+                <span>{{ formatFn(tag.value) }}</span>
+            </div>
+        </template>
+        <template #body="{ params }">
+            <QItem>
+                <QItemSection>
+                    <VnInputNumber
+                        v-model="params.daysAgo"
+                        :label="t('params.daysAgo')"
+                        outlined
+                        rounded
+                        dense
+                    />
+                </QItemSection>
+            </QItem>
+            <QItem>
+                <QItemSection>
+                    <VnInput
+                        v-model="params.serial"
+                        :label="t('params.serial')"
+                        outlined
+                        rounded
+                        dense
+                    />
+                </QItemSection>
+            </QItem>
+        </template>
+    </VnFilterPanel>
+</template>
+<i18n>
+en:
+    params:
+        daysAgo: Last days
+        serial: serial
+es:
+    params:
+        daysAgo: Últimos días
+        serial: serie
+</i18n>
--- a/src/pages/InvoiceOut/InvoiceOutGlobalForm.vue
+++ b/src/pages/InvoiceOut/InvoiceOutGlobalForm.vue
@ -52,7 +52,7 @@ const getStatus = computed({

 onMounted(async () => {
    await invoiceOutGlobalStore.init();
-    formData.value = formInitialData.value.invoiceDate;
+    formData.value = { invoiceDate: formInitialData.value.invoiceDate };
 });
 </script>

@ -101,7 +101,17 @@ onMounted(async () => {
                dense
                outlined
                rounded
-            />
+            >
+                <template #option="scope">
+                    <QItem v-bind="scope.itemProps">
+                        <QItemSection>
+                            <QItemLabel>
+                                #{{ scope.opt?.id }} {{ scope.opt?.name }}
+                            </QItemLabel>
+                        </QItemSection>
+                    </QItem>
+                </template>
+            </VnSelect>
            <VnSelect
                :label="t('invoiceOutSerialType')"
                v-model="formData.serialType"
@ -127,9 +137,7 @@ onMounted(async () => {
                :label="t('company')"
                v-model="formData.companyFk"
                :options="companiesOptions"
-                option-value="id"
                option-label="code"
-                hide-selected
                dense
                outlined
                rounded
@ -138,9 +146,6 @@ onMounted(async () => {
                :label="t('printer')"
                v-model="formData.printer"
                :options="printersOptions"
-                option-value="id"
-                option-label="name"
-                hide-selected
                dense
                outlined
                rounded
--- a/src/pages/InvoiceOut/InvoiceOutList.vue
+++ b/src/pages/InvoiceOut/InvoiceOutList.vue
@ -122,7 +122,7 @@ const columns = computed(() => [
        name: 'tableActions',
        actions: [
            {
-                title: t('InvoiceOutSummary'),
+                title: t('components.smartCard.viewSummary'),
                icon: 'preview',
                action: (row) => viewSummary(row.id, InvoiceOutSummary),
            },
@ -226,10 +226,18 @@ watchEffect(selectedRows);
                    url="Tickets"
                    v-model="data.ticketFk"
                    :label="t('invoiceOutList.tableVisibleColumns.ticket')"
-                    :options="ticketsOptions"
-                    option-label="nickname"
+                    option-label="id"
                    option-value="id"
-                />
+                >
+                    <template #option="scope">
+                        <QItem v-bind="scope.itemProps">
+                            <QItemSection>
+                                <QItemLabel> #{{ scope.opt?.id }} </QItemLabel>
+                                <QItemLabel caption>{{ scope.opt?.nickname }}</QItemLabel>
+                            </QItemSection>
+                        </QItem>
+                    </template>
+                </VnSelect>
                <span class="q-ml-md">O</span>
            </div>
            <VnSelect
@ -242,7 +250,7 @@ watchEffect(selectedRows);
            />
            <VnSelect
                url="InvoiceOutSerials"
-                v-model="data.invoiceOutSerial"
+                v-model="data.serial"
                :label="t('invoiceOutList.tableVisibleColumns.invoiceOutSerial')"
                :options="invoiceOutSerialsOptions"
                option-label="description"
@ -254,7 +262,7 @@ watchEffect(selectedRows);
            />
            <VnSelect
                url="TaxAreas"
-                v-model="data.area"
+                v-model="data.taxArea"
                :label="t('invoiceOutList.tableVisibleColumns.taxArea')"
                :options="taxAreasOptions"
                option-label="code"
--- a/src/pages/Item/Card/ItemBotanical.vue
+++ b/src/pages/Item/Card/ItemBotanical.vue
@ -19,15 +19,6 @@ const itemSpeciesOptions = ref([]);
 const itemBotanicals = ref([]);
 let itemBotanicalsForm = reactive({ itemFk: null });

-const onGenusCreated = (response, formData) => {
-    itemGenusOptions.value = [...itemGenusOptions.value, response];
-    formData.genusFk = response.id;
-};
-
-const onSpecieCreated = (response, formData) => {
-    itemSpeciesOptions.value = [...itemSpeciesOptions.value, response];
-    formData.specieFk = response.id;
-};
 const entityId = computed(() => {
    return route.params.id;
 });
@ -47,18 +38,6 @@ onMounted(async () => {
        }"
        @on-fetch="(data) => (itemBotanicals = data)"
    />
-    <FetchData
-        url="Genera"
-        :filter="{ fields: ['id', 'name'], order: 'name ASC' }"
-        @on-fetch="(data) => (itemGenusOptions = data)"
-        auto-load
-    />
-    <FetchData
-        url="Species"
-        :filter="{ fields: ['id', 'name'], order: 'name ASC' }"
-        @on-fetch="(data) => (itemSpeciesOptions = data)"
-        auto-load
-    />
    <FormModel
        url-update="ItemBotanicals"
        model="entry"
@ -69,36 +48,35 @@ onMounted(async () => {
        <template #form="{ data }">
            <VnRow>
                <VnSelectDialog
+                    ref="genusRef"
                    :label="t('Genus')"
                    v-model="data.genusFk"
-                    :options="itemGenusOptions"
+                    url="Genera"
                    option-label="name"
                    option-value="id"
+                    :fields="['id', 'name']"
+                    sort-by="name ASC"
                    hide-selected
                >
                    <template #form>
                        <CreateGenusForm
-                            @on-data-saved="
-                                (_, requestResponse) =>
-                                    onGenusCreated(requestResponse, data)
-                            "
+                            @on-data-saved="(_, res) => (data.genusFk = res.id)"
                        />
                    </template>
                </VnSelectDialog>
                <VnSelectDialog
                    :label="t('Species')"
                    v-model="data.specieFk"
-                    :options="itemSpeciesOptions"
+                    url="Species"
                    option-label="name"
                    option-value="id"
+                    :fields="['id', 'name']"
+                    sort-by="name ASC"
                    hide-selected
                >
                    <template #form>
                        <CreateSpecieForm
-                            @on-data-saved="
-                                (_, requestResponse) =>
-                                    onSpecieCreated(requestResponse, data)
-                            "
+                            @on-data-saved="(_, res) => (data.specieFk = res.id)"
                        />
                    </template>
                </VnSelectDialog>
--- a/src/pages/Item/Card/ItemShelving.vue
+++ b/src/pages/Item/Card/ItemShelving.vue
@ -3,7 +3,6 @@ import { onMounted, ref, computed, reactive } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRoute } from 'vue-router';

-import FetchData from 'components/FetchData.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 import VnSelect from 'src/components/common/VnSelect.vue';
 import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
@ -24,8 +23,6 @@ const { notify } = useNotify();
 const { openConfirmationModal } = useVnConfirm();

 const rowsSelected = ref([]);
-const parkingsOptions = ref([]);
-const shelvingsOptions = ref([]);

 const exprBuilder = (param, value) => {
    switch (param) {
@ -104,7 +101,9 @@ const columns = computed(() => [
            filterValue: null,
            event: getInputEvents,
            attrs: {
-                options: parkingsOptions.value,
+                url: 'parkings',
+                fields: ['code'],
+                'sort-by': 'code ASC',
                'option-value': 'code',
                'option-label': 'code',
                dense: true,
@ -124,7 +123,9 @@ const columns = computed(() => [
            filterValue: null,
            event: getInputEvents,
            attrs: {
-                options: shelvingsOptions.value,
+                url: 'shelvings',
+                fields: ['code'],
+                'sort-by': 'code ASC',
                'option-value': 'code',
                'option-label': 'code',
                dense: true,
@ -188,18 +189,6 @@ onMounted(async () => {
 </script>

 <template>
-    <FetchData
-        url="parkings"
-        :filter="{ fields: ['code'], order: 'code ASC' }"
-        auto-load
-        @on-fetch="(data) => (parkingsOptions = data)"
-    />
-    <FetchData
-        url="shelvings"
-        :filter="{ fields: ['code'], order: 'code ASC' }"
-        auto-load
-        @on-fetch="(data) => (shelvingsOptions = data)"
-    />
    <template v-if="stateStore.isHeaderMounted()">
        <Teleport to="#st-data">
            <div class="q-pa-md q-mr-lg q-ma-xs" style="border: 2px solid #222">
@ -237,7 +226,6 @@ onMounted(async () => {
            </QBtn>
        </Teleport>
    </template>
-
    <QPage class="column items-center q-pa-md">
        <QTable
            :rows="rows"
--- a/src/pages/Item/Card/ItemTags.vue
+++ b/src/pages/Item/Card/ItemTags.vue
@ -24,6 +24,7 @@ const getSelectedTagValues = async (tag) => {
        const filter = {
            fields: ['value'],
            order: 'value ASC',
+            limit: 30,
        };

        const params = { filter: JSON.stringify(filter) };
@ -126,7 +127,7 @@ const insertTag = (rows) => {
                                :key="row.tagFk"
                                :label="t('Value')"
                                v-model="row.value"
-                                :options="valueOptionsMap.get(row.tagFk)"
+                                :url="`Tags/${row.tagFk}/filterValue`"
                                option-label="value"
                                option-value="value"
                                emit-value
@ -135,6 +136,7 @@ const insertTag = (rows) => {
                                :is-clearable="false"
                                :required="false"
                                :rules="validate('itemTag.tagFk')"
+                                :use-like="false"
                            />
                            <VnInput
                                v-else-if="
--- a/src/pages/Item/ItemListFilter.vue
+++ b/src/pages/Item/ItemListFilter.vue
@ -30,7 +30,7 @@ const itemTypesRef = ref(null);
 const categoriesOptions = ref([]);
 const itemTypesOptions = ref([]);
 const buyersOptions = ref([]);
-const suppliersOptions = ref([]);
+const tagOptions = ref([]);
 const tagValues = ref([]);
 const fieldFiltersValues = ref([]);
 const moreFields = ref([]);
@ -161,12 +161,6 @@ onMounted(async () => {
        @on-fetch="(data) => (buyersOptions = data)"
        auto-load
    />
-    <FetchData
-        url="Suppliers"
-        :filter="{ fields: ['id', 'name', 'nickname'], order: 'name ASC' }"
-        @on-fetch="(data) => (suppliersOptions = data)"
-        auto-load
-    />
    <FetchData
        url="Tags"
        :filter="{ fields: ['id', 'name', 'isFree'] }"
@ -261,9 +255,11 @@ onMounted(async () => {
                        :label="t('params.supplierFk')"
                        v-model="params.supplierFk"
                        @update:model-value="searchFn()"
-                        :options="suppliersOptions"
+                        url="Suppliers"
                        option-value="id"
                        option-label="name"
+                        :fields="['id', 'name', 'nickname']"
+                        sort-by="name ASC"
                        hide-selected
                        dense
                        outlined
--- a/src/pages/Item/ItemRequest.vue
+++ b/src/pages/Item/ItemRequest.vue
@ -22,7 +22,6 @@ import RightMenu from 'src/components/common/RightMenu.vue';
 const { t } = useI18n();
 const { notify } = useNotify();
 const stateStore = useStateStore();
-const workersOptions = ref([]);
 let filterParams = ref({});
 const denyFormRef = ref(null);
 const denyRequestId = ref(null);
@ -208,13 +207,6 @@ onBeforeMount(() => {
 </script>

 <template>
-    <FetchData
-        url="Workers"
-        :filter="{ where: { role: 'buyer' } }"
-        order="id"
-        @on-fetch="(data) => (workersOptions = data)"
-        auto-load
-    />
    <VnSearchbar
        data-key="ItemRequests"
        url="TicketRequests/filter"
@ -268,7 +260,9 @@ onBeforeMount(() => {
                <QTd>
                    <VnSelect
                        v-model="row.attenderFk"
-                        :options="workersOptions"
+                        :where="{ role: 'buyer' }"
+                        sort-by="id"
+                        url="Workers"
                        hide-selected
                        option-label="firstName"
                        option-value="id"
--- a/src/pages/Item/ItemRequestFilter.vue
+++ b/src/pages/Item/ItemRequestFilter.vue
@ -24,7 +24,6 @@ const stateOptions = [

 const itemTypesOptions = ref([]);
 const warehousesOptions = ref([]);
-const workersOptions = ref([]);

 const exprBuilder = (param, value) => {
    switch (param) {
@ -72,18 +71,6 @@ const decrement = (paramsObj, key) => {
        @on-fetch="(data) => (warehousesOptions = data)"
        auto-load
    />
-    <FetchData
-        url="Workers/search"
-        :filter="{
-            fields: ['id', 'name'],
-            order: 'name ASC',
-        }"
-        :params="{
-            departmentCodes: ['VT'],
-        }"
-        @on-fetch="(data) => (workersOptions = data)"
-        auto-load
-    />
    <VnFilterPanel
        :data-key="props.dataKey"
        :search-button="true"
@ -162,7 +149,10 @@ const decrement = (paramsObj, key) => {
                        :label="t('params.requesterFk')"
                        v-model="params.requesterFk"
                        @update:model-value="searchFn()"
-                        :options="workersOptions"
+                        url="Workers/search"
+                        :fields="['id', 'name']"
+                        order="name ASC"
+                        :params="{ departmentCodes: ['VT'] }"
                        option-value="id"
                        option-label="name"
                        hide-selected
--- a/src/pages/Monitor/MonitorClients.vue
+++ b/src/pages/Monitor/MonitorClients.vue
@ -0,0 +1,145 @@
+<script setup>
+import { ref, computed } from 'vue';
+import { useI18n } from 'vue-i18n';
+import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
+import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
+import { toDateFormat } from 'src/filters/date.js';
+import VnTable from 'src/components/VnTable/VnTable.vue';
+import VnInputDate from 'src/components/common/VnInputDate.vue';
+import VnRow from 'src/components/ui/VnRow.vue';
+import { dateRange } from 'src/filters';
+const { t } = useI18n();
+
+const dates = dateRange(Date.vnNew());
+const from = ref(dates[0]);
+const to = ref(dates[1]);
+
+const filter = computed(() => {
+    const obj = {};
+    const formatFrom = setHours(from.value, 'from');
+    const formatTo = setHours(to.value, 'to');
+    let stamp;
+
+    if (!formatFrom && formatTo) stamp = { lte: formatTo };
+    else if (formatFrom && !formatTo) stamp = { gte: formatFrom };
+    else if (formatFrom && formatTo) stamp = { between: [formatFrom, formatTo] };
+
+    return Object.assign(obj, { where: { 'v.stamp': stamp } });
+});
+
+function exprBuilder(param, value) {
+    switch (param) {
+        case 'clientFk':
+            return { [`c.id`]: value };
+        case 'salesPersonFk':
+            return { [`c.${param}`]: value };
+    }
+}
+
+function setHours(date, type) {
+    if (!date) return null;
+
+    const d = new Date(date);
+    if (type == 'from') d.setHours(0, 0, 0, 0);
+    else d.setHours(23, 59, 59, 59);
+    return d;
+}
+
+const columns = computed(() => [
+    {
+        label: t('salesClientsTable.date'),
+        name: 'dated',
+        field: 'dated',
+        align: 'left',
+        columnFilter: false,
+        format: (row) => toDateFormat(row.dated, 'es-ES', { year: '2-digit' }),
+    },
+    {
+        label: t('salesClientsTable.hour'),
+        name: 'hour',
+        field: 'hour',
+        align: 'left',
+        columnFilter: false,
+    },
+    {
+        label: t('salesClientsTable.salesPerson'),
+        name: 'salesPersonFk',
+        field: 'salesPerson',
+        align: 'left',
+        columnField: {
+            component: null,
+        },
+        optionFilter: 'firstName',
+        columnFilter: {
+            component: 'select',
+            attrs: {
+                url: 'Workers/activeWithInheritedRole',
+                fields: ['id', 'name'],
+                sortBy: 'nickname ASC',
+                where: { role: 'salesPerson' },
+                useLike: false,
+            },
+        },
+        columnClass: 'no-padding',
+    },
+    {
+        label: t('salesClientsTable.client'),
+        field: 'clientName',
+        name: 'clientFk',
+        align: 'left',
+        columnField: {
+            component: null,
+        },
+        orderBy: 'c.name',
+        columnFilter: {
+            component: 'select',
+            attrs: {
+                url: 'Clients',
+                fields: ['id', 'name'],
+                sortBy: 'name ASC',
+            },
+        },
+        columnClass: 'no-padding',
+    },
+]);
+</script>
+
+<template>
+    <VnTable
+        ref="table"
+        data-key="SalesMonitorClients"
+        url="SalesMonitors/clientsFilter"
+        search-url="SalesMonitorClients"
+        :order="['dated DESC', 'hour DESC']"
+        :expr-builder="exprBuilder"
+        :filter="filter"
+        :offset="50"
+        auto-load
+        :columns="columns"
+        :right-search="false"
+        default-mode="table"
+        :disable-option="{ card: true }"
+        dense
+        class="q-px-none"
+    >
+        <template #top-left>
+            <VnRow>
+                <VnInputDate v-model="from" :label="$t('globals.from')" dense />
+                <VnInputDate v-model="to" :label="$t('globals.to')" dense />
+            </VnRow>
+        </template>
+        <template #column-salesPersonFk="{ row }">
+            <span class="link" :title="row.salesPerson" v-text="row.salesPerson" />
+            <WorkerDescriptorProxy :id="row.salesPersonFk" dense />
+        </template>
+        <template #column-clientFk="{ row }">
+            <span class="link" :title="row.clientName" v-text="row.clientName" />
+            <CustomerDescriptorProxy :id="row.clientFk" />
+        </template>
+    </VnTable>
+</template>
+<style lang="scss" scoped>
+.full-width .vn-row > * {
+    flex: 0.4;
+}
+</style>
--- a/src/pages/Monitor/MonitorClientsActions.vue
+++ b/src/pages/Monitor/MonitorClientsActions.vue
@ -0,0 +1,26 @@
+<script setup>
+import SalesClientTable from './MonitorClients.vue';
+import SalesOrdersTable from './MonitorOrders.vue';
+import VnRow from 'src/components/ui/VnRow.vue';
+</script>
+<template>
+    <VnRow
+        class="q-pa-md"
+        :style="{ 'flex-direction': $q.screen.lt.lg ? 'column' : 'row', gap: '0px' }"
+    >
+        <div style="flex: 0.3">
+            <span
+                class="q-ml-md text-body1"
+                v-text="$t('salesMonitor.clientsOnWebsite')"
+            />
+            <SalesClientTable />
+        </div>
+        <div style="flex: 0.7">
+            <span
+                class="q-ml-md text-body1"
+                v-text="$t('salesMonitor.recentOrderActions')"
+            />
+            <SalesOrdersTable />
+        </div>
+    </VnRow>
+</template>
--- a/src/pages/Monitor/MonitorList.vue
+++ b/src/pages/Monitor/MonitorList.vue
@ -1,90 +0,0 @@
-<script setup>
-import { onMounted, onUnmounted, ref } from 'vue';
-import { useI18n } from 'vue-i18n';
-
-import { useStateStore } from 'stores/useStateStore';
-import SalesClientTable from './SalesClientsTable.vue';
-import SalesOrdersTable from './SalesOrdersTable.vue';
-import SalesTicketsTable from './SalesTicketsTable.vue';
-import VnSearchbar from 'components/ui/VnSearchbar.vue';
-
-const { t } = useI18n();
-const stateStore = useStateStore();
-
-const expanded = ref(true);
-
-onMounted(async () => {
-    stateStore.leftDrawer = false;
-});
-
-onUnmounted(() => (stateStore.leftDrawer = true));
-</script>
-
-<template>
-    <template v-if="stateStore.isHeaderMounted()">
-        <Teleport to="#searchbar">
-            <VnSearchbar
-                data-key="SalesMonitorTickets"
-                url="SalesMonitors/salesFilter"
-                :redirect="false"
-                :label="t('searchBar.label')"
-                :info="t('searchBar.info')"
-            />
-        </Teleport>
-    </template>
-    <QPage class="column items-center q-pa-md">
-        <QCard class="full-width q-mb-lg">
-            <QExpansionItem v-model="expanded" dense :duration="150">
-                <template v-if="!expanded" #header>
-                    <div class="row full-width">
-                        <span class="flex col text-body1">
-                            {{ t('salesMonitor.clientsOnWebsite') }}
-                        </span>
-                        <span class="flex col q-ml-xl text-body1">
-                            {{ t('salesMonitor.recentOrderActions') }}
-                        </span>
-                    </div>
-                </template>
-                <template #default>
-                    <div class="expansion-tables-container">
-                        <QCardSection class="col">
-                            <span class="flex col q-mb-sm text-body1">
-                                {{ t('salesMonitor.clientsOnWebsite') }}
-                            </span>
-                            <SalesClientTable />
-                        </QCardSection>
-                        <QCardSection class="col">
-                            <span class="flex col q-mb-sm text-body1">
-                                {{ t('salesMonitor.recentOrderActions') }}
-                            </span>
-                            <SalesOrdersTable />
-                        </QCardSection>
-                    </div>
-                </template>
-            </QExpansionItem>
-        </QCard>
-        <QCard class="full-width">
-            <QItem class="justify-between">
-                <QItemLabel class="col slider-container">
-                    <span class="text-body1"
-                        >{{ t('salesMonitor.ticketsMonitor') }}
-                    </span>
-                    <QCardSection class="col" style="padding-inline: 0"
-                        ><SalesTicketsTable />
-                    </QCardSection>
-                </QItemLabel>
-            </QItem>
-        </QCard>
-    </QPage>
-</template>
-
-<style lang="scss" scoped>
-.expansion-tables-container {
-    display: flex;
-    border-top: 1px solid $color-spacer;
-
-    @media (max-width: $breakpoint-md-max) {
-        flex-direction: column;
-    }
-}
-</style>
--- a/src/pages/Monitor/MonitorOrders.vue
+++ b/src/pages/Monitor/MonitorOrders.vue
@ -0,0 +1,203 @@
+<script setup>
+import { ref, computed } from 'vue';
+import { useI18n } from 'vue-i18n';
+import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
+import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
+import VnTable from 'components/VnTable/VnTable.vue';
+
+import { toDateFormat, toDateTimeFormat } from 'src/filters/date.js';
+import { toCurrency } from 'src/filters';
+import { useVnConfirm } from 'composables/useVnConfirm';
+import axios from 'axios';
+
+const { t } = useI18n();
+const { openConfirmationModal } = useVnConfirm();
+
+const table = ref();
+const selectedRows = ref([]);
+
+function exprBuilder(param, value) {
+    switch (param) {
+        case 'clientFk':
+            return { [`c.id`]: value };
+        case 'salesPersonFk':
+            return { [`c.salesPersonFk`]: value };
+    }
+}
+
+const columns = computed(() => [
+    {
+        label: t('salesOrdersTable.dateSend'),
+        name: 'dateSend',
+        field: 'dateSend',
+        align: 'left',
+        orderBy: 'date_send',
+        columnFilter: false,
+    },
+    {
+        label: t('salesOrdersTable.dateMake'),
+        name: 'dateMake',
+        field: 'dateMake',
+        align: 'left',
+        orderBy: 'date_make',
+        columnFilter: false,
+        format: (row) => toDateTimeFormat(row.date_make),
+    },
+    {
+        label: t('salesOrdersTable.client'),
+        name: 'clientFk',
+        align: 'left',
+        columnFilter: {
+            component: 'select',
+            attrs: {
+                url: 'Clients',
+                fields: ['id', 'name'],
+                sortBy: 'name ASC',
+            },
+        },
+    },
+    {
+        label: t('salesOrdersTable.agency'),
+        name: 'agencyName',
+        align: 'left',
+        columnFilter: false,
+    },
+    {
+        label: t('salesOrdersTable.salesPerson'),
+        name: 'salesPersonFk',
+        align: 'left',
+        optionFilter: 'firstName',
+        columnFilter: {
+            component: 'select',
+            attrs: {
+                url: 'Workers/activeWithInheritedRole',
+                fields: ['id', 'name'],
+                sortBy: 'nickname ASC',
+                where: { role: 'salesPerson' },
+                useLike: false,
+            },
+        },
+    },
+    {
+        label: t('salesOrdersTable.import'),
+        name: 'import',
+        field: 'import',
+        align: 'left',
+        columnFilter: false,
+        format: (row) => toCurrency(row.import),
+    },
+]);
+
+const getBadgeColor = (date) => {
+    const today = Date.vnNew();
+    today.setHours(0, 0, 0, 0);
+
+    const orderLanded = new Date(date);
+    orderLanded.setHours(0, 0, 0, 0);
+
+    const difference = today - orderLanded;
+
+    if (difference == 0) return 'warning';
+    if (difference < 0) return 'success';
+    if (difference > 0) return 'alert';
+};
+
+const removeOrders = async () => {
+    try {
+        const selectedIds = selectedRows.value.map((row) => row.id);
+        const params = { deletes: selectedIds };
+        await axios.post('SalesMonitors/deleteOrders', params);
+        selectedRows.value = [];
+        await table.value.reload();
+    } catch (err) {
+        console.error('Error deleting orders', err);
+    }
+};
+
+const openTab = (id) =>
+    window.open(`#/order/${id}/summary`, '_blank', 'noopener, noreferrer');
+</script>
+<template>
+    <VnTable
+        ref="table"
+        class="q-px-none"
+        data-key="SalesMonitorOrders"
+        url="SalesMonitors/ordersFilter"
+        search-url="SalesMonitorOrders"
+        order="date_send DESC"
+        :right-search="false"
+        :expr-builder="exprBuilder"
+        auto-load
+        :columns="columns"
+        :table="{
+            'row-key': 'id',
+            selection: 'multiple',
+            'hide-bottom': true,
+        }"
+        default-mode="table"
+        :row-click="({ id }) => openTab(id)"
+        v-model:selected="selectedRows"
+        :disable-option="{ card: true }"
+    >
+        <template #top-left>
+            <QBtn
+                icon="refresh"
+                size="md"
+                color="primary"
+                dense
+                flat
+                @click="$refs.table.reload()"
+            >
+                <QTooltip>{{ $t('globals.refresh') }}</QTooltip>
+            </QBtn>
+            <QBtn
+                v-if="selectedRows.length"
+                icon="delete"
+                size="md"
+                dense
+                flat
+                color="primary"
+                @click="
+                    openConfirmationModal(
+                        $t('salesOrdersTable.deleteConfirmTitle'),
+                        $t('salesOrdersTable.deleteConfirmMessage'),
+                        removeOrders
+                    )
+                "
+            >
+                <QTooltip>{{ t('salesOrdersTable.delete') }}</QTooltip>
+            </QBtn>
+        </template>
+        <template #column-dateSend="{ row }">
+            <QTd>
+                <QBadge
+                    :color="getBadgeColor(row.date_send)"
+                    text-color="black"
+                    class="q-pa-sm"
+                    style="font-size: 14px"
+                >
+                    {{ toDateFormat(row.date_send) }}
+                </QBadge>
+            </QTd>
+        </template>
+
+        <template #column-clientFk="{ row }">
+            <QTd @click.stop>
+                <span class="link" v-text="row.clientName" :title="row.clientName" />
+                <CustomerDescriptorProxy :id="row.clientFk" />
+            </QTd>
+        </template>
+
+        <template #column-salesPersonFk="{ row }">
+            <QTd @click.stop>
+                <span class="link" v-text="row.salesPerson" />
+                <WorkerDescriptorProxy :id="row.salesPersonFk" dense />
+            </QTd>
+        </template>
+    </VnTable>
+</template>
+<style lang="scss" scoped>
+.q-td {
+    max-width: 140px;
+}
+</style>
--- a/src/pages/Monitor/SalesClientsTable.vue
+++ b/src/pages/Monitor/SalesClientsTable.vue
@ -1,147 +0,0 @@
-<script setup>
-import { ref, computed, reactive, watch } from 'vue';
-import { useI18n } from 'vue-i18n';
-
-import FetchData from 'components/FetchData.vue';
-import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
-import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
-
-import { toDateFormat } from 'src/filters/date.js';
-import VnTable from 'src/components/VnTable/VnTable.vue';
-
-const { t } = useI18n();
-
-const paginateRef = ref(null);
-const workersActiveOptions = ref([]);
-const clientsOptions = ref([]);
-
-const from = ref(Date.vnNew());
-const to = ref(Date.vnNew());
-
-const dateRange = computed(() => {
-    const minHour = new Date(from.value);
-    minHour.setHours(0, 0, 0, 0);
-    const maxHour = new Date(to.value);
-    maxHour.setHours(23, 59, 59, 59);
-    return [minHour, maxHour];
-});
-
-const filter = reactive({
-    where: {
-        'v.stamp': {
-            between: dateRange.value,
-        },
-    },
-});
-
-const refetch = async () => await paginateRef.value.fetch();
-
-watch(dateRange, (val) => {
-    filter.where['v.stamp'].between = val;
-    refetch();
-});
-
-function exprBuilder(param, value) {
-    switch (param) {
-        case 'clientFk':
-            return { [`c.id`]: value };
-        case 'salesPersonFk':
-            return { [`c.${param}`]: value };
-    }
-}
-
-const params = reactive({});
-
-const columns = computed(() => [
-    {
-        label: t('salesClientsTable.date'),
-        name: 'dated',
-        field: 'dated',
-        align: 'left',
-        columnFilter: null,
-        sortable: true,
-        format: (row) => toDateFormat(row.dated),
-    },
-    {
-        label: t('salesClientsTable.hour'),
-        name: 'hour',
-        field: 'hour',
-        align: 'left',
-        sortable: true,
-    },
-    {
-        label: t('salesClientsTable.salesPerson'),
-        name: 'salesPerson',
-        field: 'salesPerson',
-        align: 'left',
-        sortable: true,
-        columnField: {
-            component: null,
-        },
-    },
-    {
-        label: t('salesClientsTable.client'),
-        field: 'clientName',
-        name: 'client',
-        align: 'left',
-        sortable: true,
-        columnField: {
-            component: null,
-        },
-    },
-]);
-</script>
-
-<template>
-    <FetchData
-        url="Workers/activeWithInheritedRole"
-        :filter="{
-            fields: ['id', 'nickname'],
-            order: 'nickname ASC',
-            where: { role: 'salesPerson' },
-        }"
-        auto-load
-        @on-fetch="(data) => (workersActiveOptions = data)"
-    />
-    <FetchData
-        url="Clients"
-        :filter="{
-            fields: ['id', 'name'],
-            order: 'name ASC',
-        }"
-        auto-load
-        @on-fetch="(data) => (clientsOptions = data)"
-    />
-    <QCard style="max-height: 380px; overflow-y: scroll">
-        <VnTable
-            ref="paginateRef"
-            data-key="SalesMonitorClients"
-            url="SalesMonitors/clientsFilter"
-            :order="['dated DESC', 'hour DESC']"
-            :limit="6"
-            :expr-builder="exprBuilder"
-            :user-params="params"
-            :filter="filter"
-            :offset="50"
-            auto-load
-            :columns="columns"
-            :right-search="false"
-            default-mode="table"
-            dense
-            :without-header="true"
-        >
-            <template #column-salesPerson="{ row }">
-                <QTd>
-                    <span class="link">{{ row.salesPerson }}</span>
-                    <WorkerDescriptorProxy :id="row.salesPersonFk" dense />
-                </QTd>
-            </template>
-            <template #column-client="{ row }">
-                <QTd>
-                    <span class="link">{{ row.clientName }}</span>
-                    <CustomerDescriptorProxy :id="row.clientFk" />
-                </QTd>
-            </template>
-        </VnTable>
-    </QCard>
-</template>
--- a/src/pages/Monitor/SalesOrdersTable.vue
+++ b/src/pages/Monitor/SalesOrdersTable.vue
@ -1,204 +0,0 @@
-<script setup>
-import { ref, computed } from 'vue';
-import { useI18n } from 'vue-i18n';
-
-import FetchData from 'components/FetchData.vue';
-import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
-import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
-import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
-import VnTable from 'components/VnTable/VnTable.vue';
-
-import { toDateFormat, toDateTimeFormat } from 'src/filters/date.js';
-import { toCurrency } from 'src/filters';
-import { useVnConfirm } from 'composables/useVnConfirm';
-import axios from 'axios';
-
-const { t } = useI18n();
-const { openConfirmationModal } = useVnConfirm();
-
-const paginateRef = ref(null);
-const workersActiveOptions = ref([]);
-const clientsOptions = ref([]);
-const selectedRows = ref([]);
-
-const dateRange = (value) => {
-    const minHour = new Date(value);
-    minHour.setHours(0, 0, 0, 0);
-    const maxHour = new Date(value);
-    maxHour.setHours(23, 59, 59, 59);
-
-    return [minHour, maxHour];
-};
-
-function exprBuilder(param, value) {
-    switch (param) {
-        case 'date_send':
-            return {
-                [`o.date_send`]: {
-                    between: dateRange(value),
-                },
-            };
-        case 'clientFk':
-            return { [`c.id`]: value };
-        case 'salesPersonFk':
-            return { [`c.${param}`]: value };
-    }
-}
-
-const columns = computed(() => [
-    {
-        label: t('salesOrdersTable.date'),
-        name: 'date',
-        field: 'dated',
-        align: 'left',
-        sortable: true,
-        cardVisible: true,
-    },
-    {
-        label: t('salesOrdersTable.client'),
-        name: 'client',
-        align: 'left',
-        sortable: true,
-        cardVisible: true,
-    },
-    {
-        label: t('salesOrdersTable.salesPerson'),
-        name: 'salesPerson',
-        align: 'left',
-        sortable: true,
-        cardVisible: true,
-    },
-]);
-
-const getBadgeColor = (date) => {
-    const today = Date.vnNew();
-    today.setHours(0, 0, 0, 0);
-
-    const orderLanded = new Date(date);
-    orderLanded.setHours(0, 0, 0, 0);
-
-    const difference = today - orderLanded;
-
-    if (difference == 0) return 'warning';
-    if (difference < 0) return 'success';
-    if (difference > 0) return 'alert';
-};
-
-const removeOrders = async () => {
-    try {
-        const selectedIds = selectedRows.value.map((row) => row.id);
-        const params = { deletes: selectedIds };
-        await axios.post('SalesMonitors/deleteOrders', params);
-        selectedRows.value = [];
-        await paginateRef.value.fetch();
-    } catch (err) {
-        console.error('Error deleting orders', err);
-    }
-};
-
-const redirectToOrderSummary = (orderId) => {
-    const url = `#/order/${orderId}/summary`;
-    window.open(url, '_blank');
-};
-</script>
-
-<template>
-    <FetchData
-        url="Workers/activeWithInheritedRole"
-        :filter="{
-            fields: ['id', 'nickname'],
-            order: 'nickname ASC',
-            where: { role: 'salesPerson' },
-        }"
-        auto-load
-        @on-fetch="(data) => (workersActiveOptions = data)"
-    />
-    <FetchData
-        url="Clients"
-        :filter="{
-            fields: ['id', 'name'],
-            order: 'name ASC',
-        }"
-        auto-load
-        @on-fetch="(data) => (clientsOptions = data)"
-    />
-
-    <VnSubToolbar />
-    <QCard style="max-height: 380px; overflow-y: scroll">
-        <VnTable
-            ref="paginateRef"
-            data-key="SalesMonitorOrders"
-            url="SalesMonitors/ordersFilter"
-            order="date_make DESC"
-            :limit="6"
-            :right-search="false"
-            :expr-builder="exprBuilder"
-            auto-load
-            :columns="columns"
-            :table="{
-                'row-key': 'id',
-                selection: 'multiple',
-                'hide-bottom': true,
-            }"
-            default-mode="table"
-            :without-header="false"
-            @row-click="(_, row) => redirectToOrderSummary(row.id)"
-            v-model:selected="selectedRows"
-        >
-            <template #top-left>
-                <QBtn
-                    v-if="selectedRows.length > 0"
-                    icon="delete"
-                    size="md"
-                    color="primary"
-                    @click="
-                        openConfirmationModal(
-                            t('salesOrdersTable.deleteConfirmTitle'),
-                            t('salesOrdersTable.deleteConfirmMessage'),
-                            removeOrders
-                        )
-                    "
-                >
-                    <QTooltip>{{ t('salesOrdersTable.delete') }}</QTooltip>
-                </QBtn>
-            </template>
-            <template #column-date="{ row }">
-                <QTd>
-                    <QBadge
-                        :color="getBadgeColor(row.date_send)"
-                        text-color="black"
-                        class="q-pa-sm q-mb-md"
-                        style="font-size: 14px"
-                    >
-                        {{ toDateFormat(row.date_send) }}
-                    </QBadge>
-                    <div>{{ toDateTimeFormat(row.date_make) }}</div>
-                </QTd>
-            </template>
-            <template #column-client="{ row }">
-                <QTd>
-                    <div class="q-mb-md">
-                        <span class="link">{{ row.clientName }}</span>
-                        <CustomerDescriptorProxy :id="row.clientFk" />
-                    </div>
-                    <span> {{ row.agencyName }}</span>
-                </QTd>
-            </template>
-
-            <template #column-salesPerson="{ row }">
-                <QTd>
-                    <div class="q-mb-md">
-                        <span class="link">{{ row.salesPerson }}</span>
-                        <WorkerDescriptorProxy :id="row.salesPersonFk" dense />
-                    </div>
-                    <span>{{ toCurrency(row.import) }}</span>
-                </QTd>
-            </template>
-        </VnTable>
-    </QCard>
-</template>
-<style lang="scss" scoped>
-.q-td {
-    color: gray;
-}
-</style>
--- a/src/pages/Monitor/Ticket/MonitorTicketFilter.vue
+++ b/src/pages/Monitor/Ticket/MonitorTicketFilter.vue
@ -0,0 +1,286 @@
+<script setup>
+import { ref } from 'vue';
+import { useI18n } from 'vue-i18n';
+
+import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
+import VnFilterPanelChip from 'src/components/ui/VnFilterPanelChip.vue';
+import VnSelect from 'src/components/common/VnSelect.vue';
+import VnInput from 'src/components/common/VnInput.vue';
+import VnInputNumber from 'src/components/common/VnInputNumber.vue';
+import FetchData from 'src/components/FetchData.vue';
+import { dateRange } from 'src/filters';
+
+defineProps({ dataKey: { type: String, required: true } });
+const { t } = useI18n();
+const warehouses = ref();
+const groupedStates = ref();
+
+const handleScopeDays = (params, days, callback) => {
+    const [from, to] = dateRange(Date.vnNew());
+    if (!days) {
+        Object.assign(params, { from, to, scopeDays: 1 });
+    } else {
+        params.from = from;
+        to.setDate(to.getDate() + days);
+        params.to = to;
+    }
+    if (callback) callback();
+};
+</script>
+<template>
+    <FetchData url="Warehouses" auto-load @on-fetch="(data) => (warehouses = data)" />
+    <FetchData
+        url="AlertLevels"
+        auto-load
+        @on-fetch="
+            (data) =>
+                (groupedStates = data.map((x) => Object.assign(x, { code: t(x.code) })))
+        "
+    />
+    <VnFilterPanel
+        :data-key="dataKey"
+        :search-button="true"
+        :hidden-tags="['from', 'to']"
+        :custom-tags="['scopeDays']"
+        :unremovable-params="['from', 'to', 'scopeDays']"
+    >
+        <template #tags="{ tag, formatFn }">
+            <div class="q-gutter-x-xs">
+                <strong v-text="`${t(`params.${tag.label}`)}:`" />
+                <span v-text="formatFn(tag.value)" />
+            </div>
+        </template>
+        <template #customTags="{ params, searchFn, formatFn }">
+            <VnFilterPanelChip
+                v-if="params.scopeDays"
+                removable
+                @remove="handleScopeDays(params, null, searchFn)"
+            >
+                <strong v-text="`${t(`params.scopeDays`)}:`" />
+                <span v-text="formatFn(params.scopeDays)" />
+            </VnFilterPanelChip>
+        </template>
+        <template #body="{ params }">
+            <QItem>
+                <QItemSection>
+                    <VnInput
+                        :label="t('params.clientFk')"
+                        v-model="params.clientFk"
+                        is-outlined
+                    />
+                </QItemSection>
+            </QItem>
+            <QItem>
+                <QItemSection>
+                    <VnInput
+                        :label="t('params.orderFk')"
+                        v-model="params.orderFk"
+                        is-outlined
+                    />
+                </QItemSection>
+            </QItem>
+            <QItem>
+                <QItemSection>
+                    <VnInputNumber
+                        :label="t('params.scopeDays')"
+                        v-model="params.scopeDays"
+                        is-outlined
+                        @update:model-value="(val) => handleScopeDays(params, val)"
+                        @remove="(val) => handleScopeDays(params, val)"
+                    />
+                </QItemSection>
+            </QItem>
+            <QItem>
+                <QItemSection>
+                    <VnInput
+                        :label="t('params.nickname')"
+                        v-model="params.nickname"
+                        is-outlined
+                    />
+                </QItemSection>
+            </QItem>
+            <QItem>
+                <QItemSection>
+                    <VnSelect
+                        outlined
+                        dense
+                        rounded
+                        :label="t('params.salesPersonFk')"
+                        v-model="params.salesPersonFk"
+                        url="Workers/search"
+                        :params="{ departmentCodes: ['VT'] }"
+                        is-outlined
+                        option-value="code"
+                        option-label="name"
+                        :no-one="true"
+                    >
+                        <template #option="{ opt, itemProps }">
+                            <QItem v-bind="itemProps">
+                                <QItemSection>
+                                    <QItemLabel>{{ opt.name }}</QItemLabel>
+                                    <QItemLabel
+                                        v-if="opt.code"
+                                        class="text-grey text-caption"
+                                    >
+                                        {{ `${opt.nickname}, ${opt.code}` }}
+                                    </QItemLabel>
+                                </QItemSection>
+                            </QItem>
+                        </template>
+                    </VnSelect>
+                </QItemSection>
+            </QItem>
+            <QItem>
+                <QItemSection>
+                    <VnInput
+                        :label="t('params.refFk')"
+                        v-model="params.refFk"
+                        is-outlined
+                    />
+                </QItemSection>
+            </QItem>
+            <QItem>
+                <QItemSection>
+                    <VnSelect
+                        outlined
+                        dense
+                        rounded
+                        :label="t('params.agencyModeFk')"
+                        v-model="params.agencyModeFk"
+                        url="AgencyModes/isActive"
+                        is-outlined
+                    />
+                </QItemSection>
+            </QItem>
+            <QItem>
+                <QItemSection>
+                    <VnSelect
+                        outlined
+                        dense
+                        rounded
+                        :label="t('params.stateFk')"
+                        v-model="params.stateFk"
+                        url="States"
+                        is-outlined
+                    />
+                </QItemSection>
+            </QItem>
+            <QItem>
+                <QItemSection>
+                    <VnSelect
+                        outlined
+                        dense
+                        rounded
+                        :label="t('params.groupedStates')"
+                        v-model="params.alertLevel"
+                        :options="groupedStates"
+                        option-label="code"
+                    />
+                </QItemSection>
+            </QItem>
+            <QItem>
+                <QItemSection>
+                    <VnSelect
+                        outlined
+                        dense
+                        rounded
+                        :label="t('params.warehouseFk')"
+                        v-model="params.warehouseFk"
+                        :options="warehouses"
+                    />
+                </QItemSection>
+            </QItem>
+            <QItem>
+                <QItemSection>
+                    <VnSelect
+                        outlined
+                        dense
+                        rounded
+                        :label="t('params.provinceFk')"
+                        v-model="params.provinceFk"
+                        url="Provinces"
+                    />
+                </QItemSection>
+            </QItem>
+            <QItem>
+                <QItemSection>
+                    <QCheckbox
+                        :label="t('params.myTeam')"
+                        v-model="params.myTeam"
+                        toggle-indeterminate
+                    />
+                </QItemSection>
+            </QItem>
+            <QItem>
+                <QItemSection>
+                    <QCheckbox
+                        :label="t('params.problems')"
+                        v-model="params.problems"
+                        toggle-indeterminate
+                    />
+                </QItemSection>
+            </QItem>
+            <QItem>
+                <QItemSection>
+                    <QCheckbox
+                        :label="t('params.pending')"
+                        v-model="params.pending"
+                        toggle-indeterminate
+                    />
+                </QItemSection>
+            </QItem>
+        </template>
+    </VnFilterPanel>
+</template>
+<i18n>
+en:
+    params:
+        clientFk: Client id
+        orderFk: Order id
+        scopeDays: Days onward
+        nickname: Nickname
+        salesPersonFk: Sales person
+        refFk: Invoice
+        agencyModeFk: Agency
+        stateFk: State
+        groupedStates: Grouped State
+        warehouseFk: Warehouse
+        provinceFk: Province
+        myTeam: My team
+        problems: With problems
+        pending: Pending
+        from: From
+        to: To
+        alertLevel: Grouped State
+    FREE: Free
+    DELIVERED: Delivered
+    ON_PREPARATION: On preparation
+    ON_PREVIOUS: On previous
+    PACKED: Packed
+    No one: No one
+    
+es:
+    params:
+        clientFk: Id cliente
+        orderFk: Id cesta
+        scopeDays: Días en adelante
+        nickname: Nombre mostrado
+        salesPersonFk: Comercial
+        refFk: Factura
+        agencyModeFk: Agencia
+        stateFk: Estado
+        groupedStates: Estado agrupado
+        warehouseFk: Almacén
+        provinceFk: Provincia
+        myTeam: Mi equipo
+        problems: Con problemas
+        pending: Pendiente
+        from: Desde
+        To: Hasta
+        alertLevel: Estado agrupado
+    FREE: Libre
+    DELIVERED: Servido
+    ON_PREPARATION: En preparación
+    ON_PREVIOUS: En previa
+    PACKED: Encajado
+</i18n>
--- a/src/pages/Monitor/Ticket/MonitorTicketSearchbar.vue
+++ b/src/pages/Monitor/Ticket/MonitorTicketSearchbar.vue
@ -0,0 +1,12 @@
+<script setup>
+import VnSearchbar from 'components/ui/VnSearchbar.vue';
+</script>
+<template>
+    <VnSearchbar
+        data-key="SalesMonitorTickets"
+        url="SalesMonitors/salesFilter"
+        :redirect="false"
+        :label="$t('searchBar.label')"
+        :info="$t('searchBar.info')"
+    />
+</template>
--- a/src/pages/Monitor/Ticket/MonitorTickets.vue
+++ b/src/pages/Monitor/Ticket/MonitorTickets.vue
@ -1,37 +1,38 @@
 <script setup>
-import { ref, computed, reactive } from 'vue';
+import { ref, computed } from 'vue';
 import { useI18n } from 'vue-i18n';
 import FetchData from 'components/FetchData.vue';
 import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
 import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
-import TableVisibleColumns from 'src/components/common/TableVisibleColumns.vue';
 import TicketDescriptorProxy from 'src/pages/Ticket/Card/TicketDescriptorProxy.vue';
 import InvoiceOutDescriptorProxy from 'src/pages/InvoiceOut/Card/InvoiceOutDescriptorProxy.vue';
 import ZoneDescriptorProxy from 'src/pages/Zone/Card/ZoneDescriptorProxy.vue';
 import TicketSummary from 'src/pages/Ticket/Card/TicketSummary.vue';
 import VnTable from 'components/VnTable/VnTable.vue';
 import { useSummaryDialog } from 'src/composables/useSummaryDialog';
-import { toDateFormat, toTimeFormat } from 'src/filters/date.js';
-import { toCurrency, dateRange } from 'src/filters';
+import { toDateFormat } from 'src/filters/date.js';
+import { toCurrency, dateRange, dashIfEmpty } from 'src/filters';
+import RightMenu from 'src/components/common/RightMenu.vue';
+import MonitorTicketSearchbar from './MonitorTicketSearchbar.vue';
+import MonitorTicketFilter from './MonitorTicketFilter.vue';

-const DEFAULT_AUTO_REFRESH = 1000;
+const DEFAULT_AUTO_REFRESH = 2 * 60 * 1000; // 2min in ms
 const { t } = useI18n();
 const autoRefresh = ref(false);
-const paginateRef = ref(null);
-const workersActiveOptions = ref([]);
-const provincesOptions = ref([]);
-const statesOptions = ref([]);
-const zonesOptions = ref([]);
+const tableRef = ref(null);
+const provinceOpts = ref([]);
+const stateOpts = ref([]);
+const zoneOpts = ref([]);
 const visibleColumns = ref([]);
-const allColumnNames = ref([]);
 const { viewSummary } = useSummaryDialog();
+const [from, to] = dateRange(Date.vnNew());

 function exprBuilder(param, value) {
    switch (param) {
        case 'stateFk':
            return { 'ts.stateFk': value };
        case 'salesPersonFk':
-            return { 'c.salesPersonFk': value };
+            return { 'c.salesPersonFk': !value ? null : value };
        case 'provinceFk':
            return { 'a.provinceFk': value };
        case 'theoreticalHour':
@ -48,15 +49,12 @@ function exprBuilder(param, value) {
    }
 }

-const filter = { order: ['totalProblems DESC'] };
-let params = reactive({});
-
 const columns = computed(() => [
    {
        label: t('salesTicketsTable.problems'),
-        name: 'problems',
+        name: 'totalProblems',
        align: 'left',
-        sortable: true,
+
        columnFilter: false,
        attrs: {
            dense: true,
@ -64,13 +62,12 @@ const columns = computed(() => [
    },
    {
        label: t('salesTicketsTable.identifier'),
-        name: 'identifier',
+        name: 'id',
        field: 'id',
        align: 'left',
-        sortable: true,

        columnFilter: {
-            component: 'input',
+            component: 'number',
            name: 'id',
            attrs: {
                dense: true,
@ -79,41 +76,41 @@ const columns = computed(() => [
    },
    {
        label: t('salesTicketsTable.client'),
-        name: 'client',
+        name: 'clientFk',
        align: 'left',
        field: 'nickname',
-        sortable: true,
        columnFilter: {
-            component: 'input',
-            name: 'nickname',
+            component: 'select',
            attrs: {
-                dense: true,
+                url: 'Clients',
+                fields: ['id', 'name', 'nickname'],
+                sortBy: 'name ASC',
            },
        },
    },
    {
        label: t('salesTicketsTable.salesPerson'),
-        name: 'salesPerson',
+        name: 'salesPersonFk',
        field: 'userName',
        align: 'left',
-        sortable: true,
+        optionFilter: 'firstName',
        columnFilter: {
            component: 'select',
-            name: 'salesPersonFk',
            attrs: {
-                options: workersActiveOptions.value,
-                'option-value': 'id',
-                'option-label': 'name',
-                dense: true,
+                url: 'Workers/activeWithInheritedRole',
+                fields: ['id', 'name'],
+                sortBy: 'nickname ASC',
+                where: { role: 'salesPerson' },
+                useLike: false,
            },
        },
    },
    {
        label: t('salesTicketsTable.date'),
-        name: 'date',
+        name: 'shippedDate',
        style: { 'max-width': '100px' },
        align: 'left',
-        sortable: true,
+
        columnFilter: {
            component: 'date',
            name: 'shippedDate',
@ -124,61 +121,39 @@ const columns = computed(() => [
    },
    {
        label: t('salesTicketsTable.theoretical'),
-        name: 'theoretical',
+        name: 'theoreticalhour',
        field: 'zoneLanding',
        align: 'left',
-        sortable: true,
-        format: (val) => toTimeFormat(val),
-        columnFilter: {
-            component: 'input',
-            name: 'theoreticalHour',
-            attrs: {
-                dense: true,
-            },
-        },
+        format: (row) => row.theoreticalhour,
+        columnFilter: false,
    },
    {
        label: t('salesTicketsTable.practical'),
-        name: 'practical',
+        name: 'practicalHour',
        field: 'practicalHour',
        align: 'left',
-        sortable: true,
-        columnFilter: {
-            component: 'input',
-            name: 'practicalHour',
-            attrs: {
-                dense: true,
-            },
-        },
+        format: (row) => row.practicalHour,
+        columnFilter: false,
    },
    {
        label: t('salesTicketsTable.preparation'),
-        name: 'preparation',
+        name: 'preparationHour',
        field: 'shipped',
        align: 'left',
-        sortable: true,
-        format: (val) => toTimeFormat(val),
-        columnFilter: {
-            component: 'input',
-            name: 'shippedDate',
-            attrs: {
-                dense: true,
-            },
-        },
+        format: (row) => row.preparationHour,
+        columnFilter: false,
    },
-
    {
        label: t('salesTicketsTable.province'),
-        name: 'province',
+        name: 'provinceFk',
        field: 'province',
        align: 'left',
-        style: { 'max-width': '100px' },
-        sortable: true,
+        format: (row) => row.province,
        columnFilter: {
            component: 'select',
            name: 'provinceFk',
            attrs: {
-                options: provincesOptions.value,
+                options: provinceOpts.value,
                'option-value': 'id',
                'option-label': 'name',
                dense: true,
@ -190,12 +165,11 @@ const columns = computed(() => [
        name: 'state',
        align: 'left',
        style: { 'max-width': '100px' },
-        sortable: true,
        columnFilter: {
            component: 'select',
            name: 'stateFk',
            attrs: {
-                options: statesOptions.value,
+                options: stateOpts.value,
                'option-value': 'id',
                'option-label': 'name',
                dense: true,
@ -207,10 +181,7 @@ const columns = computed(() => [
        name: 'isFragile',
        field: 'isFragile',
        align: 'left',
-        sortable: true,
-        columnFilter: {
-            inWhere: true,
-        },
+        columnFilter: false,
        attrs: {
            'checked-icon': 'local_bar',
            'unchecked-icon': 'local_bar',
@ -220,14 +191,14 @@ const columns = computed(() => [
    },
    {
        label: t('salesTicketsTable.zone'),
-        name: 'zone',
+        name: 'zoneFk',
        align: 'left',
-        sortable: true,
+
        columnFilter: {
            component: 'select',
            name: 'zoneFk',
            attrs: {
-                options: zonesOptions.value,
+                options: zoneOpts.value,
                'option-value': 'id',
                'option-label': 'name',
                dense: true,
@ -236,13 +207,13 @@ const columns = computed(() => [
    },
    {
        label: t('salesTicketsTable.total'),
-        name: 'total',
+        name: 'totalWithVat',
        field: 'totalWithVat',
        align: 'left',
        style: { 'max-width': '75px' },
-        sortable: true,
+
        columnFilter: {
-            component: 'input',
+            component: 'number',
            name: 'totalWithVat',
            attrs: {
                dense: true,
@ -258,7 +229,7 @@ const columns = computed(() => [
                title: t('salesTicketsTable.goToLines'),
                icon: 'vn:lines',
                color: 'priamry',
-                action: (row) => redirectToSales(row.id),
+                action: (row) => openTab(row.id),
                isPrimary: true,
                attrs: {
                    flat: true,
@ -297,18 +268,13 @@ let refreshTimer = null;

 const autoRefreshHandler = (value) => {
    if (value)
-        refreshTimer = setInterval(() => paginateRef.value.fetch(), DEFAULT_AUTO_REFRESH);
+        refreshTimer = setInterval(() => tableRef.value.reload(), DEFAULT_AUTO_REFRESH);
    else {
        clearInterval(refreshTimer);
        refreshTimer = null;
    }
 };

-const redirectToTicketSummary = (id) => {
-    const url = `#/ticket/${id}/summary`;
-    window.open(url, '_blank');
-};
-
 const stateColors = {
    notice: 'info',
    success: 'positive',
@ -329,23 +295,10 @@ const formatShippedDate = (date) => {
    return toDateFormat(_date);
 };

-const redirectToSales = (id) => {
-    const url = `#/ticket/${id}/sale`;
-    window.open(url, '_blank');
-};
+const openTab = (id) =>
+    window.open(`#/ticket/${id}/sale`, '_blank', 'noopener, noreferrer');
 </script>
-
 <template>
-    <FetchData
-        url="Workers/activeWithInheritedRole"
-        :filter="{
-            fields: ['id', 'nickname'],
-            order: 'nickname ASC',
-            where: { role: 'salesPerson' },
-        }"
-        auto-load
-        @on-fetch="(data) => (workersActiveOptions = data)"
-    />
    <FetchData
        url="Provinces"
        :filter="{
@ -353,7 +306,7 @@ const redirectToSales = (id) => {
            order: 'name ASC',
        }"
        auto-load
-        @on-fetch="(data) => (provincesOptions = data)"
+        @on-fetch="(data) => (provinceOpts = data)"
    />
    <FetchData
        url="States"
@ -362,7 +315,7 @@ const redirectToSales = (id) => {
            order: 'name ASC',
        }"
        auto-load
-        @on-fetch="(data) => (statesOptions = data)"
+        @on-fetch="(data) => (stateOpts = data)"
    />
    <FetchData
        url="Zones"
@ -371,46 +324,60 @@ const redirectToSales = (id) => {
            order: 'name ASC',
        }"
        auto-load
-        @on-fetch="(data) => (zonesOptions = data)"
+        @on-fetch="(data) => (zoneOpts = data)"
    />
+    <MonitorTicketSearchbar />
+    <RightMenu>
+        <template #right-panel>
+            <MonitorTicketFilter data-key="saleMonitorTickets" />
+        </template>
+    </RightMenu>
    <VnTable
-        ref="paginateRef"
-        data-key="SalesMonitorTickets"
+        ref="tableRef"
+        data-key="saleMonitorTickets"
        url="SalesMonitors/salesFilter"
-        :filter="filter"
-        :limit="20"
+        search-url="saleMonitorTickets"
        :expr-builder="exprBuilder"
-        :user-params="params"
        :offset="50"
        :columns="columns"
        :visible-columns="visibleColumns"
        :right-search="false"
        default-mode="table"
        auto-load
-        @row-click="(_, row) => redirectToTicketSummary(row.id)"
+        :row-click="({ id }) => openTab(id)"
+        :disable-option="{ card: true }"
+        :user-params="{ from, to, scopeDays: 1 }"
    >
        <template #top-left>
-            <TableVisibleColumns
-                :all-columns="allColumnNames"
-                table-code="ticketsMonitor"
-                labels-traductions-path="salesTicketsTable"
-                @on-config-saved="visibleColumns = [...$event, 'rowActions']"
-            />
+            <QBtn
+                icon="refresh"
+                size="md"
+                color="primary"
+                class="q-mr-sm"
+                dense
+                flat
+                @click="$refs.tableRef.reload()"
+            >
+                <QTooltip>{{ $t('globals.refresh') }}</QTooltip>
+            </QBtn>
            <QCheckbox
                v-model="autoRefresh"
-                :label="t('salesTicketsTable.autoRefresh')"
+                :label="$t('salesTicketsTable.autoRefresh')"
                @update:model-value="autoRefreshHandler"
-            />
+                dense
+            >
+                <QTooltip>{{ $t('refreshInfo') }}</QTooltip>
+            </QCheckbox>
        </template>
-        <template #column-problems="{ row }">
-            <QTd class="no-padding" style="max-width: 50px">
+        <template #column-totalProblems="{ row }">
+            <QTd class="no-padding" style="max-width: 60px">
                <QIcon
                    v-if="row.isTaxDataChecked === 0"
                    name="vn:no036"
                    color="primary"
                    size="xs"
                >
-                    <QTooltip>{{ t('salesTicketsTable.noVerifiedData') }}</QTooltip>
+                    <QTooltip>{{ $t('salesTicketsTable.noVerifiedData') }}</QTooltip>
                </QIcon>
                <QIcon
                    v-if="row.hasTicketRequest"
@ -418,7 +385,7 @@ const redirectToSales = (id) => {
                    color="primary"
                    size="xs"
                >
-                    <QTooltip>{{ t('salesTicketsTable.purchaseRequest') }}</QTooltip>
+                    <QTooltip>{{ $t('salesTicketsTable.purchaseRequest') }}</QTooltip>
                </QIcon>
                <QIcon
                    v-if="row.itemShortage"
@ -426,10 +393,10 @@ const redirectToSales = (id) => {
                    color="primary"
                    size="xs"
                >
-                    <QTooltip>{{ t('salesTicketsTable.notVisible') }}</QTooltip>
+                    <QTooltip>{{ $t('salesTicketsTable.notVisible') }}</QTooltip>
                </QIcon>
                <QIcon v-if="row.isFreezed" name="vn:frozen" color="primary" size="xs">
-                    <QTooltip>{{ t('salesTicketsTable.clientFrozen') }}</QTooltip>
+                    <QTooltip>{{ $t('salesTicketsTable.clientFrozen') }}</QTooltip>
                </QIcon>
                <QIcon
                    v-if="row.risk"
@ -437,7 +404,9 @@ const redirectToSales = (id) => {
                    :color="row.hasHighRisk ? 'negative' : 'primary'"
                    size="xs"
                >
-                    <QTooltip>{{ t('salesTicketsTable.risk') }}: {{ row.risk }}</QTooltip>
+                    <QTooltip
+                        >{{ $t('salesTicketsTable.risk') }}: {{ row.risk }}</QTooltip
+                    >
                </QIcon>
                <QIcon
                    v-if="row.hasComponentLack"
@ -445,7 +414,7 @@ const redirectToSales = (id) => {
                    color="primary"
                    size="xs"
                >
-                    <QTooltip>{{ t('salesTicketsTable.componentLack') }}</QTooltip>
+                    <QTooltip>{{ $t('salesTicketsTable.componentLack') }}</QTooltip>
                </QIcon>
                <QIcon
                    v-if="row.isTooLittle"
@ -453,11 +422,11 @@ const redirectToSales = (id) => {
                    color="primary"
                    size="xs"
                >
-                    <QTooltip>{{ t('salesTicketsTable.tooLittle') }}</QTooltip>
+                    <QTooltip>{{ $t('salesTicketsTable.tooLittle') }}</QTooltip>
                </QIcon>
            </QTd>
        </template>
-        <template #column-identifier="{ row }">
+        <template #column-id="{ row }">
            <QTd class="no-padding">
                <span class="link" @click.stop.prevent>
                    {{ row.id }}
@ -465,19 +434,19 @@ const redirectToSales = (id) => {
                </span>
            </QTd>
        </template>
-        <template #column-client="{ row }">
-            <QTd class="no-padding" @click.stop.prevent>
+        <template #column-clientFk="{ row }">
+            <QTd class="no-padding" @click.stop :title="row.nickname">
                <span class="link">{{ row.nickname }}</span>
                <CustomerDescriptorProxy :id="row.clientFk" />
            </QTd>
        </template>
-        <template #column-salesPerson="{ row }">
-            <QTd class="no-padding" @click.stop.prevent>
-                <span class="link">{{ row.userName }}</span>
+        <template #column-salesPersonFk="{ row }">
+            <QTd class="no-padding" @click.stop :title="row.userName">
+                <span class="link" v-text="dashIfEmpty(row.userName)" />
                <WorkerDescriptorProxy :id="row.salesPersonFk" />
            </QTd>
        </template>
-        <template #column-date="{ row }">
+        <template #column-shippedDate="{ row }">
            <QTd class="no-padding">
                <QBadge
                    v-bind="getBadgeAttrs(row.shippedDate)"
@ -488,6 +457,11 @@ const redirectToSales = (id) => {
                </QBadge>
            </QTd>
        </template>
+        <template #column-provinceFk="{ row }">
+            <QTd class="no-padding">
+                <span :title="row.province" v-text="row.province" />
+            </QTd>
+        </template>
        <template #column-state="{ row }">
            <QTd class="no-padding" @click.stop.prevent>
                <div v-if="row.refFk">
@ -508,17 +482,17 @@ const redirectToSales = (id) => {
        <template #column-isFragile="{ row }">
            <QTd class="no-padding">
                <QIcon v-if="row.isFragile" name="local_bar" color="primary" size="sm">
-                    <QTooltip>{{ t('salesTicketsTable.isFragile') }}</QTooltip>
+                    <QTooltip>{{ $t('salesTicketsTable.isFragile') }}</QTooltip>
                </QIcon>
            </QTd>
        </template>
-        <template #column-zone="{ row }">
-            <QTd class="no-padding" @click.stop.prevent>
+        <template #column-zoneFk="{ row }">
+            <QTd class="no-padding" @click.stop.prevent :title="row.zoneName">
                <span class="link">{{ row.zoneName }}</span>
                <ZoneDescriptorProxy :id="row.zoneFk" />
            </QTd>
        </template>
-        <template #column-total="{ row }">
+        <template #column-totalWithVat="{ row }">
            <QTd class="no-padding">
                <QBadge
                    :color="totalPriceColor(row) || 'transparent'"
--- a/src/pages/Monitor/locale/en.yml
+++ b/src/pages/Monitor/locale/en.yml
@ -11,11 +11,14 @@ salesClientsTable:
    client: Client
 salesOrdersTable:
    delete: Delete
-    date: Date
+    dateSend: Send date
+    dateMake: Make date
    client: Client
    salesPerson: Salesperson
    deleteConfirmTitle: Delete selected elements
    deleteConfirmMessage: All the selected elements will be deleted. Are you sure you want to continue?
+    agency: Agency
+    import: Import
 salesTicketsTable:
    autoRefresh: Auto-refresh
    problems: Problems
@ -43,3 +46,4 @@ salesTicketsTable:
 searchBar:
    label: Search tickets
    info: Search tickets by id or alias
+refreshInfo: Toggle auto-refresh every 2 minutes
--- a/src/pages/Monitor/locale/es.yml
+++ b/src/pages/Monitor/locale/es.yml
@ -11,11 +11,14 @@ salesClientsTable:
    client: Cliente
 salesOrdersTable:
    delete: Eliminar
-    date: Fecha
+    dateSend: Fecha de envío
+    dateMake: Fecha de realización
    client: Cliente
    salesPerson: Comercial
    deleteConfirmTitle: Eliminar los elementos seleccionados
    deleteConfirmMessage: Todos los elementos seleccionados serán eliminados. ¿Seguro que quieres continuar?
+    agency: Agencia
+    import: Importe
 salesTicketsTable:
    autoRefresh: Auto-refresco
    problems: Problemas
@ -43,3 +46,4 @@ salesTicketsTable:
 searchBar:
    label: Buscar tickets
    info: Buscar tickets por identificador o alias
+refreshInfo: Conmuta el refresco automático cada 2 minutos
--- a/src/pages/Order/Card/OrderSearchbar.vue
+++ b/src/pages/Order/Card/OrderSearchbar.vue
@ -10,7 +10,7 @@ const { t } = useI18n();
        data-key="OrderList"
        url="Orders/filter"
        :label="t('Search order')"
-        :info="t('You can search orders by reference')"
+        :info="t('Search orders by ticket id')"
    />
 </template>

@ -18,5 +18,5 @@ const { t } = useI18n();
 <i18n>
 es:
    Search order: Buscar orden
-    You can search orders by reference: Puedes buscar por referencia de la orden
+    Search orders by ticket id: Buscar pedido por id ticket
 </i18n>
--- a/src/pages/Route/RouteList.vue
+++ b/src/pages/Route/RouteList.vue
@ -185,7 +185,7 @@ const columns = computed(() => [
                action: (row) => openTicketsDialog(row?.id),
            },
            {
-                title: t('Preview'),
+                title: t('components.smartCard.viewSummary'),
                icon: 'preview',
                action: (row) => viewSummary(row?.id, RouteSummary),
            },
--- a/src/pages/Shelving/Card/ShelvingFilter.vue
+++ b/src/pages/Shelving/Card/ShelvingFilter.vue
@ -3,6 +3,7 @@ import { ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import FetchData from 'components/FetchData.vue';
 import VnFilterPanel from 'components/ui/VnFilterPanel.vue';
+import VnSelect from 'src/components/common/VnSelect.vue';

 const { t } = useI18n();
 const props = defineProps({
@ -15,25 +16,13 @@ const props = defineProps({
 const emit = defineEmits(['search']);

 const workers = ref();
-const parkings = ref();

 function setWorkers(data) {
    workers.value = data;
 }
-
-function setParkings(data) {
-    parkings.value = data;
-}
 </script>

 <template>
-    <FetchData
-        url="Parkings"
-        :filter="{ fields: ['id', 'code'] }"
-        sort-by="code ASC"
-        @on-fetch="setParkings"
-        auto-load
-    />
    <FetchData
        url="Workers/activeWithInheritedRole"
        :filter="{ where: { role: 'salesPerson' } }"
@ -54,44 +43,36 @@ function setParkings(data) {
        </template>
        <template #body="{ params }">
            <QItem class="q-my-sm">
-                <QItemSection v-if="!parkings">
-                    <QSkeleton type="QInput" class="full-width" />
-                </QItemSection>
-                <QItemSection v-if="parkings">
-                    <QSelect
+                <QItemSection>
+                    <VnSelect
+                        v-model="params.parkingFk"
+                        url="Parkings"
+                        :fields="['id', 'code']"
+                        :label="t('params.parkingFk')"
+                        option-value="id"
+                        option-label="code"
+                        :filter-options="['id', 'code']"
                        dense
                        outlined
                        rounded
-                        :label="t('params.parkingFk')"
-                        v-model="params.parkingFk"
-                        :options="parkings"
-                        option-value="id"
-                        option-label="code"
-                        emit-value
-                        map-options
-                        use-input
-                        :input-debounce="0"
+                        sort-by="code ASC"
                    />
                </QItemSection>
            </QItem>
            <QItem class="q-mb-sm">
-                <QItemSection v-if="!workers">
-                    <QSkeleton type="QInput" class="full-width" />
-                </QItemSection>
-                <QItemSection v-if="workers">
-                    <QSelect
+                <QItemSection>
+                    <VnSelect
                        dense
                        outlined
                        rounded
                        :label="t('params.userFk')"
                        v-model="params.userFk"
-                        :options="workers"
+                        url="Workers/activeWithInheritedRole"
                        option-value="id"
-                        option-label="name"
-                        emit-value
-                        map-options
-                        use-input
-                        :input-debounce="0"
+                        option-label="firstName"
+                        :where="{ role: 'salesPerson' }"
+                        sort-by="firstName ASC"
+                        :use-like="false"
                    />
                </QItemSection>
            </QItem>
--- a/src/pages/Shelving/Card/ShelvingForm.vue
+++ b/src/pages/Shelving/Card/ShelvingForm.vue
@ -1,18 +1,18 @@
 <script setup>
 import { useI18n } from 'vue-i18n';
-import { ref } from 'vue';
+import { computed } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
 import VnRow from 'components/ui/VnRow.vue';
-import FetchData from 'components/FetchData.vue';
 import FormModel from 'components/FormModel.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
+import VnSelect from 'src/components/common/VnSelect.vue';

 const { t } = useI18n();
 const route = useRoute();
 const router = useRouter();
-const shelvingId = route.params?.id || null;
-const isNew = Boolean(!shelvingId);
+const entityId = computed(() => route.params.id ?? null);
+const isNew = Boolean(!entityId.value);
 const defaultInitialData = {
    parkingFk: null,
    priority: null,
@ -20,30 +20,6 @@ const defaultInitialData = {
    isRecyclable: false,
 };

-const parkingFilter = { fields: ['id', 'code'] };
-const parkingList = ref([]);
-const parkingListCopy = ref([]);
-
-const setParkingList = (data) => {
-    parkingList.value = data;
-    parkingListCopy.value = data;
-};
-
-const parkingSelectFilter = {
-    options: parkingList,
-    filterFn: (options, value) => {
-        const search = value.trim().toLowerCase();
-
-        if (!search || search === '') {
-            return parkingListCopy.value;
-        }
-
-        return options.value.filter((option) =>
-            option.code.toLowerCase().startsWith(search)
-        );
-    },
-};
-
 const shelvingFilter = {
    include: [
        {
@ -67,44 +43,33 @@ const onSave = (shelving, newShelving) => {
 };
 </script>
 <template>
-    <VnSubToolbar />
-    <FetchData
-        url="Parkings"
-        :filter="parkingFilter"
-        @on-fetch="setParkingList"
-        auto-load
-    />
+    <VnSubToolbar v-if="isNew" />
    <FormModel
-        :url="isNew ? null : `Shelvings/${shelvingId}`"
+        :url="isNew ? null : `Shelvings/${entityId}`"
        :url-create="isNew ? 'Shelvings' : null"
        :observe-form-changes="!isNew"
        :filter="shelvingFilter"
        model="shelving"
        :auto-load="!isNew"
-        :form-initial-data="defaultInitialData"
+        :form-initial-data="isNew ? defaultInitialData : null"
        @on-data-saved="onSave"
    >
-        <template #form="{ data, validate, filter }">
+        <template #form="{ data, validate }">
            <VnRow>
                <VnInput
                    v-model="data.code"
                    :label="t('shelving.basicData.code')"
                    :rules="validate('Shelving.code')"
                />
-                <QSelect
+                <VnSelect
                    v-model="data.parkingFk"
-                    :options="parkingList"
+                    url="Parkings"
                    option-value="id"
                    option-label="code"
-                    emit-value
+                    :filter-options="['id', 'code']"
+                    :fields="['id', 'code']"
                    :label="t('shelving.basicData.parking')"
-                    map-options
-                    use-input
-                    @filter="
-                        (value, update) => filter(value, update, parkingSelectFilter)
-                    "
                    :rules="validate('Shelving.parkingFk')"
-                    :input-debounce="0"
                />
            </VnRow>
            <VnRow>
--- a/src/pages/Ticket/Card/BasicData/TicketBasicDataForm.vue
+++ b/src/pages/Ticket/Card/BasicData/TicketBasicDataForm.vue
@ -30,7 +30,6 @@ const { t } = useI18n();
 const agencyFetchRef = ref(null);
 const zonesFetchRef = ref(null);

-const clientsOptions = ref([]);
 const warehousesOptions = ref([]);
 const companiesOptions = ref([]);
 const agenciesOptions = ref([]);
@ -273,15 +272,6 @@ const redirectToCustomerAddress = () => {
 onMounted(() => onFormModelInit());
 </script>
 <template>
-    <FetchData
-        url="Clients"
-        :filter="{
-            fields: ['id', 'name'],
-            order: 'id',
-        }"
-        @on-fetch="(data) => (clientsOptions = data)"
-        auto-load
-    />
    <FetchData
        url="Warehouses"
        @on-fetch="(data) => (warehousesOptions = data)"
@ -317,7 +307,9 @@ onMounted(() => onFormModelInit());
                v-model="clientId"
                option-value="id"
                option-label="name"
-                :options="clientsOptions"
+                url="Clients"
+                :fields="['id', 'name']"
+                sort-by="id"
                hide-selected
                map-options
                :required="true"
--- a/src/pages/Ticket/Card/TicketCreateTracking.vue
+++ b/src/pages/Ticket/Card/TicketCreateTracking.vue
@ -17,9 +17,7 @@ const { t } = useI18n();
 const state = useState();
 const user = state.getUser();
 const stateFetchDataRef = ref(null);
-
 const statesOptions = ref([]);
-const workersOptions = ref([]);

 const onStateFkChange = (formData) => (formData.userFk = user.value.id);
 </script>
@ -30,12 +28,6 @@ const onStateFkChange = (formData) => (formData.userFk = user.value.id);
        auto-load
        @on-fetch="(data) => (statesOptions = data)"
    />
-    <FetchData
-        url="Workers/search"
-        :filter="{ fields: ['id', 'name'], order: 'name ASC' }"
-        auto-load
-        @on-fetch="(data) => (workersOptions = data)"
-    />
    <FormModelPopup
        :title="t('Create tracking')"
        url-create="Tickets/state"
@ -57,7 +49,9 @@ const onStateFkChange = (formData) => (formData.userFk = user.value.id);
                <VnSelect
                    :label="t('tracking.worker')"
                    v-model="data.userFk"
-                    :options="workersOptions"
+                    url="Workers/search"
+                    fields=" ['id', 'name']"
+                    sort-by="name ASC"
                    hide-selected
                    option-label="name"
                    option-value="id"
--- a/src/pages/Ticket/Card/TicketDescriptorMenu.vue
+++ b/src/pages/Ticket/Card/TicketDescriptorMenu.vue
@ -30,10 +30,12 @@ const actions = {
        let clonedTicketId;

        try {
-            const { data } = await axios.post(`Tickets/${ticketId}/clone`, {
-                shipped: ticket.value.shipped,
+            const { data } = await axios.post(`Tickets/cloneAll`, {
+                ticketsIds: [ticket.value.id],
+                withWarehouse: true,
+                negative: false,
            });
-            clonedTicketId = data;
+            clonedTicketId = data[0].id;
        } catch (e) {
            opts.message = t('It was not able to clone the ticket');
            opts.type = 'negative';
--- a/src/pages/Ticket/Card/TicketExpedition.vue
+++ b/src/pages/Ticket/Card/TicketExpedition.vue
@ -3,7 +3,6 @@ import { onMounted, ref, computed, onUnmounted, reactive, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRoute } from 'vue-router';

-import FetchData from 'components/FetchData.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
 import TicketEditManaProxy from './TicketEditMana.vue';
@ -35,7 +34,6 @@ const selectedExpeditions = ref([]);
 const allColumnNames = ref([]);
 const visibleColumns = ref([]);
 const newTicketWithRoute = ref(false);
-const itemsOptions = ref([]);

 const exprBuilder = (param, value) => {
    switch (param) {
@ -139,7 +137,9 @@ const columns = computed(() => [
            filterValue: null,
            event: getInputEvents,
            attrs: {
-                options: itemsOptions.value,
+                url: 'Items',
+                fields: ['id', 'name'],
+                'sort-by': 'name ASC',
                'option-value': 'id',
                'option-label': 'name',
                dense: true,
@ -274,12 +274,6 @@ onUnmounted(() => (stateStore.rightDrawer = false));
 </script>

 <template>
-    <FetchData
-        url="Items"
-        auto-load
-        :filter="{ fields: ['id', 'name'], order: 'name ASC' }"
-        @on-fetch="(data) => (itemsOptions = data)"
-    />
    <VnSubToolbar>
        <template #st-data>
            <TableVisibleColumns
--- a/src/pages/Ticket/Card/TicketSale.vue
+++ b/src/pages/Ticket/Card/TicketSale.vue
@ -38,7 +38,6 @@ const ticketConfig = ref(null);
 const isLocked = ref(false);
 const isTicketEditable = ref(false);
 const sales = ref([]);
-const itemsWithNameOptions = ref([]);
 const editableStatesOptions = ref([]);
 const selectedSales = ref([]);
 const mana = ref(null);
@ -435,12 +434,6 @@ onUnmounted(() => (stateStore.rightDrawer = false));
        auto-load
        @on-fetch="(data) => (isLocked = data)"
    />
-    <FetchData
-        url="Items/withName"
-        :filter="{ fields: ['id', 'name'], order: 'id DESC' }"
-        auto-load
-        @on-fetch="(data) => (itemsWithNameOptions = data)"
-    />
    <FetchData
        url="States/editableStates"
        :filter="{ fields: ['code', 'name', 'id', 'alertLevel'], order: 'name ASC' }"
@ -626,10 +619,12 @@ onUnmounted(() => (stateStore.rightDrawer = false));
                </div>
                <VnSelect
                    v-else
-                    :options="itemsWithNameOptions"
                    hide-selected
                    option-label="name"
                    option-value="id"
+                    url="Items/withName"
+                    :fields="['id', 'name']"
+                    sort-by="id DESC"
                    @update:model-value="changeQuantity(row)"
                    v-model="row.itemFk"
                >
--- a/src/pages/Ticket/Card/TicketSaleMoreActions.vue
+++ b/src/pages/Ticket/Card/TicketSaleMoreActions.vue
@ -131,7 +131,11 @@ const createClaim = () => {
            onCreateClaimAccepted
        );
    else
-        openConfirmationModal(t('Do you want to create a claim?'), onCreateClaimAccepted);
+        openConfirmationModal(
+            t('Do you want to create a claim?'),
+            false,
+            onCreateClaimAccepted
+        );
 };

 const onCreateClaimAccepted = async () => {
--- a/src/pages/Ticket/Card/TicketSaleTracking.vue
+++ b/src/pages/Ticket/Card/TicketSaleTracking.vue
@ -26,8 +26,6 @@ const saleTrackingFetchDataRef = ref(null);
 const sales = ref([]);
 const saleTrackings = ref([]);
 const itemShelvignsSales = ref([]);
-const shelvingsOptions = ref([]);
-const parkingsOptions = ref([]);
 const saleTrackingUrl = computed(() => `SaleTrackings/${route.params.id}/filter`);
 const oldQuantity = ref(null);

@ -330,12 +328,6 @@ const qCheckBoxController = (sale, action) => {
        auto-load
        @on-fetch="(data) => (sales = data)"
    />
-    <FetchData
-        url="Shelvings"
-        auto-load
-        @on-fetch="(data) => (shelvingsOptions = data)"
-    />
-    <FetchData url="Parkings" auto-load @on-fetch="(data) => (parkingsOptions = data)" />
    <QTable
        :rows="sales"
        :columns="columns"
@ -500,7 +492,7 @@ const qCheckBoxController = (sale, action) => {
            <template #body-cell-shelving="{ row }">
                <QTd auto-width>
                    <VnSelect
-                        :options="shelvingsOptions"
+                        url="Shelvings"
                        hide-selected
                        option-label="code"
                        option-value="code"
@ -513,7 +505,7 @@ const qCheckBoxController = (sale, action) => {
            <template #body-cell-parking="{ row }">
                <QTd auto-width>
                    <VnSelect
-                        :options="parkingsOptions"
+                        url="Parkings"
                        hide-selected
                        option-label="code"
                        option-value="id"
--- a/src/pages/Ticket/Card/TicketTracking.vue
+++ b/src/pages/Ticket/Card/TicketTracking.vue
@ -82,7 +82,9 @@ const openCreateModal = () => createTrackingDialogRef.value.show();
            data-key="TicketTracking"
            :filter="paginateFilter"
            url="TicketTrackings"
-            auto-load
+            auto-load            
+            order="created DESC"
+            :limit="0"
        >
            <template #body="{ rows }">
                <QTable
--- a/src/pages/Travel/ExtraCommunityFilter.vue
+++ b/src/pages/Travel/ExtraCommunityFilter.vue
@ -20,7 +20,6 @@ const props = defineProps({
 const warehousesOptions = ref([]);
 const continentsOptions = ref([]);
 const agenciesOptions = ref([]);
-const suppliersOptions = ref([]);
 const warehousesByContinent = ref({});

 const add = (paramsObj, key) => {
@ -76,12 +75,6 @@ warehouses();
        @on-fetch="(data) => (agenciesOptions = data)"
        auto-load
    />
-    <FetchData
-        url="Suppliers"
-        @on-fetch="(data) => (suppliersOptions = data)"
-        auto-load
-    />
-
    <VnFilterPanel :data-key="props.dataKey" :search-button="true">
        <template #tags="{ tag, formatFn }">
            <div class="q-gutter-x-xs">
@ -220,7 +213,7 @@ warehouses();
                    <VnSelect
                        :label="t('globals.pageTitles.supplier')"
                        v-model="params.cargoSupplierFk"
-                        :options="suppliersOptions"
+                        url="Suppliers"
                        option-value="id"
                        option-label="name"
                        hide-selected
--- a/src/pages/Travel/TravelList.vue
+++ b/src/pages/Travel/TravelList.vue
@ -10,6 +10,7 @@ import { computed } from 'vue';
 import TravelSummary from './Card/TravelSummary.vue';
 import VnSearchbar from 'components/ui/VnSearchbar.vue';
 import { toDate } from 'src/filters';
+import { getDateQBadgeColor } from 'src/composables/getDateQBadgeColor.js';
 const { viewSummary } = useSummaryDialog();
 const router = useRouter();
 const { t } = useI18n();
@ -46,14 +47,12 @@ const columns = computed(() => [
        name: 'id',
        label: t('travel.travelList.tableVisibleColumns.id'),
        isId: true,
-        field: 'id',
        cardVisible: true,
    },
    {
        align: 'left',
        name: 'ref',
        label: t('travel.travelList.tableVisibleColumns.ref'),
-        field: 'ref',
        component: 'input',
        columnField: {
            component: null,
@ -65,7 +64,6 @@ const columns = computed(() => [
        align: 'left',
        name: 'agencyModeFk',
        label: t('travel.travelList.tableVisibleColumns.agency'),
-        field: 'agencyModeFk',
        component: 'select',
        attrs: {
            url: 'agencyModes',
@ -78,37 +76,10 @@ const columns = computed(() => [
        cardVisible: true,
        create: true,
    },
-    {
-        align: 'left',
-        name: 'shipped',
-        label: t('travel.travelList.tableVisibleColumns.shipped'),
-        field: 'shipped',
-        component: 'date',
-        columnField: {
-            component: null,
-        },
-        cardVisible: true,
-        create: true,
-        format: (row, dashIfEmpty) => dashIfEmpty(toDate(row.shipped)),
-    },
-    {
-        align: 'left',
-        name: 'landed',
-        label: t('travel.travelList.tableVisibleColumns.landed'),
-        field: 'landed',
-        component: 'date',
-        columnField: {
-            component: null,
-        },
-        cardVisible: true,
-        create: true,
-        format: (row, dashIfEmpty) => dashIfEmpty(toDate(row.landed)),
-    },
    {
        align: 'left',
        name: 'warehouseInFk',
        label: t('travel.travelList.tableVisibleColumns.warehouseIn'),
-        field: 'warehouseInFk',
        component: 'select',
        attrs: {
            url: 'warehouses',
@ -123,11 +94,28 @@ const columns = computed(() => [
        cardVisible: true,
        create: true,
    },
+    {
+        align: 'left',
+        name: 'shipped',
+        label: t('travel.travelList.tableVisibleColumns.shipped'),
+        component: 'date',
+        columnField: {
+            component: null,
+        },
+        cardVisible: true,
+        create: true,
+        format: (row, dashIfEmpty) => dashIfEmpty(toDate(row.shipped)),
+    },
+    {
+        align: 'left',
+        name: 'shipmentHour',
+        label: t('travel.travelList.tableVisibleColumns.shipHour'),
+        cardVisible: true,
+    },
    {
        align: 'left',
        name: 'warehouseOutFk',
        label: t('travel.travelList.tableVisibleColumns.warehouseOut'),
-        field: 'warehouseOutFk',
        component: 'select',
        attrs: {
            url: 'warehouses',
@ -140,12 +128,30 @@ const columns = computed(() => [
        cardVisible: true,
        create: true,
    },
+    {
+        align: 'left',
+        name: 'landed',
+        label: t('travel.travelList.tableVisibleColumns.landed'),
+        component: 'date',
+        columnField: {
+            component: null,
+        },
+        cardVisible: true,
+        create: true,
+        format: (row, dashIfEmpty) => dashIfEmpty(toDate(row.landed)),
+    },
+    {
+        align: 'left',
+        name: 'landingHour',
+        label: t('travel.travelList.tableVisibleColumns.landHour'),
+        cardVisible: true,
+    },
    {
        align: 'left',
        name: 'totalEntries',
        label: t('travel.travelList.tableVisibleColumns.totalEntries'),
-        field: 'totalEntries',
        component: 'input',
+        toolTip: t('travel.travelList.tableVisibleColumns.totalEntriesTooltip'),
        columnField: {
            component: null,
        },
@ -165,13 +171,15 @@ const columns = computed(() => [
            },
            {
                title: t('Add entry'),
-                icon: 'contact_support',
+                icon: 'vn:ticket',
                action: redirectCreateEntryView,
+                isPrimary: true,
            },
            {
-                title: t('View Summary'),
+                title: t('components.smartCard.viewSummary'),
                icon: 'preview',
                action: (row) => viewSummary(row.id, TravelSummary),
+                isPrimary: true,
            },
        ],
    },
@ -202,12 +210,43 @@ const columns = computed(() => [
        redirect="travel"
        :is-editable="false"
        :use-model="true"
-    />
+    >
+        <template #column-shipped="{ row }">
+            <QBadge
+                text-color="black"
+                v-if="getDateQBadgeColor(row.shipped)"
+                :color="getDateQBadgeColor(row.shipped)"
+            >
+                {{ toDate(row.shipped) }}
+            </QBadge>
+            <span v-else>{{ toDate(row.shipped) }}</span>
+            <QIcon
+                name="flight_takeoff"
+                size="sm"
+                :class="{ 'is-active': row.isDelivered }"
+            />
+        </template>
+        <template #column-landed="{ row }">
+            <QBadge
+                text-color="black"
+                v-if="getDateQBadgeColor(row.landed)"
+                :color="getDateQBadgeColor(row.landed)"
+            >
+                {{ toDate(row.landed) }}
+            </QBadge>
+            <span v-else>{{ toDate(row.landed) }}</span>
+            <QIcon
+                name="flight_land"
+                size="sm"
+                :class="{ 'is-active': row.isReceived }"
+            />
+        </template>
+    </VnTable>
 </template>

 <i18n>
 en:
-    addEntry: Add entry
+    Add entry: Add entry
    searchByIdOrReference: Search by ID or reference

 es:
@ -215,4 +254,12 @@ es:
    searchByIdOrReference: Buscar por ID o por referencia
    You can search by travel id or name: Buscar por envio por id o nombre
    Search travel: Buscar envio
+    Clone: Clonar
+    Add entry: Añadir Entrada
 </i18n>
+
+<style lang="scss" scoped>
+.is-active {
+    color: #c8e484;
+}
+</style>
--- a/src/pages/Worker/Card/WorkerCalendarItem.vue
+++ b/src/pages/Worker/Card/WorkerCalendarItem.vue
@ -152,7 +152,7 @@ const getEventAttrs = (timestamp) => {

    if (isFestive) {
        attrs.class = '--festive';
-        attrs.label = event.absenceId ?? timestamp.day;
+        attrs.label = timestamp.day;
    } else attrs.class = `--${type}`;

    return attrs;
--- a/src/pages/Worker/Card/WorkerSummary.vue
+++ b/src/pages/Worker/Card/WorkerSummary.vue
@ -93,7 +93,6 @@ const filter = {
                        />
                    </template>
                </VnLv>
-                <VnLv :label="t('worker.list.email')" :value="worker.user.email" copy />
                <VnLv :label="t('worker.summary.boss')" link>
                    <template #value>
                        <VnUserLink
@ -139,29 +138,25 @@ const filter = {
                />
                <VnLv :label="t('worker.summary.fi')" :value="worker.fi" />
                <VnLv :label="t('worker.summary.birth')" :value="toDate(worker.birth)" />
-                <VnRow class="q-mt-sm" wrap>
-                    <VnLv
-                        :label="t('worker.summary.isFreelance')"
-                        :value="worker.isFreelance"
-                    />
-                    <VnLv
-                        :label="t('worker.summary.isSsDiscounted')"
-                        :value="worker.isSsDiscounted"
-                    />
-                    <VnLv
-                        :label="t('worker.summary.hasMachineryAuthorized')"
-                        :value="worker.hasMachineryAuthorized"
-                    />
-                    <VnLv
-                        :label="t('worker.summary.isDisable')"
-                        :value="worker.isDisable"
-                    />
-                </VnRow>
+                <VnLv
+                    :label="t('worker.summary.isFreelance')"
+                    :value="worker.isFreelance"
+                />
+                <VnLv
+                    :label="t('worker.summary.isSsDiscounted')"
+                    :value="worker.isSsDiscounted"
+                />
+                <VnLv
+                    :label="t('worker.summary.hasMachineryAuthorized')"
+                    :value="worker.hasMachineryAuthorized"
+                />
+                <VnLv :label="t('worker.summary.isDisable')" :value="worker.isDisable" />
            </QCard>
            <QCard class="vn-one">
                <VnTitle :text="t('worker.summary.userData')" />
                <VnLv :label="t('worker.summary.userId')" :value="worker.user.id" />
                <VnLv :label="t('worker.card.name')" :value="worker.user.nickname" />
+                <VnLv :label="t('worker.list.email')" :value="worker.user.email" copy />
                <VnLv :label="t('worker.summary.role')">
                    <template #value>
                        <span class="link">
--- a/src/pages/Worker/Card/WorkerTimeControl.vue
+++ b/src/pages/Worker/Card/WorkerTimeControl.vue
@ -34,6 +34,10 @@ const weekdayStore = useWeekdayStore();
 const weekDays = ref([]);
 const { openConfirmationModal } = useVnConfirm();
 const { getWeekOfYear } = date;
+const defaultDate = computed(() => {
+    const timestamp = route.query.timestamp;
+    return timestamp ? new Date(timestamp * 1000) : Date.vnNew();
+});

 const workerTimeFormDialogRef = ref(null);
 const workerTimeReasonFormDialogRef = ref(null);
@ -56,7 +60,7 @@ const workerTimeFormProps = reactive({
 // Array utilizado por QCalendar para seleccionar un rango de fechas
 const selectedCalendarDates = ref([]);
 // Date formateada para bindear al componente QDate
-const selectedDateFormatted = ref(toDateString(Date.vnNew()));
+const selectedDateFormatted = ref(toDateString(defaultDate.value));

 const arrayData = useArrayData('workerData');

@ -423,7 +427,7 @@ onBeforeMount(() => {
 });

 onMounted(async () => {
-    await setDate(Date.vnNew());
+    await setDate(defaultDate.value);
    await getMailStates(selectedDate.value);
    stateStore.rightDrawer = true;
 });
@ -547,9 +551,12 @@ onMounted(async () => {
                    <QTd
                        v-for="(day, index) in props.cols"
                        :key="index"
-                        style="padding: 20px 16px !important"
+                        :style="{
+                            padding: '20px 16px !important',
+                            'vertical-align': 'baseline',
+                        }"
                    >
-                        <div class="full-height full-width column items-center">
+                        <div class="full-width column items-center">
                            <WorkerTimeHourChip
                                v-for="(hour, ind) in day.dayData?.hours"
                                :key="ind"
--- a/src/pages/Worker/WorkerCreate.vue
+++ b/src/pages/Worker/WorkerCreate.vue
@ -2,7 +2,6 @@
 import { onBeforeMount, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import axios from 'axios';
-import { useUserConfig } from 'src/composables/useUserConfig';
 import VnRow from 'components/ui/VnRow.vue';
 import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
 import VnInputDate from 'components/common/VnInputDate.vue';
@ -14,15 +13,25 @@ import FetchData from 'components/FetchData.vue';
 import FormModel from 'components/FormModel.vue';
 import CreateBankEntityForm from 'src/components/CreateBankEntityForm.vue';
 import VnRadio from 'src/components/common/VnRadio.vue';
+import { useState } from 'src/composables/useState';

 const { t } = useI18n();
+const user = useState().getUser();

 const companiesOptions = ref([]);
-const workersOptions = ref([]);
 const payMethodsOptions = ref([]);
 const bankEntitiesOptions = ref([]);
-const formData = ref({ isFreelance: false });
-const defaultPayMethod = ref(0);
+const formData = ref({ companyFk: user.value.companyFk, isFreelance: false });
+const defaultPayMethod = ref();
+
+onBeforeMount(async () => {
+    defaultPayMethod.value = (
+        await axios.get('WorkerConfigs/findOne', {
+            params: { field: ['payMethodFk'] },
+        })
+    ).data.payMethodFk;
+    formData.value.payMethodFk = defaultPayMethod.value;
+});

 function handleLocation(data, location) {
    const { town, code, provinceFk, countryFk } = location ?? {};
@ -32,16 +41,32 @@ function handleLocation(data, location) {
    data.countryFk = countryFk;
 }

-onBeforeMount(async () => {
-    const userInfo = await useUserConfig().fetch();
-    formData.value.companyFk = userInfo.companyFk;
+function generateCodeUser(worker) {
+    if (!worker.firstName || !worker.lastNames) return;

-    const { data } = await axios.get('WorkerConfigs/findOne', {
-        params: { field: ['payMethodFk'] },
-    });
-    defaultPayMethod.value = data.payMethodFk;
-    formData.value.payMethodFk = defaultPayMethod.value;
-});
+    const totalName = worker.firstName.concat(' ' + worker.lastNames).toLowerCase();
+    const totalNameArray = totalName.split(' ');
+    let newCode = '';
+
+    for (let part of totalNameArray) newCode += part.charAt(0);
+
+    worker.code = newCode.toUpperCase().slice(0, 3);
+    worker.name = totalNameArray[0] + newCode.slice(1);
+
+    if (!worker.companyFk) worker.companyFk = user.companyFk;
+}
+
+async function autofillBic(worker) {
+    if (!worker || !worker.iban) return;
+
+    let bankEntityId = parseInt(worker.iban.substr(4, 4));
+    let filter = { where: { id: bankEntityId } };
+
+    const { data } = await axios.get(`BankEntities`, { params: { filter } });
+    const hasData = data && data[0];
+    if (hasData) worker.bankEntityFk = data[0].id;
+    else if (!hasData) worker.bankEntityFk = undefined;
+}
 </script>
 <template>
    <FetchData
@ -49,11 +74,6 @@ onBeforeMount(async () => {
        @on-fetch="(data) => (companiesOptions = data)"
        auto-load
    />
-    <FetchData
-        url="Workers/search"
-        @on-fetch="(data) => (workersOptions = data)"
-        auto-load
-    />
    <FetchData
        url="Paymethods"
        @on-fetch="(data) => (payMethodsOptions = data)"
@ -93,11 +113,13 @@ onBeforeMount(async () => {
                        v-model="data.firstName"
                        :label="t('worker.create.name')"
                        :rules="validate('Worker.firstName')"
+                        @update:model-value="generateCodeUser(data)"
                    />
                    <VnInput
                        v-model="data.lastNames"
                        :label="t('worker.create.lastName')"
                        :rules="validate('Worker.lastNames')"
+                        @update:model-value="generateCodeUser(data)"
                    />
                    <VnInput
                        v-model="data.code"
@ -130,7 +152,7 @@ onBeforeMount(async () => {
                    <VnSelect
                        :label="t('worker.create.boss')"
                        v-model="data.bossFk"
-                        :options="workersOptions"
+                        url="Workers/search"
                        option-value="id"
                        option-label="name"
                        hide-selected
@ -204,6 +226,7 @@ onBeforeMount(async () => {
                        :label="t('worker.create.iban')"
                        :rules="validate('Worker.iban')"
                        :disable="formData.isFreelance"
+                        @update:model-value="autofillBic(data)"
                    >
                        <template #append>
                            <QIcon name="info" class="cursor-info">
@ -221,6 +244,8 @@ onBeforeMount(async () => {
                        :roles-allowed-to-create="['salesAssistant', 'hr']"
                        :rules="validate('Worker.bankEntity')"
                        :disable="formData.isFreelance"
+                        @update:model-value="autofillBic(data)"
+                        :filter-options="['bic', 'name']"
                    >
                        <template #form>
                            <CreateBankEntityForm
--- a/src/pages/Worker/WorkerList.vue
+++ b/src/pages/Worker/WorkerList.vue
@ -1,5 +1,5 @@
 <script setup>
-import { computed, ref } from 'vue';
+import { onBeforeMount, computed, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useSummaryDialog } from 'src/composables/useSummaryDialog';
 import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
@ -16,16 +16,19 @@ import CreateBankEntityForm from 'src/components/CreateBankEntityForm.vue';
 import FetchData from 'src/components/FetchData.vue';
 import RightMenu from 'src/components/common/RightMenu.vue';
 import WorkerFilter from './WorkerFilter.vue';
+import { useState } from 'src/composables/useState';
+import axios from 'axios';

 const { t } = useI18n();
 const tableRef = ref();
 const { viewSummary } = useSummaryDialog();
 const companiesOptions = ref([]);
-const workersOptions = ref([]);
 const payMethodsOptions = ref([]);
 const bankEntitiesOptions = ref([]);
 const postcodesOptions = ref([]);

+const user = useState().getUser();
+const defaultPayMethod = ref();
 const columns = computed(() => [
    {
        align: 'left',
@ -74,7 +77,7 @@ const columns = computed(() => [
        name: 'tableActions',
        actions: [
            {
-                title: t('InvoiceOutSummary'),
+                title: t('components.smartCard.viewSummary'),
                icon: 'preview',
                action: (row) => viewSummary(row.id, WorkerSummary),
            },
@ -82,6 +85,14 @@ const columns = computed(() => [
    },
 ]);

+onBeforeMount(async () => {
+    defaultPayMethod.value = (
+        await axios.get('WorkerConfigs/findOne', {
+            params: { field: ['payMethodFk'] },
+        })
+    ).data?.payMethodFk;
+});
+
 function handleLocation(data, location) {
    const { town, code, provinceFk, countryFk } = location ?? {};
    data.postcode = code;
@ -98,6 +109,31 @@ function uppercaseStreetModel(data) {
        },
    };
 }
+
+function generateCodeUser(worker) {
+    if (!worker.firstName || !worker.lastNames) return;
+
+    const totalName = worker.firstName.concat(' ' + worker.lastNames).toLowerCase();
+    const totalNameArray = totalName.split(' ');
+    let newCode = '';
+
+    for (let part of totalNameArray) newCode += part.charAt(0);
+
+    worker.code = newCode.toUpperCase().slice(0, 3);
+    worker.name = totalNameArray[0] + newCode.slice(1);
+
+    if (!worker.companyFk) worker.companyFk = user.companyFk;
+}
+
+async function autofillBic(worker) {
+    if (!worker || !worker.iban) return;
+
+    let bankEntityId = parseInt(worker.iban.substr(4, 4));
+    let filter = { where: { id: bankEntityId } };
+
+    const { data } = await axios.get(`BankEntities`, { params: { filter } });
+    worker.bankEntityFk = data?.[0]?.id ?? undefined;
+}
 </script>
 <template>
    <VnSearchbar
@ -110,11 +146,6 @@ function uppercaseStreetModel(data) {
        @on-fetch="(data) => (companiesOptions = data)"
        auto-load
    />
-    <FetchData
-        url="Workers/search"
-        @on-fetch="(data) => (workersOptions = data)"
-        auto-load
-    />
    <FetchData
        url="Paymethods"
        @on-fetch="(data) => (payMethodsOptions = data)"
@ -131,6 +162,7 @@ function uppercaseStreetModel(data) {
        </template>
    </RightMenu>
    <VnTable
+        v-if="defaultPayMethod"
        ref="tableRef"
        data-key="Worker"
        url="Workers/filter"
@ -139,6 +171,8 @@ function uppercaseStreetModel(data) {
            title: t('Create worker'),
            onDataSaved: ({ id }) => tableRef.redirect(id),
            formInitialData: {
+                payMethodFk: defaultPayMethod,
+                companyFk: user.companyFk,
                isFreelance: false,
            },
        }"
@ -149,7 +183,7 @@ function uppercaseStreetModel(data) {
        auto-load
    >
        <template #more-create-dialog="{ data }">
-            <div class="q-pa-lg full-width" style="max-width: 1200px">
+            <div class="q-pa-lg full-width">
                <VnRadio
                    v-model="data.isFreelance"
                    :val="false"
@ -163,10 +197,16 @@ function uppercaseStreetModel(data) {
                    @update:model-value="delete data.payMethodFk"
                />
                <VnRow>
-                    <VnInput v-model="data.firstName" :label="t('worker.create.name')" />
+                    <VnInput
+                        next
+                        v-model="data.firstName"
+                        :label="t('worker.create.name')"
+                        @update:model-value="generateCodeUser(data)"
+                    />
                    <VnInput
                        v-model="data.lastNames"
                        :label="t('worker.create.lastName')"
+                        @update:model-value="generateCodeUser(data)"
                    />
                    <VnInput v-model="data.code" :label="t('worker.create.code')" />
                </VnRow>
@ -189,7 +229,7 @@ function uppercaseStreetModel(data) {
                    <VnSelect
                        :label="t('worker.create.boss')"
                        v-model="data.bossFk"
-                        :options="workersOptions"
+                        url="Workers/search"
                        option-value="id"
                        option-label="name"
                        hide-selected
@ -254,6 +294,7 @@ function uppercaseStreetModel(data) {
                        v-model="data.iban"
                        :label="t('worker.create.iban')"
                        :disable="data.isFreelance"
+                        @update:model-value="autofillBic(data)"
                    >
                        <template #append>
                            <QIcon name="info" class="cursor-info">
@ -272,6 +313,8 @@ function uppercaseStreetModel(data) {
                        hide-selected
                        :roles-allowed-to-create="['salesAssistant', 'hr']"
                        :disable="data.isFreelance"
+                        @update:model-value="autofillBic(data)"
+                        :filter-options="['bic', 'name']"
                    >
                        <template #form>
                            <CreateBankEntityForm
--- a/src/router/modules/invoiceIn.js
+++ b/src/router/modules/invoiceIn.js
@ -11,7 +11,7 @@ export default {
    component: RouterView,
    redirect: { name: 'InvoiceInMain' },
    menus: {
-        main: ['InvoiceInList'],
+        main: ['InvoiceInList', 'InvoiceInSerial'],
        card: [
            'InvoiceInBasicData',
            'InvoiceInVat',
@ -37,6 +37,16 @@ export default {
                    },
                    component: () => import('src/pages/InvoiceIn/InvoiceInList.vue'),
                },
+                {
+                    path: 'serial',
+                    name: 'InvoiceInSerial',
+                    meta: {
+                        title: 'serial',
+                        icon: 'view_list',
+                    },
+                    component: () =>
+                        import('src/pages/InvoiceIn/Serial/InvoiceInSerial.vue'),
+                },
                {
                    path: 'create',
                    name: 'InvoiceInCreare',
--- a/src/router/modules/monitor.js
+++ b/src/router/modules/monitor.js
@ -11,7 +11,7 @@ export default {
    component: RouterView,
    redirect: { name: 'MonitorMain' },
    menus: {
-        main: ['MonitorList'],
+        main: ['MonitorTickets', 'MonitorClientsActions'],
        card: [],
    },
    children: [
@ -19,16 +19,27 @@ export default {
            path: '',
            name: 'MonitorMain',
            component: () => import('src/components/common/VnSectionMain.vue'),
-            redirect: { name: 'MonitorList' },
+            redirect: { name: 'MonitorTickets' },
            children: [
                {
-                    path: 'list',
-                    name: 'MonitorList',
+                    path: 'tickets',
+                    name: 'MonitorTickets',
                    meta: {
-                        title: 'list',
-                        icon: 'grid_view',
+                        title: 'ticketsMonitor',
+                        icon: 'vn:ticket',
                    },
-                    component: () => import('src/pages/Monitor/MonitorList.vue'),
+                    component: () =>
+                        import('src/pages/Monitor/Ticket/MonitorTickets.vue'),
+                },
+                {
+                    path: 'clients-actions',
+                    name: 'MonitorClientsActions',
+                    meta: {
+                        title: 'clientsActionsMonitor',
+                        icon: 'vn:client',
+                    },
+                    component: () =>
+                        import('src/pages/Monitor/MonitorClientsActions.vue'),
                },
            ],
        },
--- a/src/router/modules/route.js
+++ b/src/router/modules/route.js
@ -7,6 +7,7 @@ export default {
        title: 'routes',
        icon: 'vn:delivery',
        moduleName: 'Route',
+        keyBinding: 'r',
    },
    component: RouterView,
    redirect: { name: 'RouteMain' },
--- a/test/cypress/integration/route/routeList.spec.js
+++ b/test/cypress/integration/route/routeList.spec.js
@ -10,12 +10,13 @@ describe('Route', () => {

    it('Route list create route', () => {
        cy.get('.q-page-sticky > div > .q-btn > .q-btn__content > .q-icon').click();
-        cy.get('input[name="description"]').eq(1).type('routeTestOne{enter}');
+        cy.get('input[name="description"]').type('routeTestOne{enter}');
        cy.get('.q-notification__message').should('have.text', 'Data created');
        cy.url().should('include', '/summary');
    });

    it('Route list search and edit', () => {
+        cy.get('#searchbar input').type('{enter}');
        cy.get('input[name="description"]').type('routeTestOne{enter}');
        cy.get('.q-table tr')
            .its('length')
--- a/test/cypress/integration/ticket/ticketDescriptor.spec.js
+++ b/test/cypress/integration/ticket/ticketDescriptor.spec.js
@ -16,7 +16,7 @@ describe('Ticket descriptor', () => {
        cy.openActionsDescriptor();
        cy.get(toCloneOpt).click();
        cy.clickConfirm();
-        cy.get(warehouseValue).contains('-');
+        cy.get(warehouseValue).contains('Warehouse One');
        cy.get(summaryHeader)
            .invoke('text')
            .then((text) => {
--- a/test/cypress/integration/worker/workerCreate.spec.js
+++ b/test/cypress/integration/worker/workerCreate.spec.js
@ -2,6 +2,9 @@ describe('WorkerCreate', () => {
    const externalRadio = '.q-radio:nth-child(2)';
    const notification = '.q-notification__message';
    const developerBossId = 120;
+    const payMethodCross =
+        '.grid-create .full-width > :nth-child(9) .q-select .q-field__append:not(.q-anchor--skip)';
+    const saveBtn = '.q-mt-lg > .q-btn--standard';

    const internal = {
        Fi: { val: '78457139E' },
@ -36,7 +39,8 @@ describe('WorkerCreate', () => {

    it('should throw an error if a pay method has not been selected', () => {
        cy.fillInForm(internal);
-        cy.get('.q-mt-lg > .q-btn--standard').click();
+        cy.get(payMethodCross).click();
+        cy.get(saveBtn).click();
        cy.get(notification).should('contains.text', 'Payment method is required');
    });

@ -45,14 +49,14 @@ describe('WorkerCreate', () => {
            ...internal,
            'Pay method': { val: 'PayMethod one', type: 'select' },
        });
-        cy.get('.q-mt-lg > .q-btn--standard').click();
+        cy.get(saveBtn).click();
        cy.get(notification).should('contains.text', 'Data created');
    });

    it('should create an external', () => {
        cy.get(externalRadio).click();
        cy.fillInForm(external);
-        cy.get('.q-mt-lg > .q-btn--standard').click();
+        cy.get(saveBtn).click();
        cy.get(notification).should('contains.text', 'Data created');
    });
 });