0
0
Fork 0

add header options menu in travel summary

This commit is contained in:
William Buezas 2023-11-25 21:19:22 -03:00
parent 4eb57ab90e
commit df599f1e8d
5 changed files with 73 additions and 38 deletions

View File

@ -441,14 +441,14 @@ export default {
parking: 'Parking',
priority: 'Priority',
worker: 'Worker',
recyclable: 'Recyclable'
recyclable: 'Recyclable',
},
basicData: {
code: 'Code',
parking: 'Parking',
priority: 'Priority',
recyclable: 'Recyclable'
}
recyclable: 'Recyclable',
},
},
worker: {
pageTitles: {
@ -637,6 +637,9 @@ export default {
delivered: 'Delivered',
received: 'Received',
entries: 'Entries',
cloneShipping: 'Clone travel',
CloneTravelAndEntries: 'Clone travel and his entries',
AddEntry: 'Add entry',
},
},
components: {

View File

@ -443,14 +443,14 @@ export default {
parking: 'Parking',
priority: 'Prioridad',
worker: 'Trabajador',
recyclable: 'Reciclable'
recyclable: 'Reciclable',
},
basicData: {
code: 'Código',
parking: 'Parking',
priority: 'Prioridad',
recyclable: 'Reciclable'
}
recyclable: 'Reciclable',
},
},
worker: {
pageTitles: {
@ -639,6 +639,9 @@ export default {
delivered: 'Enviada',
received: 'Recibida',
entries: 'Entradas',
cloneShipping: 'Clonar envío',
CloneTravelAndEntries: 'Clonar travel y sus entradas',
AddEntry: 'Añadir entrada',
},
},
components: {

View File

@ -1,6 +1,6 @@
<script setup>
import { onMounted, ref, computed, onUpdated } from 'vue';
import { useRoute } from 'vue-router';
import { useRoute, useRouter } from 'vue-router';
import { useI18n } from 'vue-i18n';
import CardSummary from 'components/ui/CardSummary.vue';
import VnLv from 'src/components/ui/VnLv.vue';
@ -23,6 +23,7 @@ const $props = defineProps({
},
});
const router = useRouter();
const entityId = computed(() => $props.id || route.params.id);
const entries = ref([]);
const summaryRef = ref();
@ -33,13 +34,16 @@ onMounted(async () => {
travelUrl.value = (await getUrl('travel/')) + entityId.value;
});
async function setTravelData(data) {
if (data) {
travel.value = data;
const entriesResponse = await travelService.getTravelEntries(travel.value.id);
if (entriesResponse.data) entries.value = entriesResponse.data;
}
}
const cloneTravel = () => {
const stringifiedTravelData = JSON.stringify(travel.value);
redirectToCreateView(stringifiedTravelData);
};
const headerMenuOptions = [
{ name: t('travel.summary.cloneShipping'), action: cloneTravel },
{ name: t('travel.summary.CloneTravelAndEntries'), action: cloneTravel },
{ name: t('travel.summary.AddEntry'), action: cloneTravel },
];
const tableColumnComponents = {
isConfirmed: {
@ -148,6 +152,18 @@ const entriesTableRows = computed(() => {
if (!entries.value && !entries.value.length > 0) return [];
return entries.value;
});
async function setTravelData(data) {
if (data) {
travel.value = data;
const entriesResponse = await travelService.getTravelEntries(travel.value.id);
if (entriesResponse.data) entries.value = entriesResponse.data;
}
}
const redirectToCreateView = (queryParams) => {
router.push({ name: 'TravelCreate', query: { travelData: queryParams } });
};
</script>
<template>
@ -165,6 +181,21 @@ const entriesTableRows = computed(() => {
<span>{{ travel.ref }} - {{ travel.id }}</span>
</template>
<template #header-right>
<QBtn color="white" dense flat icon="more_vert" round size="md">
<QTooltip>
{{ t('components.cardDescriptor.moreOptions') }}
</QTooltip>
<QMenu>
<QList dense v-for="option in headerMenuOptions" :key="option">
<QItem v-ripple clickable @click="option.action">
{{ option.name }}
</QItem>
</QList>
</QMenu>
</QBtn>
</template>
<template #body>
<QCard class="vn-one">
<VnLv

View File

@ -5,6 +5,7 @@ import FetchData from 'components/FetchData.vue';
import { useTravelStore } from 'src/stores/travel';
import { useRouter, useRoute } from 'vue-router';
import { inputSelectFilter } from 'src/composables/inputSelectFilterFn.js';
import { toDate } from 'src/filters';
import { onBeforeMount } from 'vue';
const { t } = useI18n();
@ -12,7 +13,7 @@ const route = useRoute();
const router = useRouter();
const travelStore = useTravelStore();
const newTravelData = reactive({
const newTravelDataForm = reactive({
ref: null,
agencyModeFk: null,
shipped: null,
@ -34,14 +35,18 @@ const warehousesOptions = reactive({
onBeforeMount(() => {
if (route.query.travelData) {
const travelData = JSON.parse(route.query.travelData);
for (let key in travelData) {
newTravelData[key] = travelData[key];
for (let key in newTravelDataForm) {
if (key === 'landed' || key === 'shipped') {
newTravelDataForm[key] = travelData[key].substring(0, 10);
} else {
newTravelDataForm[key] = travelData[key];
}
}
}
});
const createTravel = async () => {
const response = await travelStore.createTravel(newTravelData);
const response = await travelStore.createTravel(newTravelDataForm);
if (response.status === 200) router.push({ path: `/travel/${response.data.id}` });
};
@ -58,8 +63,8 @@ const onFetchWarehouses = (warehouses) => {
};
const canSubmit = computed(() => {
for (const key in newTravelData) {
if (!newTravelData[key]) return false;
for (const key in newTravelDataForm) {
if (!newTravelDataForm[key]) return false;
}
return true;
});
@ -80,14 +85,14 @@ const redirectToTravelList = () => {
>
<QCard class="row q-pa-xl full-width card">
<QInput
v-model="newTravelData.ref"
v-model="newTravelDataForm.ref"
:label="t('travel.shared.reference')"
filled
style="max-width: 100%"
/>
<QSelect
:options="agenciesOptions.filtered"
v-model="newTravelData.agencyModeFk"
v-model="newTravelDataForm.agencyModeFk"
filled
use-input
@filter="
@ -100,14 +105,14 @@ const redirectToTravelList = () => {
style="max-width: 100%"
/>
<QInput
v-model="newTravelData.shipped"
v-model="newTravelDataForm.shipped"
type="date"
filled
mask="date"
:label="t('travel.shared.shipped')"
/>
<QInput
v-model="newTravelData.landed"
v-model="newTravelDataForm.landed"
type="date"
filled
mask="date"
@ -115,7 +120,7 @@ const redirectToTravelList = () => {
/>
<QSelect
:options="warehousesOptions.filtered"
v-model="newTravelData.warehouseOutFk"
v-model="newTravelDataForm.warehouseOutFk"
filled
use-input
@filter="
@ -128,7 +133,7 @@ const redirectToTravelList = () => {
/>
<QSelect
:options="warehousesOptions.filtered"
v-model="newTravelData.warehouseInFk"
v-model="newTravelDataForm.warehouseInFk"
filled
use-input
@filter="

View File

@ -21,16 +21,9 @@ const navigateToTravelId = (id) => {
};
const cloneTravel = (travelData) => {
const params = JSON.stringify({
ref: travelData.ref,
agencyModeFk: travelData.agencyModeFk,
shipped: travelData.shipped,
landed: travelData.landed,
warehouseInFk: travelData.warehouseInFk,
warehouseOutFk: travelData.warehouseOutFk,
});
redirectToCreateView(params);
const stringifiedTravelData = JSON.stringify(travelData);
console.log('clone data:: ', stringifiedTravelData);
redirectToCreateView(stringifiedTravelData);
};
const redirectToCreateView = (queryParams) => {