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

package.json

@@ -35,7 +35,7 @@
         "@quasar/quasar-app-extension-testing-unit-vitest": "^0.4.0",
         "@vue/test-utils": "^2.4.4",
         "autoprefixer": "^10.4.14",
-        "cypress": "^12.13.0",
+        "cypress": "^13.6.6",
         "eslint": "^8.41.0",
         "eslint-config-prettier": "^8.8.0",
         "eslint-plugin-cypress": "^2.13.3",

pnpm-lock.yaml

@@ -59,8 +59,8 @@ devDependencies:
     specifier: ^10.4.14
     version: 10.4.17(postcss@8.4.35)
   cypress:
-    specifier: ^12.13.0
+    specifier: ^13.6.6
-    version: 12.17.4
+    version: 13.6.6
   eslint:
     specifier: ^8.41.0
     version: 8.56.0
@@ -124,8 +124,8 @@ packages:
     resolution: {integrity: sha512-RpfLEtTlyIxeNPGKcokS+p3BZII/Q3bYxryFRglh5H3A3T8q9fsLYm72VYAMEOOIBLEa8o93kFLiBDUWKrwXZA==}
     dev: true
 
-  /@cypress/request@2.88.12:
+  /@cypress/request@3.0.1:
-    resolution: {integrity: sha512-tOn+0mDZxASFM+cuAP9szGUGPI1HwWVSvdzm7V4cCsPdFTx6qMj29CwaQmRAMIEhORIUBFBsYROYJcveK4uOjA==}
+    resolution: {integrity: sha512-TWivJlJi8ZDx2wGOw1dbLuHJKUYX7bWySw377nlnGOW3hP9/MUKIsEdXT/YngWxVdgNCHRBmFlBipE+5/2ZZlQ==}
     engines: {node: '>= 6'}
     dependencies:
       aws-sign2: 0.7.0
@@ -1228,10 +1228,6 @@ packages:
       '@types/node': 20.11.19
     dev: false
 
-  /@types/node@16.18.82:
-    resolution: {integrity: sha512-pcDZtkx9z8XYV+ius2P3Ot2VVrcYOfXffBQUBuiszrlUzKSmoDYqo+mV+IoL8iIiIjjtOMvNSmH1hwJ+Q+f96Q==}
-    dev: true
-
   /@types/node@20.11.19:
     resolution: {integrity: sha512-7xMnVEcZFu0DikYjWOlRq7NTPETrm7teqUT2WkQjrTIkEgUyyGdWsj/Zg8bEJt5TNklzbPD1X3fqfsHw3SpapQ==}
     dependencies:
@@ -2248,15 +2244,14 @@ packages:
   /csstype@3.1.3:
     resolution: {integrity: sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==}
 
-  /cypress@12.17.4:
+  /cypress@13.6.6:
-    resolution: {integrity: sha512-gAN8Pmns9MA5eCDFSDJXWKUpaL3IDd89N9TtIupjYnzLSmlpVr+ZR+vb4U/qaMp+lB6tBvAmt7504c3Z4RU5KQ==}
+    resolution: {integrity: sha512-S+2S9S94611hXimH9a3EAYt81QM913ZVA03pUmGDfLTFa5gyp85NJ8dJGSlEAEmyRsYkioS1TtnWtbv/Fzt11A==}
-    engines: {node: ^14.0.0 || ^16.0.0 || >=18.0.0}
+    engines: {node: ^16.0.0 || ^18.0.0 || >=20.0.0}
     hasBin: true
     requiresBuild: true
     dependencies:
-      '@cypress/request': 2.88.12
+      '@cypress/request': 3.0.1
       '@cypress/xvfb': 1.2.4(supports-color@8.1.1)
-      '@types/node': 16.18.82
       '@types/sinonjs__fake-timers': 8.1.1
       '@types/sizzle': 2.3.8
       arch: 2.2.0

quasar.config.js

@@ -67,7 +67,7 @@ module.exports = configure(function (/* ctx */) {
             // analyze: true,
             // env: {},
             rawDefine: {
-                'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV)
+                'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),
             },
             // ignorePublicFolder: true,
             // minify: false,
@@ -92,7 +92,7 @@ module.exports = configure(function (/* ctx */) {
             vitePlugins: [
                 [
                     VueI18nPlugin({
-                        runtimeOnly: false
+                        runtimeOnly: false,
                     }),
                     {
                         // if you want to use Vue I18n Legacy API, you need to set `compositionOnly: false`
@@ -123,9 +123,6 @@ module.exports = configure(function (/* ctx */) {
         framework: {
             config: {
                 config: {
-                    brand: {
-                        primary: 'orange',
-                    },
                     dark: 'auto',
                 },
             },

src/components/common/VnLog.vue

@@ -1046,7 +1046,7 @@ es:
     tooltips:
         search: Buscar por identificador o concepto
         changes: Buscar por cambios. Los atributos deben buscarse por su nombre interno, para obtenerlo situar el cursor sobre el atributo.
-    Audit logs: Registros de auditoría
+    Audit logs: Historial
     Property: Propiedad
     Before: Antes
     After: Después

src/components/ui/CardDescriptor.vue

@@ -171,6 +171,7 @@ const emit = defineEmits(['onFetch']);
 
 <style lang="scss">
 .body {
+    background-color: var(--vn-gray);
     .text-h5 {
         padding-top: 5px;
         padding-bottom: 5px;
@@ -188,7 +189,8 @@ const emit = defineEmits(['onFetch']);
         .label {
             color: var(--vn-label);
             font-size: 12px;
-            ::after {
+
+            &:not(:has(a))::after {
                 content: ':';
             }
         }
@@ -223,8 +225,6 @@ const emit = defineEmits(['onFetch']);
     margin-bottom: 15px;
 }
 .list-box {
-    background-color: var(--vn-gray);
-
     .q-item__label {
         color: var(--vn-label);
     }

src/components/ui/CardSummary.vue

@@ -46,7 +46,7 @@ watch(props, async () => {
         <QCard class="cardSummary">
             <SkeletonSummary v-if="!entity" />
             <template v-if="entity">
-                <div class="summaryHeader bg-primary q-pa-md text-weight-bolder">
+                <div class="summaryHeader bg-primary q-pa-sm text-weight-bolder">
                     <slot name="header-left">
                         <span></span>
                     </slot>
@@ -85,8 +85,8 @@ watch(props, async () => {
         flex-direction: row;
         flex-wrap: wrap;
         justify-content: space-evenly;
-        gap: 15px;
+        gap: 10px;
-        padding: 15px;
+        padding: 10px;
         background-color: var(--vn-gray);
 
         > .q-card.vn-one {
@@ -105,14 +105,14 @@ watch(props, async () => {
         > .q-card {
             width: 100%;
             background-color: var(--vn-gray);
-            padding: 15px;
+            padding: 7px;
             font-size: 16px;
             min-width: 275px;
 
             .vn-label-value {
                 display: flex;
                 flex-direction: row;
-                margin-top: 5px;
+                margin-top: 2px;
                 .label {
                     color: var(--vn-label);
                     width: 8em;
@@ -131,13 +131,27 @@ watch(props, async () => {
             .header {
                 color: $primary;
                 font-weight: bold;
-                margin-bottom: 25px;
+                margin-bottom: 10px;
                 font-size: 20px;
                 display: inline-block;
             }
             .header.link:hover {
                 color: lighten($primary, 20%);
             }
+            .q-checkbox {
+                display: flex;
+                margin-bottom: 9px;
+                & .q-checkbox__label {
+                    margin-left: 25px;
+                    color: var(--vn-text);
+                }
+                & .q-checkbox__inner {
+                    position: absolute;
+                    left: 0;
+                    margin-left: 5px;
+                    color: var(--vn-label);
+                }
+            }
         }
     }
 

src/components/ui/VnLv.vue

@@ -1,5 +1,4 @@
 <script setup>
-import { computed } from 'vue';
 import { dashIfEmpty } from 'src/filters';
 import { useI18n } from 'vue-i18n';
 import { useClipboard } from 'src/composables/useClipboard';
@@ -16,7 +15,6 @@ const $props = defineProps({
 });
 
 const { t } = useI18n();
-const isBooleanValue = computed(() => typeof $props.value === 'boolean');
 const { copyText } = useClipboard();
 
 function copyValueText() {
@@ -42,14 +40,7 @@ function copyValueText() {
             </slot>
         </div>
         <div class="value">
-            <span v-if="isBooleanValue">
+            <slot name="value">
-                <QIcon
-                    :name="$props.value ? `check` : `close`"
-                    :color="$props.value ? `positive` : `negative`"
-                    size="sm"
-                />
-            </span>
-            <slot v-else name="value">
                 <span :title="$props.value">
                     {{ $props.dash ? dashIfEmpty($props.value) : $props.value }}
                 </span>

src/components/ui/VnNotes.vue

@@ -8,7 +8,6 @@ import VnPaginate from './VnPaginate.vue';
 import VnUserLink from '../ui/VnUserLink.vue';
 
 const $props = defineProps({
-    id: { type: String, required: true },
     url: { type: String, default: null },
     filter: { type: Object, default: () => {} },
     body: { type: Object, default: () => {} },
@@ -28,7 +27,7 @@ async function insert() {
 }
 </script>
 <template>
-    <div class="column items-center full-height">
+    <div class="column items-center full-height full-width">
         <VnPaginate
             :data-key="$props.url"
             :url="$props.url"
@@ -39,28 +38,38 @@ async function insert() {
             ref="vnPaginateRef"
         >
             <template #body="{ rows }">
-                <QCard class="q-pa-xs q-mb-md" v-for="(note, index) in rows" :key="index">
+                <div class="column items-center full-width">
-                    <QCardSection horizontal>
+                    <QCard
-                        <slot name="picture">
+                        class="q-pa-xs q-mb-sm full-width"
-                            <VnAvatar :descriptor="false" :worker-id="note.workerFk" />
+                        v-for="(note, index) in rows"
-                        </slot>
+                        :key="index"
-                        <QItem class="full-width justify-between items-start">
+                    >
-                            <VnUserLink
+                        <QCardSection horizontal>
-                                :name="`${note.worker.user.nickname}`"
+                            <slot name="picture">
-                                :worker-id="note.worker.id"
+                                <VnAvatar
-                            />
+                                    :descriptor="false"
-
+                                    :worker-id="note.workerFk"
-                            <slot name="actions">
+                                    size="md"
-                                {{ toDateHour(note.created) }}
+                                />
                             </slot>
-                        </QItem>
+                            <div class="full-width row justify-between q-pa-xs">
-                    </QCardSection>
+                                <VnUserLink
-                    <QCardSection class="q-pa-sm">
+                                    :name="`${note.worker.user.nickname}`"
-                        <slot name="text">
+                                    :worker-id="note.worker.id"
-                            {{ note.text }}
+                                />
-                        </slot>
+
-                    </QCardSection>
+                                <slot name="actions">
-                </QCard>
+                                    {{ toDateHour(note.created) }}
+                                </slot>
+                            </div>
+                        </QCardSection>
+                        <QCardSection class="q-pa-xs q-my-none q-py-none">
+                            <slot name="text">
+                                {{ note.text }}
+                            </slot>
+                        </QCardSection>
+                    </QCard>
+                </div>
             </template>
         </VnPaginate>
         <QPageSticky position="bottom-right" :offset="[25, 25]" v-if="addNote">
@@ -108,8 +117,10 @@ async function insert() {
 </template>
 <style lang="scss" scoped>
 .q-card {
-    max-width: 80em;
+    width: 90%;
-
+    @media (max-width: $breakpoint-sm) {
+        width: 100%;
+    }
     &__section {
         word-wrap: break-word;
     }

src/components/ui/VnPaginate.vue

@@ -138,7 +138,7 @@ async function onLoad(...params) {
 </script>
 
 <template>
-    <div>
+    <div class="full-width">
         <div
             v-if="!props.autoLoad && !store.data && !isLoading"
             class="info-row q-pa-md text-center"
@@ -175,6 +175,7 @@ async function onLoad(...params) {
         @load="onLoad"
         :offset="offset"
         class="full-width full-height"
+        v-bind="$attrs"
     >
         <slot name="body" :rows="store.data"></slot>
         <div v-if="isLoading" class="info-row q-pa-md text-center">

src/components/ui/VnSearchbar.vue

@@ -81,8 +81,9 @@ onMounted(() => {
 });
 
 async function search() {
-    const staticParams = Object.entries(store.userParams)
+    const staticParams = Object.entries(store.userParams).filter(
-        .filter(([key, value]) => value && (props.staticParams || []).includes(key));
+        ([key, value]) => value && (props.staticParams || []).includes(key)
+    );
     await arrayData.applyFilter({
         params: {
             ...Object.fromEntries(staticParams),
@@ -155,11 +156,9 @@ async function search() {
 .cursor-info {
     cursor: help;
 }
-
+#searchbar {
-.body--light #searchbar {
     .q-field--standout.q-field--highlighted .q-field__control {
-        background-color: $grey-7;
+        background-color: var(--vn-text);
-        color: #333;
     }
 }
 </style>

src/composables/useCardSize.js

@@ -0,0 +1,7 @@
+import { useQuasar } from 'quasar';
+
+export default function() {
+    const quasar = useQuasar();
+   return quasar.screen.gt.xs ? 'q-pa-md': 'q-pa-xs';
+
+}

src/css/app.scss

@@ -1,17 +1,58 @@
 // app global css in SCSS form
 @import './icons.scss';
 
+body.body--light {
+    --fount-color: black;
+    --vn-sectionColor: #ffffff;
+    --vn-pageColor: #e0e0e0;
+    background-color: var(--vn-pageColor);
+    .q-header .q-toolbar {
+        color: var(--fount-color);
+    }
+    --vn-text: var(--fount-color);
+    --vn-gray: var(--vn-sectionColor);
+    --vn-label: #5f5f5f;
+    --vn-dark: var(--vn-sectionColor);
+    --vn-light-gray: #e7e3e3;
+}
+
+body.body--dark {
+    --vn-pageColor: #222;
+    --vn-SectionColor: #3c3b3b;
+    background-color: var(--vn-pageColor);
+    --vn-text: white;
+    --vn-gray: var(--vn-SectionColor);
+    --vn-label: #a8a8a8;
+    --vn-dark: var(--vn-SectionColor);
+    --vn-light-gray: #424242;
+}
+
 a {
     text-decoration: none;
 }
 
 .link {
-    color: $primary;
+    color: $color-link;
     cursor: pointer;
 }
 
+.tx-color-link {
+    color: $color-link !important;
+}
+
+.header-link {
+    color: $color-link !important;
+    cursor: pointer;
+    border-bottom: solid $primary;
+    border-width: 2px;
+    width: 100%;
+    .q-icon {
+        float: right;
+    }
+}
+
 .link:hover {
-    color: $orange-4;
+    text-decoration: underline;
 }
 
 // Removes chrome autofill background
@@ -24,26 +65,6 @@ select:-webkit-autofill {
     background-clip: text !important;
 }
 
-body.body--light {
-    .q-header .q-toolbar {
-        background-color: $white;
-        color: #555;
-    }
-    --vn-text: #000000;
-    --vn-gray: #f5f5f5;
-    --vn-label: #5f5f5f;
-    --vn-dark: white;
-    --vn-light-gray: #e7e3e3;
-}
-
-body.body--dark {
-    --vn-text: #ffffff;
-    --vn-gray: #313131;
-    --vn-label: #a8a8a8;
-    --vn-dark: #292929;
-    --vn-light-gray: #424242;
-}
-
 .bg-vn-dark {
     background-color: var(--vn-dark);
 }

src/css/icons.scss

@@ -1,10 +1,10 @@
 @font-face {
   font-family: 'icon';
-  src:  url('fonts/icon.eot?7zbcv0');
+  src:  url('fonts/icon.eot?2omjsr');
-  src:  url('fonts/icon.eot?7zbcv0#iefix') format('embedded-opentype'),
+  src:  url('fonts/icon.eot?2omjsr#iefix') format('embedded-opentype'),
-    url('fonts/icon.ttf?7zbcv0') format('truetype'),
+    url('fonts/icon.ttf?2omjsr') format('truetype'),
-    url('fonts/icon.woff?7zbcv0') format('woff'),
+    url('fonts/icon.woff?2omjsr') format('woff'),
-    url('fonts/icon.svg?7zbcv0#icon') format('svg');
+    url('fonts/icon.svg?2omjsr#icon') format('svg');
   font-weight: normal;
   font-style: normal;
   font-display: block;
@@ -28,6 +28,9 @@
 .icon-100:before {
   content: "\e926";
 }
+.icon-Client_unpaid:before {
+  content: "\e925";
+}
 .icon-History:before {
   content: "\e964";
 }
@@ -46,9 +49,15 @@
 .icon-addperson:before {
   content: "\e929";
 }
+.icon-agency:before {
+  content: "\e92a";
+}
 .icon-agency-term:before {
   content: "\e92b";
 }
+.icon-albaran:before {
+  content: "\e92c";
+}
 .icon-anonymous:before {
   content: "\e92d";
 }
@@ -172,6 +181,9 @@
 .icon-funeral:before {
   content: "\e95f";
 }
+.icon-grafana:before {
+  content: "\e931";
+}
 .icon-greenery:before {
   content: "\e91e";
 }
@@ -355,6 +367,9 @@
 .icon-traceability:before {
   content: "\e919";
 }
+.icon-transaction:before {
+  content: "\e93b";
+}
 .icon-treatments:before {
   content: "\e91c";
 }

src/css/quasar.variables.scss

@@ -11,26 +11,32 @@
 // It's highly recommended to change the default colors
 // to match your app's branding.
 // Tip: Use the "Theme Builder" on Quasar's documentation website.
-
+// Tip: to add new colors https://quasar.dev/style/color-palette/#adding-your-own-colors
 $primary: #ec8916;
-$primary-light: lighten($primary, 35%);
+$secondary: $primary;
-$secondary: #26a69a;
-$accent: #9c27b0;
-$white: #fff;
-
 $positive: #21ba45;
 $negative: #c10015;
 $info: #31ccec;
 $warning: #f2c037;
-$vnColor: #8ebb27;
-
 // Pendiente de cuadrar con la base de datos
 $success: $positive;
 $alert: $negative;
+$white: #fff;
+$dark: #3c3b3b;
+// custom
+$color-link: #66bfff;
+$color-spacer-light: #a3a3a31f;
+$color-spacer: #7979794d;
+$border-thin-light: 1px solid $color-spacer-light;
+$primary-light: lighten($primary, 35%);
+$dark-shadow-color: black;
+$layout-shadow-dark: 0 0 10px 2px #00000033, 0 0px 10px #0000003d;
+$spacing-md: 16px;
 
 .bg-success {
     background-color: $positive;
 }
+
 .bg-notice {
     background-color: $info;
 }
@@ -40,12 +46,3 @@ $alert: $negative;
 .bg-alert {
     background-color: $negative;
 }
-
-$color-spacer-light: rgba(255, 255, 255, 0.12);
-$color-spacer: rgba(255, 255, 255, 0.3);
-$border-thin-light: 1px solid $color-spacer-light;
-
-$dark-shadow-color: #000;
-$dark: #292929;
-$layout-shadow-dark: 0 0 10px 2px rgba(0, 0, 0, 0.2), 0 0px 10px rgba(0, 0, 0, 0.24);
-$spacing-md: 16px;

src/i18n/en/index.js

@@ -83,6 +83,7 @@ export default {
         file: 'File',
         selectFile: 'Select a file',
         copyClipboard: 'Copy on clipboard',
+        salesPerson: 'SalesPerson',
     },
     errors: {
         statusUnauthorized: 'Access denied',
@@ -173,6 +174,7 @@ export default {
             hasDebt: 'Customer has debt',
             notChecked: 'Customer not checked',
             noWebAccess: 'Web access is disabled',
+            businessTypeFk: 'Business type',
         },
         summary: {
             basicData: 'Basic data',
@@ -439,6 +441,7 @@ export default {
             shipped: 'Shipped',
             warehouse: 'Warehouse',
             customerCard: 'Customer card',
+            alias: 'Alias',
         },
         boxing: {
             expedition: 'Expedition',
@@ -548,6 +551,8 @@ export default {
             ticketId: 'Ticket ID',
             customerSummary: 'Customer summary',
             claimedTicket: 'Claimed ticket',
+            saleTracking: 'Sale tracking',
+            ticketTracking: 'Ticket tracking',
             commercial: 'Commercial',
             province: 'Province',
             zone: 'Zone',

src/i18n/es/index.js

@@ -83,6 +83,7 @@ export default {
         file: 'Fichero',
         selectFile: 'Seleccione un fichero',
         copyClipboard: 'Copiar en portapapeles',
+        salesPerson: 'Comercial',
     },
     errors: {
         statusUnauthorized: 'Acceso denegado',
@@ -172,6 +173,7 @@ export default {
             hasDebt: 'El cliente tiene riesgo',
             notChecked: 'El cliente no está comprobado',
             noWebAccess: 'El acceso web está desactivado',
+            businessTypeFk: 'Tipo de negocio',
         },
         summary: {
             basicData: 'Datos básicos',
@@ -438,6 +440,7 @@ export default {
             shipped: 'Enviado',
             warehouse: 'Almacén',
             customerCard: 'Ficha del cliente',
+            alias: 'Alias',
         },
         negative:{
             hour: 'Hora',
@@ -535,7 +538,7 @@ export default {
             rma: 'RMA',
             development: 'Trazabilidad',
             photos: 'Fotos',
-            log: 'Registros de auditoría',
+            log: 'Historial',
             notes: 'Notas',
             action: 'Acción',
         },
@@ -561,6 +564,8 @@ export default {
             ticketId: 'ID ticket',
             customerSummary: 'Resumen del cliente',
             claimedTicket: 'Ticket reclamado',
+            saleTracking: 'Líneas preparadas',
+            ticketTracking: 'Estados del ticket',
             commercial: 'Comercial',
             province: 'Provincia',
             zone: 'Zona',
@@ -758,7 +763,7 @@ export default {
             create: 'Crear',
             summary: 'Resumen',
             basicData: 'Datos básicos',
-            log: 'Registros de auditoría',
+            log: 'Historial',
         },
         list: {
             parking: 'Parking',
@@ -790,7 +795,7 @@ export default {
             dueDay: 'Vencimiento',
             intrastat: 'Intrastat',
             corrective: 'Rectificativa',
-            log: 'Registros de auditoría',
+            log: 'Historial',
         },
         list: {
             ref: 'Referencia',

src/layouts/OutLayout.vue

@@ -40,7 +40,7 @@ const langs = ['en', 'es'];
 
 <template>
     <QLayout view="hHh LpR fFf">
-        <QHeader reveal class="bg-dark">
+        <QHeader reveal class="bg-vn-dark">
             <QToolbar class="justify-end">
                 <QBtn
                     id="switchLanguage"

src/pages/Claim/Card/ClaimCard.vue

@@ -5,6 +5,7 @@ import { useStateStore } from 'stores/useStateStore';
 import { useI18n } from 'vue-i18n';
 import ClaimDescriptor from './ClaimDescriptor.vue';
 import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
+import useCardSize from 'src/composables/useCardSize';
 
 const stateStore = useStateStore();
 const { t } = useI18n();
@@ -28,7 +29,9 @@ const { t } = useI18n();
     <QPageContainer>
         <QPage>
             <VnSubToolbar />
-            <div class="q-pa-md"><RouterView></RouterView></div>
+            <div :class="useCardSize()">
+                <RouterView></RouterView>
+            </div>
         </QPage>
     </QPageContainer>
 </template>

src/pages/Claim/Card/ClaimDescriptor.vue

@@ -105,7 +105,6 @@ onMounted(async () => {
             <ClaimDescriptorMenu :claim="entity" />
         </template>
         <template #body="{ entity }">
-            <VnLv :label="t('claim.card.created')" :value="toDate(entity.created)" />
             <VnLv v-if="entity.claimState" :label="t('claim.card.state')">
                 <template #value>
                     <QBadge :color="stateColor(entity.claimState.code)" dense>
@@ -113,13 +112,13 @@ onMounted(async () => {
                     </QBadge>
                 </template>
             </VnLv>
-            <VnLv :label="t('claim.card.ticketId')">
+            <VnLv :label="t('claim.card.created')" :value="toDate(entity.created)" />
+            <VnLv :label="t('claim.card.commercial')">
                 <template #value>
-                    <span class="link">
+                    <VnUserLink
-                        {{ entity.ticketFk }}
+                        :name="entity.client?.salesPersonUser?.name"
-
+                        :worker-id="entity.client?.salesPersonFk"
-                        <TicketDescriptorProxy :id="entity.ticketFk" />
+                    />
-                    </span>
                 </template>
             </VnLv>
             <VnLv
@@ -134,19 +133,20 @@ onMounted(async () => {
                     />
                 </template>
             </VnLv>
-            <VnLv :label="t('claim.card.commercial')">
+            <VnLv :label="t('claim.card.zone')" :value="entity.ticket?.zone?.name" />
-                <template #value>
-                    <VnUserLink
-                        :name="entity.client?.salesPersonUser?.name"
-                        :worker-id="entity.client?.salesPersonFk"
-                    />
-                </template>
-            </VnLv>
             <VnLv
                 :label="t('claim.card.province')"
                 :value="entity.ticket?.address?.province?.name"
             />
-            <VnLv :label="t('claim.card.zone')" :value="entity.ticket?.zone?.name" />
+            <VnLv :label="t('claim.card.ticketId')">
+                <template #value>
+                    <span class="link">
+                        {{ entity.ticketFk }}
+
+                        <TicketDescriptorProxy :id="entity.ticketFk" />
+                    </span>
+                </template>
+            </VnLv>
             <VnLv
                 :label="t('claimRate')"
                 :value="toPercentage(entity.client?.claimsRatio?.claimingRate)"
@@ -176,6 +176,7 @@ onMounted(async () => {
                     color="primary"
                     :href="salixUrl + 'ticket/' + entity.ticketFk + '/sale-tracking'"
                 >
+                    <QTooltip>{{ t('claim.card.saleTracking') }}</QTooltip>
                 </QBtn>
                 <QBtn
                     size="md"
@@ -183,6 +184,7 @@ onMounted(async () => {
                     color="primary"
                     :href="salixUrl + 'ticket/' + entity.ticketFk + '/tracking/index'"
                 >
+                    <QTooltip>{{ t('claim.card.ticketTracking') }}</QTooltip>
                 </QBtn>
             </QCardActions>
         </template>

src/pages/Claim/Card/ClaimNotes.vue

@@ -1,4 +1,5 @@
 <script setup>
+import { computed } from 'vue';
 import { useRoute } from 'vue-router';
 import { useState } from 'src/composables/useState';
 import VnNotes from 'src/components/ui/VnNotes.vue';
@@ -6,14 +7,15 @@ import VnNotes from 'src/components/ui/VnNotes.vue';
 const route = useRoute();
 const state = useState();
 const user = state.getUser();
-const id = route.params.id;
 
 const $props = defineProps({
+    id: { type: Number, default: null },
     addNote: { type: Boolean, default: true },
 });
+const claimId = computed(() => $props.id || route.params.id);
 
 const claimFilter = {
-    where: { claimFk: id },
+    where: { claimFk: claimId.value },
     fields: ['created', 'workerFk', 'text'],
     include: {
         relation: 'worker',
@@ -30,19 +32,16 @@ const claimFilter = {
 };
 
 const body = {
-    claimFk: id,
+    claimFk: claimId.value,
     workerFk: user.value.id,
 };
 </script>
 <template>
-    <div class="column items-center">
+    <VnNotes
-        <VnNotes
+        style="overflow-y: auto"
-            style="overflow-y: scroll"
+        :add-note="$props.addNote"
-            :add-note="$props.addNote"
+        url="claimObservations"
-            :id="id"
+        :filter="claimFilter"
-            url="claimObservations"
+        :body="body"
-            :filter="claimFilter"
+    />
-            :body="body"
-        />
-    </div>
 </template>

src/pages/Claim/Card/ClaimSummary.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { onMounted, ref, computed, watch } from 'vue';
+import { onMounted, ref, computed } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 import { toDate, toCurrency } from 'src/filters';
@@ -70,7 +70,7 @@ const detailsColumns = ref([
     },
     {
         name: 'description',
-        label: 'claim.summary.description',
+        label: 'globals.description',
         field: (row) => row.sale.concept,
     },
     {
@@ -179,9 +179,9 @@ function openDialog(dmsId) {
         </template>
         <template #body="{ entity: { claim, salesClaimed, developments } }">
             <QCard class="vn-one">
-                <a class="header" :href="`#/claim/${entityId}/basic-data`">
+                <a class="header header-link" :href="`#/claim/${entityId}/basic-data`">
                     {{ t('claim.pageTitles.basicData') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
                 <VnLv
                     :label="t('claim.summary.created')"
@@ -194,19 +194,19 @@ function openDialog(dmsId) {
                         </QChip>
                     </template>
                 </VnLv>
-                <VnLv :label="t('claim.summary.assignedTo')">
+                <VnLv :label="t('globals.salesPerson')">
                     <template #value>
                         <VnUserLink
-                            :name="claim.worker?.user?.nickname"
+                            :name="claim.client?.salesPersonUser?.name"
-                            :worker-id="claim.workerFk"
+                            :worker-id="claim.client?.salesPersonFk"
                         />
                     </template>
                 </VnLv>
                 <VnLv :label="t('claim.summary.attendedBy')">
                     <template #value>
                         <VnUserLink
-                            :name="claim.client?.salesPersonUser?.name"
+                            :name="claim.worker?.user?.nickname"
-                            :worker-id="claim.client?.salesPersonFk"
+                            :worker-id="claim.workerFk"
                         />
                     </template>
                 </VnLv>
@@ -218,26 +218,37 @@ function openDialog(dmsId) {
                         />
                     </template>
                 </VnLv>
-                <VnLv :label="t('claim.summary.returnOfMaterial')" :value="claim.rma" />
                 <QCheckbox
-                    :align-items="right"
                     :label="t('claim.basicData.picked')"
                     v-model="claim.hasToPickUp"
+                    :disable="true"
                 />
             </QCard>
-            <QCard class="vn-three claimVnNotes full-height">
+            <QCard class="vn-three">
-                <a class="header" :href="`#/claim/${entityId}/notes`">
+                <a class="header header-link" :href="`#/claim/${entityId}/notes`">
                     {{ t('claim.summary.notes') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
-                <ClaimNotes :add-note="false" style="height: 350px" order="created ASC" />
+                <ClaimNotes
+                    :id="entityId"
+                    :add-note="false"
+                    style="max-height: 300px"
+                    order="created ASC"
+                />
             </QCard>
             <QCard class="vn-two" v-if="salesClaimed.length > 0">
-                <a class="header" :href="`#/claim/${entityId}/lines`">
+                <a class="header header-link" :href="`#/claim/${entityId}/lines`">
                     {{ t('claim.summary.details') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
-                <QTable :columns="detailsColumns" :rows="salesClaimed" flat>
+                <QTable
+                    :columns="detailsColumns"
+                    :rows="salesClaimed"
+                    flat
+                    dense
+                    :rows-per-page-options="[0]"
+                    hide-bottom
+                >
                     <template #header="props">
                         <QTr :props="props">
                             <QTh v-for="col in props.cols" :key="col.name" :props="props">
@@ -268,11 +279,19 @@ function openDialog(dmsId) {
                 </QTable>
             </QCard>
             <QCard class="vn-two" v-if="developments.length > 0">
-                <a class="header" :href="claimUrl + 'development'">
+                <a class="header header-link" :href="claimUrl + 'development'">
                     {{ t('claim.summary.development') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
-                <QTable :columns="developmentColumns" :rows="developments" flat>
+
+                <QTable
+                    :columns="developmentColumns"
+                    :rows="developments"
+                    flat
+                    dense
+                    :rows-per-page-options="[0]"
+                    hide-bottom
+                >
                     <template #header="props">
                         <QTr :props="props">
                             <QTh v-for="col in props.cols" :key="col.name" :props="props">
@@ -283,9 +302,9 @@ function openDialog(dmsId) {
                 </QTable>
             </QCard>
             <QCard class="vn-max" v-if="claimDms.length > 0">
-                <a class="header" :href="`#/claim/${entityId}/photos`">
+                <a class="header header-link" :href="`#/claim/${entityId}/photos`">
                     {{ t('claim.summary.photos') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
                 <div class="container">
                     <div
@@ -302,7 +321,7 @@ function openDialog(dmsId) {
                                 v-if="media.isVideo"
                                 @click.stop="openDialog(media.dmsFk)"
                             >
-                                <QTooltip>Video</QTooltip>
+                                <QTooltip>Video</QTooltip>header
                             </QIcon>
                             <QCard class="multimedia relative-position">
                                 <QImg
@@ -326,9 +345,9 @@ function openDialog(dmsId) {
             </QCard>
 
             <QCard class="vn-max">
-                <a class="header" :href="claimUrl + 'action'">
+                <a class="header header-link" :href="claimUrl + 'action'">
                     {{ t('claim.summary.actions') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" class="link" />
                 </a>
                 <div id="slider-container" class="q-px-xl q-py-md">
                     <QSlider
@@ -336,7 +355,7 @@ function openDialog(dmsId) {
                         label
                         :label-value="t('claim.summary.responsibility')"
                         label-always
-                        color="primary"
+                        color="var()"
                         markers
                         :marker-labels="[
                             { value: 1, label: t('claim.summary.company') },
@@ -390,13 +409,7 @@ function openDialog(dmsId) {
         </template>
     </CardSummary>
 </template>
-<style lang="scss">
+
-.claimVnNotes {
-    .q-card {
-        max-width: 100%;
-    }
-}
-</style>
 <style lang="scss" scoped>
 .q-dialog__inner--minimized > div {
     max-width: 80%;
@@ -406,7 +419,6 @@ function openDialog(dmsId) {
     flex-direction: row;
     flex-wrap: wrap;
     gap: 15px;
-    flex-basis: 30%;
 }
 .multimedia-container {
     flex: 1 0 21%;

src/pages/Claim/ClaimList.vue

@@ -115,12 +115,6 @@ function navigate(event, id) {
                             </VnLv>
                         </template>
                         <template #actions>
-                            <QBtn
-                                :label="t('components.smartCard.openCard')"
-                                @click.stop="navigate(row.id)"
-                                class="bg-vn-dark"
-                                outline
-                            />
                             <QBtn
                                 :label="t('globals.description')"
                                 @click.stop

src/pages/Customer/Card/CustomerCard.vue

@@ -6,6 +6,7 @@ import CustomerDescriptor from './CustomerDescriptor.vue';
 import LeftMenu from 'components/LeftMenu.vue';
 import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
 import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
+import useCardSize from 'src/composables/useCardSize';
 
 const stateStore = useStateStore();
 const route = useRoute();
@@ -30,7 +31,9 @@ const { t } = useI18n();
     <QPageContainer>
         <QPage>
             <VnSubToolbar />
-            <div class="q-pa-md"><RouterView></RouterView></div>
+            <div :class="useCardSize()">
+                <RouterView></RouterView>
+            </div>
         </QPage>
     </QPageContainer>
 </template>

src/pages/Customer/Card/CustomerDescriptor.vue

@@ -40,6 +40,15 @@ const setData = (entity) => (data.value = useCardDescription(entity.name, entity
         data-key="customerData"
     >
         <template #body="{ entity }">
+            <VnLv :label="t('customer.card.payMethod')" :value="entity.payMethod.name" />
+
+            <VnLv :label="t('customer.card.credit')" :value="toCurrency(entity.credit)" />
+            <VnLv
+                :label="t('customer.card.securedCredit')"
+                :value="toCurrency(entity.creditInsurance)"
+            />
+
+            <VnLv :label="t('customer.card.debt')" :value="toCurrency(entity.debt)" />
             <VnLv v-if="entity.salesPersonUser" :label="t('customer.card.salesPerson')">
                 <template #value>
                     <VnUserLink
@@ -48,13 +57,10 @@ const setData = (entity) => (data.value = useCardDescription(entity.name, entity
                     />
                 </template>
             </VnLv>
-            <VnLv :label="t('customer.card.credit')" :value="toCurrency(entity.credit)" />
             <VnLv
-                :label="t('customer.card.securedCredit')"
+                :label="t('customer.card.businessTypeFk')"
-                :value="toCurrency(entity.creditInsurance)"
+                :value="entity.businessTypeFk"
             />
-            <VnLv :label="t('customer.card.payMethod')" :value="entity.payMethod.name" />
-            <VnLv :label="t('customer.card.debt')" :value="toCurrency(entity.debt)" />
         </template>
         <template #icons="{ entity }">
             <QCardActions>

src/pages/Customer/Card/CustomerSummary.vue

@@ -62,9 +62,9 @@ const creditWarning = computed(() => {
     <CardSummary ref="summary" :url="`Clients/${entityId}/summary`">
         <template #body="{ entity }">
             <QCard class="vn-one">
-                <a class="header" :href="`#/customer/${entityId}/basic-data`">
+                <a class="header header-link" :href="`#/customer/${entityId}/basic-data`">
                     {{ t('customer.summary.basicData') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
                 <VnLv :label="t('customer.summary.customerId')" :value="entity.id" />
                 <VnLv :label="t('customer.summary.name')" :value="entity.name" />
@@ -96,9 +96,12 @@ const creditWarning = computed(() => {
                 />
             </QCard>
             <QCard class="vn-one">
-                <a class="header" :href="`#/customer/${entityId}/fiscal-data`">
+                <a
+                    class="header header-link"
+                    :href="`#/customer/${entityId}/fiscal-data`"
+                >
                     {{ t('customer.summary.fiscalAddress') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
                 <VnLv
                     :label="t('customer.summary.socialName')"
@@ -121,37 +124,58 @@ const creditWarning = computed(() => {
                 <VnLv :label="t('customer.summary.street')" :value="entity.street" />
             </QCard>
             <QCard class="vn-one">
-                <a class="header link" :href="`#/customer/${entityId}/fiscal-data`" link>
+                <a
+                    class="header header-link"
+                    :href="`#/customer/${entityId}/fiscal-data`"
+                    link
+                >
                     {{ t('customer.summary.fiscalData') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
-                <VnLv
+                <QCheckbox
                     :label="t('customer.summary.isEqualizated')"
-                    :value="entity.isEqualizated"
+                    v-model="entity.isEqualizated"
+                    :disable="true"
                 />
-                <VnLv :label="t('customer.summary.isActive')" :value="entity.isActive" />
+                <QCheckbox
-                <VnLv
+                    :label="t('customer.summary.isActive')"
+                    v-model="entity.isActive"
+                    :disable="true"
+                />
+                <QCheckbox
                     :label="t('customer.summary.invoiceByAddress')"
-                    :value="entity.hasToInvoiceByAddress"
+                    v-model="entity.hasToInvoiceByAddress"
+                    :disable="true"
                 />
-                <VnLv
+                <QCheckbox
                     :label="t('customer.summary.verifiedData')"
-                    :value="entity.isTaxDataChecked"
+                    v-model="entity.isTaxDataChecked"
+                    :disable="true"
                 />
-                <VnLv
+                <QCheckbox
                     :label="t('customer.summary.hasToInvoice')"
-                    :value="entity.hasToInvoice"
+                    v-model="entity.hasToInvoice"
+                    :disable="true"
                 />
-                <VnLv
+                <QCheckbox
                     :label="t('customer.summary.notifyByEmail')"
-                    :value="entity.isToBeMailed"
+                    v-model="entity.isToBeMailed"
+                    :disable="true"
+                />
+                <QCheckbox
+                    :label="t('customer.summary.vies')"
+                    v-model="entity.isVies"
+                    :disable="true"
                 />
-                <VnLv :label="t('customer.summary.vies')" :value="entity.isVies" />
             </QCard>
             <QCard class="vn-one">
-                <a class="header link" :href="`#/customer/${entityId}/billing-data`" link>
+                <a
+                    class="header header-link"
+                    :href="`#/customer/${entityId}/billing-data`"
+                    link
+                >
                     {{ t('customer.summary.billingData') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
                 <VnLv
                     :label="t('customer.summary.payMethod')"
@@ -159,20 +183,32 @@ const creditWarning = computed(() => {
                 />
                 <VnLv :label="t('customer.summary.bankAccount')" :value="entity.iban" />
                 <VnLv :label="t('customer.summary.dueDay')" :value="entity.dueDay" />
-                <VnLv :label="t('customer.summary.hasLcr')" :value="entity.hasLcr" />
+                <QCheckbox
-                <VnLv
+                    style="padding: 0"
-                    :label="t('customer.summary.hasCoreVnl')"
+                    :label="t('customer.summary.hasLcr')"
-                    :value="entity.hasCoreVnl"
+                    v-model="entity.hasLcr"
+                    :disable="true"
                 />
-                <VnLv
+                <QCheckbox
+                    :label="t('customer.summary.hasCoreVnl')"
+                    v-model="entity.hasCoreVnl"
+                    :disable="true"
+                />
+
+                <QCheckbox
                     :label="t('customer.summary.hasB2BVnl')"
-                    :value="entity.hasSepaVnl"
+                    v-model="entity.hasSepaVnl"
+                    :disable="true"
                 />
             </QCard>
             <QCard class="vn-one" v-if="entity.defaultAddress">
-                <a class="header link" :href="`#/customer/${entityId}/consignees`" link>
+                <a
+                    class="header header-link"
+                    :href="`#/customer/${entityId}/consignees`"
+                    link
+                >
                     {{ t('customer.summary.consignee') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
                 <VnLv
                     :label="t('customer.summary.addressName')"
@@ -188,21 +224,22 @@ const creditWarning = computed(() => {
                 />
             </QCard>
             <QCard class="vn-one" v-if="entity.account">
-                <a class="header link" :href="`#/customer/${entityId}/web-access`">
+                <a class="header header-link" :href="`#/customer/${entityId}/web-access`">
                     {{ t('customer.summary.webAccess') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
                 <VnLv
                     :label="t('customer.summary.username')"
                     :value="entity.account.name"
                 />
-                <VnLv
+                <QCheckbox
                     :label="t('customer.summary.webAccess')"
-                    :value="entity.account.active"
+                    v-model="entity.account.active"
+                    :disable="true"
                 />
             </QCard>
             <QCard class="vn-one" v-if="entity.account">
-                <div class="header">
+                <div class="header header-link">
                     {{ t('customer.summary.businessData') }}
                 </div>
                 <VnLv
@@ -230,13 +267,12 @@ const creditWarning = computed(() => {
             </QCard>
             <QCard class="vn-one" v-if="entity.account">
                 <a
-                    class="header link"
+                    class="header header-link"
                     :href="`https://grafana.verdnatura.es/d/40buzE4Vk/comportamiento-pagos-clientes?orgId=1&var-clientFk=${entityId}`"
                     link
                 >
                     {{ t('customer.summary.financialData') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="vn:grafana" />
-                    <!-- Pendiente de añadir el icono <QIcon name="vn:grafana" color="primary" /> -->
                 </a>
                 <VnLv
                     :label="t('customer.summary.risk')"

src/pages/Department/Card/DepartmentSummary.vue

@@ -37,11 +37,11 @@ onMounted(async () => {
         <template #body="{ entity: department }">
             <QCard class="column">
                 <a
-                    class="header"
+                    class="header header-link"
                     :href="`#/department/department/${entityId}/basic-data`"
                 >
                     {{ t('Basic data') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
                 <div class="full-width row wrap justify-between content-between">
                     <div class="column" style="min-width: 50%">

src/pages/Entry/Card/EntryCard.vue

@@ -7,6 +7,7 @@ import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
 import EntryDescriptor from './EntryDescriptor.vue';
 
 import { useStateStore } from 'stores/useStateStore';
+import useCardSize from 'src/composables/useCardSize';
 
 const { t } = useI18n();
 const stateStore = useStateStore();
@@ -33,7 +34,9 @@ const stateStore = useStateStore();
         <QPage>
             <VnSubToolbar />
 
-            <div class="q-pa-md"><RouterView></RouterView></div>
+            <div :class="useCardSize()">
+                <RouterView></RouterView>
+            </div>
         </QPage>
     </QPageContainer>
 </template>

src/pages/Entry/Card/EntrySummary.vue

@@ -164,15 +164,20 @@ const fetchEntryBuys = async () => {
         :url="`Entries/${entityId}/getEntry`"
         @on-fetch="(data) => setEntryData(data)"
     >
+        <template #header-left>
+            <a class="header-link" :href="entryUrl">
+                <QIcon name="open_in_new" color="white" size="sm" />
+            </a>
+        </template>
         <template #header>
             <span>{{ entry.id }} - {{ entry.supplier.nickname }}</span>
         </template>
 
         <template #body>
             <QCard class="vn-one">
-                <a class="header link" :href="`#/entry/${entityId}/basic-data`">
+                <a class="header header-link" :href="`#/entry/${entityId}/basic-data`">
                     {{ t('globals.summary.basicData') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
 
                 <VnLv :label="t('entry.summary.commission')" :value="entry.commission" />
@@ -187,23 +192,36 @@ const fetchEntryBuys = async () => {
                     :label="t('entry.summary.invoiceNumber')"
                     :value="entry.invoiceNumber"
                 />
-
+                <QCheckbox
-                <VnLv :label="t('entry.summary.ordered')" :value="entry.isOrdered" />
+                    :label="t('entry.summary.ordered')"
-
+                    v-model="entry.isOrdered"
-                <VnLv :label="t('entry.summary.confirmed')" :value="entry.isConfirmed" />
+                    :disable="true"
-
+                />
-                <VnLv :label="t('entry.summary.booked')" :value="entry.isBooked" />
+                <QCheckbox
-
+                    :label="t('entry.summary.confirmed')"
-                <VnLv :label="t('entry.summary.raid')" :value="entry.isRaid" />
+                    v-model="entry.isConfirmed"
-
+                    :disable="true"
-                <VnLv
+                />
+                <QCheckbox
+                    :label="t('entry.summary.booked')"
+                    v-model="entry.isBooked"
+                    :disable="true"
+                />
+                <QCheckbox
+                    :label="t('entry.summary.raid')"
+                    v-model="entry.isRaid"
+                    :disable="true"
+                />
+                <QCheckbox
                     :label="t('entry.summary.excludedFromAvailable')"
-                    :value="entry.isExcludedFromAvailable"
+                    v-model="entry.isExcludedFromAvailable"
+                    :disable="true"
                 />
             </QCard>
             <QCard class="vn-one">
-                <a class="header">
+                <a class="header header-link" :href="entryUrl">
                     {{ t('Travel data') }}
+                    <QIcon name="open_in_new" />
                 </a>
 
                 <VnLv :label="t('entry.summary.travelReference')">
@@ -230,11 +248,11 @@ const fetchEntryBuys = async () => {
                     :value="entry.travel.warehouseOut.name"
                 />
 
-                <VnLv
+                <QCheckbox
                     :label="t('entry.summary.travelDelivered')"
-                    :value="entry.travel.isDelivered"
+                    v-model="entry.isDelivered"
+                    :disable="true"
                 />
-
                 <VnLv
                     :label="t('entry.summary.travelLanded')"
                     :value="toDate(entry.travel.landed)"
@@ -245,14 +263,16 @@ const fetchEntryBuys = async () => {
                     :value="entry.travel.warehouseIn.name"
                 />
 
-                <VnLv
+                <QCheckbox
                     :label="t('entry.summary.travelReceived')"
-                    :value="entry.travel.isReceived"
+                    v-model="entry.isReceived"
+                    :disable="true"
                 />
             </QCard>
             <QCard class="vn-two" style="min-width: 100%">
-                <a class="header">
+                <a class="header header-link">
                     {{ t('entry.summary.buys') }}
+                    <QIcon name="open_in_new" />
                 </a>
                 <QTable
                     :rows="entryBuys"

src/pages/InvoiceIn/Card/InvoiceInCard.vue

@@ -8,6 +8,7 @@ import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
 import { useArrayData } from 'src/composables/useArrayData';
 import { onMounted, watch } from 'vue';
 import { useRoute } from 'vue-router';
+import useCardSize from 'src/composables/useCardSize';
 
 const stateStore = useStateStore();
 const { t } = useI18n();
@@ -74,7 +75,9 @@ watch(
     <QPageContainer>
         <QPage>
             <VnSubToolbar />
-            <div class="q-pa-md"><RouterView></RouterView></div>
+            <div :class="useCardSize()">
+                <RouterView></RouterView>
+            </div>
         </QPage>
     </QPageContainer>
 </template>

src/pages/InvoiceIn/Card/InvoiceInSummary.vue

@@ -209,9 +209,9 @@ function getLink(param) {
             <!--Basic Data-->
             <QCard class="vn-one">
                 <QCardSection class="q-pa-none">
-                    <a class="header" :href="getLink('basic-data')">
+                    <a class="header header-link" :href="getLink('basic-data')">
                         {{ t('invoiceIn.pageTitles.basicData') }}
-                        <QIcon name="open_in_new" color="primary" />
+                        <QIcon name="open_in_new" />
                     </a>
                 </QCardSection>
                 <VnLv
@@ -233,9 +233,9 @@ function getLink(param) {
             </QCard>
             <QCard class="vn-one">
                 <QCardSection class="q-pa-none">
-                    <a class="header" :href="getLink('basic-data')">
+                    <a class="header header-link" :href="getLink('basic-data')">
                         {{ t('invoiceIn.pageTitles.basicData') }}
-                        <QIcon name="open_in_new" color="primary" />
+                        <QIcon name="open_in_new" />
                     </a>
                 </QCardSection>
                 <VnLv
@@ -258,9 +258,9 @@ function getLink(param) {
             </QCard>
             <QCard class="vn-one">
                 <QCardSection class="q-pa-none">
-                    <a class="header" :href="getLink('basic-data')">
+                    <a class="header header-link" :href="getLink('basic-data')">
                         {{ t('invoiceIn.pageTitles.basicData') }}
-                        <QIcon name="open_in_new" color="primary" />
+                        <QIcon name="open_in_new" />
                     </a>
                 </QCardSection>
                 <VnLv
@@ -275,16 +275,17 @@ function getLink(param) {
                     :label="t('invoiceIn.summary.company')"
                     :value="invoiceIn.company?.code"
                 />
-                <VnLv
+                <QCheckbox
                     :label="t('invoiceIn.summary.booked')"
-                    :value="invoiceIn.isBooked"
+                    v-model="invoiceIn.isBooked"
+                    :disable="true"
                 />
             </QCard>
             <QCard class="vn-one">
                 <QCardSection class="q-pa-none">
-                    <a class="header" :href="getLink('basic-data')">
+                    <a class="header header-link" :href="getLink('basic-data')">
                         {{ t('invoiceIn.pageTitles.basicData') }}
-                        <QIcon name="open_in_new" color="primary" />
+                        <QIcon name="open_in_new" />
                     </a>
                 </QCardSection>
                 <QCardSection class="q-pa-none">
@@ -318,9 +319,9 @@ function getLink(param) {
             </QCard>
             <!--Vat-->
             <QCard v-if="invoiceIn.invoiceInTax.length">
-                <a class="header" :href="getLink('vat')">
+                <a class="header header-link" :href="getLink('vat')">
                     {{ t('invoiceIn.card.vat') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
                 <QTable
                     :columns="vatColumns"
@@ -351,9 +352,9 @@ function getLink(param) {
             </QCard>
             <!--Due Day-->
             <QCard v-if="invoiceIn.invoiceInDueDay.length">
-                <a class="header" :href="getLink('due-day')">
+                <a class="header header-link" :href="getLink('due-day')">
                     {{ t('invoiceIn.card.dueDay') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
                 <QTable
                     class="full-width"
@@ -381,9 +382,9 @@ function getLink(param) {
             </QCard>
             <!--Intrastat-->
             <QCard v-if="invoiceIn.invoiceInIntrastat.length">
-                <a class="header" :href="getLink('intrastat')">
+                <a class="header header-link" :href="getLink('intrastat')">
                     {{ t('invoiceIn.card.intrastat') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
                 <QTable
                     :columns="intrastatColumns"

src/pages/InvoiceOut/Card/InvoiceOutCard.vue

@@ -5,6 +5,7 @@ import InvoiceOutDescriptor from './InvoiceOutDescriptor.vue';
 import LeftMenu from 'components/LeftMenu.vue';
 import VnSearchbar from 'components/ui/VnSearchbar.vue';
 import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
+import useCardSize from 'src/composables/useCardSize';
 
 const stateStore = useStateStore();
 const { t } = useI18n();
@@ -28,7 +29,9 @@ const { t } = useI18n();
     <QPageContainer>
         <QPage>
             <VnSubToolbar />
-            <div class="q-pa-md"><RouterView></RouterView></div>
+            <div :class="useCardSize()">
+                <RouterView></RouterView>
+            </div>
         </QPage>
     </QPageContainer>
 </template>

src/pages/InvoiceOut/Card/InvoiceOutSummary.vue

@@ -101,9 +101,10 @@ const ticketsColumns = ref([
         </template>
         <template #body="{ entity: { invoiceOut } }">
             <QCard class="vn-one">
-                <div class="header">
+                <a class="header header-link">
                     {{ t('invoiceOut.pageTitles.basicData') }}
-                </div>
+                    <QIcon name="open_in_new" />
+                </a>
                 <VnLv
                     :label="t('invoiceOut.summary.issued')"
                     :value="toDate(invoiceOut.issued)"
@@ -126,9 +127,10 @@ const ticketsColumns = ref([
                 />
             </QCard>
             <QCard class="vn-three">
-                <div class="header">
+                <a class="header header-link">
                     {{ t('invoiceOut.summary.taxBreakdown') }}
-                </div>
+                    <QIcon name="open_in_new" />
+                </a>
                 <QTable :columns="taxColumns" :rows="invoiceOut.taxesBreakdown" flat>
                     <template #header="props">
                         <QTr :props="props">
@@ -140,9 +142,10 @@ const ticketsColumns = ref([
                 </QTable>
             </QCard>
             <QCard class="vn-three">
-                <div class="header">
+                <a class="header header-link">
                     {{ t('invoiceOut.summary.tickets') }}
-                </div>
+                    <QIcon name="open_in_new" />
+                </a>
                 <QTable v-if="tickets" :columns="ticketsColumns" :rows="tickets" flat>
                     <template #header="props">
                         <QTr :props="props">

src/pages/Item/Card/ItemCard.vue

@@ -4,6 +4,7 @@ import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
 import ItemDescriptor from './ItemDescriptor.vue';
 
 import { useStateStore } from 'stores/useStateStore';
+import useCardSize from 'src/composables/useCardSize';
 
 const stateStore = useStateStore();
 </script>
@@ -19,7 +20,9 @@ const stateStore = useStateStore();
         <QPage>
             <VnSubToolbar />
 
-            <div class="q-pa-md"><RouterView></RouterView></div>
+            <div :class="useCardSize()">
+                <RouterView></RouterView>
+            </div>
         </QPage>
     </QPageContainer>
 </template>

src/pages/Login/LoginMain.vue

@@ -69,12 +69,12 @@ async function onSubmit() {
 <template>
     <QForm @submit="onSubmit" class="q-gutter-y-md q-pa-lg formCard">
         <VnLogo alt="Logo" fit="contain" :ratio="16 / 9" class="q-mb-md" />
-
         <VnInput
             v-model="username"
             :label="t('login.username')"
             lazy-rules
             :rules="[(val) => (val && val.length > 0) || t('login.fieldRequired')]"
+            color="primary"
         />
         <VnInput
             type="password"
@@ -82,9 +82,8 @@ async function onSubmit() {
             :label="t('login.password')"
             lazy-rules
             :rules="[(val) => (val && val.length > 0) || t('login.fieldRequired')]"
+            class="red"
         />
-        <QToggle v-model="keepLogin" :label="t('login.keepLogin')" />
-
         <div>
             <QBtn
                 :label="t('login.submit')"
@@ -95,6 +94,7 @@ async function onSubmit() {
                 unelevated
             />
         </div>
+        <QToggle v-model="keepLogin" :label="t('login.keepLogin')" />
     </QForm>
 </template>
 
@@ -104,6 +104,9 @@ async function onSubmit() {
     min-width: 300px;
 }
 
+.q-input {
+    color: $primary;
+}
 @media (max-width: $breakpoint-xs-max) {
     .formCard {
         min-width: 100%;

src/pages/Login/VerifyEmail.vue

@@ -99,6 +99,8 @@ onMounted(async () => {
 </i18n>
 
 <style lang="scss">
+$vnColor: #8ebb27;
+
 .formCard {
     max-width: 1500px;
     min-width: 700px;

src/pages/Shelving/Card/ShelvingSummary.vue

@@ -71,11 +71,11 @@ const filter = {
             <template #body="{ entity }">
                 <QCard class="vn-one">
                     <RouterLink
-                        class="header"
+                        class="header header-link"
                         :to="{ name: 'ShelvingBasicData', params: { id: entityId } }"
                     >
                         {{ t('shelving.pageTitles.basicData') }}
-                        <QIcon name="open_in_new" color="primary" />
+                        <QIcon name="open_in_new" />
                     </RouterLink>
                     <VnLv :label="t('shelving.summary.code')" :value="entity.code" />
                     <VnLv

src/pages/Supplier/Card/SupplierCard.vue

@@ -5,6 +5,7 @@ import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
 import LeftMenu from 'components/LeftMenu.vue';
 import SupplierDescriptor from './SupplierDescriptor.vue';
 import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
+import useCardSize from 'src/composables/useCardSize';
 
 const stateStore = useStateStore();
 const { t } = useI18n();
@@ -30,7 +31,9 @@ const { t } = useI18n();
     <QPageContainer>
         <QPage>
             <VnSubToolbar />
-            <div class="q-pa-md"><RouterView></RouterView></div>
+            <div :class="useCardSize()">
+                <RouterView></RouterView>
+            </div>
         </QPage>
     </QPageContainer>
 </template>

src/pages/Supplier/Card/SupplierSummary.vue

@@ -52,7 +52,7 @@ const isAdministrative = computed(() => {
         @on-fetch="(data) => setData(data)"
     >
         <template #header-left>
-            <a v-if="isAdministrative" class="header link" :href="supplierUrl">
+            <a v-if="isAdministrative" class="header header-link" :href="supplierUrl">
                 <QIcon name="open_in_new" color="white" size="sm" />
             </a>
         </template>
@@ -64,11 +64,11 @@ const isAdministrative = computed(() => {
             <QCard class="vn-one">
                 <a
                     v-if="isAdministrative"
-                    class="header link"
+                    class="header header-link"
                     :href="`#/supplier/${entityId}/basic-data`"
                 >
                     {{ t('globals.summary.basicData') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
                 <span v-else> {{ t('globals.summary.basicData') }}</span>
                 <VnLv label="Id" :value="supplier.id" />
@@ -86,36 +86,25 @@ const isAdministrative = computed(() => {
                         <span> {{ dashIfEmpty(supplier.note) }} </span>
                     </template>
                 </VnLv>
-
+                <QCheckbox
-                <VnLv :label="t('supplier.summary.verified')" class="q-mb-xs">
+                    :label="t('supplier.summary.verified')"
-                    <template #value>
+                    v-model="supplier.isSerious"
-                        <QCheckbox
+                    :disable="true"
-                            v-model="supplier.isSerious"
+                />
-                            dense
+                <QCheckbox
-                            disable
+                    :label="t('supplier.summary.isActive')"
-                            class="full-width q-mb-xs"
+                    v-model="supplier.isActive"
-                        />
+                    :disable="true"
-                    </template>
+                />
-                </VnLv>
-                <VnLv :label="t('supplier.summary.isActive')" class="q-mb-xs">
-                    <template #value>
-                        <QCheckbox
-                            v-model="supplier.isActive"
-                            dense
-                            disable
-                            class="full-width q-mb-xs"
-                        />
-                    </template>
-                </VnLv>
             </QCard>
             <QCard class="vn-one">
                 <a
                     v-if="isAdministrative"
-                    class="header link"
+                    class="header header-link"
                     :href="`#/supplier/${entityId}/billing-data`"
                 >
                     {{ t('supplier.summary.billingData') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
                 <span v-else> {{ t('supplier.summary.billingData') }}</span>
                 <VnLv
@@ -134,11 +123,11 @@ const isAdministrative = computed(() => {
             <QCard class="vn-one">
                 <a
                     v-if="isAdministrative"
-                    class="header link"
+                    class="header header-link"
                     :href="`#/supplier/${entityId}/fiscal-data`"
                 >
                     {{ t('supplier.summary.fiscalData') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
                 <span v-else> {{ t('supplier.summary.fiscalData') }}</span>
                 <VnLv
@@ -169,11 +158,11 @@ const isAdministrative = computed(() => {
             <QCard class="vn-one">
                 <a
                     v-if="isAdministrative"
-                    class="header link"
+                    class="header header-link"
                     :href="`#/supplier/${entityId}/fiscal-data`"
                 >
                     {{ t('supplier.summary.fiscalAddress') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
                 <span v-else> {{ t('supplier.summary.fiscalAddress') }}</span>
                 <VnLv :label="t('supplier.summary.socialName')" :value="supplier.name" />

src/pages/Ticket/Card/TicketCard.vue

@@ -5,6 +5,7 @@ import TicketDescriptor from './TicketDescriptor.vue';
 import LeftMenu from 'components/LeftMenu.vue';
 import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
 import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
+import useCardSize from 'src/composables/useCardSize';
 
 const stateStore = useStateStore();
 const { t } = useI18n();
@@ -29,7 +30,9 @@ const { t } = useI18n();
         <QPage>
             <VnSubToolbar />
 
-            <div class="q-pa-md"><RouterView></RouterView></div>
+            <div :class="useCardSize()">
+                <RouterView></RouterView>
+            </div>
         </QPage>
     </QPageContainer>
 </template>

src/pages/Ticket/Card/TicketDescriptor.vue

@@ -88,14 +88,6 @@ const setData = (entity) =>
             <TicketDescriptorMenu :ticket="entity" />
         </template>
         <template #body="{ entity }">
-            <VnLv v-if="entity.ticketState" :label="t('ticket.card.state')">
-                <template #value>
-                    <QBadge :color="entity.ticketState.state.classColor">
-                        {{ entity.ticketState.state.name }}
-                    </QBadge>
-                </template>
-            </VnLv>
-            <VnLv :label="t('ticket.card.shipped')" :value="toDate(entity.shipped)" />
             <VnLv :label="t('ticket.card.customerId')">
                 <template #value>
                     <span class="link">
@@ -104,6 +96,13 @@ const setData = (entity) =>
                     </span>
                 </template>
             </VnLv>
+            <VnLv v-if="entity.ticketState" :label="t('ticket.card.state')">
+                <template #value>
+                    <QBadge :color="entity.ticketState.state.classColor">
+                        {{ entity.ticketState.state.name }}
+                    </QBadge>
+                </template>
+            </VnLv>
             <VnLv :label="t('ticket.summary.salesPerson')">
                 <template #value>
                     <VnUserLink
@@ -112,12 +111,14 @@ const setData = (entity) =>
                     />
                 </template>
             </VnLv>
-            <VnLv :label="t('ticket.card.warehouse')" :value="entity.warehouse?.name" />
+            <VnLv :label="t('ticket.card.shipped')" :value="toDate(entity.shipped)" />
             <VnLv
                 v-if="entity.agencyMode"
                 :label="t('ticket.card.agency')"
                 :value="entity.agencyMode.name"
             />
+            <VnLv :label="t('ticket.card.warehouse')" :value="entity.warehouse?.name" />
+            <VnLv :label="t('ticket.card.alias')" :value="entity.nickname" />
         </template>
         <template #icons="{ entity }">
             <QCardActions>

src/pages/Ticket/Card/TicketSummary.vue

@@ -149,7 +149,7 @@ async function changeState(value) {
             <QCard class="vn-one">
                 <a class="header link" :href="ticketUrl + 'basic-data/step-one'">
                     {{ t('globals.summary.basicData') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
                 <VnLv :label="t('ticket.summary.state')">
                     <template #value>
@@ -195,7 +195,7 @@ async function changeState(value) {
             <QCard class="vn-one">
                 <a class="header link" :href="ticketUrl + 'basic-data/step-one'">
                     {{ t('globals.summary.basicData') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
                 <VnLv
                     :label="t('ticket.summary.shipped')"
@@ -238,7 +238,7 @@ async function changeState(value) {
             <QCard class="vn-one">
                 <a class="header link" :href="ticketUrl + 'observation'">
                     {{ t('ticket.pageTitles.notes') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
                 <VnLv
                     v-for="note in ticket.notes"
@@ -260,7 +260,7 @@ async function changeState(value) {
             <QCard class="vn-max">
                 <a class="header link" :href="ticketUrl + 'sale'">
                     {{ t('ticket.summary.saleLines') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
                 <QTable :rows="ticket.sales">
                     <template #header="props">
@@ -398,7 +398,7 @@ async function changeState(value) {
             >
                 <a class="header link" :href="ticketUrl + 'package'">
                     {{ t('globals.packages') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
                 <QTable :rows="ticket.packagings" flat>
                     <template #header="props">
@@ -419,7 +419,7 @@ async function changeState(value) {
 
                 <a class="header link q-mt-xl" :href="ticketUrl + 'service'">
                     {{ t('ticket.summary.service') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
                 <QTable :rows="ticket.services" flat>
                     <template #header="props">

src/pages/Travel/Card/TravelCard.vue

@@ -3,6 +3,7 @@ import { useStateStore } from 'stores/useStateStore';
 import TravelDescriptor from './TravelDescriptor.vue';
 import LeftMenu from 'components/LeftMenu.vue';
 import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
+import useCardSize from 'src/composables/useCardSize';
 
 const stateStore = useStateStore();
 </script>
@@ -17,7 +18,9 @@ const stateStore = useStateStore();
     <QPageContainer>
         <QPage>
             <VnSubToolbar />
-            <div class="q-pa-md"><RouterView></RouterView></div>
+            <div :class="useCardSize()">
+                <RouterView></RouterView>
+            </div>
         </QPage>
     </QPageContainer>
 </template>

src/pages/Travel/Card/TravelSummary.vue

@@ -269,15 +269,11 @@ async function setTravelData(travelData) {
                     :label="t('globals.wareHouseOut')"
                     :value="travel.warehouseOut?.name"
                 />
-                <VnLv :label="t('travel.summary.delivered')" class="q-mb-xs">
+                <QCheckbox
-                    <template #value>
+                    :label="t('travel.summary.delivered')"
-                        <QIcon
+                    v-model="travel.isDelivered"
-                            :name="travel.isDelivered ? 'check' : 'close'"
+                    :disable="true"
-                            :color="travel.isDelivered ? 'positive' : 'negative'"
+                />
-                            size="sm"
-                        />
-                    </template>
-                </VnLv>
             </QCard>
             <QCard class="vn-one">
                 <VnLv :label="t('globals.landed')" :value="toDate(travel.landed)" />
@@ -285,15 +281,11 @@ async function setTravelData(travelData) {
                     :label="t('globals.wareHouseIn')"
                     :value="travel.warehouseIn?.name"
                 />
-                <VnLv :label="t('travel.summary.received')" class="q-mb-xs">
+                <QCheckbox
-                    <template #value>
+                    :label="t('travel.summary.received')"
-                        <QIcon
+                    v-model="travel.isReceived"
-                            :name="travel.isReceived ? 'check' : 'close'"
+                    :disable="true"
-                            :color="travel.isReceived ? 'positive' : 'negative'"
+                />
-                            size="sm"
-                        />
-                    </template>
-                </VnLv>
             </QCard>
             <QCard class="vn-one">
                 <VnLv :label="t('globals.agency')" :value="travel.agency?.name" />
@@ -302,7 +294,7 @@ async function setTravelData(travelData) {
                 <VnLv :label="t('globals.totalEntries')" :value="travel.totalEntries" />
             </QCard>
             <QCard class="full-width" v-if="entriesTableRows.length > 0">
-                <span class="header">
+                <span class="header header-link">
                     {{ t('travel.summary.entries') }}
                 </span>
                 <QTable
@@ -361,14 +353,14 @@ async function setTravelData(travelData) {
 
             <QCard class="full-width" v-if="thermographs.length > 0">
                 <RouterLink
-                    class="header"
+                    class="header header-link"
                     :to="{
                         name: 'TravelThermographsIndex',
                         params: { id: travel.id },
                     }"
                 >
                     {{ t('travel.summary.thermographs') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </RouterLink>
                 <QTable
                     :rows="thermographs"

src/pages/Wagon/Card/WagonCard.vue

@@ -3,6 +3,7 @@ import { useI18n } from 'vue-i18n';
 import { useStateStore } from 'stores/useStateStore';
 import { useRoute } from 'vue-router';
 import LeftMenu from 'components/LeftMenu.vue';
+import useCardSize from 'src/composables/useCardSize';
 
 const stateStore = useStateStore();
 const route = useRoute();
@@ -17,7 +18,9 @@ const { t } = useI18n();
     </QDrawer>
     <QPageContainer>
         <QPage>
-            <div class="q-pa-md"><RouterView></RouterView></div>
+            <div :class="useCardSize()">
+                <RouterView></RouterView>
+            </div>
         </QPage>
     </QPageContainer>
 </template>

src/pages/Worker/Card/WorkerCard.vue

@@ -5,6 +5,7 @@ import WorkerDescriptor from './WorkerDescriptor.vue';
 import LeftMenu from 'components/LeftMenu.vue';
 import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
 import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
+import useCardSize from 'src/composables/useCardSize';
 
 const stateStore = useStateStore();
 const { t } = useI18n();
@@ -29,7 +30,9 @@ const { t } = useI18n();
         <QPage>
             <VnSubToolbar />
 
-            <div class="q-pa-md"><RouterView></RouterView></div>
+            <div :class="useCardSize()">
+                <RouterView></RouterView>
+            </div>
         </QPage>
     </QPageContainer>
 </template>

src/pages/Worker/Card/WorkerSummary.vue

@@ -71,9 +71,9 @@ const filter = {
         </template>
         <template #body="{ entity: worker }">
             <QCard class="vn-one">
-                <a class="header" :href="workerUrl + `basic-data`">
+                <a class="header header-link" :href="workerUrl + `basic-data`">
                     {{ t('worker.summary.basicData') }}
-                    <QIcon name="open_in_new" color="primary" />
+                    <QIcon name="open_in_new" />
                 </a>
                 <VnLv :label="t('worker.card.name')" :value="worker.user.nickname" />
                 <VnLv
@@ -111,7 +111,7 @@ const filter = {
                 <VnLv :label="t('worker.summary.locker')" :value="worker.locker" />
             </QCard>
             <QCard class="vn-one">
-                <div class="header">
+                <div class="header header-link">
                     {{ t('worker.summary.userData') }}
                 </div>
                 <VnLv :label="t('worker.summary.userId')" :value="worker.user.id" />

src/router/modules/claim.js

@@ -16,10 +16,10 @@ export default {
             'ClaimLines',
             'ClaimRma',
             'ClaimPhotos',
-            'ClaimLog',
             'ClaimNotes',
             'ClaimDevelopment',
             'ClaimAction',
+            'ClaimLog',
         ],
     },
     children: [
@@ -103,6 +103,15 @@ export default {
                     },
                     component: () => import('src/pages/Claim/Card/ClaimPhoto.vue'),
                 },
+                {
+                    name: 'ClaimNotes',
+                    path: 'notes',
+                    meta: {
+                        title: 'notes',
+                        icon: 'draft',
+                    },
+                    component: () => import('src/pages/Claim/Card/ClaimNotes.vue'),
+                },
                 {
                     name: 'ClaimDevelopment',
                     path: 'development',
@@ -113,24 +122,6 @@ export default {
                     },
                     component: () => import('src/pages/Claim/Card/ClaimDevelopment.vue'),
                 },
-                {
-                    name: 'ClaimLog',
-                    path: 'log',
-                    meta: {
-                        title: 'log',
-                        icon: 'history',
-                    },
-                    component: () => import('src/pages/Claim/Card/ClaimLog.vue'),
-                },
-                {
-                    name: 'ClaimNotes',
-                    path: 'notes',
-                    meta: {
-                        title: 'notes',
-                        icon: 'draft',
-                    },
-                    component: () => import('src/pages/Claim/Card/ClaimNotes.vue'),
-                },
                 {
                     name: 'ClaimAction',
                     path: 'action',
@@ -140,6 +131,15 @@ export default {
                     },
                     component: () => import('src/pages/Claim/Card/ClaimAction.vue'),
                 },
+                {
+                    name: 'ClaimLog',
+                    path: 'log',
+                    meta: {
+                        title: 'log',
+                        icon: 'history',
+                    },
+                    component: () => import('src/pages/Claim/Card/ClaimLog.vue'),
+                },
             ],
         },
     ],