feat: refs #6564 enhance ticket advance functionality with confirmation actions and improved UI interactions
gitea/salix-front/pipeline/pr-dev This commit looks good
Details
gitea/salix-front/pipeline/pr-dev This commit looks good
Details
This commit is contained in:
parent
fda024d6fe
commit
498e8c385e
|
|
@ -14,6 +14,7 @@ import { useState } from 'src/composables/useState';
|
|||
import { toDateFormat } from 'src/filters/date.js';
|
||||
import axios from 'axios';
|
||||
import VnTable from 'src/components/VnTable/VnTable.vue';
|
||||
import { QTable } from 'quasar';
|
||||
|
||||
const state = useState();
|
||||
const { t } = useI18n();
|
||||
|
|
@ -27,6 +28,16 @@ const selectedTickets = ref([]);
|
|||
const vnTableRef = ref({});
|
||||
const originElRef = ref(null);
|
||||
const destinationElRef = ref(null);
|
||||
const actions = {
|
||||
advance: {
|
||||
title: t('advanceTickets.advanceTickets'),
|
||||
cb: moveTicketsAdvance,
|
||||
},
|
||||
advanceWithoutNegative: {
|
||||
title: t('advanceTickets.advanceTicketsWithoutNegatives'),
|
||||
cb: splitTickets,
|
||||
},
|
||||
};
|
||||
let today = Date.vnNew().toISOString();
|
||||
const tomorrow = new Date(today);
|
||||
tomorrow.setDate(tomorrow.getDate() + 1);
|
||||
|
|
@ -250,7 +261,7 @@ const requestComponentUpdate = async (ticket, isWithoutNegatives) => {
|
|||
return { query, params };
|
||||
};
|
||||
|
||||
const moveTicketsAdvance = async () => {
|
||||
async function moveTicketsAdvance() {
|
||||
let ticketsToMove = [];
|
||||
for (const ticket of selectedTickets.value) {
|
||||
if (!ticket.id) {
|
||||
|
|
@ -275,7 +286,7 @@ const moveTicketsAdvance = async () => {
|
|||
vnTableRef.value.reload();
|
||||
selectedTickets.value = [];
|
||||
if (ticketsToMove.length) notify(t('advanceTickets.moveTicketSuccess'), 'positive');
|
||||
};
|
||||
}
|
||||
|
||||
const progressLength = ref(0);
|
||||
const progressPercentage = computed(() => {
|
||||
|
|
@ -293,12 +304,12 @@ const progressAdd = () => {
|
|||
t('advanceTickets.moveTicketSuccess', {
|
||||
ticketsNumber: progressLength.value - splitErrors.value.length,
|
||||
}),
|
||||
'positive'
|
||||
'positive',
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
const splitTickets = async () => {
|
||||
async function splitTickets() {
|
||||
try {
|
||||
showProgressDialog.value = true;
|
||||
for (const ticket of selectedTickets.value) {
|
||||
|
|
@ -318,7 +329,7 @@ const splitTickets = async () => {
|
|||
} finally {
|
||||
vnTableRef.value.reload();
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
const resetProgressData = () => {
|
||||
if (cancelProgress.value) cancelProgress.value = false;
|
||||
|
|
@ -334,20 +345,30 @@ const handleCloseProgressDialog = () => {
|
|||
|
||||
const handleCancelProgress = () => (cancelProgress.value = true);
|
||||
|
||||
const getMessage = (type) => {
|
||||
const locale =
|
||||
type === 'advance' ? 'advanceTitleSubtitle' : 'advanceWithoutNegativeSubtitle';
|
||||
|
||||
let message = t(`advanceTickets.${locale}`, {
|
||||
selectedTickets: selectedTickets.value.length,
|
||||
const confirmAction = (action) => {
|
||||
openConfirmationModal(actions[action].title, false, actions[action].cb, null, {
|
||||
component: QTable,
|
||||
props: {
|
||||
columns: [
|
||||
{
|
||||
align: 'center',
|
||||
label: t('advanceTickets.destination'),
|
||||
name: 'id',
|
||||
field: (row) => row.id,
|
||||
},
|
||||
{
|
||||
align: 'center',
|
||||
label: t('advanceTickets.origin'),
|
||||
name: 'futureId',
|
||||
field: (row) => row.futureId,
|
||||
},
|
||||
],
|
||||
rows: selectedTickets.value,
|
||||
class: 'full-width',
|
||||
dense: true,
|
||||
flat: true,
|
||||
},
|
||||
});
|
||||
|
||||
// message += '<ul>';
|
||||
// for (const ticket of selectedTickets.value) {
|
||||
// message += `<li>${ticket.futureId} << ${ticket.id}</li>`;
|
||||
// }
|
||||
// message += '</ul>';
|
||||
return message;
|
||||
};
|
||||
|
||||
watch(
|
||||
|
|
@ -369,16 +390,16 @@ watch(
|
|||
originElRef.value.setAttribute('colspan', '9');
|
||||
|
||||
destinationElRef.value.textContent = `${t(
|
||||
'advanceTickets.destination'
|
||||
'advanceTickets.destination',
|
||||
)} ${toDateFormat(vnTableRef.value.params.dateToAdvance)}`;
|
||||
originElRef.value.textContent = `${t('advanceTickets.origin')} ${toDateFormat(
|
||||
vnTableRef.value.params.dateFuture
|
||||
vnTableRef.value.params.dateFuture,
|
||||
)}`;
|
||||
|
||||
newRow.append(destinationElRef.value, originElRef.value);
|
||||
head.insertBefore(newRow, firstRow);
|
||||
},
|
||||
{ once: true, inmmediate: true }
|
||||
{ once: true, inmmediate: true },
|
||||
);
|
||||
|
||||
watch(
|
||||
|
|
@ -386,14 +407,14 @@ watch(
|
|||
() => {
|
||||
if (originElRef.value && destinationElRef.value) {
|
||||
destinationElRef.value.textContent = `${t(
|
||||
'advanceTickets.destination'
|
||||
'advanceTickets.destination',
|
||||
)} ${toDateFormat(vnTableRef.value.params.dateToAdvance)}`;
|
||||
originElRef.value.textContent = `${t('advanceTickets.origin')} ${toDateFormat(
|
||||
vnTableRef.value.params.dateFuture
|
||||
vnTableRef.value.params.dateFuture,
|
||||
)}`;
|
||||
}
|
||||
},
|
||||
{ deep: true }
|
||||
{ deep: true },
|
||||
);
|
||||
</script>
|
||||
<template>
|
||||
|
|
@ -423,13 +444,7 @@ watch(
|
|||
color="primary"
|
||||
class="q-mr-sm"
|
||||
:disable="!selectedTickets.length"
|
||||
@click.stop="
|
||||
openConfirmationModal(
|
||||
t('advanceTickets.advanceTickets'),
|
||||
getMessage('advance'),
|
||||
moveTicketsAdvance
|
||||
)
|
||||
"
|
||||
@click.stop="confirmAction('advance')"
|
||||
>
|
||||
<QTooltip>
|
||||
{{ t('advanceTickets.advanceTickets') }}
|
||||
|
|
@ -439,13 +454,7 @@ watch(
|
|||
icon="alt_route"
|
||||
color="primary"
|
||||
:disable="!selectedTickets.length"
|
||||
@click.stop="
|
||||
openConfirmationModal(
|
||||
t('advanceTickets.advanceWithoutNegativeTitle'),
|
||||
getMessage('split'),
|
||||
splitTickets
|
||||
)
|
||||
"
|
||||
@click.stop="confirmAction('advanceWithoutNegative')"
|
||||
>
|
||||
<QTooltip>
|
||||
{{ t('advanceTickets.advanceTicketsWithoutNegatives') }}
|
||||
|
|
@ -474,7 +483,7 @@ watch(
|
|||
}"
|
||||
v-model:selected="selectedTickets"
|
||||
:pagination="{ rowsPerPage: 0 }"
|
||||
:no-data-label="t('globals.noResults')"
|
||||
:no-data-label="$t('globals.noResults')"
|
||||
:right-search="false"
|
||||
auto-load
|
||||
:disable-option="{ card: true }"
|
||||
|
|
|
|||
Loading…
Reference in New Issue