添加尖峰平谷功能

阿伏兔

2024-08-28 c2e2ce9e6e64d6d88de294afbaa09c3d6c2a2df5

 energy_management_ui/src/views/index_bak.vue

@@ -1,9 +1,8 @@
<template>
  <div class="dashboard-editor-container">

    <panel-group @handleSetLineChartData="handleSetLineChartData" />

    <el-row style="background:#fff;padding:16px 16px 0;margin-bottom:32px;">
    <el-row style="padding:16px 16px 0;margin-bottom:32px;">
      <line-chart :chart-data="lineChartData" />
    </el-row>

@@ -31,15 +30,14 @@
      <!--<div class="live_number">35</div>-->
    <!--</div>-->
  </div>

</template>

<script>
import PanelGroup from './dashboard/PanelGroup'
import LineChart from './dashboard/LineChart'
import RaddarChart from './dashboard/RaddarChart'
import PieChart from './dashboard/PieChart'
import BarChart from './dashboard/BarChart'
import PanelGroup from "./dashboard/PanelGroup";
import LineChart from "./dashboard/LineChart";
import RaddarChart from "./dashboard/RaddarChart";
import PieChart from "./dashboard/PieChart";
import BarChart from "./dashboard/BarChart";

const lineChartData = {
  newVisitis: {
@@ -58,10 +56,10 @@
    expectedData: [130, 140, 141, 142, 145, 150, 160],
    actualData: [120, 82, 91, 154, 162, 140, 130]
  }
}
};

export default {
  name: 'Index',
  name: "Index",
  components: {
    PanelGroup,
    LineChart,
@@ -72,24 +70,22 @@
  data() {
    return {
      lineChartData: lineChartData.newVisitis
    }
    };
  },
  methods: {
    handleSetLineChartData(type) {
      this.lineChartData = lineChartData[type]
      this.lineChartData = lineChartData[type];
    }
  }
}
};
</script>

<style lang="scss" scoped>
.dashboard-editor-container {
  padding: 32px;
  background-color: rgb(240, 242, 245);
  position: relative;

  .chart-wrapper {
    background: #fff;
    padding: 16px 16px 0;
    margin-bottom: 32px;
  }
@@ -126,25 +122,25 @@
  }
@keyframes fade {
  from {
    opacity: 1.0;
    opacity: 1;
  }
  50% {
    opacity: 0.4;
  }
  to {
    opacity: 1.0;
    opacity: 1;
  }
}

@-webkit-keyframes fade {
  from {
    opacity: 1.0;
    opacity: 1;
  }
  50% {
    opacity: 0.4;
  }
  to {
    opacity: 1.0;
    opacity: 1;
  }
}
</style>