src/assets/icons/svg/home.svg

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>编组</title>
+    <g id="组件" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="icon/banner/home" fill="#000" fill-rule="nonzero">
+            <g id="编组">
+                <rect id="矩形" opacity="0" x="0" y="0" width="24" height="24"></rect>
+                <path d="M11.1710783,2.42919989 C11.7298936,2.09409047 12.4328291,2.12455473 12.9654367,2.52059014 L20.3218013,7.99000647 L20.4665209,8.10559268 C21.0744501,8.62656431 21.4302636,9.40344805 21.4302636,10.227099 L21.4302636,19.0470569 L21.4250327,19.2212289 C21.3382831,20.6611171 20.1833875,21.8011882 18.7715031,21.8011882 L5.2284969,21.8011882 L5.06035624,21.7957697 C3.67032883,21.7059084 2.56973638,20.5095861 2.56973638,19.0470569 L2.56973638,10.2273587 L2.57600507,10.0381789 C2.63012926,9.22282649 3.03207443,8.47038558 3.67819781,7.99000711 L11.034559,2.52059336 Z M12.0713092,3.55793652 C11.9772762,3.53774358 11.8769764,3.55793433 11.7954857,3.6185066 L4.43911542,9.0879271 L4.32641124,9.18150853 C4.04059293,9.44596068 3.87451485,9.82573182 3.87451485,10.2273587 L3.87451485,19.0470569 L3.880713,19.1821318 C3.94632222,19.8933667 4.52470053,20.4496068 5.2284969,20.4496068 L11.2507497,20.4487759 L11.3507364,20.3451977 L11.3512202,14.4627186 L11.3582338,14.3683764 C11.4044406,14.0603828 11.6734228,13.8227675 12,13.8227675 C12.3345637,13.8227675 12.6123182,14.0734451 12.6454705,14.3976012 L12.6489183,14.4681588 L12.6487364,20.3451881 L12.7487231,20.4487759 L18.7714898,20.4496068 L18.9018895,20.4431864 C19.5885066,20.3752237 20.1254851,19.7760987 20.1254851,19.0470569 L20.1254851,10.2273587 L20.1177907,10.0779557 C20.0769951,9.68325297 19.8759128,9.32208831 19.5608746,9.08791971 L12.2045243,3.61851399 L12.1402672,3.58065321 Z" id="形状结合" stroke="#000" stroke-width="0.1"></path>
+            </g>
+        </g>
+    </g>
+</svg>

src/layout/components/NavbarRight.vue

@@ -1,5 +1,8 @@
 <template>
   <div class="right-msg" :style="blackTitle ? 'color: #000' : 'color: #fff'">
+      <div class="home-icon" v-if='blackTitle'>
+        <svg-icon icon-class="home" style="font-size: 24px; cursor: pointer;" @click="toHome"/>
+      </div>
       <div class="time-msg">
         <div class="line1">{{timeZone}}&nbsp;&nbsp;&nbsp;&nbsp;{{topTime}}</div>
         <div class="line2">{{topDate}}</div>
@@ -45,7 +48,7 @@ export default {
       }
     }
   },
-  mounted() {
+  created() {
     this.getUserMsg()
     this.getTime()
   },
@@ -73,7 +76,10 @@ export default {
         this.$store.dispatch('LogOut').then(() => {
           location.href = getPath('/');
         })
-      }).catch(() => {});
+      }).catch(() => {})
+    },
+    toHome() {
+      this.$router.push({ path: "/" })
     }
   }
 }
@@ -83,13 +89,16 @@ export default {
   float: right;
   height: 100%;
   font-size: 14px;
-  // color: #fff;
-  // padding-top: 15px;
-  // padding-right: 38px;
   .time-msg {
     display: inline-block;
     margin-right: 30px;
   }
+  .home-icon {
+    display: inline-block;
+    margin-right: 30px;
+    vertical-align: top;
+    padding-top: 7px;
+  }
   .base-msg {
     display: inline-block;
     .avatar {

src/views/choicePart/index.vue

@@ -2,7 +2,7 @@
   <div class="choicepart-container">
     <navbar />
     <div class="choicepart-wrapper">
-      <div class="choicepart-box" id="choicepartBox" :style="'transform:scale('+scale+');width:1574px;height:538px;'">
+      <div class="choicepart-box" id="choicepartBox" :style="'transform:scale('+scale+');width:1574px;height:538px;'" v-show="showItem">
       <div class="choicepart-line1">
         <div
           v-for="(item, index) in menuArr1"
@@ -37,7 +37,7 @@
   </div>
 </template>
 <script>
-import Navbar from './components/Navbar.vue'
+import Navbar from './components/Navbar'
 import { debounce } from '@/utils/debounce'
 export default {
   components: { Navbar },
@@ -154,6 +154,7 @@ export default {
           }
         }
       ],
+      showItem: false
     }
   },
   // computed:{
@@ -217,6 +218,9 @@ export default {
       }
     },
     resetSize() {
+      let _this = this
+      _this.showItem = false
+      _this.loading = true
       let choicepartBox = document.querySelector('#choicepartBox')
       let rw = parseFloat(window.innerWidth)
       let rh = parseFloat(window.innerHeight)
@@ -224,8 +228,16 @@ export default {
       let bh = parseFloat(choicepartBox.style.height)
       let wx = 0.82/(bw / rw)
       let hx = 0.56/(bh / rh)
-      this.scale = wx > hx ? hx : wx
+      _this.scale = wx > hx ? hx : wx
+      setTimeout(_this.showItemFun, 700)
+    },
+    showItemFun() {
+      this.loading = false
+      this.showItem = true
     }
+  },
+  beforeDestroy() {
+    this.showItem = false
   }
 }
 </script>
@@ -244,7 +256,7 @@ export default {
     align-items: center;
   }
   .choicepart-box {
-    // border: 1px solid red;
+    // transition: all 0.3s linear;
     .choicepart-line1 {
       width: 100%;
       margin-bottom: 80px;