<template>
<div class="report">
  <Query
    class="report__query"
    @getData="getData"
  />
  <Charts :chartsData="chartsData" :groupType="query.groupType" />
</div>
</template>

<script>
import Query from './components/Query'
import Charts from './components/Charts'

export default {
  name: 'StockOutTrend',
  components: { Query, Charts },

  data () {
    return {
      chartsData: [], // 图表数据
      query: {},
    }
  },
  methods: {
    // 获取图表数据
    getData (query = {}) {
      this.query = { ...query }
      const url = this.$API.summaryReport.stockOutTrend
      const param = { queryCondition: JSON.stringify(query) }
      this.$https.post(url, param)
        .then(data => {
          this.chartsData = data.data
        })
    },
  },
}
</script>

<style lang="scss" scoped>
.report__query {
  margin-bottom: 20px;
}
</style>
