37 lines
1.1 KiB
Vue
37 lines
1.1 KiB
Vue
<!--
|
|||
|
|
Ported from legacy henza_pwa/src/layout/master.vue.
|
||
|
|
NOTE (existing issue, ported as-is — not fixed here): this layout renders
|
||
|
|
its own <router-view/> rather than a <slot/>, so the keep-alive/suspense
|
||
|
|
wrapper App.vue builds around its own <router-view> is never actually used
|
||
|
|
by this layout — the route component here is resolved fresh, independently.
|
||
|
|
Preserved exactly; flagged separately.
|
||
|
|
-->
|
||
|
|
<template>
|
||
|
|
<section ref="content">
|
||
|
|
<router-view />
|
||
|
|
<Navigation />
|
||
|
|
<div class="bg-primary top-[-2rem] fixed h-[2rem] w-full z-10" />
|
||
|
|
</section>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup lang="ts">
|
||
|
|
import { onBeforeMount, ref } from 'vue'
|
||
|
|
import { useResizeObserver } from '@vueuse/core'
|
||
|
|
import Navigation from '../components/ui/Navigation.vue'
|
||
|
|
import { useWindowDataStore } from '../stores/windowDataStore'
|
||
|
|
|
||
|
|
const windowData = useWindowDataStore()
|
||
|
|
const content = ref<HTMLElement | null>(null)
|
||
|
|
|
||
|
|
onBeforeMount(() => {
|
||
|
|
windowData.setWidth(window.innerWidth)
|
||
|
|
})
|
||
|
|
useResizeObserver(content, (entries) => {
|
||
|
|
const entry = entries[0]
|
||
|
|
const { width } = entry.contentRect
|
||
|
|
if (windowData.width !== width) {
|
||
|
|
windowData.setWidth(width)
|
||
|
|
}
|
||
|
|
})
|
||
|
|
</script>
|