头部样式修改

yuhong-ui/src/assets/scss/index.scss

@@ -18,19 +18,33 @@
     background-position: center center;
   }
 
+  .bg-header {
+    width: 100%;
+    height: 100px;
+    padding: 0px;
+    background-image: url("../assets/header.png");
+    background-size: cover;
+    background-position: center center;
+    justify-content: flex-end;
+  }
+
   .host-body {
+
     .dv-dec-10,
     .dv-dec-10-s {
       width: 33.3%;
       height: 5px;
     }
+
     .dv-dec-10-s {
       transform: rotateY(180deg);
     }
+
     .dv-dec-8 {
       width: 200px;
       height: 50px;
     }
+
     .title {
       position: relative;
       width: 500px;
@@ -60,6 +74,7 @@
     .aside-width {
       width: 40%;
     }
+
     .react-r-s,
     .react-l-s {
       background-color: #0f1325;
@@ -71,6 +86,7 @@
         text-align: right;
         width: 500px;
       }
+
       font-size: 18px;
       width: 300px;
       line-height: 50px;
@@ -98,6 +114,7 @@
         width: 500px;
         text-align: left;
       }
+
       font-size: 18px;
       width: 300px;
       height: 50px;

yuhong-ui/src/views/index.vue

@@ -4,12 +4,14 @@
       <dv-loading v-if="loading">Loading...</dv-loading>
       <div v-else class="host-body">
         <!--        头标-->
-        <div class="d-flex jc-center">
+        <div class="d-flex bg-header">
+          <div style="margin: 90px 30px;">{{ dateYear }} {{ dateWeek }} {{ dateDay }}</div>
+        </div>
+        <!-- <div class="d-flex jc-center">
           <dv-decoration-10 class="dv-dec-10" />
           <div class="d-flex jc-center">
             <dv-decoration-8 class="dv-dec-8" :color="decorationColor" />
             <div class="title">
-              <!-- <span class="title-text">订单/设备综合信息看板</span> -->
               <span class="title-text">生产智能化管理平台</span>
               <dv-decoration-6
                 class="dv-dec-6"
@@ -24,17 +26,15 @@
             />
           </div>
           <dv-decoration-10 class="dv-dec-10-s" />
-        </div>
+        </div> -->
 
         <!-- 第二行 -->
-        <div class="d-flex jc-between px-2">
+        <!-- <div class="d-flex jc-between px-2">
           <div class="d-flex aside-width">
             <div class="react-left ml-4 react-l-s">
               <span class="react-left" />
-              <!-- <span class="text">数据分析1</span>-->
             </div>
             <div class="react-left ml-3">
-              <!--              <span class="text">数据分析2</span>-->
             </div>
           </div>
           <div class="d-flex aside-width">
@@ -48,7 +48,7 @@
               >{{ dateYear }} {{ dateWeek }} {{ dateDay }}</span>
             </div>
           </div>
-        </div>
+        </div> -->
 
         <div class="body-box">
           <!-- 第三行数据 -->
@@ -58,7 +58,8 @@
               <!--左边数据显示1-->
               <div class="left-box-one">
                 <dv-border-box-12>
-                  //<centerRight1 />
+                  //
+                  <centerRight1 />
                 </dv-border-box-12>
               </div>
               <!--左边数据显示2   动态月订单信息数据-->
@@ -146,6 +147,7 @@ export default {
 
 <style lang="scss" scoped>
 @import "../assets/scss/index.scss";
+
 .bototm-box {
   width: 100%;
   text-align: center;