物联看板界面优化

src/views/iot/board/components/alarmList.vue

@@ -5,7 +5,7 @@
     @mouseleave="handleMouseLeave"
   >
     <h1 class="t_title">实时告警列表</h1>
-    <el-table :data="data" height="calc(95% - 50px)" class="alarm-table">
+    <el-table :data="data" height="calc(95% - 100px)" class="alarm-table">
       <el-table-column
         label="所在机构"
         prop="orgName"
@@ -108,7 +108,9 @@ export default {
 <style scoped src="./../css/index.css"></style>
 <style lang="scss" scoped>
 .alarm-table {
-  width: calc(100% - 20px);
+  width: calc(100% - 40px);
+  position:absolute;
+  top:calc(3% + 44px + 18px)
 }
 
 .component_box ::v-deep .el-table {
@@ -169,11 +171,11 @@ export default {
 // }
 
 .t_title {
-  // position: absolute;
-  font-size: 16px;
-  font-weight: 700;
+  position: absolute;
+  font-size: 20px;
+//   font-weight: 700;
   color: #fff;
-  margin-left: 5%;
-  margin-top: 5%;
+  left: calc(18px + 2.08%);
+  top:calc(12px + 3%);
 }
 </style>

src/views/iot/board/components/alarmRate.vue

@@ -90,11 +90,12 @@ export default {
       let option = {
         title: {
           text: "设备告警状态",
-          top: 35,
-          left: 20,
+          top: 18,
+          left: '3%',
           textStyle: {
-            fontSize: 18,
             color: "#fff",
+            fontWeight:'normal',
+            fontSize:20
           },
         },
         tooltip: {
@@ -103,7 +104,7 @@ export default {
         },
         legend: {
           right: 20,
-          top: 35,
+          top: 18,
           data: ["告警", "正常"],
           textStyle: {
             color: "#fff",

src/views/iot/board/components/alarmTrend.vue

@@ -26,7 +26,7 @@ const types = [
     value: "0",
   },
   {
-    text: "近7周",
+    text: "近七周",
     value: "1",
   },
   {
@@ -398,10 +398,10 @@ export default {
 <style lang="scss" scoped>
 .header {
   position: absolute;
-  top: calc(18px + 20px);
+  top: calc(15px + 20px);
   left: calc(18px + 3%);
-  font-size: 16px;
-  font-weight: 700;
+  font-size: 20px;
+  // font-weight: 700;
 }
 .component_box {
   ::v-deep .el-tabs__nav-scroll {

src/views/iot/board/components/deviceMap.vue

@@ -276,10 +276,11 @@ export default {
 }
 .t_title {
   position: absolute;
-  font-size: 16px;
-  font-weight: 700;
+  font-size: 20px;
+  // font-weight: 700;
   color: #fff;
-  margin-left: 5%;
-  margin-top: calc(5% + 18px);
+  margin-left: 18px;
+  margin-top: calc(3% + 18px);
 }
+
 </style>

src/views/iot/board/components/onlineAndHealth.vue

@@ -173,9 +173,11 @@ export default {
           x: "center",
           textStyle: {
             color: "#FFF",
+            fontWeight:'normal',
+            fontSize:20
           },
-          left: "6%",
-          top: "10%",
+          left: 12,
+          top: 18,
         },
         //图标位置
         grid: {
@@ -306,8 +308,9 @@ export default {
     color: #fff;
     width: 100%;
     height: 12%;
-    font-size: 16px;
-    font-weight: 700;
+    font-size: 20px;
+    padding-top:18px
+    // font-weight: 700;
   }
 
   ::v-deep .banklet_main {
@@ -388,8 +391,8 @@ export default {
 
 .t_b_h_1 {
   position: absolute;
-  font-size: 0.16rem;
-  left: 54%;
+  font-size:16px;
+  // left: 54%;
   width: 50%;
   height: 2.1rem;
   top: 60%;
@@ -430,7 +433,7 @@ export default {
 .t_b_m_1 {
   position: absolute;
   font-size: 0.16rem;
-  left: 54%;
+  // left: 54%;
   width: 50%;
   height: 2.1rem;
   top: 70%;

src/views/iot/board/index.vue

@@ -214,12 +214,15 @@ export default {
   width: 100%;
   line-height: 50px;
 
+  ::v-deep .el-input{
+    top:8px;
+  }
   ::v-deep .el-input__inner {
     background-color: transparent !important;
     border: none !important;
     color: #ffffff;
-    font-size: 16px;
-    font-weight: 700;
+    font-size: 20px !important;
+    // font-weight: 700;
     text-align: center;
   }
 }