修改bug及能源分析样式

src/views/energy/analysis/trendAnalysis/index.vue

@@ -1,15 +1,17 @@
 <template>
-  <div class="app-container" id="trendAnalysisBox">
+  <div class="app-container trendAnalysisBox" id="trendAnalysisBox">
     <!-- 搜索工作栏 -->
     <search-area :isFold="isFold" @submit="getList"/>
-    <el-tabs v-model="activeName" @tab-click="switchChart">
+    <el-tabs v-model="activeName" @tab-click="switchChart" v-show='chartData.length'>
       <el-tab-pane label="柱状图" name="bar">
-        <bar-chart ref="analysisBarChart" :chartData="chartData" />
+        <bar-chart ref="analysisBarChart" :chartData="chartData" :timeDim="timeDim"/>
       </el-tab-pane>
       <el-tab-pane label="折线图" name="line">
-        <line-chart ref="analysisLineChart" :chartData="chartData"/>
+        <line-chart ref="analysisLineChart" :chartData="chartData" :timeDim="timeDim"/>
       </el-tab-pane>
     </el-tabs>
+    <!-- 没有数据 -->
+    <div class="no-data-bg" v-show='!chartData.length'></div>
   </div>
 </template>
 <script>
@@ -25,7 +27,8 @@ export default {
     return {
       isFold: false,
       activeName: 'bar',
-      chartData: []
+      chartData: [],
+      timeDim: ''
     }
   },
   mounted() {
@@ -37,6 +40,7 @@ export default {
   },
   methods: {
     getList(params) {
+      this.timeDim = params.timeDim
       getEnergyTrend({ ...params }).then((res) => {
         if (res.code === 0) {
           this.chartData = res.data
@@ -58,4 +62,33 @@ export default {
     }
   }
 }
-</script>
+</script>
+<style lang='scss'>
+.trendAnalysisBox {
+  .el-tabs__nav::after {
+    content: "";
+    position: absolute;
+    left: 0;
+    bottom: 0;
+    width: 100%;
+    height: 2px;
+    background-color: #e4e7ed;
+    /* z-index: 1; */
+  }
+  .el-tabs__nav-wrap::after {
+    width: 0;
+  }
+  .el-tabs__item {
+    padding: 0 10px;
+  }
+  .el-tabs__item:hover {
+    color: rgba(0, 0, 0, 0.85);
+  }
+  .el-tabs__item.is-active {
+    color: rgba(0, 0, 0, 0.85);
+  }
+  .el-tabs__item {
+    color: rgba(0, 0, 0, 0.45);
+  }
+}
+</style>