0
0
Fork 0

feat: refs #6480 include drawer

This commit is contained in:
Jorge Penadés 2024-04-11 12:23:00 +02:00
parent edf75c8cdd
commit bfa9dc9634
3 changed files with 22 additions and 13 deletions

View File

@ -1,11 +1,26 @@
<script setup> <script setup>
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 { useStateStore } from 'stores/useStateStore';
defineProps({
descriptor: { type: Object, required: true },
});
const stateStore = useStateStore();
</script> </script>
<template> <template>
<VnSubToolbar /> <QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
<QScrollArea class="fit">
<component :is="descriptor" />
<QSeparator />
<LeftMenu source="card" />
</QScrollArea>
</QDrawer>
<QPageContainer> <QPageContainer>
<QPage> <QPage>
<VnSubToolbar />
<div :class="useCardSize()"> <div :class="useCardSize()">
<RouterView /> <RouterView />
</div> </div>

View File

@ -12,14 +12,16 @@ onMounted(() => {
actions.value = document.querySelector('#st-actions'); actions.value = document.querySelector('#st-actions');
data.value = document.querySelector('#st-data'); data.value = document.querySelector('#st-data');
if (!actions.value && !data.value) return;
// Check if there's content to display // Check if there's content to display
const observer = new MutationObserver( const observer = new MutationObserver(
() => () =>
(hasContent.value = (hasContent.value =
actions.value.childNodes.length + data.value.childNodes.length) actions.value.childNodes.length + data.value.childNodes.length)
); );
observer.observe(actions.value, opts); if (actions.value) observer.observe(actions.value, opts);
observer.observe(data.value, opts); if (data.value) observer.observe(data.value, opts);
}); });
onUnmounted(() => { onUnmounted(() => {

View File

@ -2,7 +2,6 @@
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useStateStore } from 'stores/useStateStore'; import { useStateStore } from 'stores/useStateStore';
import InvoiceInDescriptor from './InvoiceInDescriptor.vue'; import InvoiceInDescriptor from './InvoiceInDescriptor.vue';
import LeftMenu from 'components/LeftMenu.vue';
import VnSearchbar from 'components/ui/VnSearchbar.vue'; import VnSearchbar from 'components/ui/VnSearchbar.vue';
import { useArrayData } from 'src/composables/useArrayData'; import { useArrayData } from 'src/composables/useArrayData';
import { onMounted, watch } from 'vue'; import { onMounted, watch } from 'vue';
@ -47,7 +46,7 @@ const arrayData = useArrayData('InvoiceIn', {
onMounted(async () => await arrayData.fetch({ append: false })); onMounted(async () => await arrayData.fetch({ append: false }));
watch( watch(
() => route.params.id, () => route.params.id,
async (newId, oldId) => { async (newId) => {
if (newId) { if (newId) {
arrayData.store.url = `InvoiceIns/${newId}`; arrayData.store.url = `InvoiceIns/${newId}`;
await arrayData.fetch({ append: false }); await arrayData.fetch({ append: false });
@ -64,14 +63,7 @@ watch(
:info="t('You can search by invoice reference')" :info="t('You can search by invoice reference')"
/> />
</Teleport> </Teleport>
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256"> <VnCard :descriptor="InvoiceInDescriptor" />
<QScrollArea class="fit">
<InvoiceInDescriptor />
<QSeparator />
<LeftMenu source="card" />
</QScrollArea>
</QDrawer>
<VnCard />
</template> </template>
<i18n> <i18n>
es: es: