能源分析

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

@@ -0,0 +1,64 @@
+<template>
+  <div class="app-container">
+    <!-- 搜索工作栏 -->
+    <search-area @submit="getList"/>
+    <el-tabs v-model="activeName" @tab-click="switchChart">
+      <el-tab-pane label="柱状图" name="bar">
+        <bar-chart ref="contrastBarChart" :chartData="chartData" />
+      </el-tab-pane>
+      <el-tab-pane label="折线图" name="line">
+        <line-chart ref="contrastLineChart" :chartData="chartData"/>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+<script>
+import { getEnergyTrend } from "@/api/analysis/energyAnalysis"
+import SearchArea from "./components/searchArea"
+import BarChart from "./components/barChart"
+import LineChart from "./components/lineChart"
+// import moment from 'moment'
+export default {
+  name: 'ContrastAnalysis',
+  components: { SearchArea, BarChart, LineChart },
+  data() {
+    return {
+      activeName: 'bar',
+      chartData: []
+    }
+  },
+  mounted() {},
+  methods: {
+    getList(params) {
+      getEnergyTrend({ ...params }).then((res) => {
+        if (res.code === 0) {
+          this.chartData = res.data
+        } else {
+          this.chartData = []
+        }
+      })
+      // getEnergyTrend({
+      //   energyTypeId: "1681183397517406210",
+      //   objId: "1679031282510532610",
+      //   timeDim: "2",
+      //   startTime: "1690732800000",
+      //   endTime: "1690992000000"
+      // }).then((res) => {
+      //   console.log(res)
+      //   this.chartData = res.data
+      // })
+    },
+    switchChart() {
+      if (this.activeName === 'bar') {
+        this.$nextTick((res) => {
+          this.$refs.analysisBarChart.getChart()
+        })
+      } else {
+        this.$nextTick((res) => {
+          this.$refs.analysisLineChart.getChart()
+        })
+      }
+    }
+  }
+}
+</script>