From a512f094d6950375135b4d0d5d9e7d337c497a5f Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Tue, 30 Apr 2024 12:06:24 +0200
Subject: [PATCH] perf: ZoneDescriptor

---
 src/pages/Zone/Card/ZoneDescriptor.vue        |  16 +-
 .../Zone/Card/ZoneDescriptorMenuItems.vue     | 143 ++++++++----------
 2 files changed, 72 insertions(+), 87 deletions(-)

diff --git a/src/pages/Zone/Card/ZoneDescriptor.vue b/src/pages/Zone/Card/ZoneDescriptor.vue
index b56443c84..486e4f063 100644
--- a/src/pages/Zone/Card/ZoneDescriptor.vue
+++ b/src/pages/Zone/Card/ZoneDescriptor.vue
@@ -57,7 +57,7 @@ function extractHour(dateTime) {
         :subtitle="data.subtitle"
         :filter="filter"
         @on-fetch="setData"
-        data-key="travelData"
+        data-key="zoneData"
     >
         <template #header-extra-action>
             <QBtn
@@ -75,14 +75,14 @@ function extractHour(dateTime) {
                 </QTooltip>
             </QBtn>
         </template>
-        <template #menu="{ entity }">
+        <!-- <template #menu="{ entity }">
             <ZoneDescriptorMenuItems :zone="entity" />
-        </template>
+        </template> -->
         <template #body="{ entity }">
             {{ console.log('entity', entity) }}
             <VnLv :label="t('Agency')" :value="entity.agencyMode.name" />
             <VnLv :label="t('Closing hour')" :value="extractHour(entity.hour)" />
-            <VnLv :label="t('traveling days')" :value="entity.travelingDays" />
+            <VnLv :label="t('zoneing days')" :value="entity.zoneingDays" />
             <VnLv :label="t('Price')" :value="entity.price" />
             <VnLv :label="t('Bonus')" :value="entity.bonus" />
         </template>
@@ -92,12 +92,12 @@ function extractHour(dateTime) {
 <i18n>
 es:
     Summary: Detalles
-    The travel will be deleted: El envío será eliminado
-    Do you want to delete this travel?: ¿Quieres eliminar este envío?
-    All travels with current agency: Todos los envíos con la agencia actual
+    The zone will be deleted: El envío será eliminado
+    Do you want to delete this zone?: ¿Quieres eliminar este envío?
+    All zones with current agency: Todos los envíos con la agencia actual
     Agency: Agencia
     Closing hour: Hora de cierre
-    traveling days: Días de viaje
+    zoneing days: Días de viaje
     Price: Precio
     Bonus: Bonificación
 </i18n>
diff --git a/src/pages/Zone/Card/ZoneDescriptorMenuItems.vue b/src/pages/Zone/Card/ZoneDescriptorMenuItems.vue
index 920d83dfe..b6c7f28b3 100644
--- a/src/pages/Zone/Card/ZoneDescriptorMenuItems.vue
+++ b/src/pages/Zone/Card/ZoneDescriptorMenuItems.vue
@@ -1,108 +1,93 @@
 <script setup>
-import { computed } from 'vue';
 import { useQuasar } from 'quasar';
 import { useRouter } from 'vue-router';
 import { useI18n } from 'vue-i18n';
+const { dialog, notify } = useQuasar();
 
 import VnConfirm from 'components/ui/VnConfirm.vue';
 
 import axios from 'axios';
-import useNotify from 'src/composables/useNotify.js';
-import { useRole } from 'src/composables/useRole';
 
 const $props = defineProps({
-    travel: {
+    zone: {
         type: Object,
         default: () => {},
     },
 });
 
 const { t } = useI18n();
-const router = useRouter();
-const quasar = useQuasar();
-const { notify } = useNotify();
-const role = useRole();
+const { push, currentRoute } = useRouter();
+const zoneId = currentRoute.value.params.id;
 
-const redirectToCreateView = (queryParams) => {
-    router.push({ name: 'ZoneCreate', query: { travelData: queryParams } });
-};
-
-const cloneZone = () => {
-    const stringifiedZoneData = JSON.stringify($props.travel);
-    redirectToCreateView(stringifiedZoneData);
-};
-
-const cloneZoneWithEntries = () => {
-    try {
-        axios.post(`Zones/${$props.travel.id}/cloneWithEntries`);
-        notify('globals.dataSaved', 'positive');
-    } catch (err) {
-        console.err('Error cloning travel with entries');
-    }
-};
-
-const isBuyer = computed(() => {
-    return role.hasAny(['buyer']);
-});
-
-const openDeleteEntryDialog = (id) => {
-    quasar
-        .dialog({
-            component: VnConfirm,
-            componentProps: {
-                title: t('The travel will be deleted'),
-                message: t('Do you want to delete this travel?'),
-            },
-        })
-        .onOk(async () => {
-            await deleteZone(id);
-        });
-};
-
-const deleteZone = async (id) => {
-    try {
-        await axios.delete(`Zones/${id}`);
-        router.push({ name: 'ZoneList' });
-        notify('globals.dataDeleted', 'positive');
-    } catch (err) {
-        console.error('Error deleting travel');
-    }
+const actions = {
+    clone: async () => {
+        const opts = { message: t('Zone cloned'), type: 'positive' };
+        let clonedZoneId;
+
+        try {
+            const { data } = await axios.post(`Zones/${zoneId}/clone`, {
+                shipped: $props.zone.value.shipped,
+            });
+            clonedZoneId = data;
+        } catch (e) {
+            opts.message = t('It was not able to clone the zone');
+            opts.type = 'negative';
+        } finally {
+            notify(opts);
+
+            if (clonedZoneId) push({ name: 'ZoneSummary', params: { id: clonedZoneId } });
+        }
+    },
+    remove: async () => {
+        try {
+            await axios.post(`Zones/${zoneId}/setDeleted`);
+
+            notify({ message: t('Zone deleted'), type: 'positive' });
+            notify({
+                message: t('You can undo this action within the first hour'),
+                icon: 'info',
+            });
+
+            push({ name: 'ZoneList' });
+        } catch (e) {
+            notify({ message: e.message, type: 'negative' });
+        }
+    },
 };
+function openConfirmDialog(callback) {
+    dialog({
+        component: VnConfirm,
+        componentProps: {
+            promise: actions[callback],
+        },
+    });
+}
 </script>
-
 <template>
-    <QItem v-ripple clickable @click="cloneZone(travel)">
-        <QItemSection>{{ t('travel.summary.cloneShipping') }}</QItemSection>
-    </QItem>
-    <QItem v-ripple clickable @click="cloneZoneWithEntries()">
-        <QItemSection>
-            {{ t('travel.summary.CloneZoneAndEntries') }}
+    <QItem @click="openConfirmDialog('clone')" v-ripple clickable>
+        <QItemSection avatar>
+            <QIcon name="content_copy" />
         </QItemSection>
+        <QItemSection>{{ t('To clone zone') }}</QItemSection>
     </QItem>
-    <QItem
-        v-if="isBuyer && travel.totalEntries === 0"
-        v-ripple
-        clickable
-        @click="openDeleteEntryDialog(travel.id)"
-    >
-        <QItemSection>
-            {{ t('travel.summary.deleteZone') }}
-        </QItemSection>
-    </QItem>
-    <QItem v-ripple clickable>
-        <QItemSection>
-            <RouterLink
-                :to="{ name: 'EntryCreate', query: { travelFk: travel.id } }"
-                class="color-vn-text"
-            >
-                {{ t('travel.summary.AddEntry') }}
-            </RouterLink>
+    <QItem @click="openConfirmDialog('remove')" v-ripple clickable>
+        <QItemSection avatar>
+            <QIcon name="delete" />
         </QItemSection>
+        <QItemSection>{{ t('deleteOrder') }}</QItemSection>
     </QItem>
 </template>
 
 <i18n>
+en:
+    deleteOrder: Delete order
+    confirmDeletion: Confirm deletion
+    confirmDeletionMessage: Are you sure you want to delete this order?
+
 es:
-    The travel will be deleted: El envío será eliminado
-    Do you want to delete this travel?: ¿Quieres eliminar este envío?
+    To clone zone: Clonar zone
+    deleteOrder: Eliminar pedido
+    confirmDeletion: Confirmar eliminación
+    confirmDeletionMessage: Seguro que quieres eliminar este pedido?
+
 </i18n>