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

src/boot/axios.js

@@ -4,8 +4,9 @@ import { Router } from 'src/router';
 import useNotify from 'src/composables/useNotify.js';
 import { useStateQueryStore } from 'src/stores/useStateQueryStore';
 
-let session, notify, stateQuery;
+const session = useSession();
-
+const { notify } = useNotify();
+const stateQuery = useStateQueryStore();
 const baseUrl = '/api/';
 
 axios.defaults.baseURL = baseUrl;
@@ -50,15 +51,9 @@ const onResponseError = (error) => {
     return Promise.reject(error);
 };
 
-export function setupAxios() {
+axios.interceptors.request.use(onRequest, onRequestError);
-    session = useSession();
+axios.interceptors.response.use(onResponse, onResponseError);
-    notify = useNotify().notify;
+axiosNoError.interceptors.request.use(onRequest);
-    stateQuery = useStateQueryStore();
+axiosNoError.interceptors.response.use(onResponse);
-
-    axios.interceptors.request.use(onRequest, onRequestError);
-    axios.interceptors.response.use(onResponse, onResponseError);
-    axiosNoError.interceptors.request.use(onRequest);
-    axiosNoError.interceptors.response.use(onResponse);
-}
 
 export { onRequest, onResponseError, axiosNoError };

src/boot/quasar.js

@@ -1,7 +1,6 @@
 import { boot } from 'quasar/wrappers';
 import qFormMixin from './qformMixin';
 import keyShortcut from './keyShortcut';
-import { setupAxios } from 'src/boot/axios';
 import useNotify from 'src/composables/useNotify.js';
 import { CanceledError } from 'axios';
 
@@ -49,5 +48,4 @@ export default boot(({ app }) => {
 
         notify(message ?? 'globals.error', 'negative', 'error');
     };
-    setupAxios();
 });

src/components/CrudModel.vue

@@ -77,7 +77,7 @@ const isLoading = ref(false);
 const hasChanges = ref(false);
 const originalData = ref();
 const vnPaginateRef = ref();
-const formData = ref();
+const formData = ref([]);
 const saveButtonRef = ref(null);
 const watchChanges = ref();
 const formUrl = computed(() => $props.url);

src/components/LeftMenu.vue

@@ -22,7 +22,7 @@ const props = defineProps({
         default: 'main',
     },
 });
-
+const initialized = ref(false);
 const items = ref([]);
 const expansionItemElements = reactive({});
 const pinnedModules = computed(() => {
@@ -34,18 +34,26 @@ const search = ref(null);
 
 const filteredItems = computed(() => {
     if (!search.value) return items.value;
+    const normalizedSearch = normalize(search.value);
     return items.value.filter((item) => {
-        const locale = t(item.title).toLowerCase();
+        const locale = normalize(t(item.title));
-        return locale.includes(search.value.toLowerCase());
+        return locale.includes(normalizedSearch);
     });
 });
 
 const filteredPinnedModules = computed(() => {
     if (!search.value) return pinnedModules.value;
+    const normalizedSearch = search.value
+        .normalize('NFD')
+        .replace(/[\u0300-\u036f]/g, '')
+        .toLowerCase();
     const map = new Map();
     for (const [key, pinnedModule] of pinnedModules.value) {
-        const locale = t(pinnedModule.title).toLowerCase();
+        const locale = t(pinnedModule.title)
-        if (locale.includes(search.value.toLowerCase())) map.set(key, pinnedModule);
+            .normalize('NFD')
+            .replace(/[\u0300-\u036f]/g, '')
+            .toLowerCase();
+        if (locale.includes(normalizedSearch)) map.set(key, pinnedModule);
     }
     return map;
 });
@@ -53,11 +61,13 @@ const filteredPinnedModules = computed(() => {
 onMounted(async () => {
     await navigation.fetchPinned();
     getRoutes();
+    initialized.value = true;
 });
 
 watch(
     () => route.matched,
     () => {
+        if (!initialized.value) return;
         items.value = [];
         getRoutes();
     },
@@ -147,6 +157,13 @@ async function togglePinned(item, event) {
 const handleItemExpansion = (itemName) => {
     expansionItemElements[itemName].scrollToLastElement();
 };
+
+function normalize(text) {
+    return text
+        .normalize('NFD')
+        .replace(/[\u0300-\u036f]/g, '')
+        .toLowerCase();
+}
 </script>
 
 <template>

src/components/VnTable/VnFilter.vue

@@ -25,7 +25,7 @@ const $props = defineProps({
     },
     searchUrl: {
         type: String,
-        default: 'params',
+        default: 'table',
     },
 });
 

src/components/VnTable/VnOrder.vue

@@ -17,7 +17,7 @@ const $props = defineProps({
     },
     searchUrl: {
         type: String,
-        default: 'params',
+        default: 'table',
     },
     vertical: {
         type: Boolean,

src/components/common/VnSelect.vue

@@ -1,7 +1,7 @@
 <script setup>
 import { ref, toRefs, computed, watch, onMounted, useAttrs } from 'vue';
 import { useI18n } from 'vue-i18n';
-import FetchData from 'src/components/FetchData.vue';
+import { useArrayData } from 'src/composables/useArrayData';
 import { useRequired } from 'src/composables/useRequired';
 import dataByOrder from 'src/utils/dataByOrder';
 
@@ -90,6 +90,10 @@ const $props = defineProps({
         type: Boolean,
         default: false,
     },
+    dataKey: {
+        type: String,
+        default: null,
+    },
 });
 
 const mixinRules = [requiredFieldRule, ...($attrs.rules ?? [])];
@@ -98,14 +102,14 @@ const { optionLabel, optionValue, optionFilter, optionFilterValue, options, mode
 const myOptions = ref([]);
 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 isLoading = ref(false);
+const useURL = computed(() => $props.url);
 const value = computed({
     get() {
         return $props.modelValue;
@@ -129,11 +133,18 @@ watch(modelValue, async (newValue) => {
 
 onMounted(() => {
     setOptions(options.value);
-    if ($props.url && $props.modelValue && !findKeyInOptions())
+    if (useURL.value && $props.modelValue && !findKeyInOptions())
         fetchFilter($props.modelValue);
     if ($props.focusOnMount) setTimeout(() => vnSelectRef.value.showPopup(), 300);
 });
 
+defineExpose({ opts: myOptions });
+
+const arrayDataKey =
+    $props.dataKey ?? ($props.url?.length > 0 ? $props.url : $attrs.name ?? $attrs.label);
+
+const arrayData = useArrayData(arrayDataKey, { url: $props.url, searchUrl: false });
+
 function findKeyInOptions() {
     if (!$props.options) return;
     return filter($props.modelValue, $props.options)?.length;
@@ -168,7 +179,7 @@ function filter(val, options) {
 }
 
 async function fetchFilter(val) {
-    if (!$props.url || !dataRef.value) return;
+    if (!$props.url) return;
 
     const { fields, include, sortBy, limit } = $props;
     const key =
@@ -190,8 +201,8 @@ async function fetchFilter(val) {
     const fetchOptions = { where, include, limit };
     if (fields) fetchOptions.fields = fields;
     if (sortBy) fetchOptions.order = sortBy;
-
+    arrayData.reset(['skip', 'filter.skip', 'page']);
-    return dataRef.value.fetch(fetchOptions);
+    return (await arrayData.applyFilter({ filter: fetchOptions }))?.data;
 }
 
 async function filterHandler(val, update) {
@@ -231,20 +242,23 @@ function nullishToTrue(value) {
 
 const getVal = (val) => ($props.useLike ? { like: `%${val}%` } : val);
 
-defineExpose({ opts: myOptions });
+async function onScroll({ to, direction, from, index }) {
+    const lastIndex = myOptions.value.length - 1;
+
+    if (from === 0 && index === 0) return;
+    if (!useURL.value && !$props.fetchRef) return;
+    if (direction === 'decrease') return;
+    if (to === lastIndex && arrayData.store.hasMoreData && !isLoading.value) {
+        isLoading.value = true;
+        await arrayData.loadMore();
+        setOptions(arrayData.store.data);
+        vnSelectRef.value.scrollTo(lastIndex);
+        isLoading.value = false;
+    }
+}
 </script>
 
 <template>
-    <FetchData
-        ref="dataRef"
-        :url="$props.url"
-        @on-fetch="(data) => setOptions(data)"
-        :where="where || { [optionValue]: value }"
-        :limit="limit"
-        :sort-by="sortBy"
-        :fields="fields"
-        :params="params"
-    />
     <QSelect
         v-model="value"
         :options="myOptions"
@@ -263,6 +277,9 @@ defineExpose({ opts: myOptions });
         :rules="mixinRules"
         virtual-scroll-slice-size="options.length"
         hide-bottom-space
+        :input-debounce="useURL ? '300' : '0'"
+        :loading="isLoading"
+        @virtual-scroll="onScroll"
     >
         <template v-if="isClearable" #append>
             <QIcon

src/components/ui/CardSummary.vue

@@ -83,7 +83,7 @@ async function fetch() {
                     <slot name="header" :entity="entity" dense>
                         <VnLv :label="`${entity.id} -`" :value="entity.name" />
                     </slot>
-                    <slot name="header-right">
+                    <slot name="header-right" :entity="entity">
                         <span></span>
                     </slot>
                 </div>

src/components/ui/VnFilterPanel.vue

@@ -49,7 +49,7 @@ const $props = defineProps({
     },
     searchUrl: {
         type: String,
-        default: 'params',
+        default: 'table',
     },
     redirect: {
         type: Boolean,

src/components/ui/VnLinkPhone.vue

@@ -17,19 +17,12 @@ const config = reactive({
 const type = Object.keys(config).find((key) => key in useAttrs()) || 'sip';
 
 onBeforeMount(async () => {
-    let url;
     let { channel } = config[type];
 
     if (type === 'say-simple') {
-        url = (await axios.get('SaySimpleConfigs/findOne')).data.url;
+        const { url, defaultChannel } = (await axios.get('SaySimpleConfigs/findOne'))
-        if (!channel)
+            .data;
-            channel = (
+        if (!channel) channel = defaultChannel;
-                await axios.get('SaySimpleCountries/findOne', {
-                    params: {
-                        filter: { fields: ['channel'], where: { countryFk: 0 } },
-                    },
-                })
-            ).data?.channel;
 
         config[
             type

src/components/ui/VnNotes.vue

@@ -65,13 +65,9 @@ onBeforeRouteLeave((to, from, next) => {
         auto-load
         @on-fetch="(data) => (observationTypes = data)"
     />
-    <QCard class="q-pa-xs q-mb-xl full-width" v-if="$props.addNote">
+    <QCard class="q-pa-xs q-mb-lg full-width" v-if="$props.addNote">
         <QCardSection horizontal>
-            <VnAvatar :worker-id="currentUser.id" size="md" />
+            {{ t('New note') }}
-            <div class="full-width row justify-between q-pa-xs">
-                <VnUserLink :name="t('New note')" :worker-id="currentUser.id" />
-                {{ t('globals.now') }}
-            </div>
         </QCardSection>
         <QCardSection class="q-px-xs q-my-none q-py-none">
             <VnRow class="full-width">
@@ -144,7 +140,7 @@ onBeforeRouteLeave((to, from, next) => {
                         <div class="full-width row justify-between q-pa-xs">
                             <div>
                                 <VnUserLink
-                                    :name="`${note.worker.user.nickname}`"
+                                    :name="`${note.worker.user.name}`"
                                     :worker-id="note.worker.id"
                                 />
                                 <QBadge

src/components/ui/VnPaginate.vue

@@ -44,7 +44,7 @@ const props = defineProps({
     },
     limit: {
         type: Number,
-        default: 10,
+        default: 20,
     },
     userParams: {
         type: Object,
@@ -100,7 +100,7 @@ const arrayData = useArrayData(props.dataKey, {
 const store = arrayData.store;
 
 onMounted(async () => {
-    if (props.autoLoad) await fetch();
+    if (props.autoLoad && !store.data?.length) await fetch();
     mounted.value = true;
 });
 
@@ -115,7 +115,11 @@ watch(
 
 watch(
     () => store.data,
-    (data) => emit('onChange', data)
+    (data) => {
+        if (!mounted.value) return;
+        emit('onChange', data);
+    },
+    { immediate: true }
 );
 
 watch(

src/components/ui/VnSearchbar.vue

@@ -45,7 +45,7 @@ const props = defineProps({
     },
     limit: {
         type: Number,
-        default: 10,
+        default: 20,
     },
     userParams: {
         type: Object,

src/composables/useArrayData.js

@@ -247,6 +247,7 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
     }
 
     function updateStateParams() {
+        if (!route?.path) return;
         const newUrl = { path: route.path, query: { ...(route.query ?? {}) } };
         if (store?.searchUrl)
             newUrl.query[store.searchUrl] = JSON.stringify(store.currentFilter);
@@ -270,7 +271,7 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
                 const pushUrl = { path: to };
                 if (to.endsWith('/list') || to.endsWith('/'))
                     pushUrl.query = newUrl.query;
-                destroy();
+                else destroy();
                 return router.push(pushUrl);
             }
         }

src/composables/useOpenURL.js

@@ -0,0 +1,8 @@
+import { openURL } from 'quasar';
+const defaultWindowFeatures = {
+    noopener: true,
+    noreferrer: true,
+};
+export default function (url, windowFeatures = defaultWindowFeatures, fn = undefined) {
+    openURL(url, fn, windowFeatures);
+}

src/composables/useSession.js

@@ -8,13 +8,9 @@ import useNotify from './useNotify';
 import { useTokenConfig } from './useTokenConfig';
 const TOKEN_MULTIMEDIA = 'tokenMultimedia';
 const TOKEN = 'token';
-let router;
+
-export default {
-    setup() {
-        router = useRouter();
-    },
-};
 export function useSession() {
+    const router = useRouter();
     const { notify } = useNotify();
     let isCheckingToken = false;
     let intervalId = null;

src/filters/getParamWhere.js

@@ -9,7 +9,7 @@ function parseJSON(str, fallback) {
 }
 export default function (route, param) {
     // catch route query params
-    const params = parseJSON(route?.query?.params, {});
+    const params = parseJSON(route?.query?.table, {});
     // extract and parse filter from params
     const { filter: filterStr = '{}' } = params;
 

src/pages/Account/AccountList.vue

@@ -104,7 +104,7 @@ const exprBuilder = (param, value) => {
 
 <template>
     <VnSearchbar
-        data-key="AccountUsers"
+        data-key="AccountList"
         :expr-builder="exprBuilder"
         :label="t('account.search')"
         :info="t('account.searchInfo')"
@@ -112,12 +112,12 @@ const exprBuilder = (param, value) => {
     />
     <RightMenu>
         <template #right-panel>
-            <AccountFilter data-key="AccountUsers" />
+            <AccountFilter data-key="AccountList" />
         </template>
     </RightMenu>
     <VnTable
         ref="tableRef"
-        data-key="AccountUsers"
+        data-key="AccountList"
         url="VnUsers/preview"
         :filter="filter"
         order="id DESC"

src/pages/Account/Role/AccountRoles.vue

@@ -82,14 +82,14 @@ const exprBuilder = (param, value) => {
 
 <template>
     <VnSearchbar
-        data-key="Roles"
+        data-key="AccountRolesList"
         :expr-builder="exprBuilder"
         :label="t('role.searchRoles')"
         :info="t('role.searchInfo')"
     />
     <VnTable
         ref="tableRef"
-        data-key="Roles"
+        data-key="AccountRolesList"
         :url="`VnRoles`"
         :create="{
             urlCreate: 'VnRoles',

src/pages/Account/Role/Card/RoleCard.vue

@@ -9,7 +9,7 @@ const { t } = useI18n();
     <VnCard
         data-key="Role"
         :descriptor="RoleDescriptor"
-        search-data-key="AccountRoles"
+        search-data-key="AccountRolesList"
         :searchbar-props="{
             url: 'VnRoles',
             label: t('role.searchRoles'),

src/pages/Claim/ClaimFilter.vue

@@ -23,7 +23,7 @@ defineExpose({ states });
 
 <template>
     <FetchData url="ClaimStates" @on-fetch="(data) => (states = data)" auto-load />
-    <VnFilterPanel :data-key="props.dataKey" :search-button="true" search-url="table">
+    <VnFilterPanel :data-key="props.dataKey" :search-button="true">
         <template #tags="{ tag, formatFn }">
             <div class="q-gutter-x-xs">
                 <strong>{{ t(`params.${tag.label}`) }}: </strong>

src/pages/Customer/Card/CustomerDescriptor.vue

@@ -37,6 +37,9 @@ const entityId = computed(() => {
 
 const data = ref(useCardDescription());
 const setData = (entity) => (data.value = useCardDescription(entity?.name, entity?.id));
+const debtWarning = computed(() => {
+    return customer.value?.debt > customer.value?.credit ? 'negative' : 'primary';
+});
 </script>
 
 <template>
@@ -117,7 +120,7 @@ const setData = (entity) => (data.value = useCardDescription(entity?.name, entit
                     v-if="customer.debt > customer.credit"
                     name="vn:risk"
                     size="xs"
-                    color="primary"
+                    :color="debtWarning"
                 >
                     <QTooltip>{{ t('customer.card.hasDebt') }}</QTooltip>
                 </QIcon>
@@ -174,23 +177,6 @@ const setData = (entity) => (data.value = useCardDescription(entity?.name, entit
                 >
                     <QTooltip>{{ t('Customer ticket list') }}</QTooltip>
                 </QBtn>
-                <QBtn
-                    :to="{
-                        name: 'TicketList',
-                        query: {
-                            table: JSON.stringify({
-                                clientFk: entity.id,
-                            }),
-                            createForm: JSON.stringify({ clientId: entity.id }),
-                        },
-                    }"
-                    size="md"
-                    color="primary"
-                    target="_blank"
-                    icon="vn:ticketAdd"
-                >
-                    <QTooltip>{{ t('New ticket') }}</QTooltip>
-                </QBtn>
                 <QBtn
                     :to="{
                         name: 'InvoiceOutList',
@@ -202,23 +188,6 @@ const setData = (entity) => (data.value = useCardDescription(entity?.name, entit
                 >
                     <QTooltip>{{ t('Customer invoice out list') }}</QTooltip>
                 </QBtn>
-                <QBtn
-                    :to="{
-                        name: 'OrderList',
-                        query: {
-                            table: JSON.stringify({
-                                clientFk: entity.id,
-                            }),
-                            createForm: JSON.stringify({ clientFk: entity.id }),
-                        },
-                    }"
-                    size="md"
-                    target="_blank"
-                    icon="vn:basketadd"
-                    color="primary"
-                >
-                    <QTooltip>{{ t('New order') }}</QTooltip>
-                </QBtn>
                 <QBtn
                     :to="{
                         name: 'AccountSummary',

src/pages/Customer/Card/CustomerDescriptorMenu.vue

@@ -6,8 +6,8 @@ import axios from 'axios';
 import { useQuasar } from 'quasar';
 
 import useNotify from 'src/composables/useNotify';
-
 import VnSmsDialog from 'src/components/common/VnSmsDialog.vue';
+import useOpenURL from 'src/composables/useOpenURL';
 
 const $props = defineProps({
     customer: {
@@ -15,7 +15,6 @@ const $props = defineProps({
         required: true,
     },
 });
-
 const { notify } = useNotify();
 const { t } = useI18n();
 const quasar = useQuasar();
@@ -40,9 +39,42 @@ const sendSms = async (payload) => {
         notify(error.message, 'positive');
     }
 };
+
+const openCreateForm = (type) => {
+    const query = {
+        table: {
+            clientFk: $props.customer.id,
+        },
+        createForm: {
+            addressId: $props.customer.defaultAddressFk,
+        },
+    };
+    const clientFk = {
+        ticket: 'clientId',
+        order: 'clientFk',
+    };
+    const key = clientFk[type];
+    if (!key) return;
+    query.createForm[key] = $props.customer.id;
+
+    const params = Object.entries(query)
+        .map(([key, value]) => `${key}=${JSON.stringify(value)}`)
+        .join('&');
+    useOpenURL(`/#/${type}/list?${params}`);
+};
 </script>
 
 <template>
+    <QItem v-ripple clickable @click="openCreateForm('ticket')">
+        <QItemSection>
+            {{ t('globals.pageTitles.createTicket') }}
+        </QItemSection>
+    </QItem>
+    <QItem v-ripple clickable @click="openCreateForm('order')">
+        <QItemSection>
+            {{ t('globals.pageTitles.createOrder') }}
+        </QItemSection>
+    </QItem>
     <QItem v-ripple clickable>
         <QItemSection @click="showSmsDialog()">{{ t('Send SMS') }}</QItemSection>
     </QItem>

src/pages/Customer/Card/CustomerSummary.vue

@@ -4,7 +4,7 @@ import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 import VnUserLink from 'src/components/ui/VnUserLink.vue';
 
-import { toCurrency, toPercentage, toDate } from 'src/filters';
+import { toCurrency, toPercentage, toDate, dashOrCurrency } from 'src/filters';
 import CardSummary from 'components/ui/CardSummary.vue';
 import { getUrl } from 'src/composables/getUrl';
 import VnLv from 'src/components/ui/VnLv.vue';
@@ -27,21 +27,16 @@ const $props = defineProps({
 const entityId = computed(() => $props.id || route.params.id);
 const customer = computed(() => summary.value.entity);
 const summary = ref();
-const clientUrl = ref();
+const defaulterAmount = computed(() => customer.value.defaulters[0]?.amount);
-
-onMounted(async () => {
-    clientUrl.value = (await getUrl('client/')) + entityId.value + '/';
-});
-
 const balanceDue = computed(() => {
-    return (
+    const amount = defaulterAmount.value;
-        customer.value &&
+    if (!amount || amount < 0) {
-        customer.value.defaulters.length &&
+        return null;
-        customer.value.defaulters[0].amount
+    }
-    );
+    return amount;
 });
 
-const balanceDueWarning = computed(() => (balanceDue.value ? 'negative' : ''));
+const balanceDueWarning = computed(() => (defaulterAmount.value ? 'negative' : ''));
 
 const claimRate = computed(() => {
     return customer.value.claimsRatio?.claimingRate ?? 0;
@@ -305,7 +300,7 @@ const sumRisk = ({ clientRisks }) => {
                 <VnLv
                     v-if="entity.defaulters"
                     :label="t('customer.summary.balanceDue')"
-                    :value="toCurrency(balanceDue)"
+                    :value="dashOrCurrency(balanceDue)()"
                     :class="balanceDueWarning"
                     :info="t('customer.summary.balanceDueInfo')"
                 />

src/pages/Customer/Card/CustomerUnpaid.vue

@@ -2,10 +2,9 @@
 import { computed, onBeforeMount, ref, watch, nextTick } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRoute } from 'vue-router';
-
 import VnInputDate from 'components/common/VnInputDate.vue';
 import VnInput from 'src/components/common/VnInput.vue';
-
+import VnRow from 'components/ui/VnRow.vue';
 import axios from 'axios';
 import useNotify from 'src/composables/useNotify';
 import { useStateStore } from 'stores/useStateStore';

src/pages/Customer/CustomerFilter.vue

@@ -11,10 +11,24 @@ defineProps({
         required: true,
     },
 });
+const handleSalesModelValue = (val) => ({
+    or: [
+        { id: val },
+        { name: val },
+        { nickname: { like: '%' + val + '%' } },
+        { code: { like: `${val}%` } },
+    ],
+});
+
+const exprBuilder = (param, value) => {
+    return {
+        and: [{ active: { neq: false } }, handleSalesModelValue(value)],
+    };
+};
 </script>
 
 <template>
-    <VnFilterPanel :data-key="dataKey" :search-button="true" search-url="table">
+    <VnFilterPanel :data-key="dataKey" :search-button="true">
         <template #tags="{ tag, formatFn }">
             <div class="q-gutter-x-xs">
                 <strong>{{ t(`params.${tag.label}`) }}: </strong>
@@ -52,14 +66,18 @@ defineProps({
             <QItem class="q-mb-sm">
                 <QItemSection>
                     <VnSelect
-                        url="Workers/activeWithInheritedRole"
+                        url="Workers/search"
-                        :filter="{ where: { role: 'salesPerson' } }"
+                        :params="{
+                            departmentCodes: ['VT'],
+                        }"
                         auto-load
                         :label="t('Salesperson')"
+                        :expr-builder="exprBuilder"
                         v-model="params.salesPersonFk"
                         @update:model-value="searchFn()"
                         option-value="id"
                         option-label="name"
+                        sort-by="nickname ASC"
                         emit-value
                         map-options
                         use-input
@@ -68,7 +86,18 @@ defineProps({
                         outlined
                         rounded
                         :input-debounce="0"
-                    />
+                    >
+                        <template #option="{ itemProps, opt }">
+                            <QItem v-bind="itemProps">
+                                <QItemSection>
+                                    <QItemLabel>{{ opt.name }}</QItemLabel>
+                                    <QItemLabel caption>
+                                        {{ opt.nickname }},{{ opt.code }}
+                                    </QItemLabel>
+                                </QItemSection>
+                            </QItem>
+                        </template></VnSelect
+                    >
                 </QItemSection>
             </QItem>
             <QItem class="q-mb-sm">

src/pages/Customer/CustomerList.vue

@@ -394,16 +394,16 @@ function handleLocation(data, location) {
     <VnSearchbar
         :info="t('You can search by customer id or name')"
         :label="t('Search customer')"
-        data-key="Customer"
+        data-key="CustomerList"
     />
     <RightMenu>
         <template #right-panel>
-            <CustomerFilter data-key="Customer" />
+            <CustomerFilter data-key="CustomerList" />
         </template>
     </RightMenu>
     <VnTable
         ref="tableRef"
-        data-key="Customer"
+        data-key="CustomerList"
         url="Clients/filter"
         :create="{
             urlCreate: 'Clients/createWithUser',

src/pages/Customer/components/CustomerAddressEdit.vue

@@ -23,6 +23,7 @@ const incoterms = ref([]);
 const customsAgents = ref([]);
 const observationTypes = ref([]);
 const notes = ref([]);
+let originalNotes = [];
 const deletes = ref([]);
 
 onBeforeMount(() => {
@@ -42,7 +43,8 @@ const getData = async (observations) => {
         });
 
         if (data.length) {
-            notes.value = data
+            originalNotes = data;
+            notes.value = originalNotes
                 .map((observation) => {
                     const type = observationTypes.value.find(
                         (type) => type.id === observation.observationTypeFk
@@ -81,14 +83,24 @@ const deleteNote = (id, index) => {
 };
 
 const onDataSaved = async () => {
-    let payload = {};
+    let payload = {
-    const creates = notes.value.filter((note) => note.$isNew);
+        creates: notes.value.filter((note) => note.$isNew),
-    if (creates.length) {
+        deletes: deletes.value,
-        payload.creates = creates;
+        updates: notes.value
-    }
+            .filter((note) =>
-    if (deletes.value.length) {
+                originalNotes.some(
-        payload.deletes = deletes.value;
+                    (oNote) =>
-    }
+                        oNote.id === note.id &&
+                        (note.description !== oNote.description ||
+                            note.observationTypeFk !== oNote.observationTypeFk)
+                )
+            )
+            .map((note) => ({
+                data: note,
+                where: { id: note.id },
+            })),
+    };
+
     await axios.post('AddressObservations/crud', payload);
     notes.value = [];
     deletes.value = [];

src/pages/Customer/components/CustomerSummaryTable.vue

@@ -194,14 +194,14 @@ const getItemPackagingType = (ticketSales) => {
         redirect="ticket"
     >
         <template #column-nickname="{ row }">
-            <span class="link">
+            <span class="link" @click.stop>
                 {{ row.nickname }}
                 <CustomerDescriptorProxy :id="row.clientFk" />
             </span>
         </template>
 
         <template #column-routeFk="{ row }">
-            <span class="link">
+            <span class="link" @click.stop>
                 {{ row.routeFk }}
                 <RouteDescriptorProxy :id="row.routeFk" />
             </span>
@@ -218,7 +218,7 @@ const getItemPackagingType = (ticketSales) => {
             <span v-else> {{ toCurrency(row.totalWithVat) }}</span>
         </template>
         <template #column-state="{ row }">
-            <span v-if="row.invoiceOut">
+            <span v-if="row.invoiceOut" @click.stop>
                 <span :class="{ link: row.invoiceOut.ref }">
                     {{ row.invoiceOut.ref }}
                     <InvoiceOutDescriptorProxy :id="row.invoiceOut.id" />

src/pages/Entry/EntryStockBought.vue

@@ -99,7 +99,7 @@ const travelDialogRef = ref(false);
 const tableRef = ref();
 const travel = ref(null);
 const userParams = ref({
-    dated: Date.vnNew(),
+    dated: Date.vnNew().toJSON(),
 });
 
 const filter = ref({
@@ -219,6 +219,7 @@ function round(value) {
                 data-key="StockBoughts"
                 url="StockBoughts/getStockBought"
                 save-url="StockBoughts/crud"
+                search-url="StockBoughts"
                 order="reserve DESC"
                 :right-search="false"
                 :is-editable="true"

src/pages/Entry/EntryStockBoughtDetail.vue

@@ -18,7 +18,7 @@ const $props = defineProps({
         required: true,
     },
 });
-const customUrl = `StockBoughts/getStockBoughtDetail?workerFk=${$props.workerFk}&date=${$props.dated}`;
+const customUrl = `StockBoughts/getStockBoughtDetail?workerFk=${$props.workerFk}&dated=${$props.dated}`;
 const columns = [
     {
         align: 'left',

src/pages/Entry/EntryStockBoughtFilter.vue

@@ -27,7 +27,7 @@ onMounted(async () => {
     <VnFilterPanel
         :data-key="props.dataKey"
         :search-button="true"
-        search-url="table"
+        search-url="StockBoughts"
         @set-user-params="setUserParams"
     >
         <template #tags="{ tag, formatFn }">
@@ -36,12 +36,19 @@ onMounted(async () => {
                 <span>{{ formatFn(tag.value) }}</span>
             </div>
         </template>
-        <template #body="{ params }">
+        <template #body="{ params, searchFn }">
             <QItem class="q-my-sm">
                 <QItemSection>
                     <VnInputDate
                         id="date"
                         v-model="params.dated"
+                        @update:model-value="
+                            (value) => {
+                                params.dated = value;
+                                setUserParams(params);
+                                searchFn();
+                            }
+                        "
                         :label="t('Date')"
                         is-outlined
                     />

src/pages/InvoiceIn/InvoiceInList.vue

@@ -122,7 +122,7 @@ const cols = computed(() => [
         :columns="cols"
         :right-search="false"
         :disable-option="{ card: true }"
-        :auto-load="!!$route.query.params"
+        :auto-load="!!$route.query.table"
     >
         <template #column-supplierFk="{ row }">
             <span class="link" @click.stop>

src/pages/InvoiceOut/InvoiceOutList.vue

@@ -182,11 +182,11 @@ watchEffect(selectedRows);
     <VnSearchbar
         :info="t('youCanSearchByInvoiceReference')"
         :label="t('searchInvoice')"
-        data-key="invoiceOut"
+        data-key="invoiceOutList"
     />
     <RightMenu>
         <template #right-panel>
-            <InvoiceOutFilter data-key="invoiceOut" />
+            <InvoiceOutFilter data-key="invoiceOutList" />
         </template>
     </RightMenu>
     <VnSubToolbar>
@@ -203,7 +203,7 @@ watchEffect(selectedRows);
     </VnSubToolbar>
     <VnTable
         ref="tableRef"
-        data-key="invoiceOut"
+        data-key="invoiceOutList"
         :url="`${MODEL}/filter`"
         :create="{
             urlCreate: 'InvoiceOuts/createManualInvoice',

src/pages/Item/ItemFixedPrice.vue

@@ -64,8 +64,7 @@ const columns = computed(() => [
     },
     {
         label: t('globals.name'),
-        field: 'name',
+        name: 'name',
-        name: 'description',
         ...defaultColumnAttrs,
         create: true,
         cardVisible: true,
@@ -426,7 +425,7 @@ function handleOnDataSave({ CrudModelRef }) {
             :default-save="false"
             data-key="ItemFixedPrices"
             url="FixedPrices/filter"
-            :order="['description DESC']"
+            :order="['itemFk DESC', 'name DESC']"
             save-url="FixedPrices/crud"
             :user-params="{ warehouseFk: user.warehouseFk }"
             ref="tableRef"
@@ -480,7 +479,7 @@ function handleOnDataSave({ CrudModelRef }) {
                     </template>
                 </VnSelect>
             </template>
-            <template #column-description="{ row }">
+            <template #column-name="{ row }">
                 <span class="link">
                     {{ row.name }}
                 </span>

src/pages/Item/ItemFixedPriceFilter.vue

@@ -17,21 +17,6 @@ const props = defineProps({
 });
 
 const itemTypeWorkersOptions = ref([]);
-const exprBuilder = (param, value) => {
-    switch (param) {
-        case 'name':
-            return { 'i.name': { like: `%${value}%` } };
-        case 'itemFk':
-        case 'warehouseFk':
-        case 'rate2':
-        case 'rate3':
-            param = `fp.${param}`;
-            return { [param]: value };
-        case 'minPrice':
-            param = `i.${param}`;
-            return { [param]: value };
-    }
-};
 </script>
 
 <template>
@@ -66,7 +51,7 @@ const exprBuilder = (param, value) => {
                         url="Warehouses"
                         auto-load
                         :filter="{ fields: ['id', 'name'], order: 'name ASC', limit: 30 }"
-                        :label="t('components.itemsFilterPanel.warehouseFk')"
+                        :label="t('globals.warehouse')"
                         v-model="params.warehouseFk"
                         option-label="name"
                         option-value="id"

src/pages/Order/OrderList.vue

@@ -1,7 +1,7 @@
 <script setup>
 import axios from 'axios';
 import { useI18n } from 'vue-i18n';
-import { computed, ref } from 'vue';
+import { computed, onMounted, ref } from 'vue';
 import { dashIfEmpty, toCurrency, toDate } from 'src/filters';
 import OrderSummary from 'pages/Order/Card/OrderSummary.vue';
 import { useSummaryDialog } from 'src/composables/useSummaryDialog';
@@ -14,7 +14,6 @@ import OrderFilter from './Card/OrderFilter.vue';
 import CustomerDescriptorProxy from '../Customer/Card/CustomerDescriptorProxy.vue';
 import WorkerDescriptorProxy from '../Worker/Card/WorkerDescriptorProxy.vue';
 import { toDateTimeFormat } from 'src/filters/date';
-import { onMounted } from 'vue';
 import { useRoute } from 'vue-router';
 
 const { t } = useI18n();
@@ -142,8 +141,13 @@ const columns = computed(() => [
         ],
     },
 ]);
-
+onMounted(() => {
-async function fetchClientAddress(id, formData) {
+    if (!route.query.createForm) return;
+    const clientId = route.query.createForm;
+    const id = JSON.parse(clientId);
+    fetchClientAddress(id.clientFk);
+});
+async function fetchClientAddress(id, formData = {}) {
     const { data } = await axios.get(`Clients/${id}`, {
         params: { filter: { include: { relation: 'addresses' } } },
     });
@@ -170,13 +174,6 @@ const getDateColor = (date) => {
     if (comparation == 0) return 'bg-warning';
     if (comparation < 0) return 'bg-success';
 };
-
-onMounted(() => {
-    if (!route.query.createForm) return;
-    const clientId = route.query.createForm;
-    const id = JSON.parse(clientId);
-    fetchClientAddress(id.clientFk, id);
-});
 </script>
 <template>
     <OrderSearchbar />
@@ -194,7 +191,7 @@ onMounted(() => {
             urlCreate: 'Orders/new',
             title: t('module.cerateOrder'),
             onDataSaved: (url) => {
-                tableRef.redirect(url);
+               tableRef.redirect(`${url}/catalog`);
             },
             formInitialData: {
                 active: true,

src/pages/Route/Cmr/CmrList.vue

@@ -116,7 +116,7 @@ function getApiUrl() {
     return new URL(window.location).origin;
 }
 function getCmrUrl(value) {
-    return `${getApiUrl()}/api/Routes/${value}/cmr?access_token=${token}`;
+    return `${getApiUrl()}/api/Cmrs/${value}/print?access_token=${token}`;
 }
 function downloadPdfs() {
     if (!selectedRows.value.length) {
@@ -129,7 +129,7 @@ function downloadPdfs() {
     let cmrs = [];
     for (let value of selectedRows.value) cmrs.push(value.cmrFk);
     // prettier-ignore
-    return window.open(`${getApiUrl()}/api/Routes/downloadCmrsZip?ids=${cmrs.join(',')}&access_token=${token}`);
+    return window.open(`${getApiUrl()}/api/Cmrs/downloadZip?ids=${cmrs.join(',')}&access_token=${token}`);
 }
 </script>
 <template>
@@ -149,7 +149,7 @@ function downloadPdfs() {
     <VnTable
         ref="tableRef"
         data-key="CmrList"
-        url="Routes/cmrs"
+        url="Cmrs/filter"
         :columns="columns"
         :right-search="true"
         default-mode="table"

src/pages/Ticket/Card/BasicData/TicketBasicDataForm.vue

@@ -16,12 +16,9 @@ import { useAcl } from 'src/composables/useAcl';
 import { useValidator } from 'src/composables/useValidator';
 import { toTimeFormat } from 'filters/date.js';
 
-const $props = defineProps({
+const formData = defineModel({
-    formData: {
+    type: Object,
-        type: Object,
+    required: true,
-        required: true,
-        default: () => ({}),
-    },
 });
 
 const emit = defineEmits(['updateForm']);
@@ -40,7 +37,6 @@ const agenciesOptions = ref([]);
 const zonesOptions = ref([]);
 const addresses = ref([]);
 const zoneSelectRef = ref();
-const formData = ref($props.formData);
 
 watch(
     () => formData.value,
@@ -69,47 +65,28 @@ const zoneWhere = computed(() => {
         : {};
 });
 
-const getLanded = async (params) => {
+async function getLanded(params) {
-    try {
+    getDate(`Agencies/getLanded`, params);
-        const validParams =
+}
-            shipped.value && addressId.value && agencyModeId.value && warehouseId.value;
-        if (!validParams) return;
 
-        formData.value.zoneFk = null;
+async function getShipped(params) {
-        zonesOptions.value = [];
+    getDate(`Agencies/getShipped`, params);
-        const { data } = await axios.get(`Agencies/getLanded`, { params });
+}
-        if (data) {
+
-            formData.value.zoneFk = data.zoneFk;
+async function getDate(query, params) {
-            formData.value.landed = data.landed;
+    for (const param in params) {
-            formData.value.shipped = params.shipped;
+        if (!params[param]) return;
-        }
-    } catch (error) {
-        console.error(error);
-        notify(t('basicData.noDeliveryZoneAvailable'), 'negative');
     }
-};
 
-const getShipped = async (params) => {
+    formData.value.zoneFk = null;
-    try {
+    zonesOptions.value = [];
-        const validParams =
+    const { data } = await axios.get(query, { params });
-            landed.value && addressId.value && agencyModeId.value && warehouseId.value;
+    if (!data) return notify(t('basicData.noDeliveryZoneAvailable'), 'negative');
-        if (!validParams) return;
 
-        formData.value.zoneFk = null;
+    formData.value.zoneFk = data.zoneFk;
-        zonesOptions.value = [];
+    if (data.landed) formData.value.landed = data.landed;
-        const { data } = await axios.get(`Agencies/getShipped`, { params });
+    if (data.shipped) formData.value.shipped = data.shipped;
-        if (data) {
+}
-            formData.value.zoneFk = data.zoneFk;
-            formData.value.landed = params.landed;
-            formData.value.shipped = data.shipped;
-        } else {
-            notify(t('basicData.noDeliveryZoneAvailable'), 'negative');
-        }
-    } catch (error) {
-        console.error(error);
-        notify(t('basicData.noDeliveryZoneAvailable'), 'negative');
-    }
-};
 
 const onChangeZone = async (zoneId) => {
     formData.value.agencyModeFk = null;
@@ -177,18 +154,26 @@ const clientId = computed({
     },
 });
 
-const landed = computed({
+function addDateParams(obj) {
-    get: () => formData.value?.landed,
+    return {
-    set: (val) => {
+        ...obj,
-        formData.value.landed = val;
+        ...{
-        getShipped({
-            landed: val,
             addressFk: formData.value?.addressFk,
             agencyModeFk: formData.value?.agencyModeFk,
             warehouseFk: formData.value?.warehouseFk,
-        });
+        },
-    },
+    };
-});
+}
+
+async function setLanded(landed) {
+    if (!landed) return;
+    getShipped(addDateParams({ landed }));
+}
+
+async function setShipped(shipped) {
+    if (!shipped) return;
+    getLanded(addDateParams({ shipped }));
+}
 
 const agencyModeId = computed({
     get: () => formData.value.agencyModeFk,
@@ -236,21 +221,6 @@ const warehouseId = computed({
     },
 });
 
-const shipped = computed({
-    get: () => formData.value?.shipped,
-    set: (val) => {
-        if (new Date(formData.value?.shipped).toDateString() != val.toDateString())
-            val.setHours(0, 0, 0, 0);
-        formData.value.shipped = val;
-        getLanded({
-            shipped: val,
-            addressFk: formData.value?.addressFk,
-            agencyModeFk: formData.value?.agencyModeFk,
-            warehouseFk: formData.value?.warehouseFk,
-        });
-    },
-});
-
 const onFormModelInit = () => {
     if (formData.value?.clientFk) clientAddressesList(formData.value?.clientFk);
 };
@@ -451,18 +421,21 @@ async function getZone(options) {
                 v-model="formData.shipped"
                 :required="true"
                 :rules="validate('ticketList.shipped')"
+                @update:model-value="setShipped"
             />
             <VnInputTime
                 :label="t('basicData.shippedHour')"
                 v-model="formData.shipped"
                 :required="true"
                 :rules="validate('basicData.shippedHour')"
+                @update:model-value="setShipped"
             />
             <VnInputDate
                 :label="t('basicData.landed')"
                 v-model="formData.landed"
                 :required="true"
                 :rules="validate('basicData.landed')"
+                @update:model-value="setLanded"
             />
         </VnRow>
     </QForm>

src/pages/Ticket/Card/BasicData/TicketBasicDataView.vue

@@ -158,7 +158,7 @@ onBeforeMount(async () => await getTicketData());
             <TicketBasicDataForm
                 v-if="initialDataLoaded"
                 @update-form="($event) => (formData = $event)"
-                :form-data="formData"
+                v-model="formData"
             />
         </QStep>
         <QStep :name="2" :title="t('basicData.priceDifference')">

src/pages/Ticket/Card/TicketDescriptorMenu.vue

@@ -1,9 +1,9 @@
 <script setup>
 import axios from 'axios';
-import { ref, toRefs } from 'vue';
+import { computed, ref, toRefs } from 'vue';
 import { useQuasar } from 'quasar';
 import { useI18n } from 'vue-i18n';
-import { useRoute, useRouter } from 'vue-router';
+import { useRouter } from 'vue-router';
 import { usePrintService } from 'composables/usePrintService';
 import SendEmailDialog from 'components/common/SendEmailDialog.vue';
 import VnConfirm from 'components/ui/VnConfirm.vue';
@@ -23,7 +23,6 @@ const props = defineProps({
         required: true,
     },
 });
-const route = useRoute();
 
 const { push, currentRoute } = useRouter();
 const { dialog, notify } = useQuasar();
@@ -31,7 +30,7 @@ const { t } = useI18n();
 const { openReport, sendEmail } = usePrintService();
 const ticketSummary = useArrayData('TicketSummary');
 const { ticket } = toRefs(props);
-const ticketId = currentRoute.value.params.id;
+const ticketId = computed(() => props.ticket.id ?? currentRoute.value.params.id);
 const client = ref();
 const showTransferDialog = ref(false);
 const showTurnDialog = ref(false);
@@ -68,7 +67,7 @@ const actions = {
     setWeight: async () => {
         try {
             const invoiceIds = (
-                await axios.post(`Tickets/${ticketId}/setWeight`, {
+                await axios.post(`Tickets/${ticketId.value}/setWeight`, {
                     weight: weight.value,
                 })
             ).data;
@@ -86,7 +85,7 @@ const actions = {
     },
     remove: async () => {
         try {
-            await axios.post(`Tickets/${ticketId}/setDeleted`);
+            await axios.post(`Tickets/${ticketId.value}/setDeleted`);
 
             notify({ message: t('Ticket deleted'), type: 'positive' });
             notify({
@@ -176,14 +175,14 @@ function showSmsDialog(template, customData) {
 }
 
 async function showSmsDialogWithChanges() {
-    const query = `TicketLogs/${ticketId}/getChanges`;
+    const query = `TicketLogs/${ticketId.value}/getChanges`;
     const response = await axios.get(query);
 
     showSmsDialog('orderChanges', { changes: response.data });
 }
 
 async function sendSms(body) {
-    await axios.post(`Tickets/${ticketId}/sendSms`, body);
+    await axios.post(`Tickets/${ticketId.value}/sendSms`, body);
     notify({
         message: 'Notification sent',
         type: 'positive',
@@ -256,7 +255,10 @@ async function transferClient(client) {
         clientFk: client,
     };
 
-    const { data } = await axios.patch(`Tickets/${ticketId}/transferClient`, params);
+    const { data } = await axios.patch(
+        `Tickets/${ticketId.value}/transferClient`,
+        params
+    );
 
     if (data) window.location.reload();
 }
@@ -296,7 +298,10 @@ async function changeShippedHour(time) {
         shipped: time,
     };
 
-    const { data } = await axios.post(`Tickets/${ticketId}/updateEditableTicket`, params);
+    const { data } = await axios.post(
+        `Tickets/${ticketId.value}/updateEditableTicket`,
+        params
+    );
 
     if (data) window.location.reload();
 }
@@ -313,7 +318,7 @@ function openRecalculateDialog() {
 }
 
 async function recalculateComponents() {
-    await axios.post(`Tickets/${ticketId}/recalculateComponents`);
+    await axios.post(`Tickets/${ticketId.value}/recalculateComponents`);
     notify({
         message: t('Data saved'),
         type: 'positive',
@@ -336,11 +341,11 @@ async function handleInvoiceOutData() {
 }
 
 async function docuwareDownload() {
-    await axios.get(`Tickets/${ticketId}/docuwareDownload`);
+    await axios.get(`Tickets/${ticketId.value}/docuwareDownload`);
 }
 
 async function hasDocuware() {
-    const { data } = await axios.post(`Docuwares/${ticketId}/checkFile`, {
+    const { data } = await axios.post(`Docuwares/${ticketId.value}/checkFile`, {
         fileCabinet: 'deliveryNote',
         signed: true,
     });
@@ -371,11 +376,7 @@ async function uploadDocuware(force) {
 </script>
 <template>
     <FetchData
-        :url="
+        :url="`Tickets/${ticketId}/isEditable`"
-            route.path.startsWith('/ticket')
-                ? `Tickets/${ticketId}/isEditable`
-                : `Tickets/${ticket}/isEditable`
-        "
         auto-load
         @on-fetch="handleFetchData"
     />
@@ -396,8 +397,6 @@ async function uploadDocuware(force) {
                 <VnSelect
                     url="Clients"
                     :fields="['id', 'name']"
-                    option-label="name"
-                    option-value="id"
                     v-model="client"
                     :label="t('Client')"
                     auto-load

src/pages/Ticket/Card/TicketPurchaseRequest.vue

@@ -268,6 +268,7 @@ onMounted(() => (stateStore.rightDrawer = false));
                 :label="t('basicData.price')"
                 type="number"
                 min="0"
+                step="any"
             />
         </template>
     </VnTable>

src/pages/Ticket/Card/TicketSummary.vue

@@ -20,6 +20,7 @@ import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
 import ZoneDescriptorProxy from 'src/pages/Zone/Card/ZoneDescriptorProxy.vue';
 import VnSelect from 'src/components/common/VnSelect.vue';
 import VnToSummary from 'src/components/ui/VnToSummary.vue';
+import TicketDescriptorMenu from './TicketDescriptorMenu.vue';
 
 const route = useRoute();
 const { notify } = useNotify();
@@ -116,24 +117,36 @@ function toTicketUrl(section) {
                 {{ entity.nickname }}
             </div>
         </template>
-        <template #header-right>
+        <template #header-right="{ entity }">
-            <QBtnDropdown
+            <div>
-                ref="stateBtnDropdownRef"
+                <QBtnDropdown
-                color="black"
+                    ref="stateBtnDropdownRef"
-                text-color="white"
+                    color="black"
-                :label="t('globals.changeState')"
+                    text-color="white"
-                :disable="!isEditable()"
+                    :label="t('globals.changeState')"
-            >
+                    :disable="!isEditable()"
-                <VnSelect
+                >
-                    :options="editableStates"
+                    <VnSelect
-                    hide-selected
+                        :options="editableStates"
-                    option-label="name"
+                        hide-selected
-                    option-value="code"
+                        option-label="name"
-                    hide-dropdown-icon
+                        option-value="code"
-                    focus-on-mount
+                        hide-dropdown-icon
-                    @update:model-value="changeState"
+                        focus-on-mount
-                />
+                        @update:model-value="changeState"
-            </QBtnDropdown>
+                    />
+                </QBtnDropdown>
+                <QBtn color="white" dense flat icon="more_vert" round size="md">
+                    <QTooltip>
+                        {{ t('components.cardDescriptor.moreOptions') }}
+                    </QTooltip>
+                    <QMenu>
+                        <QList>
+                            <TicketDescriptorMenu :ticket="entity" />
+                        </QList>
+                    </QMenu>
+                </QBtn>
+            </div>
         </template>
         <template #body="{ entity }">
             <QCard class="vn-one">

src/pages/Ticket/TicketFilter.vue

@@ -47,7 +47,7 @@ const getGroupedStates = (data) => {
     />
     <FetchData url="AgencyModes" @on-fetch="(data) => (agencies = data)" auto-load />
     <FetchData url="Warehouses" @on-fetch="(data) => (warehouses = data)" auto-load />
-    <VnFilterPanel :data-key="props.dataKey" :search-button="true" search-url="table">
+    <VnFilterPanel :data-key="props.dataKey" :search-button="true">
         <template #tags="{ tag, formatFn }">
             <div class="q-gutter-x-xs">
                 <strong>{{ t(`params.${tag.label}`) }}: </strong>

src/pages/Ticket/TicketList.vue

@@ -1,7 +1,7 @@
 <script setup>
 import axios from 'axios';
 import { computed, ref, onMounted } from 'vue';
-import { useRoute } from 'vue-router';
+import { useRoute, useRouter } from 'vue-router';
 import { useStateStore } from 'stores/useStateStore';
 import { useI18n } from 'vue-i18n';
 import { useQuasar } from 'quasar';
@@ -18,12 +18,13 @@ import RightMenu from 'src/components/common/RightMenu.vue';
 import TicketFilter from './TicketFilter.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 import FetchData from 'src/components/FetchData.vue';
-import CustomerDescriptorProxy from '../Customer/Card/CustomerDescriptorProxy.vue';
+import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
-import ZoneDescriptorProxy from '../Zone/Card/ZoneDescriptorProxy.vue';
+import ZoneDescriptorProxy from 'src/pages/Zone/Card/ZoneDescriptorProxy.vue';
 import { toTimeFormat } from 'src/filters/date';
-import InvoiceOutDescriptorProxy from '../InvoiceOut/Card/InvoiceOutDescriptorProxy.vue';
+import InvoiceOutDescriptorProxy from 'src/pages/InvoiceOut/Card/InvoiceOutDescriptorProxy.vue';
 
 const route = useRoute();
+const router = useRouter();
 const { t } = useI18n();
 const { viewSummary } = useSummaryDialog();
 const tableRef = ref();
@@ -40,16 +41,18 @@ from.setDate(from.getDate() - 7);
 const to = Date.vnNew();
 to.setHours(23, 59, 0, 0);
 to.setDate(to.getDate() + 1);
-
 const userParams = {
     from: null,
     to: null,
 };
-// Método para inicializar las variables desde la query string
+onMounted(() => {
+    initializeFromQuery();
+    stateStore.rightDrawer = true;
+    if (!route.query.createForm) return;
+    onClientSelected(JSON.parse(route.query.createForm));
+});
 const initializeFromQuery = () => {
     const query = route.query.table ? JSON.parse(route.query.table) : {};
-
-    // Asigna los valores a las variables correspondientes
     from.value = query.from || from.toISOString();
     to.value = query.to || to.toISOString();
     Object.assign(userParams, { from, to });
@@ -206,13 +209,19 @@ const columns = computed(() => [
             {
                 title: t('components.smartCard.viewSummary'),
                 icon: 'preview',
-                isPrimary: true,
+                action: (row, evt) => {
-                action: (row) => viewSummary(row.id, TicketSummary),
+                    if (evt && evt.ctrlKey) {
+                        const url = router.resolve({
+                            params: { id: row.id },
+                            name: 'TicketCard',
+                        }).href;
+                        window.open(url, '_blank');
+                    } else viewSummary(row.id, TicketSummary);
+                },
             },
         ],
     },
 ]);
-
 function redirectToLines(id) {
     const url = `#/ticket/${id}/sale`;
     window.open(url, '_blank');
@@ -301,11 +310,6 @@ const getDateColor = (date) => {
     if (comparation < 0) return 'bg-success';
 };
 
-onMounted(() => {
-    initializeFromQuery();
-    stateStore.rightDrawer = true;
-});
-
 async function makeInvoice(ticket) {
     const ticketsIds = ticket.map((item) => item.id);
     const { data } = await axios.post(`Tickets/invoiceTicketsAndPdf`, { ticketsIds });
@@ -454,24 +458,24 @@ function setReference(data) {
         auto-load
     />
     <VnSearchbar
-        data-key="Ticket"
+        data-key="TicketList"
         :label="t('Search ticket')"
         :info="t('You can search by ticket id or alias')"
     />
     <RightMenu>
         <template #right-panel>
-            <TicketFilter data-key="Ticket" />
+            <TicketFilter data-key="TicketList" />
         </template>
     </RightMenu>
     <VnTable
         ref="tableRef"
-        data-key="Ticket"
+        data-key="TicketList"
         url="Tickets/filter"
         :create="{
             urlCreate: 'Tickets/new',
             title: t('ticketList.createTicket'),
             onDataSaved: ({ id }) => tableRef.redirect(id),
-            formInitialData: {},
+            formInitialData: { clientId: null },
         }"
         default-mode="table"
         :order="['shippedDate DESC', 'shippedHour ASC', 'zoneLanding ASC', 'id']"
@@ -573,17 +577,17 @@ function setReference(data) {
             </span>
         </template>
         <template #column-stateFk="{ row }">
-            <span v-if="getColor(row)">
+            <span v-if="row.refFk">
-                <QChip :class="getColor(row)" dense square>
-                    {{ row.state }}
-                </QChip>
-            </span>
-            <span v-else-if="row.state === 'Entregado'">
                 <span class="link" @click.stop>
                     {{ row.refFk }}
                     <InvoiceOutDescriptorProxy :id="row.invoiceOutId" />
                 </span>
             </span>
+            <span v-else-if="getColor(row)">
+                <QChip :class="getColor(row)" dense square>
+                    {{ row.state }}
+                </QChip>
+            </span>
             <span v-else>
                 {{ row.state }}
             </span>
@@ -615,6 +619,7 @@ function setReference(data) {
                     option-value="id"
                     option-label="name"
                     hide-selected
+                    required
                     @update:model-value="(client) => onClientSelected(data)"
                     :sort-by="'id ASC'"
                 >
@@ -641,6 +646,7 @@ function setReference(data) {
                     option-label="nickname"
                     hide-selected
                     map-options
+                    required
                     :disable="!data.clientId"
                     :sort-by="'isActive DESC'"
                     @update:model-value="() => fetchAvailableAgencies(data)"
@@ -691,6 +697,7 @@ function setReference(data) {
                         option-value="id"
                         option-label="name"
                         hide-selected
+                        required
                         @update:model-value="() => fetchAvailableAgencies(data)"
                     />
                 </div>
@@ -704,7 +711,6 @@ function setReference(data) {
                         option-value="agencyModeFk"
                         option-label="agencyMode"
                         hide-selected
-                        :disable="!data.clientId || !data.landed || !data.warehouseId"
                     />
                 </div>
             </VnRow>
@@ -840,7 +846,14 @@ function setReference(data) {
         </QTooltip>
     </QPageSticky>
 </template>
-
+<style scoped>
+.disabled,
+.disabled *,
+[disabled],
+[disabled] * {
+    cursor: pointer !important;
+}
+</style>
 <i18n>
 es:
     Search ticket: Buscar ticket

src/pages/Travel/Card/TravelThermographs.vue

@@ -19,7 +19,7 @@ const router = useRouter();
 const { t } = useI18n();
 const { notify } = useNotify();
 
-const thermographPaginateRef = ref(null);
+const thermographPaginateRef = ref();
 const warehouses = ref([]);
 
 const thermographFilter = {
@@ -145,7 +145,6 @@ const removeThermograph = async (id) => {
         data-key="TravelThermographs"
         url="TravelThermographs"
         :filter="thermographFilter"
-        :params="{ travelFk: id }"
         auto-load
     >
         <template #body="{ rows }">

src/pages/Travel/Card/TravelThermographsForm.vue

@@ -205,6 +205,7 @@ const onThermographCreated = async (data) => {
                         }"
                         sort-by="thermographFk ASC"
                         option-label="thermographFk"
+                        option-filter-value="thermographFk"
                         :disable="viewAction === 'edit'"
                         :tooltip="t('New thermograph')"
                         :roles-allowed-to-create="['logistic']"

src/pages/Travel/TravelFilter.vue

@@ -24,7 +24,7 @@ defineExpose({ states });
 
 <template>
     <FetchData url="warehouses" @on-fetch="(data) => (states = data)" auto-load />
-    <VnFilterPanel :data-key="props.dataKey" :search-button="true" search-url="table">
+    <VnFilterPanel :data-key="props.dataKey" :search-button="true">
         <template #tags="{ tag, formatFn }">
             <div class="q-gutter-x-xs">
                 <strong>{{ t(`params.${tag.label}`) }}: </strong>

src/pages/Worker/Card/WorkerCard.vue

@@ -14,6 +14,7 @@ import WorkerFilter from '../WorkerFilter.vue';
             url: 'Workers/filter',
             label: 'Search worker',
             info: 'You can search by worker id or name',
+            order: 'id DESC',
         }"
         :redirect-on-error="true"
     />

src/pages/Worker/Card/WorkerNotificationsManager.vue

@@ -70,7 +70,7 @@ function setNotifications(data) {
         :default-reset="false"
         :default-remove="false"
         :default-save="false"
-        @on-fetch="setNotifications"
+        @on-fetch="(data) => data && setNotifications(data)"
         search-url="notifications"
     >
         <template #body>

src/pages/Zone/Card/ZoneCard.vue

@@ -20,12 +20,13 @@ function notIsLocations(ifIsFalse, ifIsTrue) {
 <template>
     <VnCard
         data-key="zone"
-        base-url="Zones"
+        :base-url="notIsLocations('Zones', undefined)"
         :descriptor="ZoneDescriptor"
-        :filter-panel="ZoneFilterPanel"
+        :filter-panel="notIsLocations(ZoneFilterPanel, undefined)"
-        :search-data-key="notIsLocations('ZoneList', 'ZoneLocations')"
+        :search-data-key="notIsLocations('ZoneList', undefined)"
+        :custom-url="`Zones/${route.params?.id}/getLeaves`"
         :searchbar-props="{
-            url: 'Zones',
+            url: notIsLocations('Zones', 'ZoneLocations'),
             label: notIsLocations(t('list.searchZone'), t('list.searchLocation')),
             info: t('list.searchInfo'),
             whereFilter: notIsLocations((value) => {

src/pages/Zone/Card/ZoneLocationsTree.vue

@@ -5,6 +5,7 @@ import VnInput from 'src/components/common/VnInput.vue';
 import { useState } from 'src/composables/useState';
 import axios from 'axios';
 import { useArrayData } from 'composables/useArrayData';
+import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
 
 const props = defineProps({
     rootLabel: {
@@ -33,22 +34,23 @@ const state = useState();
 const treeRef = ref();
 const expanded = ref([]);
 
-const arrayData = useArrayData('ZoneLocations', {
+const datakey = 'ZoneLocations';
-    url: `Zones/${route.params.id}/getLeaves`,
+const url = computed(() => `Zones/${route.params.id}/getLeaves`);
+const arrayData = useArrayData(datakey, {
+    url: url.value,
 });
 const { store } = arrayData;
 const storeData = computed(() => store.data);
 
-const nodes = ref([
+const defaultNode = {
-    {
+    id: null,
-        id: null,
+    name: props.rootLabel,
-        name: props.rootLabel,
+    sons: true,
-        sons: true,
+    tickable: false,
-        tickable: false,
+    noTick: true,
-        noTick: true,
+    children: [{}],
-        children: [{}],
+};
-    },
+const nodes = ref([defaultNode]);
-]);
 
 const _tickedNodes = computed({
     get: () => props.tickedNodes,
@@ -128,6 +130,7 @@ function getNodeIds(node) {
 
 watch(storeData, async (val) => {
     // Se triggerea cuando se actualiza el store.data, el cual es el resultado del fetch de la searchbar
+    if (!nodes.value[0]) nodes.value = [defaultNode];
     nodes.value[0].childs = [...val];
     const fetchedNodeKeys = val.flatMap(getNodeIds);
     state.set('Tree', [...fetchedNodeKeys]);
@@ -193,6 +196,7 @@ onUnmounted(() => {
             <QBtn color="primary" icon="search" dense flat @click="reFetch()" />
         </template>
     </VnInput>
+    <VnSearchbar :data-key="datakey" :url="url" :redirect="false" />
     <QTree
         ref="treeRef"
         :nodes="nodes"

src/pages/Zone/Card/ZoneSearchbar.vue

@@ -26,7 +26,7 @@ const exprBuilder = (param, value) => {
 
 <template>
     <VnSearchbar
-        data-key="Zones"
+        data-key="ZonesList"
         url="Zones"
         :filter="{
             include: { relation: 'agencyMode', scope: { fields: ['name'] } },

src/pages/Zone/ZoneDeliveryPanel.vue

@@ -105,11 +105,14 @@ watch(
                 <template #option="{ itemProps, opt }">
                     <QItem v-bind="itemProps">
                         <QItemSection v-if="opt.code">
-                            <QItemLabel>{{ opt.code }}</QItemLabel>
+                            <QItemLabel>
-                            <QItemLabel caption
+                                {{ `${opt.code}, ${opt.town?.name}` }}
-                                >{{ opt.town?.province?.name }},
+                            </QItemLabel>
-                                {{ opt.town?.province?.country?.name }}</QItemLabel
+                            <QItemLabel caption>
-                            >
+                                {{
+                                    `${opt.town?.province?.name}, ${opt.town?.province?.country?.name}`
+                                }}
+                            </QItemLabel>
                         </QItemSection>
                     </QItem>
                 </template>

src/pages/Zone/ZoneFilterPanel.vue

@@ -22,12 +22,16 @@ const agencies = ref([]);
 </script>
 
 <template>
-    <FetchData url="agencies" @on-fetch="(data) => (agencies = data)" auto-load />
+    <FetchData
+        url="AgencyModes"
+        :filter="{ fields: ['id', 'name'] }"
+        @on-fetch="(data) => (agencies = data)"
+        auto-load
+    />
     <VnFilterPanel
         :data-key="props.dataKey"
         :search-button="true"
         :hidden-tags="['search']"
-        search-url="table"
     >
         <template #tags="{ tag }">
             <div class="q-gutter-x-xs">

src/pages/Zone/ZoneList.vue

@@ -73,6 +73,7 @@ const columns = computed(() => [
             inWhere: true,
             attrs: {
                 url: 'AgencyModes',
+                fields: ['id', 'name'],
             },
         },
         columnField: {
@@ -138,12 +139,12 @@ onMounted(() => (stateStore.rightDrawer = true));
     <ZoneSearchbar />
     <RightMenu>
         <template #right-panel>
-            <ZoneFilterPanel data-key="Zones" />
+            <ZoneFilterPanel data-key="ZonesList" />
         </template>
     </RightMenu>
     <VnTable
         ref="tableRef"
-        data-key="Zones"
+        data-key="ZonesList"
         url="Zones"
         :create="{
             urlCreate: 'Zones',

src/router/index.js

@@ -14,8 +14,8 @@ import { useUserConfig } from 'src/composables/useUserConfig';
 import { useTokenConfig } from 'src/composables/useTokenConfig';
 import { useAcl } from 'src/composables/useAcl';
 
-let state, session;
+const state = useState();
-
+const session = useSession();
 const { t, te } = i18n.global;
 
 const createHistory = process.env.SERVER
@@ -43,10 +43,8 @@ const Router = createRouter({
  * with the Router instance.
  */
 export { Router };
-export default route((/* { store, ssrContext } */) => {
+export default route(function (/* { store, ssrContext } */) {
     Router.beforeEach(async (to, from, next) => {
-        state = useState();
-        session = useSession();
         const { isLoggedIn } = session;
         const outLayout = Router.options.routes[0].children.map((r) => r.name);
         if (!isLoggedIn() && !outLayout.includes(to.name)) {

src/stores/useArrayDataStore.js

@@ -8,7 +8,7 @@ export const useArrayDataStore = defineStore('arrayDataStore', () => {
         userFilter: {},
         userParams: {},
         url: '',
-        limit: 10,
+        limit: 20,
         skip: 0,
         order: '',
         isLoading: false,

test/vitest/__tests__/boot/axios.spec.js

@@ -1,38 +1,23 @@
-import { describe, it, expect, beforeEach, vi } from 'vitest';
+import { Notify } from 'quasar';
-import { setupAxios, onRequest, onResponseError } from 'src/boot/axios';
+import { onRequest, onResponseError } from 'src/boot/axios';
-import { useSession } from 'src/composables/useSession';
+import { describe, expect, it, vi } from 'vitest';
-import useNotify from 'src/composables/useNotify';
-import { useStateQueryStore } from 'src/stores/useStateQueryStore';
 
-vi.mock('src/composables/useSession');
+vi.mock('src/composables/useSession', () => ({
-vi.mock('src/composables/useNotify');
+    useSession: () => ({
-vi.mock('src/stores/useStateQueryStore');
+        getToken: () => 'DEFAULT_TOKEN',
+        isLoggedIn: () => vi.fn(),
+        destroy: () => vi.fn(),
+    }),
+}));
+
+vi.mock('src/stores/useStateQueryStore', () => ({
+    useStateQueryStore: () => ({
+        add: () => vi.fn(),
+        remove: () => vi.fn(),
+    }),
+}));
 
 describe('Axios boot', () => {
-    let sessionMock, notifyMock, stateQueryMock;
-
-    beforeEach(() => {
-        sessionMock = {
-            getToken: vi.fn().mockReturnValue('DEFAULT_TOKEN'),
-            isLoggedIn: vi.fn().mockReturnValue(true),
-            destroy: vi.fn(),
-        };
-
-        notifyMock = {
-            notify: vi.fn(),
-        };
-
-        stateQueryMock = {
-            add: vi.fn(),
-            remove: vi.fn(),
-        };
-
-        useSession.mockReturnValue(sessionMock);
-        useNotify.mockReturnValue(notifyMock);
-        useStateQueryStore.mockReturnValue(stateQueryMock);
-
-        setupAxios();
-    });
     describe('onRequest()', async () => {
         it('should set the "Authorization" property on the headers', async () => {
             const config = { headers: {} };

test/vitest/__tests__/composables/useArrayData.spec.js

@@ -5,7 +5,7 @@ import { useRouter } from 'vue-router';
 import * as vueRouter from 'vue-router';
 
 describe('useArrayData', () => {
-    const filter = '{"limit":10,"skip":0}';
+    const filter = '{"limit":20,"skip":0}';
     const params = { supplierFk: 2 };
     beforeEach(() => {
         vi.spyOn(useRouter(), 'replace');