经济运行页面自适应完成

.env.development

@@ -1,6 +1,6 @@
 
-# VUE_APP_API=http://192.168.1.103:6060
-# VUE_APP_Matrix=http://192.168.1.103:6060
+# VUE_APP_API=http://192.168.1.105:6060
+# VUE_APP_Matrix=http://192.168.1.105:6060
 
 VUE_APP_API=http://10.81.3.153:6060
 # # 经济运行 全景监视 

src/assets/styles/dialog.less

@@ -32,7 +32,7 @@
   }
 }
 .parcel-box {
-  padding: 0 30px !important;
+  padding: 0 30px;
 }
 .title-select .el-select .el-input__inner {
   width: 133px;

src/components/coms/panel/panel.vue

@@ -64,7 +64,7 @@ export default {
   }
 
   &.no-title {
-    border-left: 0vh;
+    border-left: 0;
   }
 
   &.no-title::before {
@@ -74,24 +74,24 @@ export default {
   .panel-header {
     display: flex;
     font-size: 14px;
-    padding-left: 1.185vh;
+    padding-left: 15px;
     background: rgba(255, 255, 255, 10%);
     line-height: 27px;
-    margin-bottom: 0.7407vh;
+    margin-bottom: 10px;
     height: 27px;
 
     .panel-title {
       color: fade(#fff, 75);
       flex: 1 1 auto;
       .panel-icon {
-        margin-right: 0.741vh;
+        margin-right: 5px;
       }
     }
 
     .panel-tools {
       flex: 0 0 auto;
       color: #ffffff4d;
-      padding: 0 0.741vh;
+      padding: 0 5px;
       font-size: 12px;
       letter-spacing: 0.093vh;
     }
@@ -99,14 +99,15 @@ export default {
 
   .panel-body {
     position: relative;
+    height: calc(100% - 27px - 10px);
   }
 
   &.line .panel-body {
-    padding-left: 1.185vh;
+    padding-left: 15px;
   }
 
   &.no-title .panel-body {
-    padding-left: 0vh;
+    padding-left: 0;
   }
 }
 </style>

src/router/index.js

@@ -608,31 +608,17 @@ export const asyncRoutes = [
         ],
       },
       {
-        path: "performanceAnalyse",
-        redirect: "performanceAnalyse/standAloneAnalyse",
+        path: "performanceAssess",
         component: () =>
-          import("@/views/economicsOperation/performanceAnalyse"),
-        name: "performanceAnalyse",
+          import(
+            "@/views/economicsOperation/performanceAnalyse/performanceAssess"
+          ),
+        name: "performanceAssess",
         meta: {
           title: "性能评估",
           icon: "svg-fjfx",
           permissions: ["jn_xndjpg", "*:*:*"],
         },
-        children: [
-          {
-            path: "performanceAssess",
-            component: () =>
-              import(
-                "@/views/economicsOperation/performanceAnalyse/performanceAssess"
-              ),
-            name: "performanceAssess",
-            meta: {
-              title: "性能等级评估",
-              icon: "",
-              permissions: ["jn_xndjpg", "*:*:*"],
-            },
-          },
-        ],
       },
       {
         path: "powerCurve",
@@ -758,7 +744,7 @@ export const asyncRoutes = [
           import("@/views/economicsOperation/monthElectricAnalyse/index.vue"),
         name: "monthElectricAnalyse",
         meta: {
-          title: "月发电量分析",
+          title: "功率预测分析",
           icon: "svg-yfdl",
           permissions: ["jn_ztfx", "*:*:*"],
         },

src/views/economicsOperation/analyse/index.vue

@@ -1,15 +1,11 @@
 <template>
-  <div>
-   <router-view />
-  </div>
+  <router-view />
 </template>
 
 <script>
 export default {
-  name:'performanceAnalyse',//性能分析
-}
+  name: "performanceAnalyse", //性能分析
+};
 </script>
 
-<style>
-
-</style>
+<style></style>

src/views/economicsOperation/analyse/monthlyAnalysis/index.vue

@@ -65,7 +65,13 @@
         >
       </div>
     </div>
-    <div style="background: rgba(0, 0, 0, 0.4)">
+    <div
+      style="
+        background: rgba(0, 0, 0, 0.4);
+        height: calc(100% - 76px);
+        padding-bottom: 15px;
+      "
+    >
       <div class="monthMachine_title clearfix">
         <div class="leftContent floatLeft"><span>单机月度分析</span></div>
         <div class="rightContent floatRight"></div>
@@ -75,7 +81,7 @@
           :data="monthMachineData"
           stripe
           size="mini"
-          height="75vh"
+          height="calc(100% - 40px)"
           ref="month_table"
           style="width: 100%"
         >
@@ -200,7 +206,7 @@ export default {
         { title: "机组功率一致性(%)", code: "glyzxxs" },
       ],
       page: {
-        pagesize: 19,
+        pagesize: 21,
         currentPage: 1,
         total: 0,
       },
@@ -265,11 +271,6 @@ export default {
       this.getTableData();
     },
     async getTableData() {
-      if (this.isFullScreen) {
-        this.page.pagesize = 22;
-      } else {
-        this.page.pagesize = 19;
-      }
       let params = {
         cmId: this.companyVal,
         type: this.tabIndex,
@@ -336,7 +337,8 @@ export default {
 
 <style lang="less">
 .monthMachine {
-  padding: 0 23px;
+  padding: 0 30px;
+  height: 100%;
   .monthMachine_title {
     padding-left: 10px;
     .leftContent {
@@ -379,8 +381,8 @@ export default {
     display: flex;
     flex-direction: row;
     align-items: center;
-    margin-top: 10px;
-    margin-bottom: 10px;
+    padding-top: 10px;
+    padding-bottom: 10px;
 
     .station {
       display: flex;
@@ -457,41 +459,11 @@ export default {
     }
   }
   .economicTable1 {
-    margin: 0 5px 5px 5px;
-    padding-bottom: 10px;
+    height: calc(100% - 32px);
     .el-pagination {
+      padding-top: 5px;
       display: flex;
       justify-content: flex-end;
-    //   margin-right: 40px;
-    //   margin-top: 20px;
-
-    //   .btn-prev,
-    //   .btn-next,
-    //   .btn-quickprev,
-    //   .btn-quicknext,
-    //   .el-pager,
-    //   .number {
-    //     background: rgba(58, 63, 75, 0.4);
-    //     color: #fff;
-    //     border-radius: 2px;
-    //   }
-
-    //   .el-pager .active {
-    //     background: #05bb4c;
-    //     color: #fff;
-    //     border-radius: 2px;
-    //   }
-
-    //   .el-pagination__total,
-    //   .el-pagination__jump {
-    //     color: #fff;
-    //     .el-input__inner {
-    //       background: rgba(58, 63, 75, 0.2);
-    //       border: 1px solid #3e4349;
-    //       color: #fff;
-    //       border-radius: 2px;
-    //     }
-    //   }
     }
   }
   .el-overlay {

src/views/economicsOperation/analyse/standAloneAnalyse/historyDetail.vue

@@ -83,7 +83,7 @@
         :data="historysingleMachineData"
         stripe
         size="mini"
-        height="80vh"
+        height="calc(100% - 40px)"
         ref="historysingleTable"
         style="width: 100%"
       >
@@ -116,7 +116,6 @@
           :label="item.title"
           show-overflow-tooltip
           align="center"
-          
         >
           <template #header="scope">
             <div>{{ scope.column.label }}</div>
@@ -390,25 +389,14 @@ export default {
 
 <style lang="less">
 .historysingleMachine {
-  padding: 0 23px;
+  height: 100%;
   .historysingleMachine_top {
     display: flex;
     flex-direction: row;
     align-items: center;
-    margin-top: 10px;
-    margin-bottom: 10px;
+    padding-top: 10px;
+    padding-bottom: 10px;
 
-    .station {
-      display: flex;
-      flex-direction: row;
-      align-items: center;
-      font-size: 14px;
-      font-family: Microsoft YaHei;
-      font-weight: 400;
-      color: #b3b3b3;
-      margin-right: 10px;
-      margin-left: 10px;
-    }
     .stationsv {
       .timeaa {
         font-size: 14px;
@@ -419,43 +407,6 @@ export default {
         margin-left: 10px;
       }
     }
-    .tabCut {
-      display: inline-block;
-      margin: 0 10px;
-
-      div {
-        display: inline-block;
-        width: 60px;
-        height: 27px;
-        border: 1px solid #274934;
-        text-align: center;
-        line-height: 25px;
-        cursor: pointer;
-      }
-
-      div:nth-child(1) {
-        border-radius: 13px 0px 0px 13px;
-      }
-
-      div:nth-child(2) {
-        border-radius: 0px 13px 13px 0px;
-      }
-
-      .active {
-        background-color: rgba(5, 187, 76, 0.9);
-        color: #fff;
-      }
-    }
-
-    .search-input {
-      margin-left: 10px;
-      .el-input__inner {
-        width: 175px;
-      }
-      .el-input__suffix {
-        right: -50px;
-      }
-    }
 
     .but {
       display: flex;
@@ -497,82 +448,8 @@ export default {
       }
     }
   }
-  //   .historysingleMachine_Table {
-  //     padding: 5px;
-  //     padding-bottom: 10px;
-  //     background: rgba(0, 0, 0, 0.4);
-  //     .el-table--mini {
-  //       margin: 5px;
-  //       .el-table__header-wrapper {
-  //         tr {
-  //           background: rgba(83, 89, 104, 0.3) !important;
-  //           th {
-  //             vertical-align: top !important;
-  //           }
-  //           .cell {
-  //             color: #b3b3b3;
-  //             font-family: MicrosoftYaHei;
-  //             font-size: 14px;
-  //           }
-  //         }
-  //       }
-  //       .el-table__body-wrapper {
-  //         tr {
-  //           &:nth-child(2n) {
-  //             background: rgba(83, 89, 104, 0.05) !important;
-  //           }
-  //           .cell {
-  //             color: #d8d8d9;
-  //             font-family: ArialMT;
-  //             font-size: 13px;
-  //             height: 25px !important;
-  //           }
-  //         }
-  //       }
-  //     }
-  //   }
+  .economicTable1 {
+    height: calc(100% - 58px);
+  }
 }
-// .el-pagination {
-//   display: flex;
-//   justify-content: flex-end;
-//   margin-right: 40px;
-//   margin-top: 20px;
-
-//   .btn-prev,
-//   .btn-next,
-//   .btn-quickprev,
-//   .btn-quicknext,
-//   .el-pager,
-//   .number {
-//     background: rgba(58, 63, 75, 0.4) !important;
-//     color: #fff;
-//     border-radius: 2px;
-//   }
-
-//   .el-pager .active {
-//     background: #083c94;
-//     color: #fff;
-//     border-radius: 2px;
-//   }
-
-//   .el-pagination__total,
-//   .el-pagination__jump {
-//     color: #fff;
-//     .el-input__inner {
-//       background: rgba(58, 63, 75, 0.2);
-//       border: 1px solid #3e4349;
-//       color: #fff;
-//       border-radius: 2px;
-//     }
-//   }
-// }
-// .historyBtn {
-//   background: #43516b;
-//   border-radius: 15px;
-//   margin-top: 5px;
-//   border: 1px solid #43516b;
-//   span {
-//     color: #fff;
-//   }
-// }
 </style>

src/views/economicsOperation/analyse/standAloneAnalyse/index.vue

@@ -65,7 +65,7 @@
         >
       </div>
     </div>
-    <div style="background: rgba(0, 0, 0, 0.45)">
+    <div class="singleMachine_content">
       <div class="singleMachine_title clearfix">
         <div class="leftContent floatLeft"><span>单机性能分析</span></div>
         <div class="rightContent floatRight"></div>
@@ -76,7 +76,7 @@
           size="mini"
           stripe
           ref="stand_table"
-          height="75vh"
+          height="calc(100% - 40px)"
           style="width: 100%"
         >
           <el-table-column
@@ -131,6 +131,7 @@
       width="100%"
       custom-class="windhistoryDetailModel"
       :close-on-click-modal="false"
+      fullscreen
     >
       <template #title>
         <div class="dialog-title">
@@ -138,7 +139,7 @@
           <div class="title">{{ dialogTitle }}</div>
         </div>
       </template>
-      <div class="body">
+      <div style="height: 100%">
         <history-detail
           ref="windhistoryDetail"
           :tabIndex="tabIndex"
@@ -152,6 +153,7 @@
       width="100%"
       custom-class="windDetailmodal"
       :close-on-click-modal="false"
+      fullscreen
     >
       <template #title>
         <div class="dialog-title">
@@ -159,7 +161,7 @@
           <div class="title">详情</div>
         </div>
       </template>
-      <div class="body">
+      <div style="height: 100%">
         <wind-detail-dialog
           ref="windDetail"
           :wpArray="stationOptions"
@@ -230,7 +232,7 @@ export default {
         { title: "操作" },
       ],
       page: {
-        pagesize: 20,
+        pagesize: 21,
         currentPage: 1,
         total: 0,
       },
@@ -319,11 +321,6 @@ export default {
       this.getTableData();
     },
     async getTableData() {
-      if (this.isFullScreen) {
-        this.page.pagesize = 21;
-      } else {
-        this.page.pagesize = 20;
-      }
       let params = {
         cmId: this.companyVal,
         type: this.tabIndex,
@@ -407,10 +404,10 @@ export default {
 
 <style lang="less">
 .singleMachine {
-  padding: 0 23px;
+  height: 100%;
+  padding: 0 30px;
 
   .singleMachine_title {
-    padding-left: 10px;
     .leftContent {
       width: 242px;
       height: 41px;
@@ -441,7 +438,11 @@ export default {
       background: url("../../../../assets/imgs/title_right_bg.png");
     }
   }
-
+  .singleMachine_content {
+    background: rgba(0, 0, 0, 0.45);
+    height: calc(100% - 58px);
+    padding-bottom: 20px;
+  }
   .clearfix::after {
     content: "";
     clear: both;
@@ -539,8 +540,7 @@ export default {
   }
 
   .economicTable1 {
-    margin: 0 5px 5px 5px;
-    padding-bottom: 10px;
+    height: calc(100% - 42px);
     // .el-table--mini {
     //   margin: 5px;
     //   .el-table__header-wrapper {
@@ -638,6 +638,7 @@ export default {
 
         .el-dialog__body {
           padding: 10px 20px 20px 20px;
+          height: calc(100% - 80px);
         }
       }
     }

src/views/economicsOperation/analyse/standAloneAnalyse/windDetailDialog.vue

@@ -92,10 +92,10 @@
     </div>
 
     <!-- tab1 -->
-    <div v-if="tabIndex == 0" class="TabOne">
+    <div v-if="tabIndex == 0" class="TabOne tabs">
       <panel :title="'损失电量分析'" class="TabOne_topChart">
         <area-line-chart
-          :height="'22vh'"
+          :height="'100%'"
           :lineData="lostChartData"
           :units="lostChartUnit"
           :areaData="LostChartBgColorData"
@@ -105,7 +105,7 @@
       </panel>
       <panel :title="'电量'" class="TabOne_centerChart">
         <multiple-bar-line-chart
-          :height="'15vh'"
+          :height="'100%'"
           :barData="powerChartData"
           :lineData="powerChartLineData"
           :units="['(kWh)', '(m/s)']"
@@ -114,24 +114,24 @@
       </panel>
       <div class="table-info">
         <panel class="table-panel" :title="'当日报警记录'" :showLine="false">
-          <Table :data="warnTableData" :canScroll="true" :height="'32.5vh'" />
+          <Table :data="warnTableData" :canScroll="true" :height="'100%'" />
         </panel>
         <panel class="table-panel" :title="'当日故障记录'" :showLine="false">
-          <Table :data="stopTableData" :canScroll="true" :height="'32.5vh'" />
+          <Table :data="stopTableData" :canScroll="true" :height="'100%'" />
         </panel>
         <panel class="table-panel" :title="'当日限电记录'" :showLine="false">
-          <Table :data="xdTableData" :canScroll="true" :height="'32.5vh'" />
+          <Table :data="xdTableData" :canScroll="true" :height="'100%'" />
         </panel>
       </div>
     </div>
 
     <!-- tab2 -->
-    <div v-if="tabIndex == 1" class="tab-2">
-      <el-row>
-        <el-col :span="15" style="padding-right: 10px">
-          <panel :title="'功率曲线'" class="mg-b-16">
+    <div v-if="tabIndex == 1" class="tab-2 tabs">
+      <el-row style="height: 100%">
+        <el-col style="height: 100%; padding-right: 10px" :span="15">
+          <panel :title="'功率曲线'" style="height: 270px; margin-bottom: 10px">
             <marker-line-chart
-              :height="'23vh'"
+              :height="'100%'"
               :list="powerLineChartData"
               :units="['(MW)', '(功率)']"
               :showLegend="true"
@@ -139,7 +139,7 @@
           </panel>
           <panel
             :title="'日发电量信息'"
-            class="mg-b-16 outline"
+            style="height: 297px; margin-bottom: 10px"
             :showLine="false"
           >
             <div class="power-info">
@@ -231,7 +231,7 @@
             <div class="month-info-left">
               <panel
                 :title="'月发电量信息'"
-                class="mg-b-16 outline"
+                style="height: 100%"
                 :showLine="false"
               >
                 <div class="power-info month-3">
@@ -305,7 +305,7 @@
             <div class="month-info-right">
               <panel
                 :title="'年发电量信息'"
-                class="mg-b-16 outline"
+                style="height: calc(100% - 220px - 10px)"
                 :showLine="false"
               >
                 <div class="power-info month-2">
@@ -333,7 +333,7 @@
                   </div>
                   <direction-radar-chart
                     :width="'80%'"
-                    :height="'180px'"
+                    :height="'100%'"
                     :series="windResourcesData"
                     :showLegend="true"
                   />
@@ -342,16 +342,16 @@
             </div>
           </div>
         </el-col>
-        <el-col :span="9">
+        <el-col :span="9" style="height: 100%">
           <panel
-            class="table-panel outline mg-b-16"
+            class="table-panel outline"
             :title="'当日报警记录'"
             :showLine="false"
           >
             <Table :data="warnTableData" :canScroll="true" :height="'23vh'" />
           </panel>
           <panel
-            class="table-panel outline mg-b-16"
+            class="table-panel outline"
             :title="'当日故障记录'"
             :showLine="false"
           >
@@ -373,8 +373,8 @@
     </div>
 
     <!-- tab3 -->
-    <div v-if="tabIndex == 2" class="tab-3">
-      <el-row>
+    <div v-if="tabIndex == 2" class="tab-3 tabs">
+      <el-row style="height: calc((100% - 10px) / 2); margin-bottom: 10px">
         <el-col :span="8" class="tabColSty">
           <panel
             :title="'日最大风速'"
@@ -382,7 +382,7 @@
             :icon="'svg-wind-site'"
           >
             <div class="wind-info">
-              <div class="legend mg-r-16">
+              <div class="legend">
                 <span class="dot"></span>
                 <span class="titSty">{{ rzdfsStr }}</span>
               </div>
@@ -394,7 +394,7 @@
               /> -->
               <rander-new-chart
                 width="100%"
-                height="350px"
+                height="100%"
                 :lenged="rzdfsLen"
                 :xAxis="rzdfsxaisx"
                 :series="rzdfsData"
@@ -410,7 +410,7 @@
             :icon="'svg-wind-site'"
           >
             <div class="wind-info">
-              <div class="legend mg-r-16">
+              <div class="legend">
                 <span class="dot"></span>
                 <span class="titSty">{{ yzdfsStr }}</span>
               </div>
@@ -422,7 +422,7 @@
               /> -->
               <rander-new-chart
                 width="100%"
-                height="350px"
+                height="100%"
                 :lenged="yzdfsLen"
                 :xAxis="yzdfsxaisx"
                 :series="yzdfsData"
@@ -438,7 +438,7 @@
             :icon="'svg-wind-site'"
           >
             <div class="wind-info">
-              <div class="legend mg-r-16">
+              <div class="legend">
                 <span class="dot"></span>
                 <span class="titSty">{{ nzdfsStr }}</span>
               </div>
@@ -450,7 +450,7 @@
               /> -->
               <rander-new-chart
                 width="100%"
-                height="350px"
+                height="100%"
                 :lenged="nzdfsLen"
                 :xAxis="nzdfsxaisx"
                 :series="nzdfsData"
@@ -460,7 +460,7 @@
           </panel>
         </el-col>
       </el-row>
-      <el-row>
+      <el-row style="height: calc((100% - 10px) / 2)">
         <el-col :span="8" class="tabColSty">
           <panel
             :title="'日风向频率'"
@@ -468,7 +468,7 @@
             :icon="'svg-wind-site'"
           >
             <div class="wind-info">
-              <div class="legend mg-r-16">
+              <div class="legend">
                 <span class="dot"></span>
                 <span class="titSty">{{ rfxplStr }}</span>
               </div>
@@ -480,7 +480,7 @@
               /> -->
               <rander-new-chart
                 width="100%"
-                height="350px"
+                height="100%"
                 :lenged="rfxplLen"
                 :xAxis="rfxplxaisx"
                 :series="rfxplData"
@@ -496,7 +496,7 @@
             :icon="'svg-wind-site'"
           >
             <div class="wind-info">
-              <div class="legend mg-r-16">
+              <div class="legend">
                 <span class="dot"></span>
                 <span class="titSty">{{ yfxplStr }}</span>
               </div>
@@ -508,7 +508,7 @@
               /> -->
               <rander-new-chart
                 width="100%"
-                height="350px"
+                height="100%"
                 :lenged="yfxplLen"
                 :xAxis="yfxplxaisx"
                 :series="yfxplData"
@@ -524,7 +524,7 @@
             :icon="'svg-wind-site'"
           >
             <div class="wind-info">
-              <div class="legend mg-r-16">
+              <div class="legend">
                 <span class="dot"></span>
                 <span class="titSty">{{ nfxplStr }}</span>
               </div>
@@ -536,7 +536,7 @@
               /> -->
               <rander-new-chart
                 width="100%"
-                height="350px"
+                height="100%"
                 :lenged="nfxplLen"
                 :xAxis="nfxplxaisx"
                 :series="nfxplData"
@@ -549,8 +549,8 @@
     </div>
 
     <!-- tab4 -->
-    <div v-if="tabIndex == 3" class="tab-4">
-      <el-row>
+    <div v-if="tabIndex == 3" class="tab-4 tabs">
+      <el-row style="height: calc((100% - 10px) / 2); margin-bottom: 10px">
         <el-col :span="8" class="tabColSty">
           <panel
             :title="'日最大风速'"
@@ -570,7 +570,7 @@
               /> -->
               <rander-new-chart
                 width="100%"
-                height="350px"
+                height="100%"
                 :lenged="rzdfsLen"
                 :xAxis="rzdfsxaisx"
                 :series="rzdfsData"
@@ -598,7 +598,7 @@
               /> -->
               <rander-new-chart
                 width="100%"
-                height="350px"
+                height="100%"
                 :lenged="yzdfsLen"
                 :xAxis="yzdfsxaisx"
                 :series="yzdfsData"
@@ -626,7 +626,7 @@
               /> -->
               <rander-new-chart
                 width="100%"
-                height="350px"
+                height="100%"
                 :lenged="nzdfsLen"
                 :xAxis="nzdfsxaisx"
                 :series="nzdfsData"
@@ -636,7 +636,7 @@
           </panel>
         </el-col>
       </el-row>
-      <el-row>
+      <el-row style="height: calc((100% - 10px) / 2)">
         <el-col :span="8" class="tabColSty">
           <panel
             :title="'日风向频率'"
@@ -644,7 +644,7 @@
             :icon="'svg-wind-site'"
           >
             <div class="wind-info">
-              <div class="legend mg-r-16">
+              <div class="legend">
                 <span class="dot"></span>
                 <span class="titSty">{{ rfxplStr }}</span>
               </div>
@@ -656,7 +656,7 @@
               /> -->
               <rander-new-chart
                 width="100%"
-                height="350px"
+                height="100%"
                 :lenged="rfxplLen"
                 :xAxis="rfxplxaisx"
                 :series="rfxplData"
@@ -672,7 +672,7 @@
             :icon="'svg-wind-site'"
           >
             <div class="wind-info">
-              <div class="legend mg-r-16">
+              <div class="legend">
                 <span class="dot"></span>
                 <span class="titSty">{{ yfxplStr }}</span>
               </div>
@@ -684,7 +684,7 @@
               /> -->
               <rander-new-chart
                 width="100%"
-                height="350px"
+                height="100%"
                 :lenged="yfxplLen"
                 :xAxis="yfxplxaisx"
                 :series="yfxplData"
@@ -700,7 +700,7 @@
             :icon="'svg-wind-site'"
           >
             <div class="wind-info">
-              <div class="legend mg-r-16">
+              <div class="legend">
                 <span class="dot"></span>
                 <span class="titSty">{{ nfxplStr }}</span>
               </div>
@@ -712,7 +712,7 @@
               /> -->
               <rander-new-chart
                 width="100%"
-                height="350px"
+                height="100%"
                 :lenged="nfxplLen"
                 :xAxis="nfxplxaisx"
                 :series="nfxplData"
@@ -725,8 +725,8 @@
     </div>
 
     <!-- tab5 -->
-    <div v-if="tabIndex == 4" class="tab-5">
-      <el-row>
+    <div v-if="tabIndex == 4" class="tab-5 tabs">
+      <el-row style="height: calc((100% - 10px) / 2); margin-bottom: 10px">
         <el-col :span="8">
           <panel title="日小风切入">
             <dual-pie-chart
@@ -758,7 +758,7 @@
           </panel>
         </el-col>
       </el-row>
-      <el-row>
+      <el-row style="height: calc((100% - 10px) / 2)">
         <el-col :span="8">
           <panel title="日小风切出">
             <dual-pie-chart
@@ -1782,9 +1782,10 @@ export default {
   margin-left: 50px;
 }
 .windDetail {
+  height: 100%;
   .action-bar {
     display: flex;
-    margin: 10px 0 20px 0;
+    padding: 10px 0 20px 0;
     .selections {
       flex: 1 0 auto;
       display: flex;
@@ -1839,21 +1840,25 @@ export default {
       }
     }
   }
-
+  .tabs {
+    height: calc(100% - 55px);
+  }
   .outline {
     outline: 1px solid fade(#606769, 50);
   }
 
   .TabOne {
     .TabOne_topChart {
+      height: calc((100% - 260px) / 2);
       margin-bottom: 10px;
     }
     .TabOne_centerChart {
       margin-bottom: 10px;
+      height: calc((100% - 260px) / 2);
     }
     .table-info {
       display: flex;
-
+      height: 260px;
       .table-panel {
         flex: 1 0 calc(100% / 3 - 8px);
         outline: 1px solid fade(#606769, 50);
@@ -1870,14 +1875,12 @@ export default {
       display: flex;
       flex-wrap: wrap;
       justify-content: space-between;
-
+      height: 100%;
       &.month-3 {
         .info-item {
+          height: calc((100% - 8px * 4) / 5);
+          line-height: calc((100% - 8px * 4) / 5);
           flex: 0 0 calc(100% / 3 - 6px);
-          &:nth-child(-n + 5) {
-            margin-top: 8px;
-          }
-
           &:nth-child(-n + 3) {
             margin-top: 0px;
           }
@@ -1886,6 +1889,7 @@ export default {
       &.month-2 {
         .info-item {
           flex: 0 0 calc(100% / 2 - 4px);
+          height: calc(100% - 8px);
           &:nth-child(-n + 5) {
             margin-top: 8px;
           }
@@ -1899,12 +1903,10 @@ export default {
       .info-item {
         display: flex;
         align-items: center;
-
         flex: 0 0 calc(100% / 5 - 8px);
         background: fade(#606769, 20);
-        height: 4.6296vh;
-        line-height: 4.6296vh;
-        margin-top: 8px;
+        height: calc((100% - 8px * 3) / 4);
+        line-height: calc((100% - 8px * 3) / 4);
 
         &:nth-child(-n + 5) {
           margin-top: 0px;
@@ -1924,35 +1926,35 @@ export default {
         }
       }
     }
-    .mg-b-16 {
-      margin-bottom: 1.481vh;
-    }
 
     .month-info {
       display: flex;
-
+      height: calc(100% - 270px - 297px - 20px);
       .month-info-left {
+        height: 100%;
         flex: 0 0 705px;
         margin-right: 10px;
       }
 
       .month-info-right {
+        height: 100%;
         flex: 1 0 auto;
       }
     }
 
-    .moon-other {
-      flex: 1 0 auto;
-    }
-
     .radar-panel {
-      height: 22.5vh;
-
-      .panel-body {
+      height: 220px;
+      .wind-info {
         height: 100%;
       }
     }
-
+    .table-panel {
+      margin-bottom: 10px;
+      height: calc((100% - 10px * 2) / 3);
+      &:nth-child(3) {
+        margin-bottom: 0px;
+      }
+    }
     .wind-info {
       display: flex;
 
@@ -1979,11 +1981,14 @@ export default {
   .tab-3,
   .tab-4 {
     .tabColSty {
-      margin-bottom: 20px;
-      height: 40vh;
+      height: 100%;
+      .radar-panel {
+        height: 100%;
+      }
     }
     .wind-info {
       position: relative;
+      height: 100%;
 
       .legend {
         position: absolute;

src/views/economicsOperation/benchmarkingManagement/compontent/dayinfo.vue

@@ -35,7 +35,7 @@
         </table> -->
         <el-table
           :data="tabs"
-          style="width: 43vw"
+          style="width: 100%"
           :cell-style="{ padding: '6px' }"
           :row-style="{ height: '4' }"
           stripe
@@ -306,7 +306,7 @@ export default {
         flex-grow: 1;
         display: flex;
         align-items: center;
-        height: 43vh;
+        height: 345px;
       }
     }
 

src/views/economicsOperation/benchmarkingManagement/intervalBenchmarking/index.vue

@@ -113,16 +113,12 @@
         <div class="leftContent"><span>场际对标</span></div>
         <div class="rightContent"></div>
       </div>
-      <div
-        class="economicTable"
-        v-if="!displayDetail"
-        :style="{ height: echartsHeight }"
-      >
+      <div class="economicTable" v-if="!displayDetail">
         <el-table
           :data="tableData"
           ref="multipleTable"
           size="mini"
-          :height="echartsHeight"
+          height="calc(100% - 40px)"
           :cell-style="{ padding: '6px' }"
           :row-style="{ height: '0' }"
           stripe
@@ -401,7 +397,7 @@
         <PieChart
           :lossPower="lossPower"
           width="100%"
-          height="20vh"
+          height="calc(100% - 39px)"
           :showLable="false"
         ></PieChart>
       </div>
@@ -414,19 +410,22 @@
         <BarCharts
           :list="barList"
           width="100%"
-          height="30vh"
+          height="calc(100% - 39px)"
           :showLegend="true"
           :xdate="false"
           :colorIndex="true"
         ></BarCharts>
       </div>
     </div>
-    <div v-if="displayDetail" class="economicTable details">
+    <div
+      v-if="displayDetail"
+      style="height: calc(100% - 43px - 35px); padding-bottom: 10px"
+    >
       <el-table
         :data="detailTable"
         ref="multipleTable"
         size="mini"
-        height="78vh"
+        height="100%"
         :cell-style="{ padding: '6px' }"
         :row-style="{ height: '4' }"
         stripe
@@ -639,12 +638,12 @@ export default {
   data() {
     return {
       page: {
-        pagesize: 10,
+        pagesize: 9,
         currentPage: 1,
         total: 0,
       },
       pageD: {
-        pagesize: 18,
+        pagesize: 19,
         currentPage: 1,
         total: 0,
       },
@@ -1051,9 +1050,13 @@ export default {
 <style lang="less" scoped>
 .pagination-class {
   text-align: right;
+  margin-top: 5px;
 }
 .parcel-box {
-  padding: 0 15px;
+  height: 100%;
+  width: 100%;
+  padding: 0 30px;
+  padding-bottom: 10px;
 }
 
 .title {
@@ -1160,11 +1163,15 @@ export default {
 }
 .bodys {
   width: 100%;
+  height: calc(100% - 350px - 43px - 20px);
   background-color: rgba(0, 0, 0, 0.45);
-  padding: 5px;
-  padding-bottom: 33px;
+  padding-bottom: 20px;
   border-radius: 5px;
 }
+.economicTable {
+  width: 100%;
+  height: calc(100% - 36px);
+}
 .line {
   display: flex;
   flex-direction: row;
@@ -1197,19 +1204,9 @@ export default {
   }
 }
 
-.economicTable {
-  width: 100%;
-  &.details {
-    height: 79vh;
-    padding: 5px;
-    background-color: rgba(0, 0, 0, 0.45);
-    border-radius: 5px;
-  }
-}
-
 .echarts {
   width: 100%;
-  height: 26vh;
+  height: 350px;
   display: flex;
   flex-direction: row;
   align-items: center;

src/views/economicsOperation/benchmarkingManagement/loseRate/index.vue

@@ -154,12 +154,12 @@
         <div class="leftContent"><span>五项损失率</span></div>
         <div class="rightContent"></div>
       </div>
-      <div class="economicTable" :style="{ height: echartsHeight }">
+      <div class="economicTable">
         <el-table
           :data="tableData"
           ref="multipleTable"
           size="mini"
-          :height="echartsHeight"
+          height="100%"
           :cell-style="{ padding: '4px' }"
           :row-style="{ height: '0' }"
           stripe
@@ -423,7 +423,7 @@
         <PieChart
           :lossPower="lossPower"
           width="100%"
-          height="20vh"
+          height="calc(100% - 39px)"
           :showLable="false"
         ></PieChart>
       </div>
@@ -436,19 +436,22 @@
         <BarCharts
           :list="barList"
           width="100%"
-          height="30vh"
+          height="calc(100% - 39px)"
           :showLegend="true"
           :xdate="false"
           :colorIndex="true"
         ></BarCharts>
       </div>
     </div>
-    <div v-if="displayDetail">
+    <div
+      v-if="displayDetail"
+      style="height: calc(100% - 43px - 35px); padding-bottom: 10px"
+    >
       <el-table
         :data="detailTable"
         ref="multipleTable"
         size="mini"
-        height="88vh"
+        height="100%"
         :cell-style="{ padding: '0px' }"
         :row-style="{ height: '0' }"
         stripe
@@ -575,25 +578,17 @@
         >
         </el-table-column>
       </el-table>
+      <div class="pagination-class">
+        <el-pagination
+          @current-change="handlePageDChange"
+          :current-page="pageD.currentPage"
+          :page-size="pageD.pagesize"
+          layout="total, prev, pager, next, jumper"
+          :total="pageD.total"
+        >
+        </el-pagination>
+      </div>
     </div>
-
-    <!-- <el-dialog
-      title="对标排名分析"
-      v-model="dialogVisible"
-      width="70%"
-      top="10vh"
-      custom-class="modal"
-      :close-on-click-modal="false"
-    >
-      <dayinfo
-        :radarValue="radarValue"
-        :title="[windNum, windNum2]"
-        :windNum="windNum"
-        :windNum2="windNum2"
-        :tabs="tabs"
-        :analyisDialog="analyisDialog"
-      />
-    </el-dialog> -->
     <el-dialog
       class="dialogs"
       width="90%"
@@ -677,8 +672,12 @@ export default {
       windNum5: "",
       tabs: [],
       analyisDialog: [],
-      screenHeight: window.innerHeight,
-      echartsHeight: "55vh",
+      detailRow: {},
+      pageD: {
+        pagesize: 24,
+        currentPage: 1,
+        total: 0,
+      },
     };
   },
   created() {
@@ -696,20 +695,11 @@ export default {
     this.endTime = dayjs(new Date().getTime()).format("YYYY-MM-DD");
     this.initialization();
   },
-  mounted() {
-    if (this.screenHeight > 1100) {
-      this.echartsHeight = "58vh";
-    } else {
-      this.echartsHeight = "55vh";
-    }
-    window.onresize = () => {
-      return (() => {
-        window.screenHeight = window.innerHeight;
-        this.screenHeight = window.screenHeight;
-      })();
-    };
-  },
   methods: {
+    handlePageDChange(val) {
+      this.pageD.currentPage = val;
+      this.goDetail();
+    },
     tabClick(val) {
       this.tabIndex = val;
       this.stationObj = [];
@@ -853,16 +843,22 @@ export default {
       this.chooseList = arr;
     },
     goDetail(row) {
-      this.displayDetail = true;
+      if (!this.displayDetail) {
+        this.displayDetail = true;
+        this.detailRow = row;
+      }
       details({
-        id: row.id,
+        id: this.detailRow.id,
         beginDate: this.starTime,
         endDate: this.endTime,
+        pageSize: this.pageD.pagesize,
+        pageNum: this.pageD.currentPage,
         target: "",
         sort: "",
       }).then(({ data: res }) => {
         if (res.data) {
-          this.detailTable = res.data;
+          this.detailTable = res.data.resultList;
+          this.pageD.total = res.data.total;
         }
       });
     },
@@ -1073,7 +1069,10 @@ export default {
 
 <style lang="less" scoped>
 .parcel-box {
-  padding: 0 15px;
+  height: 100%;
+  width: 100%;
+  padding: 0 30px;
+  padding-bottom: 10px;
 }
 
 .title {
@@ -1182,9 +1181,9 @@ export default {
 
 .bodys {
   width: 100%;
+  height: calc(100% - 350px - 43px - 20px);
   background-color: rgba(0, 0, 0, 0.45);
-  padding: 5px;
-  margin-bottom: 19px;
+  padding-bottom: 20px;
   border-radius: 5px;
 }
 
@@ -1222,11 +1221,12 @@ export default {
 
 .economicTable {
   width: 100%;
+  height: calc(100% - 36px);
 }
 
 .echarts {
   width: 100%;
-  height: 26vh;
+  height: 350px;
   display: flex;
   flex-direction: row;
   align-items: center;
@@ -1261,7 +1261,10 @@ export default {
     border-radius: 5px;
   }
 }
-
+.pagination-class {
+  text-align: right;
+  margin-top: 5px;
+}
 .point {
   width: 6px;
   height: 1px;

src/views/economicsOperation/benchmarkingManagement/performanceRankingList/decision1Mx.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="home-body" style="height: 93vh">
+  <div class="home-body" style="height: 100%">
     <div class="title">
       <el-select
         size="mini"
@@ -122,8 +122,8 @@
         <span>{{ val.name }}</span>
       </div>
     </div>
-    <div class="performance" style="height: 90vh">
-      <div class="economicTable" style="height: 86vh">
+    <div class="performance" style="height: calc(100% - 99px)">
+      <div class="economicTable" style="height: 100%">
         <el-table
           :data="tableData"
           size="mini"
@@ -549,7 +549,7 @@ export default {
           if (this.lineData.length > 22) {
             this.height = this.lineData.length * 37 + 53 + "px";
           } else {
-            this.height = 23 * 37 + 80 + "px";
+            this.height = 23 * 38 + 80 + "px";
           }
           this.showDisplay = false;
           setTimeout(() => {

src/views/economicsOperation/benchmarkingManagement/performanceRankingList/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="home-body" style="height: 93vh">
+  <div class="home-body" style="height: 100%">
     <div class="title">
       <el-select
         size="mini"
@@ -130,8 +130,8 @@
         <span>{{ val.name }}</span>
       </div>
     </div>
-    <div class="performance" style="height: 90vh">
-      <div class="economicTable" style="height: 86vh">
+    <div class="performance" style="height: calc(100% - 99px)">
+      <div class="economicTable" style="height: 100%">
         <el-table
           :data="tableData"
           size="mini"
@@ -506,7 +506,7 @@ export default {
           if (this.lineData.length > 22) {
             this.height = this.lineData.length * 37 + 53 + "px";
           } else {
-            this.height = 23 * 37 + 80 + "px";
+            this.height = 23 * 38 + 80 + "px";
           }
           this.showDisplay = false;
           setTimeout(() => {

src/views/economicsOperation/benchmarkingManagement/projectBenchmarking/index.vue

@@ -134,12 +134,12 @@
         <div class="leftContent"><span>项目对标</span></div>
         <div class="rightContent"></div>
       </div>
-      <div class="economicTable" :style="{ height: echartsHeight }">
+      <div class="economicTable">
         <el-table
           :data="tableData"
           ref="multipleTable"
           size="mini"
-          :height="echartsHeight"
+          height="calc(100% - 40px)"
           :cell-style="{ padding: '4px' }"
           :row-style="{ height: '0' }"
           stripe
@@ -418,7 +418,7 @@
         <PieChart
           :lossPower="lossPower"
           width="100%"
-          height="20vh"
+          height="calc(100% - 39px)"
           :showLable="false"
         ></PieChart>
       </div>
@@ -431,7 +431,7 @@
         <BarCharts
           :list="barList"
           width="100%"
-          height="30vh"
+          height="calc(100% - 39px)"
           :showLegend="true"
           :xdate="false"
           :colorIndex="true"
@@ -443,7 +443,7 @@
         :data="detailTable"
         ref="multipleTable"
         size="mini"
-        height="78vh"
+        style="height: calc(100% - 43px - 35px); padding-bottom: 10px"
         :cell-style="{ padding: '0px' }"
         :row-style="{ height: '0' }"
         stripe
@@ -1096,9 +1096,13 @@ export default {
 <style lang="less" scoped>
 .pagination-class {
   text-align: right;
+  margin-top: 5px;
 }
 .parcel-box {
-  padding: 0 15px;
+  height: 100%;
+  width: 100%;
+  padding: 0 30px;
+  padding-bottom: 10px;
 }
 
 .title {
@@ -1203,11 +1207,15 @@ export default {
 }
 .bodys {
   width: 100%;
+  height: calc(100% - 350px - 43px - 20px);
   background-color: rgba(0, 0, 0, 0.45);
-  padding: 5px;
-  padding-bottom: 33px;
+  padding-bottom: 20px;
   border-radius: 5px;
 }
+.economicTable {
+  width: 100%;
+  height: calc(100% - 36px);
+}
 .line {
   display: flex;
   flex-direction: row;
@@ -1239,13 +1247,9 @@ export default {
   }
 }
 
-.economicTable {
-  width: 100%;
-}
-
 .echarts {
   width: 100%;
-  height: 26vh;
+  height: 350px;
   display: flex;
   flex-direction: row;
   align-items: center;

src/views/economicsOperation/benchmarkingManagement/siteBenchmarking/index.vue

@@ -106,7 +106,6 @@
         <el-button round size="mini" class="buttons" @click="funthb"
           >同环比</el-button
         >
-        <!-- <el-button round size="mini" class="buttons">导出</el-button> -->
       </div>
     </div>
     <div class="bodys" v-if="!displayDetail">
@@ -114,12 +113,12 @@
         <div class="leftContent"><span>场内对标</span></div>
         <div class="rightContent"></div>
       </div>
-      <div class="economicTable" :style="{ height: echartsHeight }">
+      <div class="economicTable">
         <el-table
           :data="tableData"
           ref="multipleTable"
           size="mini"
-          :height="echartsHeight"
+          height="calc(100% - 40px)"
           :cell-style="{ padding: '4px' }"
           :row-style="{ height: '0' }"
           stripe
@@ -393,7 +392,7 @@
         <PieChart
           :lossPower="lossPower"
           width="100%"
-          height="20vh"
+          height="calc(100% - 39px)"
           :showLable="false"
         ></PieChart>
       </div>
@@ -406,19 +405,22 @@
         <BarCharts
           :list="barList"
           width="100%"
-          height="29vh"
+          height="calc(100% - 39px)"
           :showLegend="true"
           :xdate="false"
           :colorIndex="true"
         ></BarCharts>
       </div>
     </div>
-    <div v-if="displayDetail">
+    <div
+      v-if="displayDetail"
+      style="height: calc(100% - 43px - 35px); padding-bottom: 10px"
+    >
       <el-table
         :data="detailTable"
         ref="multipleTable"
         size="mini"
-        height="78vh"
+        height="100%"
         :cell-style="{ padding: '0px' }"
         :row-style="{ height: '0' }"
         stripe
@@ -638,7 +640,7 @@
     <el-dialog
       class="dialogs"
       width="94%"
-      top="40px"
+      top="120px"
       v-model="thbVisible"
       :show-close="true"
     >
@@ -650,12 +652,12 @@
       </template>
       <div class="dialog-body">
         <img class="dialog-img" src="@assets/imgs/dialog.png" />
-        <div class="economicTable" :style="{ height: echartsHeight }">
+        <div class="economicTable" style="height: 300px">
           <el-table
             :data="thbData"
             ref="multipleTable1"
             size="mini"
-            :height="echartsHeight"
+            height="100%"
             :cell-style="{ padding: '4px' }"
             :row-style="{ height: '0' }"
             stripe
@@ -944,12 +946,12 @@ export default {
   data() {
     return {
       page: {
-        pagesize: 10,
+        pagesize: 9,
         currentPage: 1,
         total: 0,
       },
       pageD: {
-        pagesize: 18,
+        pagesize: 19,
         currentPage: 1,
         total: 0,
       },
@@ -979,8 +981,6 @@ export default {
       windNum5: "",
       tabs: [],
       analyisDialog: [],
-      screenHeight: window.innerHeight,
-      echartsHeight: "53vh",
       //同环比
       thbVisible: false,
       thbData: [],
@@ -1004,19 +1004,6 @@ export default {
     this.endTime = dayjs(new Date().getTime()).format("YYYY-MM-DD");
     this.initialization();
   },
-  mounted() {
-    if (this.screenHeight > 1100) {
-      this.echartsHeight = "56vh";
-    } else {
-      this.echartsHeight = "53vh";
-    }
-    window.onresize = () => {
-      return (() => {
-        window.screenHeight = window.innerHeight;
-        this.screenHeight = window.screenHeight;
-      })();
-    };
-  },
   methods: {
     handlePageChange(val) {
       this.page.currentPage = val;
@@ -1376,9 +1363,13 @@ export default {
 <style lang="less" scoped>
 .pagination-class {
   text-align: right;
+  margin-top: 5px;
 }
 .parcel-box {
-  padding: 0 15px;
+  height: 100%;
+  width: 100%;
+  padding: 0 30px;
+  padding-bottom: 10px;
 }
 /deep/ .s-tb-th {
   height: 50px;
@@ -1488,12 +1479,15 @@ export default {
 
 .bodys {
   width: 100%;
+  height: calc(100% - 350px - 43px - 20px);
   background-color: rgba(0, 0, 0, 0.45);
-  padding: 5px;
-  padding-bottom: 33px;
+  padding-bottom: 20px;
   border-radius: 5px;
 }
-
+.economicTable {
+  width: 100%;
+  height: calc(100% - 36px);
+}
 .line {
   display: flex;
   flex-direction: row;
@@ -1525,13 +1519,9 @@ export default {
   }
 }
 
-.economicTable {
-  width: 100%;
-}
-
 .echarts {
   width: 100%;
-  height: 26vh;
+  height: 350px;
   display: flex;
   flex-direction: row;
   align-items: center;

src/views/economicsOperation/benchmarkingManagement/wiringBenchmarking/index.vue

@@ -155,12 +155,12 @@
         <div class="leftContent"><span>线路对标</span></div>
         <div class="rightContent"></div>
       </div>
-      <div class="economicTable" :style="{ height: echartsHeight }">
+      <div class="economicTable">
         <el-table
           :data="tableData"
           ref="multipleTable"
           size="mini"
-          :height="echartsHeight"
+          height="calc(100% - 40px)"
           :cell-style="{ padding: '4px' }"
           :row-style="{ height: '0' }"
           stripe
@@ -434,7 +434,7 @@
         <PieChart
           :lossPower="lossPower"
           width="100%"
-          height="20vh"
+          height="calc(100% - 39px)"
           :showLable="false"
         ></PieChart>
       </div>
@@ -447,7 +447,7 @@
         <BarCharts
           :list="barList"
           width="100%"
-          height="30vh"
+          height="calc(100% - 39px)"
           :showLegend="true"
           :xdate="false"
           :colorIndex="true"
@@ -455,12 +455,15 @@
       </div>
     </div>
 
-    <div v-if="displayDetail">
+    <div
+      v-if="displayDetail"
+      style="height: calc(100% - 43px - 35px); padding-bottom: 10px"
+    >
       <el-table
         :data="detailTable"
         ref="multipleTable"
         size="mini"
-        height="78vh"
+        height="100%"
         :cell-style="{ padding: '0px' }"
         :row-style="{ height: '0' }"
         stripe
@@ -709,7 +712,7 @@ export default {
         total: 0,
       },
       pageD: {
-        pagesize: 18,
+        pagesize: 19,
         currentPage: 1,
         total: 0,
       },
@@ -1151,9 +1154,13 @@ export default {
 <style lang="less" scoped>
 .pagination-class {
   text-align: right;
+  margin-top: 5px;
 }
 .parcel-box {
-  padding: 0 15px;
+  height: 100%;
+  width: 100%;
+  padding: 0 30px;
+  padding-bottom: 10px;
 }
 
 .title {
@@ -1261,11 +1268,15 @@ export default {
 }
 .bodys {
   width: 100%;
+  height: calc(100% - 350px - 43px - 20px);
   background-color: rgba(0, 0, 0, 0.45);
-  padding: 5px;
-  padding-bottom: 33px;
+  padding-bottom: 20px;
   border-radius: 5px;
 }
+.economicTable {
+  width: 100%;
+  height: calc(100% - 36px);
+}
 .line {
   display: flex;
   flex-direction: row;
@@ -1297,13 +1308,9 @@ export default {
   }
 }
 
-.economicTable {
-  width: 100%;
-}
-
 .echarts {
   width: 100%;
-  height: 26vh;
+  height: 350px;
   display: flex;
   flex-direction: row;
   align-items: center;

src/views/economicsOperation/efficiency/consumeEfficiency/index.vue

@@ -21,6 +21,7 @@
           <el-date-picker
             v-model="starTime"
             type="date"
+            size="mini"
             value-format="YYYY-MM-DD"
             placeholder="选择日期"
             popper-class="date-select"
@@ -33,6 +34,7 @@
         <div class="search-input">
           <el-date-picker
             v-model="endTime"
+            size="mini"
             type="date"
             value-format="YYYY-MM-DD"
             placeholder="选择日期"
@@ -57,7 +59,7 @@
           style="width: 100%"
           size="mini"
           stripe
-          height="85vh"
+          height="100%"
         >
           <el-table-column
             align="center"
@@ -154,7 +156,6 @@ export default {
   flex-direction: row;
   align-items: center;
   margin-top: 10px;
-  padding-left: 20px;
 
   .station {
     display: flex;
@@ -191,17 +192,11 @@ export default {
   }
 }
 
-.data-bodys {
-  display: flex;
-  flex-direction: column;
-  background-color: rgba(0, 0, 0, 0.45);
-  border-radius: 5px;
-  padding: 5px;
-}
-
 .parcel-box {
-  padding: 0 20px;
-  box-sizing: border-box;
+  height: 100%;
+  width: 100%;
+  padding: 0 30px;
+  padding-bottom: 10px;
 
   .line {
     padding-bottom: 5px;
@@ -227,6 +222,18 @@ export default {
       background: url("../../../../assets/imgs/title_right_bg.png");
     }
   }
+  .data-bodys {
+    display: flex;
+    flex-direction: column;
+    background-color: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+    height: calc(100% - 45px);
+    padding-top: 10px;
+    .economicTable {
+      width: 100%;
+      height: calc(100% - 40px);
+    }
+  }
 }
 
 .clearfix::after {

src/views/economicsOperation/efficiency/index.vue

@@ -1,15 +1,11 @@
 <template>
-  <div>
-    <router-view />
-  </div>
+  <router-view />
 </template>
 
 <script>
 export default {
-  name:'efficiency',//三率
-}
+  name: "efficiency", //三率
+};
 </script>
 
-<style>
-
-</style>
+<style></style>

src/views/economicsOperation/efficiency/restorationEfficiency/index.vue

@@ -21,6 +21,7 @@
           <el-date-picker
             v-model="starTime"
             type="date"
+            size="mini"
             value-format="YYYY-MM-DD"
             placeholder="选择日期"
             popper-class="date-select"
@@ -34,6 +35,7 @@
           <el-date-picker
             v-model="endTime"
             type="date"
+            size="mini"
             value-format="YYYY-MM-DD"
             placeholder="选择日期"
             popper-class="date-select"
@@ -57,7 +59,7 @@
           style="width: 100%"
           size="mini"
           stripe
-          height="85vh"
+          height="100%"
         >
           <el-table-column
             align="center"
@@ -199,7 +201,6 @@ export default {
   flex-direction: row;
   align-items: center;
   margin-top: 10px;
-  padding-left: 20px;
 
   .station {
     display: flex;
@@ -236,18 +237,11 @@ export default {
   }
 }
 
-.data-bodys {
-  display: flex;
-  flex-direction: column;
-  background-color: rgba(0, 0, 0, 0.45);
-  border-radius: 5px;
-  padding: 5px;
-}
-
 .parcel-box {
-  padding: 0 20px;
-  box-sizing: border-box;
-
+  height: 100%;
+  width: 100%;
+  padding: 0 30px;
+  padding-bottom: 10px;
   .line {
     padding-bottom: 5px;
     .leftContent {
@@ -272,6 +266,18 @@ export default {
       background: url("../../../../assets/imgs/title_right_bg.png");
     }
   }
+  .data-bodys {
+    display: flex;
+    flex-direction: column;
+    background-color: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+    height: calc(100% - 45px);
+    padding-top: 10px;
+    .economicTable {
+      width: 100%;
+      height: calc(100% - 40px);
+    }
+  }
 }
 
 .clearfix::after {

src/views/economicsOperation/efficiency/stateEfficiency/index.vue

@@ -21,6 +21,7 @@
           <el-date-picker
             v-model="starTime"
             type="date"
+            size="mini"
             value-format="YYYY-MM-DD"
             placeholder="选择日期"
             popper-class="date-select"
@@ -34,6 +35,7 @@
           <el-date-picker
             v-model="endTime"
             type="date"
+            size="mini"
             value-format="YYYY-MM-DD"
             placeholder="选择日期"
             popper-class="date-select"
@@ -80,7 +82,7 @@
           style="width: 100%"
           size="mini"
           stripe
-          height="85vh"
+          height="100%"
         >
           <el-table-column
             align="center"
@@ -218,7 +220,6 @@ export default {
   flex-direction: row;
   align-items: center;
   margin-top: 10px;
-  padding-left: 20px;
 
   .station {
     display: flex;
@@ -255,17 +256,11 @@ export default {
   }
 }
 
-.data-bodys {
-  display: flex;
-  flex-direction: column;
-  background-color: rgba(0, 0, 0, 0.45);
-  border-radius: 5px;
-  padding: 5px;
-}
-
 .parcel-box {
-  padding: 0 20px;
-  box-sizing: border-box;
+  height: 100%;
+  width: 100%;
+  padding: 0 30px;
+  padding-bottom: 10px;
 
   .line {
     padding-bottom: 5px;
@@ -292,6 +287,18 @@ export default {
       background: url("../../../../assets/imgs/title_right_bg.png");
     }
   }
+  .data-bodys {
+    display: flex;
+    flex-direction: column;
+    background-color: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+    height: calc(100% - 45px);
+    padding-top: 10px;
+    .economicTable {
+      width: 100%;
+      height: calc(100% - 40px);
+    }
+  }
 }
 
 .clearfix::after {

src/views/economicsOperation/monthElectricAnalyse/components/barCharts.vue

@@ -97,7 +97,7 @@ export default {
         },
         legend: {
           show: true,
-          data: ["计划电量", "实发电量"],
+          data: this.list.map((i) => i?.name),
           right: 56,
           icon: "ract",
           itemWidth: 8,

src/views/economicsOperation/monthElectricAnalyse/index.vue

@@ -79,9 +79,7 @@
 
 <script>
 import BarCharts from "./components/barCharts.vue";
-import {
-  companys,
-} from "@/api/curveAnalyse";
+import { companys } from "@/api/curveAnalyse";
 import { GetStationByCompany } from "@/api/factoryMonitor/index.js";
 import { getMonthElectricAnalyse } from "@/api/monthlyPerformanceAnalysis.js";
 export default {
@@ -117,14 +115,14 @@ export default {
       companyOptions: [],
       station: "",
       stationOptions: [],
-      selectValue: "全域数据当年-月发电量",
+      selectValue: "功率预测分析",
       headers: [
         "计划电量",
+        "预测电量",
         "实发电量",
-        "当月占比",
-        "全年占比",
+        "当月占比(实发/计划)",
+        "全年占比(实发/计划)",
         "短期准确率",
-        "超短期准确率",
       ],
     };
   },
@@ -165,11 +163,11 @@ export default {
           //合计列
           let hj = [
             data.bnjhdlhj,
+            data.rfdlychj,
             data.bnsjdlhj,
             null,
             data.qnzbhj + "%",
             null,
-            null,
           ];
           //处理纵向表格数据
           let resData = JSON.parse(JSON.stringify(data.value));
@@ -211,6 +209,11 @@ export default {
               color: "#4B55AE",
             },
             {
+              name: "预测电量",
+              data: resData.map((ele) => ele.rfdlyc),
+              color: "#FF8300",
+            },
+            {
               name: "实发电量",
               data: resData.map((ele) => ele.sjdl),
               color: "#05BB4C",

src/views/economicsOperation/performanceAnalyse/performanceAssess/historyDetail.vue

@@ -22,7 +22,7 @@
         :data="historyEvaluationData"
         stripe
         size="mini"
-        height="85vh"
+        height="100%"
         ref="historysingleTable"
         style="width: 100%"
       >
@@ -140,11 +140,12 @@ export default {
 };
 </script>
 
-<style lang="less">
+<style lang="less" scoped>
 .historyEvaluation {
-  padding: 0 23px;
+  height: 100%;
   .historyEvaluation_top {
     display: flex;
+    padding-bottom: 25px;
     .el-date-editor--daterange {
       background: transparent;
       border: 1px solid #2a374f;
@@ -174,43 +175,8 @@ export default {
     }
   }
   .economicTable1 {
-    padding-bottom: 10px;
+    height: calc(100% - 68px);
     background: rgba(0, 0, 0, 0.4);
-    .el-pagination {
-      display: flex;
-      justify-content: flex-end;
-      margin-right: 40px;
-      margin-top: 20px;
-      .btn-prev,
-      .btn-next,
-      .el-pager .active,
-      .number {
-        background: #43516b;
-      }
-      .el-pager {
-        position: relative;
-        top: -1px;
-        .number {
-          color: #bbbaba;
-        }
-        .active {
-          color: #fff;
-        }
-      }
-      .el-pagination__total,
-      .el-pagination__jump {
-        color: #fff;
-      }
-    }
-    .historyBtn {
-      background: #43516b;
-      border-radius: 15px;
-      margin-top: 5px;
-      border: 1px solid #43516b;
-      span {
-        color: #fff;
-      }
-    }
   }
 }
 </style>

src/views/economicsOperation/performanceAnalyse/performanceAssess/index.vue

@@ -118,7 +118,13 @@
         </div>
       </div>
     </div>
-    <div style="background: rgba(0, 0, 0, 0.4)">
+    <div
+      style="
+        background: rgba(0, 0, 0, 0.4);
+        height: calc(100% - 39px);
+        padding-bottom: 15px;
+      "
+    >
       <div class="Evaluation_title clearfix">
         <div class="leftContent floatLeft"><span>性能等级评估</span></div>
         <div class="rightContent floatRight"></div>
@@ -130,7 +136,7 @@
           stripe
           @selection-change="handleCurrentChange"
           size="mini"
-          height="77vh"
+          height="calc(100% - 40px)"
           ref="Eval_table"
           style="width: 100%"
         >
@@ -190,6 +196,7 @@
       width="100%"
       custom-class="EvaluationhistoryModel"
       :close-on-click-modal="false"
+      fullscreen
     >
       <template #title>
         <div class="dialog-title">
@@ -197,14 +204,14 @@
           <div class="title">{{ dialogTitle }}</div>
         </div>
       </template>
-      <div class="body">
+      <div style="height: 100%">
         <history-detail ref="windhistoryDetail"> </history-detail>
       </div>
     </el-dialog>
     <el-dialog
       v-model="contrastVisible"
       width="70%"
-      top="5vh"
+      top="120px"
       custom-class="contrastModal"
       :close-on-click-modal="false"
     >
@@ -295,7 +302,7 @@ export default {
       ],
       page: {
         currentPage: 1,
-        pagesize: 18,
+        pagesize: 22,
         total: 0,
       },
       historyTimer: "",
@@ -437,10 +444,10 @@ export default {
 
 <style lang="less">
 .comprehensiveEvaluation {
-  padding: 0 23px;
+  padding: 0 30px;
+  height: 100%;
 
   .Evaluation_title {
-    padding-left: 10px;
     .leftContent {
       width: 242px;
       height: 41px;
@@ -510,8 +517,8 @@ export default {
       display: flex;
       flex-direction: row;
       align-items: center;
-      margin-top: 10px;
-      margin-bottom: 10px;
+      padding-top: 10px;
+      padding-bottom: 10px;
 
       .station {
         display: flex;
@@ -590,10 +597,8 @@ export default {
     }
   }
   .economicTable1 {
-    padding: 5px;
-    padding-bottom: 10px;
+    height: calc(100% - 32px);
     .el-table--mini {
-      margin: 5px;
       .el-table__header-wrapper {
         .el-checkbox {
           display: none;
@@ -624,7 +629,7 @@ export default {
       .EvaluationhistoryModel {
         margin-top: 0 !important;
         .el-dialog__body {
-          padding-top: 10px;
+          height: calc(100% - 51px - 50px);
         }
       }
       .contrastModal {

src/views/economicsOperation/powerCurve/cutInAndOutAnalysis/historyDetail.vue

@@ -70,7 +70,7 @@
         :data="historycutInAndOutData"
         stripe
         size="mini"
-        height="78vh"
+        height="calc(100% - 40px - 20px)"
         ref="historycutInAndOutTable"
         style="width: 100%"
       >
@@ -263,13 +263,13 @@ export default {
 
 <style lang="less">
 .historycutInAndOut {
-  padding: 0 23px;
+  height: 100%;
   .historycutInAndOut_top {
     display: flex;
     flex-direction: row;
     align-items: center;
-    margin-top: 10px;
-    margin-bottom: 10px;
+    padding-bottom: 10px;
+    padding-top: 10px;
 
     .station {
       display: flex;

src/views/economicsOperation/powerCurve/cutInAndOutAnalysis/index.vue

@@ -62,7 +62,13 @@
         >
       </div>
     </div>
-    <div style="background: rgba(0, 0, 0, 0.4)">
+    <div
+      style="
+        background: rgba(0, 0, 0, 0.4);
+        height: calc(100% - 43px);
+        padding-bottom: 15px;
+      "
+    >
       <div class="cutInAndOut_title clearfix">
         <div class="leftContent floatLeft"><span>切入切出分析</span></div>
         <div class="rightContent floatRight"></div>
@@ -72,7 +78,7 @@
           :data="cutInAndOutAnalysisData"
           stripe
           size="mini"
-          height="75vh"
+          height="calc(100% - 40px - 20px)"
           ref="cutInAndOut_table"
           style="width: 100%"
         >
@@ -131,6 +137,7 @@
       v-model="dialogVisible"
       width="100%"
       custom-class="modal"
+      fullscreen
       :close-on-click-modal="false"
     >
       <template #title>
@@ -139,7 +146,7 @@
           <div class="title">历史数据查询</div>
         </div>
       </template>
-      <div class="body">
+      <div style="height: 100%">
         <history-detail
           ref="historyDetail"
           :historyCompanyOptions="companyOptions"
@@ -211,7 +218,7 @@ export default {
         { title: "年大风切出合格率", code: "yearOutputBigRatio" },
       ],
       page: {
-        pagesize: 17,
+        pagesize: 21,
         currentPage: 1,
         total: 0,
       },
@@ -312,11 +319,6 @@ export default {
       this.getTableData();
     },
     async getTableData() {
-      if (this.isFullScreen) {
-        this.page.pagesize = 18;
-      } else {
-        this.page.pagesize = 17;
-      }
       let params = {
         cmId: this.companyVal,
         type: this.tabIndex,
@@ -379,8 +381,8 @@ export default {
 
 <style lang="less">
 .cutInAndOutAnalysis {
-  padding: 0 23px;
-
+  padding: 0 30px;
+  height: 100%;
   .cutInAndOut_title {
     padding-left: 10px;
 
@@ -518,42 +520,16 @@ export default {
   }
 
   .economicTable1 {
-    margin: 0 5px 5px 5px;
-    padding-bottom: 10px;
+    height: calc(100% - 32px);
 
     .el-pagination {
       display: flex;
       justify-content: flex-end;
-      margin-right: 40px;
-      margin-top: 20px;
-
-      //   .btn-prev,
-      //   .btn-next,
-      //   .btn-quickprev,
-      //   .btn-quicknext,
-      //   .el-pager,
-      //   .number {
-      //     background: rgba(58, 63, 75, 0.4);
-      //     color: #fff;
-      //     border-radius: 2px;
-      //   }
-
-      //   .el-pager .active {
-      //     background: #05bb4c;
-      //     color: #fff;
-      //     border-radius: 2px;
-      //   }
-
+      padding-right: 40px;
+      padding-top: 20px;
       .el-pagination__total,
       .el-pagination__jump {
         color: #fff;
-
-        //     .el-input__inner {
-        //       background: rgba(58, 63, 75, 0.2);
-        //       border: 1px solid #3e4349;
-        //       color: #fff;
-        //       border-radius: 2px;
-        //     }
       }
     }
 
@@ -579,6 +555,9 @@ export default {
 
       .el-dialog {
         margin-top: 0 !important;
+        .el-dialog__body {
+          height: calc(100% - 51px - 32px);
+        }
       }
     }
   }

src/views/economicsOperation/powerCurve/index.vue

@@ -1,7 +1,5 @@
 <template>
-  <div>
    <router-view />
-  </div>
 </template>
 
 <script>

src/views/economicsOperation/powerCurve/powerLinefitting/index.vue

@@ -94,7 +94,13 @@
         </div>
       </div>
     </div>
-    <div style="background: rgba(0, 0, 0, 0.4)">
+    <div
+      style="
+        background: rgba(0, 0, 0, 0.4);
+        height: calc(100% - 400px - 39px);
+        padding-bottom: 10px;
+      "
+    >
       <div class="powerLinefitting_title clearfix">
         <div class="leftContent floatLeft"><span>功率曲线拟合</span></div>
         <div class="rightContent floatRight"></div>
@@ -105,7 +111,7 @@
           :data="powerLinefittingData"
           stripe
           size="mini"
-          height="48vh"
+          height="100%"
           ref="fitting_table"
           style="width: 100%"
         >
@@ -389,7 +395,6 @@ export default {
       window.addEventListener("resize", function () {
         myChart.resize();
       });
-
     },
     //转换时间
     getchangeTime(date) {
@@ -417,7 +422,8 @@ export default {
 
 <style lang="less">
 .powerLinefitting {
-  padding: 0 23px;
+  padding: 0 30px;
+  height: 100%;
   .powerLinefitting_topAll {
     display: flex;
     justify-content: space-between;
@@ -568,10 +574,8 @@ export default {
   }
 
   .powerLinefitting_Table {
-    margin: 0 5px 5px 5px;
-    padding-bottom: 10px;
+    height: calc(100% - 32px);
     .el-table--mini {
-      margin: 5px;
       .el-table__header-wrapper {
         tr {
           background: rgba(83, 89, 104, 0.3) !important;
@@ -610,11 +614,11 @@ export default {
     }
   }
   .powerLinefitting_Echarts {
-    margin-top: 10px;
     width: 100%;
     background: rgba(0, 0, 0, 0.45);
     position: relative;
-    height: 39px;
+    height: 400px;
+    padding-bottom: 15px;
     // border-bottom: 1px solid rgba(153, 153, 153, 0.5);
     font-size: 16px;
     font-family: Microsoft YaHei;
@@ -658,7 +662,7 @@ export default {
     }
     .fittingEchartSty {
       width: 100%;
-      height: 280px;
+      height: calc(100% - 39px);
       background: rgba(0, 0, 0, 0.45);
     }
   }

src/views/economicsOperation/thematicAnalysis/MTBF/index.vue

@@ -75,7 +75,7 @@
           style="width: 100%"
           size="mini"
           stripe
-          height="50vh"
+          height="100%"
           @row-click="rowClick"
         >
           <el-table-column
@@ -167,17 +167,17 @@
         </el-table>
       </div>
     </div>
-    <div class="echarts" style="height: 30vh">
+    <div class="echarts">
       <div class="chart-name">
         <div class="point point-left bottom"></div>
         <div class="point point-right bottom"></div>
         {{ selectValue }}
       </div>
-      <div>
+      <div style="height: calc(100% - 39px); margin-top: 10px">
         <BarCharts
           :list="barList"
           width="97%"
-          height="32vh"
+          height="100%"
           :top="60"
           :pillarName="pillarName"
           :xdate="false"
@@ -372,76 +372,15 @@ export default {
 </script>
 
 <style lang="less" scoped>
-.data-bodys {
-  display: flex;
-  flex-direction: column;
-  background-color: rgba(0, 0, 0, 0.45);
-  border-radius: 5px;
-  padding: 5px;
-}
-
 .parcel-box {
-  padding: 0 20px;
+  padding: 0 30px;
   box-sizing: border-box;
-
-  .economicTable {
-    .el-table__body-wrapper {
-      .columnFlex {
-        display: flex;
-        align-items: center;
-      }
-      .box-item {
-        flex: 1;
-        white-space: nowrap;
-        overflow: hidden;
-        text-overflow: ellipsis;
-      }
-    }
-    .topSvg {
-      width: 1em;
-      height: 1em;
-      color: #1c99ff;
-    }
-
-    .botSvg {
-      width: 1em;
-      height: 1em;
-      color: #ff8300;
-    }
-  }
-
-  .line {
-    padding-bottom: 5px;
-
-    .leftContent {
-      width: 242px;
-      height: 41px;
-      line-height: 41px;
-      background: url("../../../../assets/imgs/title_left_bg.png");
-      padding-left: 25px;
-      span {
-        font-size: 16px;
-        font-family: Microsoft YaHei;
-        font-weight: 400;
-        color: #ffffff;
-      }
-    }
-
-    .rightContent {
-      width: 212px;
-      height: 28px;
-      margin-top: 13px;
-      background: url("../../../../assets/imgs/title_right_bg.png");
-    }
-    .floatRight {
-      float: right;
-    }
-  }
-
+  height: 100%;
   .search {
     display: flex;
     flex-direction: row;
     padding-top: 10px;
+    padding-bottom: 10px;
     align-items: center;
     justify-content: space-between;
 
@@ -514,12 +453,73 @@ export default {
       }
     }
   }
+  .data-bodys {
+    height: calc(100% - 58px - 350px - 20px);
+    display: flex;
+    flex-direction: column;
+    background-color: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+  }
+  .economicTable {
+    height: calc(100% - 32px);
+    .el-table__body-wrapper {
+      .columnFlex {
+        display: flex;
+        align-items: center;
+      }
+      .box-item {
+        flex: 1;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+    }
+    .topSvg {
+      width: 1em;
+      height: 1em;
+      color: #1c99ff;
+    }
+
+    .botSvg {
+      width: 1em;
+      height: 1em;
+      color: #ff8300;
+    }
+  }
+
+  .line {
+    .leftContent {
+      width: 242px;
+      height: 41px;
+      line-height: 41px;
+      background: url("../../../../assets/imgs/title_left_bg.png");
+      padding-left: 25px;
+      span {
+        font-size: 16px;
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        color: #ffffff;
+      }
+    }
+
+    .rightContent {
+      width: 212px;
+      height: 28px;
+      margin-top: 13px;
+      background: url("../../../../assets/imgs/title_right_bg.png");
+    }
+    .floatRight {
+      float: right;
+    }
+  }
 
   .echarts {
-    margin-top: 20px;
+    padding-top: 20px;
+    padding-bottom: 15px;
     background-color: rgba(0, 0, 0, 0.45);
     border-radius: 5px;
     width: 100%;
+    height: 350px;
   }
 }
 

src/views/economicsOperation/thematicAnalysis/comprehensiveAnalysis/index.vue

@@ -29,7 +29,7 @@
         时间：
         <div class="">
           <el-date-picker
-          size="mini"
+            size="mini"
             v-model="pickerTimer"
             type="month"
             value-format="YYYY-MM"
@@ -67,6 +67,7 @@
               stripe
               ref="stand_table"
               style="width: 100%"
+              height="100%"
             >
               <el-table-column prop="type" align="center"> </el-table-column>
               <el-table-column
@@ -121,7 +122,7 @@
             <el-table
               :data="samePeriodOfTheMonth"
               size="mini"
-              height="28vh"
+              height="100%"
               stripe
               ref="stand_table"
               class="lvTable"
@@ -177,6 +178,7 @@
               stripe
               ref="stand_table"
               style="width: 100%"
+              height="calc(100% - 24px)"
             >
               <el-table-column prop="type" align="center"> </el-table-column>
               <el-table-column
@@ -231,7 +233,7 @@
             <el-table
               :data="samePeriodOfTheYear"
               size="mini"
-              height="28vh"
+              height="100%"
               stripe
               ref="stand_table"
               style="width: 100%"
@@ -739,7 +741,8 @@ export default {
 
 <style lang="less">
 .comAnalysis {
-  padding: 0 23px;
+  padding: 0 30px;
+  height: 100%;
 
   .comAnalysis_title {
     background: rgba(0, 0, 0, 0.45);
@@ -792,8 +795,8 @@ export default {
     display: flex;
     flex-direction: row;
     align-items: center;
-    margin-top: 10px;
-    margin-bottom: 10px;
+    padding-top: 10px;
+    padding-bottom: 10px;
 
     .station {
       display: flex;
@@ -878,18 +881,20 @@ export default {
   }
 
   .downPdf {
+    height: calc(100% - 58px - 32px);
+    padding-bottom: 10px;
     .comAnalysis_Table {
-      margin: 10px 0;
+      padding: 10px 0;
       display: flex;
-
+      height: calc(100% - 300px);
       .table_month,
       .table_year {
-        // width: calc(50% - 10px);
-        padding: 0 5px;
         width: 50%;
+        height: 100%;
         background: rgba(0, 0, 0, 0.45);
 
         .table_top {
+          height: 174px;
           .el-table--mini {
             .el-table__header-wrapper {
               tr {
@@ -958,7 +963,8 @@ export default {
         }
 
         .table_bot {
-          margin-top: 18px;
+          height: calc(100% - 174px - 20px);
+          margin-top: 20px;
           .el-table--mini .el-table__cell {
             padding: 3px 0;
           }
@@ -1008,19 +1014,19 @@ export default {
     }
 
     .comAnalysis_Echarts {
-      height: 270px;
+      height: 300px;
       display: flex;
 
       .echarts_month,
       .echarts_year {
         width: 50%;
         display: flex;
-
+        height: 100%;
         .echartsWid {
           width: calc(50% - 10px);
           background: rgba(0, 0, 0, 0.45);
           position: relative;
-          height: 39px;
+          height: 100%;
           // border-bottom: 1px solid rgba(153, 153, 153, 0.5);
           font-size: 16px;
           font-family: Microsoft YaHei;
@@ -1052,7 +1058,7 @@ export default {
 
           .echartsSty {
             width: 100%;
-            height: 270px;
+            height: calc(100% - 39px);
             background: rgba(96, 103, 105, 0.2);
           }
 

src/views/economicsOperation/thematicAnalysis/failure/index.vue

@@ -75,7 +75,7 @@
           style="width: 100%"
           size="mini"
           stripe
-          height="50vh"
+          height="100%"
           @row-click="rowClick"
         >
           <el-table-column
@@ -167,17 +167,17 @@
         </el-table>
       </div>
     </div>
-    <div class="echarts" style="height: 30vh">
+    <div class="echarts">
       <div class="chart-name">
         <div class="point point-left bottom"></div>
         <div class="point point-right bottom"></div>
         {{ selectValue }}
       </div>
-      <div>
+      <div style="height: calc(100% - 39px - 10px); margin-top: 10px">
         <BarCharts
           :list="barList"
           width="97%"
-          height="32vh"
+          height="100%"
           :top="60"
           :pillarName="pillarName"
           :xdate="false"
@@ -457,77 +457,15 @@ export default {
 </script>
 
 <style lang="less" scoped>
-.data-bodys {
-  display: flex;
-  flex-direction: column;
-  background-color: rgba(0, 0, 0, 0.45);
-  border-radius: 5px;
-  padding: 5px;
-}
-
 .parcel-box {
-  padding: 0 20px;
+  padding: 0 30px;
   box-sizing: border-box;
-
-  .economicTable {
-    .el-table__body-wrapper {
-      .columnFlex {
-        display: flex;
-        align-items: center;
-      }
-      .box-item {
-        flex: 1;
-        white-space: nowrap;
-        overflow: hidden;
-        text-overflow: ellipsis;
-      }
-    }
-    .topSvg {
-      width: 1em;
-      height: 1em;
-      color: #1c99ff;
-    }
-
-    .botSvg {
-      width: 1em;
-      height: 1em;
-      color: #ff8300;
-    }
-  }
-
-  .line {
-    padding-bottom: 5px;
-
-    .leftContent {
-      width: 242px;
-      height: 41px;
-      line-height: 41px;
-      background: url("../../../../assets/imgs/title_left_bg.png");
-
-      span {
-        font-size: 16px;
-        font-family: Microsoft YaHei;
-        font-weight: 400;
-        color: #ffffff;
-        margin-left: 25px;
-      }
-    }
-
-    .rightContent {
-      width: 212px;
-      height: 28px;
-      margin-top: 13px;
-      background: url("../../../../assets/imgs/title_right_bg.png");
-    }
-    .floatRight {
-      float: right;
-    }
-  }
-
+  height: 100%;
   .search {
     display: flex;
     flex-direction: row;
     padding-top: 10px;
+    padding-bottom: 10px;
     align-items: center;
     justify-content: space-between;
 
@@ -600,12 +538,73 @@ export default {
       }
     }
   }
+  .data-bodys {
+    height: calc(100% - 58px - 350px - 20px);
+    display: flex;
+    flex-direction: column;
+    background-color: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+  }
+  .economicTable {
+    height: calc(100% - 32px);
+    .el-table__body-wrapper {
+      .columnFlex {
+        display: flex;
+        align-items: center;
+      }
+      .box-item {
+        flex: 1;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+    }
+    .topSvg {
+      width: 1em;
+      height: 1em;
+      color: #1c99ff;
+    }
+
+    .botSvg {
+      width: 1em;
+      height: 1em;
+      color: #ff8300;
+    }
+  }
+
+  .line {
+    .leftContent {
+      width: 242px;
+      height: 41px;
+      line-height: 41px;
+      background: url("../../../../assets/imgs/title_left_bg.png");
+
+      span {
+        font-size: 16px;
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        color: #ffffff;
+        margin-left: 25px;
+      }
+    }
+
+    .rightContent {
+      width: 212px;
+      height: 28px;
+      margin-top: 13px;
+      background: url("../../../../assets/imgs/title_right_bg.png");
+    }
+    .floatRight {
+      float: right;
+    }
+  }
 
   .echarts {
     margin-top: 20px;
     background-color: rgba(0, 0, 0, 0.45);
     border-radius: 5px;
     width: 100%;
+    height: 350px;
   }
 }
 

src/views/economicsOperation/thematicAnalysis/generation/index.vue

@@ -75,7 +75,7 @@
           style="width: 100%"
           size="mini"
           stripe
-          height="50vh"
+          height="100%"
           @row-click="rowClick"
         >
           <el-table-column
@@ -167,17 +167,17 @@
         </el-table>
       </div>
     </div>
-    <div class="echarts" style="height: 30vh">
+    <div class="echarts">
       <div class="chart-name">
         <div class="point point-left bottom"></div>
         <div class="point point-right bottom"></div>
         {{ selectValue }}
       </div>
-      <div>
+      <div style="height: calc(100% - 39px - 10px); margin-top: 10px">
         <BarCharts
           :list="barList"
           width="97%"
-          height="32vh"
+          height="100%"
           :top="60"
           :pillarName="pillarName"
           :xdate="false"
@@ -372,19 +372,19 @@ export default {
 </script>
 
 <style lang="less" scoped>
-.data-bodys {
-  display: flex;
-  flex-direction: column;
-  background-color: rgba(0, 0, 0, 0.45);
-  border-radius: 5px;
-  padding: 5px;
-}
-
 .parcel-box {
-  padding: 0 20px;
+  padding: 0 30px;
   box-sizing: border-box;
-
+  height: 100%;
+  .data-bodys {
+    display: flex;
+    flex-direction: column;
+    background-color: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+    height: calc(100% - 58px - 350px - 20px);
+  }
   .economicTable {
+    height: calc(100% - 32px);
     .el-table__body-wrapper {
       .columnFlex {
         display: flex;
@@ -416,8 +416,7 @@ export default {
       width: 242px;
       height: 41px;
       line-height: 41px;
-      background: url("../../../../assets/imgs/title_left_bg.png");
-      padding-left: 25px;
+      background: url("~@/assets/imgs/title_left_bg.png");
       span {
         font-size: 16px;
         font-family: Microsoft YaHei;
@@ -442,6 +441,7 @@ export default {
     display: flex;
     flex-direction: row;
     padding-top: 10px;
+    padding-bottom: 10px;
     align-items: center;
     justify-content: space-between;
 
@@ -520,6 +520,7 @@ export default {
     background-color: rgba(0, 0, 0, 0.45);
     border-radius: 5px;
     width: 100%;
+    height: 350px;
   }
 }
 

src/views/economicsOperation/thematicAnalysis/index.vue

@@ -1,15 +1,11 @@
 <template>
-  <div>
-    <router-view />
-  </div>
+  <router-view />
 </template>
 
 <script>
 export default {
-  name:'thematicAnalysis',//专题分析
-}
+  name: "thematicAnalysis", //专题分析
+};
 </script>
 
-<style>
-
-</style>
+<style></style>

src/views/economicsOperation/thematicAnalysis/windEnergy/index.vue

@@ -41,7 +41,6 @@
           >搜索</el-button
         >
       </div>
-      <!-- <el-button round size="mini">导出</el-button> -->
     </div>
     <div class="data-bodys">
       <div class="line clearfix">
@@ -56,7 +55,7 @@
           style="width: 100%"
           size="mini"
           stripe
-          height="50vh"
+          height="calc(100% - 32px)"
           @row-click="rowClick"
         >
           <el-table-column
@@ -148,17 +147,23 @@
         </el-table>
       </div>
     </div>
-    <div class="echarts" style="height: 30vh">
+    <div class="echarts">
       <div class="chart-name">
         <div class="point point-left bottom"></div>
         <div class="point point-right bottom"></div>
         {{ tabIndex == -1 ? "风能利用率" : "光能利用率" }}
       </div>
-      <div style="margin-top: 10px">
+      <div
+        style="
+          padding-top: 10px;
+          height: calc(100% - 31px);
+          padding-bottom: 10px;
+        "
+      >
         <BarCharts
           :list="barList"
           width="97%"
-          height="32vh"
+          height="100%"
           :top="60"
           :pillarName="pillarName"
           :xdate="false"
@@ -171,10 +176,7 @@
 </template>
 
 <script>
-// import Panel from "@/components/curveAnalyse/panel.vue";
-// import ChartColumnar from '@/components/curveAnalyse/multiple-bar-chart.vue'
 import BarCharts from "../../homePage/components/barCharts.vue";
-// import { companys, fnlylList, gzsslList, whsslList, xdsslList, xnsslList, slsslList } from '@/api/curveAnalyse'
 import { companys, fnlylList } from "@/api/curveAnalyse";
 export default {
   name: "curveAnalyse",
@@ -321,77 +323,15 @@ export default {
 </script>
 
 <style lang="less" scoped>
-.data-bodys {
-  display: flex;
-  flex-direction: column;
-  background-color: rgba(0, 0, 0, 0.45);
-  border-radius: 5px;
-  padding: 5px;
-}
-
 .parcel-box {
-  padding: 0 20px;
+  padding: 0 30px;
   box-sizing: border-box;
-
-  .economicTable {
-    .el-table__body-wrapper {
-      .columnFlex {
-        display: flex;
-        align-items: center;
-      }
-      .box-item {
-        flex: 1;
-        white-space: nowrap;
-        overflow: hidden;
-        text-overflow: ellipsis;
-      }
-    }
-    .topSvg {
-      width: 1em;
-      height: 1em;
-      color: #1c99ff;
-    }
-
-    .botSvg {
-      width: 1em;
-      height: 1em;
-      color: #ff8300;
-    }
-  }
-
-  .line {
-    padding-bottom: 5px;
-
-    .leftContent {
-      width: 242px;
-      height: 41px;
-      line-height: 41px;
-      background: url("../../../../assets/imgs/title_left_bg.png");
-
-      span {
-        font-size: 16px;
-        font-family: Microsoft YaHei;
-        font-weight: 400;
-        color: #ffffff;
-        margin-left: 25px;
-      }
-    }
-
-    .rightContent {
-      width: 212px;
-      height: 28px;
-      margin-top: 13px;
-      background: url("../../../../assets/imgs/title_right_bg.png");
-    }
-    .floatRight {
-      float: right;
-    }
-  }
-
+  height: 100%;
   .search {
     display: flex;
     flex-direction: row;
     padding-top: 10px;
+    padding-bottom: 10px;
     align-items: center;
     justify-content: space-between;
 
@@ -465,11 +405,75 @@ export default {
     }
   }
 
+  .data-bodys {
+    display: flex;
+    flex-direction: column;
+    background-color: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+    height: calc(100% - 58px - 350px - 20px);
+  }
+  .economicTable {
+    height: 100%;
+    .el-table__body-wrapper {
+      .columnFlex {
+        display: flex;
+        align-items: center;
+      }
+      .box-item {
+        flex: 1;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+    }
+    .topSvg {
+      width: 1em;
+      height: 1em;
+      color: #1c99ff;
+    }
+
+    .botSvg {
+      width: 1em;
+      height: 1em;
+      color: #ff8300;
+    }
+  }
+
+  .line {
+    padding-bottom: 5px;
+
+    .leftContent {
+      width: 242px;
+      height: 41px;
+      line-height: 41px;
+      background: url("../../../../assets/imgs/title_left_bg.png");
+
+      span {
+        font-size: 16px;
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        color: #ffffff;
+        margin-left: 25px;
+      }
+    }
+
+    .rightContent {
+      width: 212px;
+      height: 28px;
+      margin-top: 13px;
+      background: url("../../../../assets/imgs/title_right_bg.png");
+    }
+    .floatRight {
+      float: right;
+    }
+  }
+
   .echarts {
     margin-top: 20px;
     background-color: rgba(0, 0, 0, 0.45);
     border-radius: 5px;
     width: 100%;
+    height: 350px;
   }
 }