/**
 * @author  daya
 * @createDate  2021/8/27 18:18
 * 备注:bar图表设置
 **/
// 按需引入,charts很多东西的
// eslint-disable-next-line no-unused-vars,no-redeclare
import { defaultColor, defaultFontSize, formatToMillion, linearGradientStyle, labelStyle, tooltipStyle, horizontalDataZoom, verticalDataZoom } from '../../charts'
/**
 * 提示语(tooltip)
 * 图例(legend)
 * 颜色(color)
 * x轴 (xAxis)
 * y轴 (xAxis)
 * 主体样式 (series)
 * **/
// 引入图标各组件的预设情况
import chart from '../../chart-perset'
let grid = chart.barGrid
let tooltip = chart.tooltip
let legend = chart.legend
let color = chart.barColor
let xAxis = chart.barXAxis
let yAxis = chart.barYAxis
let series = chart.barSeries
// bar
/**
 * bar公共部分开始
 * **/
export const fontStyle = {
  color: defaultColor,
  fontSize: defaultFontSize
}
/** bar公共部分结束 **/

/**
 * *图表预设样式
 * opt
 **/
// 纵向柱状图1
const optionStyle1 = {
  grid: {
    ...grid.gridStyle1
  },
  tooltip: {
    trigger: 'axis'
  },
  xAxis: [
    xAxis.xAxisStyle3
  ],
  yAxis: [
    yAxis.yAxisStyle2
  ],
  dataZoom: [...horizontalDataZoom],
  color: color.colorStyle3,
  series: [
    series.seriesStyle4
  ]
}
// 纵向柱状图2
const optionStyle2 = {
  grid: {
    ...grid.gridStyle2
  },
  tooltip: {
    trigger: 'axis'
  },
  xAxis: [
    xAxis.xAxisStyle3
  ],
  yAxis: [
    yAxis.yAxisStyle3
  ],
  dataZoom: [...horizontalDataZoom],
  color: color.colorStyle1,
  series: [
    series.seriesStyle3
  ]
}
// 纵向柱状图3
const optionStyle3 = {
  aria: {
    decal: {
      show: true,
      decals: [
        {
          color: '#002363',
          symbol: 'rect',
          dashArrayX: [2, 0],
          dashArrayY: [2, 2],
          symbolSize: 1,
          rotaion: 0
        }
      ]
    }
  },
  grid: {
    ...grid.gridStyle3
  },
  tooltip: {
    // trigger: 'axis'
  },
  color: color.colorStyle4,
  xAxis: [
    xAxis.xAxisStyle4
  ],
  yAxis: [
    yAxis.yAxisStyle4
  ],
  series: [
    series.seriesStyle5
  ],
  dataZoom: [...horizontalDataZoom]
}
// 纵向柱状图4
const optionStyle4 = {
  grid: {
    ...grid.gridStyle4
  },
  tooltip: {
    trigger: 'axis'
  },
  xAxis: [
    xAxis.xAxisStyle5
  ],
  yAxis: [
    yAxis.yAxisStyle5
  ],
  color: color.colorStyle5,
  dataZoom: [...horizontalDataZoom],
  series: [
    series.seriesStyle6
  ]
}
// 纵向柱状图5
const optionStyle5 = {
  grid: {
    ...grid.gridStyle2
  },
  tooltip: {
    trigger: 'axis'
  },
  xAxis: [
    xAxis.xAxisStyle6
  ],
  yAxis: [
    yAxis.yAxisStyle6
  ],
  dataZoom: [...horizontalDataZoom],
  color: color.colorStyle6,
  series: [
    series.seriesStyle7
  ]
}
// 横向柱状图6
const optionStyle6 = {
  grid: {
    ...grid.gridStyle5
  },
  tooltip: {
    trigger: 'axis'
  },
  legend: {
    ...legend.legendStyle1
  },
  xAxis: [
    xAxis.xAxisStyle7
  ],
  yAxis: [
    yAxis.yAxisStyle7
  ],
  color: color.colorStyle2,
  dataZoom: [...verticalDataZoom],
  series: [
    series.seriesStyle8
  ]
}
// 纵向柱状图7
const optionStyle7 = {
  grid: {
    ...grid.gridStyle5
  },
  xAxis: [
    xAxis.xAxisStyle8
  ],
  yAxis: [
    yAxis.yAxisStyle8
  ],
  dataZoom: [
    {
      type: 'inside'
    }
  ],
  series: [
    series.seriesStyle9
  ]
}
// series混合
const optionStyle8 = {
  tooltip: {
    trigger: 'axis',
    axisPointer: {
      type: 'shadow'
    }
  },
  legend: {},
  grid: {
    ...grid.gridStyle7
  },
  xAxis: [
    xAxis.xAxisStyle9
  ],
  yAxis: [
    yAxis.yAxisStyle
  ],
  dataZoom: [...horizontalDataZoom],
  series: series.seriesStyle10
}
const optionStyle9 = {
  tooltip: {
    trigger: 'axis',
    axisPointer: {
      type: 'shadow'
    }
  },
  legend: {
    ...legend.legendStyle10
  },
  grid: {
    ...grid.gridStyle11
  },
  color: color.colorStyle17,
  xAxis: [
    xAxis.xAxisStyle10
  ],
  yAxis: [
    yAxis.yAxisStyle10
  ],
  dataZoom: [...verticalDataZoom],
  series: [
    series.seriesStyle11
  ]
}
const optionStyle10 = {
  tooltip: {
    trigger: 'axis',
    axisPointer: {
      type: 'shadow'
    }
  },
  grid: {
    ...grid.gridStyle11
  },
  color: color.colorStyle17,
  xAxis: [
    xAxis.xAxisStyle12
  ],
  yAxis: [
    yAxis.yAxisStyle12
  ],
  dataZoom: [...verticalDataZoom],
  series: [
    series.seriesStyle13
  ]
}
const optionStyle31 = {
  title: {
    text: '单位：万个',
    right: 0,
    show: true,
    textStyle: {
      fontSize: 16,
      color: '#fff',
      fontWeight: 500
    }
  },
  grid: {
    ...grid.gridStyle31
  },
  tooltip: {
    trigger: 'axis'
  },
  legend: legend.legendStyle31,
  xAxis: [
    xAxis.xAxisStyle31
  ],
  yAxis: [
    yAxis.yAxisStyle31
  ],
  dataZoom: [...horizontalDataZoom],
  series: [
    series.seriesStyle31
  ]
}
const optionStyle32 = {
  title: {
    text: '单位：次',
    left: 0,
    show: true,
    textStyle: {
      fontSize: 16,
      color: '#fff',
      fontWeight: 500
    }
  },
  grid: {
    ...grid.gridStyle32
  },
  tooltip: {
    trigger: 'axis'
  },
  legend: legend.legendStyle31,
  xAxis: [
    xAxis.xAxisStyle31
  ],
  yAxis: [
    yAxis.yAxisStyle31
  ],
  dataZoom: [...horizontalDataZoom],
  series: [
    series.seriesStyle31
  ]
}
const optionStyle33 = {
  title: {
    text: '单位：件',
    right: 0,
    show: true,
    textStyle: {
      fontSize: 18,
      color: '#fff',
      fontWeight: 500
    }
  },
  grid: {
    ...grid.gridStyle32
  },
  tooltip: {
    trigger: 'axis'
  },
  legend: legend.legendStyle31,
  xAxis: [
    xAxis.xAxisStyle31
  ],
  yAxis: [
    yAxis.yAxisStyle31
  ],
  dataZoom: [...horizontalDataZoom],
  series: [
    series.seriesStyle31
  ]
}
const optionStyle34 = {
  title: {
    text: '(%)',
    left: 20,
    top: 25,
    show: true,
    textStyle: {
      fontSize: 14,
      color: '#fff',
      fontWeight: 400
    }
  },
  backgroundColor: '#041036',
  grid: {
    ...grid.gridStyle34
  },
  tooltip: {
    trigger: 'axis'
  },
  legend: legend.legendStyle35,
  xAxis: [
    xAxis.xAxisStyle32
  ],
  yAxis: [
    yAxis.yAxisStyle32
  ],
  color: color.colorStyle31,

  dataZoom: [...horizontalDataZoom],
  series: [
    series.seriesStyle32
  ]
}
const optionStyle35 = {
  // title: {
  //   text: '(%)',
  //   left: 20,
  //   top: 25,
  //   show: true,
  //   textStyle: {
  //     fontSize: 14,
  //     color: '#fff',
  //     fontWeight: 400
  //   }
  // },
  backgroundColor: '#041036',
  grid: {
    ...grid.gridStyle35
  },
  tooltip: {
    trigger: 'axis'
  },
  legend: legend.legendStyle36,
  xAxis: [
    xAxis.xAxisStyle33
  ],
  yAxis: [
    yAxis.yAxisStyle33
  ],
  color: color.colorStyle33,

  dataZoom: [...horizontalDataZoom],
  series: [
    series.seriesStyle33
  ]
}
const optionStyle36 = {

  backgroundColor: '#041036',
  grid: {
    ...grid.gridStyle36
  },
  tooltip: {
    trigger: 'axis'
  },
  xAxis: [
    xAxis.xAxisStyle34
  ],
  yAxis: [
    yAxis.yAxisStyle34
  ],
  color: color.colorStyle34,

  dataZoom: [...horizontalDataZoom],
  series: [
    series.seriesStyle32
  ]
}
const optionStyle37 = {

  backgroundColor: '#041036',
  grid: {
    ...grid.gridStyle37
  },
  tooltip: {
    trigger: 'axis'
  },
  legend: legend.legendStyle37,

  xAxis: [
    xAxis.xAxisStyle35
  ],
  yAxis: [
    yAxis.yAxisStyle35
  ],
  color: color.colorStyle35,

  dataZoom: [...horizontalDataZoom],
  series: [
    series.seriesStyle33
  ]
}
const optionStyle38 = {

  backgroundColor: '#041036',
  grid: {
    ...grid.gridStyle38
  },
  tooltip: {
    trigger: 'axis'
  },

  xAxis: [
    xAxis.xAxisStyle35
  ],
  yAxis: [
    yAxis.yAxisStyle35
  ],
  color: color.colorStyle34,

  dataZoom: [...horizontalDataZoom],
  series: [
    series.seriesStyle33
  ]
}
const optionStyle39 = {
  title: {
    text: '(%)',
    left: 20,
    top: 25,
    show: true,
    textStyle: {
      fontSize: 14,
      color: '#fff',
      fontWeight: 400
    }
  },
  backgroundColor: '#041036',
  grid: {
    ...grid.gridStyle34
  },
  tooltip: {
    trigger: 'axis'
  },
  legend: legend.legendStyle35,
  xAxis: [
    xAxis.xAxisStyle36
  ],
  yAxis: [
    yAxis.yAxisStyle32
  ],
  color: color.colorStyle31,

  dataZoom: [...horizontalDataZoom],
  series: [
    series.seriesStyle32
  ]
}
const optionStyle40 = {

  grid: {
    ...grid.gridStyle40
  },
  tooltip: {
    trigger: 'axis'
  },
  legend: legend.legendStyle39,
  xAxis: [
    xAxis.xAxisStyle38
  ],
  yAxis: [
    yAxis.yAxisStyle37
  ],
  color: color.colorStyle36,

  dataZoom: [...horizontalDataZoom],
  series: [
    series.seriesStyle34
  ]
}
const optionStyle131 = {

  grid: {
    ...grid.gridStyle131
  },
  tooltip: {
    trigger: 'axis'
  },
  legend: legend.legendStyle39,
  xAxis: [
    xAxis.xAxisStyle39
  ],
  yAxis: [
    yAxis.yAxisStyle39
  ],
  color: color.colorStyle36,

  dataZoom: [...horizontalDataZoom],
  series: [
    series.seriesStyle34
  ]
}
const optionStyle41 = {
  title: {
    text: '单位：亿元',
    right: 0,
    show: true,
    textStyle: {
      fontSize: 14,
      color: '#fff'
    }
  },
  grid: {
    ...grid.gridStyle41
  },
  tooltip: {
    trigger: 'axis'
  },
  legend: legend.legendStyle41,
  xAxis: [
    xAxis.xAxisStyle41
  ],
  yAxis: [
    yAxis.yAxisStyle41
  ],
  dataZoom: [...horizontalDataZoom],
  series: [
    series.seriesStyle41
  ]
}
const optionStyle42 = {
  title: {
    text: '单位：亿元',
    right: 0,
    show: true,
    textStyle: {
      fontSize: 14,
      color: '#fff'
    }
  },
  grid: {
    ...grid.gridStyle31
  },
  tooltip: {
    trigger: 'axis'
  },
  legend: legend.legendStyle41,
  xAxis: [
    xAxis.xAxisStyle41
  ],
  yAxis: [
    yAxis.yAxisStyle43
  ],
  dataZoom: [...horizontalDataZoom],
  series: [
    series.seriesStyle42
  ]
}

// 导出
export const opt = {
  optionStyle1,
  optionStyle2,
  optionStyle3,
  optionStyle4,
  optionStyle5,
  optionStyle6,
  optionStyle7,
  optionStyle8,
  optionStyle9,
  optionStyle10,
  optionStyle31,
  optionStyle32,
  optionStyle41,
  optionStyle33,
  optionStyle34,
  optionStyle35,
  optionStyle42,
  optionStyle36,
  optionStyle37,
  optionStyle38,
  optionStyle39,
  optionStyle131,
  optionStyle40

}

// commonConfig 导出的预设样式
export const commonConfig = {
  ...tooltip,
  ...legend,
  ...xAxis,
  ...yAxis,
  ...color,
  ...series
}

/**
 * 柱状图颜色设置
 * barColor
 **/
export const barColor = {
  ...color
}
/**
 * *柱状图放入宽度设置(series)
 * barSeries
 **/
export const barSeries = {
  ...series
}
