src/components/VnTable/VnTable.vue

@@ -403,6 +403,11 @@ function handleOnDataSaved(_) {
                 <template #top-left v-if="!$props.withoutHeader">
                     <slot name="top-left"></slot>
                 </template>
+                <template #body-selection="props">
+                    <slot name="body-selection" v-bind="props">
+                        <QCheckbox class="q-ma-xs" v-model="props.selected"></QCheckbox>
+                    </slot>
+                </template>
 
                 <template #top-right v-if="!$props.withoutHeader">
                     <VnVisibleColumn

src/pages/Item/components/ItemProposal.vue

@@ -1,12 +1,13 @@
 <script setup>
 import { ref, computed, onUnmounted } from 'vue';
+import axios from 'axios';
 import { useI18n } from 'vue-i18n';
 import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
 import FetchedTags from 'components/ui/FetchedTags.vue';
 import VnImg from 'src/components/ui/VnImg.vue';
 import { toCurrency } from 'filters/index';
 import VnStockValueDisplay from 'src/components/ui/VnStockValueDisplay.vue';
-import { useDialogPluginComponent } from 'quasar';
+// import { useDialogPluginComponent } from 'quasar';
 import VnTable from 'src/components/VnTable/VnTable.vue';
 import VnInputNumber from 'src/components/common/VnInputNumber.vue';
 
@@ -49,6 +50,8 @@ const defaultColumnAttrs = {
     align: 'left',
     sortable: true,
 };
+const ticket = computed(() => $props.tickets[0]);
+const saleFk = computed(() => ticket.value.saleFk);
 const statusConditionalValue = (row) => {
     const total = MATCH_VALUES.reduce((acc, i) => acc + row[`match${i}`], 0);
     return total;
@@ -132,26 +135,43 @@ const columns = computed(() => [
 ]);
 
 async function confirm() {
-    emit('refreshData', { type: 'refresh', itemProposal: proposalSelected.value[0] });
-    proposalSelected.value = [];
-    popupProxyRef.value.hide();
+    try {
+        const params = {
+            saleFk: saleFk.value,
+            newItemFK: proposalSelected.value[0].id,
+            quantity: quantity.value,
+        };
+        const { data } = await axios.post('Sales/replaceItem', params);
+        emit('refreshData', {
+            type: 'refresh',
+            itemProposal: proposalSelected.value[0],
+            ...data,
+        });
+        proposalSelected.value = [];
+        popupProxyRef.value.hide();
+    } catch (error) {
+        console.error(error);
+    }
 }
-const { dialogRef, onDialogOK, onDialogCancel } = useDialogPluginComponent();
+// const { dialogRef, onDialogOK, onDialogCancel } = useDialogPluginComponent();
 const popupProxyRef = ref(null);
-const emit = defineEmits(['dialogClosed', 'refreshData']);
+const emit = defineEmits(['onDialogClosed', 'refreshData']);
 
-function onDialogClose() {
-    console.log('Dialog has been closed');
-    // Emitir el evento personalizado
-    emit('dialogClosed', { data: true });
-}
+// function onDialogClose() {
+//     console.log('Dialog has been closed');
+//     // Emitir el evento personalizado
+//     emit('onDialogClosed', { data: true });
+// }
 onUnmounted(() => {});
-function handleSelection(value, evt) {
+function handleSelection(value, _) {
     quantity.value = value.available;
 }
-const isSelectionAvailable = ({ row }) => {
+const isSelectionAvailable = (data) => {
+    if (!data?.row) return false;
+    const { row } = data;
     return $props.replaceAction && row.available >= $props.itemLack.lack * -1;
 };
+// watch(proposalSelected, ({ available }) => (quantity.value = available));
 </script>
 <template>
     <div style="min-width: 65vw">
@@ -179,7 +199,6 @@ const isSelectionAvailable = ({ row }) => {
             }"
         >
             <template #top-left>
-                {{ proposalSelected }}
                 <div v-if="$props.replaceAction" style="display: flex">
                     <QBtn
                         :label="t('globals.replace')"
@@ -201,13 +220,13 @@ const isSelectionAvailable = ({ row }) => {
                         class="q-ml-xs"
                     /></div
             ></template>
-            <template #body-selection="{ data }">
+            <template #body-selection="props">
                 <QCheckbox
                     class="q-ma-xs"
                     flat
-                    v-if="isSelectionAvailable(data)"
-                    v-model="data.selected"
-                    @update:model-value="(evt, _) => handleSelection(data.row, null)"
+                    v-if="isSelectionAvailable(props)"
+                    v-model="props.selected"
+                    @update:model-value="(evt, _) => handleSelection(props.row, null)"
                 >
                 </QCheckbox>
             </template>

src/pages/Item/components/ItemProposalProxy.vue

@@ -42,6 +42,8 @@ const $props = defineProps({
                     <ItemDescriptorProxy :id="item.id" />
                 </QBtn>
                 <FetchedTags :item="item" />
+
+                <!-- {{ tickets[0].saleFk }} -->
             </QCardSection>
             <QCardSection class="q-pt-none">
                 <ItemProposal v-bind="$props"></ItemProposal

src/pages/Ticket/Negative/TicketLackDetail.vue

@@ -69,7 +69,7 @@ function freeFirst({ alertLevel: a }, { alertLevel: b }) {
 }
 const { store } = useArrayData(URL_KEY);
 const handleRows = (rows) => {
-    rows.forEach((row) => (row.concept = item.value.name));
+    // rows.forEach((row) => (row.concept = item.value.name));
     rows = rows.sort(freeFirst);
     if (showFree.value) return rows.filter(({ alertLevel }) => alertLevel === 0);
     return rows;
@@ -152,7 +152,11 @@ const replaceItem = () => {
                     >
                     </ChangeQuantityDialog>
                 </TicketMassiveUpdate>
-                <QBtn color="primary" icon="vn:splitline">
+                <QBtn
+                    color="primary"
+                    icon="vn:splitline"
+                    :disable="selectedRows.length < 1"
+                >
                     <QTooltip>{{ t('ticketSale.transferLines') }}</QTooltip>
                     <TicketTransfer
                         class="full-width"
@@ -162,7 +166,11 @@ const replaceItem = () => {
                         }"
                     ></TicketTransfer>
                 </QBtn>
-                <QBtn color="primary" @click="showProposalDialog = true">
+                <QBtn
+                    color="primary"
+                    @click="showProposalDialog = true"
+                    :disable="selectedRows.length < 1"
+                >
                     <QIcon name="import_export" class="rotate-90"></QIcon>
                     <ItemProposalProxy
                         ref="proposalDialogRef"
@@ -223,7 +231,11 @@ const replaceItem = () => {
                 </template>
             </VnPaginate>
         </div>
-        <TicketLackTable :filter="{ alertLevel: showFree }"></TicketLackTable>
+
+        <TicketLackTable
+            :filter="{ alertLevel: showFree }"
+            @update:selection="({ value }, _) => (selectedRows = value)"
+        ></TicketLackTable>
     </QPage>
 </template>
 <style lang="scss" scoped>

src/pages/Ticket/Negative/TicketLackTable.vue

@@ -10,7 +10,7 @@ import { useRoute } from 'vue-router';
 import VnTable from 'src/components/VnTable/VnTable.vue';
 import TicketDescriptorProxy from '../Card/TicketDescriptorProxy.vue';
 import VnInputNumber from 'src/components/common/VnInputNumber.vue';
-const rowsSelected = ref([]);
+const selectedRows = ref([]);
 const $props = defineProps({
     filter: {
         type: Object,
@@ -33,7 +33,7 @@ const filterLack = ref({
             },
         },
     ],
-    where: { alertLevel: 'FRasdEE' },
+    where: { alertLevel: 'FREE' },
 });
 const { t } = useI18n();
 const URL_KEY = 'Tickets/ItemLack';
@@ -178,11 +178,14 @@ const reload = async () => {
     itemLackForm.value.fetch();
 };
 defineExpose({ reload });
+const emit = defineEmits(['update:selection']);
 
 const tableRef = ref(null);
+watch(selectedRows, () => emit('update:selection', selectedRows));
 </script>
 
 <template>
+    {{ selectedRows }}
     <FetchData
         url="States/editableStates"
         @on-fetch="(data) => (editableStates = data)"
@@ -230,7 +233,7 @@ const tableRef = ref(null);
         :is-editable="true"
         :row-click="false"
         :right-search="false"
-        v-model:selected="rowsSelected"
+        v-model:selected="selectedRows"
     >
         <template #column-quantity="props">
             <VnInputNumber