<template>
  <div style="width: 100%; height: 100%">
    <BarChart v-if="chartType('bar')" type="bar" v-bind="$attrs" v-on="$listeners" />
    <LineChart v-if="chartType('line')" type="line" v-bind="$attrs" v-on="$listeners" />
    <PieChart v-if="chartType('pie')" type="pie" v-bind="$attrs" v-on="$listeners" />
  </div>
</template>

<script>
import BarChart from './BarChart'
import LineChart from './LineChart'
import PieChart from './PieChart'

export default {
  name: 'ECharts',
  components: { BarChart, PieChart, LineChart },
  // 透传属性
  inheritAttrs: false,
  /**
   * Props 接受父组件的传值
   * @prop {String} type - 图表类型
   * @author Matrix
   * @date: 2022-04-20
   */
  props: {
    type: {
      type: String,
      required: true
    }
  },
  computed: {
    /**
     * 判断图表类型
     * @return {function(*): boolean}
     * @author Matrix
     * @date: 2022-04-20
     */
    chartType() {
      return type => type === this.type
    }
  }
}
</script>
