From e499fd151173e7d026b862bfb8d36e8173fa4678 Mon Sep 17 00:00:00 2001
From: alexandre <alexandre@verdnatura.es>
Date: Wed, 30 Nov 2022 15:00:02 +0100
Subject: [PATCH 1/5] working on create deliveryMan

---
 src/i18n/en/index.js                          |  41 ++++++
 src/i18n/es/index.js                          |  41 ++++++
 src/pages/Route/Card/DeliveryManBasicData.vue | 115 ++++++++++++++++
 src/pages/Route/Card/DeliveryManCard.vue      |  58 ++++++++
 .../Route/Card/DeliveryManDescriptor.vue      |  82 ++++++++++++
 src/pages/Route/Card/DeliveryManSummary.vue   | 124 ++++++++++++++++++
 src/pages/Route/DeliveryManCreate.vue         |  44 +++++++
 src/pages/Route/DeliveryManList.vue           |  78 +++++++++++
 src/pages/Route/RouteMain.vue                 |  17 +++
 src/router/modules/route.js                   |  65 +++++++++
 src/router/routes.js                          |   6 +-
 11 files changed, 669 insertions(+), 2 deletions(-)
 create mode 100644 src/pages/Route/Card/DeliveryManBasicData.vue
 create mode 100644 src/pages/Route/Card/DeliveryManCard.vue
 create mode 100644 src/pages/Route/Card/DeliveryManDescriptor.vue
 create mode 100644 src/pages/Route/Card/DeliveryManSummary.vue
 create mode 100644 src/pages/Route/DeliveryManCreate.vue
 create mode 100644 src/pages/Route/DeliveryManList.vue
 create mode 100644 src/pages/Route/RouteMain.vue
 create mode 100644 src/router/modules/route.js

diff --git a/src/i18n/en/index.js b/src/i18n/en/index.js
index 88fae5bb7..f567edcab 100644
--- a/src/i18n/en/index.js
+++ b/src/i18n/en/index.js
@@ -251,6 +251,47 @@ export default {
             returnOfMaterial: 'Return of material authorization (RMA)',
         },
     },
+    route: {
+        pageTitles: {
+            routes: 'Routes',
+            deliveryManList: 'Delivery Men',
+            basicData: 'Basic Data',
+            deliveryManCreate: 'Create Delivery Man',
+        },
+        deliveryMan: {
+            list: {
+                deliveryMan: 'Delivery man',
+                supplier: 'Supplier',
+                id: 'ID',
+                minCost: 'Minimum cost',
+                minM3: 'M3',
+                agency: 'Agency',
+            },
+            basicData: {
+                supplier: 'Supplier',
+                id: 'ID',
+                minCost: 'Minimum cost',
+                minM3: 'M3',
+                agency: 'Agency',
+            },
+            card: {
+                supplier: 'Supplier',
+                id: 'ID',
+                minCost: 'Minimum cost',
+                minM3: 'M3',
+                agency: 'Agency',
+            },
+            summary: {
+                deliveryMan: 'Delivery man',
+                supplier: 'Supplier',
+                id: 'ID',
+                minCost: 'Minimum cost',
+                minM3: 'M3',
+                agency: 'Agency',
+            },
+        }
+
+    },
     components: {
         topbar: {},
         userPanel: {
diff --git a/src/i18n/es/index.js b/src/i18n/es/index.js
index 0103b1a92..567fe71e4 100644
--- a/src/i18n/es/index.js
+++ b/src/i18n/es/index.js
@@ -250,6 +250,47 @@ export default {
             returnOfMaterial: 'Autorización de retorno de materiales (RMA)',
         },
     },
+    route: {
+        pageTitles: {
+            routes: 'Rutas',
+            deliveryManList: 'Repartidores',
+            basicData: 'Datos básicos',
+            deliveryManCreate: 'Crear Repartidor',
+        },
+        deliveryMan: {
+            list: {
+                deliveryMan: 'Repartidor',
+                supplier: 'Proveedor',
+                id: 'ID',
+                minCost: 'Coste mínimo',
+                minM3: 'Número de M3',
+                agency: 'Agencia',
+            },
+            basicData: {
+                supplier: 'Proveedor',
+                id: 'ID',
+                minCost: 'Coste mínimo',
+                minM3: 'Número de M3',
+                agency: 'Agencia',
+            },
+            card: {
+                supplier: 'Proveedor',
+                id: 'ID',
+                minCost: 'Coste mínimo',
+                minM3: 'Número de M3',
+                agency: 'Agencia',
+            },
+            summary: {
+                deliveryMan: 'Repartidor',
+                supplier: 'Proveedor',
+                id: 'ID',
+                minCost: 'Coste mínimo',
+                minM3: 'Número de M3',
+                agency: 'Agencia',
+            }
+        }
+
+    },
     components: {
         topbar: {},
         userPanel: {
diff --git a/src/pages/Route/Card/DeliveryManBasicData.vue b/src/pages/Route/Card/DeliveryManBasicData.vue
new file mode 100644
index 000000000..1aad8d8cc
--- /dev/null
+++ b/src/pages/Route/Card/DeliveryManBasicData.vue
@@ -0,0 +1,115 @@
+<script setup>
+import { ref } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { useRoute } from 'vue-router';
+
+import FetchData from 'components/FetchData.vue';
+import FormModel from 'components/FormModel.vue';
+
+const route = useRoute();
+const { t } = useI18n();
+
+const suppliers = ref([]);
+const agencyModes = ref([]);
+
+function setSuppliers(data) {
+    suppliers.value = data;
+}
+
+function setAgencyModes(data) {
+    agencyModes.value = data;
+}
+
+const filter = {
+    include: [
+        {
+            relation: 'deliveryManAgency',
+            scope: {
+                include: {
+                    relation: 'agencyMode',
+                },
+            },
+        },
+        {
+            relation: 'supplier',
+        },
+    ],
+};
+</script>
+<template>
+    <fetch-data url="Suppliers" @on-fetch="setSuppliers" auto-load />
+    <fetch-data url="AgencyModes" @on-fetch="setAgencyModes" auto-load />
+
+    <div class="container">
+        <q-card>
+            <form-model :url="`DeliveryMans/${route.params.id}`" :filter="filter" model="deliveryMan">
+                <template #form="{ data, validate }">
+                    <div class="row q-gutter-md q-mb-md">
+                        <div class="col">
+                            <q-input v-model="data.id" :label="t('route.deliveryMan.basicData.id')" disable />
+                        </div>
+                        <div class="col">
+                            <q-select
+                                v-model="data.supplierFk"
+                                :options="suppliers"
+                                option-value="id"
+                                option-label="name"
+                                emit-value
+                                :label="t('route.deliveryMan.basicData.supplier')"
+                                map-options
+                                use-input
+                                :rules="validate('deliveryMan.supplierFk')"
+                                :input-debounce="0"
+                            >
+                            </q-select>
+                        </div>
+                    </div>
+                    <div class="row q-gutter-md q-mb-md">
+                        <div class="col">
+                            <q-input
+                                v-model="data.minCost"
+                                :label="t('route.deliveryMan.basicData.minCost')"
+                                :rules="validate('deliveryMan.minCost')"
+                            />
+                        </div>
+                        <div class="col">
+                            <q-input
+                                v-model="data.minM3"
+                                :label="t('route.deliveryMan.basicData.minM3')"
+                                :rules="validate('deliveryMan.minM3')"
+                            />
+                        </div>
+                    </div>
+                    <div class="row q-gutter-md q-mb-md">
+                        <div class="col">
+                            <q-select
+                                v-model="data.deliveryManAgency.agencyModeFk"
+                                :options="agencyModes"
+                                option-value="id"
+                                option-label="name"
+                                emit-value
+                                :label="t('route.deliveryMan.basicData.agency')"
+                                map-options
+                                use-input
+                                :rules="validate('deliveryMan.deliveryManAgency.agencyModeFk')"
+                                :input-debounce="0"
+                            >
+                            </q-select>
+                        </div>
+                    </div>
+                </template>
+            </form-model>
+        </q-card>
+    </div>
+</template>
+
+<style lang="scss" scoped>
+.container {
+    display: flex;
+    justify-content: center;
+}
+
+.q-card {
+    width: 800px;
+}
+</style>
diff --git a/src/pages/Route/Card/DeliveryManCard.vue b/src/pages/Route/Card/DeliveryManCard.vue
new file mode 100644
index 000000000..cabf0266c
--- /dev/null
+++ b/src/pages/Route/Card/DeliveryManCard.vue
@@ -0,0 +1,58 @@
+<script setup>
+import { useI18n } from 'vue-i18n';
+import { useState } from 'composables/useState';
+import DeliveryManDescriptor from './DeliveryManDescriptor.vue';
+
+const { t } = useI18n();
+const state = useState();
+</script>
+<template>
+    <q-drawer v-model="state.drawer.value" show-if-above :width="256" :breakpoint="500">
+        <q-scroll-area class="fit">
+            <delivery-man-descriptor />
+            <q-separator />
+            <q-list>
+                <q-item :to="{ name: 'DeliveryManBasicData' }" clickable v-ripple>
+                    <q-item-section avatar>
+                        <q-icon name="vn:settings" />
+                    </q-item-section>
+                    <q-item-section>{{ t('route.pageTitles.basicData') }}</q-item-section>
+                </q-item>
+            </q-list>
+        </q-scroll-area>
+    </q-drawer>
+    <q-page-container>
+        <q-page class="q-pa-md">
+            <router-view></router-view>
+        </q-page>
+    </q-page-container>
+</template>
+
+<style lang="scss">
+.q-scrollarea__content {
+    max-width: 100%;
+}
+</style>
+
+<style lang="scss" scoped>
+.descriptor {
+    max-width: 256px;
+
+    h5 {
+        margin: 0 15px;
+    }
+
+    .header {
+        display: flex;
+        justify-content: space-between;
+    }
+
+    .q-card__actions {
+        justify-content: center;
+    }
+
+    #descriptor-skeleton .q-card__actions {
+        justify-content: space-between;
+    }
+}
+</style>
diff --git a/src/pages/Route/Card/DeliveryManDescriptor.vue b/src/pages/Route/Card/DeliveryManDescriptor.vue
new file mode 100644
index 000000000..6d9e64c32
--- /dev/null
+++ b/src/pages/Route/Card/DeliveryManDescriptor.vue
@@ -0,0 +1,82 @@
+<script setup>
+import axios from 'axios';
+import CardDescriptor from 'components/ui/CardDescriptor.vue';
+import SkeletonDescriptor from 'components/ui/SkeletonDescriptor.vue';
+import { computed, onMounted, ref } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { useRoute } from 'vue-router';
+
+const $props = defineProps({
+    id: {
+        type: Number,
+        required: false,
+        default: null,
+    },
+});
+
+onMounted(async () => {
+    await fetch();
+});
+
+const route = useRoute();
+const { t } = useI18n();
+
+const entityId = computed(() => {
+    return $props.id || route.params.id;
+});
+
+const deliveryMan = ref();
+async function fetch() {
+    const filter = {
+        include: [
+            {
+                relation: 'deliveryManAgency',
+                scope: {
+                    include: {
+                        relation: 'agencyMode',
+                    },
+                },
+            },
+            {
+                relation: 'supplier',
+            },
+        ],
+    };
+    const options = { params: { filter } };
+    const { data } = await axios.get(`DeliveryMans/${entityId.value}`, options);
+
+    if (data) deliveryMan.value = data;
+}
+</script>
+
+<template>
+    <skeleton-descriptor v-if="!deliveryMan" />
+    <card-descriptor v-if="deliveryMan" module="DeliveryMan" :data="deliveryMan">
+        <template #body>
+            <q-list>
+                <q-item>
+                    <q-item-section>
+                        <q-item-label caption>{{ t('route.deliveryMan.card.supplier') }}</q-item-label>
+                        <q-item-label>{{ deliveryMan.supplier.name }}</q-item-label>
+                    </q-item-section>
+                </q-item>
+                <q-item>
+                    <q-item-section>
+                        <q-item-label caption>{{ t('route.deliveryMan.card.agency') }}</q-item-label>
+                        <q-item-label>{{ deliveryMan.deliveryManAgency.agencyMode.name }}</q-item-label>
+                    </q-item-section>
+                </q-item>
+                <q-item>
+                    <q-item-section>
+                        <q-item-label caption>{{ t('route.deliveryMan.card.minCost') }}</q-item-label>
+                        <q-item-label>{{ deliveryMan.minCost }}</q-item-label>
+                    </q-item-section>
+                    <q-item-section>
+                        <q-item-label caption>{{ t('route.deliveryMan.card.minM3') }}</q-item-label>
+                        <q-item-label>{{ deliveryMan.minM3 }}</q-item-label>
+                    </q-item-section>
+                </q-item>
+            </q-list>
+        </template>
+    </card-descriptor>
+</template>
diff --git a/src/pages/Route/Card/DeliveryManSummary.vue b/src/pages/Route/Card/DeliveryManSummary.vue
new file mode 100644
index 000000000..b76ca8a05
--- /dev/null
+++ b/src/pages/Route/Card/DeliveryManSummary.vue
@@ -0,0 +1,124 @@
+<script setup>
+import axios from 'axios';
+import SkeletonSummary from 'components/ui/SkeletonSummary.vue';
+import { computed, onMounted, ref } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { useRoute } from 'vue-router';
+
+onMounted(() => fetch());
+
+const route = useRoute();
+const { t } = useI18n();
+
+const $props = defineProps({
+    id: {
+        type: Number,
+        default: 0,
+    },
+});
+
+const entityId = computed(() => $props.id || route.params.id);
+
+const filter = {
+    include: [
+        {
+            relation: 'deliveryManAgency',
+            scope: {
+                include: {
+                    relation: 'agencyMode',
+                },
+            },
+        },
+        {
+            relation: 'supplier',
+        },
+    ],
+};
+
+const deliveryMan = ref(null);
+function fetch() {
+    const id = entityId.value;
+    axios
+        .get(`DeliveryMans/${id}`, {
+            params: {
+                filter,
+            },
+        })
+        .then(({ data }) => {
+            deliveryMan.value = data;
+        });
+}
+</script>
+
+<template>
+    <div class="summary container">
+        <q-card>
+            <skeleton-summary v-if="!deliveryMan" />
+            <template v-if="deliveryMan">
+                <div class="header bg-primary q-pa-sm q-mb-md">
+                    {{ t('route.deliveryMan.summary.deliveryMan') }} #{{ deliveryMan.id }}
+                </div>
+                <q-list>
+                    <q-item>
+                        <q-item-section>
+                            <q-item-label caption>{{ t('route.deliveryMan.summary.supplier') }}</q-item-label>
+                            <q-item-label>{{ deliveryMan.supplier.name }}</q-item-label>
+                        </q-item-section>
+                        <q-item-section>
+                            <q-item-label caption>{{ t('route.deliveryMan.summary.agency') }}</q-item-label>
+                            <q-item-label>{{ deliveryMan.deliveryManAgency.agencyMode.name }}</q-item-label>
+                        </q-item-section>
+                        <q-item-section>
+                            <q-item-label caption>{{ t('route.deliveryMan.summary.minCost') }}</q-item-label>
+                            <q-item-label>{{ deliveryMan.minCost }}</q-item-label>
+                        </q-item-section>
+                        <q-item-section>
+                            <q-item-label caption>{{ t('route.deliveryMan.summary.minM3') }}</q-item-label>
+                            <q-item-label>{{ deliveryMan.minM3 }}</q-item-label>
+                        </q-item-section>
+                    </q-item>
+                    <q-item> </q-item>
+                </q-list>
+            </template>
+        </q-card>
+    </div>
+</template>
+
+<style lang="scss" scoped>
+.container {
+    display: flex;
+    justify-content: center;
+}
+
+.q-card {
+    width: 100%;
+    max-width: 950px;
+}
+
+.summary {
+    .header {
+        text-align: center;
+        font-size: 18px;
+    }
+
+    #slider-container {
+        max-width: 80%;
+        margin: 0 auto;
+
+        .q-slider {
+            .q-slider__marker-labels:nth-child(1) {
+                transform: none;
+            }
+            .q-slider__marker-labels:nth-child(2) {
+                transform: none;
+                left: auto !important;
+                right: 0%;
+            }
+        }
+    }
+}
+
+.q-dialog .summary {
+    max-width: 1200px;
+}
+</style>
diff --git a/src/pages/Route/DeliveryManCreate.vue b/src/pages/Route/DeliveryManCreate.vue
new file mode 100644
index 000000000..8cb66d510
--- /dev/null
+++ b/src/pages/Route/DeliveryManCreate.vue
@@ -0,0 +1,44 @@
+<script setup>
+import axios from 'axios';
+import { reactive } from 'vue';
+
+const deliveryMan = reactive({
+    supplierFk: null,
+    agencyMode: null,
+    minCost: null,
+    minM3: null,
+});
+
+async function onSubmit() {
+    await axios.post('DeliveryMans', {
+        supplierFk: deliveryMan.supplierFk,
+        minCost: deliveryMan.minCost,
+        minM3: deliveryMan.minM3,
+    });
+}
+</script>
+
+<template>
+    <q-page class="q-pa-md">
+        <q-card class="q-pa-md">
+            <q-banner v-if="hasChanges" class="text-white bg-warning">
+                <q-icon name="warning" size="md" class="q-mr-md" />
+                <span>{{ t('globals.changesToSave') }}</span>
+            </q-banner>
+            <q-form @submit="onSubmit" @reset="onReset" class="q-gutter-md">
+                <q-input filled v-model="deliveryMan.minCost" label="Your name *" lazy-rules />
+                <div>
+                    <q-btn label="Submit" type="submit" color="primary" />
+                    <q-btn label="Reset" type="reset" color="primary" flat class="q-ml-sm" />
+                </div>
+            </q-form>
+        </q-card>
+    </q-page>
+</template>
+
+<style lang="scss" scoped>
+.card {
+    width: 100%;
+    max-width: 60em;
+}
+</style>
diff --git a/src/pages/Route/DeliveryManList.vue b/src/pages/Route/DeliveryManList.vue
new file mode 100644
index 000000000..2103e6129
--- /dev/null
+++ b/src/pages/Route/DeliveryManList.vue
@@ -0,0 +1,78 @@
+<script setup>
+import Paginate from 'components/Paginate.vue';
+import { useI18n } from 'vue-i18n';
+import { useRouter } from 'vue-router';
+
+const { t } = useI18n();
+const router = useRouter();
+
+const filter = {
+    include: [
+        {
+            relation: 'deliveryManAgency',
+            scope: {
+                include: {
+                    relation: 'agencyMode',
+                },
+            },
+        },
+        {
+            relation: 'supplier',
+        },
+    ],
+};
+
+function navigate(id) {
+    router.push({ path: `/route/${id}` });
+}
+</script>
+
+<template>
+    <q-page class="q-pa-md">
+        <paginate url="DeliveryMans" :filter="filter" sort-by="id DESC" auto-load>
+            <template #body="{ rows }">
+                <q-card class="card" v-for="row of rows" :key="row.id">
+                    <q-item class="q-pa-none items-start cursor-pointer q-hoverable" v-ripple clickable>
+                        <q-item-section class="q-pa-md" @click="navigate(row.id)">
+                            <div class="text-h6 link">{{ t('route.deliveryMan.list.deliveryMan') }}</div>
+                            <q-item-label caption>#{{ row.id }}</q-item-label>
+                            <q-list>
+                                <q-item class="q-pa-none">
+                                    <q-item-section>
+                                        <q-item-label caption>{{ t('route.deliveryMan.list.supplier') }}</q-item-label>
+                                        <q-item-label>{{ row.supplier.name }}</q-item-label>
+                                    </q-item-section>
+                                    <q-item-section>
+                                        <q-item-label caption>{{ t('route.deliveryMan.list.minCost') }}</q-item-label>
+                                        <q-item-label>{{ row.minCost }}</q-item-label>
+                                    </q-item-section>
+                                </q-item>
+                                <q-item class="q-pa-none">
+                                    <q-item-section>
+                                        <q-item-label caption>{{ t('route.deliveryMan.list.minM3') }}</q-item-label>
+                                        <q-item-label>{{ row.minM3 }}</q-item-label>
+                                    </q-item-section>
+                                    <q-item-section>
+                                        <q-item-label caption>{{ t('route.deliveryMan.list.agency') }}</q-item-label>
+                                        <q-item-label v-if="row.deliveryManAgency">{{
+                                            row.deliveryManAgency.agencyMode.name
+                                        }}</q-item-label>
+                                    </q-item-section>
+                                </q-item>
+                            </q-list>
+                        </q-item-section>
+                        <q-separator vertical />
+                        <q-card-actions vertical>
+                            <q-btn flat round color="orange" icon="arrow_circle_right" @click="navigate(row.id)">
+                                <q-tooltip>{{ t('components.smartCard.openCard') }}</q-tooltip>
+                            </q-btn>
+                        </q-card-actions>
+                    </q-item>
+                </q-card>
+            </template>
+        </paginate>
+        <q-page-sticky position="bottom-right" :offset="[18, 18]">
+            <q-fab icon="person_add" direction="up" color="orange"> </q-fab>
+        </q-page-sticky>
+    </q-page>
+</template>
diff --git a/src/pages/Route/RouteMain.vue b/src/pages/Route/RouteMain.vue
new file mode 100644
index 000000000..fd50f1521
--- /dev/null
+++ b/src/pages/Route/RouteMain.vue
@@ -0,0 +1,17 @@
+<script setup>
+import { useState } from 'src/composables/useState';
+import LeftMenu from 'components/LeftMenu.vue';
+
+const state = useState();
+</script>
+
+<template>
+    <q-drawer v-model="state.drawer.value" show-if-above :width="256" :breakpoint="500">
+        <q-scroll-area class="fit text-grey-8">
+            <LeftMenu />
+        </q-scroll-area>
+    </q-drawer>
+    <q-page-container>
+        <router-view></router-view>
+    </q-page-container>
+</template>
diff --git a/src/router/modules/route.js b/src/router/modules/route.js
new file mode 100644
index 000000000..a5e86a446
--- /dev/null
+++ b/src/router/modules/route.js
@@ -0,0 +1,65 @@
+import { RouterView } from 'vue-router';
+
+export default {
+    name: 'Route',
+    path: '/route',
+    meta: {
+        title: 'routes',
+        icon: 'vn:delivery'
+    },
+    component: RouterView,
+    redirect: { name: 'RouteMain' },
+    children: [
+        {
+            path: '',
+            name: 'RouteMain',
+            component: () => import('src/pages/Route/RouteMain.vue'),
+            redirect: { name: 'DeliveryManList' },
+            children: [
+                {
+                    name: 'DeliveryManList',
+                    path: 'deliveryMan/list',
+                    meta: {
+                        title: 'deliveryManList',
+                        icon: 'person',
+                    },
+                    component: () => import('src/pages/Route/DeliveryManList.vue'),
+                },
+                {
+                    name: 'DeliveryManCreate',
+                    path: 'deliveryMan/create',
+                    meta: {
+                        title: 'deliveryManCreate',
+                        icon: 'vn:addperson',
+                    },
+                    component: () => import('src/pages/Route/DeliveryManCreate.vue'),
+                },
+
+            ]
+        },
+        {
+            name: 'DeliveryManCard',
+            path: ':id',
+            component: () => import('src/pages/Route/Card/DeliveryManCard.vue'),
+            redirect: { name: 'DeliveryManSummary' },
+            children: [
+                {
+                    name: 'DeliveryManSummary',
+                    path: 'deliveryMan/summary',
+                    meta: {
+                        title: 'summary',
+                    },
+                    component: () => import('src/pages/Route/Card/DeliveryManSummary.vue'),
+                },
+                {
+                    name: 'DeliveryManBasicData',
+                    path: 'deliveryMan/basic-data',
+                    meta: {
+                        title: 'basicData',
+                    },
+                    component: () => import('src/pages/Route/Card/DeliveryManBasicData.vue'),
+                },
+            ]
+        },
+    ]
+};
diff --git a/src/router/routes.js b/src/router/routes.js
index a7261379f..f0090d380 100644
--- a/src/router/routes.js
+++ b/src/router/routes.js
@@ -1,6 +1,7 @@
 import customer from './modules/customer';
 import ticket from './modules/ticket';
 import claim from './modules/claim';
+import route from './modules/route';
 
 const routes = [
     {
@@ -25,13 +26,14 @@ const routes = [
             customer,
             ticket,
             claim,
+            route,
             {
                 path: '/:pathMatch(.*)*',
                 name: 'NotFound',
                 component: () => import('../pages/NotFound.vue'),
-            }
+            },
         ],
     }
 ];
 
-export default routes;
\ No newline at end of file
+export default routes;

From 20e284fe594507ecc15542ce98bba359921ce5b5 Mon Sep 17 00:00:00 2001
From: alexandre <alexandre@verdnatura.es>
Date: Thu, 1 Dec 2022 15:16:41 +0100
Subject: [PATCH 2/5] wornking on invoiceAllocation

---
 src/i18n/en/index.js                  |   1 +
 src/i18n/es/index.js                  |   1 +
 src/pages/Route/DeliveryManCreate.vue | 114 +++++++++++++++++++----
 src/pages/Route/DeliveryManList.vue   |  13 ++-
 src/pages/Route/InvoiceAllocation.vue | 126 ++++++++++++++++++++++++++
 src/router/modules/route.js           |   9 ++
 6 files changed, 244 insertions(+), 20 deletions(-)
 create mode 100644 src/pages/Route/InvoiceAllocation.vue

diff --git a/src/i18n/en/index.js b/src/i18n/en/index.js
index f567edcab..66c8b5ca5 100644
--- a/src/i18n/en/index.js
+++ b/src/i18n/en/index.js
@@ -257,6 +257,7 @@ export default {
             deliveryManList: 'Delivery Men',
             basicData: 'Basic Data',
             deliveryManCreate: 'Create Delivery Man',
+            invoiceAllocation: 'Invoice Allocation',
         },
         deliveryMan: {
             list: {
diff --git a/src/i18n/es/index.js b/src/i18n/es/index.js
index 567fe71e4..bbc335a6e 100644
--- a/src/i18n/es/index.js
+++ b/src/i18n/es/index.js
@@ -256,6 +256,7 @@ export default {
             deliveryManList: 'Repartidores',
             basicData: 'Datos básicos',
             deliveryManCreate: 'Crear Repartidor',
+            invoiceAllocation: 'Imputación Facturas',
         },
         deliveryMan: {
             list: {
diff --git a/src/pages/Route/DeliveryManCreate.vue b/src/pages/Route/DeliveryManCreate.vue
index 8cb66d510..fbe0be4d0 100644
--- a/src/pages/Route/DeliveryManCreate.vue
+++ b/src/pages/Route/DeliveryManCreate.vue
@@ -1,44 +1,126 @@
 <script setup>
 import axios from 'axios';
-import { reactive } from 'vue';
+import { reactive, ref } from 'vue';
+import { useI18n } from 'vue-i18n';
+import FetchData from 'components/FetchData.vue';
+
+const { t } = useI18n();
 
 const deliveryMan = reactive({
     supplierFk: null,
-    agencyMode: null,
+    agencyModeFk: null,
     minCost: null,
     minM3: null,
 });
 
+const suppliers = ref([]);
+const agencyModes = ref([]);
+
+function setSuppliers(data) {
+    suppliers.value = data;
+}
+
+function setAgencyModes(data) {
+    agencyModes.value = data;
+}
+
 async function onSubmit() {
-    await axios.post('DeliveryMans', {
-        supplierFk: deliveryMan.supplierFk,
-        minCost: deliveryMan.minCost,
-        minM3: deliveryMan.minM3,
-    });
+    try {
+        const newDeliveryMan = await axios.post('DeliveryMans', {
+            supplierFk: deliveryMan.supplierFk,
+            minCost: deliveryMan.minCost,
+            minM3: deliveryMan.minM3,
+        });
+
+        if (deliveryMan.agencyModeFk) {
+            await axios.post(`DeliveryManAgencys/${newDeliveryMan.id}`, {
+                agencyModeFk: deliveryMan.agencyMode,
+            });
+        }
+    } catch (e) {
+        console.error(e);
+    }
 }
 </script>
 
 <template>
-    <q-page class="q-pa-md">
+    <fetch-data url="Suppliers" @on-fetch="setSuppliers" auto-load />
+    <fetch-data url="AgencyModes" @on-fetch="setAgencyModes" auto-load />
+    <div class="container">
         <q-card class="q-pa-md">
             <q-banner v-if="hasChanges" class="text-white bg-warning">
                 <q-icon name="warning" size="md" class="q-mr-md" />
                 <span>{{ t('globals.changesToSave') }}</span>
             </q-banner>
             <q-form @submit="onSubmit" @reset="onReset" class="q-gutter-md">
-                <q-input filled v-model="deliveryMan.minCost" label="Your name *" lazy-rules />
-                <div>
-                    <q-btn label="Submit" type="submit" color="primary" />
-                    <q-btn label="Reset" type="reset" color="primary" flat class="q-ml-sm" />
+                <div class="row q-gutter-md q-mb-md">
+                    <div class="col">
+                        <q-input
+                            filled
+                            v-model="deliveryMan.minCost"
+                            :label="t('route.deliveryMan.basicData.minCost')"
+                            :rules="[(val) => val > 0]"
+                            lazy-rules
+                        />
+                    </div>
+                    <div class="col">
+                        <q-input
+                            filled
+                            v-model="deliveryMan.minM3"
+                            :label="t('route.deliveryMan.basicData.minM3')"
+                            :rules="[(val) => val > 0]"
+                            lazy-rules
+                        />
+                    </div>
+                </div>
+                <div class="row q-gutter-md q-mb-md">
+                    <div class="col">
+                        <q-select
+                            v-model="deliveryMan.supplierFk"
+                            :options="suppliers"
+                            option-value="id"
+                            option-label="name"
+                            emit-value
+                            :label="t('route.deliveryMan.basicData.supplier')"
+                            map-options
+                            use-input
+                            :input-debounce="0"
+                        >
+                        </q-select>
+                    </div>
+                    <div class="col">
+                        <q-select
+                            v-model="deliveryMan.agencyModeFk"
+                            :options="agencyModes"
+                            option-value="id"
+                            option-label="name"
+                            emit-value
+                            :label="t('route.deliveryMan.basicData.agency')"
+                            map-options
+                            use-input
+                            :input-debounce="0"
+                        >
+                        </q-select>
+                    </div>
+                </div>
+                <div class="row q-gutter-md q-mb-md">
+                    <div class="col">
+                        <q-btn label="Submit" type="submit" color="primary" />
+                        <q-btn label="Reset" type="reset" color="primary" flat class="q-ml-sm" />
+                    </div>
                 </div>
             </q-form>
         </q-card>
-    </q-page>
+    </div>
 </template>
 
 <style lang="scss" scoped>
-.card {
-    width: 100%;
-    max-width: 60em;
+.q-card {
+    width: 800px;
+}
+
+.container {
+    display: flex;
+    justify-content: center;
 }
 </style>
diff --git a/src/pages/Route/DeliveryManList.vue b/src/pages/Route/DeliveryManList.vue
index 2103e6129..058be1e80 100644
--- a/src/pages/Route/DeliveryManList.vue
+++ b/src/pages/Route/DeliveryManList.vue
@@ -22,9 +22,13 @@ const filter = {
     ],
 };
 
-function navigate(id) {
+function navigateCard(id) {
     router.push({ path: `/route/${id}` });
 }
+
+function navigateCreate() {
+    router.push({ path: `/route/deliveryMan/create` });
+}
 </script>
 
 <template>
@@ -33,7 +37,7 @@ function navigate(id) {
             <template #body="{ rows }">
                 <q-card class="card" v-for="row of rows" :key="row.id">
                     <q-item class="q-pa-none items-start cursor-pointer q-hoverable" v-ripple clickable>
-                        <q-item-section class="q-pa-md" @click="navigate(row.id)">
+                        <q-item-section class="q-pa-md" @click="navigateCard(row.id)">
                             <div class="text-h6 link">{{ t('route.deliveryMan.list.deliveryMan') }}</div>
                             <q-item-label caption>#{{ row.id }}</q-item-label>
                             <q-list>
@@ -63,7 +67,7 @@ function navigate(id) {
                         </q-item-section>
                         <q-separator vertical />
                         <q-card-actions vertical>
-                            <q-btn flat round color="orange" icon="arrow_circle_right" @click="navigate(row.id)">
+                            <q-btn flat round color="orange" icon="arrow_circle_right" @click="navigateCard(row.id)">
                                 <q-tooltip>{{ t('components.smartCard.openCard') }}</q-tooltip>
                             </q-btn>
                         </q-card-actions>
@@ -71,7 +75,8 @@ function navigate(id) {
                 </q-card>
             </template>
         </paginate>
-        <q-page-sticky position="bottom-right" :offset="[18, 18]">
+        <q-page-sticky position="bottom-right" :offset="[18, 18]" @click="navigateCreate()"
+            ><q-tooltip>{{ t('route.pageTitles.deliveryManCreate') }}</q-tooltip>
             <q-fab icon="person_add" direction="up" color="orange"> </q-fab>
         </q-page-sticky>
     </q-page>
diff --git a/src/pages/Route/InvoiceAllocation.vue b/src/pages/Route/InvoiceAllocation.vue
new file mode 100644
index 000000000..fbe0be4d0
--- /dev/null
+++ b/src/pages/Route/InvoiceAllocation.vue
@@ -0,0 +1,126 @@
+<script setup>
+import axios from 'axios';
+import { reactive, ref } from 'vue';
+import { useI18n } from 'vue-i18n';
+import FetchData from 'components/FetchData.vue';
+
+const { t } = useI18n();
+
+const deliveryMan = reactive({
+    supplierFk: null,
+    agencyModeFk: null,
+    minCost: null,
+    minM3: null,
+});
+
+const suppliers = ref([]);
+const agencyModes = ref([]);
+
+function setSuppliers(data) {
+    suppliers.value = data;
+}
+
+function setAgencyModes(data) {
+    agencyModes.value = data;
+}
+
+async function onSubmit() {
+    try {
+        const newDeliveryMan = await axios.post('DeliveryMans', {
+            supplierFk: deliveryMan.supplierFk,
+            minCost: deliveryMan.minCost,
+            minM3: deliveryMan.minM3,
+        });
+
+        if (deliveryMan.agencyModeFk) {
+            await axios.post(`DeliveryManAgencys/${newDeliveryMan.id}`, {
+                agencyModeFk: deliveryMan.agencyMode,
+            });
+        }
+    } catch (e) {
+        console.error(e);
+    }
+}
+</script>
+
+<template>
+    <fetch-data url="Suppliers" @on-fetch="setSuppliers" auto-load />
+    <fetch-data url="AgencyModes" @on-fetch="setAgencyModes" auto-load />
+    <div class="container">
+        <q-card class="q-pa-md">
+            <q-banner v-if="hasChanges" class="text-white bg-warning">
+                <q-icon name="warning" size="md" class="q-mr-md" />
+                <span>{{ t('globals.changesToSave') }}</span>
+            </q-banner>
+            <q-form @submit="onSubmit" @reset="onReset" class="q-gutter-md">
+                <div class="row q-gutter-md q-mb-md">
+                    <div class="col">
+                        <q-input
+                            filled
+                            v-model="deliveryMan.minCost"
+                            :label="t('route.deliveryMan.basicData.minCost')"
+                            :rules="[(val) => val > 0]"
+                            lazy-rules
+                        />
+                    </div>
+                    <div class="col">
+                        <q-input
+                            filled
+                            v-model="deliveryMan.minM3"
+                            :label="t('route.deliveryMan.basicData.minM3')"
+                            :rules="[(val) => val > 0]"
+                            lazy-rules
+                        />
+                    </div>
+                </div>
+                <div class="row q-gutter-md q-mb-md">
+                    <div class="col">
+                        <q-select
+                            v-model="deliveryMan.supplierFk"
+                            :options="suppliers"
+                            option-value="id"
+                            option-label="name"
+                            emit-value
+                            :label="t('route.deliveryMan.basicData.supplier')"
+                            map-options
+                            use-input
+                            :input-debounce="0"
+                        >
+                        </q-select>
+                    </div>
+                    <div class="col">
+                        <q-select
+                            v-model="deliveryMan.agencyModeFk"
+                            :options="agencyModes"
+                            option-value="id"
+                            option-label="name"
+                            emit-value
+                            :label="t('route.deliveryMan.basicData.agency')"
+                            map-options
+                            use-input
+                            :input-debounce="0"
+                        >
+                        </q-select>
+                    </div>
+                </div>
+                <div class="row q-gutter-md q-mb-md">
+                    <div class="col">
+                        <q-btn label="Submit" type="submit" color="primary" />
+                        <q-btn label="Reset" type="reset" color="primary" flat class="q-ml-sm" />
+                    </div>
+                </div>
+            </q-form>
+        </q-card>
+    </div>
+</template>
+
+<style lang="scss" scoped>
+.q-card {
+    width: 800px;
+}
+
+.container {
+    display: flex;
+    justify-content: center;
+}
+</style>
diff --git a/src/router/modules/route.js b/src/router/modules/route.js
index a5e86a446..e7c3806de 100644
--- a/src/router/modules/route.js
+++ b/src/router/modules/route.js
@@ -34,6 +34,15 @@ export default {
                     },
                     component: () => import('src/pages/Route/DeliveryManCreate.vue'),
                 },
+                {
+                    name: 'InvoiceAllocation',
+                    path: '/invoiceAllocation',
+                    meta: {
+                        title: 'invoiceAllocation',
+                        icon: 'vn:invoice-in',
+                    },
+                    component: () => import('src/pages/Route/InvoiceAllocation.vue'),
+                },
 
             ]
         },

From 56a46cd1306e7a6ccb34ace2268086116a0728ef Mon Sep 17 00:00:00 2001
From: jgallego <jgallego@verdnatura.es>
Date: Mon, 3 Jun 2024 11:52:19 +0200
Subject: [PATCH 3/5] 4560

---
 src/components/FormPopup.vue                     |  2 +-
 src/pages/Route/Roadmap/RoadmapAddStopDialog.vue |  2 +-
 src/pages/Route/Roadmap/RoadmapStops.vue         |  8 ++++----
 src/pages/Route/Roadmap/RoadmapSummary.vue       | 12 ++++++------
 src/router/routes.js                             |  2 --
 5 files changed, 12 insertions(+), 14 deletions(-)

diff --git a/src/components/FormPopup.vue b/src/components/FormPopup.vue
index e203a7c75..2da986006 100644
--- a/src/components/FormPopup.vue
+++ b/src/components/FormPopup.vue
@@ -4,7 +4,7 @@ import { useI18n } from 'vue-i18n';
 
 const emit = defineEmits(['onSubmit']);
 
-const $props = defineProps({
+defineProps({
     title: {
         type: String,
         default: '',
diff --git a/src/pages/Route/Roadmap/RoadmapAddStopDialog.vue b/src/pages/Route/Roadmap/RoadmapAddStopDialog.vue
index 810ef42c8..f20619033 100644
--- a/src/pages/Route/Roadmap/RoadmapAddStopDialog.vue
+++ b/src/pages/Route/Roadmap/RoadmapAddStopDialog.vue
@@ -34,7 +34,7 @@ const updateDefaultStop = (data) => {
 const onSave = async () => {
     isLoading.value = true;
     try {
-        await axios.post('ExpeditionTrucks', { ...roadmapStopForm });
+        await axios.post('RoadmapStops', { ...roadmapStopForm });
         emit('ok');
     } finally {
         isLoading.value = false;
diff --git a/src/pages/Route/Roadmap/RoadmapStops.vue b/src/pages/Route/Roadmap/RoadmapStops.vue
index 5c3bd51e7..9e6ac82f4 100644
--- a/src/pages/Route/Roadmap/RoadmapStops.vue
+++ b/src/pages/Route/Roadmap/RoadmapStops.vue
@@ -33,9 +33,9 @@ const updateDefaultStop = (data) => {
     <div class="q-pa-lg">
         <CrudModel
             ref="roadmapStopsCrudRef"
-            data-key="ExpeditionTrucks"
-            url="ExpeditionTrucks"
-            model="ExpeditionTrucks"
+            data-key="RoadmapStops"
+            url="RoadmapStops"
+            model="RoadmapStops"
             :filter="{ where: { roadmapFk: route.params?.id } }"
             :default-remove="false"
             :data-required="defaultStop"
@@ -86,7 +86,7 @@ const updateDefaultStop = (data) => {
 </template>
 <i18n>
 es:
-    Warehouse: Almacén
+    Address: Consignatario
     ETA date: Fecha ETA
     ETA hour: Hora ETA
     Description: Descripción
diff --git a/src/pages/Route/Roadmap/RoadmapSummary.vue b/src/pages/Route/Roadmap/RoadmapSummary.vue
index 1fed6aa78..01246b647 100644
--- a/src/pages/Route/Roadmap/RoadmapSummary.vue
+++ b/src/pages/Route/Roadmap/RoadmapSummary.vue
@@ -35,9 +35,9 @@ onUnmounted(hideRightDrawer);
 
 const columns = ref([
     {
-        name: 'warehouse',
-        label: t('Warehouse'),
-        field: (row) => dashIfEmpty(row?.warehouse?.name),
+        name: 'address',
+        label: t('Address'),
+        field: (row) => dashIfEmpty(row?.address?.nickname),
         sortable: true,
         align: 'left',
     },
@@ -54,8 +54,8 @@ const filter = {
         { relation: 'supplier' },
         { relation: 'worker' },
         {
-            relation: 'expeditionTruck',
-            scope: { include: [{ relation: 'warehouse' }] },
+            relation: 'roadmapStop',
+            scope: { include: [{ relation: 'address' }] },
         },
     ],
 };
@@ -146,7 +146,7 @@ const openAddStopDialog = () => {
                     </div>
                     <QTable
                         :columns="columns"
-                        :rows="entity?.expeditionTruck"
+                        :rows="entity?.roadmapStop"
                         :rows-per-page-options="[0]"
                         row-key="id"
                         flat
diff --git a/src/router/routes.js b/src/router/routes.js
index 591f2121d..bf52a5ac2 100644
--- a/src/router/routes.js
+++ b/src/router/routes.js
@@ -8,7 +8,6 @@ import invoiceOut from './modules/invoiceOut';
 import invoiceIn from './modules/invoiceIn';
 import wagon from './modules/wagon';
 import supplier from './modules/Supplier';
-import route from './modules/route';
 import travel from './modules/travel';
 import department from './modules/department';
 import ItemType from './modules/itemType';
@@ -62,7 +61,6 @@ const routes = [
             customer,
             ticket,
             claim,
-            route,
             worker,
             shelving,
             invoiceOut,

From f1df969fa697a2e60ceaf5d99fec9162d02c10f9 Mon Sep 17 00:00:00 2001
From: jgallego <jgallego@verdnatura.es>
Date: Tue, 4 Jun 2024 10:52:00 +0200
Subject: [PATCH 4/5] feat: refs #560 refactor descriptor

---
 .../Route/Roadmap/RoadmapAddStopForm.vue      | 37 ++++++++++++++-----
 src/pages/Route/Roadmap/RoadmapCard.vue       | 30 +++++++--------
 src/pages/Route/Roadmap/RoadmapSummary.vue    | 15 ++++++--
 src/pages/Route/RouteRoadmap.vue              |  4 +-
 4 files changed, 53 insertions(+), 33 deletions(-)

diff --git a/src/pages/Route/Roadmap/RoadmapAddStopForm.vue b/src/pages/Route/Roadmap/RoadmapAddStopForm.vue
index 736280e99..6cc21fd4d 100644
--- a/src/pages/Route/Roadmap/RoadmapAddStopForm.vue
+++ b/src/pages/Route/Roadmap/RoadmapAddStopForm.vue
@@ -23,28 +23,43 @@ const props = defineProps({
 });
 
 const { t } = useI18n();
-const warehouseList = ref([]);
+const addressList = ref([]);
 const form = computed(() => props.formData);
 const isDialog = computed(() => props.layout === 'dialog');
+const onFetch = (data) => {
+    addressList.value = data.map((roadmap) => ({
+        id: roadmap.addressFk,
+        nickname: roadmap.address ? roadmap.address.nickname : '',
+    }));
+};
 </script>
+
 <template>
     <FetchData
-        url="Warehouses"
+        url="RoadmapAddresses"
         auto-load
-        :filter="{ fields: ['id', 'name'] }"
-        sort-by="name"
+        :filter="{
+            include: [
+                {
+                    relation: 'address',
+                    scope: {
+                        fields: ['nickname'],
+                    },
+                },
+            ],
+        }"
         limit="30"
-        @on-fetch="(data) => (warehouseList = data)"
+        @on-fetch="onFetch"
     />
     <div :class="[isDialog ? 'column' : 'form-gap', 'full-width flex']">
         <QCardSection class="flex-grow q-px-none flex-1">
             <VnSelect
-                v-model.number="form.warehouseFk"
+                v-model.number="form.addressFk"
                 class="full-width"
-                :label="t('Warehouse')"
-                :options="warehouseList"
+                :label="t('Address')"
+                :options="addressList"
                 option-value="id"
-                option-label="name"
+                option-label="nickname"
                 emit-value
                 map-options
                 use-input
@@ -80,6 +95,7 @@ const isDialog = computed(() => props.layout === 'dialog');
         </QCardSection>
     </div>
 </template>
+
 <style lang="scss" scoped>
 .form-gap {
     gap: 16px;
@@ -93,9 +109,10 @@ const isDialog = computed(() => props.layout === 'dialog');
     flex: 2;
 }
 </style>
+
 <i18n>
 es:
-    Warehouse: Almacén
+    Address: Dirección
     ETA date: Fecha ETA
     ETA hour: Hora ETA
     Description: Descripción
diff --git a/src/pages/Route/Roadmap/RoadmapCard.vue b/src/pages/Route/Roadmap/RoadmapCard.vue
index d6b02824b..4e8f8dd50 100644
--- a/src/pages/Route/Roadmap/RoadmapCard.vue
+++ b/src/pages/Route/Roadmap/RoadmapCard.vue
@@ -1,21 +1,17 @@
 <script setup>
-import { useStateStore } from 'stores/useStateStore';
-import LeftMenu from 'components/LeftMenu.vue';
-import RoadmapDescriptor from "pages/Route/Roadmap/RoadmapDescriptor.vue";
-
-const stateStore = useStateStore();
+import VnCard from 'components/common/VnCard.vue';
+import RoadmapDescriptor from 'pages/Route/Roadmap/RoadmapDescriptor.vue';
+import RoadmapFilter from 'pages/Route/Roadmap/RoadmapFilter.vue';
 </script>
 <template>
-    <QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
-        <QScrollArea class="fit">
-            <RoadmapDescriptor />
-            <QSeparator />
-            <LeftMenu source="card" />
-        </QScrollArea>
-    </QDrawer>
-    <QPageContainer>
-        <QPage>
-            <RouterView></RouterView>
-        </QPage>
-    </QPageContainer>
+    <VnCard
+        data-key="Roadmap"
+        base-url="Roadmaps"
+        :descriptor="RoadmapDescriptor"
+        :filter-panel="RoadmapFilter"
+        search-data-key="RoadmapList"
+        search-url="Roadmaps"
+        searchbar-label="Search roadmap"
+        searchbar-info="You can search by roadmap id or customer name"
+    />
 </template>
diff --git a/src/pages/Route/Roadmap/RoadmapSummary.vue b/src/pages/Route/Roadmap/RoadmapSummary.vue
index 8604cc30a..e9969c2f7 100644
--- a/src/pages/Route/Roadmap/RoadmapSummary.vue
+++ b/src/pages/Route/Roadmap/RoadmapSummary.vue
@@ -55,7 +55,16 @@ const filter = {
         { relation: 'worker' },
         {
             relation: 'roadmapStop',
-            scope: { include: [{ relation: 'address' }] },
+            scope: {
+                include: [
+                    {
+                        relation: 'address',
+                        scope: {
+                            fields: ['nickname'],
+                        },
+                    },
+                ],
+            },
         },
     ],
 };
@@ -154,8 +163,6 @@ const openAddStopDialog = () => {
                         :rows="entity?.roadmapStop"
                         :rows-per-page-options="[0]"
                         row-key="id"
-                        flat
-                        hide-pagination
                     />
                 </QCard>
             </template>
@@ -171,7 +178,7 @@ es:
     Worker: Trabajador
     Observations: Observaciones
     Stops: Paradas
-    Warehouse: Almacén
+    Address: Dirección
     Go to stops: Ir a paradas
     Add stop: Añadir parada
 </i18n>
diff --git a/src/pages/Route/RouteRoadmap.vue b/src/pages/Route/RouteRoadmap.vue
index 2ed8b6a9a..06c632ad4 100644
--- a/src/pages/Route/RouteRoadmap.vue
+++ b/src/pages/Route/RouteRoadmap.vue
@@ -284,9 +284,9 @@ function navigateToRoadmapSummary(event, row) {
 <i18n>
 es:
     Search roadmaps: Buscar troncales
-    You can search by roadmap reference: Puedes buscar por referencia de la troncal
+    You can search by roadmap reference: Puedes buscar por referencia del troncal
     Delete roadmap(s): Eliminar troncal(es)
-    Selected roadmaps will be removed: Las troncales seleccionadas serán eliminadas
+    Selected roadmaps will be removed: Los troncales seleccionadas serán eliminados
     Are you sure you want to continue?: ¿Seguro que quieres continuar?
     The date can't be empty: La fecha no puede estar vacía
     Clone Selected Routes: Clonar rutas seleccionadas

From 857aca49dd5b0bcad405aa0bb434c07356629685 Mon Sep 17 00:00:00 2001
From: jgallego <jgallego@verdnatura.es>
Date: Tue, 4 Jun 2024 14:06:04 +0200
Subject: [PATCH 5/5] feat: refs #4560 sin DeliveryMan

---
 src/pages/Route/Card/DeliveryManBasicData.vue | 115 ----------------
 src/pages/Route/Card/DeliveryManCard.vue      |  58 --------
 .../Route/Card/DeliveryManDescriptor.vue      |  82 ------------
 src/pages/Route/Card/DeliveryManSummary.vue   | 124 -----------------
 src/pages/Route/DeliveryManCreate.vue         | 126 ------------------
 src/pages/Route/DeliveryManList.vue           |  83 ------------
 src/pages/Route/InvoiceAllocation.vue         | 126 ------------------
 src/pages/Route/Roadmap/RoadmapBasicData.vue  |   2 -
 src/pages/Route/Roadmap/RoadmapStops.vue      |   2 -
 9 files changed, 718 deletions(-)
 delete mode 100644 src/pages/Route/Card/DeliveryManBasicData.vue
 delete mode 100644 src/pages/Route/Card/DeliveryManCard.vue
 delete mode 100644 src/pages/Route/Card/DeliveryManDescriptor.vue
 delete mode 100644 src/pages/Route/Card/DeliveryManSummary.vue
 delete mode 100644 src/pages/Route/DeliveryManCreate.vue
 delete mode 100644 src/pages/Route/DeliveryManList.vue
 delete mode 100644 src/pages/Route/InvoiceAllocation.vue

diff --git a/src/pages/Route/Card/DeliveryManBasicData.vue b/src/pages/Route/Card/DeliveryManBasicData.vue
deleted file mode 100644
index 1aad8d8cc..000000000
--- a/src/pages/Route/Card/DeliveryManBasicData.vue
+++ /dev/null
@@ -1,115 +0,0 @@
-<script setup>
-import { ref } from 'vue';
-import { useI18n } from 'vue-i18n';
-import { useRoute } from 'vue-router';
-
-import FetchData from 'components/FetchData.vue';
-import FormModel from 'components/FormModel.vue';
-
-const route = useRoute();
-const { t } = useI18n();
-
-const suppliers = ref([]);
-const agencyModes = ref([]);
-
-function setSuppliers(data) {
-    suppliers.value = data;
-}
-
-function setAgencyModes(data) {
-    agencyModes.value = data;
-}
-
-const filter = {
-    include: [
-        {
-            relation: 'deliveryManAgency',
-            scope: {
-                include: {
-                    relation: 'agencyMode',
-                },
-            },
-        },
-        {
-            relation: 'supplier',
-        },
-    ],
-};
-</script>
-<template>
-    <fetch-data url="Suppliers" @on-fetch="setSuppliers" auto-load />
-    <fetch-data url="AgencyModes" @on-fetch="setAgencyModes" auto-load />
-
-    <div class="container">
-        <q-card>
-            <form-model :url="`DeliveryMans/${route.params.id}`" :filter="filter" model="deliveryMan">
-                <template #form="{ data, validate }">
-                    <div class="row q-gutter-md q-mb-md">
-                        <div class="col">
-                            <q-input v-model="data.id" :label="t('route.deliveryMan.basicData.id')" disable />
-                        </div>
-                        <div class="col">
-                            <q-select
-                                v-model="data.supplierFk"
-                                :options="suppliers"
-                                option-value="id"
-                                option-label="name"
-                                emit-value
-                                :label="t('route.deliveryMan.basicData.supplier')"
-                                map-options
-                                use-input
-                                :rules="validate('deliveryMan.supplierFk')"
-                                :input-debounce="0"
-                            >
-                            </q-select>
-                        </div>
-                    </div>
-                    <div class="row q-gutter-md q-mb-md">
-                        <div class="col">
-                            <q-input
-                                v-model="data.minCost"
-                                :label="t('route.deliveryMan.basicData.minCost')"
-                                :rules="validate('deliveryMan.minCost')"
-                            />
-                        </div>
-                        <div class="col">
-                            <q-input
-                                v-model="data.minM3"
-                                :label="t('route.deliveryMan.basicData.minM3')"
-                                :rules="validate('deliveryMan.minM3')"
-                            />
-                        </div>
-                    </div>
-                    <div class="row q-gutter-md q-mb-md">
-                        <div class="col">
-                            <q-select
-                                v-model="data.deliveryManAgency.agencyModeFk"
-                                :options="agencyModes"
-                                option-value="id"
-                                option-label="name"
-                                emit-value
-                                :label="t('route.deliveryMan.basicData.agency')"
-                                map-options
-                                use-input
-                                :rules="validate('deliveryMan.deliveryManAgency.agencyModeFk')"
-                                :input-debounce="0"
-                            >
-                            </q-select>
-                        </div>
-                    </div>
-                </template>
-            </form-model>
-        </q-card>
-    </div>
-</template>
-
-<style lang="scss" scoped>
-.container {
-    display: flex;
-    justify-content: center;
-}
-
-.q-card {
-    width: 800px;
-}
-</style>
diff --git a/src/pages/Route/Card/DeliveryManCard.vue b/src/pages/Route/Card/DeliveryManCard.vue
deleted file mode 100644
index cabf0266c..000000000
--- a/src/pages/Route/Card/DeliveryManCard.vue
+++ /dev/null
@@ -1,58 +0,0 @@
-<script setup>
-import { useI18n } from 'vue-i18n';
-import { useState } from 'composables/useState';
-import DeliveryManDescriptor from './DeliveryManDescriptor.vue';
-
-const { t } = useI18n();
-const state = useState();
-</script>
-<template>
-    <q-drawer v-model="state.drawer.value" show-if-above :width="256" :breakpoint="500">
-        <q-scroll-area class="fit">
-            <delivery-man-descriptor />
-            <q-separator />
-            <q-list>
-                <q-item :to="{ name: 'DeliveryManBasicData' }" clickable v-ripple>
-                    <q-item-section avatar>
-                        <q-icon name="vn:settings" />
-                    </q-item-section>
-                    <q-item-section>{{ t('route.pageTitles.basicData') }}</q-item-section>
-                </q-item>
-            </q-list>
-        </q-scroll-area>
-    </q-drawer>
-    <q-page-container>
-        <q-page class="q-pa-md">
-            <router-view></router-view>
-        </q-page>
-    </q-page-container>
-</template>
-
-<style lang="scss">
-.q-scrollarea__content {
-    max-width: 100%;
-}
-</style>
-
-<style lang="scss" scoped>
-.descriptor {
-    max-width: 256px;
-
-    h5 {
-        margin: 0 15px;
-    }
-
-    .header {
-        display: flex;
-        justify-content: space-between;
-    }
-
-    .q-card__actions {
-        justify-content: center;
-    }
-
-    #descriptor-skeleton .q-card__actions {
-        justify-content: space-between;
-    }
-}
-</style>
diff --git a/src/pages/Route/Card/DeliveryManDescriptor.vue b/src/pages/Route/Card/DeliveryManDescriptor.vue
deleted file mode 100644
index 6d9e64c32..000000000
--- a/src/pages/Route/Card/DeliveryManDescriptor.vue
+++ /dev/null
@@ -1,82 +0,0 @@
-<script setup>
-import axios from 'axios';
-import CardDescriptor from 'components/ui/CardDescriptor.vue';
-import SkeletonDescriptor from 'components/ui/SkeletonDescriptor.vue';
-import { computed, onMounted, ref } from 'vue';
-import { useI18n } from 'vue-i18n';
-import { useRoute } from 'vue-router';
-
-const $props = defineProps({
-    id: {
-        type: Number,
-        required: false,
-        default: null,
-    },
-});
-
-onMounted(async () => {
-    await fetch();
-});
-
-const route = useRoute();
-const { t } = useI18n();
-
-const entityId = computed(() => {
-    return $props.id || route.params.id;
-});
-
-const deliveryMan = ref();
-async function fetch() {
-    const filter = {
-        include: [
-            {
-                relation: 'deliveryManAgency',
-                scope: {
-                    include: {
-                        relation: 'agencyMode',
-                    },
-                },
-            },
-            {
-                relation: 'supplier',
-            },
-        ],
-    };
-    const options = { params: { filter } };
-    const { data } = await axios.get(`DeliveryMans/${entityId.value}`, options);
-
-    if (data) deliveryMan.value = data;
-}
-</script>
-
-<template>
-    <skeleton-descriptor v-if="!deliveryMan" />
-    <card-descriptor v-if="deliveryMan" module="DeliveryMan" :data="deliveryMan">
-        <template #body>
-            <q-list>
-                <q-item>
-                    <q-item-section>
-                        <q-item-label caption>{{ t('route.deliveryMan.card.supplier') }}</q-item-label>
-                        <q-item-label>{{ deliveryMan.supplier.name }}</q-item-label>
-                    </q-item-section>
-                </q-item>
-                <q-item>
-                    <q-item-section>
-                        <q-item-label caption>{{ t('route.deliveryMan.card.agency') }}</q-item-label>
-                        <q-item-label>{{ deliveryMan.deliveryManAgency.agencyMode.name }}</q-item-label>
-                    </q-item-section>
-                </q-item>
-                <q-item>
-                    <q-item-section>
-                        <q-item-label caption>{{ t('route.deliveryMan.card.minCost') }}</q-item-label>
-                        <q-item-label>{{ deliveryMan.minCost }}</q-item-label>
-                    </q-item-section>
-                    <q-item-section>
-                        <q-item-label caption>{{ t('route.deliveryMan.card.minM3') }}</q-item-label>
-                        <q-item-label>{{ deliveryMan.minM3 }}</q-item-label>
-                    </q-item-section>
-                </q-item>
-            </q-list>
-        </template>
-    </card-descriptor>
-</template>
diff --git a/src/pages/Route/Card/DeliveryManSummary.vue b/src/pages/Route/Card/DeliveryManSummary.vue
deleted file mode 100644
index b76ca8a05..000000000
--- a/src/pages/Route/Card/DeliveryManSummary.vue
+++ /dev/null
@@ -1,124 +0,0 @@
-<script setup>
-import axios from 'axios';
-import SkeletonSummary from 'components/ui/SkeletonSummary.vue';
-import { computed, onMounted, ref } from 'vue';
-import { useI18n } from 'vue-i18n';
-import { useRoute } from 'vue-router';
-
-onMounted(() => fetch());
-
-const route = useRoute();
-const { t } = useI18n();
-
-const $props = defineProps({
-    id: {
-        type: Number,
-        default: 0,
-    },
-});
-
-const entityId = computed(() => $props.id || route.params.id);
-
-const filter = {
-    include: [
-        {
-            relation: 'deliveryManAgency',
-            scope: {
-                include: {
-                    relation: 'agencyMode',
-                },
-            },
-        },
-        {
-            relation: 'supplier',
-        },
-    ],
-};
-
-const deliveryMan = ref(null);
-function fetch() {
-    const id = entityId.value;
-    axios
-        .get(`DeliveryMans/${id}`, {
-            params: {
-                filter,
-            },
-        })
-        .then(({ data }) => {
-            deliveryMan.value = data;
-        });
-}
-</script>
-
-<template>
-    <div class="summary container">
-        <q-card>
-            <skeleton-summary v-if="!deliveryMan" />
-            <template v-if="deliveryMan">
-                <div class="header bg-primary q-pa-sm q-mb-md">
-                    {{ t('route.deliveryMan.summary.deliveryMan') }} #{{ deliveryMan.id }}
-                </div>
-                <q-list>
-                    <q-item>
-                        <q-item-section>
-                            <q-item-label caption>{{ t('route.deliveryMan.summary.supplier') }}</q-item-label>
-                            <q-item-label>{{ deliveryMan.supplier.name }}</q-item-label>
-                        </q-item-section>
-                        <q-item-section>
-                            <q-item-label caption>{{ t('route.deliveryMan.summary.agency') }}</q-item-label>
-                            <q-item-label>{{ deliveryMan.deliveryManAgency.agencyMode.name }}</q-item-label>
-                        </q-item-section>
-                        <q-item-section>
-                            <q-item-label caption>{{ t('route.deliveryMan.summary.minCost') }}</q-item-label>
-                            <q-item-label>{{ deliveryMan.minCost }}</q-item-label>
-                        </q-item-section>
-                        <q-item-section>
-                            <q-item-label caption>{{ t('route.deliveryMan.summary.minM3') }}</q-item-label>
-                            <q-item-label>{{ deliveryMan.minM3 }}</q-item-label>
-                        </q-item-section>
-                    </q-item>
-                    <q-item> </q-item>
-                </q-list>
-            </template>
-        </q-card>
-    </div>
-</template>
-
-<style lang="scss" scoped>
-.container {
-    display: flex;
-    justify-content: center;
-}
-
-.q-card {
-    width: 100%;
-    max-width: 950px;
-}
-
-.summary {
-    .header {
-        text-align: center;
-        font-size: 18px;
-    }
-
-    #slider-container {
-        max-width: 80%;
-        margin: 0 auto;
-
-        .q-slider {
-            .q-slider__marker-labels:nth-child(1) {
-                transform: none;
-            }
-            .q-slider__marker-labels:nth-child(2) {
-                transform: none;
-                left: auto !important;
-                right: 0%;
-            }
-        }
-    }
-}
-
-.q-dialog .summary {
-    max-width: 1200px;
-}
-</style>
diff --git a/src/pages/Route/DeliveryManCreate.vue b/src/pages/Route/DeliveryManCreate.vue
deleted file mode 100644
index fbe0be4d0..000000000
--- a/src/pages/Route/DeliveryManCreate.vue
+++ /dev/null
@@ -1,126 +0,0 @@
-<script setup>
-import axios from 'axios';
-import { reactive, ref } from 'vue';
-import { useI18n } from 'vue-i18n';
-import FetchData from 'components/FetchData.vue';
-
-const { t } = useI18n();
-
-const deliveryMan = reactive({
-    supplierFk: null,
-    agencyModeFk: null,
-    minCost: null,
-    minM3: null,
-});
-
-const suppliers = ref([]);
-const agencyModes = ref([]);
-
-function setSuppliers(data) {
-    suppliers.value = data;
-}
-
-function setAgencyModes(data) {
-    agencyModes.value = data;
-}
-
-async function onSubmit() {
-    try {
-        const newDeliveryMan = await axios.post('DeliveryMans', {
-            supplierFk: deliveryMan.supplierFk,
-            minCost: deliveryMan.minCost,
-            minM3: deliveryMan.minM3,
-        });
-
-        if (deliveryMan.agencyModeFk) {
-            await axios.post(`DeliveryManAgencys/${newDeliveryMan.id}`, {
-                agencyModeFk: deliveryMan.agencyMode,
-            });
-        }
-    } catch (e) {
-        console.error(e);
-    }
-}
-</script>
-
-<template>
-    <fetch-data url="Suppliers" @on-fetch="setSuppliers" auto-load />
-    <fetch-data url="AgencyModes" @on-fetch="setAgencyModes" auto-load />
-    <div class="container">
-        <q-card class="q-pa-md">
-            <q-banner v-if="hasChanges" class="text-white bg-warning">
-                <q-icon name="warning" size="md" class="q-mr-md" />
-                <span>{{ t('globals.changesToSave') }}</span>
-            </q-banner>
-            <q-form @submit="onSubmit" @reset="onReset" class="q-gutter-md">
-                <div class="row q-gutter-md q-mb-md">
-                    <div class="col">
-                        <q-input
-                            filled
-                            v-model="deliveryMan.minCost"
-                            :label="t('route.deliveryMan.basicData.minCost')"
-                            :rules="[(val) => val > 0]"
-                            lazy-rules
-                        />
-                    </div>
-                    <div class="col">
-                        <q-input
-                            filled
-                            v-model="deliveryMan.minM3"
-                            :label="t('route.deliveryMan.basicData.minM3')"
-                            :rules="[(val) => val > 0]"
-                            lazy-rules
-                        />
-                    </div>
-                </div>
-                <div class="row q-gutter-md q-mb-md">
-                    <div class="col">
-                        <q-select
-                            v-model="deliveryMan.supplierFk"
-                            :options="suppliers"
-                            option-value="id"
-                            option-label="name"
-                            emit-value
-                            :label="t('route.deliveryMan.basicData.supplier')"
-                            map-options
-                            use-input
-                            :input-debounce="0"
-                        >
-                        </q-select>
-                    </div>
-                    <div class="col">
-                        <q-select
-                            v-model="deliveryMan.agencyModeFk"
-                            :options="agencyModes"
-                            option-value="id"
-                            option-label="name"
-                            emit-value
-                            :label="t('route.deliveryMan.basicData.agency')"
-                            map-options
-                            use-input
-                            :input-debounce="0"
-                        >
-                        </q-select>
-                    </div>
-                </div>
-                <div class="row q-gutter-md q-mb-md">
-                    <div class="col">
-                        <q-btn label="Submit" type="submit" color="primary" />
-                        <q-btn label="Reset" type="reset" color="primary" flat class="q-ml-sm" />
-                    </div>
-                </div>
-            </q-form>
-        </q-card>
-    </div>
-</template>
-
-<style lang="scss" scoped>
-.q-card {
-    width: 800px;
-}
-
-.container {
-    display: flex;
-    justify-content: center;
-}
-</style>
diff --git a/src/pages/Route/DeliveryManList.vue b/src/pages/Route/DeliveryManList.vue
deleted file mode 100644
index 058be1e80..000000000
--- a/src/pages/Route/DeliveryManList.vue
+++ /dev/null
@@ -1,83 +0,0 @@
-<script setup>
-import Paginate from 'components/Paginate.vue';
-import { useI18n } from 'vue-i18n';
-import { useRouter } from 'vue-router';
-
-const { t } = useI18n();
-const router = useRouter();
-
-const filter = {
-    include: [
-        {
-            relation: 'deliveryManAgency',
-            scope: {
-                include: {
-                    relation: 'agencyMode',
-                },
-            },
-        },
-        {
-            relation: 'supplier',
-        },
-    ],
-};
-
-function navigateCard(id) {
-    router.push({ path: `/route/${id}` });
-}
-
-function navigateCreate() {
-    router.push({ path: `/route/deliveryMan/create` });
-}
-</script>
-
-<template>
-    <q-page class="q-pa-md">
-        <paginate url="DeliveryMans" :filter="filter" sort-by="id DESC" auto-load>
-            <template #body="{ rows }">
-                <q-card class="card" v-for="row of rows" :key="row.id">
-                    <q-item class="q-pa-none items-start cursor-pointer q-hoverable" v-ripple clickable>
-                        <q-item-section class="q-pa-md" @click="navigateCard(row.id)">
-                            <div class="text-h6 link">{{ t('route.deliveryMan.list.deliveryMan') }}</div>
-                            <q-item-label caption>#{{ row.id }}</q-item-label>
-                            <q-list>
-                                <q-item class="q-pa-none">
-                                    <q-item-section>
-                                        <q-item-label caption>{{ t('route.deliveryMan.list.supplier') }}</q-item-label>
-                                        <q-item-label>{{ row.supplier.name }}</q-item-label>
-                                    </q-item-section>
-                                    <q-item-section>
-                                        <q-item-label caption>{{ t('route.deliveryMan.list.minCost') }}</q-item-label>
-                                        <q-item-label>{{ row.minCost }}</q-item-label>
-                                    </q-item-section>
-                                </q-item>
-                                <q-item class="q-pa-none">
-                                    <q-item-section>
-                                        <q-item-label caption>{{ t('route.deliveryMan.list.minM3') }}</q-item-label>
-                                        <q-item-label>{{ row.minM3 }}</q-item-label>
-                                    </q-item-section>
-                                    <q-item-section>
-                                        <q-item-label caption>{{ t('route.deliveryMan.list.agency') }}</q-item-label>
-                                        <q-item-label v-if="row.deliveryManAgency">{{
-                                            row.deliveryManAgency.agencyMode.name
-                                        }}</q-item-label>
-                                    </q-item-section>
-                                </q-item>
-                            </q-list>
-                        </q-item-section>
-                        <q-separator vertical />
-                        <q-card-actions vertical>
-                            <q-btn flat round color="orange" icon="arrow_circle_right" @click="navigateCard(row.id)">
-                                <q-tooltip>{{ t('components.smartCard.openCard') }}</q-tooltip>
-                            </q-btn>
-                        </q-card-actions>
-                    </q-item>
-                </q-card>
-            </template>
-        </paginate>
-        <q-page-sticky position="bottom-right" :offset="[18, 18]" @click="navigateCreate()"
-            ><q-tooltip>{{ t('route.pageTitles.deliveryManCreate') }}</q-tooltip>
-            <q-fab icon="person_add" direction="up" color="orange"> </q-fab>
-        </q-page-sticky>
-    </q-page>
-</template>
diff --git a/src/pages/Route/InvoiceAllocation.vue b/src/pages/Route/InvoiceAllocation.vue
deleted file mode 100644
index fbe0be4d0..000000000
--- a/src/pages/Route/InvoiceAllocation.vue
+++ /dev/null
@@ -1,126 +0,0 @@
-<script setup>
-import axios from 'axios';
-import { reactive, ref } from 'vue';
-import { useI18n } from 'vue-i18n';
-import FetchData from 'components/FetchData.vue';
-
-const { t } = useI18n();
-
-const deliveryMan = reactive({
-    supplierFk: null,
-    agencyModeFk: null,
-    minCost: null,
-    minM3: null,
-});
-
-const suppliers = ref([]);
-const agencyModes = ref([]);
-
-function setSuppliers(data) {
-    suppliers.value = data;
-}
-
-function setAgencyModes(data) {
-    agencyModes.value = data;
-}
-
-async function onSubmit() {
-    try {
-        const newDeliveryMan = await axios.post('DeliveryMans', {
-            supplierFk: deliveryMan.supplierFk,
-            minCost: deliveryMan.minCost,
-            minM3: deliveryMan.minM3,
-        });
-
-        if (deliveryMan.agencyModeFk) {
-            await axios.post(`DeliveryManAgencys/${newDeliveryMan.id}`, {
-                agencyModeFk: deliveryMan.agencyMode,
-            });
-        }
-    } catch (e) {
-        console.error(e);
-    }
-}
-</script>
-
-<template>
-    <fetch-data url="Suppliers" @on-fetch="setSuppliers" auto-load />
-    <fetch-data url="AgencyModes" @on-fetch="setAgencyModes" auto-load />
-    <div class="container">
-        <q-card class="q-pa-md">
-            <q-banner v-if="hasChanges" class="text-white bg-warning">
-                <q-icon name="warning" size="md" class="q-mr-md" />
-                <span>{{ t('globals.changesToSave') }}</span>
-            </q-banner>
-            <q-form @submit="onSubmit" @reset="onReset" class="q-gutter-md">
-                <div class="row q-gutter-md q-mb-md">
-                    <div class="col">
-                        <q-input
-                            filled
-                            v-model="deliveryMan.minCost"
-                            :label="t('route.deliveryMan.basicData.minCost')"
-                            :rules="[(val) => val > 0]"
-                            lazy-rules
-                        />
-                    </div>
-                    <div class="col">
-                        <q-input
-                            filled
-                            v-model="deliveryMan.minM3"
-                            :label="t('route.deliveryMan.basicData.minM3')"
-                            :rules="[(val) => val > 0]"
-                            lazy-rules
-                        />
-                    </div>
-                </div>
-                <div class="row q-gutter-md q-mb-md">
-                    <div class="col">
-                        <q-select
-                            v-model="deliveryMan.supplierFk"
-                            :options="suppliers"
-                            option-value="id"
-                            option-label="name"
-                            emit-value
-                            :label="t('route.deliveryMan.basicData.supplier')"
-                            map-options
-                            use-input
-                            :input-debounce="0"
-                        >
-                        </q-select>
-                    </div>
-                    <div class="col">
-                        <q-select
-                            v-model="deliveryMan.agencyModeFk"
-                            :options="agencyModes"
-                            option-value="id"
-                            option-label="name"
-                            emit-value
-                            :label="t('route.deliveryMan.basicData.agency')"
-                            map-options
-                            use-input
-                            :input-debounce="0"
-                        >
-                        </q-select>
-                    </div>
-                </div>
-                <div class="row q-gutter-md q-mb-md">
-                    <div class="col">
-                        <q-btn label="Submit" type="submit" color="primary" />
-                        <q-btn label="Reset" type="reset" color="primary" flat class="q-ml-sm" />
-                    </div>
-                </div>
-            </q-form>
-        </q-card>
-    </div>
-</template>
-
-<style lang="scss" scoped>
-.q-card {
-    width: 800px;
-}
-
-.container {
-    display: flex;
-    justify-content: center;
-}
-</style>
diff --git a/src/pages/Route/Roadmap/RoadmapBasicData.vue b/src/pages/Route/Roadmap/RoadmapBasicData.vue
index a6c2f7d4d..19b6a1b3d 100644
--- a/src/pages/Route/Roadmap/RoadmapBasicData.vue
+++ b/src/pages/Route/Roadmap/RoadmapBasicData.vue
@@ -3,7 +3,6 @@ import { useI18n } from 'vue-i18n';
 import { useRoute, useRouter } from 'vue-router';
 import VnRow from 'components/ui/VnRow.vue';
 import FormModel from 'components/FormModel.vue';
-import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
 import VnInputDate from 'components/common/VnInputDate.vue';
 import VnInput from 'components/common/VnInput.vue';
 import VnInputTime from 'components/common/VnInputTime.vue';
@@ -22,7 +21,6 @@ const onSave = (data, response) => {
 };
 </script>
 <template>
-    <VnSubToolbar />
     <FetchData
         url="Suppliers"
         auto-load
diff --git a/src/pages/Route/Roadmap/RoadmapStops.vue b/src/pages/Route/Roadmap/RoadmapStops.vue
index 9e6ac82f4..8ff044d2d 100644
--- a/src/pages/Route/Roadmap/RoadmapStops.vue
+++ b/src/pages/Route/Roadmap/RoadmapStops.vue
@@ -1,7 +1,6 @@
 <script setup>
 import { useI18n } from 'vue-i18n';
 import { useRoute } from 'vue-router';
-import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
 import FetchData from 'components/FetchData.vue';
 import { ref } from 'vue';
 import CrudModel from 'components/CrudModel.vue';
@@ -23,7 +22,6 @@ const updateDefaultStop = (data) => {
 };
 </script>
 <template>
-    <VnSubToolbar />
     <FetchData
         :url="`Roadmaps/${route.params?.id}`"
         auto-load