src/layout/components/Navbar.vue

@@ -11,10 +11,12 @@
 
     <div class="right-menu">
 
-      <div v-if="showhome" class="right-menu-back" @click="toHome">
+      <!-- <div v-if="showhome" class="right-menu-back" @click="toHome">
         <svg-icon class="item-icon" icon-class="home" style="height: 24px; width: 24px; vertical-align: -6px; margin-right: 2px;" />
         {{ 'navbar.homepage' | i18nFilter }}
-      </div>
+      </div> -->
+      <div :style="showTitle ? 'color: #fff' : ''" class="right-menu-back" @click="toHome">
+        <svg-icon class="item-icon" icon-class="home" style="height: 24px; width: 24px; vertical-align: -6px; margin-right: 2px;" /></div>
       <el-dropdown :style="showTitle ? 'color: #fff' : '#000'" class="avatar-container right-menu-item hover-effect" trigger="click">
         <el-badge :hidden="alarmNum>0?false:true" :value="alarmNum" class="item" style="line-height: 0; margin: 0 10px; vertical-align: -3px" @click.native="handleAlarm">
           <svg-icon style="width: 24px; height: 24px" class="item-icon" icon-class="alarm" />
@@ -204,8 +206,12 @@ export default {
       clearInterval(logoutInterval)
     },
     async toHome() {
-      this.$store.dispatch('app/setChoicepart')
+      // this.$store.dispatch('app/setChoicepart')
-      this.$router.push('/')
+      // this.$router.push('/')
+      if (localStorage.getItem('param')) {
+        const param = JSON.parse(window.atob(localStorage.getItem('param')))
+        window.location = 'https://www.baidu.com/?' + param
+      }
     },
     handleAlarm() {},
     getAlarm() {

src/views/wmsHome/index.vue

@@ -1,21 +1,25 @@
 <template>
-  <div class="choicepart-container">
+  <div id="container" class="choicepart-container">
     <div class="choicepat-navbar">
       <navbar :showhome="false" :show-title="true" />
     </div>
-    <div class="choicepart-box">
+    <div class="choicepart-box" :style="{ width: 1585 * beilv + 'px' }">
       <div
         v-for="(item, index) in moduleList"
         :key="item.path"
         class="choicepart-item"
+        :style="{ width: 180 * beilv + 'px', height: 223 * beilv + 'px', margin: 40 * beilv + 'px' }"
         @click="handelClick(item, index)"
       >
         <div class="choicepart-item-border">
-          <img :src="require(`../../assets/img/choicepart/${item.name}.png`)" alt="">
+          <img :src="require(`../../assets/img/choicepart/${item.name}.png`)" alt="" :style="{ width: 90 * beilv + 'px', height: 90 * beilv + 'px', top: 35 * beilv + 'px', left: 50 * beilv + 'px' }">
         </div>
-        <div class="choicepart-item-title" :title="item.meta.title">{{ item.meta.title }}</div>
+        <div class="choicepart-item-title" :title="item.meta.title" :style="{ height: 40 * beilv + 'px', lineHeight: 40 * beilv + 'px', fontSize: 16 * beilv + 'px' }">{{ item.meta.title }}</div>
       </div>
     </div>
+    <div class="bottom-img">
+      <img :src="require('../../assets/img/choicepart/choicepart-back-u.png')" alt="">
+    </div>
   </div>
 </template>
 
@@ -28,11 +32,25 @@ export default {
   components: { Navbar },
   data() {
     return {
+      beilv: 1,
       moduleList: []
     }
   },
   mounted() {
+    this.beilv = document.getElementById('container').offsetWidth / 1920
+    window.addEventListener('resize', () => {
+      if (this.isFullScreen) {
+        this.beilv = document.body.offsetWidth / 1920
+      } else {
+        this.beilv = document.getElementById('container').offsetWidth / 1920
+      }
+    })
     this.getModuleList()
+    const path = location.href
+    if (path.indexOf('?') !== -1) {
+      const param = path.split('?')
+      localStorage.setItem('param', window.btoa(JSON.stringify(param[1])))
+    }
   },
   methods: {
     getModuleList() {
@@ -70,41 +88,38 @@ export default {
 .choicepart-container {
   min-width: 100%;
   min-height: 100vh;
-  // background: linear-gradient(-45deg, rgb(25, 25, 200), rgb(0, 100, 200));
   background: url('../../assets/img/choicepart/choicepart-back.png') repeat;
   background-size: cover;
   overflow-x: auto;
   .choicepart-box {
-    width: 1585px;
+    // width: 1585px;
     margin: 0 auto;
     padding-top: 25vh;
     .choicepart-item {
       display: inline-block;
-      width: 180px;
+      // width: 180px;
-      height: 223px;
+      // height: 223px;
-      margin: 40px;
+      // margin: 40px;
       background: url('../../assets/img/choicepart/choice-item-back.png') no-repeat;
       background-size: 100% 100%;
-      // border: 1px dashed #fff;
-      box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
       top: 0;
       border-radius: 5px;
       overflow: hidden;
       cursor: pointer;
       position: relative;
       img {
-        width: 90px;
+        // width: 90px;
-        height: 99px;
+        // height: 90px;
         position: absolute;
-        top: 32px;
+        // top: 32px;
-        left: 43px;
+        // left: 43px;
       }
       .choicepart-item-border {
         height: 100%;
         border-radius: 5px;
         padding: 0 5px;
-        line-height: 32px;
+        // line-height: 32px;
-        font-size: 28px;
+        // font-size: 28px;
         font-weight: lighter;
         color: #2c6bd8;
         overflow: hidden;
@@ -120,9 +135,9 @@ export default {
         right: 2px;
         text-align: center;
         color: #fff;
-        font-size: 16px;
+        // font-size: 16px;
-        line-height: 40px;
+        // line-height: 40px;
-        height: 40px;
+        // height: 40px;
         letter-spacing: 2px;
         background-color: rgba($color: #0b58ff, $alpha: 0.45);
       }
@@ -140,6 +155,13 @@ export default {
     right: 0;
     z-index: 10;
   }
+  .bottom-img {
+    img {
+      width: 100%;
+      position: fixed;
+      bottom: 0;
+    }
+  }
 }
 ::-webkit-scrollbar-track-piece {
   //滚动条凹槽的颜色，还可以设置边框属性