修改首页商品全球身份认证和业务大厅样式

src/views/Home/index.vue

@@ -266,7 +266,7 @@
               <div class="cate">业务大厅</div>
               <div class="row">
                 <div class="col-lg-6 wbsxtcy bgWhite">
-                  <div class="ywdt-cate">
+                  <div class="ywdt-cate ywdt-cate-bj1">
                     <span>我还不是系统成员</span>
                     <span>（企业初次申请）</span>
                   </div>
@@ -284,7 +284,7 @@
                   </div>
                 </div>
                 <div class="col-lg-6 wsxtcy bgWhite">
-                  <div class="ywdt-cate">
+                  <div class="ywdt-cate ywdt-cate-bj2">
                     <span>我是系统成员</span>
                     <span>（成员专区）</span>
                   </div>
@@ -303,7 +303,7 @@
               </div>
               <div class="row">
                 <div class="col-lg-6 wsylqy bgWhite">
-                  <div class="ywdt-cate">
+                  <div class="ywdt-cate ywdt-cate-bj1">
                     <span>我是医疗企业</span>
                   </div>
                   <div class="row ywdt-kj">
@@ -319,7 +319,7 @@
                   </div>
                 </div>
                 <div class="col-lg-6 kjywblzq bgWhite">
-                  <div class="ywdt-cate">
+                  <div class="ywdt-cate ywdt-cate-bj2">
                     <span>跨境业务办理专区</span>
                   </div>
                   <div class="row ywdt-kj">
@@ -481,27 +481,37 @@
           <div class="spqqsfz-cate-left">商品全球身份证</div>
           <div class="spqqsfz-cate-right">更多></div>
         </div>
-        <div class="spqqsfz-cont">
+        <div class="spqqsfz-cont row">
+          <div class="spqqsfz-cont-left col-lg-3">
+            <img src="../../assets/image/home/spqqsfz-tp.png" alt="" />
+          </div>
+          <div class="spqqsfz-cont-right col-lg-9">
+            <img src="../../assets/image/home/spqqsfz-bj2.png" alt="" />
+            <div class="right-cont">
               <div class="row">
-            <div class="col offset-lg-4">kiddy color重彩油画棒A14018</div>
+                <div class="col offset-2 offset-lg-3">
+                  kiddy color重彩油画棒A14018
+                </div>
               </div>
               <div class="row">
-            <div class="col-8 offset-lg-4">
+                <div class="col-8 offset-2 offset-lg-3">
                   <div class="pp">品牌：kiddy color</div>
                   <div class="jhl">净含量：一盒</div>
                 </div>
-            <div class="col-8 offset-lg-4">
+                <div class="col-8 offset-2 offset-lg-3">
                   公司名称：梁介福(广东)药业有限公司
                 </div>
               </div>
               <div class="row">
-            <div class="col offset-lg-4">
+                <div class="col offset-2 offset-lg-3">
                   <button>更多商品信息</button>
                 </div>
               </div>
             </div>
           </div>
         </div>
+      </div>
+    </div>
     <!-- 首页下半部 -->
     <div class="home-bottom">
       <div class="container">
@@ -1001,10 +1011,16 @@ export default {
       display: flex;
       align-items: center;
       flex-wrap: wrap;
-      background: url("../../assets/image/home/ywdt-cate.png") no-repeat 100%
-        100%;
       height: 73px;
       padding-left: 24px;
+      &.ywdt-cate-bj1 {
+        background: url("../../assets/image/home/ywdt-cate-bj1.png") no-repeat;
+        background-size: cover;
+      }
+      &.ywdt-cate-bj2 {
+        background: url("../../assets/image/home/ywdt-cate-bj2.png") no-repeat;
+        background-size: cover;
+      }
       span {
         &:nth-child(1) {
           color: #0e2c6b;
@@ -1118,8 +1134,8 @@ export default {
   }
   .spqqsfz {
     background: #2f579c url("../../assets/image/home/spqqsfz-bj.png") no-repeat;
-    height: 433px;
-    background-size: auto 100%;
+    padding: 30px 0;
+    // height: 433px;
     background-position: center;
     .spqqsfz-cate {
       display: flex;
@@ -1127,13 +1143,35 @@ export default {
       flex-wrap: wrap;
       color: #ffffff;
       font-size: 24px;
-      padding: 30px 0;
+      margin-bottom: 30px;
     }
     .spqqsfz-cont {
-      background: url("../../assets/image/home/spqqsfz-bj2.png") no-repeat;
+      // background: #fff url("../../assets/image/home/spqqsfz-bj2.png") no-repeat;
+      position: relative;
+      background: #fff;
+      border-radius: 6px;
+      > * {
+        padding: 0;
         height: 300px;
-      background-size: 100% 100%;
-      background-position: center;
+      }
+      .spqqsfz-cont-left {
+        img {
+          width: 100%;
+          height: 100%;
+        }
+      }
+      .spqqsfz-cont-right {
+        position: relative;
+        img {
+          width: 100%;
+          height: 100%;
+        }
+        .right-cont {
+          position: absolute;
+          left: 0;
+          top: 0;
+          width: 100%;
+          height: 100%;
           display: flex;
           flex-direction: column;
           justify-content: space-around;
@@ -1170,6 +1208,8 @@ export default {
           }
         }
       }
+    }
+  }
   .home-bottom {
     padding: 40px 0;
     .row {