From ac6d98cd36691ee748ca41b365e9cf25a4280ad1 Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Fri, 20 Sep 2024 11:22:51 +0200
Subject: [PATCH 1/6] fix: refs #7353 horizontal scroll

---
 src/components/VnTable/VnTable.vue          | 20 +++--
 src/components/VnTable/VnVisibleColumn.vue  |  2 +-
 src/pages/Monitor/MonitorClients.vue        |  7 +-
 src/pages/Monitor/Ticket/MonitorTickets.vue | 92 +++++++++------------
 4 files changed, 59 insertions(+), 62 deletions(-)

diff --git a/src/components/VnTable/VnTable.vue b/src/components/VnTable/VnTable.vue
index 5b39265fb..2c9526ec0 100644
--- a/src/components/VnTable/VnTable.vue
+++ b/src/components/VnTable/VnTable.vue
@@ -415,7 +415,7 @@ function handleOnDataSaved(_, res) {
                     <QBtn
                         v-if="$props.rightSearch"
                         icon="filter_alt"
-                        class="bg-vn-section-color q-ml-md"
+                        class="bg-vn-section-color q-ml-sm"
                         dense
                         @click="stateStore.toggleRightDrawer()"
                     />
@@ -502,8 +502,9 @@ function handleOnDataSaved(_, res) {
                             :key="index"
                             :title="btn.title"
                             :icon="btn.icon"
-                            class="q-px-sm"
+                            class="q-pa-xs"
                             flat
+                            dense
                             :class="
                                 btn.isPrimary ? 'text-primary-light' : 'color-vn-text '
                             "
@@ -745,10 +746,16 @@ es:
     }
 }
 
-.q-table th {
-    padding: 0;
-}
+.q-table {
+    th {
+        padding: 0;
+    }
 
+    &__top {
+        padding: 12px 0px;
+        top: 0;
+    }
+}
 .vnTable {
     thead tr th {
         position: sticky;
@@ -757,9 +764,6 @@ es:
     thead tr:first-child th {
         top: 0;
     }
-    .q-table__top {
-        top: 0;
-    }
     tbody {
         .q-checkbox {
             display: flex;
diff --git a/src/components/VnTable/VnVisibleColumn.vue b/src/components/VnTable/VnVisibleColumn.vue
index 36f5ed7de..f5c3458cd 100644
--- a/src/components/VnTable/VnVisibleColumn.vue
+++ b/src/components/VnTable/VnVisibleColumn.vue
@@ -135,7 +135,7 @@ onMounted(async () => {
 });
 </script>
 <template>
-    <QBtn icon="vn:visible_columns" class="bg-vn-section-color q-mr-md q-px-sm" dense>
+    <QBtn icon="vn:visible_columns" class="bg-vn-section-color q-mr-sm q-px-sm" dense>
         <QPopupProxy ref="popupProxyRef">
             <QCard class="column q-pa-md">
                 <QIcon name="info" size="sm" class="info-icon">
diff --git a/src/pages/Monitor/MonitorClients.vue b/src/pages/Monitor/MonitorClients.vue
index ff51e4464..68b24b400 100644
--- a/src/pages/Monitor/MonitorClients.vue
+++ b/src/pages/Monitor/MonitorClients.vue
@@ -139,7 +139,10 @@ const columns = computed(() => [
     </VnTable>
 </template>
 <style lang="scss" scoped>
-.full-width .vn-row > * {
-    flex: 0.4;
+.full-width .vn-row {
+    margin-bottom: 0;
+    > * {
+        flex: 0.3;
+    }
 }
 </style>
diff --git a/src/pages/Monitor/Ticket/MonitorTickets.vue b/src/pages/Monitor/Ticket/MonitorTickets.vue
index 258b5022f..29bf42915 100644
--- a/src/pages/Monitor/Ticket/MonitorTickets.vue
+++ b/src/pages/Monitor/Ticket/MonitorTickets.vue
@@ -54,7 +54,7 @@ const columns = computed(() => [
         label: t('salesTicketsTable.problems'),
         name: 'totalProblems',
         align: 'left',
-
+        columnClass: 'no-padding',
         columnFilter: false,
         attrs: {
             dense: true,
@@ -65,7 +65,6 @@ const columns = computed(() => [
         name: 'id',
         field: 'id',
         align: 'left',
-
         columnFilter: {
             component: 'number',
             name: 'id',
@@ -110,7 +109,6 @@ const columns = computed(() => [
         name: 'shippedDate',
         style: { 'max-width': '100px' },
         align: 'left',
-
         columnFilter: {
             component: 'date',
             name: 'shippedDate',
@@ -164,7 +162,6 @@ const columns = computed(() => [
         label: t('salesTicketsTable.state'),
         name: 'state',
         align: 'left',
-        style: { 'max-width': '100px' },
         columnFilter: {
             component: 'select',
             name: 'stateFk',
@@ -193,7 +190,6 @@ const columns = computed(() => [
         label: t('salesTicketsTable.zone'),
         name: 'zoneFk',
         align: 'left',
-
         columnFilter: {
             component: 'select',
             name: 'zoneFk',
@@ -210,8 +206,7 @@ const columns = computed(() => [
         name: 'totalWithVat',
         field: 'totalWithVat',
         align: 'left',
-        style: { 'max-width': '75px' },
-
+        style: 'max-width: 75px',
         columnFilter: {
             component: 'number',
             name: 'totalWithVat',
@@ -370,7 +365,7 @@ const openTab = (id) =>
             </QCheckbox>
         </template>
         <template #column-totalProblems="{ row }">
-            <QTd class="no-padding" style="max-width: 60px">
+            <span>
                 <QIcon
                     v-if="row.isTaxDataChecked === 0"
                     name="vn:no036"
@@ -424,46 +419,40 @@ const openTab = (id) =>
                 >
                     <QTooltip>{{ $t('salesTicketsTable.tooLittle') }}</QTooltip>
                 </QIcon>
-            </QTd>
+            </span>
         </template>
         <template #column-id="{ row }">
-            <QTd class="no-padding">
-                <span class="link" @click.stop.prevent>
-                    {{ row.id }}
-                    <TicketDescriptorProxy :id="row.id" />
-                </span>
-            </QTd>
+            <span class="link" @click.stop.prevent>
+                {{ row.id }}
+                <TicketDescriptorProxy :id="row.id" />
+            </span>
         </template>
         <template #column-clientFk="{ row }">
-            <QTd class="no-padding" @click.stop :title="row.nickname">
-                <span class="link">{{ row.nickname }}</span>
+            <div @click.stop :title="row.nickname">
+                <span class="link" v-text="row.nickname" />
                 <CustomerDescriptorProxy :id="row.clientFk" />
-            </QTd>
+            </div>
         </template>
         <template #column-salesPersonFk="{ row }">
-            <QTd class="no-padding" @click.stop :title="row.userName">
+            <div @click.stop :title="row.userName">
                 <span class="link" v-text="dashIfEmpty(row.userName)" />
                 <WorkerDescriptorProxy :id="row.salesPersonFk" />
-            </QTd>
+            </div>
         </template>
         <template #column-shippedDate="{ row }">
-            <QTd class="no-padding">
-                <QBadge
-                    v-bind="getBadgeAttrs(row.shippedDate)"
-                    class="q-pa-sm"
-                    style="font-size: 14px"
-                >
-                    {{ formatShippedDate(row.shippedDate) }}
-                </QBadge>
-            </QTd>
+            <QBadge
+                v-bind="getBadgeAttrs(row.shippedDate)"
+                class="q-pa-sm"
+                style="font-size: 14px"
+            >
+                {{ formatShippedDate(row.shippedDate) }}
+            </QBadge>
         </template>
         <template #column-provinceFk="{ row }">
-            <QTd class="no-padding">
-                <span :title="row.province" v-text="row.province" />
-            </QTd>
+            <span :title="row.province" v-text="row.province" />
         </template>
         <template #column-state="{ row }">
-            <QTd class="no-padding" @click.stop.prevent>
+            <div @click.stop.prevent>
                 <div v-if="row.refFk">
                     <span class="link">{{ row.refFk }}</span>
                     <InvoiceOutDescriptorProxy :id="row.invoiceOutId" />
@@ -477,32 +466,33 @@ const openTab = (id) =>
                 >
                     {{ row.state }}
                 </QBadge>
-            </QTd>
+            </div>
         </template>
         <template #column-isFragile="{ row }">
-            <QTd class="no-padding">
-                <QIcon v-if="row.isFragile" name="local_bar" color="primary" size="sm">
-                    <QTooltip>{{ $t('salesTicketsTable.isFragile') }}</QTooltip>
-                </QIcon>
-            </QTd>
+            <QIcon v-if="row.isFragile" name="local_bar" color="primary" size="sm">
+                <QTooltip>{{ $t('salesTicketsTable.isFragile') }}</QTooltip>
+            </QIcon>
         </template>
         <template #column-zoneFk="{ row }">
-            <QTd class="no-padding" @click.stop.prevent :title="row.zoneName">
+            <div @click.stop.prevent :title="row.zoneName">
                 <span class="link">{{ row.zoneName }}</span>
                 <ZoneDescriptorProxy :id="row.zoneFk" />
-            </QTd>
+            </div>
         </template>
         <template #column-totalWithVat="{ row }">
-            <QTd class="no-padding">
-                <QBadge
-                    :color="totalPriceColor(row) || 'transparent'"
-                    :text-color="totalPriceColor(row) ? 'black' : 'white'"
-                    class="q-pa-sm"
-                    style="font-size: 14px"
-                >
-                    {{ toCurrency(row.totalWithVat) }}
-                </QBadge>
-            </QTd>
+            <QBadge
+                :color="totalPriceColor(row) || 'transparent'"
+                :text-color="totalPriceColor(row) ? 'black' : 'white'"
+                class="q-pa-sm"
+                style="font-size: 14px"
+            >
+                {{ toCurrency(row.totalWithVat) }}
+            </QBadge>
         </template>
     </VnTable>
 </template>
+<style lang="scss" scoped>
+td .q-icon {
+    margin: 0 2px;
+}
+</style>

From e1f3589110f55936bb916ed20cc915fc8e0242fa Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Fri, 20 Sep 2024 12:17:10 +0200
Subject: [PATCH 2/6] fix: refs #7353 horizontal scroll

---
 src/pages/Monitor/Ticket/MonitorTickets.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/pages/Monitor/Ticket/MonitorTickets.vue b/src/pages/Monitor/Ticket/MonitorTickets.vue
index 29bf42915..4c6daca87 100644
--- a/src/pages/Monitor/Ticket/MonitorTickets.vue
+++ b/src/pages/Monitor/Ticket/MonitorTickets.vue
@@ -54,7 +54,6 @@ const columns = computed(() => [
         label: t('salesTicketsTable.problems'),
         name: 'totalProblems',
         align: 'left',
-        columnClass: 'no-padding',
         columnFilter: false,
         attrs: {
             dense: true,

From 87efc2f355d5bcc4dacc44ac6f90b2ca07698297 Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Fri, 20 Sep 2024 13:00:34 +0200
Subject: [PATCH 3/6] fix: refs #7353 responsive filters

---
 src/pages/Monitor/MonitorClients.vue | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/pages/Monitor/MonitorClients.vue b/src/pages/Monitor/MonitorClients.vue
index 68b24b400..e98e11c6d 100644
--- a/src/pages/Monitor/MonitorClients.vue
+++ b/src/pages/Monitor/MonitorClients.vue
@@ -141,8 +141,9 @@ const columns = computed(() => [
 <style lang="scss" scoped>
 .full-width .vn-row {
     margin-bottom: 0;
+    flex-direction: row;
     > * {
-        flex: 0.3;
+        max-width: 105px;
     }
 }
 </style>

From 3e101242f64b72cd6ab727e93fd4a9ddabd99b34 Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Fri, 20 Sep 2024 13:20:40 +0200
Subject: [PATCH 4/6] chore: refs #7353 drop useless code

---
 src/pages/Monitor/Ticket/MonitorTickets.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/pages/Monitor/Ticket/MonitorTickets.vue b/src/pages/Monitor/Ticket/MonitorTickets.vue
index 4c6daca87..f6e9848cf 100644
--- a/src/pages/Monitor/Ticket/MonitorTickets.vue
+++ b/src/pages/Monitor/Ticket/MonitorTickets.vue
@@ -205,7 +205,6 @@ const columns = computed(() => [
         name: 'totalWithVat',
         field: 'totalWithVat',
         align: 'left',
-        style: 'max-width: 75px',
         columnFilter: {
             component: 'number',
             name: 'totalWithVat',

From 7a253d314c6940c25100c3c78aa7dd79cf1126bd Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Fri, 20 Sep 2024 13:22:15 +0200
Subject: [PATCH 5/6] chore: refs #7353 drop useless code

---
 src/pages/Monitor/Ticket/MonitorTickets.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/pages/Monitor/Ticket/MonitorTickets.vue b/src/pages/Monitor/Ticket/MonitorTickets.vue
index f6e9848cf..16d5abffb 100644
--- a/src/pages/Monitor/Ticket/MonitorTickets.vue
+++ b/src/pages/Monitor/Ticket/MonitorTickets.vue
@@ -106,7 +106,6 @@ const columns = computed(() => [
     {
         label: t('salesTicketsTable.date'),
         name: 'shippedDate',
-        style: { 'max-width': '100px' },
         align: 'left',
         columnFilter: {
             component: 'date',

From df56eefe2f0ab236f475fd177ec22e0e9c435e14 Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Fri, 20 Sep 2024 15:46:54 +0200
Subject: [PATCH 6/6] fix: refs #7353 fine tunning ui

---
 src/pages/Monitor/MonitorClients.vue | 2 +-
 src/pages/Monitor/MonitorOrders.vue  | 1 -
 2 files changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/pages/Monitor/MonitorClients.vue b/src/pages/Monitor/MonitorClients.vue
index e98e11c6d..c1958cdcb 100644
--- a/src/pages/Monitor/MonitorClients.vue
+++ b/src/pages/Monitor/MonitorClients.vue
@@ -143,7 +143,7 @@ const columns = computed(() => [
     margin-bottom: 0;
     flex-direction: row;
     > * {
-        max-width: 105px;
+        max-width: 125px;
     }
 }
 </style>
diff --git a/src/pages/Monitor/MonitorOrders.vue b/src/pages/Monitor/MonitorOrders.vue
index eb455a239..52d442d0a 100644
--- a/src/pages/Monitor/MonitorOrders.vue
+++ b/src/pages/Monitor/MonitorOrders.vue
@@ -132,7 +132,6 @@ const openTab = (id) =>
         :table="{
             'row-key': 'id',
             selection: 'multiple',
-            'hide-bottom': true,
         }"
         default-mode="table"
         :row-click="({ id }) => openTab(id)"