UI整体色调与项目调整一致

src/assets/styles/ruoyi.scss

@@ -203,6 +203,14 @@
   border-color: #48D1CC;
   color: #FFFFFF;
 }
+.el-button--primary{
+	color: #1890ff !important;
+}
+.el-button--primary:hover{
+	background: #1890ff !important;
+	border-color: #1890ff !important;
+	color: #FFFFFF !important;
+}
 
 .el-button--cyan {
   background-color: #20B2AA;

src/components/RightPanel/index.vue

@@ -67,8 +67,8 @@ export default {
     closeSidebar(evt) {
       const parent = evt.target.closest('.rightPanel')
       if (!parent) {
-        this.show = false
-        window.removeEventListener('click', this.closeSidebar)
+        // this.show = false
+        // window.removeEventListener('click', this.closeSidebar)
       }
     },
     insertToBody() {

src/layout/components/AppMain.vue

@@ -25,6 +25,7 @@ export default {
 <style lang="scss" scoped>
 .app-main {
   /* 50= navbar  50  */
+  padding-top: 50px;
   min-height: calc(100vh - 50px);
   width: 100%;
   position: relative;

src/layout/components/Navbar.vue

@@ -1,12 +1,16 @@
 <template>
   <div class="navbar">
-    <hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
+    <div class="sidebar-logo-link">
+      <img :src="logo" class="sidebar-logo" />
+      <h1 class="sidebar-title">{{ title }} </h1>
+    </div>
+    <!-- <hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" /> -->
 
-    <breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!topNav"/>
-    <top-nav id="topmenu-container" class="topmenu-container" v-if="topNav"/>
+    <!-- <breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!topNav"/> -->
+    <!-- <top-nav id="topmenu-container" class="topmenu-container" v-if="topNav"/> -->
 
     <div class="right-menu">
-      <template v-if="device!=='mobile'">
+      <!-- <template v-if="device!=='mobile'">
         <search id="header-search" class="right-menu-item" />
         
         <el-tooltip content="源码地址" effect="dark" placement="bottom">
@@ -23,7 +27,7 @@
           <size-select id="size-select" class="right-menu-item hover-effect" />
         </el-tooltip>
 
-      </template>
+      </template> -->
 
       <el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click">
         <div class="avatar-wrapper">
@@ -34,9 +38,9 @@
           <router-link to="/user/profile">
             <el-dropdown-item>个人中心</el-dropdown-item>
           </router-link>
-          <el-dropdown-item @click.native="setting = true">
+          <!-- <el-dropdown-item @click.native="setting = true">
             <span>布局设置</span>
-          </el-dropdown-item>
+          </el-dropdown-item> -->
           <el-dropdown-item divided @click.native="logout">
             <span>退出登录</span>
           </el-dropdown-item>
@@ -56,6 +60,7 @@ import SizeSelect from '@/components/SizeSelect'
 import Search from '@/components/HeaderSearch'
 import RuoYiGit from '@/components/RuoYi/Git'
 import RuoYiDoc from '@/components/RuoYi/Doc'
+import logoImg from '@/assets/logo/logo.png'
 
 export default {
   components: {
@@ -68,6 +73,12 @@ export default {
     RuoYiGit,
     RuoYiDoc
   },
+  data() {
+    return {
+      title: '云原生安全管理系统',
+      logo: logoImg
+    }
+  },
   computed: {
     ...mapGetters([
       'sidebar',
@@ -111,12 +122,38 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+  .sidebar-logo-link {
+    width: 200px;
+    height: 50px;
+    float: left;
+    text-align: center;
+
+    & .sidebar-logo {
+      width: 32px;
+      height: 32px;
+      vertical-align: middle;
+      margin-right: 12px;
+    }
+
+    & .sidebar-title {
+      display: inline-block;
+      margin: 0;
+      color: #fff;
+      font-weight: 600;
+      line-height: 50px;
+      font-size: 14px;
+      font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;
+      vertical-align: middle;
+    }
+  }
 .navbar {
+  width: 100%;
   height: 50px;
   overflow: hidden;
-  position: relative;
-  background: #fff;
+  position: fixed;
   box-shadow: 0 1px 4px rgba(0,21,41,.08);
+  z-index:2000;
+  background-color: #252B3B;
 
   .hamburger-container {
     line-height: 46px;

src/layout/components/Sidebar/Logo.vue

@@ -35,7 +35,7 @@ export default {
   },
   data() {
     return {
-      title: '若依管理系统',
+      title: '云原生安全管理系统',
       logo: logoImg
     }
   }

src/layout/index.vue

@@ -1,10 +1,10 @@
 <template>
   <div :class="classObj" class="app-wrapper" :style="{'--current-color': theme}">
-    <div v-if="device==='mobile'&&sidebar.opened" class="drawer-bg" @click="handleClickOutside"/>
+    <!-- <div v-if="device==='mobile'&&sidebar.opened" class="drawer-bg" @click="handleClickOutside"/> -->
     <sidebar v-if="!sidebar.hide" class="sidebar-container" />
+    <navbar />
     <div :class="{hasTagsView:needTagsView,sidebarHide:sidebar.hide}" class="main-container">
       <div :class="{'fixed-header':fixedHeader}">
-        <navbar />
         <tags-view v-if="needTagsView" />
       </div>
       <app-main />
@@ -56,7 +56,7 @@ export default {
   },
   methods: {
     handleClickOutside() {
-      this.$store.dispatch('app/closeSideBar', { withoutAnimation: false })
+      // this.$store.dispatch('app/closeSideBar', { withoutAnimation: false })
     }
   }
 }

src/layout/mixin/ResizeHandler.js

@@ -7,7 +7,7 @@ export default {
   watch: {
     $route(route) {
       if (this.device === 'mobile' && this.sidebar.opened) {
-        store.dispatch('app/closeSideBar', { withoutAnimation: false })
+        // store.dispatch('app/closeSideBar', { withoutAnimation: false })
       }
     }
   },
@@ -20,8 +20,8 @@ export default {
   mounted() {
     const isMobile = this.$_isMobile()
     if (isMobile) {
-      store.dispatch('app/toggleDevice', 'mobile')
-      store.dispatch('app/closeSideBar', { withoutAnimation: true })
+      // store.dispatch('app/toggleDevice', 'mobile')
+      // store.dispatch('app/closeSideBar', { withoutAnimation: true })
     }
   },
   methods: {
@@ -34,10 +34,10 @@ export default {
     $_resizeHandler() {
       if (!document.hidden) {
         const isMobile = this.$_isMobile()
-        store.dispatch('app/toggleDevice', isMobile ? 'mobile' : 'desktop')
+        // store.dispatch('app/toggleDevice', isMobile ? 'mobile' : 'desktop')
 
         if (isMobile) {
-          store.dispatch('app/closeSideBar', { withoutAnimation: true })
+          // store.dispatch('app/closeSideBar', { withoutAnimation: true })
         }
       }
     }

src/settings.js

@@ -2,7 +2,7 @@ module.exports = {
   /**
    * 侧边栏主题 深色主题theme-dark，浅色主题theme-light
    */
-  sideTheme: 'theme-dark',
+  sideTheme: 'theme-light',
 
   /**
    * 是否系统布局配置

src/store/modules/app.js

@@ -11,26 +11,26 @@ const state = {
 }
 
 const mutations = {
-  TOGGLE_SIDEBAR: state => {
-    if (state.sidebar.hide) {
-      return false;
-    }
-    state.sidebar.opened = !state.sidebar.opened
-    state.sidebar.withoutAnimation = false
-    if (state.sidebar.opened) {
-      Cookies.set('sidebarStatus', 1)
-    } else {
-      Cookies.set('sidebarStatus', 0)
-    }
-  },
-  CLOSE_SIDEBAR: (state, withoutAnimation) => {
-    Cookies.set('sidebarStatus', 0)
-    state.sidebar.opened = false
-    state.sidebar.withoutAnimation = withoutAnimation
-  },
-  TOGGLE_DEVICE: (state, device) => {
-    state.device = device
-  },
+  // TOGGLE_SIDEBAR: state => {
+  //   if (state.sidebar.hide) {
+  //     return false;
+  //   }
+  //   state.sidebar.opened = !state.sidebar.opened
+  //   state.sidebar.withoutAnimation = false
+  //   if (state.sidebar.opened) {
+  //     Cookies.set('sidebarStatus', 1)
+  //   } else {
+  //     Cookies.set('sidebarStatus', 0)
+  //   }
+  // },
+  // CLOSE_SIDEBAR: (state, withoutAnimation) => {
+  //   Cookies.set('sidebarStatus', 0)
+  //   state.sidebar.opened = false
+  //   state.sidebar.withoutAnimation = withoutAnimation
+  // },
+  // TOGGLE_DEVICE: (state, device) => {
+  //   state.device = device
+  // },
   SET_SIZE: (state, size) => {
     state.size = size
     Cookies.set('size', size)
@@ -41,15 +41,15 @@ const mutations = {
 }
 
 const actions = {
-  toggleSideBar({ commit }) {
-    commit('TOGGLE_SIDEBAR')
-  },
-  closeSideBar({ commit }, { withoutAnimation }) {
-    commit('CLOSE_SIDEBAR', withoutAnimation)
-  },
-  toggleDevice({ commit }, device) {
-    commit('TOGGLE_DEVICE', device)
-  },
+  // toggleSideBar({ commit }) {
+  //   commit('TOGGLE_SIDEBAR')
+  // },
+  // closeSideBar({ commit }, { withoutAnimation }) {
+  //   commit('CLOSE_SIDEBAR', withoutAnimation)
+  // },
+  // toggleDevice({ commit }, device) {
+  //   commit('TOGGLE_DEVICE', device)
+  // },
   setSize({ commit }, size) {
     commit('SET_SIZE', size)
   },

src/views/login.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="login">
     <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form">
-      <h3 class="title">若依后台管理系统</h3>
+      <h3 class="title">云原生安全管理系统</h3>
       <el-form-item prop="username">
         <el-input
           v-model="loginForm.username"