Merge pull request 'refactor: refs #5835' (!129) from 5835-fixListAndSummary into dev

Reviewed-on: #129
Reviewed-by: Alex Moreno <alexm@verdnatura.es>
Reviewed-by: Juan Ferrer <juan@verdnatura.es>

src/components/NavBar.vue

@@ -24,11 +24,8 @@ const pinnedModulesRef = ref();
 </script>
 
 <template>
-    <QHeader class="bg-dark" color="white" elevated>
-        <QToolbar
-            class="q-py-sm q-px-md"
-            :class="{ 'q-gutter-x-sm': !quasar.platform.is.mobile }"
-        >
+    <QHeader color="white" elevated>
+        <QToolbar class="q-py-sm q-px-md">
             <QBtn @click="stateStore.toggleLeftDrawer()" icon="menu" round dense flat>
                 <QTooltip bottom anchor="bottom right">
                     {{ t('globals.collapseMenu') }}
@@ -108,6 +105,9 @@ const pinnedModulesRef = ref();
 .searchbar {
     width: max-content;
 }
+.q-header {
+    background-color: var(--vn-dark);
+}
 </style>
 <i18n>
 en:

src/components/common/VnBreadcrumbs.vue

@@ -69,6 +69,10 @@ function getBreadcrumb(param) {
     > div {
         flex-wrap: nowrap;
     }
+    &--last,
+    &__separator {
+        color: var(--vn-label);
+    }
 }
 @media (max-width: $breakpoint-md) {
     .q-breadcrumbs {

src/components/ui/VnLv.vue

@@ -5,7 +5,7 @@ import { dashIfEmpty } from 'src/filters';
 const $props = defineProps({
     label: { type: String, default: null },
     value: {
-        type: [String, Boolean],
+        type: [String, Boolean, Number],
         default: null,
     },
     info: { type: String, default: null },

src/i18n/es/index.js

@@ -371,7 +371,7 @@ export default {
     },
     invoiceOut: {
         pageTitles: {
-            invoiceOuts: 'Fact. emitidas',
+            invoiceOuts: 'Crear factura',
             list: 'Listado',
             negativeBases: 'Bases Negativas',
             globalInvoicing: 'Facturación global',

src/pages/InvoiceIn/InvoiceInList.vue

@@ -84,9 +84,9 @@ function viewSummary(id) {
                         :key="row.id"
                         :title="row.supplierRef"
                         @click="navigate(row.id)"
+                        :id="row.id"
                     >
                         <template #list-items>
-                            <VnLv label="ID" :value="row.id" />
                             <VnLv
                                 :label="t('invoiceIn.list.supplierRef')"
                                 :value="row.supplierRef"
@@ -112,42 +112,34 @@ function viewSummary(id) {
                                 :label="t('invoiceIn.list.amount')"
                                 :value="toCurrency(row.amount)"
                             />
-                            <VnLv :label="t('invoiceIn.list.isBooked')">
-                                <template #value>
-                                    <QCheckbox
-                                        class="no-pointer-events"
-                                        v-model="row.isBooked"
-                                        size="xs"
-                                        :true-value="1"
-                                        :false-value="0"
-                                    />
-                                </template>
-                            </VnLv>
+                            <VnLv
+                                :label="t('invoiceIn.list.isBooked')"
+                                :value="!!row.isBooked"
+                            />
                         </template>
                         <template #actions>
                             <QBtn
-                                flat
-                                icon="arrow_circle_right"
+                                :label="t('components.smartCard.openCard')"
                                 @click.stop="navigate(row.id)"
-                            >
-                                <QTooltip>
-                                    {{ t('components.smartCard.openCard') }}
-                                </QTooltip>
-                            </QBtn>
-                            <QBtn flat icon="preview" @click.stop="viewSummary(row.id)">
-                                <QTooltip>
-                                    {{ t('components.smartCard.openSummary') }}
-                                </QTooltip>
-                            </QBtn>
+                                class="bg-vn-dark"
+                                outline
+                                type="reset"
+                            />
+
                             <QBtn
-                                flat
-                                icon="cloud_download"
+                                :label="t('components.smartCard.openSummary')"
+                                @click.stop="viewSummary(row.id)"
+                                color="primary"
+                                type="submit"
+                                class="q-mt-sm"
+                            />
+                            <QBtn
+                                :label="t('Download')"
+                                class="q-mt-sm"
                                 @click.stop="downloadFile(row.dmsFk)"
-                            >
-                                <QTooltip>
-                                    {{ t('components.smartCard.downloadFile') }}
-                                </QTooltip>
-                            </QBtn>
+                                type="submit"
+                                color="primary"
+                            />
                         </template>
                     </CardList>
                 </template>
@@ -176,4 +168,5 @@ function viewSummary(id) {
 es:
     Search invoice: Buscar factura emitida
     You can search by invoice reference: Puedes buscar por referencia de la factura
+    Download: Descargar
 </i18n>

src/stores/useNavigationStore.js

@@ -11,13 +11,13 @@ export const useNavigationStore = defineStore('navigationStore', () => {
         'claim',
         'ticket',
         'invoiceOut',
+        'invoiceIn',
         'worker',
         'shelving',
         'wagon',
         'route',
         'supplier',
         'travel',
-        'invoiceIn',
     ];
     const pinnedModules = ref([]);
     const role = useRole();

test/cypress/integration/invoiceIn/invoiceInList.spec.js

@@ -1,8 +1,8 @@
 /// <reference types="cypress" />
 describe('InvoiceInList', () => {
     const firstCard = '.q-card:nth-child(1)';
-    const firstId =
-        '.q-card:nth-child(1) .list-items > .vn-label-value:first-child > .value > span';
+    const firstChipId =
+        ':nth-child(1) > :nth-child(1) > .justify-between > .flex > .q-chip > .q-chip__content';
     const firstDetailBtn = '.q-card:nth-child(1) .q-btn:nth-child(2)';
     const summaryHeaders = '.summaryBody .header';
 
@@ -12,9 +12,10 @@ describe('InvoiceInList', () => {
     });
 
     it('should redirect on clicking a invoice', () => {
-        cy.get(firstId)
+        cy.get(firstChipId)
             .invoke('text')
-            .then((id) => {
+            .then((content) => {
+                const id = content.substring(4);
                 cy.get(firstCard).click();
                 cy.url().should('include', `/invoice-in/${id}/summary`);
             });