Merge branch 'dev' into 5633-accountNumberComponent

CHANGELOG.md

@@ -5,6 +5,16 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [2352.01] - 2023-12-28
+
+### Added
+- (carros) => Se añade contador de carros. #6545
+- (Reclamaciones) => Se añade la sección para hacer acciones sobre una reclamación. #5654
+### Changed
+### Fixed
+- (Reclamaciones) => Se corrige el color de la barra según el tema y el evento de actualziar cantidades #6334
+
+
 ## [2253.01] - 2023-01-05
 
 ### Added

package.json

@@ -1,6 +1,6 @@
 {
     "name": "salix-front",
-    "version": "23.48.01",
+    "version": "23.52.01",
     "description": "Salix frontend",
     "productName": "Salix",
     "author": "Verdnatura",

quasar.config.js

@@ -66,7 +66,9 @@ module.exports = configure(function (/* ctx */) {
             // publicPath: '/',
             // analyze: true,
             // env: {},
-            // rawDefine: {}
+            rawDefine: {
+                'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV)
+            },
             // ignorePublicFolder: true,
             // minify: false,
             // polyfillModulePreload: true,
@@ -89,11 +91,12 @@ module.exports = configure(function (/* ctx */) {
 
             vitePlugins: [
                 [
-                    VueI18nPlugin,
+                    VueI18nPlugin({
+                        runtimeOnly: false
+                    }),
                     {
                         // if you want to use Vue I18n Legacy API, you need to set `compositionOnly: false`
                         // compositionOnly: false,
-
                         // you need to set i18n resource including paths !
                         include: path.resolve(__dirname, './src/i18n/**'),
                     },

src/components/ui/CardDescriptor.vue

@@ -1,6 +1,7 @@
 <script setup>
 import { onMounted, useSlots, ref, watch, computed } from 'vue';
 import { useI18n } from 'vue-i18n';
+import { useQuasar } from 'quasar';
 import axios from 'axios';
 import SkeletonDescriptor from 'components/ui/SkeletonDescriptor.vue';
 import { useArrayData } from 'composables/useArrayData';
@@ -30,8 +31,12 @@ const $props = defineProps({
         type: String,
         default: '',
     },
+    summary: {
+        type: Object,
+        default: null,
+    },
 });
-
+const quasar = useQuasar();
 const slots = useSlots();
 const { t } = useI18n();
 const entity = computed(() => useArrayData($props.dataKey).store.data);
@@ -57,27 +62,36 @@ async function getData() {
     emit('onFetch', data);
 }
 const emit = defineEmits(['onFetch']);
+
+function viewSummary(id) {
+    quasar.dialog({
+        component: $props.summary,
+        componentProps: {
+            id,
+        },
+    });
+}
 </script>
 
 <template>
     <div class="descriptor">
         <template v-if="entity">
-            <div class="header bg-primary q-pa-sm">
+            <div class="header bg-primary q-pa-sm justify-between">
-                <RouterLink :to="{ name: `${module}List` }">
+                <QBtn
-                    <QBtn
+                    @click.stop="viewSummary(entity.id)"
-                        round
+                    round
-                        flat
+                    flat
-                        dense
+                    dense
-                        size="md"
+                    size="md"
-                        icon="view_list"
+                    icon="preview"
-                        color="white"
+                    color="white"
-                        class="link"
+                    class="link"
-                    >
+                    v-if="summary"
-                        <QTooltip>
+                >
-                            {{ t('components.cardDescriptor.mainList') }}
+                    <QTooltip>
-                        </QTooltip>
+                        {{ t('components.smartCard.openSummary') }}
-                    </QBtn>
+                    </QTooltip>
-                </RouterLink>
+                </QBtn>
                 <RouterLink :to="{ name: `${module}Summary`, params: { id: entity.id } }">
                     <QBtn
                         round
@@ -93,7 +107,6 @@ const emit = defineEmits(['onFetch']);
                         </QTooltip>
                     </QBtn>
                 </RouterLink>
-
                 <QBtn
                     v-if="slots.menu"
                     size="md"
@@ -216,8 +229,6 @@ const emit = defineEmits(['onFetch']);
     width: 256px;
     .header {
         display: flex;
-        justify-content: space-between;
-        align-items: stretch;
     }
     .icons {
         margin: 0 10px;

src/components/ui/CardList.vue

@@ -32,7 +32,7 @@ const $props = defineProps({
         gap: 2%;
         width: 50%;
         .label {
-            width: 30%;
+            width: 35%;
             color: var(--vn-label);
             overflow: hidden;
             text-overflow: ellipsis;

src/components/ui/VnLinkPhone.vue

@@ -0,0 +1,22 @@
+<script setup>
+import { useI18n } from 'vue-i18n';
+const props = defineProps({
+    phoneNumber: { type: [String, Number], default: null },
+});
+const { t } = useI18n();
+</script>
+<template>
+    <QBtn
+        v-if="props.phoneNumber"
+        flat
+        round
+        icon="phone"
+        size="sm"
+        color="primary"
+        padding="none"
+        :href="`sip:${props.phoneNumber}`"
+        :title="t('globals.microsip')"
+        @click.stop
+    />
+</template>
+<style scoped></style>

src/i18n/en/index.js

@@ -36,6 +36,7 @@ export default {
         summary: {
             basicData: 'Basic data',
         },
+        microsip: 'Open in MicroSIP',
         noSelectedRows: `You don't have any line selected`,
     },
     errors: {
@@ -449,6 +450,7 @@ export default {
             typesList: 'Types List',
             typeCreate: 'Create type',
             typeEdit: 'Edit type',
+            wagonCounter: 'Trolley counter',
         },
         type: {
             name: 'Name',

src/i18n/es/index.js

@@ -37,6 +37,7 @@ export default {
             basicData: 'Datos básicos',
         },
         noSelectedRows: `No tienes ninguna línea seleccionada`,
+        microsip: 'Abrir en MicroSIP',
     },
     errors: {
         statusUnauthorized: 'Acceso denegado',
@@ -449,6 +450,7 @@ export default {
             typesList: 'Listado tipos',
             typeCreate: 'Crear tipo',
             typeEdit: 'Editar tipo',
+            wagonCounter: 'Contador de carros',
         },
         type: {
             name: 'Nombre',

src/pages/Claim/Card/ClaimDescriptor.vue

@@ -7,6 +7,7 @@ import { useState } from 'src/composables/useState';
 
 import TicketDescriptorProxy from 'pages/Ticket/Card/TicketDescriptorProxy.vue';
 import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
+import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
 import ClaimDescriptorMenu from 'pages/Claim/Card/ClaimDescriptorMenu.vue';
 import CardDescriptor from 'components/ui/CardDescriptor.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
@@ -119,7 +120,7 @@ const setData = (entity) => {
                 <template #value>
                     <span class="link">
                         {{ entity.worker.user.name }}
-                        <WorkerDescriptorProxy :id="entity.worker.userFk" />
+                        <WorkerDescriptorProxy :id="entity.worker.user.id" />
                     </span>
                 </template>
             </VnLv>

src/pages/Claim/Card/ClaimLines.vue

@@ -46,7 +46,7 @@ async function onFetchClaim(data) {
 const amount = ref(0);
 const amountClaimed = ref(0);
 async function onFetch(rows) {
-    if (!rows || rows.length) return;
+    if (!rows || !rows.length) return;
     amount.value = rows.reduce(
         (acumulator, { sale }) => acumulator + sale.price * sale.quantity,
         0
@@ -155,7 +155,7 @@ function showImportDialog() {
 </script>
 <template>
     <Teleport to="#st-data" v-if="stateStore.isSubToolbarShown()">
-        <QToolbar class="bg-dark text-white">
+        <QToolbar>
             <div class="row q-gutter-md">
                 <div>
                     {{ t('Amount') }}

src/pages/Claim/Card/ClaimPhoto.vue

@@ -26,6 +26,7 @@ const client = ref({});
 const inputFile = ref();
 const files = ref({});
 
+const spinnerRef = ref();
 const claimDmsRef = ref();
 const dmsType = ref({});
 const config = ref({});
@@ -118,11 +119,11 @@ async function create() {
             clientId: client.value.id,
         }).toUpperCase(),
     };
-
+    spinnerRef.value.show();
     await axios.post(query, formData, {
         params: dms,
     });
-
+    spinnerRef.value.hide();
     quasar.notify({
         message: t('globals.dataSaved'),
         type: 'positive',
@@ -234,7 +235,9 @@ function onDrag() {
             </div>
         </div>
     </div>
-
+    <QDialog ref="spinnerRef">
+        <QSpinner color="primary" size="xl" />
+    </QDialog>
     <QPageSticky position="bottom-right" :offset="[25, 25]">
         <label for="fileInput">
             <QBtn fab @click="inputFile.nativeEl.click()" icon="add" color="primary">

src/pages/Claim/ClaimList.vue

@@ -5,12 +5,13 @@ import { useQuasar } from 'quasar';
 import { useStateStore } from 'stores/useStateStore';
 import { toDate } from 'filters/index';
 import VnPaginate from 'src/components/ui/VnPaginate.vue';
-import ClaimSummaryDialog from './Card/ClaimSummaryDialog.vue';
-import CustomerDescriptorProxy from 'pages/Customer/Card/CustomerDescriptorProxy.vue';
 import VnSearchbar from 'components/ui/VnSearchbar.vue';
 import ClaimFilter from './ClaimFilter.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 import CardList from 'src/components/ui/CardList.vue';
+import ClaimSummaryDialog from './Card/ClaimSummaryDialog.vue';
+import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
+import WorkerDescriptorProxy from '../Worker/Card/WorkerDescriptorProxy.vue';
 
 const stateStore = useStateStore();
 const router = useRouter();
@@ -37,6 +38,15 @@ function viewSummary(id) {
         },
     });
 }
+
+function viewDescriptor(id) {
+    quasar.dialog({
+        component: CustomerDescriptorProxy,
+        componentProps: {
+            id,
+        },
+    });
+}
 </script>
 
 <template>
@@ -86,14 +96,22 @@ function viewSummary(id) {
                     >
                         <template #list-items>
                             <VnLv label="ID" :value="row.id" />
-                            <VnLv
+                            <VnLv :label="t('claim.list.customer')" @click.stop>
-                                :label="t('claim.list.customer')"
+                                <template #value>
-                                :value="row.clientName"
+                                    <span class="link">
-                            />
+                                        {{ row.clientName }}
-                            <VnLv
+                                        <CustomerDescriptorProxy :id="row.clientFk" />
-                                :label="t('claim.list.assignedTo')"
+                                    </span>
-                                :value="row.workerName"
+                                </template>
-                            />
+                            </VnLv>
+                            <VnLv :label="t('claim.list.assignedTo')" @click.stop>
+                                <template #value>
+                                    <span class="link">
+                                        {{ row.workerName }}
+                                        <WorkerDescriptorProxy :id="row.workerFk" />
+                                    </span>
+                                </template>
+                            </VnLv>
                             <VnLv
                                 :label="t('claim.list.created')"
                                 :value="toDate(row.created)"
@@ -125,13 +143,6 @@ function viewSummary(id) {
                                     {{ t('components.smartCard.openSummary') }}
                                 </QTooltip>
                             </QBtn>
-                            <QBtn flat icon="vn:client" @click.stop>
-                                <QTooltip>
-                                    {{ t('components.smartCard.viewDescription') }}
-                                </QTooltip>
-
-                                <CustomerDescriptorProxy :id="row.clientFk" />
-                            </QBtn>
                         </template>
                     </CardList>
                 </template>

src/pages/Customer/Card/CustomerDescriptor.vue

@@ -14,6 +14,10 @@ const $props = defineProps({
         required: false,
         default: null,
     },
+    summary: {
+        type: Object,
+        default: null,
+    },
 });
 
 const route = useRoute();
@@ -34,6 +38,7 @@ const setData = (entity) => (data.value = useCardDescription(entity.name, entity
         :title="data.title"
         :subtitle="data.subtitle"
         @on-fetch="setData"
+        :summary="$props.summary"
         data-key="customerData"
     >
         <template #body="{ entity }">

src/pages/Customer/Card/CustomerDescriptorProxy.vue

@@ -1,5 +1,6 @@
 <script setup>
 import CustomerDescriptor from './CustomerDescriptor.vue';
+import CustomerSummaryDialog from './CustomerSummaryDialog.vue';
 
 const $props = defineProps({
     id: {
@@ -8,8 +9,13 @@ const $props = defineProps({
     },
 });
 </script>
+
 <template>
     <QPopupProxy>
-        <CustomerDescriptor v-if="$props.id" :id="$props.id" />
+        <CustomerDescriptor
+            v-if="$props.id"
+            :id="$props.id"
+            :summary="CustomerSummaryDialog"
+        />
     </QPopupProxy>
 </template>

src/pages/Customer/Card/CustomerSummary.vue

@@ -6,6 +6,7 @@ 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';
 
 const route = useRoute();
 const { t } = useI18n();
@@ -68,8 +69,18 @@ const creditWarning = computed(() => {
                 <VnLv :label="t('customer.summary.customerId')" :value="entity.id" />
                 <VnLv :label="t('customer.summary.name')" :value="entity.name" />
                 <VnLv :label="t('customer.summary.contact')" :value="entity.contact" />
-                <VnLv :label="t('customer.summary.phone')" :value="entity.phone" />
+                <VnLv :value="entity.phone">
-                <VnLv :label="t('customer.summary.mobile')" :value="entity.mobile" />
+                    <template #label>
+                        {{ t('customer.summary.phone') }}
+                        <VnLinkPhone :phone-number="entity.phone" />
+                    </template>
+                </VnLv>
+                <VnLv :value="entity.mobile">
+                    <template #label>
+                        {{ t('customer.summary.mobile') }}
+                        <VnLinkPhone :phone-number="entity.mobile" />
+                    </template>
+                </VnLv>
                 <VnLv :label="t('customer.summary.email')" :value="entity.email" />
                 <VnLv
                     :label="t('customer.summary.salesPerson')"

src/pages/Customer/CustomerList.vue

@@ -9,6 +9,7 @@ import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
 import CustomerFilter from './CustomerFilter.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 import CardList from 'src/components/ui/CardList.vue';
+import VnLinkPhone from 'src/components/ui/VnLinkPhone.vue';
 
 const stateStore = useStateStore();
 const router = useRouter();
@@ -77,7 +78,12 @@ function viewSummary(id) {
                         <template #list-items>
                             <VnLv label="ID" :value="row.id" />
                             <VnLv :label="t('customer.list.email')" :value="row.email" />
-                            <VnLv :label="t('customer.list.phone')" :value="row.phone" />
+                            <VnLv :value="row.phone">
+                                <template #label>
+                                    {{ t('customer.list.phone') }}
+                                    <VnLinkPhone :phone-number="row.phone" />
+                                </template>
+                            </VnLv>
                         </template>
                         <template #actions>
                             <QBtn

src/pages/Ticket/Card/TicketSummary.vue

@@ -10,6 +10,7 @@ import FetchedTags from 'components/ui/FetchedTags.vue';
 import InvoiceOutDescriptorProxy from 'pages/InvoiceOut/Card/InvoiceOutDescriptorProxy.vue';
 import WorkerDescriptorProxy from 'pages/Worker/Card/WorkerDescriptorProxy.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
+import VnLinkPhone from 'src/components/ui/VnLinkPhone.vue';
 import { getUrl } from 'src/composables/getUrl';
 
 onUpdated(() => summaryRef.value.fetch());
@@ -172,7 +173,7 @@ async function changeState(value) {
                     :label="t('ticket.summary.agency')"
                     :value="ticket.agencyMode.name"
                 />
-                <VnLv :label="t('ticket.summary.zone')" :value="ticket.zone.name" />
+                <VnLv :label="t('ticket.summary.zone')" :value="ticket?.zone?.name" />
                 <VnLv
                     :label="t('ticket.summary.warehouse')"
                     :value="ticket.warehouse?.name"
@@ -180,7 +181,7 @@ async function changeState(value) {
                 <VnLv :label="t('ticket.summary.route')" :value="ticket.routeFk" />
                 <VnLv :label="t('ticket.summary.invoice')">
                     <template #value>
-                        <span class="link">
+                        <span :class="{ link: ticket.refFk }">
                             {{ dashIfEmpty(ticket.refFk) }}
                             <InvoiceOutDescriptorProxy
                                 :id="ticket.id"
@@ -208,22 +209,30 @@ async function changeState(value) {
                     :value="toDate(ticket.landed)"
                 />
                 <VnLv :label="t('ticket.summary.packages')" :value="ticket.packages" />
-                <VnLv
+                <VnLv :value="ticket.address.phone">
-                    :label="t('ticket.summary.consigneePhone')"
+                    <template #label>
-                    :value="ticket.address.phone"
+                        {{ t('ticket.summary.consigneePhone') }}
-                />
+                        <VnLinkPhone :phone-number="ticket.address.phone" />
-                <VnLv
+                    </template>
-                    :label="t('ticket.summary.consigneeMobile')"
+                </VnLv>
-                    :value="ticket.address.mobile"
+                <VnLv :value="ticket.address.mobile">
-                />
+                    <template #label>
-                <VnLv
+                        {{ t('ticket.summary.consigneeMobile') }}
-                    :label="t('ticket.summary.clientPhone')"
+                        <VnLinkPhone :phone-number="ticket.address.mobile" />
-                    :value="ticket.client.phone"
+                    </template>
-                />
+                </VnLv>
-                <VnLv
+                <VnLv :value="ticket.client.phone">
-                    :label="t('ticket.summary.clientMobile')"
+                    <template #label>
-                    :value="ticket.client.mobile"
+                        {{ t('ticket.summary.clientPhone') }}
-                />
+                        <VnLinkPhone :phone-number="ticket.client.phone" />
+                    </template>
+                </VnLv>
+                <VnLv :value="ticket.client.mobile">
+                    <template #label>
+                        {{ t('ticket.summary.clientMobile') }}
+                        <VnLinkPhone :phone-number="ticket.client.mobile" />
+                    </template>
+                </VnLv>
                 <VnLv
                     :label="t('ticket.summary.consignee')"
                     :value="formattedAddress()"

src/pages/Wagon/WagonCounter.vue

@@ -0,0 +1,154 @@
+<script setup>
+import { ref, onMounted } from 'vue';
+import { useSession } from 'src/composables/useSession';
+import { useI18n } from 'vue-i18n';
+import { useQuasar } from 'quasar';
+import VnConfirm from 'components/ui/VnConfirm.vue';
+
+const quasar = useQuasar();
+const { t } = useI18n();
+const session = useSession();
+const token = session.getToken();
+
+const counters = ref({
+    alquilerBandeja: { count: 0, id: 96001, title: 'CC Bandeja', isTray: true },
+    bandejaRota: { count: 0, id: 88381, title: 'CC Bandeja Rota', isTray: true },
+    carryOficial: { count: 0, id: 96000, title: 'CC Carry OFICIAL TAG5' },
+    candadoRojo: { count: 0, id: 96002, title: 'CC Carry NO OFICIAL' },
+    sacadores: { count: 0, id: 142260, title: 'CC Sacadores' },
+    sinChapa: { count: 0, id: 2214, title: 'DC Carry Sin Placa CC' },
+    carroRoto: { count: 0, id: 142251, title: 'Carro Roto' },
+});
+
+const actions = {
+    add: (counter) => counter + 1,
+    subtract: (counter) => (counter ? counter - 1 : 0),
+    flush: () => 0,
+    addSpecific: (counter, amount) => counter + amount,
+};
+
+onMounted(() => {
+    const types = Object.keys(counters.value);
+    for (let type of types) {
+        const counter = localStorage.getItem(type);
+        counters.value[type].count = counter ? parseInt(counter) : 0;
+    }
+});
+
+function getUrl(id) {
+    return `/api/Images/catalog/200x200/${id}/download?access_token=${token}`;
+}
+
+async function handleEvent(type, action, amount) {
+    const counter = counters.value[type].count;
+    let isOk = true;
+
+    if (action == 'flush') isOk = await confirm();
+
+    if (isOk) {
+        counters.value[type].count = actions[action](counter, amount);
+        localStorage.setItem(type, counters.value[type].count);
+    }
+}
+
+function confirm() {
+    return new Promise((resolve) => {
+        quasar
+            .dialog({
+                component: VnConfirm,
+                componentProps: {
+                    title: t('Are you sure?'),
+                    message: t('The counter will be reset to zero'),
+                },
+            })
+            .onOk(() => resolve(true))
+            .onCancel(() => resolve(false));
+    });
+}
+</script>
+<template>
+    <QList class="row q-mx-auto q-mt-xl">
+        <QItem v-for="(props, name) in counters" :key="name" class="col-6">
+            <QItemSection>
+                <QImg
+                    :src="getUrl(props.id)"
+                    width="130px"
+                    @click="handleEvent(name, 'add')"
+                />
+                <p class="title">{{ props.title }}</p>
+            </QItemSection>
+            <QItemSection class="q-ma-none">
+                <QItemLabel class="text-h4">
+                    {{ props.count }}
+                </QItemLabel>
+                <QItemLabel>
+                    <QBtn
+                        class="text-center q-mr-xs"
+                        color="warning"
+                        dense
+                        size="sm"
+                        v-if="props.isTray"
+                        @click="handleEvent(name, 'addSpecific', 30)"
+                    >
+                        {{ t('Add 30') }}
+                    </QBtn>
+                    <QBtn
+                        class="text-center q-mr-xs"
+                        color="warning"
+                        dense
+                        size="sm"
+                        v-else
+                        @click="handleEvent(name, 'addSpecific', 10)"
+                    >
+                        {{ t('Add 10') }}
+                    </QBtn>
+                </QItemLabel>
+                <QItemLabel>
+                    <QBtn
+                        class="text-center q-mr-xs"
+                        color="warning"
+                        dense
+                        size="sm"
+                        @click="handleEvent(name, 'subtract')"
+                    >
+                        {{ t('Subtract 1') }}
+                    </QBtn>
+                    <QBtn
+                        class="text-center q-ml-xs"
+                        color="red"
+                        dense
+                        size="sm"
+                        @click="handleEvent(name, 'flush')"
+                    >
+                        {{ t('Flush') }}
+                    </QBtn>
+                </QItemLabel>
+            </QItemSection>
+            <QSeparator class="q-mt-sm q-mx-none" color="primary" />
+        </QItem>
+    </QList>
+</template>
+<style lang="scss" scoped>
+.q-list {
+    max-width: 50em;
+}
+@media (max-width: $breakpoint-sm) {
+    .q-item {
+        display: flex;
+        flex-direction: column;
+    }
+    .title {
+        min-height: 3em;
+    }
+}
+</style>
+<i18n>
+es:
+    Subtract 1: Quitar 1
+    Add 30: Añadir 30
+    Add 10: Añadir 10
+    Flush: Vaciar
+    Are you sure?: ¿Estás seguro?
+    It will set to 0: Se pondrá a 0
+    The counter will be reset to zero: Se pondrá el contador a cero
+</i18n>

src/pages/Worker/Card/WorkerDescriptor.vue

@@ -5,13 +5,19 @@ import { useI18n } from 'vue-i18n';
 import { useSession } from 'src/composables/useSession';
 import CardDescriptor from 'src/components/ui/CardDescriptor.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
+import VnLinkPhone from 'src/components/ui/VnLinkPhone.vue';
 import useCardDescription from 'src/composables/useCardDescription';
+
 const $props = defineProps({
     id: {
         type: Number,
         required: false,
         default: null,
     },
+    summary: {
+        type: Object,
+        default: null,
+    },
 });
 
 const route = useRoute();
@@ -51,7 +57,7 @@ const sip = computed(() => worker.value?.sip && worker.value.sip.extension);
 
 function getWorkerAvatar() {
     const token = getToken();
-    return `/api/Images/user/160x160/${route.params.id}/download?access_token=${token}`;
+    return `/api/Images/user/160x160/${entityId.value}/download?access_token=${token}`;
 }
 const data = ref(useCardDescription());
 const setData = (entity) => {
@@ -67,6 +73,7 @@ const setData = (entity) => {
         :filter="filter"
         :title="data.title"
         :subtitle="data.subtitle"
+        :summary="$props.summary"
         @on-fetch="
             (data) => {
                 worker = data;
@@ -99,8 +106,18 @@ const setData = (entity) => {
                 :label="t('worker.list.department')"
                 :value="entity.department ? entity.department.department.name : null"
             />
-            <VnLv :label="t('worker.card.phone')" :value="entity.phone" />
+            <VnLv :value="entity.phone">
-            <VnLv :label="t('worker.summary.sipExtension')" :value="sip" />
+                <template #label>
+                    {{ t('worker.card.phone') }}
+                    <VnLinkPhone :phone-number="entity.phone" />
+                </template>
+            </VnLv>
+            <VnLv :value="sip">
+                <template #label>
+                    {{ t('worker.summary.sipExtension') }}
+                    <VnLinkPhone v-if="sip" :phone-number="sip" />
+                </template>
+            </VnLv>
         </template>
     </CardDescriptor>
 </template>

src/pages/Worker/Card/WorkerDescriptorProxy.vue

@@ -1,5 +1,6 @@
 <script setup>
 import WorkerDescriptor from './WorkerDescriptor.vue';
+import WorkerSummaryDialog from './WorkerSummaryDialog.vue';
 
 const $props = defineProps({
     id: {
@@ -11,6 +12,10 @@ const $props = defineProps({
 
 <template>
     <QPopupProxy>
-        <WorkerDescriptor v-if="$props.id" :id="$props.id" />
+        <WorkerDescriptor
+            v-if="$props.id"
+            :id="$props.id"
+            :summary="WorkerSummaryDialog"
+        />
     </QPopupProxy>
 </template>

src/pages/Worker/Card/WorkerSummary.vue

@@ -7,6 +7,7 @@ import { getUrl } from 'src/composables/getUrl';
 import VnLv from 'src/components/ui/VnLv.vue';
 import WorkerDescriptorProxy from './WorkerDescriptorProxy.vue';
 import { dashIfEmpty } from 'src/filters';
+import VnLinkPhone from 'src/components/ui/VnLinkPhone.vue';
 
 const route = useRoute();
 const { t } = useI18n();
@@ -91,15 +92,24 @@ const filter = {
                         </span>
                     </template>
                 </VnLv>
-                <VnLv
+                <VnLv :value="worker.mobileExtension">
-                    :label="t('worker.summary.phoneExtension')"
+                    <template #label>
-                    :value="worker.mobileExtension"
+                        {{ t('worker.summary.phoneExtension') }}
-                />
+                        <VnLinkPhone :phone-number="worker.mobileExtension" />
-                <VnLv :label="t('worker.summary.entPhone')" :value="worker.phone" />
+                    </template>
-                <VnLv
+                </VnLv>
-                    :label="t('worker.summary.personalPhone')"
+                <VnLv :value="worker.phone">
-                    :value="worker.client.phone"
+                    <template #label>
-                />
+                        {{ t('worker.summary.entPhone') }}
+                        <VnLinkPhone :phone-number="worker.phone" />
+                    </template>
+                </VnLv>
+                <VnLv :value="worker.client.phone">
+                    <template #label>
+                        {{ t('worker.summary.personalPhone') }}
+                        <VnLinkPhone :phone-number="worker.client.phone" />
+                    </template>
+                </VnLv>
                 <VnLv :label="t('worker.summary.locker')" :value="worker.locker" />
             </QCard>
             <QCard class="vn-one">
@@ -109,10 +119,12 @@ const filter = {
                 <VnLv :label="t('worker.summary.userId')" :value="worker.user.id" />
                 <VnLv :label="t('worker.card.name')" :value="worker.user.nickname" />
                 <VnLv :label="t('worker.summary.role')" :value="worker.user.role.name" />
-                <VnLv
+                <VnLv :value="worker?.sip?.extension">
-                    :label="t('worker.summary.sipExtension')"
+                    <template #label>
-                    :value="worker?.sip?.extension"
+                        {{ t('worker.summary.sipExtension') }}
-                />
+                        <VnLinkPhone :phone-number="worker?.sip?.extension" />
+                    </template>
+                </VnLv>
             </QCard>
         </template>
     </CardSummary>

src/router/modules/wagon.js

@@ -10,7 +10,7 @@ export default {
     component: RouterView,
     redirect: { name: 'WagonMain' },
     menus: {
-        main: ['WagonList', 'WagonTypeList'],
+        main: ['WagonList', 'WagonTypeList', 'WagonCounter'],
         card: [],
     },
     children: [
@@ -47,6 +47,15 @@ export default {
                     },
                     component: () => import('src/pages/Wagon/WagonCreate.vue'),
                 },
+                {
+                    path: 'counter',
+                    name: 'WagonCounter',
+                    meta: {
+                        title: 'wagonCounter',
+                        icon: 'add_circle',
+                    },
+                    component: () => import('src/pages/Wagon/WagonCounter.vue'),
+                },
             ],
         },
         {

test/cypress/integration/claimNotes.spec.js

@@ -7,7 +7,7 @@ describe('ClaimNotes', () => {
 
     it('should add a new note', () => {
         const message = 'This is a new message.';
-        cy.get('.q-page-sticky button').click();
+        cy.get('.q-page-sticky > div > button').click();
         cy.get('.q-dialog .q-card__section:nth-child(2)').type(message);
         cy.get('.q-card__actions button:nth-child(2)').click();
         cy.get('.q-card .q-card__section:nth-child(2)')

test/cypress/integration/ticketBoxing.spec.js

@@ -17,18 +17,4 @@ describe('TicketBoxing', () => {
         cy.get('div[class="q-item__label text-h6"]').eq(0).click();
         cy.get('.q-notification__message').should('have.text', 'No videos available');
     });
-
-    it('should show select time and video if have video list', () => {
-        cy.intercept(
-            {
-                method: 'GET',
-                url: '/api/Boxings/*',
-            },
-            ['2022-01-01T01-01-00.mp4', '2022-02-02T02-02-00.mp4', '2022-03-03T03-03-00.mp4']
-        ).as('getVideoList');
-        cy.get('.q-list').eq(3).find('.q-item').eq(2).click();
-
-        cy.get('.q-list').eq(3).find('.q-item').eq(0).find('.q-range');
-        cy.get('.q-list').eq(3).find('.q-item').eq(1).find('.q-select');
-    });
 });