Skip to content

Commit

Permalink
Merge pull request #195 from ymaheshwari1/#181
Browse files Browse the repository at this point in the history
Fixed: case related to updating archived routing and its UI(#181)
  • Loading branch information
ymaheshwari1 authored Apr 18, 2024
2 parents 3c6c958 + 4574da5 commit 6893587
Show file tree
Hide file tree
Showing 2 changed files with 70 additions and 55 deletions.
25 changes: 18 additions & 7 deletions src/components/ArchivedRoutingModal.vue
Original file line number Diff line number Diff line change
Expand Up @@ -45,22 +45,33 @@ import { defineProps, ref } from "vue";
const props = defineProps({
archivedRoutings: {
required: true
}
},
saveRoutings: {
required: true
} as any
})
let routings = ref(props.archivedRoutings) as any
let routingsToUpdate = ref([]) as any
// Not passing any data on modal close as we are updating the routings on every button click.
function closeModal() {
modalController.dismiss({ dismissed: true, routings: routingsToUpdate.value.length ? routingsToUpdate.value.concat(routings.value) : [] });
modalController.dismiss();
}
async function updateOrderRouting(routing: Route, fieldToUpdate: string, value: string) {
routingsToUpdate.value.push({
...routing,
[fieldToUpdate]: value
})
// remove the updated routing from the archivedRoutings
routings.value = routings.value.filter((route: Route) => route.orderRoutingId !== routing.orderRoutingId)
/*
Instead of updating the same on closeModal we are updating it on every routing unarchive action, as if a user
unarchives multiple routings and then click backdrop then the updated data can't be sent back to the parent component.
Thus used this approach to update the parent data on every routing unarchive click
As we need the feature to save the routing status even when backdrop is clicked thus added above approach
*/
props.saveRoutings([{
...routing,
[fieldToUpdate]: value
}])
}
</script>
100 changes: 52 additions & 48 deletions src/views/BrokeringRoute.vue
Original file line number Diff line number Diff line change
Expand Up @@ -126,47 +126,49 @@
</section>
</main>
<aside>
<ion-list v-if="routingsForReorder.length">
<ion-list-header>
<ion-label>{{ translate("Order batches") }}</ion-label>
<ion-button color="primary" fill="clear" @click="createOrderRoute">
{{ translate("New") }}
<ion-icon :icon="addCircleOutline" />
</ion-button>
</ion-list-header>
<ion-reorder-group @ionItemReorder="doReorder($event)" :disabled="false">
<ion-card class="pointer" v-for="(routing, index) in routingsForReorder" :key="routing.orderRoutingId" @click.prevent="redirect(routing)">
<ion-item lines="full">
<ion-label>
<h1>{{ routing.routingName }}</h1>
</ion-label>
<ion-reorder>
<ion-chip outline>
<ion-label>{{ `${index + 1}/${routingsForReorder.length}` }}</ion-label>
<ion-icon :icon="reorderTwoOutline"/>
<ion-list v-if="orderRoutings.length">
<template v-if="routingsForReorder.length">
<ion-list-header>
<ion-label>{{ translate("Order batches") }}</ion-label>
<ion-button color="primary" fill="clear" @click="createOrderRoute">
{{ translate("New") }}
<ion-icon :icon="addCircleOutline" />
</ion-button>
</ion-list-header>
<ion-reorder-group @ionItemReorder="doReorder($event)" :disabled="false">
<ion-card class="pointer" v-for="(routing, index) in routingsForReorder" :key="routing.orderRoutingId" @click.prevent="redirect(routing)">
<ion-item lines="full">
<ion-label>
<h1>{{ routing.routingName }}</h1>
</ion-label>
<ion-reorder>
<ion-chip outline>
<ion-label>{{ `${index + 1}/${routingsForReorder.length}` }}</ion-label>
<ion-icon :icon="reorderTwoOutline"/>
</ion-chip>
</ion-reorder>
</ion-item>
<ion-item lines="full">
<ion-icon :icon="timeOutline" slot="start" />
<ion-label>{{ translate("Last run") }}</ion-label>
<ion-chip outline @click.stop="openRoutingHistoryModal(routing.orderRoutingId, routing.routingName)">
<ion-label>{{ routingHistory[routing.orderRoutingId] ? getDateAndTimeShort(routingHistory[routing.orderRoutingId][0].startDate) : translate("No run history") }}</ion-label>
</ion-chip>
</ion-reorder>
</ion-item>
<ion-item lines="full">
<ion-icon :icon="timeOutline" slot="start" />
<ion-label>{{ translate("Last run") }}</ion-label>
<ion-chip outline @click.stop="openRoutingHistoryModal(routing.orderRoutingId, routing.routingName)">
<ion-label>{{ routingHistory[routing.orderRoutingId] ? getDateAndTimeShort(routingHistory[routing.orderRoutingId][0].startDate) : translate("No run history") }}</ion-label>
</ion-chip>
</ion-item>
<ion-item lines="none">
<ion-badge class="pointer" :color="routing.statusId === 'ROUTING_ACTIVE' ? 'success' : ''" @click.stop="updateOrderRouting(routing, 'statusId', `${routing.statusId === 'ROUTING_DRAFT' ? 'ROUTING_ACTIVE' : 'ROUTING_DRAFT'}`)">{{ getStatusDesc(routing.statusId) }}</ion-badge>
<div slot="end">
<ion-button fill="clear" color="medium" @click.stop="cloneRouting(routing)">
<ion-icon slot="icon-only" :icon="copyOutline" />
</ion-button>
<ion-button fill="clear" color="medium" @click.stop="updateOrderRouting(routing, 'statusId', 'ROUTING_ARCHIVED')">
<ion-icon slot="icon-only" :icon="archiveOutline" />
</ion-button>
</div>
</ion-item>
</ion-card>
</ion-reorder-group>
</ion-item>
<ion-item lines="none">
<ion-badge class="pointer" :color="routing.statusId === 'ROUTING_ACTIVE' ? 'success' : ''" @click.stop="updateOrderRouting(routing, 'statusId', `${routing.statusId === 'ROUTING_DRAFT' ? 'ROUTING_ACTIVE' : 'ROUTING_DRAFT'}`)">{{ getStatusDesc(routing.statusId) }}</ion-badge>
<div slot="end">
<ion-button fill="clear" color="medium" @click.stop="cloneRouting(routing)">
<ion-icon slot="icon-only" :icon="copyOutline" />
</ion-button>
<ion-button fill="clear" color="medium" @click.stop="updateOrderRouting(routing, 'statusId', 'ROUTING_ARCHIVED')">
<ion-icon slot="icon-only" :icon="archiveOutline" />
</ion-button>
</div>
</ion-item>
</ion-card>
</ion-reorder-group>
</template>
<ion-card v-if="getArchivedOrderRoutings().length">
<ion-item button lines="none" @click="openArchivedRoutingModal()">
<ion-label>{{ translate("Archived") }}</ion-label>
Expand Down Expand Up @@ -620,15 +622,17 @@ function doReorder(event: CustomEvent) {
async function openArchivedRoutingModal() {
const archivedRoutingModal = await modalController.create({
component: ArchivedRoutingModal,
componentProps: { archivedRoutings: getArchivedOrderRoutings() }
})
archivedRoutingModal.onDidDismiss().then((result: any) => {
if(result.data?.routings?.length) {
hasUnsavedChanges.value = true
orderRoutings.value = sortSequence(getActiveAndDraftOrderRoutings().concat(result.data?.routings))
componentProps: {
archivedRoutings: getArchivedOrderRoutings(),
// Passed a function as prop to update the routings whenever routing is unarchived from a modal
saveRoutings: (routings: any) => {
if(routings) {
hasUnsavedChanges.value = true
orderRoutings.value = sortSequence(getActiveAndDraftOrderRoutings().concat(routings))
}
initializeOrderRoutings()
}
}
initializeOrderRoutings()
})
archivedRoutingModal.present();
Expand Down

0 comments on commit 6893587

Please sign in to comment.