优化面包屑导航过长时样式溢出

src/layout/components/Breadcrumb/index.vue

@@ -54,7 +54,6 @@ export default {
     display: flex;
     align-items: center;
     justify-content: space-between;
-    padding: 0 20px;
     height: $g-breadcrumb-height;
     background-color: #fff;
     transition: 0.3s;
@@ -65,10 +64,12 @@ export default {
     .left-box {
         display: flex;
         align-items: center;
+        padding-right: 50px;
+        overflow: hidden;
+        mask-image: linear-gradient(90deg, #000 0%, #000 calc(100% - 50px), transparent);
         .sidebar-collapse {
             display: flex;
             align-items: center;
-            margin-left: -20px;
             padding: 0 20px;
             height: 50px;
             cursor: pointer;
@@ -82,15 +83,21 @@ export default {
             &.is-collapse .svg-icon {
                 transform: rotateZ(-180deg);
             }
-        }
-    }
-    ::v-deep .el-breadcrumb {
-        .el-breadcrumb__item {
-            span {
-                font-weight: normal;
+            & + .el-breadcrumb {
+                margin-left: 0;
             }
-            &:last-child span {
-                color: #97a8be;
+        }
+        ::v-deep .el-breadcrumb {
+            margin-left: 20px;
+            white-space: nowrap;
+            .el-breadcrumb__item {
+                float: initial;
+                span {
+                    font-weight: normal;
+                }
+                &:last-child span {
+                    color: #97a8be;
+                }
             }
         }
     }

src/layout/components/UserMenu/index.vue

@@ -104,6 +104,8 @@ export default {
 .user {
     display: flex;
     align-items: center;
+    padding: 0 20px;
+    white-space: nowrap;
 }
 .tools {
     margin-right: 20px;

src/layout/index.vue

@@ -225,6 +225,7 @@ header {
         }
     }
     ::v-deep .user {
+        padding: 0;
         .user-container {
             color: #fff;
             font-size: 16px;

src/setting.js

@@ -37,8 +37,8 @@ let globalSettings = {
     enableThemeSetting: true
 }
 
-// 演示环境开启全部功能（这部分代码可删除，仅方便作者打包演示环境）
-if (process.env.VUE_APP_TYPE == 'example') {
+// 演示&开发环境开启全部功能（这部分代码可删除，仅方便作者打包演示环境）
+if (process.env.VUE_APP_TYPE == 'example' || process.env.NODE_ENV == 'development') {
     globalSettings.openPermission = true
     globalSettings.enableSidebarCollapse = true
     globalSettings.enableFullscreen = true