1
This commit is contained in:
12
src/App.vue
12
src/App.vue
@@ -1,8 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<main-header />
|
<main-header />
|
||||||
<div class="view" ref="viewRef" :style="{ '--app-view-height': viewHeight + 'px' }">
|
<div class="view" ref="viewRef" :style="viewStyle"><RouteCache /></div>
|
||||||
<RouteCache />
|
|
||||||
</div>
|
|
||||||
<login-dialog />
|
<login-dialog />
|
||||||
<div id="loading" v-if="loading" v-loading="true"></div>
|
<div id="loading" v-if="loading" v-loading="true"></div>
|
||||||
</template>
|
</template>
|
||||||
@@ -16,10 +14,14 @@
|
|||||||
const globalStore = useGlobalStore()
|
const globalStore = useGlobalStore()
|
||||||
const loading = computed(() => globalStore.state.loading)
|
const loading = computed(() => globalStore.state.loading)
|
||||||
const viewRef = ref()
|
const viewRef = ref()
|
||||||
const viewHeight = ref(0)
|
const viewStyle = ref({
|
||||||
|
'--app-view-width': '',
|
||||||
|
'--app-view-height': ''
|
||||||
|
})
|
||||||
const observer = new ResizeObserver((entries) => {
|
const observer = new ResizeObserver((entries) => {
|
||||||
const { width, height } = entries[0].contentRect
|
const { width, height } = entries[0].contentRect
|
||||||
viewHeight.value = height
|
viewStyle.value['--app-view-width'] = width + 'px'
|
||||||
|
viewStyle.value['--app-view-height'] = height + 'px'
|
||||||
})
|
})
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
observer.observe(viewRef.value)
|
observer.observe(viewRef.value)
|
||||||
|
|||||||
Reference in New Issue
Block a user