From 6a5962fe9544005dba620b00fb36c25fe2da4e76 Mon Sep 17 00:00:00 2001
From: heyujie <516346543@qq.com>
Date: 星期二, 16 十一月 2021 15:24:46 +0800
Subject: [PATCH] 后端没修改的情况下添加默认背景图

---
 src/pages/vindicate/index/App.vue |   61 +++++++++++++++++++++++++++---
 1 files changed, 55 insertions(+), 6 deletions(-)

diff --git a/src/pages/vindicate/index/App.vue b/src/pages/vindicate/index/App.vue
index a8a86ce..aedbc6a 100644
--- a/src/pages/vindicate/index/App.vue
+++ b/src/pages/vindicate/index/App.vue
@@ -1,5 +1,6 @@
 <template>
   <div class="container vindicate" v-if="!showWelcome">
+
     <div class="container-left">
       <div
         class="left-card"
@@ -20,7 +21,7 @@
     <sysInfo v-if="activePage == 3" style="width: 100%" ref="view_3"></sysInfo>
   </div>
 
-    <div class="welcome-page" v-else ref="curPage">
+    <div class="welcome-page" v-else ref="curPage" @click="showRecomand = false" @mouseup="mouseDownIndex = ''">
     <div
       class="search-box"
       :class="showRecomand ? 'border-change' : ''"
@@ -60,6 +61,8 @@
         @click="openWelcome(i)"
         v-for="(item, i) in menuArr"
         :key="i"
+        @mousedown="mouseDownIndex = i"
+        :class="mouseDownIndex === i? 'nav-child-active':''"
       >
         <div class="child-info">
           <!-- <span class="icon iconfont welcome-icon">{{ item.icon }}</span> -->
@@ -110,6 +113,8 @@
       full: 0,
       showWelcome:true,
       searchText:'',
+      showRecomand:false,
+      mouseDownIndex:''
     };
   },
   created() {
@@ -127,12 +132,13 @@
       // });
     }
      this.getLeftPer()
-     console.log(99999);
      window.addEventListener("message",(e)=>{
-     console.log(999);
      if(e.data.msg === 'changeColor') {
      document.documentElement.style.setProperty('--colorCard',`${e.data.color}`)
-       }       
+       } 
+      if (e.data.msg === '杩斿洖绯荤粺缁存姢') {
+    this.showWelcome = true
+      }     
      })
   },
   methods: {
@@ -198,7 +204,7 @@
     position: fixed;
     left: calc(50% - 166px);
     top: 50px;
-    background: rgba(255, 255, 255, 0.8);
+    opacity: 0.8;
 
     border: 2px solid #4e94ff;
     box-sizing: border-box;
@@ -231,6 +237,29 @@
         transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
         width: 100%;
         font-weight: bold;
+
+        &::-webkit-input-placeholder { /* WebKit browsers */
+        color: #828282;
+        font-weight: normal;
+        font-size: 14px;
+        }
+        &:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
+        color: #828282;
+        font-weight: normal;
+        font-size: 14px;
+        }
+        &::-moz-placeholder { /* Mozilla Firefox 19+ */
+        color: #828282;
+        font-weight: normal;
+        font-size: 14px;
+        }
+        &:-ms-input-placeholder { /* Internet Explorer 10+ */
+        color: #828282;
+        font-weight: normal;
+        font-size: 14px;
+
+      }
+
       }
       .el-input__suffix {
         display: flex;
@@ -253,6 +282,7 @@
     .search-res {
       max-height: 240px;
       overflow: auto;
+      background-color: rgba(255, 255, 255, 0.5);
       .res-bar {
         height: 40px;
         line-height: 40px;
@@ -283,6 +313,8 @@
     }
   }
   .nav-items {
+    max-width: 960px;
+    margin: 0 auto;
     .nav-child {
       box-sizing: border-box;
       background-color: rgba(251, 251, 255, 0.1);
@@ -297,6 +329,15 @@
       justify-content: center;
       align-items: center;
       cursor: pointer;
+      border: 2px solid #F2F2F7;
+
+      &:hover {
+        background: #F2F2F7;
+      }
+
+      &-active {
+        border: 2px solid #4E94FF;
+      }
 
       // box-shadow: 2px 2px 4px rgb(226, 226, 226);
       .child-info {
@@ -310,7 +351,7 @@
         img {
           width: 64px;
           margin: 0 auto;
-          margin-top: 65px;
+          margin-top: 61px;
           height: 50px;
         }
         .welcome-title {
@@ -337,6 +378,14 @@
   flex: 1;
   flex-basis: auto;
   box-sizing: border-box;
+  position: relative;
+
+  .back {
+    position: absolute;
+    top: 0;
+    left: 0;
+  }
+
   .container-left {
     height: 100%;
     width: 244px;

--
Gitblit v1.8.0