import { echartOptionProfixHandle, PublicConfigClass } from '@/packages/public'
import { AddThreeDimensionalMapConfig } from './index'
import { chartInitConfig } from '@/settings/designSetting'
import { CreateComponentType } from '@/packages/index.d'
import cloneDeep from 'lodash/cloneDeep'
import dataMaps from './data.json'

//省市区枚举
export const enum areaEnum {
  PROVINCE = 'PROVINCE', //省份
  CITY = 'CITY', //城市
  COUNTY = 'COUNTY', //县
  COUNTRY = 'COUNTRY', //国家
  TOWN = 'TOWN', //镇
  DISTRICT = 'DISTRICT' //地区
}

export interface regionInfo {
  provinceValue:string
  cityValue: string|null
  countyValue: string|null
  levelStr:areaEnum
}

type itemOption = {
  label:string
  value:string
}
export interface regionOption{
  provinceOptions: itemOption[],
  cityOptions: itemOption[],
  countryOptions: itemOption[]
}

//父级地区编码和级别接口
export interface historyParentType {
  adcode: number
  level: string
}

export interface backMapLevel{
  (levelStr:string): boolean
  (level:string): boolean
  (): void
  (): void
}

//数据源接口
export interface dataPointI {
  name: string
  value: number[]
  adcode: number
  height: number
  itemStyle: {
    color: string
    opacity: number
    borderWidth: number
    borderColor: string
  }
}

export const includes = []

export const option = {
  iconColor: 'black',
  showIcon: false,
  iconDistanceRight: 20,
  iconDistanceTop: 20,
  drillingIn: false,
  dataset: dataMaps,
  saveClickRegion: {
    level: ''
  },
  mapRegion: {
    adcode: 'china',
    showHainanIsLands: true,
    saveSelect: {
      levelStr: areaEnum.COUNTRY,
      cityValue:null, 
      countyValue:null,
      provinceValue:'china'
    }
  },
  tooltip: {
    show: true
  },
  geo3D: {
    show: false, // 隐藏该层，为true时会导致出现两个地图
    map: 'centerMap',
    roam: true,
    regionHeight: 0,
    emphasis: {
      label: {
        show: true,
        formatter: function (params: Recordable) {
          return params.data.name ? params.data.name : ' '
        },
        textStyle: {
          color: '#000',
          fontSize: 14
        }
      },
      itemStyle: {
        color: '#ff0'
      }
    }
  },
  series: [
    {
      type: 'map3D',
      map: 'centerMap',
      name: 'centerMap',
      regionHeight: 3,
      label: {
        show: true,
        formatter: function (params: Recordable) {
          return params.data.name ? params.data.name : ' '
        },
        textStyle: {
          color: '#fff',
          fontSize: 14
        }
      },
      itemStyle: {
        color: 'green',
        borderWidth: 0.8,
        borderColor: 'blue'
      },
      data: []
    },
    {
      name: 'scatter3D',
      type: 'scatter3D',
      coordinateSystem: 'geo3D',
      symbol: 'circle',
      symbolSize: 20,
      animation: true,
      data: dataMaps
    }
  ]
}

export type optionType = typeof option

export const MapDefaultConfig = { ...option }
export default class Config extends PublicConfigClass implements CreateComponentType {
  public key: string = AddThreeDimensionalMapConfig.key
  public attr = { ...chartInitConfig, w: 750, h: 800, zIndex: -1 }
  public chartConfig = cloneDeep(AddThreeDimensionalMapConfig)
  public option = echartOptionProfixHandle(option, includes)
}