feat: refs #6696 refactor ticketSale

src/pages/Claim/Card/ClaimLines.vue

@@ -123,8 +123,8 @@ async function fetchMana() {
 
 async function updateDiscount({ saleFk, discount, canceller }) {
     const body = { salesIds: [saleFk], newDiscount: discount };
-    const claimId = claim.value.ticketFk;
-    const query = `Tickets/${claimId}/updateDiscount`;
+    const ticketFk = claim.value.ticketFk;
+    const query = `Tickets/${ticketFk}/updateDiscount`;
 
     await axios.post(query, body, {
         signal: canceller.signal,

src/pages/Ticket/Card/TicketEditMana.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, onBeforeMount } from 'vue';
+import { ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { toCurrency } from 'src/filters';
 import axios from 'axios';
@@ -13,7 +13,7 @@ const $props = defineProps({
     },
 });
 
-const emit = defineEmits(['save', 'cancel']);
+const emit = defineEmits(['save', 'cancel', 'show']);
 
 const { t } = useI18n();
 const QPopupProxyRef = ref(null);
@@ -31,23 +31,21 @@ const cancel = () => {
     QPopupProxyRef.value.hide();
 };
 
-onBeforeMount(async () => {
-    try {
-        const { data: manaData } = await axios.get(
-            `Tickets/${route.params.id}/getSalesPersonMana`
-        );
-        mana.value = manaData;
+async function onShow() {
+    const { data: manaData } = await axios.get(
+        `Tickets/${route.params.id}/getSalesPersonMana`
+    );
+    mana.value = manaData;
 
-        const { data: usesManaData } = await axios.get('Sales/usesMana');
-        usesMana.value = usesManaData;
-    } catch (error) {
-        console.error('Error fetching mana data:', error);
-    }
-});
+    const { data: usesManaData } = await axios.get('Sales/usesMana');
+    usesMana.value = usesManaData;
+
+    emit('show');
+}
 </script>
 
 <template>
-    <QPopupProxy ref="QPopupProxyRef">
+    <QPopupProxy ref="QPopupProxyRef" @show="onShow()">
         <QForm @submit="save">
             <div>
                 <QSpinner v-if="!mana" color="primary" size="md" />

src/pages/Ticket/Card/TicketSale.vue

@@ -8,7 +8,7 @@ import FetchedTags from 'components/ui/FetchedTags.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 import VnSelect from 'src/components/common/VnSelect.vue';
 import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
-import TicketEditManaProxy from './TicketEditMana.vue';
+import TicketEditMana from './TicketEditMana.vue';
 import VnImg from 'src/components/ui/VnImg.vue';
 import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
 import TicketSaleMoreActions from './TicketSaleMoreActions.vue';
@@ -28,7 +28,6 @@ const stateStore = useStateStore();
 const { t } = useI18n();
 const { notify } = useNotify();
 const { openConfirmationModal } = useVnConfirm();
-const editPriceProxyRef = ref(null);
 const stateBtnDropdownRef = ref(null);
 const quasar = useQuasar();
 const arrayData = useArrayData('ticketData');
@@ -41,7 +40,6 @@ const isTicketEditable = ref(false);
 const sales = ref([]);
 const editableStatesOptions = ref([]);
 const selectedSales = ref([]);
-const componentName = ref('mana');
 const ticketState = computed(() => store.data?.ticketState?.state?.code);
 const transfer = ref({
     lastActiveTickets: [],
@@ -132,7 +130,7 @@ const columns = computed(() => [
     },
     {
         align: 'left',
-        label: t('ticketSale.packaging'),
+        label: t('ticketSale.pack'),
         name: 'itemPackingTypeFk',
         format: (row, dashIfEmpty) => dashIfEmpty(row?.item?.itemPackingTypeFk),
     },
@@ -259,7 +257,7 @@ const onOpenEditPricePopover = async (sale) => {
     };
 };
 
-const onOpenEditDiscountPopover = async (sale) => {
+const onDiscountClick = async (sale) => {
     if (isLocked.value) return;
     if (sale) {
         edit.value = {
@@ -268,46 +266,36 @@ const onOpenEditDiscountPopover = async (sale) => {
         };
     } else {
         edit.value = {
+            sales: selectedValidSales.value || [],
             discount: null,
-            sales: selectedValidSales.value,
         };
     }
 };
 
-const updatePrice = async (sale) => {
+const updatePrice = async (sale, componentName) => {
     canProceed.value = await isSalePrepared(sale);
     if (!canProceed.value) return;
     const newPrice = edit.value.price;
     if (newPrice != null && newPrice != sale.price) {
-        await axios.post(`Sales/${sale.id}/updatePrice`, { newPrice });
+        await axios.post(`Sales/${sale.id}/updatePrice`, { newPrice, componentName });
         sale.price = newPrice;
         edit.value = { ...DEFAULT_EDIT };
         notify('globals.dataSaved', 'positive');
     }
 };
 
-const changeDiscount = async (sale) => {
-    canProceed.value = await isSalePrepared(sale);
-    if (!canProceed.value) return;
-    const newDiscount = edit.value.discount;
-    if (newDiscount != null && newDiscount != sale.discount) await updateDiscount([sale]);
-};
+const updateDiscount = async (sales, componentName, newDiscount) => {
+    const hasChanges = sales.some((sale) => sale.discount != newDiscount);
+    if (!hasChanges || newDiscount == null || newDiscount === '') return;
+    const canProceed = await Promise.all(sales.map((sale) => isSalePrepared(sale)));
+    if (canProceed.includes(false)) return;
 
-const updateDiscount = async (sales, newDiscount = null) => {
-    for (const sale of sales) {
-        const canProceed = await isSalePrepared(sale);
-        if (!canProceed) return;
-    }
     const saleIds = sales.map((sale) => sale.id);
-    const _newDiscount = newDiscount || edit.value.discount;
-    const params = {
-        salesIds: saleIds,
-        newDiscount: _newDiscount,
-        componentName: componentName.value,
-    };
+    const params = { salesIds: saleIds, newDiscount, componentName };
+
     await axios.post(`Tickets/${route.params.id}/updateDiscount`, params);
     notify('globals.dataSaved', 'positive');
-    for (let sale of sales) sale.discount = _newDiscount;
+    for (let sale of sales) sale.discount = params.newDiscount;
     edit.value = { ...DEFAULT_EDIT };
 };
 
@@ -769,51 +757,44 @@ watch(
         </template>
         <template #column-price="{ row }">
             <template v-if="isTicketEditable && row.id">
-                <QBtn flat class="link" dense @click="onOpenEditPricePopover(row)">
+                <QBtn flat class="link" dense>
                     {{ toCurrency(row.price) }}
+                    <TicketEditMana
+                        :new-price="getNewPrice"
+                        @show="onOpenEditPricePopover(row)"
+                        @save="(componentName) => updatePrice(row, componentName)"
+                    >
+                        <VnInput
+                            v-model.number="edit.price"
+                            :label="t('basicData.price')"
+                            type="number"
+                        />
+                    </TicketEditMana>
                 </QBtn>
-
-                <TicketEditManaProxy
-                    ref="editPriceProxyRef"
-                    :new-price="getNewPrice"
-                    @save="
-                        (newManaCode) => {
-                            componentName = newManaCode;
-                            updatePrice(row);
-                        }
-                    "
-                >
-                    <VnInput
-                        v-model.number="edit.price"
-                        :label="t('basicData.price')"
-                        type="number"
-                    />
-                </TicketEditManaProxy>
             </template>
             <span v-else>{{ toCurrency(row.price) }}</span>
         </template>
         <template #column-discount="{ row }">
             <template v-if="!isLocked && row.id">
-                <QBtn flat class="link" dense @click="onOpenEditDiscountPopover(row)">
+                <QBtn flat class="link" dense>
                     {{ toPercentage(row.discount / 100) }}
+                    <TicketEditMana
+                        :new-price="getNewPrice"
+                        @show="onDiscountClick(row)"
+                        @save="
+                            (componentName) =>
+                                updateDiscount([row], componentName, edit.discount)
+                        "
+                    >
+                        <VnInput
+                            v-model.number="edit.discount"
+                            :label="t('ticketSale.discount')"
+                            type="number"
+                            @keydown.enter.prevent.stop
+                            autofocus
+                        />
+                    </TicketEditMana>
                 </QBtn>
-                <TicketEditManaProxy
-                    :new-price="getNewPrice"
-                    @save="
-                        (newManaCode) => {
-                            componentName = newManaCode;
-                            changeDiscount(row);
-                        }
-                    "
-                >
-                    <VnInput
-                        v-model.number="edit.discount"
-                        :label="t('ticketSale.discount')"
-                        type="number"
-                        @keydown.enter.prevent.stop
-                        autofocus
-                    />
-                </TicketEditManaProxy>
             </template>
             <span v-else>{{ toPercentage(row.discount / 100) }}</span>
         </template>

src/pages/Ticket/Card/TicketSaleMoreActions.vue

@@ -5,7 +5,7 @@ import { useQuasar } from 'quasar';
 import { useRouter } from 'vue-router';
 
 import VnSmsDialog from 'components/common/VnSmsDialog.vue';
-import TicketEditManaProxy from './TicketEditMana.vue';
+import TicketEditMana from './TicketEditMana.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 
 import useNotify from 'src/composables/useNotify.js';
@@ -14,7 +14,7 @@ import { toDateFormat } from 'src/filters/date';
 import { useRole } from 'src/composables/useRole';
 import { useVnConfirm } from 'composables/useVnConfirm';
 
-const emit = defineEmits(['updateDiscounts', 'getMana', 'refreshTable']);
+const emit = defineEmits(['updateDiscounts', 'refreshTable']);
 
 const props = defineProps({
     disable: {
@@ -34,14 +34,6 @@ const props = defineProps({
         type: Array,
         default: () => [],
     },
-    mana: {
-        type: Number,
-        default: null,
-    },
-    usesMana: {
-        type: Boolean,
-        default: false,
-    },
     ticketConfig: {
         type: Array,
         default: () => [],
@@ -114,13 +106,9 @@ const calculateSalePrice = async () => {
     emit('refreshTable', props.sales);
 };
 
-const changeMultipleDiscount = () => {
-    const hasChanges = props.sales.some((sale) => {
-        return sale.discount != newDiscount.value;
-    });
-
-    if (newDiscount.value != null && hasChanges)
-        emit('updateDiscounts', props.sales, newDiscount.value);
+const changeMultipleDiscount = (componentName, newDiscount) => {
+    if (newDiscount != null)
+        emit('updateDiscounts', props.sales, componentName, newDiscount);
     btnDropdownRef.value.hide();
 };
 
@@ -209,19 +197,15 @@ const createRefund = async (withWarehouse) => {
                     <QItemLabel>{{ t('Recalculate price') }}</QItemLabel>
                 </QItemSection>
             </QItem>
-            <QItem
-                clickable
-                v-ripple
-                @click="emit('getMana')"
-                data-cy="updateDiscountItem"
-            >
+            <QItem clickable v-ripple data-cy="updateDiscountItem">
                 <QItemSection>
                     <QItemLabel>{{ t('Update discount') }}</QItemLabel>
                 </QItemSection>
-                <TicketEditManaProxy
-                    :uses-mana="props.usesMana"
-                    :mana="props.mana"
-                    @save="changeMultipleDiscount()"
+                <TicketEditMana
+                    @save="
+                        (componentName) =>
+                            changeMultipleDiscount(componentName, newDiscount)
+                    "
                 >
                     <VnInput
                         v-model.number="newDiscount"
@@ -229,7 +213,7 @@ const createRefund = async (withWarehouse) => {
                         type="number"
                         data-cy="ticketSaleDiscountInput"
                     />
-                </TicketEditManaProxy>
+                </TicketEditMana>
             </QItem>
             <QItem
                 v-if="isClaimable"

src/pages/Ticket/locale/en.yml

@@ -15,6 +15,7 @@ ticketSale:
     available: Available
     discount: Disc
     packaging: Packaging
+    pack: Pack.
     subtotal: Subtotal
     tax: VAT
     history: History

src/pages/Ticket/locale/es.yml

@@ -116,6 +116,7 @@ ticketSale:
     available: Disponible
     discount: Dto
     packaging: Encajado
+    pack: Enc.
     subtotal: Subtotal
     tax: IVA
     history: Historial