fix:首页ui还原-部分

src/App.vue

@@ -24,4 +24,14 @@ export default {
     width: 150px;
   }
 }
+/*详情 */
+.detail-container{
+  .header{
+     height: 40px;
+     line-height: 40px;
+     display: flex;
+     justify-items:flex-end;
+     box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 0 3px 0 rgba(0, 0, 0, 0.04);
+  }
+}
 </style>

src/assets/styles/index.scss

@@ -24,6 +24,7 @@ html {
 
 #app {
   height: 100%;
+  background-color: #f5f5f5;
 }
 
 *,
@@ -122,6 +123,8 @@ aside {
 //main-container全局样式
 .app-container {
   padding: 20px;
+  background-color: #fff;
+  margin: 10px 10px;
 }
 
 .components-container {

src/assets/styles/sidebar.scss

@@ -10,12 +10,15 @@
   .sidebarHide {
     margin-left: 0!important;
   }
-
+ .theme-dark .is-active > .el-submenu__title{
+      border-left: 4px solid #49a3ff !important;
+ }
   .sidebar-container {
     -webkit-transition: width .28s;
     transition: width 0.28s;
     width: $base-sidebar-width !important;
     background-color: $base-menu-background;
+    // background: linear-gradient(to top, #e3f5fb, #ffffff);
     height: 100%;
     position: fixed;
     font-size: 0px;
@@ -80,7 +83,8 @@
     .submenu-title-noDropdown,
     .el-submenu__title {
       &:hover {
-        background-color: rgba(0, 0, 0, 0.06) !important;
+        background-color: #eaf2ff !important;
+        color: #44a0ff !important;
       }
     }
 
@@ -93,7 +97,8 @@
       min-width: $base-sidebar-width !important;
 
       &:hover {
-        background-color: rgba(0, 0, 0, 0.06) !important;
+               background-color: #eaf2ff !important;
+        color: #44a0ff !important;
       }
     }
 

src/assets/styles/variables.scss

@@ -9,17 +9,17 @@ $yellow:#FEC171;
 $panGreen: #30B08F;
 
 // 默认菜单主题风格
-$base-menu-color:#bfcbd9;
-$base-menu-color-active:#f4f4f5;
-$base-menu-background:#304156;
+$base-menu-color:#8c8c8c;
+$base-menu-color-active:#49a3ff;
+$base-menu-background:#ffffff;
 $base-logo-title-color: #ffffff;
 
-$base-menu-light-color:rgba(0,0,0,.70);
-$base-menu-light-background:#ffffff;
-$base-logo-light-title-color: #001529;
+$base-menu-light-color:#49a3ff;
+$base-menu-light-background:#eaf2ff;
+$base-logo-light-title-color: #49a3ff;
 
-$base-sub-menu-background:#1f2d3d;
-$base-sub-menu-hover:#001528;
+$base-sub-menu-background:#eaf2ff;
+$base-sub-menu-hover:#eaf2ff;
 
 // 自定义暗色菜单风格
 /**

src/components/ThemePicker/index.vue

@@ -1,7 +1,7 @@
 <template>
   <el-color-picker
     v-model="theme"
-    :predefine="['#409EFF', '#1890ff', '#304156','#212121','#11a983', '#13c2c2', '#6959CD', '#f5222d', ]"
+    :predefine="['#409EFF', '#1890ff', '#e7f7fd','#212121','#11a983', '#13c2c2', '#6959CD', '#f5222d', ]"
     class="theme-picker"
     popper-class="theme-picker-dropdown"
   />

src/lang/en.js

@@ -26,7 +26,7 @@ export default {
     qmyy:'签名意义',
     lock:'lock',
     unlock:'unlock',
-    detail:'detail',
+    detail:'Detail',
     gd:'归档',
   },
   menu: {

src/layout/components/AppMain.vue

@@ -47,7 +47,7 @@ export default {
 <style lang="scss" scoped>
 .app-main {
   /* 50= navbar  50  */
-  min-height: calc(100vh - 50px);
+  min-height: calc(100vh - 100px);
   width: 100%;
   position: relative;
   overflow: hidden;
@@ -56,7 +56,7 @@ export default {
 .fixed-header + .app-main {
   overflow-y: auto;
   scrollbar-gutter: auto;
-  height: calc(100vh - 50px);
+  height: calc(100vh - 100px);
   min-height: 0px;
 }
 
@@ -71,12 +71,12 @@ export default {
 .hasTagsView {
   .app-main {
     /* 84 = navbar + tags-view = 50 + 34 */
-    min-height: calc(100vh - 84px);
+    min-height: calc(100vh - 100px);
   }
 
   .fixed-header + .app-main {
     margin-top: 84px;
-    height: calc(100vh - 84px);
+    height: calc(100vh - 100px);
     min-height: 0px;
   }
 }

src/layout/components/Navbar.vue

@@ -1,40 +1,39 @@
 <template>
   <div class="navbar">
-    <hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
 
-    <breadcrumb v-if="!topNav" id="breadcrumb-container" class="breadcrumb-container" />
-    <top-nav v-if="topNav" id="topmenu-container" class="topmenu-container" />
+    <div class="navbar-header">
+      <div class="right-menu">
+        <template v-if="device !== 'mobile'">
 
-    
-    <div class="right-menu">
-      <template v-if="device!=='mobile'">
-
-        <!-- <screenfull id="screenfull" class="right-menu-item hover-effect" />
+          <!-- <screenfull id="screenfull" class="right-menu-item hover-effect" />
 
         <el-tooltip content="布局大小" effect="dark" placement="bottom">
           <size-select id="size-select" class="right-menu-item hover-effect" />
         </el-tooltip> -->
 
-      </template>
-
-      
-
-      <el-dropdown class="avatar-container right-menu-item hover-effect" trigger="hover">
-        <div class="avatar-wrapper">
-          <!-- <img :src="avatar" class="user-avatar"> -->
-          <span class="user-nickname"> {{ nickName }} </span>
-        </div>
-        <el-dropdown-menu slot="dropdown">
-          <router-link to="/user/profile">
-            <el-dropdown-item>{{ $t('login.profile') }}</el-dropdown-item>
-          </router-link>
-          <el-dropdown-item divided @click.native="logout">
-            <span>{{ $t('login.logOut') }}</span>
-          </el-dropdown-item>
-        </el-dropdown-menu>
-      </el-dropdown>
+        </template>
+        <el-dropdown class="avatar-container right-menu-item hover-effect" trigger="hover">
+          <div class="avatar-wrapper">
+            <img src="@/assets/images/profile.jpg" class="user-avatar">
+            <span class="user-nickname"> {{ nickName }} </span>
+          </div>
+          <el-dropdown-menu slot="dropdown">
+            <router-link to="/user/profile">
+              <el-dropdown-item>{{ $t('login.profile') }}</el-dropdown-item>
+            </router-link>
+            <el-dropdown-item divided @click.native="logout">
+              <span>{{ $t('login.logOut') }}</span>
+            </el-dropdown-item>
+          </el-dropdown-menu>
+        </el-dropdown>
+      </div>
+      <lang-select class="set-language" />
     </div>
-    <lang-select class="set-language" style="float: right;height: 100%;line-height: 50px;right: 10px;" />
+    <hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container"
+      @toggleClick="toggleSideBar" />
+
+    <breadcrumb v-if="!topNav" id="breadcrumb-container" class="breadcrumb-container" />
+    <top-nav v-if="topNav" id="topmenu-container" class="topmenu-container" />
   </div>
 </template>
 
@@ -97,7 +96,7 @@ export default {
         this.$store.dispatch('LogOut').then(() => {
           location.href = '/user/work'
         })
-      }).catch(() => {})
+      }).catch(() => { })
     }
   }
 }
@@ -105,11 +104,29 @@ export default {
 
 <style lang="scss" scoped>
 .navbar {
-  height: 50px;
+  // height: 50px;
   overflow: hidden;
   position: relative;
   background: #fff;
-  box-shadow: 0 1px 4px rgba(0,21,41,.08);
+
+  // box-shadow: 0 1px 4px rgba(0,21,41,.08);
+  .navbar-header {
+    background-image: url("../../assets/images/header.png");
+    background-size: cover;
+    background-repeat: no-repeat;
+    height: 50px;
+    line-height: 50px;
+    display: flex;
+    justify-content: flex-end;
+
+  }
+
+  .set-language {
+    float: right;
+    height: 100%;
+    line-height: 50px;
+    right: 10px;
+  }
 
   .hamburger-container {
     line-height: 46px;
@@ -117,7 +134,7 @@ export default {
     float: left;
     cursor: pointer;
     transition: background .3s;
-    -webkit-tap-highlight-color:transparent;
+    -webkit-tap-highlight-color: transparent;
 
     &:hover {
       background: rgba(0, 0, 0, .025)
@@ -142,6 +159,7 @@ export default {
     float: right;
     height: 100%;
     line-height: 50px;
+    padding-right: 20px;
 
     &:focus {
       outline: none;
@@ -181,7 +199,7 @@ export default {
           border-radius: 50%;
         }
 
-        .user-nickname{
+        .user-nickname {
           position: relative;
           bottom: 10px;
           left: 2px;

src/layout/components/Sidebar/Logo.vue

@@ -1,20 +1,23 @@
 <template>
-  <div class="sidebar-logo-container" :class="{'collapse':collapse}" :style="{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }">
+  <div class="sidebar-logo-container" :class="{ 'collapse': collapse }"
+    :style="{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }">
     <transition name="sidebarLogoFade">
       <router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="/">
         <img v-if="logo" :src="logo" class="sidebar-logo" />
-        <h1 v-else class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">{{ $t('system.title') }} </h1>
+        <h1 v-else class="sidebar-title"
+          :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">{{
+            $t('system.title') }} </h1>
       </router-link>
       <router-link v-else key="expand" class="sidebar-logo-link" to="/">
-        <img v-if="logo" :src="logo" class="sidebar-logo" />
-        <h1 class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">{{ $t('system.title') }} </h1>
+        <img v-if="logo" :src="logo" class="sidebar-expand-logo" />
+        <!-- <h1 class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">{{ $t('system.title') }} </h1> -->
       </router-link>
     </transition>
   </div>
 </template>
 
 <script>
-import logoImg from '@/assets/logo/logo.png'
+import logoImg from '@/assets/images/logo-header.png'
 import variables from '@/assets/styles/variables.scss'
 
 export default {
@@ -55,12 +58,16 @@ export default {
 .sidebar-logo-container {
   position: relative;
   width: 100%;
-  height: 50px;
+  height: 100px;
   line-height: 50px;
-  background: #2b2f3a;
+  background: #ffffff !important;
   text-align: center;
   overflow: hidden;
 
+  .sidebar-expand-logo {
+    margin-top: 18px;
+  }
+
   & .sidebar-logo-link {
     height: 100%;
     width: 100%;

src/layout/index.vue

@@ -5,7 +5,7 @@
     <div :class="{hasTagsView:needTagsView,sidebarHide:sidebar.hide}" class="main-container">
       <div :class="{'fixed-header':fixedHeader}">
         <navbar @setLayout="setLayout"/>
-        <tags-view v-if="needTagsView"/>
+        <!-- <tags-view v-if="needTagsView"/> -->
       </div>
       <app-main/>
       <settings ref="settingRef"/>

src/views/business/resource/mjy/comps/Gd.vue

@@ -8,12 +8,7 @@ G