forked from verdnatura/salix-front
Zone create
This commit is contained in:
parent
fcb6f8dd49
commit
d227d4b09b
|
@ -1238,6 +1238,8 @@ zone:
|
||||||
pageTitles:
|
pageTitles:
|
||||||
zones: Zone
|
zones: Zone
|
||||||
zonesList: Zones
|
zonesList: Zones
|
||||||
|
zoneCreate: New zone
|
||||||
|
locations: Locations
|
||||||
deliveryList: Delivery days
|
deliveryList: Delivery days
|
||||||
upcomingList: Upcoming deliveries
|
upcomingList: Upcoming deliveries
|
||||||
components:
|
components:
|
||||||
|
|
|
@ -1237,6 +1237,8 @@ zone:
|
||||||
pageTitles:
|
pageTitles:
|
||||||
zones: Zona
|
zones: Zona
|
||||||
zonesList: Zonas
|
zonesList: Zonas
|
||||||
|
zoneCreate: Nueva zona
|
||||||
|
locations: Localizaciones
|
||||||
deliveryList: Días de entrega
|
deliveryList: Días de entrega
|
||||||
upcomingList: Próximos repartos
|
upcomingList: Próximos repartos
|
||||||
components:
|
components:
|
||||||
|
|
|
@ -50,10 +50,10 @@ const filter = computed(() => {
|
||||||
/>
|
/>
|
||||||
<VnLv :label="t('zone.card.name')" :value="zone.user?.nickname" />
|
<VnLv :label="t('zone.card.name')" :value="zone.user?.nickname" />
|
||||||
<VnLv
|
<VnLv
|
||||||
:label="t('zone.list.department')"
|
:label="t('list.department')"
|
||||||
:value="zone.department?.department?.name"
|
:value="zone.department?.department?.name"
|
||||||
/>
|
/>
|
||||||
<VnLv :label="t('zone.list.email')" :value="zone.user.email" copy />
|
<VnLv :label="t('list.email')" :value="zone.user.email" copy />
|
||||||
<VnLv :label="t('zone.summary.boss')" link>
|
<VnLv :label="t('zone.summary.boss')" link>
|
||||||
<template #value>
|
<template #value>
|
||||||
<VnUserLink
|
<VnUserLink
|
||||||
|
|
|
@ -63,7 +63,7 @@ async function remove(row) {
|
||||||
outline
|
outline
|
||||||
/>
|
/>
|
||||||
<QBtn
|
<QBtn
|
||||||
:label="t('zone.list.remove')"
|
:label="t('list.remove')"
|
||||||
@click.stop="remove(row)"
|
@click.stop="remove(row)"
|
||||||
color="primary"
|
color="primary"
|
||||||
style="margin-top: 15px"
|
style="margin-top: 15px"
|
||||||
|
|
|
@ -63,7 +63,7 @@ async function remove(row) {
|
||||||
outline
|
outline
|
||||||
/>
|
/>
|
||||||
<QBtn
|
<QBtn
|
||||||
:label="t('zone.list.remove')"
|
:label="t('list.remove')"
|
||||||
@click.stop="remove(row)"
|
@click.stop="remove(row)"
|
||||||
color="primary"
|
color="primary"
|
||||||
style="margin-top: 15px"
|
style="margin-top: 15px"
|
||||||
|
|
|
@ -1,184 +1,113 @@
|
||||||
<script setup>
|
<script setup>
|
||||||
import { computed, onMounted, onUpdated, ref } from 'vue';
|
import { reactive, ref } from 'vue';
|
||||||
import { useI18n } from 'vue-i18n';
|
import { useI18n } from 'vue-i18n';
|
||||||
import { QIcon, QInput, QItem, QItemSection, QSelect } from 'quasar';
|
import { useRouter } from 'vue-router';
|
||||||
|
|
||||||
|
import FormModel from 'components/FormModel.vue';
|
||||||
|
import VnRow from 'components/ui/VnRow.vue';
|
||||||
|
import VnSelect from 'src/components/common/VnSelect.vue';
|
||||||
|
import FetchData from 'components/FetchData.vue';
|
||||||
import VnInput from 'src/components/common/VnInput.vue';
|
import VnInput from 'src/components/common/VnInput.vue';
|
||||||
|
import VnInputTime from 'components/common/VnInputTime.vue';
|
||||||
import { useRoute, useRouter } from 'vue-router';
|
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
||||||
import axios from 'axios';
|
|
||||||
|
|
||||||
onMounted(() => fetch());
|
|
||||||
onUpdated(() => fetch());
|
|
||||||
|
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
const route = useRoute();
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const $props = defineProps({
|
|
||||||
id: {
|
const newZoneForm = reactive({
|
||||||
type: Number,
|
travelingDays: 0,
|
||||||
required: false,
|
price: 0.2,
|
||||||
default: null,
|
bonus: 0.2,
|
||||||
},
|
hour: Date.vnNew(),
|
||||||
});
|
});
|
||||||
const entityId = computed(() => $props.id || route.params.id);
|
const warehousesOptions = ref([]);
|
||||||
|
const agencyOptions = ref([]);
|
||||||
|
|
||||||
let zoneTypes = [];
|
const redirectToZoneLocations = (_, { id }) => {
|
||||||
let originalData = {};
|
router.push({ name: 'ZoneLocations', params: { id } });
|
||||||
const zone = ref({});
|
};
|
||||||
const filteredZoneTypes = ref(zoneTypes);
|
|
||||||
|
|
||||||
async function onSubmit() {
|
|
||||||
try {
|
|
||||||
const params = {
|
|
||||||
id: entityId.value,
|
|
||||||
label: zone.value.label,
|
|
||||||
plate: zone.value.plate,
|
|
||||||
volume: zone.value.volume,
|
|
||||||
typeFk: zone.value.typeFk,
|
|
||||||
};
|
|
||||||
await axios.patch('Zones', params).then((res) => {
|
|
||||||
if (res.status == 200) router.push({ path: `/zone/list` });
|
|
||||||
});
|
|
||||||
} catch (error) {
|
|
||||||
//
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
async function onReset() {
|
|
||||||
if (entityId.value) {
|
|
||||||
zone.value = { ...originalData };
|
|
||||||
} else {
|
|
||||||
zone.value = {};
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
async function fetch() {
|
|
||||||
try {
|
|
||||||
await axios.get('ZoneTypes').then(async (res) => {
|
|
||||||
if (res.data) {
|
|
||||||
filteredZoneTypes.value = zoneTypes = res.data;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
if (entityId.value) {
|
|
||||||
await axios.get(`Zones/${entityId.value}`).then(async (res) => {
|
|
||||||
const data = res.data;
|
|
||||||
if (data) {
|
|
||||||
zone.value.label = data.label;
|
|
||||||
zone.value.plate = data.plate;
|
|
||||||
zone.value.volume = data.volume;
|
|
||||||
zone.value.typeFk = data.typeFk;
|
|
||||||
originalData = { ...zone.value };
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
} catch (e) {
|
|
||||||
//
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function filterType(val, update) {
|
|
||||||
update(() => {
|
|
||||||
const needle = val.toLowerCase();
|
|
||||||
filteredZoneTypes.value = zoneTypes.filter(
|
|
||||||
(v) => v.name.toLowerCase().indexOf(needle) > -1
|
|
||||||
);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<QPage class="q-pa-sm q-mx-xl">
|
<FetchData
|
||||||
<QForm @submit="onSubmit()" @reset="onReset()" class="q-pa-sm">
|
url="Warehouses"
|
||||||
<QCard class="q-pa-md">
|
:filter="{ order: ['name'] }"
|
||||||
<div class="row q-col-gutter-md">
|
@on-fetch="(data) => (warehousesOptions = data)"
|
||||||
<div class="col">
|
auto-load
|
||||||
<QInput
|
/>
|
||||||
filled
|
<FetchData
|
||||||
v-model="zone.label"
|
url="AgencyModes/isActive"
|
||||||
:label="t('zone.create.name')"
|
:filter="{ order: ['name'] }"
|
||||||
type="number"
|
@on-fetch="(data) => (agencyOptions = data)"
|
||||||
min="0"
|
auto-load
|
||||||
:rules="[(val) => !!val || t('zone.warnings.labelNotEmpty')]"
|
/>
|
||||||
/>
|
<QPage>
|
||||||
</div>
|
<VnSubToolbar />
|
||||||
<div class="col">
|
<FormModel
|
||||||
<VnInput
|
url-create="Zones"
|
||||||
filled
|
model="Zones"
|
||||||
v-model="zone.plate"
|
:form-initial-data="newZoneForm"
|
||||||
:label="t('zone.create.agency')"
|
@on-data-saved="redirectToZoneLocations"
|
||||||
:rules="[(val) => !!val || t('zone.warnings.plateNotEmpty')]"
|
>
|
||||||
/>
|
<template #form="{ data }">
|
||||||
</div>
|
<VnRow class="row q-gutter-md q-mb-md">
|
||||||
</div>
|
<VnInput
|
||||||
<div class="row q-col-gutter-md">
|
v-model="data.name"
|
||||||
<div class="col">
|
:label="t('create.name')"
|
||||||
<QInput
|
:required="true"
|
||||||
filled
|
/>
|
||||||
v-model="zone.volume"
|
</VnRow>
|
||||||
:label="t('zone.create.close')"
|
<VnRow class="row q-gutter-md q-mb-md">
|
||||||
type="number"
|
<VnSelect
|
||||||
min="0"
|
:label="t('create.warehouse')"
|
||||||
:rules="[(val) => !!val || t('zone.warnings.volumeNotEmpty')]"
|
:options="warehousesOptions"
|
||||||
/>
|
hide-selected
|
||||||
</div>
|
option-label="name"
|
||||||
<div class="col">
|
option-value="id"
|
||||||
<QSelect
|
v-model="data.warehouseFk"
|
||||||
filled
|
/>
|
||||||
v-model="zone.typeFk"
|
<VnSelect
|
||||||
use-input
|
:label="t('create.agency')"
|
||||||
fill-input
|
:options="agencyOptions"
|
||||||
hide-selected
|
hide-selected
|
||||||
input-debounce="0"
|
option-label="name"
|
||||||
option-label="name"
|
option-value="id"
|
||||||
option-value="id"
|
v-model="data.agencyModeFk"
|
||||||
emit-value
|
:required="true"
|
||||||
map-options
|
/>
|
||||||
:label="t('zone.create.price')"
|
</VnRow>
|
||||||
:options="filteredZoneTypes"
|
<VnRow class="row q-gutter-md q-mb-md">
|
||||||
:rules="[(val) => !!val || t('zone.warnings.typeNotEmpty')]"
|
<VnInput
|
||||||
@filter="filterType"
|
v-model="data.travelingDays"
|
||||||
>
|
:label="t('create.travelingDays')"
|
||||||
<template v-if="zone.typeFk" #append>
|
type="number"
|
||||||
<QIcon
|
min="0"
|
||||||
name="cancel"
|
/>
|
||||||
@click.stop.prevent="zone.typeFk = null"
|
|
||||||
class="cursor-pointer"
|
<VnInputTime v-model="data.hour" :label="t('create.closingHour')" />
|
||||||
/>
|
</VnRow>
|
||||||
</template>
|
<VnRow class="row q-gutter-md q-mb-md">
|
||||||
<template #no-option>
|
<VnInput
|
||||||
<QItem>
|
v-model="data.price"
|
||||||
<QItemSection class="text-grey">
|
:label="t('create.price')"
|
||||||
{{ t('zone.warnings.noData') }}
|
type="number"
|
||||||
</QItemSection>
|
min="0"
|
||||||
</QItem>
|
/>
|
||||||
</template>
|
<VnInput
|
||||||
</QSelect>
|
v-model="data.bonus"
|
||||||
</div>
|
:label="t('create.bonus')"
|
||||||
</div>
|
type="number"
|
||||||
</QCard>
|
min="0"
|
||||||
<div class="q-mt-md">
|
/>
|
||||||
<QBtn :label="t('zone.type.submit')" type="submit" color="primary" />
|
</VnRow>
|
||||||
<QBtn
|
<VnRow class="row q-gutter-md q-mb-md">
|
||||||
:label="t('zone.type.reset')"
|
<QCheckbox
|
||||||
type="reset"
|
:label="t('create.volumetric')"
|
||||||
color="primary"
|
v-model="data.isVolumetric"
|
||||||
flat
|
:toggle-indeterminate="false"
|
||||||
class="q-ml-sm"
|
/>
|
||||||
/>
|
</VnRow>
|
||||||
</div>
|
</template>
|
||||||
</QForm>
|
</FormModel>
|
||||||
</QPage>
|
</QPage>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.q-page {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: flex-start;
|
|
||||||
}
|
|
||||||
|
|
||||||
.q-form {
|
|
||||||
width: 70%;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
|
@ -30,7 +30,7 @@ async function remove(row) {
|
||||||
try {
|
try {
|
||||||
await axios.delete(`Zones/${row.id}`).then(async () => {
|
await axios.delete(`Zones/${row.id}`).then(async () => {
|
||||||
quasar.notify({
|
quasar.notify({
|
||||||
message: t('zone.list.removeItem'),
|
message: t('list.removeItem'),
|
||||||
type: 'positive',
|
type: 'positive',
|
||||||
});
|
});
|
||||||
store.data.splice(store.data.indexOf(row), 1);
|
store.data.splice(store.data.indexOf(row), 1);
|
||||||
|
@ -61,23 +61,23 @@ async function remove(row) {
|
||||||
>
|
>
|
||||||
<template #list-items>
|
<template #list-items>
|
||||||
<VnLv
|
<VnLv
|
||||||
:label="t('zone.list.id')"
|
:label="t('list.id')"
|
||||||
:title-label="t('zone.list.id')"
|
:title-label="t('list.id')"
|
||||||
:value="row.id"
|
:value="row.id"
|
||||||
/>
|
/>
|
||||||
<VnLv :label="t('zone.list.name')" :value="row?.name" />
|
<VnLv :label="t('list.name')" :value="row?.name" />
|
||||||
<VnLv
|
<VnLv
|
||||||
:label="t('zone.list.agency')"
|
:label="t('list.agency')"
|
||||||
:options="agencyOptions"
|
:options="agencyOptions"
|
||||||
option-value="id"
|
option-value="id"
|
||||||
option-label="name"
|
option-label="name"
|
||||||
:value="row?.agencyFk"
|
:value="row?.agencyFk"
|
||||||
/>
|
/>
|
||||||
<VnLv
|
<VnLv
|
||||||
:label="t('zone.list.close')"
|
:label="t('list.close')"
|
||||||
:value="toTimeFormat(row?.hour)"
|
:value="toTimeFormat(row?.hour)"
|
||||||
/>
|
/>
|
||||||
<VnLv :label="t('zone.list.price')" :value="row?.price" />
|
<VnLv :label="t('list.price')" :value="row?.price" />
|
||||||
</template>
|
</template>
|
||||||
<template #actions>
|
<template #actions>
|
||||||
<QBtn
|
<QBtn
|
||||||
|
@ -86,14 +86,14 @@ async function remove(row) {
|
||||||
outline
|
outline
|
||||||
/>
|
/>
|
||||||
<QBtn
|
<QBtn
|
||||||
:label="t('zone.list.openSummary')"
|
:label="t('list.openSummary')"
|
||||||
@click.stop="viewSummary(row.id, ZoneSummary)"
|
@click.stop="viewSummary(row.id, ZoneSummary)"
|
||||||
color="primary"
|
color="primary"
|
||||||
style="margin-top: 15px"
|
style="margin-top: 15px"
|
||||||
/>
|
/>
|
||||||
<!--AQUI PONER BOTÓN CLONAR-->
|
<!--AQUI PONER BOTÓN CLONAR-->
|
||||||
<QBtn
|
<QBtn
|
||||||
:label="t('zone.list.clone')"
|
:label="t('list.clone')"
|
||||||
@click.stop="remove(row)"
|
@click.stop="remove(row)"
|
||||||
color="primary"
|
color="primary"
|
||||||
style="margin-top: 15px"
|
style="margin-top: 15px"
|
||||||
|
@ -105,7 +105,7 @@ async function remove(row) {
|
||||||
</div>
|
</div>
|
||||||
<QPageSticky position="bottom-right" :offset="[18, 18]">
|
<QPageSticky position="bottom-right" :offset="[18, 18]">
|
||||||
<QBtn @click="create" fab icon="add" color="primary">
|
<QBtn @click="create" fab icon="add" color="primary">
|
||||||
<QTooltip>{{ t('zone.list.create') }}</QTooltip>
|
<QTooltip>{{ t('list.create') }}</QTooltip>
|
||||||
</QBtn>
|
</QBtn>
|
||||||
</QPageSticky>
|
</QPageSticky>
|
||||||
</QPage>
|
</QPage>
|
||||||
|
|
|
@ -1,19 +1,22 @@
|
||||||
zone:
|
list:
|
||||||
list:
|
volume: Volume
|
||||||
volume: Volume
|
clone: Clone
|
||||||
clone: Clone
|
id: Id
|
||||||
id: Id
|
name: Name
|
||||||
name: Name
|
agency: Agency
|
||||||
agency: Agency
|
close: Close
|
||||||
close: Close
|
price: Price
|
||||||
price: Price
|
create: Create zone
|
||||||
create: Create zone
|
openSummary: Details
|
||||||
openSummary: Details
|
create:
|
||||||
create:
|
name: Name
|
||||||
name: Name
|
warehouse: Warehouse
|
||||||
agency: Agency
|
agency: Agency
|
||||||
close: Close
|
travelingDays: Traveling days
|
||||||
price: Price
|
closingHour: Closing hour
|
||||||
type:
|
price: Price
|
||||||
submit: Save
|
bonus: Bonus
|
||||||
reset: Reset
|
volumetric: Volumetric
|
||||||
|
type:
|
||||||
|
submit: Save
|
||||||
|
reset: Reset
|
||||||
|
|
|
@ -1,19 +1,22 @@
|
||||||
zone:
|
list:
|
||||||
list:
|
volume: Volumen
|
||||||
volume: Volumen
|
clone: Clonar
|
||||||
clone: Clonar
|
id: Id
|
||||||
id: Id
|
name: Nombre
|
||||||
name: Nombre
|
agency: Agencia
|
||||||
agency: Agencia
|
close: Cierre
|
||||||
close: Cierre
|
price: Precio
|
||||||
price: Precio
|
create: Crear zona
|
||||||
create: Crear zona
|
openSummary: Detalles
|
||||||
openSummary: Detalles
|
create:
|
||||||
create:
|
name: Nombre
|
||||||
name: Nombre
|
warehouse: Almacén
|
||||||
agency: Agencia
|
agency: Agencia
|
||||||
close: Cierre
|
travelingDays: Días de viaje
|
||||||
price: Precio
|
closingHour: Hora de cierre
|
||||||
type:
|
price: Precio
|
||||||
submit: Guardar
|
bonus: Bonificación
|
||||||
reset: Reiniciar
|
volumetric: Volumétrico
|
||||||
|
type:
|
||||||
|
submit: Guardar
|
||||||
|
reset: Reiniciar
|
||||||
|
|
|
@ -11,58 +11,54 @@ export default {
|
||||||
component: RouterView,
|
component: RouterView,
|
||||||
redirect: { name: 'ZoneMain' },
|
redirect: { name: 'ZoneMain' },
|
||||||
menus: {
|
menus: {
|
||||||
main: [
|
main: ['ZoneList', 'ZoneDeliveryList', 'ZoneUpcomingList'],
|
||||||
/*'ZoneList', 'ZoneDeliveryList', 'ZoneUpcomingList'*/
|
card: ['ZoneLocations'],
|
||||||
],
|
|
||||||
card: [
|
|
||||||
//
|
|
||||||
],
|
|
||||||
},
|
},
|
||||||
children: [
|
children: [
|
||||||
// {
|
{
|
||||||
// path: '/zone',
|
path: '/zone',
|
||||||
// name: 'ZoneMain',
|
name: 'ZoneMain',
|
||||||
// component: () => import('src/pages/Zone/ZoneMain.vue'),
|
component: () => import('src/pages/Zone/ZoneMain.vue'),
|
||||||
// redirect: { name: 'ZoneList' },
|
redirect: { name: 'ZoneList' },
|
||||||
// children: [
|
children: [
|
||||||
// {
|
{
|
||||||
// path: 'list',
|
path: 'list',
|
||||||
// name: 'ZoneList',
|
name: 'ZoneList',
|
||||||
// meta: {
|
meta: {
|
||||||
// title: 'zonesList',
|
title: 'zonesList',
|
||||||
// icon: 'vn:zone',
|
icon: 'vn:zone',
|
||||||
// },
|
},
|
||||||
// component: () => import('src/pages/Zone/ZoneList.vue'),
|
component: () => import('src/pages/Zone/ZoneList.vue'),
|
||||||
// },
|
},
|
||||||
// {
|
{
|
||||||
// path: 'create',
|
path: 'create',
|
||||||
// name: 'ZoneCreate',
|
name: 'ZoneCreate',
|
||||||
// meta: {
|
meta: {
|
||||||
// title: 'zoneCreate',
|
title: 'zoneCreate',
|
||||||
// icon: 'create',
|
icon: 'create',
|
||||||
// },
|
},
|
||||||
// component: () => import('src/pages/Zone/ZoneCreate.vue'),
|
component: () => import('src/pages/Zone/ZoneCreate.vue'),
|
||||||
// },
|
},
|
||||||
// {
|
{
|
||||||
// path: ':id/edit',
|
path: ':id/edit',
|
||||||
// name: 'ZoneEdit',
|
name: 'ZoneEdit',
|
||||||
// meta: {
|
meta: {
|
||||||
// title: 'zoneEdit',
|
title: 'zoneEdit',
|
||||||
// icon: 'edit',
|
icon: 'edit',
|
||||||
// },
|
},
|
||||||
// component: () => import('src/pages/Zone/ZoneCreate.vue'),
|
component: () => import('src/pages/Zone/ZoneCreate.vue'),
|
||||||
// },
|
},
|
||||||
// {
|
{
|
||||||
// path: 'counter',
|
path: 'counter',
|
||||||
// name: 'ZoneCounter',
|
name: 'ZoneCounter',
|
||||||
// meta: {
|
meta: {
|
||||||
// title: 'zoneCounter',
|
title: 'zoneCounter',
|
||||||
// icon: 'add_circle',
|
icon: 'add_circle',
|
||||||
// },
|
},
|
||||||
// component: () => import('src/pages/Zone/ZoneCounter.vue'),
|
component: () => import('src/pages/Zone/ZoneCounter.vue'),
|
||||||
// },
|
},
|
||||||
// ],
|
],
|
||||||
// },
|
},
|
||||||
{
|
{
|
||||||
name: 'ZoneCard',
|
name: 'ZoneCard',
|
||||||
path: ':id',
|
path: ':id',
|
||||||
|
@ -78,6 +74,16 @@ export default {
|
||||||
},
|
},
|
||||||
component: () => import('src/pages/Zone/Card/ZoneSummary.vue'),
|
component: () => import('src/pages/Zone/Card/ZoneSummary.vue'),
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
name: 'ZoneLocations',
|
||||||
|
path: 'location',
|
||||||
|
meta: {
|
||||||
|
title: 'locations',
|
||||||
|
icon: 'vn:greuge',
|
||||||
|
},
|
||||||
|
component: () => import('src/pages/Zone/Card/ZoneLocations.vue'),
|
||||||
|
},
|
||||||
|
|
||||||
// {
|
// {
|
||||||
// path: '/zone/delivery',
|
// path: '/zone/delivery',
|
||||||
// name: 'ZoneDeliveryMain',
|
// name: 'ZoneDeliveryMain',
|
||||||
|
|
Loading…
Reference in New Issue