前端 样式更改

front/src/views/Main.vue

@@ -3,31 +3,24 @@
 </style>
 
 <template>
-  <div class="main" :class="{ 'main-hide-text': shrink }">
+<div class="main" :class="{ 'main-hide-text': shrink }">
     <!-- 左侧菜单 -->
-    <div
-      :class="`sidebar-menu-content side-bar-menu-theme-${menuTheme}`"
-      :style="{
+    <div :class="`sidebar-menu-content side-bar-menu-theme-${menuTheme}`" :style="{
         width: shrink ? '60px' : menuWidth + 'px',
         overflow: shrink ? 'visible' : 'auto',
-      }"
-    >
-      <shrinkable-menu
-        :shrink="shrink"
-        @on-change="handleSubmenuChange"
-        :theme="menuTheme"
-        :before-push="beforePush"
-        :menu-list="menuList"
-      >
+      }">
+        <shrinkable-menu :shrink="shrink" @on-change="handleSubmenuChange" :theme="menuTheme" :before-push="beforePush" :menu-list="menuList">
+            <div slot="top" class="logo-content" v-if="showLogo || fixNav">
+                <Icon type="ios-game-controller-b" size="100"></Icon>
+                <img v-show="!shrink && menuTheme == 'light' && mainTheme != 'darkMode'" src="@/assets/logo-black.png" />
+                <img v-show="shrink" src="@/assets/logo-min.png" key="min-logo" />
+            </div>
         </shrinkable-menu>
     </div>
     <!-- 右上顶部导航条 -->
-    <div
-      :class="`main-header-content fix-nav-${fixNav}`"
-      :style="{
+    <div :class="`main-header-content fix-nav-${fixNav}`" :style="{
         paddingLeft: navPaddingLeft,
-      }"
-    >
+      }">
         <div :class="`main-header header-theme-${navTheme}`">
             <div class="header-left">
                 <!-- 固定图标 -->
@@ -35,46 +28,18 @@
                     <span style='font-size:22px;font-family: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif;'>System</span>
                 </div>
                 <!-- 收缩图标 -->
-          <div
-            class="header-navicon-content header-action"
-            @click="toggleClick"
-            v-if="showFold"
-          >
-            <Icon
-              custom="iconfont icon-menu-unfold"
-              size="20"
-              v-show="this.shrink"
-            />
-            <Icon
-              custom="iconfont icon-menu-fold"
-              size="20"
-              v-show="!this.shrink"
-            />
+                <div class="header-navicon-content header-action" @click="toggleClick" v-if="showFold">
+                    <Icon custom="iconfont icon-menu-unfold" size="20" v-show="this.shrink" />
+                    <Icon custom="iconfont icon-menu-fold" size="20" v-show="!this.shrink" />
                 </div>
                 <div class="header-middle-content">
                     <!-- 顶部菜单 -->
                     <div v-if="navType == 1">
-              <navMenu
-                :theme="navTheme"
-                :currNav="currNav"
-                :navList="navList"
-                @on-click="selectNav"
-                :sliceNum="sliceNum"
-                :showIcon="showNavMenuIcon"
-              />
+                        <navMenu :theme="navTheme" :currNav="currNav" :navList="navList" @on-click="selectNav" :sliceNum="sliceNum" :showIcon="showNavMenuIcon" />
                     </div>
                     <!-- 下拉菜单 -->
                     <div v-if="navType == 2">
-              <navApp
-                currType="tabs"
-                placement="bottom-start"
-                :currNavTitle="currNavTitle"
-                :currNav="currNav"
-                :navList="navList"
-                :type="navShowType"
-                :theme="navTheme"
-                @on-click="selectNav"
-              />
+                        <navApp currType="tabs" placement="bottom-start" :currNavTitle="currNavTitle" :currNav="currNav" :navList="navList" :type="navShowType" :theme="navTheme" @on-click="selectNav" />
                     </div>
                     <!-- 面包导航 -->
                     <div class="main-breadcrumb" v-if="navType == 3">
@@ -84,13 +49,7 @@
             </div>
             <!-- 顶部右侧按钮 -->
             <div class="header-right-content">
-          <navApp
-            :currNav="currNav"
-            :navList="navList"
-            :type="navShowType"
-            @on-click="selectNav"
-            v-if="navType == 3"
-          />
+                <navApp :currNav="currNav" :navList="navList" :type="navShowType" @on-click="selectNav" v-if="navType == 3" />
                 <full-screen v-model="isFullScreen" @on-change="fullscreenChange" />
                 <message-tip />
                 <user />
@@ -98,22 +57,16 @@
         </div>
     </div>
     <!-- Tags 标签 -->
-    <div
-      class="nav-tags"
-      :style="{
+    <div class="nav-tags" :style="{
         paddingLeft: shrink ? '60px' : menuWidth + 'px',
-      }"
-    >
+      }">
         <tags-page-opened :pageTagsList="pageTagsList" v-if="showTags" />
     </div>
     <!-- 页面部分 -->
-    <div
-      class="single-page-content"
-      :style="{
+    <div class="single-page-content" :style="{
         left: shrink ? '60px' : menuWidth + 'px',
         top: showTags ? '100px' : '60px',
-      }"
-    >
+      }">
         <div class="single-page">
             <keep-alive :include="cachePage">
                 <router-view />
@@ -126,7 +79,7 @@
     </div>
     <!-- 全局加载动画 -->
     <circleLoading class="loading-position" v-show="loading" />
-  </div>
+</div>
 </template>
 
 <script>
@@ -143,6 +96,7 @@ import Footer from "./main-components/footer.vue";
 import circleLoading from "@/views/my-components/xboot/circle-loading.vue";
 
 import util from "@/libs/util.js";
+import XIcon from './my-components/xboot/x-icon/x-icon.vue';
 
 export default {
     components: {
@@ -156,6 +110,7 @@ export default {
         user,
         Footer,
         circleLoading,
+        XIcon,
     },
     data() {
         return {