<template>
  <div :id="id" :style="{ width: width, height: height }"></div>
</template>

<script>
import { chartOptionMixins } from "@/views/analyse/custom/mixins";
import { mapGetters } from "vuex";
import { getTreeDataList } from "@/utils";

export default {
  mixins: [chartOptionMixins],
  name: "CTree",
  data() {
    return {
      id: 'tree'
    }
  },
  computed: {
    ...mapGetters(['patentField'])
  },
  mounted() {
  },
  methods: {
    getOption() {
      let tree = []
      let data = JSON.parse(JSON.stringify(this.form.source.x))
      const field = this.patentField.find(item => item.id === this.form.schema.x.field)
      let treeData = getTreeDataList(data, [])
      treeData.map(item => {
        item.name = `${item.name} (${this.getDataCount(item.id)})`
      })
      tree = [{
        name: field.name,
        id: field.id,
        children: data
      }]
      return {
        series: {
          type: 'tree',
          data: tree,
          label: this.getDataLabel()
        }
      }
    },
  }
}
</script>
