forked from verdnatura/salix-front
Merge pull request 'Zone create' (!371) from hyervoni/salix-front-mindshore:feature/ZoneCreate into dev
Reviewed-on: verdnatura/salix-front#371 Reviewed-by: Alex Moreno <alexm@verdnatura.es> Reviewed-by: Javier Segarra <jsegarra@verdnatura.es>
This commit is contained in:
commit
9b64a82a71
|
|
@ -1236,16 +1236,10 @@ item/itemType:
|
|||
itemType: Item type
|
||||
basicData: Basic data
|
||||
summary: Summary
|
||||
zone:
|
||||
pageTitles:
|
||||
zones: Zone
|
||||
zonesList: Zones
|
||||
deliveryList: Delivery days
|
||||
upcomingList: Upcoming deliveries
|
||||
monitor:
|
||||
pageTitles:
|
||||
monitors: Monitores
|
||||
list: Listado
|
||||
monitors: Monitors
|
||||
list: List
|
||||
components:
|
||||
topbar: {}
|
||||
itemsFilterPanel:
|
||||
|
|
|
|||
|
|
@ -60,7 +60,7 @@ const setData = (entity) => {
|
|||
flat
|
||||
dense
|
||||
size="md"
|
||||
icon="preview"
|
||||
icon="vn:zone"
|
||||
color="white"
|
||||
class="link"
|
||||
:to="{ name: 'ZoneList' }"
|
||||
|
|
|
|||
|
|
@ -32,7 +32,7 @@ const filter = computed(() => {
|
|||
fields: ['name'],
|
||||
},
|
||||
where: {
|
||||
id: route.params.id,
|
||||
id: entityId,
|
||||
},
|
||||
};
|
||||
return filter;
|
||||
|
|
|
|||
|
|
@ -1,184 +1,114 @@
|
|||
<script setup>
|
||||
import { computed, onMounted, onUpdated, ref } from 'vue';
|
||||
import { reactive, ref } from 'vue';
|
||||
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 { useRoute, useRouter } from 'vue-router';
|
||||
import axios from 'axios';
|
||||
|
||||
onMounted(() => fetch());
|
||||
onUpdated(() => fetch());
|
||||
import VnInputTime from 'components/common/VnInputTime.vue';
|
||||
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
||||
|
||||
const { t } = useI18n();
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const $props = defineProps({
|
||||
id: {
|
||||
type: Number,
|
||||
required: false,
|
||||
default: null,
|
||||
},
|
||||
|
||||
const newZoneForm = reactive({
|
||||
travelingDays: 0,
|
||||
price: 0.2,
|
||||
bonus: 0.2,
|
||||
hour: Date.vnNew(),
|
||||
isVolumetric: false,
|
||||
});
|
||||
const entityId = computed(() => $props.id || route.params.id);
|
||||
const warehousesOptions = ref([]);
|
||||
const agencyOptions = ref([]);
|
||||
|
||||
let zoneTypes = [];
|
||||
let originalData = {};
|
||||
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,
|
||||
const redirectToZoneLocations = (_, { id }) => {
|
||||
router.push({ name: 'ZoneLocations', params: { id } });
|
||||
};
|
||||
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>
|
||||
|
||||
<template>
|
||||
<QPage class="q-pa-sm q-mx-xl">
|
||||
<QForm @submit="onSubmit()" @reset="onReset()" class="q-pa-sm">
|
||||
<QCard class="q-pa-md">
|
||||
<div class="row q-col-gutter-md">
|
||||
<div class="col">
|
||||
<QInput
|
||||
filled
|
||||
v-model="zone.label"
|
||||
:label="t('create.name')"
|
||||
type="number"
|
||||
min="0"
|
||||
:rules="[(val) => !!val || t('zone.warnings.labelNotEmpty')]"
|
||||
<FetchData
|
||||
url="Warehouses"
|
||||
:filter="{ order: ['name'] }"
|
||||
@on-fetch="(data) => (warehousesOptions = data)"
|
||||
auto-load
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<FetchData
|
||||
url="AgencyModes/isActive"
|
||||
:filter="{ order: ['name'] }"
|
||||
@on-fetch="(data) => (agencyOptions = data)"
|
||||
auto-load
|
||||
/>
|
||||
<QPage>
|
||||
<VnSubToolbar />
|
||||
<FormModel
|
||||
url-create="Zones"
|
||||
model="Zones"
|
||||
:form-initial-data="newZoneForm"
|
||||
@on-data-saved="redirectToZoneLocations"
|
||||
>
|
||||
<template #form="{ data }">
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<VnInput
|
||||
filled
|
||||
v-model="zone.plate"
|
||||
:label="t('create.agency')"
|
||||
:rules="[(val) => !!val || t('zone.warnings.plateNotEmpty')]"
|
||||
v-model="data.name"
|
||||
:label="t('create.name')"
|
||||
:required="true"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row q-col-gutter-md">
|
||||
<div class="col">
|
||||
<QInput
|
||||
filled
|
||||
v-model="zone.volume"
|
||||
:label="t('create.close')"
|
||||
type="number"
|
||||
min="0"
|
||||
:rules="[(val) => !!val || t('zone.warnings.volumeNotEmpty')]"
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<QSelect
|
||||
filled
|
||||
v-model="zone.typeFk"
|
||||
use-input
|
||||
fill-input
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<VnSelect
|
||||
:label="t('create.warehouse')"
|
||||
:options="warehousesOptions"
|
||||
hide-selected
|
||||
input-debounce="0"
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
emit-value
|
||||
map-options
|
||||
v-model="data.warehouseFk"
|
||||
/>
|
||||
<VnSelect
|
||||
:label="t('create.agency')"
|
||||
:options="agencyOptions"
|
||||
hide-selected
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
v-model="data.agencyModeFk"
|
||||
:required="true"
|
||||
/>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<VnInput
|
||||
v-model="data.travelingDays"
|
||||
:label="t('create.travelingDays')"
|
||||
type="number"
|
||||
min="0"
|
||||
/>
|
||||
|
||||
<VnInputTime v-model="data.hour" :label="t('create.closingHour')" />
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<VnInput
|
||||
v-model="data.price"
|
||||
:label="t('create.price')"
|
||||
:options="filteredZoneTypes"
|
||||
:rules="[(val) => !!val || t('zone.warnings.typeNotEmpty')]"
|
||||
@filter="filterType"
|
||||
>
|
||||
<template v-if="zone.typeFk" #append>
|
||||
<QIcon
|
||||
name="cancel"
|
||||
@click.stop.prevent="zone.typeFk = null"
|
||||
class="cursor-pointer"
|
||||
type="number"
|
||||
min="0"
|
||||
/>
|
||||
</template>
|
||||
<template #no-option>
|
||||
<QItem>
|
||||
<QItemSection class="text-grey">
|
||||
{{ t('zone.warnings.noData') }}
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
</template>
|
||||
</QSelect>
|
||||
</div>
|
||||
</div>
|
||||
</QCard>
|
||||
<div class="q-mt-md">
|
||||
<QBtn :label="t('type.submit')" type="submit" color="primary" />
|
||||
<QBtn
|
||||
:label="t('type.reset')"
|
||||
type="reset"
|
||||
color="primary"
|
||||
flat
|
||||
class="q-ml-sm"
|
||||
<VnInput
|
||||
v-model="data.bonus"
|
||||
:label="t('create.bonus')"
|
||||
type="number"
|
||||
min="0"
|
||||
/>
|
||||
</div>
|
||||
</QForm>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<QCheckbox
|
||||
:label="t('create.volumetric')"
|
||||
v-model="data.isVolumetric"
|
||||
:toggle-indeterminate="false"
|
||||
/>
|
||||
</VnRow>
|
||||
</template>
|
||||
</FormModel>
|
||||
</QPage>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.q-page {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.q-form {
|
||||
width: 70%;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -2,6 +2,7 @@ zone:
|
|||
pageTitles:
|
||||
zones: Zone
|
||||
zonesList: Zones
|
||||
zoneCreate: Create zone
|
||||
deliveryList: Delivery days
|
||||
upcomingList: Upcoming deliveries
|
||||
list:
|
||||
|
|
@ -13,18 +14,19 @@ list:
|
|||
price: Price
|
||||
create: Create zone
|
||||
openSummary: Details
|
||||
confirmCloneTitle: All it's properties will be copied
|
||||
confirmCloneSubtitle: Do you want to clone this zone?
|
||||
searchZone: Search zones
|
||||
searchInfo: Search zone by id or name
|
||||
confirmCloneTitle: All it's properties will be copied
|
||||
confirmCloneSubtitle: Do you want to clone this zone?
|
||||
create:
|
||||
name: Name
|
||||
warehouse: Warehouse
|
||||
agency: Agency
|
||||
close: Close
|
||||
travelingDays: Traveling days
|
||||
closingHour: Closing hour
|
||||
price: Price
|
||||
type:
|
||||
submit: Save
|
||||
reset: Reset
|
||||
bonus: Bonus
|
||||
volumetric: Volumetric
|
||||
summary:
|
||||
agency: Agency
|
||||
price: Price
|
||||
|
|
|
|||
|
|
@ -2,6 +2,7 @@ zone:
|
|||
pageTitles:
|
||||
zones: Zonas
|
||||
zonesList: Zonas
|
||||
zoneCreate: Nueva zona
|
||||
deliveryList: Días de entrega
|
||||
upcomingList: Próximos repartos
|
||||
list:
|
||||
|
|
@ -13,18 +14,19 @@ list:
|
|||
price: Precio
|
||||
create: Crear zona
|
||||
openSummary: Detalles
|
||||
confirmCloneTitle: Todas sus propiedades serán copiadas
|
||||
confirmCloneSubtitle: ¿Seguro que quieres clonar esta zona?
|
||||
searchZone: Buscar zonas
|
||||
searchInfo: Buscar zonas por identificador o nombre
|
||||
confirmCloneTitle: Todas sus propiedades serán copiadas
|
||||
confirmCloneSubtitle: ¿Seguro que quieres clonar esta zona?
|
||||
create:
|
||||
name: Nombre
|
||||
warehouse: Almacén
|
||||
agency: Agencia
|
||||
close: Cierre
|
||||
travelingDays: Días de viaje
|
||||
closingHour: Hora de cierre
|
||||
price: Precio
|
||||
type:
|
||||
submit: Guardar
|
||||
reset: Reiniciar
|
||||
bonus: Bonificación
|
||||
volumetric: Volumétrico
|
||||
summary:
|
||||
agency: Agencia
|
||||
price: Precio
|
||||
|
|
@ -38,5 +40,3 @@ summary:
|
|||
filterPanel:
|
||||
name: Nombre
|
||||
agencyModeFk: Agencia
|
||||
Search zones: Buscar zonas
|
||||
You can search by zone reference: Puedes buscar por referencia de la zona
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@ export default {
|
|||
redirect: { name: 'ZoneMain' },
|
||||
menus: {
|
||||
main: ['ZoneList', 'ZoneDeliveryList', 'ZoneUpcomingList'],
|
||||
card: ['ZoneBasicData', 'ZoneHistory'],
|
||||
card: ['ZoneBasicData', 'ZoneHistory', 'ZoneLocations'],
|
||||
},
|
||||
children: [
|
||||
{
|
||||
|
|
@ -48,15 +48,15 @@ export default {
|
|||
},
|
||||
component: () => import('src/pages/Zone/ZoneCreate.vue'),
|
||||
},
|
||||
{
|
||||
path: 'counter',
|
||||
name: 'ZoneCounter',
|
||||
meta: {
|
||||
title: 'zoneCounter',
|
||||
icon: 'add_circle',
|
||||
},
|
||||
component: () => import('src/pages/Zone/ZoneCounter.vue'),
|
||||
},
|
||||
// {
|
||||
// path: 'counter',
|
||||
// name: 'ZoneCounter',
|
||||
// meta: {
|
||||
// title: 'zoneCounter',
|
||||
// icon: 'add_circle',
|
||||
// },
|
||||
// component: () => import('src/pages/Zone/ZoneCounter.vue'),
|
||||
// },
|
||||
],
|
||||
},
|
||||
{
|
||||
|
|
@ -74,6 +74,15 @@ export default {
|
|||
},
|
||||
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'),
|
||||
},
|
||||
{
|
||||
name: 'ZoneBasicData',
|
||||
path: 'basic-data',
|
||||
|
|
@ -92,6 +101,7 @@ export default {
|
|||
},
|
||||
component: () => import('src/pages/Zone/Card/ZoneLog.vue'),
|
||||
},
|
||||
|
||||
// {
|
||||
// path: '/zone/delivery',
|
||||
// name: 'ZoneDeliveryMain',
|
||||
|
|
|
|||
Loading…
Reference in New Issue