#7271 - Zones Boilerplate #327

Merged
jsegarra merged 12 commits from 7271_boilerplate_zones into dev 2024-05-08 06:17:42 +00:00
17 changed files with 376 additions and 32 deletions
Showing only changes of commit 1a5f2fbea2 - Show all commits

View File

@ -90,6 +90,10 @@ globals:
basicData: Basic data
log: Logs
parkingList: Parkings list
zones: Zones
zonesList: Zones
deliveryList: Delivery days
upcomingList: Upcoming deliveries
created: Created
worker: Worker
now: Now

View File

@ -90,6 +90,10 @@ globals:
basicData: Datos básicos
log: Historial
parkingList: Listado de parkings
zones: Zonas
zonesList: Zonas
deliveryList: Días de entrega
upcomingList: Próximos repartos
created: Fecha creación
worker: Trabajador
now: Ahora
@ -287,7 +291,7 @@ customer:
hasSepaVnl: Recibido B2B VNL
entry:
pageTitles:
entries: Entrasdadas
entries: Entradas
list: Listado
summary: Resumen
basicData: Datos básicos

View File

@ -0,0 +1,103 @@
<script setup>
import { useRoute } from 'vue-router';
import { useI18n } from 'vue-i18n';
import FetchData from 'components/FetchData.vue';
import FormModel from 'src/components/FormModel.vue';
import VnRow from 'components/ui/VnRow.vue';
import VnInput from 'src/components/common/VnInput.vue';
import { QCheckbox } from 'quasar';
const route = useRoute();
const { t } = useI18n();
const zoneFilter = {
include: [
{
relation: 'agency',
scope: {
fields: ['name'],
include: { relation: 'agencyModeFk', scope: { fields: ['id'] } },
},
},
{ relation: 'sip', scope: { fields: ['extension', 'secret'] } },
{ relation: 'department', scope: { include: { relation: 'department' } } },
{ relation: 'client', scope: { fields: ['phone'] } },
],
};
const agencyFilter = {
fields: ['id', 'name'],
order: 'name ASC',
limit: 30,
};
</script>
<template>
<FetchData
:filter="agencyFilter"
@on-fetch="(data) => (agencyOptions = data)"
auto-load
url="agencies"
/>
<FetchData
:filter="zoneFilter"
@on-fetch="(data) => (zoneOptions = data)"
auto-load
url="zones"
/>
<FormModel
:filter="zoneFilter"
:url="`zone/${route.params.id}/basic-data`"
auto-load
model="Zone"
>
<template #form="{ data }">
<VnRow class="row q-gutter-md q-mb-md">
<VnInput :label="t('Name')" clearable v-model="data.zone.name" />
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<VnInput v-model="data.agency.name" :label="t('Agency')" clearable />
<VnInput v-model="data.zone.itemMaxSize" :label="t('Max m³')" clearable />
<VnInput v-model="data.zone.m3Max" :label="t('Maximum m³')" clearable />
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<VnInput
v-model="data.zone.travelingDays"
:label="t('Traveling days')"
clearable
/>
<VnInput v-model="data.zone.hour" :label="t('Closing')" clearable />
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<VnInput v-model="data.zone.price" :label="t('Price')" clearable />
<VnInput v-model="data.zone.bonus" :label="t('Bonus')" clearable />
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<VnInput
v-model="data.zone.inflation"
:label="t('Inflation')"
clearable
/>
<QCheckbox v-model="data.zone.isVolumetric" :label="t('Volumetric')" />
</VnRow>
</template>
</FormModel>
</template>
<i18n>
es:
Name: Nombre
Agency: Agencia
Max : Medida máxima
Maximum : maximo
Traveling days: Dias de viaje
Closing: Cierre
Price: Precio
Bonus: Bonificación
Inflation: Inflación
Volumetric: Volumétrico
</i18n>

View File

View File

View File

@ -0,0 +1,6 @@
<script setup>
import VnLog from 'src/components/common/VnLog.vue';
</script>
<template>
<VnLog model="Zone" url="/ZoneLogs"></VnLog>
</template>

View File

@ -0,0 +1,3 @@
<template>
<div>Si</div>
</template>

View File

@ -0,0 +1,59 @@
<script setup>
import { useRoute } from 'vue-router';
import VnPaginate from 'components/ui/VnPaginate.vue';
import CardList from 'components/CardList.vue';
import VnLv from 'components/ui/VnLv.vue';
const route = useRoute();
function deleteWarehouse() {
let row = this.deleteRow;
if (!row) return;
return this.$http.delete(`${this.path}/${row.id}`).then(() => {
jsegarra marked this conversation as resolved
Review

esto es codigo angularjs
Quitar

esto es codigo angularjs Quitar
let index = this.$.data.indexOf(row);
if (index !== -1) this.$.data.splice(index, 1);
this.deleteRow = null;
});
}
</script>
<template>
<QPage class="column items-center q-pa-md">
<div class="vn-card-list">
<VnPaginate
data-key="ZoneWarehouses"
:url="`Zones/${route.params.id}/warehouses`"
auto-load
>
<template #body="{ rows }">
<CardList
v-for="row of rows"
:key="row.id"
:title="row.name"
:id="row.id"
>
<template #list-items>
<VnLv :value="row.name" />
<QIcon
name="delete"
size="sm"
class="cursor-pointer"
color="primary"
@click="deleteWarehouse()"
>
<QTooltip>
{{ t('Remove row') }}
</QTooltip>
</QIcon>
</template>
</CardList>
</template>
</VnPaginate>
</div>
</QPage>
</template>
<i18n>
es:
Remove row: Eliminar fila
</i18n>

View File

@ -6,7 +6,6 @@ import { useArrayData } from 'src/composables/useArrayData';
import { useI18n } from 'vue-i18n';
import { useRouter } from 'vue-router';
import CardList from 'components/ui/CardList.vue';
import VnLv from 'components/ui/VnLv.vue';
const quasar = useQuasar();
const arrayData = useArrayData('ZoneDeliveryList');
@ -45,7 +44,7 @@ async function remove(row) {
<div class="vn-card-list">
<VnPaginate
data-key="ZoneDeliveryList"
url="/ZoneDeliverys"
url="/Zones/getEvents"
order="id DESC"
auto-load
>

View File

@ -6,7 +6,6 @@ import { useArrayData } from 'src/composables/useArrayData';
import { useI18n } from 'vue-i18n';
import { useRouter } from 'vue-router';
import CardList from 'components/ui/CardList.vue';
import VnLv from 'components/ui/VnLv.vue';
const quasar = useQuasar();
const arrayData = useArrayData('ZoneUpcomingList');
@ -45,7 +44,7 @@ async function remove(row) {
<div class="vn-card-list">
<VnPaginate
data-key="ZoneUpcomingList"
url="/ZoneUpcomings"
url="/Zones/getUpcomingDeliveries"
order="id DESC"
auto-load
>

View File

@ -96,7 +96,7 @@ function filterType(val, update) {
<QInput
filled
v-model="zone.label"
:label="t('zone.create.label')"
:label="t('zone.create.name')"
type="number"
min="0"
:rules="[(val) => !!val || t('zone.warnings.labelNotEmpty')]"
@ -106,7 +106,7 @@ function filterType(val, update) {
<VnInput
filled
v-model="zone.plate"
:label="t('zone.create.plate')"
:label="t('zone.create.agency')"
:rules="[(val) => !!val || t('zone.warnings.plateNotEmpty')]"
/>
</div>
@ -116,7 +116,7 @@ function filterType(val, update) {
<QInput
filled
v-model="zone.volume"
:label="t('zone.create.volume')"
:label="t('zone.create.close')"
type="number"
min="0"
:rules="[(val) => !!val || t('zone.warnings.volumeNotEmpty')]"
@ -134,7 +134,7 @@ function filterType(val, update) {
option-value="id"
emit-value
map-options
:label="t('zone.create.type')"
:label="t('zone.create.price')"
:options="filteredZoneTypes"
:rules="[(val) => !!val || t('zone.warnings.typeNotEmpty')]"
@filter="filterType"

View File

View File

@ -0,0 +1,55 @@
<script setup>
import { ref } from 'vue';
import { useI18n } from 'vue-i18n';
import VnInput from 'components/common/VnInput.vue';
import FetchData from 'components/FetchData.vue';
import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
import VnSelectFilter from 'components/common/VnSelectFilter.vue';
const { t } = useI18n();
const props = defineProps({
dataKey: {
type: String,
required: true,
},
exprBuilder: {
type: Function,
default: null,
},
});
const agencies = ref([]);
</script>
<template>
<FetchData
url="agencies"
limit="30"
@on-fetch="(data) => (agencies = data)"
auto-load
/>
<VnFilterPanel :data-key="props.dataKey" :search-button="true">
<template #body="{ params }">
<QItem>
<QItemSection>
<VnInput :label="t('Name')" v-model="params.name" is-outlined />
</QItemSection>
</QItem>
<QItem>
<QItemSection>
<VnSelectFilter
:label="t('Agency')"
v-model="params.agencyModefK"
:options="agencies"
option-value="id"
option-label="name"
@input-value="agencies.fetch()"
dense
outlined
rounded
>
</VnSelectFilter>
</QItemSection>
</QItem>
</template>
</VnFilterPanel>
</template>

View File

@ -7,21 +7,15 @@ import { useI18n } from 'vue-i18n';
import { useRouter } from 'vue-router';
import CardList from 'components/ui/CardList.vue';
import VnLv from 'components/ui/VnLv.vue';
import FetchData from 'src/components/FetchData.vue';
import { useSummaryDialog } from 'src/composables/useSummaryDialog';
const quasar = useQuasar();
const arrayData = useArrayData('ZoneList');
const store = arrayData.store;
const router = useRouter();
const { t } = useI18n();
const filter = {
include: {
relation: 'type',
scope: {
fields: 'name',
},
},
};
const { viewSummary } = useSummaryDialog();
function navigate(id) {
router.push({ path: `/zone/${id}/edit` });
@ -44,18 +38,25 @@ async function remove(row) {
//
}
}
function extractHour(dateTime) {
const date = new Date(dateTime);
const hours = date.getHours().toString().padStart(2, '0');
const minutes = date.getMinutes().toString().padStart(2, '0');
return `${hours}:${minutes}`;
jsegarra marked this conversation as resolved
Review

hay una funcion formatDate que parece que hace eso, se puede reutilizar?

hay una funcion formatDate que parece que hace eso, se puede reutilizar?
}
</script>
<template>
<FetchData
url="/Agencies"
@on-fetch="(data) => (agencyOptions = data)"
:filter="{ fields: ['id', 'name'] }"
auto-load
/>
<QPage class="column items-center q-pa-md">
<div class="vn-card-list">
<VnPaginate
data-key="ZoneList"
url="/Zones"
order="id DESC"
:filter="filter"
auto-load
>
<VnPaginate data-key="ZoneList" url="/Zones" order="id DESC" auto-load>
<template #body="{ rows }">
<CardList
v-for="row of rows"
@ -66,12 +67,23 @@ async function remove(row) {
>
<template #list-items>
<VnLv
:label="t('zone.list.plate')"
:title-label="t('zone.list.plate')"
:value="row.plate"
:label="t('zone.list.id')"
:title-label="t('zone.list.id')"
:value="row.id"
/>
<VnLv :label="t('zone.list.volume')" :value="row?.volume" />
<VnLv :label="t('zone.list.type')" :value="row?.type?.name" />
<VnLv :label="t('zone.list.name')" :value="row?.name" />
<VnLv
:label="t('zone.list.agency')"
:options="agencyOptions"
option-value="id"
option-label="name"
:value="row?.agencyFk"
/>
<VnLv
:label="t('zone.list.close')"
:value="extractHour(row?.hour)"
/>
<VnLv :label="t('zone.list.price')" :value="row?.price" />
</template>
<template #actions>
<QBtn
@ -80,7 +92,14 @@ async function remove(row) {
outline
/>
<QBtn
:label="t('zone.list.remove')"
:label="t('zone.list.openSummary')"
@click.stop="viewSummary(row.id, ZoneSummary)"
color="primary"
style="margin-top: 15px"
/>
<!--AQUI PONER BOTÓN CLONAR-->
<QBtn
:label="t('zone.list.clone')"
@click.stop="remove(row)"
color="primary"
style="margin-top: 15px"
@ -91,7 +110,9 @@ async function remove(row) {
</VnPaginate>
</div>
<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>
</QBtn>
</QPageSticky>
</QPage>
</template>

View File

@ -0,0 +1,53 @@
<script setup>
import { ref, computed } from 'vue';
import ZoneFilterPanel from 'components/InvoiceOutNegativeFilter.vue';
import VnSubToolbar from 'components/ui/VnSubToolbar.vue';
import { useI18n } from 'vue-i18n';
const { t } = useI18n();
const arrayData = ref(null);
const rows = computed(() => arrayData.value.store.data);
const columns = computed(() => [
{
label: t('Province'),
//field: '',
//name: '',
align: 'left',
},
{
label: t('Closing'),
//field: '',
//name: '',
align: 'left',
},
{
label: t('Id'),
//field: '',
//name: '',
align: 'left',
},
]);
function getWeekDay(jsonDate) {
const weekDay = new Date(jsonDate).getDay();
return this.days[weekDay].locale;
}
</script>
<template>
<QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
<QScrollArea class="fit text-grey-8">
<ZoneFilterPanel data-key="ZoneUpcoming" />
</QScrollArea>
</QDrawer>
<VnSubToolbar />
<QPage class="column items-center q-pa-md">
<span>
{{ t(`${getWeekDay(/*detail.shipped*/)}`) }} -
{{ t /*'detail.shipped'*/() }}
</span>
<QTable :columns="columns" :rows="rows" class="full-width q-mt-md"> </QTable>
</QPage>
</template>

View File

@ -0,0 +1,19 @@
zone:
list:
volume: Volume
clone: Clone
id: Id
name: Name
agency: Agency
close: Close
price: Price
create: Create zone
openSummary: Details
create:
name: Name
agency: Agency
close: Close
price: Price
type:
submit: Save
reset: Reset

View File

@ -0,0 +1,19 @@
zone:
list:
volume: Volumen
clone: Clonar
id: Id
name: Nombre
agency: Agencia
close: Cierre
price: Precio
create: Crear zona
openSummary: Detalles
create:
name: Nombre
agency: Agencia
close: Cierre
price: Precio
type:
submit: Guardar
reset: Reiniciar