/* 基本柱状图 */
import Echart from '../echart'
import util from '../../libs/util'
import getOption from '../../libs/get_option'

const defaultData = {
  name: '',
  field: '',
  showNode: true,
  lineStyle: 'solid',
  lineColor: undefined,
  lineWidth: 2,
  fillColor: undefined,
  fillOpacity: 1,
  showLabel: false,
  labelColor: undefined, // 标注的颜色
  labelSize: 14, // 标注的文字大小
  labelPosition: 'top'
}

class Radar extends Echart {
  constructor(layer, screen) {
    super(layer, screen)
    this.data = {
      indicatorData: [],
      seriesData: []
    }
  }

  setPaint() {
    let paint = this._initPaint()
    let option = this._getOption(paint)
    this._render(option)
  }

  _getOption(paint) {
    let option = getOption(paint, this.type)
    option.color = [] // 用于配置图例的颜色
    option.series[0].data = this.data.seriesData
    this.data.seriesData.forEach(d => {
      if (d.lineStyle) {
        option.color.push(d.lineStyle.color)
      }
      // 更新图例
      if (option.legend.data.indexOf(d.name) === -1) {
        option.legend.data.push(d.name)
      }
    })
    let data = this.data.indicatorData
    let indicatorData = []
    data.forEach(d => {
      indicatorData.push({
        name: d,
        max: paint.radar.max
      })
    })
    option.radar.indicator = indicatorData
    return option
  }

  reduceData(paint) {
    if (!this.originalData || !this.originalData.length) {
      this.data = {
        indicatorData: [],
        seriesData: []
      }
      return
    }
    if (paint.radar && paint.radar.field) {
      let xField = paint.radar.field
      this.data.indicatorData = util.pickColData(xField, this.originalData)
    }

    let datas = paint.data
    let seriesData = []
    datas.forEach(d => {
      let mergedData = util.mergeObjs(util.deepCopy(defaultData), d)
      if (mergedData.field) {
        seriesData.push({
          name: mergedData.name,
          value: util.pickColData(mergedData.field, this.originalData),
          symbol: 'circle',
          symbolSize: mergedData.showNode ? 5 : 1,
          itemStyle: {
            color: mergedData.lineColor
          },
          lineStyle: {
            color: mergedData.lineColor,
            width: mergedData.lineWidth,
            type: mergedData.lineStyle
          },
          areaStyle: {
            color: mergedData.fillColor,
            opacity: mergedData.fillOpacity
          },
          label: {
            show: mergedData.showLabel,
            color: mergedData.labelColor,
            fontSize: mergedData.labelSize,
            position: mergedData.labelPosition
          }
        })
      }
    })
    this.data.seriesData = seriesData
  }
}

export default Radar
