<template>
  <div style="width: 100%;height: 100%;">
    <v-chart
      v-show="option.series[0].data.length"
      style="width:100%;height:100%"
      :auto-resize="true"
      :options="option"/>
    <div
      style="text-align: center"
      v-show="!option.series[0].data.length">今日暂无数据</div>
  </div>
</template>
<script>
import { getSaleStatistics } from '@/api/queryReport'
import moment from 'moment'
let option = {
  color: ['#FFCB60', '#4FCBD1', '#FF6460', '#7FB800', '#F6511D', '#3F1E1E', '#65BAE3', '#707B5B', '#72AB5E', '#866CAD', '#FADF54', '#E7B2C2'],
  tooltip: {
    trigger: 'axis',
    axisPointer: { // 坐标轴指示器，坐标轴触发有效
      type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
    }
  },
  grid: {
    top: 30,
    left: 0,
    right: 15,
    bottom: 0,
    containLabel: true
  },
  xAxis: [
    {
      type: 'category',
      data: [],
      axisLine: {
        show: false
      },
      axisTick: {
        show: false
      },
      splitLine: {
        show: false
      }
    }
  ],
  yAxis: [
    {
      type: 'value',
      name: '张数',
      minInterval: 1,
      axisLine: {
        show: false
      },
      axisTick: {
        show: false
      },
      splitLine: {
        show: false
      }
    }
  ],
  series: [
    {
      type: 'bar',
      barMaxWidth: 40,
      data: []
    }
  ]
}
export default {
  data () {
    return {
      option
    }
  },
  mounted () {
    this.getSaleStatistics()
  },
  methods: {
    getSaleStatistics () {
      getSaleStatistics({
        startDate: new Date(moment().format('YYYY-MM-DD') + ' 00:00:00'),
        endDate: new Date(moment().format('YYYY-MM-DD') + ' 23:59:59')
      }).then((res) => {
        let tmpData1 = [] // ota数组
        let tmpData2 = [] // 数据数组
        res.data.forEach(element => {
          if (element.ticketTypeName !== '小计' && element.ticketTypeName !== '总计') {
            tmpData1.push(element.otaSourceName)
            tmpData2.push(element.saleNum)
          }
        })
        this.option.xAxis[0].data = tmpData1
        this.option.series[0].data = tmpData2
      })
    }
  }
}
</script>
