修改

src/components/SupplierIndex.vue

@@ -136,7 +136,7 @@
 
           <div style="width: 100%;min-height:200px;  overflow-x: auto;padding:0 20px; " class="HotelQueryList"
             v-loading="loading">
-            <div class="hotelProductManage2_tableBox" style="margin:20px 0;">
+            <div class="hotelProductManage2_tableBox">
               <span style="color:#fff;background-color: #ff3737;padding:2px 4px;border-radius:5px">红日</span>
               <span style="color:#000000;background-color: #ff99cc;padding:2px 4px;border-radius:5px">旺季</span>
               <span style="color:#000000;background-color: #bcd6ee;padding:2px 4px;border-radius:5px">平季</span>

src/components/SupplierLogin.vue

@@ -31,7 +31,16 @@
   .Supplier_Login .login-Div .loginBtn:hover {
     background-color: #5182E4;
   }
-
+  .Supplier_Login .login_back{
+    position: absolute!important;
+    width:100%;
+    height:50%;
+    top:0;
+    left:0;
+  }
+  .Supplier_Login .Supplier_loginDiv{
+    background-color:rgba(255,255,255,0.2)!important;  
+  }
 </style>
 
 <template>
@@ -43,8 +52,8 @@
         </div>
       </div>
     </div>
-
-    <form class="login-Div">
+    <div class="login_back"></div>
+    <form class="login-Div Supplier_loginDiv">
       <div v-if="isShow==1">
         <div class="mainTitle">
           <div class="login_Title">
@@ -82,6 +91,7 @@
 </template>
 
 <script>
+  import Particle from 'particleground-light'
   export default {
     name: "login-box",
     data() {
@@ -108,6 +118,10 @@
       };
     },
     mounted() {
+      new Particle(document.querySelector('.login_back'),{
+          dotColor: '#031940',
+          lineColor: '#031940'
+      })
       this.init();
       let that = this;
       this.clock = setInterval(() => {