++

src/layout/components/AppMain.vue

@@ -35,7 +35,6 @@ function addIframe() {
 
 <style lang="scss" scoped>
 .app-main {
-  // min-height: 100vh;
   height: 100%;
   width: 100%;
   position: relative;

src/layout/index.vue

@@ -1,5 +1,5 @@
 <template>
-    <dv-full-screen-container>
+    <dv-full-screen-container class="layout_wrapper">
         <div class="app">
             <div :class="classObj" class="app-wrapper">
                 <logo :collapse="isCollapse" class="fixed-header" />
@@ -27,7 +27,6 @@ const sidebar = computed(() => useAppStore().sidebar);
 const device = computed(() => useAppStore().device);
 const needTagsView = computed(() => settingsStore.tagsView);
 const fixedHeader = computed(() => settingsStore.fixedHeader);
-
 const classObj = computed(() => ({
     hideSidebar: !sidebar.value.opened,
     openSidebar: sidebar.value.opened,
@@ -61,12 +60,29 @@ const settingRef = ref(null);
 function setLayout() {
     settingRef.value.openSetting();
 }
+
+const viewportWidth = ref(0);
+const viewportHeight = ref(0);
+
+const updateViewportSize = () => {
+    viewportWidth.value = window.innerWidth;
+    viewportHeight.value = window.innerHeight;
+    console.log(viewportWidth.value,viewportHeight.value,22223);
+};
+
+onMounted(() => {
+    updateViewportSize();
+    window.addEventListener('resize', updateViewportSize);
+});
+
+onUnmounted(() => {
+    window.removeEventListener('resize', updateViewportSize);
+});
 </script>
 
 <style lang="scss" scoped>
 @import "@/assets/styles/mixin.scss";
 @import "@/assets/styles/variables.module.scss";
-
 .app {
     position: relative;
     height: 100%;