修改home页图标

src/style/index.less

@@ -120,17 +120,21 @@ html {
   
   .header-info {
     padding-left: 20px;
-    display: inline-block;
+
     // position: absolute;
     height: 100%;
     width: 420px;
+    min-width: 420px;
     text-align: right;
     vertical-align: middle;
+    display: flex;
+    justify-content: flex-end;
   }
   
   .header-info > div {
-     float: left;
-    height: 100%;
+
+      height: 100%;
+      text-align: right;
   }
   
   .user-header {
@@ -288,9 +292,12 @@ html {
   .h-link a {
     font-size: 14px;
     text-decoration: none;
-    padding: 0px 15px;
-    /* height: 60px; */
-    display: inline-block;
+    padding-left: 15px;
+    padding-right: 30px;
+    display: flex; 
+    align-items: center; 
+    justify-content: center; 
+    height: 70px;
   }
   
   img[src=''],

src/views/home.vue

@@ -95,31 +95,34 @@
                 </div>
                 <div class="header-info">
                     <div class="h-link">
-                        <a href="javascript:void(0)" @click="openMap"><i>可视化界面</i></a>
+                        <a href="javascript:void(0)" @click="openMap" title="可视化界面">
+                            <el-icon style="fontSize:30px;">
+                                <MapLocation color="rgb(255,255,255)"/>
+                            </el-icon>
+                        </a>
                     </div>
-                    <div class="h-link">
-                        <a href="javascript:void(0)">
-                            <el-icon>
-                                <UserFilled color="rgb(161,187,214)" />
+                    <div class="h-link" >
+                        <a href="javascript:void(0)" :title="realName">
+                            <el-icon style="fontSize:25px;">
+                                <UserFilled color="rgb(161,187,214)"/>
                             </el-icon>
-                            {{ realName }}
+                           
                         </a>
                     </div>
-                    <div class="h-link" style="padding-left: 15px; ">
-                        <a href="javascript:void(0)">
-                            <el-icon>
+                    <div class="h-link" >
+                        <a href="javascript:void(0)" title="系统设置">
+                            <el-icon style="fontSize:25px;">
+                                <!-- <el-image src="/imgs/home/Sys.png" :fit="'fill'" /> -->
                                 <Setting color="rgb(255,255,255)" />
                             </el-icon>
-                            系统设置
                         </a>
                     </div>
-                    <div class="h-link" style="padding-left: 1px;">
-                        <a href="javascript:void(0)" @click="logout">
-                            <el-icon>
-                                <el-image src="/imgs/home/exit.png" :fit="'fill'" />
-
+                    <div class="h-link">
+                        <a href="javascript:void(0)" @click="logout" title="退出系统">
+                            <el-icon style="fontSize:25px;">
+                                <!-- <el-image src="/imgs/home/exit.png" :fit="'fill'" /> -->
+                                <SwitchButton  color="rgb(255,255,255)" />
                             </el-icon>
-                            退出系统
                         </a>
                     </div>
                 </div>