feat:上报和监管的项目区分

@@ -278,7 +278,7 @@ export default {
       let _this = this
       // 上报请求头修改
       try {
-        var headRes = await axios.post(urlHeader + 'edit', this.dataReport,
+        var headRes = await axios.post('/api' + urlHeader + 'edit', this.dataReport,
           {
             headers: {
               'Authorization': sessionStorage.getItem("token") || ""

+<!--
+ * @Description: 
+ * @Autor: renchao
+ * @LastEditTime: 2023-03-06 16:24:39
+-->
 <template>
   <div class="app-wrapper">
     <navbar />
@@ -28,8 +33,9 @@ export default {
   }
 }
 </script>
-<style lang="scss" scoped>
+<style lang="scss">
 @import "~@/styles/mixin.scss";
+@import "~@/styles/sidebar.scss";
 
 .app-wrapper {
   @include clearfix;

@@ -8,7 +8,7 @@
         <Breadcrumb />
       </div> -->
       <div class="right-menu">
-        <div class="dataView d-center pointer" @click="handleDataView">大屏展示</div>
+        <!-- <div class="dataView d-center pointer" @click="handleDataView">大屏展示</div> -->
         <el-dropdown class="avatar-container right-menu-item hover-effect" trigger="hover" @command="handleCommand">
           <div class="avatar-wrapper">
             <span style="padding-right:10px">{{ name }}</span>
@@ -24,10 +24,10 @@
   </div>
 </template>
 <script>
-  import { mapGetters } from 'vuex'
-  import Breadcrumb from './Breadcrumb'
-  import defaultSettings from '@/settings'
-  export default {
+import { mapGetters } from 'vuex'
+import Breadcrumb from './Breadcrumb'
+import defaultSettings from '@/settings'
+export default {
   components: {
     Breadcrumb
   },
@@ -54,10 +54,10 @@
       }
     }
   }
-  }
+}
 </script>
 <style lang="scss" scoped>
-  .navbar-con {
+.navbar-con {
   position: relative;
 
   .logo {
@@ -65,23 +65,23 @@
     font-size: 26px;
     font-weight: 700;
   }
-  }
+}
 
-  .dataView {
+.dataView {
   color: #fff;
   width: 120px;
   height: 32px;
   background: url("../../image/dp.png");
   background-size: cover;
   margin-right: 20px;
-  }
+}
 
-  .NoticeBar {
+.NoticeBar {
   position: absolute;
   bottom: 0;
-  }
+}
 
-  .el-dropdown-menu {
+.el-dropdown-menu {
   padding: 0 !important;
   border: 1px solid #ebeef5;
   box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.12);
@@ -114,9 +114,9 @@
     background: #f6f7f9;
     color: #4a4a4a;
   }
-  }
+}
 
-  .navbar {
+.navbar {
   height: $headerHeight;
   overflow: hidden;
   position: relative;
@@ -246,5 +246,5 @@
       }
     }
   }
-  }
+}
 </style>

+<!--
+ * @Description: 
+ * @Autor: renchao
+ * @LastEditTime: 2023-03-06 16:18:21
+-->
 <template>
   <div>
     <el-scrollbar wrap-class="scrollbar-wrapper">
       <el-menu router :default-active="activeMenu" :background-color="variables.menuBg" :text-color="variables.menuText"
         :unique-opened="true" :active-text-color="variables.menuActiveText" :collapse-transition="false" mode="vertical">
         <!-- 权限菜单 -->
-        <sidebar-item v-for="route in permission_routes" :key="route.path" :item="route" :base-path="route.path" />
+        <sidebar-item v-for="route in permission_routes.slice(3)" :key="route.path" :item="route"
+          :base-path="route.path" />
         <!-- 菜单全部展示 -->
         <!-- <sidebar-item v-for="route in asyncRoutes" :key="route.path" :item="route" :base-path="route.path" /> -->
       </el-menu>
@@ -13,20 +19,22 @@
 </template>
 
 <script>
-  import { mapGetters } from 'vuex'
-  import Logo from './Logo'
-  import defaultSettings from '@/settings'
-  import SidebarItem from './SidebarItem'
-  import variables from '@/styles/variables.scss'
-  import { asyncRoutes } from '@/router'
-  export default {
+import { mapGetters } from 'vuex'
+import Logo from './Logo'
+import defaultSettings from '@/settings'
+import SidebarItem from './SidebarItem'
+import variables from '@/styles/variables.scss'
+import { asyncRoutes } from '@/router'
+export default {
   components: { SidebarItem, Logo },
   data () {
     return {
       title: defaultSettings.title
     }
   },
-
+  created () {
+    console.log(this.permission_routes);
+  },
   computed: {
     ...mapGetters(['permission_routes', 'sidebar']),
     activeMenu () {
@@ -44,5 +52,5 @@
       return asyncRoutes
     }
   }
-  }
+}
 </script>
\ No newline at end of file

+<!--
+ * @Description: 
+ * @Autor: renchao
+ * @LastEditTime: 2023-03-06 16:23:31
+-->
 <template>
-  <div class="app-wrapper">
+  <div class="app-wrapper scWrapper">
     <navbar />
     <div class="main-container">
       <sidebar class="sidebar-container" />
@@ -29,8 +34,9 @@ export default {
   }
 }
 </script>
-<style lang="scss" scoped>
+<style lang="scss">
 @import "~@/styles/mixin.scss";
+@import '~@/styles/sbSidebar.scss';
 
 .app-wrapper {
   @include clearfix;

@@ -2,7 +2,7 @@
 @import './mixin.scss';
 @import './transition.scss';
 @import './element-ui.scss';
-@import './sidebar.scss';
+// @import './sidebar.scss';
 
 /* CSS 初始化 */
 html,

+.scWrapper {
+  .main-container {
+    width: 100%;
+    height: calc(100% - 84px);
+    transition: margin-left 0.28s;
+    display: flex;
+    background-color: $containerbg;
+  }
+
+  .sidebar-container {
+    transition: width 0.28s;
+    width: $sideBarWidth !important;
+    font-size: 0px;
+    margin-right: 15px;
+
+    .horizontal-collapse-transition {
+      transition: 0s width ease-in-out, 0s padding-left ease-in-out,
+        0s padding-right ease-in-out;
+    }
+
+    .scrollbar-wrapper {
+      overflow-x: hidden !important;
+      margin-right: 0 !important;
+
+      &::-webkit-scrollbar {
+        display: none;
+      }
+    }
+
+    a {
+      display: inline-block;
+      width: 100%;
+      overflow: hidden;
+    }
+
+    .svg-icon {
+      margin-right: 5px;
+    }
+
+    .sub-el-icon {
+      margin-right: 12px;
+      margin-left: -2px;
+    }
+
+    .el-menu {
+      background-color: transparent !important;
+      border: none;
+      height: 100%;
+      width: 100% !important;
+    }
+
+    // menu hover
+    .el-menu--collapse .el-submenu__title,
+    .el-menu--collapse .submenu-title-noDropdown {
+      margin-left: 0px !important;
+    }
+
+    // 有子级
+    .el-submenu__title {
+      padding-left: 10px !important;
+      color: $menuText;
+      height: 42px;
+      background: linear-gradient(90deg, #013874 0%, #081B56 100%);
+      margin-bottom: 8px;
+
+      &:hover {
+        color: $subMenuActiveText !important;
+        background: linear-gradient(90deg, #1D66DC 0%, #081B56 100%);
+
+        .svg-icon,
+        i,
+        span {
+          color: $subMenuActiveText !important;
+        }
+      }
+    }
+
+    // 没有子级
+    .submenu-title-noDropdown {
+      color: $menuText;
+      padding-left: 20px;
+      margin-bottom: 8px;
+      background: linear-gradient(90deg, #013874 0%, #081B56 100%);
+
+      &:hover {
+        color: $menuActiveText !important;
+        background: linear-gradient(90deg, #1D66DC 0%, #081B56 100%);
+
+        .svg-icon {
+          color: #1ea6f8 !important;
+        }
+
+        i {
+          color: #1ea6f8 !important;
+        }
+      }
+    }
+
+    .submenu-title-noDropdown.is-active,
+    .el-submenu__title.is-active {
+      color: $menuActiveText;
+      background: linear-gradient(90deg, #1D66DC 0%, #081B56 100%);
+
+      .svg-icon {
+        color: #1ea6f8 !important;
+      }
+
+      i {
+        color: #1ea6f8 !important;
+      }
+    }
+
+    .submenu-title-noDropdown,
+    .el-submenu__title {
+      font-weight: 600;
+      font-size: $sideBarFontSize;
+
+      // margin: 0 10px;
+      >i {
+        color: $subMenuActiveText !important;
+        transform: rotate(90deg);
+        -webkit-transform: rotate(90deg);
+        -moz-transform: rotate(90deg);
+        -ms-transform: rotate(90deg);
+        -o-transform: rotate(90deg);
+        margin-right: 10px;
+      }
+
+      .svg-icon {
+        font-size: 18px;
+        margin-top: -5px;
+      }
+    }
+
+    .el-submenu.is-opened>.el-submenu__title .el-submenu__icon-arrow {
+      transform: rotateZ(0deg) !important;
+      -webkit-transform: rotateZ(0deg) !important;
+      -moz-transform: rotateZ(0deg) !important;
+      -ms-transform: rotateZ(0deg) !important;
+      -o-transform: rotateZ(0deg) !important;
+    }
+
+    .is-active>.el-submenu__title {
+      color: #fff !important;
+    }
+
+    & .nest-menu .el-submenu>.el-submenu__title,
+    & .el-submenu .el-menu-item {
+      &.is-active {
+        background-color: $subMenuHover !important;
+        color: $menuActiveText !important;
+      }
+
+      &:hover {
+        background-color: $subMenuHover !important;
+        color: $menuActiveText !important;
+      }
+
+      min-width: 130px !important;
+      background-color: transparent !important;
+      font-weight: 600;
+      font-size: $sideBarFontSize;
+      margin: 0 10px;
+      // border-radius: 6px;
+    }
+  }
+  
+  .hideSidebar {
+    .sidebar-container {
+      width: 54px !important;
+    }
+
+    .submenu-title-noDropdown {
+      padding: 0 !important;
+      position: relative;
+
+      .el-tooltip {
+        padding: 0 !important;
+
+        .svg-icon {
+          margin-left: 16px;
+        }
+
+        .sub-el-icon {
+          margin-left: 19px;
+        }
+      }
+    }
+
+    .el-submenu {
+      overflow: hidden;
+
+      &>.el-submenu__title {
+        padding: 0 !important;
+
+        .svg-icon {
+          margin-left: 16px;
+        }
+
+        .sub-el-icon {
+          margin-left: 19px;
+        }
+
+        .el-submenu__icon-arrow {
+          display: none;
+        }
+      }
+    }
+
+    .el-menu--collapse {
+      .el-submenu {
+        &>.el-submenu__title {
+          &>span {
+            height: 0;
+            width: 0;
+            overflow: hidden;
+            visibility: hidden;
+            display: inline-block;
+          }
+        }
+      }
+    }
+  }
+
+  .el-menu--collapse .el-menu .el-submenu {
+    min-width: $sideBarWidth !important;
+  }
+
+  // mobile responsive
+  .mobile {
+    .main-container {
+      margin-left: 0px;
+    }
+
+    .sidebar-container {
+      transition: transform 0.28s;
+      width: $sideBarWidth !important;
+    }
+
+    &.hideSidebar {
+      .sidebar-container {
+        pointer-events: none;
+        transition-duration: 0.3s;
+        transform: translate3d(-$sideBarWidth, 0, 0);
+      }
+    }
+  }
+
+  .withoutAnimation {
+
+    .main-container,
+    .sidebar-container {
+      transition: none;
+    }
+  }
+}
+
+// when menu collapsed
+.el-menu--vertical {
+  &>.el-menu {
+    .svg-icon {
+      margin-right: 16px;
+    }
+
+    .sub-el-icon {
+      margin-right: 12px;
+      margin-left: -2px;
+    }
+  }
+
+  .nest-menu .el-submenu>.el-submenu__title,
+  .el-menu-item {
+    width: calc(100% - 12px);
+    border-top-right-radius: 8px;
+    border-bottom-right-radius: 8px;
+    font-weight: 600 !important;
+    font-size: 15px !important;
+    background-color: $menuHover !important;
+    color: $menuText !important;
+
+    &:hover {
+      background-color: $menuHover !important;
+      opacity: .9;
+
+      .svg-icon,
+      i,
+      span {
+        color: $menuText;
+      }
+    }
+  }
+
+  // the scroll bar appears when the subMenu is too long
+  >.el-menu--popup {
+    max-height: 100vh;
+    overflow-y: auto;
+    background-color: #32ACFE !important;
+    border-top-right-radius: 8px;
+    border-bottom-right-radius: 8px;
+    min-width: 140px;
+    padding: 12px 0;
+
+    &::-webkit-scrollbar-track-piece {
+      background: #d3dce6;
+    }
+
+    &::-webkit-scrollbar {
+      width: 6px;
+    }
+
+    &::-webkit-scrollbar-thumb {
+      background: #99a9bf;
+      border-radius: 20px;
+    }
+  }
+}
+
+.el-submenu__title {
+  display: flex;
+  align-items: center;
+}
+
+.el-submenu__title span {
+  white-space: normal;
+  word-break: break-all;
+  line-height: 20px;
+  flex: 1;
+  padding-right: 20px;
+}
+
+.el-menu-item {
+  height: 42px;
+  display: flex;
+  align-items: center;
+  padding-right: 20px !important;
+}
+
+.el-menu-item span {
+  white-space: normal;
+  word-break: break-all;
+  line-height: 20px;
+  flex: 1;
+}
\ No newline at end of file