新增全屏状态

src/renderer/components/core/Aside/ControlBtns.vue

@@ -1,5 +1,5 @@
 <template>
-<div :class="$style.controlBtn">
+<div :class="$style.controlBtn" v-show="!isFullscreen">
   <button type="button" :class="[$style.btn, $style.close]" :tips="$t('close')" @click="close">
     <svg :class="$style.controlBtniIcon" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink" width="100%" viewBox="0 0 24 24" space="preserve">
       <use xlink:href="#icon-window-close"></use>
@@ -16,10 +16,12 @@
 <script>
 import { base as eventBaseName } from '@renderer/event/names'
 // import { getRandom } from '../../utils'
+import { isFullscreen } from '@renderer/core/share'
 
 export default {
   setup() {
     return {
+      isFullscreen,
       min() {
         window.eventHub.emit(eventBaseName.min)
       },

src/renderer/components/core/Aside/NavBar.vue

@@ -1,7 +1,7 @@
 <template>
 <div :class="$style.menu">
   <ul :class="$style.list">
-    <li v-for="item in menus" :key="item.to">
+    <li v-for="item in menus" :key="item.to" :class="$style.navItem">
       <router-link :class="$style.link" :active-class="$style.active" :to="item.to" :tips="item.tips">
         <div :class="$style.icon">
           <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink" :viewBox="item.iconSize" space="preserve">
@@ -98,13 +98,26 @@ export default {
   //   .mixin-ellipsis-1;
   // }
 }
+.navItem {
+  position: relative;
+  &:before {
+    content: '';
+    display: block;
+    width: 100%;
+    padding-bottom: 84%;
+  }
+}
 .link {
-  display: block;
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  // display: block;
   box-sizing: border-box;
   text-decoration: none;
 
-  position: relative;
-  padding: 18px 3px;
+  // padding: 18px 3px;
   // margin: 5px 0;
   // border-left: 5px solid transparent;
   transition: @transition-theme;
@@ -114,6 +127,9 @@ export default {
   font-size: 11.5px;
   text-align: center;
   outline: none;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 
   transition: background-color 0.3s ease;
   // border-radius: @radius-border;

src/renderer/components/core/Aside/index.vue

@@ -1,5 +1,5 @@
 <template>
-<div :class="$style.aside">
+<div :class="[$style.aside, { [$style.fullscreen]: isFullscreen }]">
   <ControlBtns v-if="setting.controlBtnPosition == 'left'" />
   <div :class="$style.logo" v-else>L X</div>
   <NavBar />
@@ -8,6 +8,7 @@
 
 <script>
 import { mapGetters } from 'vuex'
+import { isFullscreen } from '@renderer/core/share'
 
 import ControlBtns from './ControlBtns'
 import NavBar from './NavBar'
@@ -15,6 +16,11 @@ import NavBar from './NavBar'
 export default {
   name: 'CoreAside',
   components: { ControlBtns, NavBar },
+  setup() {
+    return {
+      isFullscreen,
+    }
+  },
   computed: {
     ...mapGetters(['setting']),
   },
@@ -36,6 +42,13 @@ export default {
   -webkit-user-select: none;
   display: flex;
   flex-flow: column nowrap;
+
+  &.fullscreen {
+    -webkit-app-region: no-drag;
+    .logo {
+      display: none;
+    }
+  }
 }
 
 .logo {