forked from verdnatura/salix-front
Zone warehouses
This commit is contained in:
parent
475f0eda48
commit
e196cf8fd5
|
@ -1,8 +1,34 @@
|
||||||
<script setup>
|
<script setup>
|
||||||
|
import { useI18n } from 'vue-i18n';
|
||||||
|
import { useRoute } from 'vue-router';
|
||||||
|
import { computed } from 'vue';
|
||||||
|
|
||||||
import VnCard from 'components/common/VnCard.vue';
|
import VnCard from 'components/common/VnCard.vue';
|
||||||
import ZoneDescriptor from './ZoneDescriptor.vue';
|
import ZoneDescriptor from './ZoneDescriptor.vue';
|
||||||
|
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
|
||||||
|
|
||||||
|
import { useStateStore } from 'stores/useStateStore';
|
||||||
|
|
||||||
|
const { t } = useI18n();
|
||||||
|
const stateStore = useStateStore();
|
||||||
|
const route = useRoute();
|
||||||
|
|
||||||
|
const routeName = computed(() => route.name);
|
||||||
|
const searchBarDataKeys = {
|
||||||
|
ZoneWarehouses: 'ZoneWarehouses',
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
|
<template v-if="stateStore.isHeaderMounted()">
|
||||||
|
<Teleport to="#searchbar">
|
||||||
|
<VnSearchbar
|
||||||
|
:data-key="searchBarDataKeys[routeName]"
|
||||||
|
:custom-route-redirect-name="routeName"
|
||||||
|
:label="t('list.searchZone')"
|
||||||
|
:info="t('list.searchInfo')"
|
||||||
|
/>
|
||||||
|
</Teleport>
|
||||||
|
</template>
|
||||||
<VnCard
|
<VnCard
|
||||||
data-key="Zone"
|
data-key="Zone"
|
||||||
base-url="Zones"
|
base-url="Zones"
|
||||||
|
|
|
@ -0,0 +1,63 @@
|
||||||
|
<script setup>
|
||||||
|
import { reactive, ref } from 'vue';
|
||||||
|
import { useI18n } from 'vue-i18n';
|
||||||
|
import { useRoute } from 'vue-router';
|
||||||
|
|
||||||
|
import VnSelect from 'src/components/common/VnSelect.vue';
|
||||||
|
import FetchData from 'components/FetchData.vue';
|
||||||
|
import VnRow from 'components/ui/VnRow.vue';
|
||||||
|
import FormPopup from 'components/FormPopup.vue';
|
||||||
|
|
||||||
|
import axios from 'axios';
|
||||||
|
|
||||||
|
const emit = defineEmits(['onSubmit']);
|
||||||
|
const { t } = useI18n();
|
||||||
|
const route = useRoute();
|
||||||
|
|
||||||
|
const ZoneWarehouseFormData = reactive({
|
||||||
|
warehouseFk: null,
|
||||||
|
});
|
||||||
|
const closeButton = ref(null);
|
||||||
|
|
||||||
|
const warehousesOptions = ref([]);
|
||||||
|
|
||||||
|
const createZoneWarehouse = () => {
|
||||||
|
try {
|
||||||
|
axios.post(`Zones/${route.params.id}/warehouses`, ZoneWarehouseFormData);
|
||||||
|
emit('onSubmit');
|
||||||
|
} catch (error) {
|
||||||
|
console.error(error);
|
||||||
|
}
|
||||||
|
closeForm();
|
||||||
|
};
|
||||||
|
|
||||||
|
const closeForm = () => {
|
||||||
|
if (closeButton.value) closeButton.value.click();
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<FetchData
|
||||||
|
url="Warehouses"
|
||||||
|
:filter="{ order: 'name' }"
|
||||||
|
auto-load
|
||||||
|
@on-fetch="(data) => (warehousesOptions = data)"
|
||||||
|
/>
|
||||||
|
<FormPopup model="ZoneWarehouse" @on-submit="createZoneWarehouse()">
|
||||||
|
<template #form-inputs>
|
||||||
|
<VnRow class="row q-gutter-md q-mb-md">
|
||||||
|
<div class="col">
|
||||||
|
<VnSelect
|
||||||
|
:label="t('warehouses.warehouse')"
|
||||||
|
v-model="ZoneWarehouseFormData.warehouseFk"
|
||||||
|
:options="warehousesOptions"
|
||||||
|
option-value="id"
|
||||||
|
option-label="name"
|
||||||
|
hide-selected
|
||||||
|
:required="true"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</VnRow>
|
||||||
|
</template>
|
||||||
|
</FormPopup>
|
||||||
|
</template>
|
|
@ -1,53 +1,113 @@
|
||||||
<script setup>
|
<script setup>
|
||||||
import { useRoute } from 'vue-router';
|
import { useRoute } from 'vue-router';
|
||||||
|
import { computed, ref, watch } from 'vue';
|
||||||
|
import { useI18n } from 'vue-i18n';
|
||||||
|
|
||||||
import VnPaginate from 'components/ui/VnPaginate.vue';
|
import VnPaginate from 'components/ui/VnPaginate.vue';
|
||||||
import CardList from 'components/CardList.vue';
|
import ZoneCreateWarehouse from './ZoneCreateWarehouse.vue';
|
||||||
import VnLv from 'components/ui/VnLv.vue';
|
|
||||||
|
|
||||||
|
import { useVnConfirm } from 'composables/useVnConfirm';
|
||||||
|
import { useArrayData } from 'composables/useArrayData';
|
||||||
|
import axios from 'axios';
|
||||||
|
|
||||||
|
const { t } = useI18n();
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
|
const { openConfirmationModal } = useVnConfirm();
|
||||||
|
|
||||||
const deleteWarehouse = () => {
|
const paginateRef = ref(null);
|
||||||
return true;
|
const createWarehouseDialogRef = ref(null);
|
||||||
|
|
||||||
|
const arrayData = useArrayData('ZoneWarehouses', {
|
||||||
|
url: `Zones/${route.params.id}/warehouses`,
|
||||||
|
filter: { include: 'warehouse' },
|
||||||
|
});
|
||||||
|
const store = arrayData.store;
|
||||||
|
|
||||||
|
const urlPath = computed(() => `Zones/${route.params.id}/warehouses`);
|
||||||
|
|
||||||
|
const columns = computed(() => [
|
||||||
|
{
|
||||||
|
name: 'name',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'action',
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
|
||||||
|
const deleteWarehouse = async (row, rows, rowIndex) => {
|
||||||
|
try {
|
||||||
|
await axios.delete(`${urlPath.value}/${row.id}`);
|
||||||
|
if (rowIndex || rowIndex === 0) rows.splice(rowIndex, 1);
|
||||||
|
} catch (error) {
|
||||||
|
console.error(error);
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const openCreateWarehouseForm = () => {
|
||||||
|
createWarehouseDialogRef.value.show();
|
||||||
|
};
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => route.params.id,
|
||||||
|
() => {
|
||||||
|
store.url = urlPath.value;
|
||||||
|
store.filter.include = 'warehouse';
|
||||||
|
fetchWarehouses();
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
const fetchWarehouses = async () => await paginateRef.value.fetch();
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<QPage class="column items-center q-pa-md">
|
<QPage class="column items-center q-pa-md">
|
||||||
<div class="vn-card-list">
|
<div class="full-width" style="max-width: 400px">
|
||||||
<VnPaginate
|
<VnPaginate
|
||||||
|
ref="paginateRef"
|
||||||
data-key="ZoneWarehouses"
|
data-key="ZoneWarehouses"
|
||||||
:url="`Zones/${route.params.id}/warehouses`"
|
:filter="{ include: 'warehouse' }"
|
||||||
|
:url="urlPath"
|
||||||
auto-load
|
auto-load
|
||||||
>
|
>
|
||||||
<template #body="{ rows }">
|
<template #body="{ rows }">
|
||||||
<CardList
|
<QTable :rows="rows" :columns="columns" hide-header>
|
||||||
v-for="row of rows"
|
<template #body="{ row, rowIndex }">
|
||||||
:key="row.id"
|
<QTr>
|
||||||
:title="row.name"
|
<QTd>
|
||||||
:id="row.id"
|
<span>{{ row.warehouse?.name }}</span>
|
||||||
>
|
</QTd>
|
||||||
<template #list-items>
|
<QTd style="width: 50px !important">
|
||||||
<VnLv :value="row.name" />
|
|
||||||
<QIcon
|
<QIcon
|
||||||
name="delete"
|
name="delete"
|
||||||
size="sm"
|
size="sm"
|
||||||
class="cursor-pointer"
|
class="cursor-pointer"
|
||||||
color="primary"
|
color="primary"
|
||||||
@click="deleteWarehouse()"
|
@click="
|
||||||
|
openConfirmationModal(
|
||||||
|
t('warehouses.deleteTitle'),
|
||||||
|
t('warehouses.deleteSubtitle'),
|
||||||
|
() => deleteWarehouse(row, rows, rowIndex)
|
||||||
|
)
|
||||||
|
"
|
||||||
>
|
>
|
||||||
<QTooltip>
|
<QTooltip>
|
||||||
{{ t('Remove row') }}
|
{{ t('warehouses.delete') }}
|
||||||
</QTooltip>
|
</QTooltip>
|
||||||
</QIcon>
|
</QIcon>
|
||||||
|
</QTd>
|
||||||
|
</QTr>
|
||||||
</template>
|
</template>
|
||||||
</CardList>
|
</QTable>
|
||||||
</template>
|
</template>
|
||||||
</VnPaginate>
|
</VnPaginate>
|
||||||
</div>
|
</div>
|
||||||
|
<QPageSticky position="bottom-right" :offset="[18, 18]">
|
||||||
|
<QBtn fab icon="add" color="primary" @click="openCreateWarehouseForm()">
|
||||||
|
<QTooltip>{{ t('warehouses.add') }}</QTooltip>
|
||||||
|
<QDialog ref="createWarehouseDialogRef">
|
||||||
|
<ZoneCreateWarehouse @on-submit="fetchWarehouses()" />
|
||||||
|
</QDialog>
|
||||||
|
</QBtn>
|
||||||
|
</QPageSticky>
|
||||||
</QPage>
|
</QPage>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<i18n>
|
|
||||||
es:
|
|
||||||
Remove row: Eliminar fila
|
|
||||||
</i18n>
|
|
||||||
|
|
|
@ -5,6 +5,7 @@ zone:
|
||||||
zoneCreate: Create zone
|
zoneCreate: Create zone
|
||||||
deliveryList: Delivery days
|
deliveryList: Delivery days
|
||||||
upcomingList: Upcoming deliveries
|
upcomingList: Upcoming deliveries
|
||||||
|
warehouses: Warehouses
|
||||||
list:
|
list:
|
||||||
clone: Clone
|
clone: Clone
|
||||||
id: Id
|
id: Id
|
||||||
|
@ -40,3 +41,9 @@ summary:
|
||||||
filterPanel:
|
filterPanel:
|
||||||
name: Name
|
name: Name
|
||||||
agencyModeFk: Agency
|
agencyModeFk: Agency
|
||||||
|
warehouses:
|
||||||
|
delete: Delete
|
||||||
|
deleteTitle: This item will be deleted
|
||||||
|
deleteSubtitle: Are you sure you want to continue?
|
||||||
|
warehouse: Warehouse
|
||||||
|
add: Add
|
||||||
|
|
|
@ -5,6 +5,7 @@ zone:
|
||||||
zoneCreate: Nueva zona
|
zoneCreate: Nueva zona
|
||||||
deliveryList: Días de entrega
|
deliveryList: Días de entrega
|
||||||
upcomingList: Próximos repartos
|
upcomingList: Próximos repartos
|
||||||
|
warehouses: Almacenes
|
||||||
list:
|
list:
|
||||||
clone: Clonar
|
clone: Clonar
|
||||||
id: Id
|
id: Id
|
||||||
|
@ -40,3 +41,9 @@ summary:
|
||||||
filterPanel:
|
filterPanel:
|
||||||
name: Nombre
|
name: Nombre
|
||||||
agencyModeFk: Agencia
|
agencyModeFk: Agencia
|
||||||
|
warehouses:
|
||||||
|
delete: Eliminar
|
||||||
|
deleteTitle: Este elemento será eliminado
|
||||||
|
deleteSubtitle: ¿Seguro que quieres continuar?
|
||||||
|
warehouse: Almacén
|
||||||
|
add: Añadir
|
||||||
|
|
|
@ -12,7 +12,7 @@ export default {
|
||||||
redirect: { name: 'ZoneMain' },
|
redirect: { name: 'ZoneMain' },
|
||||||
menus: {
|
menus: {
|
||||||
main: ['ZoneList', 'ZoneDeliveryList', 'ZoneUpcomingList'],
|
main: ['ZoneList', 'ZoneDeliveryList', 'ZoneUpcomingList'],
|
||||||
card: ['ZoneBasicData', 'ZoneHistory', 'ZoneLocations'],
|
card: ['ZoneBasicData', 'ZoneWarehouses', 'ZoneHistory', 'ZoneLocations'],
|
||||||
},
|
},
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
|
@ -48,15 +48,6 @@ export default {
|
||||||
},
|
},
|
||||||
component: () => import('src/pages/Zone/ZoneCreate.vue'),
|
component: () => import('src/pages/Zone/ZoneCreate.vue'),
|
||||||
},
|
},
|
||||||
// {
|
|
||||||
// path: 'counter',
|
|
||||||
// name: 'ZoneCounter',
|
|
||||||
// meta: {
|
|
||||||
// title: 'zoneCounter',
|
|
||||||
// icon: 'add_circle',
|
|
||||||
// },
|
|
||||||
// component: () => import('src/pages/Zone/ZoneCounter.vue'),
|
|
||||||
// },
|
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
@ -74,6 +65,15 @@ export default {
|
||||||
},
|
},
|
||||||
component: () => import('src/pages/Zone/Card/ZoneSummary.vue'),
|
component: () => import('src/pages/Zone/Card/ZoneSummary.vue'),
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
name: 'ZoneBasicData',
|
||||||
|
path: 'basic-data',
|
||||||
|
meta: {
|
||||||
|
title: 'basicData',
|
||||||
|
icon: 'vn:settings',
|
||||||
|
},
|
||||||
|
component: () => import('src/pages/Zone/Card/ZoneBasicData.vue'),
|
||||||
|
},
|
||||||
{
|
{
|
||||||
name: 'ZoneLocations',
|
name: 'ZoneLocations',
|
||||||
path: 'location',
|
path: 'location',
|
||||||
|
@ -84,13 +84,13 @@ export default {
|
||||||
component: () => import('src/pages/Zone/Card/ZoneLocations.vue'),
|
component: () => import('src/pages/Zone/Card/ZoneLocations.vue'),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: 'ZoneBasicData',
|
name: 'ZoneWarehouses',
|
||||||
path: 'basic-data',
|
path: 'warehouses',
|
||||||
meta: {
|
meta: {
|
||||||
title: 'basicData',
|
title: 'warehouses',
|
||||||
icon: 'vn:settings',
|
icon: 'home',
|
||||||
},
|
},
|
||||||
component: () => import('src/pages/Zone/Card/ZoneBasicData.vue'),
|
component: () => import('src/pages/Zone/Card/ZoneWarehouses.vue'),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: 'ZoneHistory',
|
name: 'ZoneHistory',
|
||||||
|
@ -101,83 +101,6 @@ export default {
|
||||||
},
|
},
|
||||||
component: () => import('src/pages/Zone/Card/ZoneLog.vue'),
|
component: () => import('src/pages/Zone/Card/ZoneLog.vue'),
|
||||||
},
|
},
|
||||||
|
|
||||||
// {
|
|
||||||
// path: '/zone/delivery',
|
|
||||||
// name: 'ZoneDeliveryMain',
|
|
||||||
// component: () => import('src/pages/Zone/ZoneMain.vue'),
|
|
||||||
// redirect: { name: 'ZoneDeliveryList' },
|
|
||||||
// children: [
|
|
||||||
// {
|
|
||||||
// path: 'list',
|
|
||||||
// name: 'ZoneDeliveryList',
|
|
||||||
// meta: {
|
|
||||||
// title: 'deliveryList',
|
|
||||||
// icon: 'today',
|
|
||||||
// },
|
|
||||||
// component: () =>
|
|
||||||
// import('src/pages/Zone/Delivery/ZoneDeliveryList.vue'),
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// path: 'create',
|
|
||||||
// name: 'ZoneDeliveryCreate',
|
|
||||||
// meta: {
|
|
||||||
// title: 'deliveryCreate',
|
|
||||||
// icon: 'create',
|
|
||||||
// },
|
|
||||||
// component: () =>
|
|
||||||
// import('src/pages/Zone/Delivery/ZoneDeliveryCreate.vue'),
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// path: ':id/edit',
|
|
||||||
// name: 'ZoneDeliveryEdit',
|
|
||||||
// meta: {
|
|
||||||
// title: 'deliveryEdit',
|
|
||||||
// icon: 'edit',
|
|
||||||
// },
|
|
||||||
// component: () =>
|
|
||||||
// import('src/pages/Zone/Delivery/ZoneDeliveryCreate.vue'),
|
|
||||||
// },
|
|
||||||
// ],
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// path: '/zone/upcoming',
|
|
||||||
// name: 'ZoneUpcomingMain',
|
|
||||||
// component: () => import('src/pages/Zone/ZoneMain.vue'),
|
|
||||||
// redirect: { name: 'ZoneUpcomingList' },
|
|
||||||
// children: [
|
|
||||||
// {
|
|
||||||
// path: 'list',
|
|
||||||
// name: 'ZoneUpcomingList',
|
|
||||||
// meta: {
|
|
||||||
// title: 'upcomingList',
|
|
||||||
// icon: 'today',
|
|
||||||
// },
|
|
||||||
// component: () =>
|
|
||||||
// import('src/pages/Zone/Upcoming/ZoneUpcomingList.vue'),
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// path: 'create',
|
|
||||||
// name: 'ZoneUpcomingCreate',
|
|
||||||
// meta: {
|
|
||||||
// title: 'upcomingCreate',
|
|
||||||
// icon: 'create',
|
|
||||||
// },
|
|
||||||
// component: () =>
|
|
||||||
// import('src/pages/Zone/Upcoming/ZoneUpcomingCreate.vue'),
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// path: ':id/edit',
|
|
||||||
// name: 'ZoneUpcomingEdit',
|
|
||||||
// meta: {
|
|
||||||
// title: 'upcomingEdit',
|
|
||||||
// icon: 'edit',
|
|
||||||
// },
|
|
||||||
// component: () =>
|
|
||||||
// import('src/pages/Zone/Upcoming/ZoneUpcomingCreate.vue'),
|
|
||||||
// },
|
|
||||||
// ],
|
|
||||||
// },
|
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
|
|
Loading…
Reference in New Issue