From 0905d4eaf3420f47db1a19c49413a157c65474f8 Mon Sep 17 00:00:00 2001
From: songshankun <songshankun@foxmail.com>
Date: 星期二, 17 十月 2023 18:36:01 +0800
Subject: [PATCH] style: 页头/侧边栏/页面布局 样式调整

---
 src/components/layout/components/appsidebar/index.scss |   42 +++++++++++++++++----
 src/assets/style/index.scss                            |   12 +++--
 vue.config.js                                          |    4 +-
 src/components/layout/components/appHeader/index.vue   |   17 +++++---
 src/components/layout/components/AppMain.vue           |    1 
 5 files changed, 53 insertions(+), 23 deletions(-)

diff --git a/src/assets/style/index.scss b/src/assets/style/index.scss
index ad72597..8899a6a 100644
--- a/src/assets/style/index.scss
+++ b/src/assets/style/index.scss
@@ -183,16 +183,18 @@
 
 .rightContent {
   height: 100%;
-  padding: 10px;
+  padding: 12px 20px 10px 20px;
   background: #e6ecf2;
   .top {
-    margin-bottom: 20px;
-    height: 60px;
+    margin-bottom: 10px;
+    height: 80px;
     background: #fff;
-    border-radius: 8px;
+    border-radius: 12px;
+    display: flex;
+    align-items: center;
   }
   .list-view {
-    height: calc(100% - 120px);
+    height: calc(100% - 92px);
     background: #fff;
     border-radius: 12px;
     .table {
diff --git a/src/components/layout/components/AppMain.vue b/src/components/layout/components/AppMain.vue
index d711451..4fd1095 100644
--- a/src/components/layout/components/AppMain.vue
+++ b/src/components/layout/components/AppMain.vue
@@ -24,7 +24,6 @@
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style lang="scss" scoped>
 .app-main {
-  margin-left: 10px;
   box-sizing: border-box;
   display: flex;
   flex: 1;
diff --git a/src/components/layout/components/appHeader/index.vue b/src/components/layout/components/appHeader/index.vue
index e83742e..5718bf9 100644
--- a/src/components/layout/components/appHeader/index.vue
+++ b/src/components/layout/components/appHeader/index.vue
@@ -37,15 +37,18 @@
 <style lang="scss" scoped>
 .sales-lead {
   display: flex;
-  height: 55px;
-  line-height: 55px;
-  background-color: #fff;
-  margin-bottom: 10px;
-  margin-left: -10px;
+  height: 50px;
+  line-height: 50px;
+  flex-shrink: 0;
+  box-sizing: border-box;
+  background-color: transparent;
+  border: 1px solid #ccc;
+  align-items: center;
   .header-title {
     margin-left: 16px;
-    font-size: 16px;
-    color: #475059;
+    font-size: 18px;
+    font-weight: 700;
+    color: #171718;
   }
   .header-user-info {
     margin-left: auto;
diff --git a/src/components/layout/components/appsidebar/index.scss b/src/components/layout/components/appsidebar/index.scss
index 42ced06..6a93335 100644
--- a/src/components/layout/components/appsidebar/index.scss
+++ b/src/components/layout/components/appsidebar/index.scss
@@ -3,10 +3,11 @@
   // height: 100%;
   background-color: #314255;
   .box {
-    width: 200px;
+    width: 187px;
     .logo-view {
       margin: 40px 20px 10px;
     }
+
     .el-menu {
       border-right: solid 0px #e6e6e6;
     }
@@ -16,12 +17,37 @@
     .icon {
       color: #bfcbd9;
     }
-    // .el-submenu__title:hover,
-    // .el-menu-item:focus,
-    // .el-menu-item:hover {
-    //   min-width: 180px;
-    //   color: #fff;
-    //   background-color: #2a78fb !important;
-    // }
+    .el-submenu__title:hover,
+    .el-menu-item:focus,
+    .el-menu-item:hover {
+      background-color: #011527 !important;
+    }
+
+    ::v-deep{
+      .el-menu .el-submenu .el-submenu__title:hover{
+        background-color: #011527 !important;
+      }
+    }
+
+    .el-submenu .el-menu-item {
+      width: 166px;
+      min-width: 166px;
+      height: 38px;
+      display: flex;
+      align-items: center;
+      margin-left: 11px;
+      border-radius: 6px;
+
+      &.is-active {
+        color: #fff !important;
+        flex-grow: 0;
+        fill: #fff !important;
+        background: #2a78fb !important;
+        i {
+          color: #fff;
+        }
+
+      }
+    }
   }
 }
diff --git a/vue.config.js b/vue.config.js
index fe24245..e91cfb3 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -30,13 +30,13 @@
     "crypto-js",
     "sockjs-client"
   ],
-  configureWebpack: (config) => {
+  configureWebpack: () => {
     const configNew = {}
     if (process.env.NODE_ENV === "production") {
       configNew.externals = externals
       configNew.plugins = []
     } else if (process.env.NODE_ENV === "development") {
-      console.log("development", config)
+      // console.log("development", config)
     }
     return configNew
   },

--
Gitblit v1.8.0