<template>
  <div>
    <el-row style="margin-bottom: 16px">
      <el-date-picker
        v-model="queryParams.createDate"
        value-format="yyyy-MM-dd"
        type="date"
        :clearable="false"
        @change="getBillList"
      />
    </el-row>
    <daily-bill-report :bill-data="billData" width="100%" height="250px"/>
  </div>
</template>

<script>
import { getLastDateStr } from '@/utils'
import { hourBillCount } from '@/api/system/dashboard'
import DailyBillReport from '@/views/dashboard/DailyBillReport.vue'

export default {
  name: 'DailyHourBillChart',
  components: { DailyBillReport },
  data() {
    return {
      // 查询条件
      queryParams: {
        createDate: getLastDateStr(0)
      },
      billData: []
    }
  },
  created() {
    this.getBillList();
  },
  methods: {
    // 获取分时记录统计
    getBillList() {
      this.loading = true;
      hourBillCount(this.queryParams).then(res => {
        this.billData = res.data;
      }).finally(() => {
        this.loading = false;
      })
    },
  }
}
</script>

<style scoped lang="scss">

</style>
