From 2c81ddb4aa7b62d62093e4f32aa48774d66a4838 Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Tue, 17 Sep 2024 11:41:29 +0200
Subject: [PATCH] feat: updates

---
 src/components/VnTable/VnTable.vue            |  6 +-
 src/pages/Item/components/ItemProposal.vue    | 67 ++++++++-----------
 .../Item/components/ItemProposalProxy.vue     | 23 ++++++-
 .../Ticket/Negative/TicketLackDetail.vue      |  2 +-
 src/router/modules/ticket.js                  |  3 +-
 5 files changed, 54 insertions(+), 47 deletions(-)

diff --git a/src/components/VnTable/VnTable.vue b/src/components/VnTable/VnTable.vue
index 7f7af8d9d..39b2c3166 100644
--- a/src/components/VnTable/VnTable.vue
+++ b/src/components/VnTable/VnTable.vue
@@ -404,9 +404,9 @@ function handleOnDataSaved(_) {
                     <slot name="top-left"></slot>
                 </template>
                 <template #body-selection="scope">
-                    <pre>{{ scope }}</pre>
-
-                    <!-- <slot name="body-selection" :data="scope"></slot> -->
+                    <!-- <pre>{{ scope }}</pre> -->
+                    <slot name="body-selection" :data="scope"></slot>
+                    <!-- <QCheckbox class="q-ma-xs" v-if="scope"></QCheckbox> -->
                 </template>
                 <template #top-right v-if="!$props.withoutHeader">
                     <VnVisibleColumn
diff --git a/src/pages/Item/components/ItemProposal.vue b/src/pages/Item/components/ItemProposal.vue
index fbe1b5651..1fd7aa903 100644
--- a/src/pages/Item/components/ItemProposal.vue
+++ b/src/pages/Item/components/ItemProposal.vue
@@ -94,7 +94,6 @@ const columns = computed(() => [
         ...defaultColumnAttrs,
         label: t('proposal.difference'),
         name: 'difference',
-        format: ({ id }) => (id % 2 === 0 ? 10 : -10),
         columnFilter: {
             component: 'input',
             type: 'number',
@@ -103,7 +102,7 @@ const columns = computed(() => [
     },
     {
         ...defaultColumnAttrs,
-        label: t('Compatibildiad'),
+        label: t('proposal.compatibility'),
         name: 'status',
         field: statusConditionalValue,
         sortable: true,
@@ -224,6 +223,12 @@ function onDialogClose() {
     emit('dialogClosed', { data: true });
 }
 onUnmounted(() => {});
+function handleSelection(value, evt) {
+    quantity.value = value.available;
+}
+const isSelectionAvailable = ({ row }) => {
+    return $props.replaceAction && row.available >= $props.itemLack.lack * -1;
+};
 </script>
 <template>
     <!-- <QPopupProxy ref="popupProxyRef"> -->
@@ -255,10 +260,11 @@ onUnmounted(() => {});
             :disable-option="{ card: true, table: true }"
             :table="{
                 'row-key': 'id',
-                selection: 'multiple',
+                selection: 'single',
             }"
         >
             <template #top-left>
+                {{ proposalSelected }}
                 <div v-if="$props.replaceAction" style="display: flex">
                     <QBtn
                         :label="t('globals.replace')"
@@ -281,45 +287,26 @@ onUnmounted(() => {});
                     /></div
             ></template>
             <!-- <template #body="scope">{{ scope }}</template> -->
-            <template #body-selection>
-                <QTd align="center" v-if="$props.replaceAction">
-                    <!-- <pre>
-                        {{ row.selected }}
-
-                    </pre>
-                    {{ itemLack }} -->
-                    <!-- <QCheckbox
-                        v-model="scope.selected"
-                        :disable="!(scope.row.available >= itemLack.lack * -1)"
-                    >
-                        <QTooltip v-if="!(scope.row.available >= itemLack.lack * -1)">
-                            Nop</QTooltip
-                        >
-                    </QCheckbox> -->
-                    <!-- <div v-else class="q-ml-sm">
+            <template #body-selection="{ data }">
+                <!-- <QTd align="center"> -->
+                <!-- {{ data.row.available }}
+                {{ $props.itemLack.lack * -1 }} -->
+                <!-- {{
+                    $props.replaceAction &&
+                    data.row.available >= $props.itemLack.lack * -1
+                }} -->
+                <QCheckbox
+                    class="q-ma-xs"
+                    flat
+                    v-if="isSelectionAvailable(data)"
+                    v-model="data.selected"
+                    @update:model-value="(evt, _) => handleSelection(data.row, null)"
+                >
+                </QCheckbox>
+                <!-- <div v-else class="q-ml-sm">
                                             <QIcon name="info" size="sm"></QIcon>
                                             </div
-                                    >--></QTd
-                >
-            </template>
-            <template #top-row>
-                <!-- <QTr>
-                                        <QTd />
-                                        <QTd
-                                            v-for="(col, index) in cols"
-                                            :key="index"
-                                            style="max-width: 100px"
-                                        >
-                                            <component
-                                                :is="col.columnFilter.component"
-                                                v-if="col.columnFilter"
-                                                v-model="col.columnFilter.filterValue"
-                                                v-bind="col.columnFilter.attrs"
-                                                v-on="col.columnFilter.event(col)"
-                                                dense
-                                            />
-                                        </QTd>
-                                    </QTr> -->
+                                    >-->
             </template>
             <template #column-longName="{ row }">
                 <!-- <QTd align="left" class="text-primary"> -->
diff --git a/src/pages/Item/components/ItemProposalProxy.vue b/src/pages/Item/components/ItemProposalProxy.vue
index b8609d87a..e5163c752 100644
--- a/src/pages/Item/components/ItemProposalProxy.vue
+++ b/src/pages/Item/components/ItemProposalProxy.vue
@@ -1,5 +1,9 @@
 <script setup>
 import ItemProposal from './ItemProposal.vue';
+import VnImg from 'src/components/ui/VnImg.vue';
+import FetchedTags from 'components/ui/FetchedTags.vue';
+import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
+
 const $props = defineProps({
     item: {
         type: Object,
@@ -25,6 +29,23 @@ const $props = defineProps({
 </script>
 <template>
     <QPopupProxy>
-        <ItemProposal v-bind="$props"></ItemProposal>
+        <QCard class="q-pa-sm">
+            <QCardSection class="row items-center q-pb-none">
+                <span class="text-h6 text-grey">{{ $t('Item proposal') }}</span>
+                <QSpace />
+                <QBtn icon="close" flat round dense v-close-popup />
+            </QCardSection>
+            <QCardSection class="row items-center">
+                <VnImg :id="item.id" class="rounded image-wrapper"></VnImg>
+                <QBtn flat class="link text-blue">
+                    {{ item.longName }}
+                    <ItemDescriptorProxy :id="item.id" />
+                </QBtn>
+                <FetchedTags :item="item" />
+            </QCardSection>
+            <QCardSection class="q-pt-none">
+                <ItemProposal v-bind="$props"></ItemProposal
+            ></QCardSection>
+        </QCard>
     </QPopupProxy>
 </template>
diff --git a/src/pages/Ticket/Negative/TicketLackDetail.vue b/src/pages/Ticket/Negative/TicketLackDetail.vue
index 288185493..a451317bc 100644
--- a/src/pages/Ticket/Negative/TicketLackDetail.vue
+++ b/src/pages/Ticket/Negative/TicketLackDetail.vue
@@ -6,12 +6,12 @@ import ChangeQuantityDialog from 'pages/Ticket/Negative/components/ChangeQuantit
 import ChangeStateDialog from 'pages/Ticket/Negative/components/ChangeStateDialog.vue';
 import ItemProposal from 'pages/Item/components/ItemProposal.vue';
 import FetchedTags from 'components/ui/FetchedTags.vue';
+import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
 import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
 import TicketTransfer from '../Card/TicketTransfer.vue';
 import TicketMassiveUpdate from '../Card/TicketMassiveUpdate.vue';
 import VnPaginate from 'src/components/ui/VnPaginate.vue';
 import FetchData from 'src/components/FetchData.vue';
-import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
 import useNotify from 'src/composables/useNotify.js';
 import { useStateStore } from 'stores/useStateStore';
 import { useRoute } from 'vue-router';
diff --git a/src/router/modules/ticket.js b/src/router/modules/ticket.js
index 29396fcb8..e59aaae8f 100644
--- a/src/router/modules/ticket.js
+++ b/src/router/modules/ticket.js
@@ -58,11 +58,9 @@ export default {
                 {
                     path: 'negative',
                     redirect: { name: 'TicketNegative' },
-
                     children: [
                         {
                             name: 'TicketNegative',
-                            path: '',
                             meta: {
                                 title: 'negative',
                                 icon: 'view_list',
@@ -70,6 +68,7 @@ export default {
                             // redirect: { name: 'TicketNegative' },
                             component: () =>
                                 import('src/pages/Ticket/Negative/TicketLackList.vue'),
+                            path: '',
                         },
                         {
                             name: 'NegativeDetail',