头部修改

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

@@ -8,7 +8,7 @@
   transform: translate(-50%, -50%);
   transform-origin: left top;
   overflow: hidden;
-  
+
   .bg {
     width: 100%;
     height: 100%;
@@ -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;
@@ -141,4 +158,4 @@
       }
     }
   }
-}
+}

yuhong-ui/src/components/echart/center/centerChartRate/index.vue

@@ -1,12 +1,7 @@
 <template>
   <div>
     <!-- 合格率-->
-    <Echart
+    <Echart :id="id" :options="options" height="150px" width="120px" />
-      :id="id"
-      :options="options"
-      height="150px"
-      width="120px"
-    />
   </div>
 </template>
 
@@ -29,7 +24,7 @@ export default {
     },
     colorObj: {
       type: Object,
-      default: function() {
+      default: function () {
         return {
           textStyle: '#3fc0fb',
           series: {
@@ -52,7 +47,7 @@ export default {
     // tips 是会变更的数据，所以进行监听
     tips: {
       handler(newData) {
-        debugger
+        // debugger
         this.options = {
           series: [
             {
@@ -136,5 +131,4 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style lang="scss" scoped></style>
-</style>

yuhong-ui/src/views/bottomRight.vue

@@ -26,7 +26,7 @@
         <span class="ranking_span">各产品合格率(%)</span>
         <div class="item">
           <div v-for="item in productOKRateList" :key="item.ProductName" class="ranking1">
-            <dv-water-level-pond :config="item.config" style="width:100px;height:70px" />
+            <dv-water-level-pond :config="item.config" style="width:105px;height:60px" />
             <span class="item_span">{{ item.ProductName }}</span>
           </div>
         </div>
@@ -130,7 +130,7 @@ export default {
           for (const item of rData) {
             var n = {
               data: [item.OKRate],
-              shape: 'round',
+              shape: 'roundRect',
               formatter: '{value}%',
               waveNum: 2,
               waveHeight: 10,
@@ -199,12 +199,12 @@ export default {
 
           }
           .item_span{
-            margin:25px;
+            display: inline-block;
-
+            padding: 5px 25px;
           }
       }
       .ranking1{
-        margin-left:20px;
+        margin-left:15px;
       }
 
       .percent {

yuhong-ui/src/views/centerLeft1.vue

@@ -7,10 +7,7 @@
         </div> -->
         <div class="text2">
           <p style="width:100px;height:37px;">{{ item.eqmt_name }}</p>
-          <dv-water-level-pond
+          <dv-water-level-pond :config="item.config" style="width: 100px; height: 100px" />
-            :config="item.config"
-            style="width: 100px; height: 100px"
-          />
           <span>产线合格率</span>
         </div>
         <div class="text3">
@@ -130,7 +127,7 @@ export default {
         url: '/api/BigScreen/getEqmtDetailList',
         method: 'get'
       }).then((r) => {
-        debugger
+        // debugger
         if (r) {
           const rData = r.data
 
@@ -322,13 +319,16 @@ $box-height: 210px;
   height: $box-height;
   width: $box-width;
   border-radius: 10px;
+
   .bg-color-black {
     height: $box-height - 0px;
     border-radius: 10px;
   }
+
   .text {
     color: #c3cbde;
   }
+
   .dv-dec-3 {
     position: relative;
     width: 100px;
@@ -338,18 +338,21 @@ $box-height: 210px;
 
   .bottom-data {
     .item-box {
-      & > div {
+      &>div {
         padding-right: 5px;
       }
+
       font-size: 14px;
       float: right;
       position: relative;
       width: 50%;
       color: #d3d6dd;
+
       .dv-digital-flop {
         width: 120px;
         height: 30px;
       }
+
       // 金币
       .coin {
         position: relative;
@@ -357,30 +360,35 @@ $box-height: 210px;
         font-size: 20px;
         color: #ffc107;
       }
+
       .colorYellow {
         color: yellowgreen;
       }
+
       p {
         text-align: center;
       }
     }
   }
 }
+
 .text2 {
   margin-top: 10px;
   margin-bottom: 20px;
   line-height: 25px;
 }
+
 .text2 span {
   margin: 10px;
 }
+
 .text1 p {
   font-size: 18px;
 }
+
 .text3 {
   margin-top: 37px;
   margin-left: 20px;
   height: 35px;
   line-height: 35px;
-}
+}</style>
-</style>

yuhong-ui/src/views/centerRight1.vue

@@ -15,7 +15,8 @@
         <dv-scroll-board class="dv-scr-board" :config="config" @click="skipto" />
       </div>
     </div>
-    <el-dialog title="工单详细信息" style="font-color:#fff" :visible.sync="moDetailShow" width="50%" :append-to-body="true" @open="getmoDetailInfo">
+    <el-dialog title="工单详细信息" style="font-color:#fff" :visible.sync="moDetailShow" width="50%" :append-to-body="true"
+      @open="getmoDetailInfo">
       <el-descriptions class="margin-top" :column="1" :size="size" border>
         <el-descriptions-item>
           <template slot="label">工单号</template>{{ moInfo.FBILL_NO }}
@@ -200,7 +201,7 @@ export default {
   methods: {
     // 点击事件
     skipto(config) {
-      debugger
+      // debugger
       // window.alert(config.row[6])
       this.moKey = config.row[6]
       this.moDetailShow = true
@@ -224,7 +225,7 @@ export default {
         method: 'get'
       }).then((r) => {
         if (r) {
-          const newArr = r.data.map(function(item) {
+          const newArr = r.data.map(function (item) {
             var ret = []
             ret.push(
               item.FBILL_NO,
@@ -267,7 +268,7 @@ export default {
         url: '/api/BigScreen/getPlanOrderDetail?fentryId=' + this.moKey,
         method: 'get'
       }).then((r) => {
-        debugger
+        // debugger
         _this.moInfo = r.data
       })
     }
@@ -279,6 +280,7 @@ export default {
 $box-height: 350px;
 $box-height: 350px;
 $box-width: 900px;
+
 #centerRight1 {
   padding: 16px;
   padding-top: 20px;
@@ -290,13 +292,16 @@ $box-width: 900px;
     height: $box-height - 30px;
     border-radius: 10px;
   }
+
   .text {
     color: #c3cbde;
   }
+
   /*内容的宽度和高度*/
   .body-box {
     border-radius: 10px;
     overflow: hidden;
+
     .dv-scr-board {
       width: 900px;
       height: 300px;
@@ -306,21 +311,22 @@ $box-width: 900px;
 }
 </style>
 <style lang="scss">
-.dv-scroll-board .header .header-item{
+.dv-scroll-board .header .header-item {
   color: #00B2EE;
 }
+
 .el-dialog__header {
-  background-color:#f5f5f5 !important;
+  background-color: #f5f5f5 !important;
 }
+
 .el-dialog__body {
-  background-color:#f5f5f5 !important;
+  background-color: #f5f5f5 !important;
 }
+
 // .el-descriptions :not(.is-bordered) .el-descriptions-item__cell {
 //   background-color:#f5f5f5 !important;
 // }
 
 .el-dialog__footer {
-     background-color: #f5f5f5!important;
+  background-color: #f5f5f5 !important;
-}
+}</style>
-
-</style>

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: 50px 30px;font-size: 20px;">{{ 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,7 @@
               <!--左边数据显示1-->
               <div class="left-box-one">
                 <dv-border-box-12>
-                  //<centerRight1 />
+                  <centerRight1 />
                 </dv-border-box-12>
               </div>
               <!--左边数据显示2   动态月订单信息数据-->
@@ -146,6 +146,7 @@ export default {
 
 <style lang="scss" scoped>
 @import "../assets/scss/index.scss";
+
 .bototm-box {
   width: 100%;
   text-align: center;