设备基本运行情况

src/views/modules_guAn/visualization/modules/EquipmentInfo.vue

@@ -1,8 +1,38 @@
 <template>
   <div class="equipment-info-module">
     <common-title title="设备基本运行情况"></common-title>    
-    <div class="">
-
+    <div class="box">
+        <a-row>
+          <a-col :span="12">
+            湿度实值
+          </a-col>
+          <a-col :span="12">
+            30%R.H
+          </a-col>
+          <a-col :span="12">
+            温度实值
+          </a-col>
+          <a-col :span="12">
+            20℃
+          </a-col>
+          <a-col :span="12">
+            辐射强度实值
+          </a-col>
+          <a-col :span="12">
+            20W/㎡
+          </a-col>
+        </a-row>
+      
+      <!-- <div id="demo1">
+        <div>湿度实值</div>
+        <div>温度实值</div>
+        <div>辐射强度实值</div>
+      </div>
+      <div>
+        <div>30%R.H</div>
+        <div>20℃</div>
+        <div>20W/㎡</div>
+      </div> -->
     </div>
   </div>
 </template>
@@ -29,9 +59,36 @@ export default {
 <style scoped>
   @import '~@assets/less/uStyle.less';
 </style>
-<style lang="less">
+<style lang="less" scoped>
   .equipment-info-module{
     width: 100%;
     height: 100%;
   }
+  .box {
+    width: 100%;
+    height: calc(100% - 26px);
+    border-width: 8px 0 0 6px;
+    // border: 1px solid rgb(255, 255, 255);
+    // display: flex;
+    // /* row (默认值) : 主轴为水平万向，起点在左端。*/
+    // flex-direction: row;
+  }
+  .box>div#demo1{
+    width: 50%;
+    height: 94%;
+    margin: 2%;
+    color: #eeeeee;
+    font-size: 15px;
+    // border: 1px solid rgb(255, 255, 255);
+  }
+  .box>div{
+    width: 70%;
+    height: 94%;
+    color: #eeeeee;
+    font-size: 15px;
+    // border: 1px solid rgb(255, 255, 255);
+  }
+  .box>div>div{
+    padding: 6%;
+  }
 </style>