iot-front-ui/src/components/dashboard/more/pvPowerChart.vue

<script>
import Card from "@/components/common/card.vue";
import PvPowerSummaryChart from "@/components/dashboard/more/pv/pvPowerSummaryChart.vue";
import PvPowerProfitChart from "@/components/dashboard/more/pv/pvPowerProfitChart.vue";

export default {
  data() {
    let timeRange = this.$util.dateUtil.getNearlyMonthRange();
    return {
      queryData: {
        timeRange: timeRange
      },
    };
  },
  components: {
    Card,
    PvPowerSummaryChart,
    PvPowerProfitChart,
  },
};
</script>

<template>
  <div class="dashboard-pvPower">
    <Card title="光伏发电量: kWh">
      <div style="height: 200px">
        <PvPowerSummaryChart
          :height="220"
          :queryData="queryData"
        ></PvPowerSummaryChart>
      </div>
      <div style="width: 90%; margin: 0 auto">
        <a-divider style="margin: 10px 0 0; padding: 0"></a-divider>
      </div>
    </Card>

    <Card title="光伏盈利: 元">
      <div style="width: 90%; margin: 0 auto; padding: 15px">
        <PvPowerProfitChart
          :height="200"
          :queryData="queryData"
        ></PvPowerProfitChart>
      </div>
    </Card>
  </div>
</template>

<style lang="less" scoped></style>