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

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/components/common/VnCard.vue
View File

@ -1,16 +1,28 @@
<script setup> <script setup>
import { useI18n } from 'vue-i18n';
import { useStateStore } from 'stores/useStateStore';
import useCardSize from 'src/composables/useCardSize'; import useCardSize from 'src/composables/useCardSize';
import VnSubToolbar from '../ui/VnSubToolbar.vue'; import VnSubToolbar from '../ui/VnSubToolbar.vue';
import LeftMenu from 'components/LeftMenu.vue'; import LeftMenu from 'components/LeftMenu.vue';
import { useStateStore } from 'stores/useStateStore'; import VnSearchbar from 'components/ui/VnSearchbar.vue';
defineProps({ defineProps({
descriptor: { type: Object, required: true }, descriptor: { type: Object, required: true },
searchbarProps: { type: Object, required: true },
}); });
const { t } = useI18n();
const stateStore = useStateStore(); const stateStore = useStateStore();
</script> </script>
<template> <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"> <QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
<QScrollArea class="fit"> <QScrollArea class="fit">
<component :is="descriptor" /> <component :is="descriptor" />

39
src/pages/InvoiceOut/Card/InvoiceOutCard.vue
View File

@ -1,39 +1,16 @@
<script setup> <script setup>
import { useI18n } from 'vue-i18n';
import { useStateStore } from 'stores/useStateStore';
import InvoiceOutDescriptor from './InvoiceOutDescriptor.vue'; import InvoiceOutDescriptor from './InvoiceOutDescriptor.vue';
import LeftMenu from 'components/LeftMenu.vue'; import VnCard from 'components/common/VnCard.vue';
import VnSearchbar from 'components/ui/VnSearchbar.vue';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
import useCardSize from 'src/composables/useCardSize';
const stateStore = useStateStore(); const searchbar = {
const { t } = useI18n(); dataKey: 'InvoiceOutList',
url: 'InvoiceOuts/filter',
label: 'Search invoice',
info: 'You can search by invoice reference',
};
</script> </script>
<template> <template>
<Teleport to="#searchbar" v-if="stateStore.isHeaderMounted()"> <VnCard :descriptor="InvoiceOutDescriptor" :searchbar-props="searchbar" />
<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>
</template> </template>
<i18n> <i18n>