Added searchbar in Wagon module #835

Open
jon wants to merge 10 commits from Fix-AddSearchbarToWagonModule into dev
3 changed files with 56 additions and 6 deletions
Showing only changes of commit a6508ac2dc - Show all commits

View File

@ -251,6 +251,7 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
newUrl.query[store.searchUrl] = JSON.stringify(store.currentFilter);
if (store.navigate) {
let to;
const { customRouteRedirectName, searchText } = store.navigate;
if (customRouteRedirectName)
return router.push({
@ -260,10 +261,18 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
const { matched: matches } = router.currentRoute.value;
const { path } = matches.at(-1);
const to =
store?.data?.length === 1
? path.replace(/\/(list|:id)|-list/, `/${store.data[0].id}`)
: path.replace(/:id.*/, '');
path === '/wagon/list' || path === '/wagon/type/list'
Outdated
Review

No hay que poner rutas concretas en un composable global.
Mañana lo miramos

No hay que poner rutas concretas en un composable global. Mañana lo miramos
? (to =
store?.data?.length === 1
? path.replace(
/\/(list|:id)|-list/,
`/${store.data[0].id}/edit`
)
: path.replace(/:id.*/, ''))
: (to =
store?.data?.length === 1
? path.replace(/\/(list|:id)|-list/, `/${store.data[0].id}`)
: path.replace(/:id.*/, ''));
if (route.path != to) {
const pushUrl = { path: to };

View File

@ -9,6 +9,7 @@ import FormModelPopup from 'src/components/FormModelPopup.vue';
import VnInput from 'src/components/common/VnInput.vue';
import VnRow from 'src/components/ui/VnRow.vue';
import VnTable from 'src/components/VnTable/VnTable.vue';
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
const quasar = useQuasar();
const arrayData = useArrayData('WagonTypeList');
@ -78,16 +79,28 @@ async function remove(row) {
store.data.splice(store.data.indexOf(row), 1);
window.location.reload();
}
const exprBuilder = (param, value) => {
switch (param) {
case 'search':
return /^\d+$/.test(value) ? { id: value } : { name: { like: `%${value}%` } };
}
};
</script>
<template>
<VnSearchbar
data-key="WagonTypeList"
:label="t('searchWagonType')"
:info="t('searchInfo')"
:expr-builder="exprBuilder"
/>
<QPage class="column items-center q-pa-md">
<VnTable
ref="tableRef"
data-key="WagonTypeList"
url="WagonTypes"
:columns="columns"
auto-load
order="id DESC"
:right-search="false"
:column-search="false"
@ -129,8 +142,12 @@ async function remove(row) {
<i18n>
en:
nameNotEmpty: The name cannot be empty
searchWagonType: Search wagon type
searchInfo: You can search by name or id
es:
Create new Wagon type: Crear nuevo tipo de vagón
Name: Nombre
nameNotEmpty: El nombre no puede estar vacío
searchWagonType: Buscar tipo de vagón
searchInfo: Puedes buscar por nombre o id
</i18n>

View File

@ -8,6 +8,7 @@ import VnTable from 'src/components/VnTable/VnTable.vue';
import { computed, ref } from 'vue';
import VnSelect from 'src/components/common/VnSelect.vue';
import VnInput from 'src/components/common/VnInput.vue';
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
const quasar = useQuasar();
const arrayData = useArrayData('WagonList');
@ -88,9 +89,24 @@ async function remove(row) {
//
}
}
const exprBuilder = (param, value) => {
switch (param) {
case 'search':
return /^\d+$/.test(value)
? { label: value }
: { plate: { like: `%${value}%` } };
}
};
</script>
<template>
<VnSearchbar
data-key="WagonList"
:label="t('searchWagon')"
:info="t('searchInfo')"
:expr-builder="exprBuilder"
/>
<QPage class="column items-center q-pa-md">
<VnTable
ref="tableRef"
@ -98,7 +114,6 @@ async function remove(row) {
url="Wagons"
:filter="filter"
:columns="columns"
auto-load
order="id DESC"
:right-search="false"
:column-search="false"
@ -170,3 +185,12 @@ async function remove(row) {
</VnTable>
</QPage>
</template>
<i18n>
en:
searchWagon: Search wagon
searchInfo: You can search by name or plate
es:
searchWagon: Buscar vagón
searchInfo: Puedes buscar por nombre o mátricula
</i18n>