<template>
  <div class="bdlite-chart-item">
    <component
      :id="id"
      :chartData="chartData"
      :is="chartData.chartType"
    ></component>
  </div>
</template>
<script>
// 图表组件库
import { defineComponent, onMounted } from "@vue/composition-api";

// import TextContent from "./TextContent.vue";
// import ImageContent from "./ImageContent.vue";
// import ProgressContent from "./ProgressContent.vue";
// import WebContent from "./Web.vue";
// import SelectFilterContent from "./FilterContent/SelectFilter.vue";
// import DateFilterContent from "./FilterContent/DateFilter.vue";
// import NumberFilterContent from "./FilterContent/NumberFilter.vue";
// import MetricCard from "./metricCard/index.vue";
// import Crosstab from "./table/CrossTable.vue";
import Table from "./table/Table.vue";

export default defineComponent({
  name: "CustomComp",
  components: {
    [Table.name]: Table,
    // [TextContent.name]: TextContent,
    // [ImageContent.name]: ImageContent,
    // [ProgressContent.name]: ProgressContent,
    // [WebContent.name]: WebContent,
    // [SelectFilterContent.name]: SelectFilterContent,
    // [DateFilterContent.name]: DateFilterContent,
    // [NumberFilterContent.name]: NumberFilterContent,
    // [Crosstab.name]: Crosstab,
    // [MetricCard.name]: MetricCard,
  },
  props: {
    chartData: {
      type: Object,
      default: () => {},
    },
    id: {
      type: String | Number,
    },
  },
  emits: ["loaded"],
  setup() {
    // const isSended = ref(false);
    // const handleLoaded = () => {
    //   if (!isSended.value) {
    //     isSended.value = true;
    //     vm.emit("loaded", props.id);
    //   }
    // };
    onMounted(() => {
      // dataResult不存在，当dom加载完成直接通知上层
      // dataResult 存在，则由下级通知上层
      // if (!props.chartData.dataResult) {
      //   handleLoaded();
      // }
    });
    return {
      // handleLoaded,
    };
  },
});
</script>
