up

src/components/Screenfull/index.vue

@@ -1,28 +1,44 @@
 <template>
     <div @click="max">
-        <svg-icon :icon-class="isFullscreen ? 'exit-fullscreen' : 'fullscreen'" @click="toggle" />
+        <svg-icon :icon-class="isFullscreen ? 'exit-fullscreen' : 'fullscreen'" />
     </div>
 </template>
 
 <script setup>
 import { useFullscreen } from '@vueuse/core';
-import { onMounted } from 'vue';
-
+import { onMounted, ref } from 'vue';
+import useSettingsStore from '@/store/modules/settings';
+const settingsStore = useSettingsStore();
 const { isFullscreen, enter, exit, toggle } = useFullscreen();
-let navbar = null;
-let container = null;
-let hasLogo = null;
-onMounted(() => {
-    navbar = document.querySelector('.navbar');
-    container = document.querySelector('#tags-view-container');
-    hasLogo = document.querySelector('.has-logo');
-});
 
+//获取dom
+let navbar = null;
+let app_main = null;
+let headers = null;
+let leftWra = null;
+let rightWra = null;
+let flag = ref(true);
+let leftment = null;
+let main_container = null;
+onMounted(() => {
+    navbar = document.querySelector('.navDiv');
+    app_main = document.querySelector('.app-main');
+    headers = document.querySelector('.headers');
+    leftWra = document.querySelector('.leftWra');
+    rightWra = document.querySelector('.rightWra');
+    leftment = document.querySelector('.leftment');
+    main_container = document.querySelector('.main-container');
+});
+//隐藏导航栏
 const max = () => {
-    console.log(hasLogo.style);
     navbar.style.display = 'none';
-    container.style.display = 'none';
-    hasLogo.style.left = '-100px';
+    app_main.style.height = '100%';
+    headers.style.transform = `translate(0, 0)`;
+    leftment.style.display = 'none';
+    main_container.style.marginLeft = '0';
+    document.querySelector('.leftWra').style.top = '80px';
+    document.querySelector('.rightWra').style.top = '80px';
+    // settingsStore.changeSetting({ key: 'topNav', value: flag.value });
 };
 </script>