feat: refs #6919 improve vn-card logic

This commit is contained in:
Jorge Penadés 2024-11-14 17:30:54 +01:00
parent 7626c777ed
commit 565ec15589
22 changed files with 28 additions and 33 deletions

View File

@ -10,11 +10,11 @@ import LeftMenu from 'components/LeftMenu.vue';
import RightMenu from 'components/common/RightMenu.vue'; import RightMenu from 'components/common/RightMenu.vue';
const props = defineProps({ const props = defineProps({
dataKey: { type: String, required: true }, dataKey: { type: String, required: true },
baseUrl: { type: String, default: undefined }, url: { type: String, default: undefined },
customUrl: { type: String, default: undefined },
filter: { type: Object, default: () => {} }, filter: { type: Object, default: () => {} },
descriptor: { type: Object, required: true }, descriptor: { type: Object, required: true },
filterPanel: { type: Object, default: undefined }, filterPanel: { type: Object, default: undefined },
idInWhere: { type: Boolean, default: false },
searchDataKey: { type: String, default: undefined }, searchDataKey: { type: String, default: undefined },
searchbarProps: { type: Object, default: undefined }, searchbarProps: { type: Object, default: undefined },
redirectOnError: { type: Boolean, default: false }, redirectOnError: { type: Boolean, default: false },
@ -23,24 +23,18 @@ const props = defineProps({
const stateStore = useStateStore(); const stateStore = useStateStore();
const route = useRoute(); const route = useRoute();
const router = useRouter(); const router = useRouter();
const url = computed(() => {
if (props.baseUrl) {
return `${props.baseUrl}/${route.params.id}`;
}
return props.customUrl;
});
const searchRightDataKey = computed(() => { const searchRightDataKey = computed(() => {
if (!props.searchDataKey) return route.name; if (!props.searchDataKey) return route.name;
return props.searchDataKey; return props.searchDataKey;
}); });
const arrayData = useArrayData(props.dataKey, { const arrayData = useArrayData(props.dataKey, {
url: url.value, url: props.url,
filter: props.filter, filter: props.filter,
}); });
onBeforeMount(async () => { onBeforeMount(async () => {
try { try {
if (!props.baseUrl) arrayData.store.filter.where = { id: route.params.id }; if (props.idInWhere) arrayData.store.filter.where = { id: route.params.id };
await arrayData.fetch({ append: false, updateRouter: false }); await arrayData.fetch({ append: false, updateRouter: false });
} catch { } catch {
const { matched: matches } = router.currentRoute.value; const { matched: matches } = router.currentRoute.value;
@ -49,10 +43,10 @@ onBeforeMount(async () => {
} }
}); });
if (props.baseUrl) { if (!props.idInWhere) {
onBeforeRouteUpdate(async (to, from) => { onBeforeRouteUpdate(async (to, from) => {
if (to.params.id !== from.params.id) { if (to.params.id !== from.params.id) {
arrayData.store.url = `${props.baseUrl}/${to.params.id}`; arrayData.store.url = `${props.url}/${to.params.id}`;
await arrayData.fetch({ append: false, updateRouter: false }); await arrayData.fetch({ append: false, updateRouter: false });
} }
}); });

View File

@ -8,7 +8,7 @@ const { t } = useI18n();
<template> <template>
<VnCard <VnCard
data-key="Alias" data-key="Alias"
base-url="MailAliases" url="MailAliases"
:descriptor="AliasDescriptor" :descriptor="AliasDescriptor"
search-data-key="AccountAliasList" search-data-key="AccountAliasList"
:searchbar-props="{ :searchbar-props="{

View File

@ -7,7 +7,7 @@ import filter from './ClaimFilter.js';
<template> <template>
<VnCard <VnCard
data-key="Claim" data-key="Claim"
base-url="Claims" url="Claims"
:descriptor="ClaimDescriptor" :descriptor="ClaimDescriptor"
:filter-panel="ClaimFilter" :filter-panel="ClaimFilter"
search-data-key="ClaimList" search-data-key="ClaimList"

View File

@ -12,7 +12,7 @@ const routeName = computed(() => route.name);
<template> <template>
<VnCard <VnCard
data-key="Client" data-key="Client"
base-url="Clients" url="Clients"
:descriptor="CustomerDescriptor" :descriptor="CustomerDescriptor"
:filter-panel="routeName != 'CustomerConsumption' && CustomerFilter" :filter-panel="routeName != 'CustomerConsumption' && CustomerFilter"
search-data-key="CustomerList" search-data-key="CustomerList"

View File

@ -7,7 +7,7 @@ import DepartmentDescriptor from 'pages/Department/Card/DepartmentDescriptor.vue
class="q-pa-md column items-center" class="q-pa-md column items-center"
v-bind="{ ...$attrs }" v-bind="{ ...$attrs }"
data-key="Department" data-key="Department"
base-url="Departments" url="Departments"
:descriptor="DepartmentDescriptor" :descriptor="DepartmentDescriptor"
/> />
</template> </template>

View File

@ -7,7 +7,7 @@ import filter from './EntryFilter.js';
<template> <template>
<VnCard <VnCard
data-key="Entry" data-key="Entry"
base-url="Entries" url="Entries"
:filter="filter" :filter="filter"
:descriptor="EntryDescriptor" :descriptor="EntryDescriptor"
:filter-panel="EntryFilter" :filter-panel="EntryFilter"

View File

@ -45,7 +45,7 @@ onBeforeRouteUpdate(async (to) => await setRectificative(to));
<template> <template>
<VnCard <VnCard
data-key="InvoiceIn" data-key="InvoiceIn"
base-url="InvoiceIns" url="InvoiceIns"
:filter="filter" :filter="filter"
:descriptor="InvoiceInDescriptor" :descriptor="InvoiceInDescriptor"
:filter-panel="InvoiceInFilter" :filter-panel="InvoiceInFilter"

View File

@ -6,7 +6,7 @@ import InvoiceOutFilter from '../InvoiceOutFilter.vue';
<template> <template>
<VnCard <VnCard
data-key="InvoiceOut" data-key="InvoiceOut"
base-url="InvoiceOuts" url="InvoiceOuts"
:descriptor="InvoiceOutDescriptor" :descriptor="InvoiceOutDescriptor"
:filter-panel="InvoiceOutFilter" :filter-panel="InvoiceOutFilter"
search-data-key="InvoiceOutList" search-data-key="InvoiceOutList"

View File

@ -6,7 +6,7 @@ import ItemListFilter from '../ItemListFilter.vue';
<template> <template>
<VnCard <VnCard
data-key="Item" data-key="Item"
base-url="Items" url="Items"
:descriptor="ItemDescriptor" :descriptor="ItemDescriptor"
:filter-panel="ItemListFilter" :filter-panel="ItemListFilter"
search-data-key="ItemList" search-data-key="ItemList"

View File

@ -7,7 +7,7 @@ import ItemTypeSearchbar from '../ItemTypeSearchbar.vue';
<template> <template>
<VnCard <VnCard
data-key="ItemTypeSummary" data-key="ItemTypeSummary"
base-url="ItemTypes" url="ItemTypes"
:descriptor="ItemTypeDescriptor" :descriptor="ItemTypeDescriptor"
:filter-panel="ItemTypeFilter" :filter-panel="ItemTypeFilter"
search-data-key="ItemTypeList" search-data-key="ItemTypeList"

View File

@ -26,7 +26,7 @@ const customFilterPanel = computed(() => {
<template> <template>
<VnCard <VnCard
data-key="Order" data-key="Order"
base-url="Orders" url="Orders"
:descriptor="OrderDescriptor" :descriptor="OrderDescriptor"
:filter-panel="customFilterPanel" :filter-panel="customFilterPanel"
:search-data-key="customRouteRedirectName" :search-data-key="customRouteRedirectName"

View File

@ -6,7 +6,7 @@ import ParkingFilter from 'pages/Parking/ParkingFilter.vue';
<template> <template>
<VnCard <VnCard
data-key="Parking" data-key="Parking"
base-url="Parkings" url="Parkings"
:descriptor="ParkingDescriptor" :descriptor="ParkingDescriptor"
:filter-panel="ParkingFilter" :filter-panel="ParkingFilter"
search-data-key="ParkingList" search-data-key="ParkingList"

View File

@ -5,7 +5,7 @@ import VnCard from 'components/common/VnCard.vue';
<template> <template>
<VnCard <VnCard
data-key="Agency" data-key="Agency"
base-url="Agencies" url="Agencies"
:descriptor="AgencyDescriptor" :descriptor="AgencyDescriptor"
search-data-key="AgencyList" search-data-key="AgencyList"
:searchbar-props="{ :searchbar-props="{

View File

@ -7,7 +7,7 @@ import RouteSearchbar from 'pages/Route/Card/RouteSearchbar.vue';
<template> <template>
<VnCard <VnCard
data-key="Route" data-key="Route"
base-url="Routes" url="Routes"
:descriptor="RouteDescriptor" :descriptor="RouteDescriptor"
:filter-panel="RouteFilter" :filter-panel="RouteFilter"
search-data-key="RouteList" search-data-key="RouteList"

View File

@ -6,7 +6,7 @@ import RoadmapFilter from 'pages/Route/Roadmap/RoadmapFilter.vue';
<template> <template>
<VnCard <VnCard
data-key="Roadmap" data-key="Roadmap"
base-url="Roadmaps" url="Roadmaps"
:descriptor="RoadmapDescriptor" :descriptor="RoadmapDescriptor"
:filter-panel="RoadmapFilter" :filter-panel="RoadmapFilter"
search-data-key="RoadmapList" search-data-key="RoadmapList"

View File

@ -7,7 +7,7 @@ import ShelvingSearchbar from './ShelvingSearchbar.vue';
<template> <template>
<VnCard <VnCard
data-key="Shelving" data-key="Shelving"
base-url="Shelvings" url="Shelvings"
:descriptor="ShelvingDescriptor" :descriptor="ShelvingDescriptor"
:filter-panel="ShelvingFilter" :filter-panel="ShelvingFilter"
search-data-key="ShelvingList" search-data-key="ShelvingList"

View File

@ -6,7 +6,7 @@ import SupplierListFilter from '../SupplierListFilter.vue';
<template> <template>
<VnCard <VnCard
data-key="Supplier" data-key="Supplier"
base-url="Suppliers" url="Suppliers"
:descriptor="SupplierDescriptor" :descriptor="SupplierDescriptor"
:filter-panel="SupplierListFilter" :filter-panel="SupplierListFilter"
search-data-key="SupplierList" search-data-key="SupplierList"

View File

@ -10,7 +10,7 @@ const { t } = useI18n();
<template> <template>
<VnCard <VnCard
data-key="Ticket" data-key="Ticket"
base-url="Tickets" url="Tickets"
:filter-panel="TicketFilter" :filter-panel="TicketFilter"
:descriptor="TicketDescriptor" :descriptor="TicketDescriptor"
search-data-key="TicketList" search-data-key="TicketList"

View File

@ -33,7 +33,7 @@ const filter = {
<template> <template>
<VnCard <VnCard
data-key="Travel" data-key="Travel"
base-url="Travels" url="Travels"
search-data-key="TravelList" search-data-key="TravelList"
:filter="filter" :filter="filter"
:descriptor="TravelDescriptor" :descriptor="TravelDescriptor"

View File

@ -2,5 +2,5 @@
import VnCard from 'components/common/VnCard.vue'; import VnCard from 'components/common/VnCard.vue';
</script> </script>
<template> <template>
<VnCard data-key="Wagon" base-url="Wagons" /> <VnCard data-key="Wagon" url="Wagons" />
</template> </template>

View File

@ -6,7 +6,8 @@ import WorkerFilter from '../WorkerFilter.vue';
<template> <template>
<VnCard <VnCard
data-key="Worker" data-key="Worker"
custom-url="Workers/summary" url="Workers/summary"
:id-in-where="true"
:descriptor="WorkerDescriptor" :descriptor="WorkerDescriptor"
:filter-panel="WorkerFilter" :filter-panel="WorkerFilter"
search-data-key="WorkerList" search-data-key="WorkerList"

View File

@ -20,7 +20,7 @@ function notIsLocations(ifIsFalse, ifIsTrue) {
<template> <template>
<VnCard <VnCard
data-key="zone" data-key="zone"
base-url="Zones" url="Zones"
:descriptor="ZoneDescriptor" :descriptor="ZoneDescriptor"
:filter-panel="ZoneFilterPanel" :filter-panel="ZoneFilterPanel"
:search-data-key="notIsLocations('ZoneList', 'ZoneLocations')" :search-data-key="notIsLocations('ZoneList', 'ZoneLocations')"