From 373ca0b3f1cd3063fb6af74ac8f7169f2cb4fb64 Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Wed, 11 Sep 2024 14:25:10 +0200
Subject: [PATCH] feat:TicketLackTable updates

---
 src/pages/Ticket/Negative/TicketLackTable.vue | 127 +++++++++++++-----
 src/pages/Ticket/locale/en.yml                |   1 +
 src/pages/Ticket/locale/es.yml                |   1 +
 3 files changed, 93 insertions(+), 36 deletions(-)

diff --git a/src/pages/Ticket/Negative/TicketLackTable.vue b/src/pages/Ticket/Negative/TicketLackTable.vue
index fa3536703..613e58ab4 100644
--- a/src/pages/Ticket/Negative/TicketLackTable.vue
+++ b/src/pages/Ticket/Negative/TicketLackTable.vue
@@ -12,6 +12,8 @@ import { useDialogPluginComponent } from 'quasar';
 import ZoneDescriptorProxy from 'pages/Zone/Card/ZoneDescriptorProxy.vue';
 import { useRoute } from 'vue-router';
 import VnTable from 'src/components/VnTable/VnTable.vue';
+import TicketDescriptorProxy from '../Card/TicketDescriptorProxy.vue';
+const rowsSelected = ref([]);
 
 const { t } = useI18n();
 const URL_KEY = 'Tickets/ItemLack';
@@ -65,13 +67,27 @@ const columns = computed(() => [
         align: 'left',
         sortable: false,
         columnClass: 'expand',
+        columnFilter: false,
+    },
+    {
+        name: 'saleFk',
+        label: t('negative.detail.saleFk'),
+        align: 'left',
+        sortable: true,
+        columnFilter: {
+            component: 'number',
+        },
+        columnClass: 'shrink',
     },
     {
         name: 'ticketFk',
         label: t('negative.detail.ticketFk'),
-        field: 'ticketFk',
         align: 'left',
         sortable: true,
+        columnFilter: {
+            component: 'number',
+        },
+        columnClass: 'shrink',
     },
     {
         name: 'shipped',
@@ -80,21 +96,43 @@ const columns = computed(() => [
         align: 'left',
         format: ({ shipped }) => toDate(shipped),
         sortable: true,
+        columnFilter: {
+            component: 'date',
+            columnClass: 'shrink',
+        },
     },
     {
         name: 'theoreticalhour',
         label: t('negative.detail.theoreticalhour'),
         field: 'theoreticalhour',
         align: 'left',
-        sortable: true,
         format: ({ theoreticalhour }) => toHour(theoreticalhour),
+        sortable: true,
+        columnFilter: {
+            component: 'time',
+            columnClass: 'shrink',
+        },
     },
     {
-        name: 'state',
+        name: 'alertLevelCode',
         label: t('negative.detail.state'),
         field: 'code',
         align: 'left',
         sortable: true,
+        columnField: {
+            component: null,
+        },
+        columnFilter: {
+            component: 'select',
+            attrs: {
+                url: 'AlertLevels',
+                fields: ['id', 'code'],
+                'sort-by': 'code ASC',
+                'option-value': 'id',
+                'option-label': 'code',
+                dense: true,
+            },
+        },
     },
     {
         name: 'zoneName',
@@ -116,7 +154,10 @@ const columns = computed(() => [
         field: 'quantity',
         align: 'left',
         sortable: true,
-        style: 'width: 100px',
+        columnFilter: {
+            component: 'number',
+            columnClass: 'shrink',
+        },
     },
 ]);
 const emit = defineEmits([...useDialogPluginComponent.emits, 'selection', 'close']);
@@ -172,48 +213,62 @@ const tableRef = ref(null);
         :url="`${URL_KEY}/${entityId}`"
         :columns="columns"
         :without-header="true"
-        :right-search="false"
         auto-load
         :create="false"
+        :create-as-dialog="false"
+        :use-model="true"
+        :filter="routeFilter"
+        :table="{
+            'row-key': 'id',
+            selection: 'multiple',
+        }"
+        dense
+        :is-editable="true"
+        :row-click="false"
+        :right-search="false"
+        v-model:selected="rowsSelected"
     >
         <!--
         <template #body="props">
             {{ props }}
         </template> -->
-        <template #column-status="props">
-            <QIcon
-                v-if="props.row.isRookie"
-                name="vn:person"
-                size="xs"
-                color="primary"
-                class="cursor-pointer"
+        <template #column-status="{ row }">
+            <QTd style="width: 150px">
+                <QIcon
+                    v-if="row.isRookie"
+                    name="vn:person"
+                    size="xs"
+                    color="primary"
+                    class="cursor-pointer"
+                >
+                    <QTooltip>{{ t('negative.detail.isRookie') }}</QTooltip>
+                </QIcon>
+                <QIcon
+                    v-if="row.peticionCompra"
+                    name="vn:buyrequest"
+                    size="xs"
+                    color="primary"
+                    class="cursor-pointer"
+                >
+                    <QTooltip>{{ t('negative.detail.peticionCompra') }}</QTooltip>
+                </QIcon>
+                <QIcon
+                    v-if="row.turno"
+                    name="vn:calendar"
+                    size="xs"
+                    color="primary"
+                    class="cursor-pointer"
+                >
+                    <QTooltip>{{ t('negative.detail.turno') }}</QTooltip>
+                </QIcon></QTd
             >
-                <QTooltip>{{ t('negative.detail.isRookie') }}</QTooltip>
-            </QIcon>
-            <QIcon
-                v-if="props.row.peticionCompra"
-                name="vn:buyrequest"
-                size="xs"
-                color="primary"
-                class="cursor-pointer"
-            >
-                <QTooltip>{{ t('negative.detail.peticionCompra') }}</QTooltip>
-            </QIcon>
-            <QIcon
-                v-if="props.row.turno"
-                name="vn:calendar"
-                size="xs"
-                color="primary"
-                class="cursor-pointer"
-            >
-                <QTooltip>{{ t('negative.detail.turno') }}</QTooltip>
-            </QIcon>
         </template>
-        <template #column-ticketFk="{ col }"
-            >{{ col.value }} <ItemDescriptorProxy :id="$props.entityId"
+        <template #column-ticketFk="{ row }"
+            ><span class="link">{{ row.ticketFk }}</span>
+            <TicketDescriptorProxy :id="row.ticketFk"
         /></template>
-        <template #column-zoneName="{ row, col }">
-            {{ col.value }}
+        <template #column-zoneName="{ row }">
+            <span class="link">{{ row.zoneName }}</span>
             <ZoneDescriptorProxy :id="row.zoneFk" />
         </template>
     </VnTable>
diff --git a/src/pages/Ticket/locale/en.yml b/src/pages/Ticket/locale/en.yml
index b66e2005c..f676f7628 100644
--- a/src/pages/Ticket/locale/en.yml
+++ b/src/pages/Ticket/locale/en.yml
@@ -278,6 +278,7 @@ negative:
         title: Confirm split selected
         question: 'Select a state to update'
     detail:
+        saleFk: 'Sale'
         itemFk: 'Article'
         ticketFk: 'Ticket'
         code: 'Code'
diff --git a/src/pages/Ticket/locale/es.yml b/src/pages/Ticket/locale/es.yml
index 4176f57b7..09947a250 100644
--- a/src/pages/Ticket/locale/es.yml
+++ b/src/pages/Ticket/locale/es.yml
@@ -281,6 +281,7 @@ negative:
         title: Confirmar acción de split
         question: 'Selecciona un estado'
     detail:
+        saleFk: 'Línea'
         itemFk: 'Artículo'
         ticketFk: 'Ticket'
         code: 'code'