调整全局样式

attendance-performance-manager-ui/admin/src/assets/less/base.less

@@ -13,7 +13,7 @@ html * {
 
 html,
 body {
-  // height: 100vh;
+  // height: 100%;
   // min-height: 100%;
   font-family: "Microsoft Yahei", "Helvetica Neue", Helvetica, STHeiTi, Arial,
     sans-serif;

attendance-performance-manager-ui/admin/src/views/Layout.vue

 <template>
   <div :style="menuPageCss" class="pages page-layout">
-    <LayoutHeader
-      v-if="menuPage !== 'left'"
-      @changePath="changePath"
-    ></LayoutHeader>
-    <LayoutHeaderLeft
-      @toggle="toggle"
-      :isOpen="isOpen"
-      v-if="menuPage === 'left'"
-    />
+    <LayoutHeader v-if="menuPage !== 'left'" @changePath="changePath"></LayoutHeader>
+    <LayoutHeaderLeft @toggle="toggle" :isOpen="isOpen" v-if="menuPage === 'left'" />
     <div class="layout">
       <router-view :class="{ active: !isOpen }" />
     </div>
@@ -57,10 +50,12 @@ export default {
 </script>
 
 <style lang="less">
-.layout{
-  padding: 15px 15px 0 15px ;
+.layout {
+  padding: 15px 15px 0 15px;
   box-sizing: border-box;
+
 }
+
 .page {
   min-height: calc(100vh - 100px);
   width: 100%;
@@ -69,12 +64,32 @@ export default {
   // var(--padding-top) 5px 5px 5px;
   // margin-left: 60px;
   padding: 10px;
+
   &.active {
     margin-left: var(--margin-left);
   }
 }
+
 .page-layout {
   background: #eee;
+  height: 100vh;
+  overflow: auto;
 }
 
+/* 侧边滚动条 */
+.page-layout::-webkit-scrollbar {
+  width: 3px;
+}
+
+/* 滚动条上的滚动滑块 */
+.page-layout::-webkit-scrollbar-thumb {
+  background: #CCCCCC;
+  border-radius: 4px;
+}
+
+/* 滚动条轨道 */
+.page-layout::-webkit-scrollbar-track {
+  background: #EEEEEE;
+  border-radius: 4px;
+}
 </style>