feat: refs #6480 include SearchBar into VnCard

This commit is contained in:
Jorge Penadés 2024-04-18 11:32:03 +02:00
parent 90ed6ad09a
commit 75975b631e
2 changed files with 21 additions and 32 deletions

View File

@ -1,16 +1,28 @@
<script setup>
import { useI18n } from 'vue-i18n';
import { useStateStore } from 'stores/useStateStore';
import useCardSize from 'src/composables/useCardSize';
import VnSubToolbar from '../ui/VnSubToolbar.vue';
import LeftMenu from 'components/LeftMenu.vue';
import { useStateStore } from 'stores/useStateStore';
import VnSearchbar from 'components/ui/VnSearchbar.vue';
defineProps({
descriptor: { type: Object, required: true },
searchbarProps: { type: Object, required: true },
});
const { t } = useI18n();
const stateStore = useStateStore();
</script>
<template>
<Teleport to="#searchbar" v-if="stateStore.isHeaderMounted()">
<VnSearchbar
:data-key="searchbarProps.dataKey"
:url="searchbarProps.url"
:label="t(searchbarProps.label)"
:info="t(searchbarProps.info)"
/>
</Teleport>
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
<QScrollArea class="fit">
<component :is="descriptor" />

View File

@ -1,39 +1,16 @@
<script setup>
import { useI18n } from 'vue-i18n';
import { useStateStore } from 'stores/useStateStore';
import InvoiceOutDescriptor from './InvoiceOutDescriptor.vue';
import LeftMenu from 'components/LeftMenu.vue';
import VnSearchbar from 'components/ui/VnSearchbar.vue';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
import useCardSize from 'src/composables/useCardSize';
import VnCard from 'components/common/VnCard.vue';
const stateStore = useStateStore();
const { t } = useI18n();
const searchbar = {
dataKey: 'InvoiceOutList',
url: 'InvoiceOuts/filter',
label: 'Search invoice',
info: 'You can search by invoice reference',
};
</script>
<template>
<Teleport to="#searchbar" v-if="stateStore.isHeaderMounted()">
<VnSearchbar
data-key="InvoiceOutList"
url="InvoiceOuts/filter"
:label="t('Search invoice')"
:info="t('You can search by invoice reference')"
/>
</Teleport>
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
<QScrollArea class="fit">
<InvoiceOutDescriptor />
<QSeparator />
<LeftMenu source="card" />
</QScrollArea>
</QDrawer>
<QPageContainer>
<QPage>
<VnSubToolbar />
<div :class="useCardSize()">
<RouterView></RouterView>
</div>
</QPage>
</QPageContainer>
<VnCard :descriptor="InvoiceOutDescriptor" :searchbar-props="searchbar" />
</template>
<i18n>