feat(ticket): implementar useTicketData y reemplazar Promise.all() por Promise.allSettled() en TicketView para mejorar manejo de errores
gitea/hedera-web/pipeline/pr-beta This commit looks good Details

- Se reemplazó Promise.all() por Promise.allSettled() para que si una de las promesas falla, el resto pueda seguir ejecutándose. Esto evita que un solo fallo detenga toda la carga de datos.
This commit is contained in:
Guido 2025-04-25 11:19:26 -03:00
parent 65b715078e
commit 06806ebe10
2 changed files with 137 additions and 79 deletions

View File

@ -0,0 +1,133 @@
import { ref } from 'vue';
import { formatDate } from 'src/lib/filters.js';
export const useTicketData = api => {
const ticket = ref({});
const rows = ref([]);
const services = ref(null);
const packages = ref(null);
const dateFormat = 'DD/MM/YYYY';
const fetchTicketData = async ticketId => {
const { data } = await api.post(
'applications/myTicket_get/execute-proc',
{
schema: 'hedera',
params: [ticketId]
}
);
return data?.[0] || null;
};
const fetchTicketRows = async ticketId => {
const { data } = await api.post(
'applications/myTicket_getRows/execute-proc',
{
schema: 'hedera',
params: [ticketId]
}
);
return data || [];
};
const fetchTicketServices = async ticketId => {
const { data } = await api.post(
'applications/myTicket_getServices/execute-proc',
{
schema: 'hedera',
params: [ticketId]
}
);
return data || null;
};
const fetchTicketPackages = async ticketId => {
const { data } = await api.post(
'applications/myTicket_getPackages/execute-proc',
{
schema: 'hedera',
params: [ticketId]
}
);
return data || null;
};
const formatTicketDates = ticketData => {
if (!ticketData) return;
const dateFields = ['landed', 'shipped'];
dateFields.forEach(field => {
if (ticketData[field]) {
ticketData[field] = formatDate(ticketData[field], dateFormat);
}
});
};
const processResults = results => {
const [ticketResult, rowsResult, servicesResult, packagesResult] =
results;
const dataConfig = [
{
result: ticketResult,
ref: ticket,
errorMessage: 'Error al obtener datos del ticket',
postProcess: data => {
if (data) formatTicketDates(data);
return data;
}
},
{
result: rowsResult,
ref: rows,
errorMessage: 'Error al obtener filas del ticket'
},
{
result: servicesResult,
ref: services,
errorMessage: 'Error al obtener servicios del ticket'
},
{
result: packagesResult,
ref: packages,
errorMessage: 'Error al obtener paquetes del ticket'
}
];
dataConfig.forEach(({ result, ref, errorMessage, postProcess }) => {
if (result.status === 'fulfilled') {
ref.value = postProcess
? postProcess(result.value)
: result.value;
} else {
console.error(errorMessage, result.reason);
}
});
};
const loadTicketData = async ticketId => {
try {
const results = await Promise.allSettled([
fetchTicketData(ticketId),
fetchTicketRows(ticketId),
fetchTicketServices(ticketId),
fetchTicketPackages(ticketId)
]);
processResults(results);
} catch (error) {
console.error(
'Error en el procesamiento de datos del ticket:',
error
);
}
};
return {
ticket,
rows,
services,
packages,
loadTicketData
};
};

View File

@ -1,5 +1,5 @@
<script setup>
import { onMounted, inject, ref } from 'vue';
import { onMounted, inject } from 'vue';
import { useRoute } from 'vue-router';
import { useI18n } from 'vue-i18n';
import { formatDate } from 'src/lib/filters.js';
@ -9,6 +9,7 @@ import TicketDetails from 'src/pages/Ecomerce/TicketDetails.vue';
import { useAppStore } from 'stores/app';
import { storeToRefs } from 'pinia';
import { usePrintService } from 'src/composables/usePrintService';
import { useTicketData } from 'src/composables/useTicketData';
const { t } = useI18n();
const api = inject('api');
@ -17,87 +18,11 @@ const appStore = useAppStore();
const { isHeaderMounted } = storeToRefs(appStore);
const { openReport } = usePrintService();
const ticket = ref({});
const rows = ref([]);
const services = ref(null);
const packages = ref(null);
const dateFormat = 'DD/MM/YYYY';
const fetchTicketData = async ticketId => {
const { data } = await api.post('applications/myTicket_get/execute-proc', {
schema: 'hedera',
params: [ticketId]
});
return data?.[0] || null;
};
const fetchTicketRows = async ticketId => {
const { data } = await api.post(
'applications/myTicket_getRows/execute-proc',
{
schema: 'hedera',
params: [ticketId]
}
);
return data || [];
};
const fetchTicketServices = async ticketId => {
const { data } = await api.post(
'applications/myTicket_getServices/execute-proc',
{
schema: 'hedera',
params: [ticketId]
}
);
return data || null;
};
const fetchTicketPackages = async ticketId => {
const { data } = await api.post(
'applications/myTicket_getPackages/execute-proc',
{
schema: 'hedera',
params: [ticketId]
}
);
return data || null;
};
const formatTicketDates = ticketData => {
if (!ticketData) return;
const dateFields = ['landed', 'shipped'];
dateFields.forEach(field => {
if (ticketData[field]) {
ticketData[field] = formatDate(ticketData[field], dateFormat);
}
});
};
const { ticket, rows, services, packages, loadTicketData } = useTicketData(api);
onMounted(async () => {
const ticketId = parseInt(route.params.id);
try {
const [ticketData, rowsData, servicesData, packagesData] =
await Promise.all([
fetchTicketData(ticketId),
fetchTicketRows(ticketId),
fetchTicketServices(ticketId),
fetchTicketPackages(ticketId)
]);
if (ticketData) {
formatTicketDates(ticketData);
ticket.value = ticketData;
}
rows.value = rowsData;
services.value = servicesData;
packages.value = packagesData;
} catch (error) {
console.error('Error fetching ticket data:', error);
}
await loadTicketData(ticketId);
});
const onPrintClick = () =>