feat: #6943 Define new props to handle params in URL

src/components/VnTable/VnTable.vue

@@ -69,7 +69,10 @@ const $props = defineProps({
         type: Boolean,
         default: false,
     },
-
+    appendParams: {
+        type: Boolean,
+        default: true,
+    },
     hasSubToolbar: {
         type: Boolean,
         default: null,
@@ -316,6 +319,15 @@ function handleOnDataSaved(_) {
     if (_.onDataSaved) _.onDataSaved({ CrudModelRef: CrudModelRef.value });
     else $props.create.onDataSaved(_);
 }
+function handleClick(event, btn, row) {
+    if (event.ctrlKey) {
+        event.preventDefault();
+        event.stopPropagation();
+        btn.action(row, event);
+    } else {
+        btn.action(row);
+    }
+}
 </script>
 <template>
     <QDrawer
@@ -537,7 +549,7 @@ function handleOnDataSaved(_) {
                             :style="`visibility: ${
                                 (btn.show && btn.show(row)) ?? true ? 'visible' : 'hidden'
                             }`"
-                            @click="btn.action(row)"
+                            @click="handleClick($event, btn, row)"
                         />
                     </QTd>
                 </template>

src/components/common/VnInput.vue

@@ -2,6 +2,7 @@
 import { computed, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useValidator } from 'src/composables/useValidator';
+import { useAttrs } from 'vue';
 
 const emit = defineEmits([
     'update:modelValue',
@@ -29,10 +30,11 @@ const $props = defineProps({
     },
 });
 const { validations } = useValidator();
+const $attrs = useAttrs();
 
 const { t } = useI18n();
-const requiredFieldRule = (val) => validations().required($attrs.required, val);
-
+const requiredFieldRule = (val) => validations().required(isRequired.value, val);
+const isRequired = computed(() => Object.keys($attrs).includes('required'));
 const vnInputRef = ref(null);
 const value = computed({
     get() {
@@ -57,12 +59,6 @@ const focus = () => {
     vnInputRef.value.focus();
 };
 
-defineExpose({
-    focus,
-});
-import { useAttrs } from 'vue';
-const $attrs = useAttrs();
-
 const mixinRules = [
     requiredFieldRule,
     ...($attrs.rules ?? []),
@@ -76,6 +72,9 @@ const mixinRules = [
         }
     },
 ];
+defineExpose({
+    focus,
+});
 </script>
 
 <template>
@@ -85,7 +84,7 @@ const mixinRules = [
             v-model="value"
             v-bind="{ ...$attrs, ...styleAttrs }"
             :type="$attrs.type"
-            :class="{ required: $attrs.required }"
+            :class="{ required: isRequired }"
             @keyup.enter="emit('keyup.enter')"
             :clearable="false"
             :rules="mixinRules"

src/components/common/VnInputNumber.vue

@@ -1,8 +1,13 @@
 <script setup>
 import VnInput from 'src/components/common/VnInput.vue';
+import { ref } from 'vue';
+import { useAttrs } from 'vue';
+
 const model = defineModel({ type: [Number, String] });
+const $attrs = useAttrs();
+const step = ref($attrs.step || 0.01);
 </script>
 
 <template>
-    <VnInput v-bind="$attrs" v-model.number="model" type="number" />
+    <VnInput v-bind="$attrs" v-model.number="model" type="number" :step="step" />
 </template>

src/components/common/VnLocation.vue

@@ -2,16 +2,24 @@
 import CreateNewPostcode from 'src/components/CreateNewPostcodeForm.vue';
 import VnSelectDialog from 'components/common/VnSelectDialog.vue';
 import { useI18n } from 'vue-i18n';
-import { ref } from 'vue';
+import { computed, ref } from 'vue';
 const { t } = useI18n();
 const emit = defineEmits(['update:model-value', 'update:options']);
+const { validations } = useValidator();
 
+import { useAttrs } from 'vue';
+import { useValidator } from 'src/composables/useValidator';
+const $attrs = useAttrs();
 const props = defineProps({
     location: {
         type: Object,
         default: null,
     },
 });
+const isRequired = computed(() => Object.keys($attrs).includes('required'));
+const requiredFieldRule = (val) => validations().required(isRequired.value, val);
+
+const mixinRules = [requiredFieldRule];
 const formatLocation = (obj, properties) => {
     const parts = properties.map((prop) => {
         if (typeof prop === 'string') {
@@ -68,10 +76,12 @@ function showLabel(data) {
         :label="t('Location')"
         :placeholder="t('search_by_postalcode')"
         :input-debounce="300"
-        :class="{ required: $attrs.required }"
+        :class="{ required: isRequired }"
         v-bind="$attrs"
         clearable
         :emit-value="false"
+        :rules="mixinRules"
+        :lazy-rules="true"
     >
         <template #form>
             <CreateNewPostcode

src/components/common/VnTitle.vue

@@ -8,7 +8,7 @@ defineProps({
 <template>
     <div :class="$q.screen.gt.md ? 'q-pb-lg' : 'q-pb-md'">
         <div class="header-link" :style="{ cursor: url ? 'pointer' : 'default' }">
-            <a :href="url" :class="url ? 'link' : 'color-vn-text'">
+            <a :href="url" :class="url ? 'link' : 'color-vn-text'" v-bind="$attrs">
                 {{ text }}
                 <QIcon v-if="url" :name="icon" />
             </a>

src/components/ui/CardSummary.vue

@@ -118,6 +118,7 @@ function existSummary(routes) {
 
 .cardSummary {
     width: 100%;
+    max-height: 70vh;
     .summaryHeader {
         text-align: center;
         font-size: 20px;

src/components/ui/VnFilterPanel.vue

@@ -219,7 +219,7 @@ function aliasField(field) {
         icon="search"
         @click="search()"
     ></QBtn>
-    <QForm @submit="search" id="filterPanelForm">
+    <QForm @submit="search" id="filterPanelForm" @keyup.enter="search()">
         <QList dense>
             <QItem class="q-mt-xs">
                 <QItemSection top>

src/components/ui/VnLinkMail.vue

@@ -0,0 +1,16 @@
+<script setup>
+defineProps({ email: { type: [String], default: null } });
+</script>
+<template>
+    <QBtn
+        v-if="email"
+        flat
+        round
+        icon="email"
+        size="sm"
+        color="primary"
+        padding="none"
+        :href="`mailto:${email}`"
+        @click.stop
+    />
+</template>

src/composables/useArrayData.js

@@ -248,7 +248,8 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
 
     function updateStateParams() {
         const newUrl = { path: route.path, query: { ...(route.query ?? {}) } };
-        newUrl.query[store.searchUrl] = JSON.stringify(store.currentFilter);
+        if (store.appendParams)
+            newUrl.query[store.searchUrl] = JSON.stringify(store.currentFilter);
 
         if (store.navigate) {
             const { customRouteRedirectName, searchText } = store.navigate;

src/pages/Customer/Card/CustomerAddress.vue

@@ -27,7 +27,7 @@ const addressFilter = {
         'isLogifloraAllowed',
         'postalCode',
     ],
-    order: ['isDefaultAddress DESC', 'isActive DESC', 'nickname ASC'],
+    order: ['isDefaultAddress DESC', 'isActive DESC', 'id DESC', 'nickname ASC'],
     include: [
         {
             relation: 'observations',

src/pages/Customer/Card/CustomerBalance.vue

@@ -1,11 +1,10 @@
 <script setup>
-import { computed, onBeforeMount, ref } from 'vue';
+import { computed, onBeforeMount, onMounted, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRoute } from 'vue-router';
 import { useAcl } from 'src/composables/useAcl';
 import axios from 'axios';
 import { useQuasar } from 'quasar';
-import FetchData from 'components/FetchData.vue';
 
 import { toCurrency, toDate, toDateHourMin } from 'src/filters';
 import { useState } from 'composables/useState';
@@ -16,7 +15,7 @@ import { useVnConfirm } from 'composables/useVnConfirm';
 import VnTable from 'components/VnTable/VnTable.vue';
 import VnInput from 'components/common/VnInput.vue';
 import VnSubToolbar from 'components/ui/VnSubToolbar.vue';
-import VnSelect from 'src/components/common/VnSelect.vue';
+import VnFilter from 'components/VnTable/VnFilter.vue';
 
 import CustomerNewPayment from 'src/pages/Customer/components/CustomerNewPayment.vue';
 import InvoiceOutDescriptorProxy from 'src/pages/InvoiceOut/Card/InvoiceOutDescriptorProxy.vue';
@@ -25,7 +24,7 @@ const { openConfirmationModal } = useVnConfirm();
 const { sendEmail, openReport } = usePrintService();
 const { t } = useI18n();
 const { hasAny } = useAcl();
-const currentBalance = ref({});
+
 const quasar = useQuasar();
 const route = useRoute();
 const state = useState();
@@ -33,28 +32,53 @@ const stateStore = useStateStore();
 const user = state.getUser();
 
 const clientRisk = ref([]);
-const companies = ref([]);
 const tableRef = ref();
-const companyId = ref(user.value.companyFk);
+const companyId = ref();
+const companyUser = ref(user.value.companyFk);
 const balances = ref([]);
 const vnFilterRef = ref({});
 const filter = computed(() => {
     return {
         clientId: route.params.id,
-        companyId: companyId.value ?? user.value.companyFk,
+        companyId: companyId.value ?? companyUser.value,
     };
 });
 
+const companyFilterColumn = {
+    align: 'left',
+    name: 'companyId',
+    label: t('Company'),
+    component: 'select',
+    attrs: {
+        url: 'Companies',
+        optionLabel: 'code',
+        optionValue: 'id',
+        sortBy: 'code',
+    },
+    columnFilter: {
+        event: {
+            remove: () => (companyId.value = null),
+            'update:modelValue': (newCompanyFk) => {
+                if (!newCompanyFk) return;
+                vnFilterRef.value.addFilter(newCompanyFk);
+                companyUser.value = newCompanyFk;
+            },
+            blur: () => !companyId.value && (companyId.value = companyUser.value),
+        },
+    },
+    visible: false,
+};
+
 const columns = computed(() => [
     {
-        align: 'right',
+        align: 'left',
         name: 'payed',
         label: t('Date'),
         format: ({ payed }) => toDate(payed),
         cardVisible: true,
     },
     {
-        align: 'right',
+        align: 'left',
         name: 'created',
         label: t('Creation date'),
         format: ({ created }) => toDateHourMin(created),
@@ -65,7 +89,12 @@ const columns = computed(() => [
         label: t('Employee'),
         columnField: {
             component: 'userLink',
-            attrs: ({ row }) => ({ workerId: row.workerFk, name: row.userName }),
+            attrs: ({ row }) => {
+                return {
+                    workerId: row.workerFk,
+                    name: row.userName,
+                };
+            },
         },
         cardVisible: true,
     },
@@ -77,13 +106,13 @@ const columns = computed(() => [
         class: 'extend',
     },
     {
-        align: 'right',
+        align: 'left',
         name: 'bankFk',
         label: t('Bank'),
         cardVisible: true,
     },
     {
-        align: 'right',
+        align: 'left',
         name: 'debit',
         label: t('Debit'),
         format: ({ debit }) => debit && toCurrency(debit),
@@ -136,20 +165,41 @@ const columns = computed(() => [
 
 onBeforeMount(() => {
     stateStore.rightDrawer = true;
+    companyId.value = companyUser.value;
 });
 
-async function getCurrentBalance(data) {
-    currentBalance.value[companyId.value] = {
-        amount: 0,
-        code: companies.value.find((c) => c.id === companyId.value)?.code,
-    };
+async function getClientRisk() {
+    const { data } = await axios.get(`clientRisks`, {
+        params: {
+            filter: JSON.stringify({
+                include: { relation: 'company', scope: { fields: ['code'] } },
+                where: { clientFk: route.params.id, companyFk: companyUser.value },
+            }),
+        },
+    });
+    clientRisk.value = data;
+    return clientRisk.value;
+}
 
-    for (const balance of data) {
-        currentBalance.value[balance.companyFk] = {
-            code: balance.company.code,
-            amount: balance.amount,
-        };
+async function getCurrentBalance() {
+    const currentBalance = (await getClientRisk()).find((balance) => {
+        return balance.companyFk === companyId.value;
+    });
+    return currentBalance && currentBalance.amount;
+}
+
+async function onFetch(data) {
+    balances.value = [];
+    for (const [index, balance] of data.entries()) {
+        if (index === 0) {
+            balance.balance = await getCurrentBalance();
+            continue;
+        }
+        const previousBalance = data[index - 1];
+        balance.balance =
+            previousBalance?.balance - (previousBalance?.debit - previousBalance?.credit);
     }
+    balances.value = data;
 }
 
 const showNewPaymentDialog = () => {
@@ -169,43 +219,25 @@ const showBalancePdf = ({ id }) => {
 </script>
 
 <template>
-    <FetchData
-        url="Companies"
-        auto-load
-        @on-fetch="(data) => (companies = data)"
-    ></FetchData>
-    <FetchData
-        v-if="companies.length > 0"
-        url="clientRisks"
-        :filter="{
-            include: { relation: 'company', scope: { fields: ['code'] } },
-            where: { clientFk: route.params.id },
-        }"
-        auto-load
-        @on-fetch="getCurrentBalance"
-    ></FetchData>
-
     <VnSubToolbar class="q-mb-md">
         <template #st-data>
             <div class="column justify-center q-px-md q-py-sm">
                 <span class="text-bold">{{ t('Total by company') }}</span>
-                <div class="row justify-center">
-                    {{ currentBalance[companyId]?.code }}:
-                    {{ toCurrency(currentBalance[companyId]?.amount) }}
+                <div class="row justify-center" v-if="clientRisk?.length">
+                    {{ clientRisk[0].company.code }}:
+                    {{ toCurrency(clientRisk[0].amount) }}
                 </div>
             </div>
         </template>
         <template #st-actions>
             <div>
-                <VnSelect
-                    :label="t('Company')"
+                <VnFilter
                     ref="vnFilterRef"
                     v-model="companyId"
                     data-key="CustomerBalance"
-                    :options="companies"
-                    option-label="code"
-                    option-value="id"
-                ></VnSelect>
+                    :column="companyFilterColumn"
+                    search-url="balance"
+                />
             </div>
         </template>
     </VnSubToolbar>
@@ -219,6 +251,7 @@ const showBalancePdf = ({ id }) => {
         :right-search="false"
         :is-editable="false"
         :column-search="false"
+        @on-fetch="onFetch"
         :disable-option="{ card: true }"
         auto-load
     >

src/pages/Customer/Card/CustomerCredits.vue

@@ -49,7 +49,9 @@ const columns = computed(() => [
         name: 'credit',
         create: true,
         visible: false,
-        attrs: {
+        columnCreate: {
+            component: 'number',
+            required: true,
             autofocus: true,
         },
     },

src/pages/Customer/Card/CustomerDescriptor.vue

@@ -12,6 +12,7 @@ import VnLv from 'src/components/ui/VnLv.vue';
 import VnUserLink from 'src/components/ui/VnUserLink.vue';
 import CustomerDescriptorMenu from './CustomerDescriptorMenu.vue';
 import { useState } from 'src/composables/useState';
+import { QIcon } from 'quasar';
 const state = useState();
 
 const customer = computed(() => state.get('customer'));
@@ -150,7 +151,7 @@ const setData = (entity) => (data.value = useCardDescription(entity?.name, entit
             </QCardActions>
         </template>
         <template #actions="{ entity }">
-            <QCardActions class="flex justify-center">
+            <QCardActions class="flex justify-center" style="padding-inline: 0">
                 <QBtn
                     :to="{
                         name: 'TicketList',
@@ -168,6 +169,23 @@ 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',
@@ -179,6 +197,23 @@ 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',
@@ -215,6 +250,8 @@ es:
     Go to module index: Ir al índice del módulo
     Customer ticket list: Listado de tickets del cliente
     Customer invoice out list: Listado de facturas del cliente
+    New order: Nuevo pedido
+    New ticket: Nuevo ticket
     Go to user: Ir al usuario
     Go to supplier: Ir al proveedor
     Customer unpaid: Cliente impago

src/pages/Customer/Card/CustomerDescriptorMenu.vue

@@ -8,9 +8,6 @@ import { useQuasar } from 'quasar';
 import useNotify from 'src/composables/useNotify';
 
 import VnSmsDialog from 'src/components/common/VnSmsDialog.vue';
-import TicketCreateDialog from 'src/pages/Ticket/TicketCreateDialog.vue';
-import OrderCreateDialog from 'src/pages/Order/Card/OrderCreateDialog.vue';
-import { ref } from 'vue';
 
 const $props = defineProps({
     customer: {
@@ -43,34 +40,9 @@ const sendSms = async (payload) => {
         notify(error.message, 'positive');
     }
 };
-
-const ticketCreateFormDialog = ref(null);
-const openTicketCreateForm = () => {
-    ticketCreateFormDialog.value.show();
-};
-const orderCreateFormDialog = ref(null);
-const openOrderCreateForm = () => {
-    orderCreateFormDialog.value.show();
-};
 </script>
 
 <template>
-    <QItem v-ripple clickable @click="openTicketCreateForm()">
-        <QItemSection>
-            {{ t('globals.pageTitles.createTicket') }}
-            <QDialog ref="ticketCreateFormDialog">
-                <TicketCreateDialog />
-            </QDialog>
-        </QItemSection>
-    </QItem>
-    <QItem v-ripple clickable @click="openOrderCreateForm()">
-        <QItemSection>
-            {{ t('globals.pageTitles.createOrder') }}
-            <QDialog ref="orderCreateFormDialog">
-                <OrderCreateDialog :client-fk="customer.id" />
-            </QDialog>
-        </QItemSection>
-    </QItem>
     <QItem v-ripple clickable>
         <QItemSection @click="showSmsDialog()">{{ t('Send SMS') }}</QItemSection>
     </QItem>

src/pages/Customer/Card/CustomerFiscalData.vue

@@ -53,11 +53,11 @@ function handleLocation(data, location) {
                         </QIcon>
                     </template>
                 </VnInput>
-                <VnInput :label="t('Tax number')" clearable v-model="data.fi" />
+                <VnInput :label="t('Tax number')" clearable v-model="data.fi" required />
             </VnRow>
 
             <VnRow>
-                <VnInput :label="t('Street')" clearable v-model="data.street" />
+                <VnInput :label="t('Street')" clearable v-model="data.street" required />
             </VnRow>
 
             <VnRow>
@@ -68,6 +68,7 @@ function handleLocation(data, location) {
                     option-label="vat"
                     option-value="id"
                     v-model="data.sageTaxTypeFk"
+                    :required="data.isTaxDataChecked"
                 />
                 <VnSelect
                     :label="t('Sage transaction type')"
@@ -76,6 +77,7 @@ function handleLocation(data, location) {
                     option-label="transaction"
                     option-value="id"
                     v-model="data.sageTransactionTypeFk"
+                    :required="data.isTaxDataChecked"
                 >
                     <template #option="scope">
                         <QItem v-bind="scope.itemProps">
@@ -96,6 +98,7 @@ function handleLocation(data, location) {
                     :roles-allowed-to-create="['deliveryAssistant', 'administrative']"
                     :acls="[{ model: 'Town', props: '*', accessType: 'WRITE' }]"
                     :location="data"
+                    :required="true"
                     @update:model-value="(location) => handleLocation(data, location)"
                 />
             </VnRow>

src/pages/Customer/Card/CustomerGreuges.vue

@@ -80,6 +80,11 @@ const columns = computed(() => [
         align: 'left',
         name: 'amount',
         label: t('Amount'),
+        columnCreate: {
+            component: 'number',
+            autofocus: true,
+            required: true,
+        },
         format: ({ amount }) => toCurrency(amount),
         create: true,
     },

src/pages/Customer/Card/CustomerRecoveries.vue

@@ -56,6 +56,7 @@ const columns = computed(() => [
         label: t('Period'),
         create: true,
         ...componentColumn('number'),
+        required: true,
     },
     {
         align: 'left',

src/pages/Customer/Card/CustomerSummary.vue

@@ -1,13 +1,13 @@
 <script setup>
-import { computed, ref } from 'vue';
+import { computed, ref, onMounted } from 'vue';
 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 CardSummary from 'components/ui/CardSummary.vue';
+import { getUrl } from 'src/composables/getUrl';
 import VnLv from 'src/components/ui/VnLv.vue';
 import VnLinkPhone from 'src/components/ui/VnLinkPhone.vue';
+import VnLinkMail from 'src/components/ui/VnLinkMail.vue';
 import CustomerSummaryTable from 'src/pages/Customer/components/CustomerSummaryTable.vue';
 import VnTitle from 'src/components/common/VnTitle.vue';
 import VnRow from 'src/components/ui/VnRow.vue';
@@ -25,6 +25,11 @@ const $props = defineProps({
 const entityId = computed(() => $props.id || route.params.id);
 const customer = computed(() => summary.value.entity);
 const summary = ref();
+const clientUrl = ref();
+
+onMounted(async () => {
+    clientUrl.value = (await getUrl('client/')) + entityId.value + '/';
+});
 
 const balanceDue = computed(() => {
     return (
@@ -37,11 +42,11 @@ const balanceDue = computed(() => {
 const balanceDueWarning = computed(() => (balanceDue.value ? 'negative' : ''));
 
 const claimRate = computed(() => {
-    return customer.value.claimsRatio?.claimingRate ?? 0;
+    return customer.value.claimsRatio.claimingRate;
 });
 
 const priceIncreasingRate = computed(() => {
-    return customer.value.claimsRatio?.priceIncreasing ?? 0 / 100;
+    return customer.value.claimsRatio.priceIncreasing / 100;
 });
 
 const debtWarning = computed(() => {
@@ -55,11 +60,6 @@ const creditWarning = computed(() => {
 
     return tooMuchInsurance || noCreditInsurance ? 'negative' : '';
 });
-const sumRisk = ({ clientRisks }) => {
-    let total = clientRisks.reduce((acc, { amount }) => acc + amount, 0);
-
-    return total;
-};
 </script>
 
 <template>
@@ -89,17 +89,15 @@ const sumRisk = ({ clientRisks }) => {
                         <VnLinkPhone :phone-number="entity.mobile" />
                     </template>
                 </VnLv>
-                <VnLv :label="t('customer.summary.email')" :value="entity.email" copy />
+                <VnLv :value="entity.email" copy
+                    ><template #label>
+                        {{ t('customer.summary.email') }}
+                        <VnLinkMail email="entity.email"></VnLinkMail> </template
+                ></VnLv>
                 <VnLv
                     :label="t('customer.summary.salesPerson')"
                     :value="entity?.salesPersonUser?.name"
-                >
-                    <template #value>
-                        <VnUserLink
-                            :name="entity.salesPersonUser?.name"
-                            :worker-id="entity.salesPersonFk"
-                        /> </template
-                ></VnLv>
+                />
                 <VnLv
                     :label="t('customer.summary.contactChannel')"
                     :value="entity?.contactChannel?.name"
@@ -139,7 +137,7 @@ const sumRisk = ({ clientRisks }) => {
                     :url="`#/customer/${entityId}/fiscal-data`"
                     :text="t('customer.summary.fiscalData')"
                 />
-                <VnRow class="block">
+                <VnRow>
                     <VnLv
                         :label="t('customer.summary.isEqualizated')"
                         :value="entity.isEqualizated"
@@ -148,6 +146,8 @@ const sumRisk = ({ clientRisks }) => {
                         :label="t('customer.summary.isActive')"
                         :value="entity.isActive"
                     />
+                </VnRow>
+                <VnRow>
                     <VnLv
                         :label="t('customer.summary.verifiedData')"
                         :value="entity.isTaxDataChecked"
@@ -156,6 +156,8 @@ const sumRisk = ({ clientRisks }) => {
                         :label="t('customer.summary.hasToInvoice')"
                         :value="entity.hasToInvoice"
                     />
+                </VnRow>
+                <VnRow>
                     <VnLv
                         :label="t('customer.summary.notifyByEmail')"
                         :value="entity.isToBeMailed"
@@ -166,7 +168,7 @@ const sumRisk = ({ clientRisks }) => {
             <QCard class="vn-one">
                 <VnTitle
                     :url="`#/customer/${entityId}/billing-data`"
-                    :text="t('customer.summary.payMethodFk')"
+                    :text="t('customer.summary.billingData')"
                 />
                 <VnLv
                     :label="t('customer.summary.payMethod')"
@@ -174,7 +176,7 @@ const sumRisk = ({ clientRisks }) => {
                 />
                 <VnLv :label="t('customer.summary.bankAccount')" :value="entity.iban" />
                 <VnLv :label="t('customer.summary.dueDay')" :value="entity.dueDay" />
-                <VnRow class="q-mt-sm block">
+                <VnRow class="q-mt-sm" wrap>
                     <VnLv :label="t('customer.summary.hasLcr')" :value="entity.hasLcr" />
                     <VnLv
                         :label="t('customer.summary.hasCoreVnl')"
@@ -189,7 +191,7 @@ const sumRisk = ({ clientRisks }) => {
             </QCard>
             <QCard class="vn-one" v-if="entity.defaultAddress">
                 <VnTitle
-                    :url="`#/customer/${entityId}/address`"
+                    :url="`#/customer/${entityId}/consignees`"
                     :text="t('customer.summary.consignee')"
                 />
                 <VnLv
@@ -222,6 +224,7 @@ const sumRisk = ({ clientRisks }) => {
             </QCard>
             <QCard class="vn-one" v-if="entity.account">
                 <VnTitle
+                    target="_blank"
                     :url="`${grafanaUrl}/d/adjlxzv5yjt34d/analisis-de-clientes-7c-crm?orgId=1&var-clientFk=${entityId}`"
                     :text="t('customer.summary.businessData')"
                     icon="vn:grafana"
@@ -235,6 +238,7 @@ const sumRisk = ({ clientRisks }) => {
                     :value="toCurrency(entity?.mana?.mana)"
                 />
                 <VnLv
+                    v-if="entity.claimsRatio"
                     :label="t('customer.summary.priceIncreasingRate')"
                     :value="toPercentage(priceIncreasingRate)"
                 />
@@ -243,14 +247,16 @@ const sumRisk = ({ clientRisks }) => {
                     :value="toCurrency(entity?.averageInvoiced?.invoiced)"
                 />
                 <VnLv
+                    v-if="entity.claimsRatio"
                     :label="t('customer.summary.claimRate')"
                     :value="toPercentage(claimRate)"
                 />
             </QCard>
             <QCard class="vn-one" v-if="entity.account">
                 <VnTitle
+                    target="_blank"
                     :url="`${grafanaUrl}/d/40buzE4Vk/comportamiento-pagos-clientes?orgId=1&var-clientFk=${entityId}`"
-                    :text="t('customer.summary.payMethodFk')"
+                    :text="t('customer.summary.financialData')"
                     icon="vn:grafana"
                 />
                 <VnLv
@@ -268,13 +274,15 @@ const sumRisk = ({ clientRisks }) => {
                 />
 
                 <VnLv
+                    v-if="entity.creditInsurance"
                     :label="t('customer.summary.securedCredit')"
                     :value="toCurrency(entity.creditInsurance)"
                     :info="t('customer.summary.securedCreditInfo')"
                 />
+
                 <VnLv
                     :label="t('customer.summary.balance')"
-                    :value="toCurrency(sumRisk(entity)) || toCurrency(0)"
+                    :value="toCurrency(entity.sumRisk) || toCurrency(0)"
                     :info="t('customer.summary.balanceInfo')"
                 />
 
@@ -301,7 +309,7 @@ const sumRisk = ({ clientRisks }) => {
                     :value="entity.recommendedCredit"
                 />
             </QCard>
-            <QCard>
+            <QCard class="vn-one">
                 <VnTitle :text="t('Latest tickets')" />
                 <CustomerSummaryTable />
             </QCard>

src/pages/Customer/CustomerList.vue

@@ -67,8 +67,7 @@ const columns = computed(() => [
             url: 'Workers/activeWithInheritedRole',
             fields: ['id', 'name'],
             where: { role: 'salesPerson' },
-            optionFilter: 'firstName',
-            useLike: false,
+            optionFilter: 'firstName'
         },
         create: false,
         columnField: {
@@ -429,9 +428,10 @@ function handleLocation(data, location) {
                 :params="{
                     departmentCodes: ['VT', 'shopping'],
                 }"
-                :fields="['id', 'nickname']"
+                :fields="['id', 'nickname', 'code']"
                 sort-by="nickname ASC"
-                :use-like="false"
+                option-label="nickname"
+                option-value="id"
                 emit-value
                 auto-load
             >

src/pages/Customer/components/CustomerAddressCreate.vue

@@ -85,15 +85,26 @@ function handleLocation(data, location) {
             <QCheckbox :label="t('Default')" v-model="data.isDefaultAddress" />
 
             <VnRow>
-                <VnInput :label="t('Consignee')" clearable v-model="data.nickname" />
+                <VnInput
+                    :label="t('Consignee')"
+                    required
+                    clearable
+                    v-model="data.nickname"
+                />
 
-                <VnInput :label="t('Street address')" clearable v-model="data.street" />
+                <VnInput
+                    :label="t('Street address')"
+                    clearable
+                    v-model="data.street"
+                    required
+                />
             </VnRow>
 
             <VnLocation
                 :rules="validate('Worker.postcode')"
                 :acls="[{ model: 'Town', props: '*', accessType: 'WRITE' }]"
                 v-model="data.location"
+                :required="true"
                 @update:model-value="(location) => handleLocation(data, location)"
             />
 

src/pages/Customer/components/CustomerNewPayment.vue

@@ -241,7 +241,7 @@ async function getAmountPaid() {
                             </QItem>
                         </template>
                     </VnSelect>
-                    <VnInput
+                    <VnInputNumber
                         :label="t('Amount')"
                         :required="true"
                         @update:model-value="calculateFromAmount($event)"
@@ -254,7 +254,7 @@ async function getAmountPaid() {
                         {{ t('Compensation') }}
                     </div>
                     <VnRow>
-                        <VnInput
+                        <VnInputNumber
                             :label="t('Compensation account')"
                             clearable
                             v-model="data.compensationAccount"

src/pages/Customer/components/CustomerSummaryTable.vue

@@ -6,7 +6,7 @@ import { useRoute, useRouter } from 'vue-router';
 import { date } from 'quasar';
 import { toDateFormat } from 'src/filters/date.js';
 
-import { toCurrency } from 'src/filters';
+import { dashIfEmpty, toCurrency } from 'src/filters';
 
 import { useSummaryDialog } from 'src/composables/useSummaryDialog';
 import TicketSummary from 'src/pages/Ticket/Card/TicketSummary.vue';
@@ -53,7 +53,7 @@ const columns = computed(() => [
     },
     {
         align: 'left',
-        format: (row) => row.agencyMode.name,
+        format: (row) => dashIfEmpty(row.agencyMode?.name),
         columnClass: 'expand',
         label: t('Agency'),
     },
@@ -96,7 +96,11 @@ const columns = computed(() => [
             {
                 title: t('customer.summary.goToLines'),
                 icon: 'vn:lines',
-                action: ({ id }) => router.push({ params: { id }, name: 'TicketSale' }),
+                action: ({ id }) =>
+                    window.open(
+                        router.resolve({ params: { id }, name: 'TicketSale' }).href,
+                        '_blank'
+                    ),
                 isPrimary: true,
             },
             {
@@ -145,7 +149,7 @@ const setShippedColor = (date) => {
         :column-search="false"
         url="Tickets"
         :columns="columns"
-        search-url="tickets"
+        append-params="false"
         :without-header="true"
         auto-load
         order="shipped DESC, id"

src/pages/Entry/Card/EntryBuys.vue

@@ -5,7 +5,6 @@ import { useI18n } from 'vue-i18n';
 import { QBtn } from 'quasar';
 
 import VnPaginate from 'src/components/ui/VnPaginate.vue';
-import FetchData from 'src/components/FetchData.vue';
 import VnSelect from 'components/common/VnSelect.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 import FetchedTags from 'components/ui/FetchedTags.vue';

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>

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,13 +14,14 @@ 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 { useRoute } from 'vue-router';
 
 const { t } = useI18n();
 const { viewSummary } = useSummaryDialog();
 const tableRef = ref();
 const agencyList = ref([]);
 const addressesList = ref([]);
-const clientId = ref();
+const route = useRoute();
 
 const columns = computed(() => [
     {
@@ -141,7 +142,12 @@ const columns = computed(() => [
         ],
     },
 ]);
-
+onMounted(() => {
+    if (!route.query.createForm) return;
+    const clientId = route.query.createForm;
+    const id = JSON.parse(clientId);
+    fetchClientAddress(id.clientFk, id);
+});
 async function fetchClientAddress(id, formData) {
     const { data } = await axios.get(`Clients/${id}`, {
         params: { filter: { include: { relation: 'addresses' } } },
@@ -191,6 +197,7 @@ const getDateColor = (date) => {
             formInitialData: {
                 active: true,
                 addressId: null,
+                clientFk: null,
             },
         }"
         :user-params="{ showEmpty: false }"
@@ -221,7 +228,7 @@ const getDateColor = (date) => {
             <VnSelect
                 url="Clients"
                 :include="{ relation: 'addresses' }"
-                v-model="clientId"
+                v-model="data.clientFk"
                 :label="t('module.customer')"
                 @update:model-value="(id) => fetchClientAddress(id, data)"
             />

src/pages/Route/RouteList.vue

@@ -1,7 +1,6 @@
 <script setup>
 import { computed, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { useSession } from 'composables/useSession';
 import { useSummaryDialog } from 'src/composables/useSummaryDialog';
 import { useQuasar } from 'quasar';
 import { toDate } from 'src/filters';
@@ -23,7 +22,6 @@ const { openReport } = usePrintService();
 const { t } = useI18n();
 const { viewSummary } = useSummaryDialog();
 const quasar = useQuasar();
-const session = useSession();
 const selectedRows = ref([]);
 const tableRef = ref([]);
 const confirmationDialog = ref(false);

src/pages/Ticket/Card/TicketCreateRequest.vue

@@ -2,7 +2,7 @@
 import { ref } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
-
+import VnInputNumber from 'components/common/VnInputNumber.vue';
 import FormModelPopup from 'components/FormModelPopup.vue';
 import VnRow from 'components/ui/VnRow.vue';
 import VnInput from 'src/components/common/VnInput.vue';
@@ -46,16 +46,14 @@ const attendersOptions = ref([]);
                 />
             </VnRow>
             <VnRow>
-                <VnInput
+                <VnInputNumber
                     v-model="data.quantity"
                     :label="t('purchaseRequest.quantity')"
-                    type="number"
                     min="1"
                 />
-                <VnInput
+                <VnInputNumber
                     v-model="data.price"
                     :label="t('purchaseRequest.price')"
-                    type="number"
                     min="0"
                 />
             </VnRow>

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 { toDate, toCurrency } from 'src/filters/index';
@@ -16,6 +16,8 @@ import RightMenu from 'src/components/common/RightMenu.vue';
 import TicketFilter from './TicketFilter.vue';
 
 const route = useRoute();
+const router = useRouter();
+
 const { t } = useI18n();
 const { viewSummary } = useSummaryDialog();
 const tableRef = ref();
@@ -136,12 +138,23 @@ const columns = computed(() => [
             {
                 title: t('ticketList.summary'),
                 icon: 'preview',
-                action: (row) => viewSummary(row.id, TicketSummary),
+                action: (row, evt) => {
+                    if (evt && evt.ctrlKey) {
+                        const url = router.resolve({
+                            params: { id: row.id },
+                            name: 'TicketCard',
+                        }).href;
+                        window.open(url, '_blank');
+                    } else viewSummary(row.id, TicketSummary);
+                },
             },
         ],
     },
 ]);
-
+onMounted(() => {
+    if (!route.query.createForm) return;
+    onClientSelected(JSON.parse(route.query.createForm));
+});
 const onClientSelected = async (formData) => {
     await fetchClient(formData);
     await fetchAddresses(formData);
@@ -192,9 +205,8 @@ const fetchAddresses = async (formData) => {
         if (!formData.clientId) return;
 
         const filter = {
-            fields: ['nickname', 'street', 'city', 'id'],
-            where: { isActive: true },
-            order: 'nickname ASC',
+            fields: ['nickname', 'street', 'city', 'id', 'isActive'],
+            order: ['isDefaultAddress DESC', 'isActive DESC', 'nickname ASC'],
         };
         const params = { filter: JSON.stringify(filter) };
         const { data } = await axios.get(`Clients/${formData.clientId}/addresses`, {
@@ -238,7 +250,7 @@ onMounted(() => {
             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']"
@@ -258,6 +270,7 @@ onMounted(() => {
                     option-value="id"
                     option-label="name"
                     hide-selected
+                    required
                     @update:model-value="(client) => onClientSelected(data)"
                 >
                     <template #option="scope">
@@ -276,7 +289,7 @@ onMounted(() => {
             </VnRow>
             <VnRow>
                 <VnSelect
-                    url="Addresses"
+                    required
                     :label="t('ticket.create.address')"
                     v-model="data.addressId"
                     :options="addressesOptions"
@@ -287,7 +300,22 @@ onMounted(() => {
                     @update:model-value="() => fetchAvailableAgencies(data)"
                 >
                     <template #option="scope">
-                        <QItem v-bind="scope.itemProps">
+                        <QItem
+                            v-bind="scope.itemProps"
+                            :class="{ disabled: !scope.opt.isActive }"
+                        >
+                            <QItemSection style="min-width: min-content" avatar>
+                                <QIcon
+                                    v-if="
+                                        scope.opt.isActive &&
+                                        selectedClient?.defaultAddressFk === scope.opt.id
+                                    "
+                                    size="sm"
+                                    color="grey"
+                                    name="star"
+                                    class="fill-icon"
+                                />
+                            </QItemSection>
                             <QItemSection>
                                 <QItemLabel>
                                     {{ scope.opt.nickname }}
@@ -321,6 +349,7 @@ onMounted(() => {
                         option-value="id"
                         option-label="name"
                         hide-selected
+                        required
                         @update:model-value="() => fetchAvailableAgencies(data)"
                     />
                 </div>
@@ -334,7 +363,6 @@ onMounted(() => {
                         option-value="agencyModeFk"
                         option-label="agencyMode"
                         hide-selected
-                        :disable="!data.clientId || !data.landed || !data.warehouseId"
                     />
                 </div>
             </VnRow>
@@ -346,7 +374,14 @@ onMounted(() => {
         </template>
     </VnTable>
 </template>
-
+<style scoped>
+.disabled,
+.disabled *,
+[disabled],
+[disabled] * {
+    cursor: pointer !important;
+}
+</style>
 <i18n>
 es:
     Search ticket: Buscar ticket

src/pages/Travel/Card/TravelThermographsForm.vue

@@ -156,10 +156,6 @@ const updateThermograph = async () => {
         console.error('Error creating thermograph');
     }
 };
-
-const onThermographCreated = async (data) => {
-    thermographForm.thermographId = data.id;
-};
 </script>
 <template>
     <FetchData

test/cypress/integration/client/clientList.spec.js

@@ -0,0 +1,63 @@
+/// <reference types="cypress" />
+describe('Handle Client list', () => {
+    beforeEach(() => {
+        cy.viewport(1280, 720);
+        cy.login('developer');
+        cy.visit('/#/customer/list', {
+            timeout: 5000,
+            onBeforeLoad(win) {
+                cy.stub(win, 'open');
+            },
+        });
+    });
+
+    it('Client list create new client', () => {
+        cy.get('.q-page-sticky > div > .q-btn > .q-btn__content > .q-icon').click();
+        const data = {
+            Name: { val: 'Name 1' },
+            'Social name': { val: 'TEST 1' },
+            'Tax number': { val: '20852113Z' },
+            'Web user': { val: 'user_test_1' },
+            Street: { val: 'C/ STREET 1' },
+            Email: { val: 'user.test@1.com' },
+            'Business type': { val: 'Otros', type: 'select' },
+            'Sales person': { val: 'salesboss', type: 'select' },
+            Location: { val: '46000, Valencia(Province one), España', type: 'select' },
+        };
+        cy.fillInForm(data);
+
+        cy.get('.q-mt-lg > .q-btn--standard').click();
+
+        cy.checkNotification('created');
+        cy.url().should('include', '/summary');
+    });
+    it('Client list search client', () => {
+        const search = 'Jessica Jones';
+        cy.searchByLabel('Name', search);
+
+        cy.get('.title > span').should('have.text', search);
+        let id = null;
+        cy.get('.q-item > .q-item__label').then((text) => {
+            id = text.text().trim().split('#')[1];
+            cy.get('.q-item > .q-item__label').should('have.text', ` #${id}`);
+            cy.url().should('include', `/customer/${id}/summary`);
+        });
+    });
+
+    it('Client founded create ticket', () => {
+        const search = 'Jessica Jones';
+        cy.searchByLabel('Name', search);
+        cy.clickButtonsDescriptor(2);
+        cy.waitForElement('#formModel');
+        cy.waitForElement('.q-form');
+        cy.checkValueForm(1, search);
+    });
+    it('Client founded create order', () => {
+        const search = 'Jessica Jones';
+        cy.searchByLabel('Name', search);
+        cy.clickButtonsDescriptor(4);
+        cy.waitForElement('#formModel');
+        cy.waitForElement('.q-form');
+        cy.checkValueForm(2, search);
+    });
+});

test/cypress/support/commands.js

@@ -249,10 +249,53 @@ Cypress.Commands.add('writeSearchbar', (value) => {
         value
     );
 });
+
 Cypress.Commands.add('validateContent', (selector, expectedValue) => {
     cy.get(selector).should('have.text', expectedValue);
 });
 
+Cypress.Commands.add('openActionDescriptor', (opt) => {
+    cy.openActionsDescriptor();
+    const listItem = '[role="menu"] .q-list .q-item';
+    cy.contains(listItem, opt).click();
+    1;
+});
+
 Cypress.Commands.add('openActionsDescriptor', () => {
     cy.get('.header > :nth-child(3) > .q-btn__content > .q-icon').click();
 });
+
+Cypress.Commands.add('clickButtonsDescriptor', (id) => {
+    cy.get(`.actions > .q-card__actions> .q-btn:nth-child(${id})`)
+        .invoke('removeAttr', 'target')
+        .click();
+});
+
+Cypress.Commands.add('openActions', (row) => {
+    cy.get('tbody > tr').eq(row).find('.actions > .q-btn').click();
+});
+
+Cypress.Commands.add('checkNotification', (type) => {
+    const values = {
+        created: 'Data created',
+        updated: 'Data saved',
+        deleted: 'Data deleted',
+    };
+    cy.get('.q-notification__message').should('have.text', values[type]);
+});
+
+Cypress.Commands.add('checkValueForm', (id, search) => {
+    cy.get(
+        `.grid-create > :nth-child(${id}) > .q-field__inner>.q-field__control> .q-field__control-container>.q-field__native >.q-field__input`
+    ).should('have.value', search);
+});
+
+Cypress.Commands.add('checkValueSelectForm', (id, search) => {
+    cy.get(
+        `.grid-create > :nth-child(${id}) > .q-field > .q-field__inner > .q-field__control > .q-field__control-container>.q-field__native>.q-field__input`
+    ).should('have.value', search);
+});
+
+Cypress.Commands.add('searchByLabel', (label, value) => {
+    cy.get(`[label="${label}"] > .q-field > .q-field__inner`).type(`${value}{enter}`);
+});