邓洁 : 风机接口对接及用电量弹窗大小

src/assets/styles/index.scss

@@ -18,13 +18,13 @@ html, body, #app, .el-container, .el-aside, .el-main {
 }
 
 .tunnel-title {
-  width: 2330px;
+  width: 1718px;
-  height: 156px;
+  height: 146px;
   z-index: 2;
   position: absolute;
   top: 0;
   left: 50%;
-  margin-left: -1165px;
+  margin-left: -859px;
   background-image: url('../images/topAndDown/sp_tb.png');
 }
 
@@ -247,29 +247,36 @@ html, body, #app, .el-container, .el-aside, .el-main {
 
 //弹窗样式
 .digital-tunnel {
-  #container {
-    height: 650px;
-    width: 1300px;
-  }
 
-  #containerEle {
+.chat-dialog{
-    height: 564px;
+  display: flex;
-    width: 1300px;
+  #container {
+    flex: 1;
+    height: 650px;
+    //width: 1300px;
   }
+  #containerEle {
+    flex: 1;
+    height: 1060px;
+    //width: 2180px;
+  }
+}
+
 
   .el-dialog {
+    position: relative;
     display: flex;
     flex-direction: column;
-    height: 785px;
+    height: 60%;
     border: 2px solid #0F82AF;
     background: rgba(6, 34, 71, 0.78);
     border-radius: 20px;
     padding: 47px 30px;
     box-sizing: border-box;
-    margin: 588px auto 0 auto;
+    margin: 548px auto 0 auto;
 
     .el-dialog__header {
-      padding:0 0 25px 0;
+      padding: 0 0 25px 0;
       //display: none;
       .el-dialog__title {
         font-size: 32px;
@@ -339,8 +346,8 @@ html, body, #app, .el-container, .el-aside, .el-main {
     justify-content: center;
 
     .allUsedEle {
-      width: 240px;
+      width: 300px;
-      height: 149px;
+      height: 200px;
       border-radius: 10px;
       border: 2px solid #0F82AF;
       display: flex;
@@ -355,16 +362,16 @@ html, body, #app, .el-container, .el-aside, .el-main {
         display: flex;
         justify-content: center;
         align-items: center;
-        width: 240px;
+        width: 300px;
-        height: 50px;
+        height: 100px;
         background: #264A78;
-        font-size: 26px;
+        font-size: 45px;
         color: #FFFFFF;
       }
 
       .value {
-        margin-top: 20px;
+        margin-top: 15px;
-        font-size: 40px;
+        font-size: 50px;
         font-family: MicrosoftYaHei;
         color: #FFFFFF;
       }

src/components/content/usedEle/UsedEle.vue

@@ -11,7 +11,7 @@
       </div>
     </div>
     <div class="digital-tunnel">
-      <el-dialog v-model="isVisited" width="1365px" :modal="false">
+      <el-dialog v-model="isVisited" width="55%" :modal="false">
         <div class="left-top-icon"></div>
         <div class="right-top-icon"></div>
         <div class="top-tag">
@@ -28,7 +28,10 @@
             <div class="value">345v</div>
           </div>
         </div>
-        <div id="containerEle"></div>
+       <div class="chat-dialog">
+         <div id="containerEle"></div>
+         <div style="width: 1px;"></div>
+       </div>
         <div class="left-bottom-icon"></div>
         <div class="right-bottom-icon"></div>
       </el-dialog>
@@ -106,16 +109,14 @@ const initChart = () => {
       left: 0,
       textStyle: {
         color: '#FFFFFF',
-        fontSize: 28
+        fontSize: 45
-      },
+      }
-      // itemWidth: 20,
-      // itemHeight: 20
     },
     //离容器四侧的距离
     grid: {
       left: 0, // 左边距
       right: 20, // 右边距
-      // top: 80, // 顶边距
+      top: 80, // 顶边距
       bottom: 20, // 底边距
       containLabel: true,
     },
@@ -130,7 +131,7 @@ const initChart = () => {
       data: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '29', '30', '31'],
       axisLabel: {
         textStyle: {
-          fontSize: 24,
+          fontSize: 45,
           color: '#D6F1FA'
         },
       },
@@ -140,7 +141,7 @@ const initChart = () => {
       type: 'value',
       axisLabel: {
         textStyle: {
-          fontSize: 24,
+          fontSize: 45,
           color: '#D6F1FA'
         },
       },
@@ -148,9 +149,15 @@ const initChart = () => {
     //配置项
     series: [
       {
+        name:'日用电量',
         data: [120, 200, 150, 80, 70, 110, 130, 100, 140, 130, 160, 150, 90, 130, 110, 120, 150, 140, 130, 120, 110, 100, 90, 80, 100, 140, 130, 160, 150, 24, 50],
         type: 'bar'
       },
+      {
+        name:'日节省量',
+        data: [140, 130, 160, 150, 90, 130, 110, 120, 150, 140, 130, 120, 110, 100, 90, 80, 100, 140, 130, 160, 150, 24, 50,120, 200, 150, 80, 70, 110, 130, 100, ],
+        type: 'bar'
+      },
     ]
   }
   myEcharts.setOption(option);
@@ -165,6 +172,9 @@ const getImageUrl = (name) => {
 </script>
 
 <style lang="scss" scoped>
+:deep(.el-dialog__header) {
+  padding: 0!important;
+}
 #used-ele {
   width: 830px;
   height: 90px;