verdnatura/salix-front
verdnatura
/
salix-front
1
2
Fork 1
Code Issues Pull Requests 63 Releases Wiki Activity

Zone create

This commit is contained in:
William Buezas 2024-05-09 11:32:04 -03:00
parent fcb6f8dd49
commit d227d4b09b
10 changed files with 217 additions and 272 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/i18n/locale/en.yml
View File

@ -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:

2
src/i18n/locale/es.yml
View File

@ -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:

4
src/pages/Zone/Card/ZoneSummary.vue
View File

@ -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

2
src/pages/Zone/Delivery/ZoneDeliveryList.vue
View File

@ -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"

2
src/pages/Zone/Upcoming/ZoneUpcomingList.vue
View File

@ -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"

269
src/pages/Zone/ZoneCreate.vue
View File

@ -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>

20
src/pages/Zone/ZoneList.vue
View File

@ -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>

41
src/pages/Zone/locale/en.yml
View File

@ -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

41
src/pages/Zone/locale/es.yml
View File

@ -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

106
src/router/modules/zone.js
View File

@ -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',