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

Zone list

This commit is contained in:
William Buezas 2024-05-08 15:23:52 -03:00
parent c18d035be5
commit a3ce81d66d
5 changed files with 106 additions and 102 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -28,19 +28,25 @@ onMounted(async () => {
}); });
const filter = computed(() => { const filter = computed(() => {
return { where: { id: entityId.value } }; const params = {
filter: {
include: {
relation: 'agencyMode',
fields: ['name'],
},
where: {
id: entityId.value,
},
},
};
return params;
}); });
</script> </script>
<template> <template>
<CardSummary <CardSummary data-key="zoneData" ref="summary" url="Zones/findOne" :filter="filter">
data-key="zoneData"
ref="summary"
:url="`Zones/summary`"
:filter="filter"
>
<template #header="{ entity }"> <template #header="{ entity }">
<div>{{ entity.id }} - {{ entity.firstName }} {{ entity.lastName }}</div> <div>#{{ entity.id }} - {{ entity.name }}</div>
</template> </template>
<template #body="{ entity: zone }"> <template #body="{ entity: zone }">
<QCard class="vn-one"> <QCard class="vn-one">

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

@ -1,63 +1,61 @@
<script setup> <script setup>
import axios from 'axios'; import axios from 'axios';
import { useQuasar } from 'quasar';
import VnPaginate from 'src/components/ui/VnPaginate.vue'; import VnPaginate from 'src/components/ui/VnPaginate.vue';
import { useArrayData } from 'src/composables/useArrayData';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import CardList from 'components/ui/CardList.vue'; import CardList from 'components/ui/CardList.vue';
import VnLv from 'components/ui/VnLv.vue'; import VnLv from 'components/ui/VnLv.vue';
import FetchData from 'src/components/FetchData.vue'; import ZoneSummary from 'src/pages/Zone/Card/ZoneSummary.vue';
import { useSummaryDialog } from 'src/composables/useSummaryDialog'; import { useSummaryDialog } from 'src/composables/useSummaryDialog';
import { toTimeFormat } from 'src/filters/date'; import { toTimeFormat } from 'src/filters/date';
import { toCurrency } from 'filters/index';
import { useVnConfirm } from 'composables/useVnConfirm';
import useNotify from 'src/composables/useNotify.js';
const quasar = useQuasar();
const arrayData = useArrayData('ZoneList');
const store = arrayData.store;
const router = useRouter();
const { t } = useI18n(); const { t } = useI18n();
const router = useRouter();
const { notify } = useNotify();
const { viewSummary } = useSummaryDialog(); const { viewSummary } = useSummaryDialog();
const { openConfirmationModal } = useVnConfirm();
function navigate(id) { const redirectToZoneSummary = (id) => {
router.push({ path: `/zone/${id}/edit` }); router.push({ name: 'ZoneSummary', params: { id } });
} };
function create() { function redirectToCreateView() {
router.push({ path: `/zone/create` }); router.push({ path: `/zone/create` });
} }
async function remove(row) { async function clone(id) {
try { try {
await axios.delete(`Zones/${row.id}`).then(async () => { await axios.post(`Zones/${id}/clone`);
quasar.notify({ notify(t('globals.dataSaved'), 'positive');
message: t('zone.list.removeItem'), //TODO: Redireccionar Zone Basic data cuando exista
type: 'positive', // router.push({ name: 'ZoneBasicData', params: { id: row.id } });
});
store.data.splice(store.data.indexOf(row), 1);
});
} catch (error) { } catch (error) {
// console.error('Error cloning zone: ', error);
} }
} }
</script> </script>
<template> <template>
<FetchData
url="/Agencies"
@on-fetch="(data) => (agencyOptions = data)"
:filter="{ fields: ['id', 'name'] }"
auto-load
/>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<div class="vn-card-list"> <div class="vn-card-list">
<VnPaginate data-key="ZoneList" url="/Zones" order="id DESC" auto-load> <VnPaginate
data-key="ZoneList"
url="Zones"
:filter="{
include: { relation: 'agencyMode', scope: { fields: ['name'] } },
}"
auto-load
>
<template #body="{ rows }"> <template #body="{ rows }">
<CardList <CardList
v-for="row of rows" v-for="row of rows"
:key="row.id" :key="row.id"
:title="(row.label || '').toString()" :title="row.name"
:id="row.id" :id="row.id"
@click="navigate(row.id)" @click="redirectToZoneSummary(row.id)"
> >
<template #list-items> <template #list-items>
<VnLv <VnLv
@ -68,22 +66,29 @@ async function remove(row) {
<VnLv :label="t('zone.list.name')" :value="row?.name" /> <VnLv :label="t('zone.list.name')" :value="row?.name" />
<VnLv <VnLv
:label="t('zone.list.agency')" :label="t('zone.list.agency')"
:options="agencyOptions" :value="row.agencyMode?.name"
option-value="id"
option-label="name"
:value="row?.agencyFk"
/> />
<VnLv <VnLv
:label="t('zone.list.close')" :label="t('zone.list.close')"
:value="toTimeFormat(row?.hour)" :value="toTimeFormat(row?.hour)"
/> />
<VnLv :label="t('zone.list.price')" :value="row?.price" /> <VnLv
:label="t('zone.list.price')"
:value="toCurrency(row?.price)"
/>
</template> </template>
<template #actions> <template #actions>
<QBtn <QBtn
:label="t('components.smartCard.openCard')" :label="t('zone.list.clone')"
@click.stop="navigate(row.id)" @click.stop="
openConfirmationModal(
t('zone.list.confirmCloneTitle'),
t('zone.list.confirmCloneSubtitle'),
() => clone(row.id)
)
"
outline outline
style="margin-top: 15px"
/> />
<QBtn <QBtn
:label="t('zone.list.openSummary')" :label="t('zone.list.openSummary')"
@ -91,20 +96,13 @@ async function remove(row) {
color="primary" color="primary"
style="margin-top: 15px" 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"
/>
</template> </template>
</CardList> </CardList>
</template> </template>
</VnPaginate> </VnPaginate>
</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="redirectToCreateView()" fab icon="add" color="primary">
<QTooltip>{{ t('zone.list.create') }}</QTooltip> <QTooltip>{{ t('zone.list.create') }}</QTooltip>
</QBtn> </QBtn>
</QPageSticky> </QPageSticky>

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

@ -9,6 +9,8 @@ zone:
price: Price price: Price
create: Create zone create: Create zone
openSummary: Details openSummary: Details
confirmCloneTitle: All it's properties will be copied
confirmCloneSubtitle: Do you want to clone this zone?
create: create:
name: Name name: Name
agency: Agency agency: Agency

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

@ -9,6 +9,8 @@ zone:
price: Precio price: Precio
create: Crear zona create: Crear zona
openSummary: Detalles openSummary: Detalles
confirmCloneTitle: Todas sus propiedades serán copiadas
confirmCloneSubtitle: ¿Seguro que quieres clonar esta zona?
create: create:
name: Nombre name: Nombre
agency: Agencia agency: Agencia

96
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: [],
],
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',