-

src/assets/css/index.scss

@@ -133,7 +133,7 @@ ul li {
     // margin: 20px;
     // margin-top: 70px;
     background: #fff;
-    min-height: calc(100vh - 130px)
+    min-height: calc(100vh - 142px)
 }
 
 .filter-container {

src/config/default/theme.config.js

@@ -2,27 +2,27 @@
  * @description 导出默认主题配置
  */
 const theme = {
-  //布局种类 horizontal vertical gallery comprehensive common
-  layout: 'horizontal',
-  //主题名称 default ocean green glory white
-  themeName: 'default',
-  //是否固定头部
-  fixedHeader: true,
-  //是否显示顶部进度条
-  showProgressBar: true,
-  //是否显示多标签页
-  showTabsBar: true,
-  //是否显示语言选择组件
-  showLanguage: true,
-  //是否显示刷新组件
-  showRefresh: true,
-  //是否显示搜索组件
-  showSearch: true,
-  //是否显示主题组件
-  showTheme: true,
-  //是否显示通知组件
-  showNotice: true,
-  //是否显示全屏组件
-  showFullScreen: true,
+    //布局种类 horizontal vertical gallery comprehensive common
+    layout: 'horizontal',
+    //主题名称 default ocean green glory white
+    themeName: 'default',
+    //是否固定头部
+    fixedHeader: true,
+    //是否显示顶部进度条
+    showProgressBar: true,
+    //是否显示多标签页
+    showTabsBar: true,
+    //是否显示语言选择组件
+    showLanguage: true,
+    //是否显示刷新组件
+    showRefresh: true,
+    //是否显示搜索组件
+    showSearch: true,
+    //是否显示主题组件
+    showTheme: true,
+    //是否显示通知组件
+    showNotice: true,
+    //是否显示全屏组件
+    showFullScreen: true,
 }
-module.exports = theme
+module.exports = theme

src/icons/svgIcon/deviceManage.svg

@@ -1,7 +1 @@
-<svg 
- xmlns="http://www.w3.org/2000/svg"
- xmlns:xlink="http://www.w3.org/1999/xlink"
- width="16px" height="13px">
-<path fill-rule="evenodd"
- d="M14.698,13.000 L1.302,13.000 C0.583,13.000 -0.001,12.434 -0.001,11.736 L-0.001,8.486 C-0.001,7.788 0.583,7.222 1.302,7.222 L14.698,7.222 C15.417,7.222 16.000,7.788 16.000,8.486 L16.000,11.736 C16.000,12.434 15.417,13.000 14.698,13.000 ZM14.884,8.486 C14.884,8.386 14.801,8.306 14.698,8.306 L1.302,8.306 C1.199,8.306 1.116,8.386 1.116,8.486 L1.116,11.736 C1.116,11.836 1.199,11.917 1.302,11.917 L14.698,11.917 C14.801,11.917 14.884,11.836 14.884,11.736 L14.884,8.486 ZM13.209,10.653 C12.798,10.653 12.465,10.329 12.465,9.930 C12.465,9.532 12.798,9.208 13.209,9.208 C13.620,9.208 13.954,9.532 13.954,9.930 C13.954,10.329 13.620,10.653 13.209,10.653 ZM14.698,5.778 L1.302,5.778 C0.583,5.778 -0.001,5.212 -0.001,4.514 L-0.001,1.264 C-0.001,0.566 0.583,-0.000 1.302,-0.000 L14.698,-0.000 C15.417,-0.000 16.000,0.566 16.000,1.264 L16.000,4.514 C16.000,5.212 15.417,5.778 14.698,5.778 ZM14.884,1.264 C14.884,1.164 14.801,1.083 14.698,1.083 L1.302,1.083 C1.199,1.083 1.116,1.164 1.116,1.264 L1.116,4.514 C1.116,4.614 1.199,4.694 1.302,4.694 L14.698,4.694 C14.801,4.694 14.884,4.614 14.884,4.514 L14.884,1.264 ZM2.790,3.431 C2.379,3.431 2.046,3.107 2.046,2.708 C2.046,2.708 2.046,2.708 2.046,2.708 C2.046,2.309 2.379,1.986 2.791,1.986 C3.202,1.986 3.535,2.309 3.534,2.708 C3.534,2.708 3.534,2.709 3.534,2.709 C3.534,3.108 3.201,3.431 2.790,3.431 Z"/>
-</svg>
+<svg 
 xmlns="http://www.w3.org/2000/svg"
 xmlns:xlink="http://www.w3.org/1999/xlink"
 width="14px" height="13px">
<path fill-rule="evenodd"  fill="rgb(51, 51, 51)"
 d="M13.066,13.000 L0.933,13.000 C0.418,13.000 0.000,12.569 0.000,12.037 L0.000,8.241 C0.000,8.167 0.008,8.092 0.025,8.019 L1.692,0.742 C1.792,0.307 2.168,0.000 2.601,0.000 L11.389,0.000 C11.822,0.000 12.197,0.307 12.297,0.741 L13.975,8.019 C13.991,8.092 14.000,8.166 14.000,8.241 L14.000,12.037 C14.000,12.569 13.582,13.000 13.066,13.000 ZM6.533,0.963 L2.601,0.963 L0.946,8.185 L6.560,8.185 C6.547,8.141 6.533,8.096 6.533,8.047 L6.533,6.741 C6.535,6.685 6.545,6.630 6.565,6.578 C4.990,6.431 3.733,5.498 3.733,4.263 C3.733,3.037 4.974,2.109 6.533,1.952 L6.533,0.963 ZM4.667,4.263 C4.667,4.966 5.679,5.637 7.000,5.637 C8.321,5.637 9.333,4.966 9.333,4.263 C9.333,3.560 8.321,2.889 7.000,2.889 C5.679,2.889 4.667,3.560 4.667,4.263 ZM11.389,0.963 L7.467,0.963 L7.467,1.952 C9.026,2.109 10.267,3.037 10.267,4.263 C10.267,5.498 9.009,6.430 7.435,6.578 C7.453,6.629 7.467,6.683 7.467,6.741 L7.467,8.047 C7.467,8.096 7.453,8.141 7.439,8.185 L13.053,8.185 L11.389,0.963 ZM13.066,9.148 L0.933,9.148 L0.933,12.037 L13.066,12.037 L13.066,9.148 ZM2.333,10.111 L11.666,10.111 C11.924,10.111 12.133,10.327 12.133,10.592 C12.133,10.858 11.924,11.074 11.666,11.074 L2.333,11.074 C2.076,11.074 1.867,10.858 1.867,10.592 C1.867,10.327 2.076,10.111 2.333,10.111 Z"/>
</svg>

src/icons/svgIcon/home.svg

@@ -1 +1 @@
-<svg class="icon" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="200" height="200"><defs><style/></defs><path d="M896 192v73.6l64 54.4V160c0-19.2-12.8-32-32-32H736l73.6 64H896zM544 64h-64L0 480v32c0 19.2 12.8 32 32 32h96v384c0 19.2 12.8 32 32 32h256c19.2 0 32-12.8 32-32V640h128v288c0 19.2 12.8 32 32 32h256c19.2 0 32-12.8 32-32V544h96c19.2 0 32-12.8 32-32v-32L544 64zm320 416c-19.2 0-32 12.8-32 32v384H640V608c0-19.2-12.8-32-32-32H416c-19.2 0-32 12.8-32 32v288H192V512c0-19.2-12.8-32-32-32h-57.6L512 128l409.6 352H864z"/></svg>
+<svg 
 xmlns="http://www.w3.org/2000/svg"
 xmlns:xlink="http://www.w3.org/1999/xlink"
 width="14px" height="14px">
<path fill-rule="evenodd"  fill="rgb(51, 51, 51)"
 d="M13.987,1.482 C13.926,1.213 13.663,1.046 13.400,1.108 L10.850,1.712 C10.587,1.774 10.423,2.043 10.484,2.312 C10.504,2.400 10.547,2.481 10.608,2.546 L11.165,3.135 L8.192,5.847 L6.648,4.352 C6.452,4.163 6.144,4.171 5.958,4.370 L2.645,7.921 C2.116,7.808 1.598,8.155 1.488,8.695 C1.377,9.236 1.716,9.766 2.245,9.879 C2.774,9.992 3.292,9.645 3.403,9.104 C3.416,9.037 3.423,8.969 3.423,8.900 C3.423,8.792 3.402,8.689 3.371,8.592 L6.329,5.421 L7.845,6.889 C8.030,7.068 8.317,7.072 8.507,6.899 L11.845,3.855 L12.479,4.527 C12.667,4.725 12.976,4.731 13.171,4.539 C13.234,4.476 13.280,4.396 13.303,4.309 L13.982,1.725 C14.003,1.645 14.005,1.562 13.987,1.482 L13.987,1.482 ZM13.204,6.038 C12.934,6.038 12.715,6.262 12.715,6.538 L12.715,10.500 C12.715,10.776 12.496,11.000 12.226,11.000 L1.467,11.000 C1.197,11.000 0.978,10.776 0.978,10.500 L0.978,1.500 C0.978,1.224 1.197,1.000 1.467,1.000 L9.577,1.000 C9.847,1.000 10.066,0.776 10.066,0.500 C10.066,0.224 9.847,-0.000 9.577,-0.000 L1.467,-0.000 C0.657,-0.000 0.000,0.672 0.000,1.500 L0.000,10.500 C0.000,11.328 0.657,12.000 1.467,12.000 L12.226,12.000 C13.036,12.000 13.693,11.328 13.693,10.500 L13.693,6.538 C13.693,6.262 13.474,6.038 13.204,6.038 ZM12.960,13.000 L0.734,13.000 C0.463,13.000 0.245,13.224 0.245,13.500 C0.245,13.776 0.463,14.000 0.734,14.000 L12.960,14.000 C13.230,14.000 13.449,13.776 13.449,13.500 C13.449,13.224 13.230,13.000 12.960,13.000 Z"/>
</svg>

src/icons/svgIcon/planOutage.svg

@@ -1,7 +1 @@
-<svg 
- xmlns="http://www.w3.org/2000/svg"
- xmlns:xlink="http://www.w3.org/1999/xlink"
- width="16px" height="16px">
-<path fill-rule="evenodd" 
- d="M14.545,-0.000 C15.349,-0.000 16.000,0.651 16.000,1.455 L16.000,14.545 C16.000,15.349 15.349,16.000 14.545,16.000 L1.454,16.000 C0.651,16.000 -0.000,15.349 -0.000,14.545 L-0.000,1.455 C-0.000,0.651 0.651,-0.000 1.454,-0.000 L14.545,-0.000 ZM14.545,1.455 L1.454,1.455 L1.454,14.545 L14.545,14.545 L14.545,1.455 ZM5.091,8.727 C6.296,8.727 7.273,9.704 7.273,10.909 C7.273,12.114 6.296,13.091 5.091,13.091 C3.886,13.091 2.909,12.114 2.909,10.909 C2.909,9.704 3.886,8.727 5.091,8.727 ZM13.091,10.182 L13.091,11.636 L8.727,11.636 L8.727,10.182 L13.091,10.182 ZM5.091,10.182 C4.689,10.182 4.364,10.507 4.364,10.909 C4.364,11.311 4.689,11.636 5.091,11.636 C5.493,11.636 5.818,11.311 5.818,10.909 C5.818,10.507 5.493,10.182 5.091,10.182 ZM6.633,3.548 L7.663,4.577 L4.577,7.662 L2.519,5.605 L3.548,4.577 L4.577,5.605 L6.633,3.549 L6.633,3.548 ZM13.091,5.091 L13.091,6.545 L8.727,6.545 L8.727,5.091 L13.091,5.091 Z"/>
-</svg>
+<svg 
 xmlns="http://www.w3.org/2000/svg"
 xmlns:xlink="http://www.w3.org/1999/xlink"
 width="14px" height="13px">
<path fill-rule="evenodd"  fill="rgb(51, 51, 51)"
 d="M11.999,0.001 L10.499,0.001 L9.499,0.001 L4.500,0.001 L3.500,0.001 L1.999,0.001 C0.900,0.001 -0.000,0.902 -0.000,2.001 L-0.000,11.001 C-0.000,12.100 0.900,13.000 1.999,13.000 L12.001,13.000 C13.100,13.000 14.000,12.100 14.000,11.001 L14.000,2.001 C14.000,0.902 13.100,0.001 12.001,0.001 L11.999,0.001 ZM12.999,11.001 C12.994,11.555 12.547,12.002 11.999,12.000 L1.998,12.000 C1.450,12.002 1.004,11.555 0.999,11.001 L0.999,2.001 C0.999,1.450 1.447,1.001 1.998,1.001 L12.001,1.001 C12.552,1.001 13.000,1.450 13.000,2.001 L13.000,11.001 L12.999,11.001 ZM9.430,6.091 L5.717,6.091 L7.129,4.075 L8.042,2.773 C8.420,2.235 7.665,1.705 7.287,2.245 L7.129,2.469 L4.452,6.287 C4.243,6.584 4.466,7.014 4.828,7.014 L8.542,7.014 L7.129,9.030 L6.217,10.331 C5.839,10.871 6.593,11.400 6.970,10.860 L7.129,10.635 L9.807,6.817 C10.016,6.520 9.794,6.091 9.429,6.091 L9.430,6.091 Z"/>
</svg>

src/icons/svgIcon/powerQuality.svg

@@ -1,7 +1 @@
-<svg 
- xmlns="http://www.w3.org/2000/svg"
- xmlns:xlink="http://www.w3.org/1999/xlink"
- width="13px" height="16px">
-<path fill-rule="evenodd"
- d="M6.882,3.293 L5.633,5.759 C5.424,6.170 5.407,6.653 5.587,7.078 C5.767,7.504 6.123,7.823 6.563,7.954 L10.058,8.995 L5.035,12.758 L6.053,11.146 C6.311,10.736 6.367,10.240 6.204,9.784 C6.041,9.329 5.685,8.981 5.228,8.834 L1.801,7.727 L6.882,3.293 M9.103,-0.000 C9.011,-0.000 8.916,0.032 8.830,0.106 L0.145,7.690 C-0.106,7.908 -0.021,8.320 0.292,8.421 L4.891,9.905 C5.156,9.990 5.268,10.306 5.119,10.541 L2.088,15.338 C1.890,15.650 2.144,15.999 2.444,15.999 C2.526,15.999 2.614,15.973 2.694,15.912 L11.830,9.066 C12.110,8.857 12.031,8.414 11.698,8.312 L6.877,6.876 C6.622,6.800 6.500,6.509 6.621,6.272 L9.480,0.626 C9.641,0.310 9.387,-0.000 9.103,-0.000 Z"/>
-</svg>
+<svg 
 xmlns="http://www.w3.org/2000/svg"
 xmlns:xlink="http://www.w3.org/1999/xlink"
 width="14px" height="12px">
<path fill-rule="evenodd"  fill="rgb(51, 51, 51)"
 d="M11.900,12.000 L7.233,12.000 L6.533,12.000 L-0.000,12.000 L-0.000,0.001 L4.200,0.001 L4.900,0.001 L9.100,0.001 L9.800,0.001 L14.000,0.001 L14.000,12.000 L11.900,12.000 ZM2.100,0.924 L0.700,0.924 L0.700,11.077 L2.100,11.077 L2.100,0.924 ZM11.200,0.924 L2.800,0.924 L2.800,11.077 L11.200,11.077 L11.200,0.924 ZM13.300,0.924 L11.900,0.924 L11.900,11.077 L13.300,11.077 L13.300,0.924 ZM7.469,5.846 L8.867,5.846 L6.767,8.924 L6.764,5.848 L5.365,5.848 L7.466,2.772 L7.469,5.846 L7.469,5.846 Z"/>
</svg>

src/icons/svgIcon/stationManage.svg

@@ -1,7 +1 @@
-<svg 
- xmlns="http://www.w3.org/2000/svg"
- xmlns:xlink="http://www.w3.org/1999/xlink"
- width="16px" height="16px">
-<path fill-rule="evenodd"
- d="M13.333,10.667 L10.667,10.667 L10.667,13.333 C10.667,14.806 9.473,16.000 8.000,16.000 L2.667,16.000 C1.194,16.000 -0.000,14.806 -0.000,13.333 L-0.000,8.000 C-0.000,6.527 1.194,5.333 2.667,5.333 L5.333,5.333 L5.333,2.667 C5.333,1.194 6.527,-0.000 8.000,-0.000 L13.333,-0.000 C14.806,-0.000 16.000,1.194 16.000,2.667 L16.000,8.000 C16.000,9.473 14.806,10.667 13.333,10.667 ZM2.667,6.667 C1.930,6.667 1.333,7.264 1.333,8.000 L1.333,13.333 C1.333,14.070 1.930,14.667 2.667,14.667 L8.000,14.667 C8.736,14.667 9.333,14.070 9.333,13.333 L9.333,10.667 L8.000,10.667 C6.527,10.667 5.333,9.473 5.333,8.000 L5.333,6.667 L2.667,6.667 ZM9.333,9.333 L9.333,8.000 C9.333,7.264 8.736,6.667 8.000,6.667 L6.667,6.667 L6.667,8.000 C6.667,8.736 7.264,9.333 8.000,9.333 L9.333,9.333 ZM14.667,2.667 C14.667,1.930 14.070,1.333 13.333,1.333 L8.000,1.333 C7.264,1.333 6.667,1.930 6.667,2.667 L6.667,5.333 L8.000,5.333 C9.473,5.333 10.667,6.527 10.667,8.000 L10.667,9.333 L13.333,9.333 C14.070,9.333 14.667,8.736 14.667,8.000 L14.667,2.667 Z"/>
-</svg>
+<svg 
 xmlns="http://www.w3.org/2000/svg"
 xmlns:xlink="http://www.w3.org/1999/xlink"
 width="14px" height="14px">
<path fill-rule="evenodd"  fill="rgb(51, 51, 51)"
 d="M11.667,9.333 L9.333,9.333 L9.333,11.667 C9.333,12.955 8.289,14.000 7.000,14.000 L2.333,14.000 C1.045,14.000 0.000,12.955 0.000,11.667 L0.000,7.000 C0.000,5.711 1.045,4.667 2.333,4.667 L4.667,4.667 L4.667,2.333 C4.667,1.045 5.711,0.000 7.000,0.000 L11.667,0.000 C12.955,0.000 14.000,1.045 14.000,2.333 L14.000,7.000 C14.000,8.289 12.955,9.333 11.667,9.333 ZM2.333,5.833 C1.689,5.833 1.167,6.356 1.167,7.000 L1.167,11.667 C1.167,12.311 1.689,12.833 2.333,12.833 L7.000,12.833 C7.644,12.833 8.167,12.311 8.167,11.667 L8.167,9.333 L7.000,9.333 C5.711,9.333 4.667,8.289 4.667,7.000 L4.667,5.833 L2.333,5.833 ZM8.167,8.167 L8.167,7.000 C8.167,6.356 7.644,5.833 7.000,5.833 L5.833,5.833 L5.833,7.000 C5.833,7.644 6.356,8.167 7.000,8.167 L8.167,8.167 ZM12.833,2.333 C12.833,1.689 12.311,1.167 11.667,1.167 L7.000,1.167 C6.356,1.167 5.833,1.689 5.833,2.333 L5.833,4.667 L7.000,4.667 C8.289,4.667 9.333,5.711 9.333,7.000 L9.333,8.167 L11.667,8.167 C12.311,8.167 12.833,7.644 12.833,7.000 L12.833,2.333 Z"/>
</svg>

src/layout/index.vue

@@ -1,10 +1,27 @@
 <template>
   <a-layout class="vab-layout-wrap">
+    <!-- 顶部横向排版 start -->
+    <div>
+      <a-layout-header class="vab-header">
+        <a-row>
+          <a-col :xs="10" :sm="10" :md="10" :lg="10" :xl="10">
+             <vab-logo />
+          </a-col>
+          <a-col :xs="14" :sm="14" :md="14" :lg="14" :xl="14">
+            <vab-avatar />
+          </a-col>
+        </a-row>
+      </a-layout-header>
+    </div>
+    <!-- 顶部横向排版 end -->
+
     <div
       v-if="device === 'mobile' && !collapse"
       class="vab-mask"
       @click="handleFoldSideBar"
     ></div>
+
+
     <a-layout-sider
       collapsible
       class="vab-sider"
@@ -13,10 +30,9 @@
       :class="classObj"
       :trigger="null"
     >
-      <vab-logo />
       <a-menu
         class="vab-menu"
-        theme="dark"
+        theme=""
         mode="inline"
         v-model:selectedKeys="selectedKeys"
         v-model:openKeys="openKeys"
@@ -24,11 +40,13 @@
         <vab-menu v-for="route in routes" :key="route.path" :item="route" />
       </a-menu>
     </a-layout-sider>
+
+    
     <a-layout
       class="vab-layout"
       :class="'mobile' === device ? 'vab-mobile-layout' : ''"
     >
-      <a-layout-header class="vab-header">
+      <!-- <a-layout-header class="vab-header">
         <a-row>
           <a-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
             <menu-unfold-outlined
@@ -42,11 +60,8 @@
               @click="toggleCollapse"
             />
           </a-col>
-          <a-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
-            <vab-avatar />
-          </a-col>
         </a-row>
-      </a-layout-header>
+      </a-layout-header> -->
       <vab-tabs />
       <vab-content />
     </a-layout>
@@ -59,7 +74,7 @@ import VabMenu from './vab-menu'
 import VabTabs from './vab-tabs'
 import VabContent from './vab-content'
 import { mapActions, mapGetters } from 'vuex'
-import { MenuUnfoldOutlined, MenuFoldOutlined } from '@ant-design/icons-vue'
+// import { MenuUnfoldOutlined, MenuFoldOutlined } from '@ant-design/icons-vue'
 
 export default {
   components: {
@@ -68,8 +83,8 @@ export default {
     VabMenu,
     VabTabs,
     VabContent,
-    MenuUnfoldOutlined,
-    MenuFoldOutlined,
+    // MenuUnfoldOutlined,
+    // MenuFoldOutlined,
   },
   data() {
     return {
@@ -114,7 +129,7 @@ export default {
     ...mapActions({
       toggleDevice: 'settings/toggleDevice',
       handleFoldSideBar: 'settings/foldSideBar',
-      toggleCollapse: 'settings/toggleCollapse',
+      // toggleCollapse: 'settings/toggleCollapse',
     }),
     handleLayouts() {
       const width = document.body.getBoundingClientRect().width
@@ -134,6 +149,7 @@ export default {
   .vab-sider {
     background-color: #fff;
     position: fixed;
+    top: 60px;
     left: 0;
     height: 100vh;
     overflow: auto;
@@ -149,11 +165,12 @@ export default {
     }
   }
   .vab-layout {
-    height: 100%;
+    height: calc(100vh - 0);
     overflow: auto;
     padding-left: 220px;
     transition: all 0.2s;
     background-color: #f0f3f4;
+    padding-top:@vab-header-height;
   }
   .vab-mobile-layout {
     padding-left: 0;
@@ -212,7 +229,12 @@ export default {
   }
   .vab-header {
     padding: 0;
-    background: #fff;
+    background: #016DDB;
+    color:#fff;
+    position:fixed;top:0;
+    width:100%;
+    height:@vab-header-height;
+    line-height:@vab-header-height;
     .ant-col + .ant-col {
       display: flex;
       justify-content: flex-end;

src/layout/vab-avatar/index.vue

@@ -1,15 +1,18 @@
 <template>
   <div class="vab-avatar" style="display: flex">
-    <span
-      style="
-        height: 54px;
-        line-height: 54px;
-        margin-right: 30px;
-        font-size: 17px;
-      "
-    >
+    <span class="weatherBlock">
       <!-- {{ time }} -->
+      天气预留位置
     </span>
+
+    <span class="goPanelBlock">
+      <!-- <a href="">电力大屏</a> -->
+
+      <router-link to="/home" class="logo-url">
+        <a>电力大屏</a>
+      </router-link>
+    </span>
+
     <a-dropdown>
       <span class="ant-dropdown-link">
         <!-- <a-avatar :src="avatar" /> -->
@@ -25,15 +28,27 @@
             border-radius:50%;
           "
         /> -->
-        {{ username }}
+        欢迎您，{{ username }}
         <DownOutlined />
       </span>
+
       <template v-slot:overlay>
         <a-menu>
           <a-menu-item @click="logout">退出登录</a-menu-item>
         </a-menu>
       </template>
     </a-dropdown>
+
+    <span class="bell">
+      <img
+        src="../../assets/images/bell.png"
+        alt=""
+        width="15"
+        @click="goAlarmingPage"
+      />
+    </span>
+
+    <span><img src="../../assets/images/switch.png" alt="" width="15" /></span>
   </div>
 </template>
 
@@ -41,7 +56,6 @@
 import { recordRoute } from '@/config'
 import { DownOutlined } from '@ant-design/icons-vue'
 import { useStore } from 'vuex'
-
 import { mapGetters } from 'vuex'
 export default {
   name: 'VabAvatar',
@@ -77,6 +91,10 @@ export default {
     }, 0)
   },
   methods: {
+    goAlarmingPage() {
+      this.$router.push('/alarmManage/index')
+    },
+
     async logout() {
       await this.$store.dispatch('user/logout')
       if (recordRoute) {
@@ -91,10 +109,39 @@ export default {
   },
 }
 </script>
+
+
 <style lang="less">
 .vab-avatar {
+  .weatherBlock,
+  .goPanelBlock {
+    height: @vab-header-height;
+    line-height: @vab-header-height;
+    margin-right: 30px;
+    font-size: 14px;
+  }
+  .goPanelBlock a {
+    text-align: center;
+    width: 90px;
+    line-height: 36px;
+    background: rgba(255, 255, 255, 0.2);
+    border-radius: 4px;
+    display: inline-block;
+    font-size: 14px;
+    color: #fff;
+  }
+  .goPanelBlock a:hover {
+    opacity: 0.7;
+  }
+  .bell {
+    margin: 0 20px 0 18px;
+    cursor: pointer;
+  }
+  .bell:hover {
+    opacity: 0.7;
+  }
   .ant-dropdown-link {
-    font-size:16px;
+    font-size: 14px;
     display: block;
     min-height: @vab-header-height;
     cursor: pointer;

src/layout/vab-logo/index.vue

@@ -1,11 +1,22 @@
 <template>
-  <div class="vab-logo">
+
+
+  <!-- <div class="vab-logo">
     <router-link to="/" class="logo-url">
       <img v-if="collapse" src="../../assets/logo.png" width="30" />
       <img v-else src="../../assets/logo_admin.png" />
     </router-link>
     <span class="anticon"></span>
     <span>{{ title }}</span>
+  </div> -->
+
+  <div class="vab-logo">
+    <router-link to="/" class="logo-url">
+      <img src="../../assets/logo2.png" width="133" style="position: relative; top: -2px;"/>
+    </router-link>
+    <!-- <span class="anticon"></span> -->
+
+    <span style="font-size: 26px;margin-left:20px; color: #fff">永天智慧电力平台</span>
   </div>
 </template>
 
@@ -34,7 +45,9 @@ export default {
 </script>
 <style lang="less" scoped>
 .vab-logo {
-  text-align: center;
-  margin: 10px 5px;
+  text-align: left;
+  margin-left:20px;
+  height:@vab-header-height;
+  // margin: 10px 5px;
 }
 </style>

src/layout/vab-menu/index.vue

@@ -70,4 +70,12 @@ export default {
 .anticon {
   margin-right: 3px !important;
 }
+
+.ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected{
+  background:#fff!important;
+
+}
+.ant-menu-vertical .ant-menu-item::after, .ant-menu-vertical-left .ant-menu-item::after, .ant-menu-vertical-right .ant-menu-item::after, .ant-menu-inline .ant-menu-item::after{  border-right:3px solid #fff!important
+}
+
 </style>

src/layout/vab-tabs/index.vue

@@ -16,12 +16,31 @@
         ></a-tab-pane>
       </a-tabs> -->
 
-      <el-breadcrumb separator="/">
+      <div style="display: inline-block;
+    float: left;
+    margin-top: 8px;
+    margin-right: 6px;">   
+
+         <menu-unfold-outlined
+        v-if="collapse"
+        class="trigger"
+        @click="toggleCollapse"
+      />
+      <menu-fold-outlined v-else class="trigger" @click="toggleCollapse" />
+
+
+        
+      </div>
+
+     
+
+      
+
+      <el-breadcrumb separator="/" style="display: inline-block">
         <el-breadcrumb-item
           v-for="(item, ind) in breadListLast"
           :key="ind"
           :to="item.path"
-         
         >
           {{ item.title }}
         </el-breadcrumb-item>
@@ -57,10 +76,13 @@
 <script>
 // import { DownOutlined } from '@ant-design/icons-vue'
 import { mapActions, mapGetters } from 'vuex'
+import { MenuUnfoldOutlined, MenuFoldOutlined } from '@ant-design/icons-vue'
 export default {
   name: 'VabTabs',
   components: {
     // DownOutlined,
+    MenuUnfoldOutlined,
+    MenuFoldOutlined,
   },
   data() {
     return {
@@ -92,8 +114,8 @@ export default {
 
       this.$route.matched.map((val) => {
         this.breadListLast.push({
-          path:val.path,
-          title:val.meta.title
+          path: val.path,
+          title: val.meta.title,
         })
       })
     },
@@ -105,6 +127,8 @@ export default {
       delLeftVisitedRoutes: 'tagsBar/delLeftVisitedRoutes',
       delRightVisitedRoutes: 'tagsBar/delRightVisitedRoutes',
       delAllVisitedRoutes: 'tagsBar/delAllVisitedRoutes',
+
+      toggleCollapse: 'settings/toggleCollapse',
     }),
     initAffixTabs(routes) {
       routes.forEach((route) => {
@@ -238,8 +262,13 @@ export default {
   //   line-height: @vab-breadcrumb-height;
   // }
   .el-breadcrumb {
-    height:36px;
-    line-height:36px;
+    height: 36px;
+    line-height: 36px;
   }
 }
+// .anticon[tabindex]{
+//   position: relative;
+//     top: -12px;
+//     left:-5px
+// }
 </style>

src/store/modules/routes.js

@@ -60,7 +60,7 @@ const actions = {
             component: 'Layout',
             children: [{
                 path: '/home',
-                meta: { title: '首页', icon: 'home', }
+                meta: { title: '数据看板', icon: 'home', }
             }]
         }, )
         data.forEach(function(item) {

vue.config.js

@@ -195,7 +195,7 @@ module.exports = {
                         'vab-color-blue': '#1890ff',
                         'vab-margin': '20px',
                         'vab-padding': '20px',
-                        'vab-header-height': '54px',
+                        'vab-header-height': '60px',
                         'vab-breadcrumb-height': '37px',
                         'vab-public-height': 'calc(100vh - 130px)',
                     },