export default {
  legend: {
    right: 0,
    top: '30%',
    orient: 'vertical',
    textStyle: {color: "#fff", fontSize: 14}
  },
  grid: {
    height: 260
  },
  xAxis: {show: false},
  yAxis: {show: false},
  tooltip: {
    backgroundColor: "rgba(14, 51, 111, 0.9)",
    borderColor: "#1A6ABC",
    textStyle: {color: "#fff"}
  },
  series: {
    type: "pie",
    minShowLabelAngle: 10,
    radius: [50, 71],
    itemStyle: {
      borderColor: "#8d1419",
      borderWidth: 2
    },
    label: {
      show: false
    },
    labelLine: {},
    labelLayout: function (params) {
      let points = params.labelLinePoints,
          isLeft = points[2][0] < points[1][0]
      points[2][0] =
          points[2][0] + (params.labelRect.width + 4) * (isLeft ? -1 : 1)
      return {
        labelLinePoints: points
      }
    }
  },
  render: (h, params) => {
    const formatNum = num => {
      if (num >= 10000000) {
        return num / 10000000 + "千万"
      }

      if (num >= 10000) {
        return num / 10000 + "万"
      }

      return parseFloat(num.toFixed(2))
    }

    let total = params.data.reduce((t, e) => {
      return t + Number(Object.values(e)?.[1] || 0)
    }, 0)
    return h(
        "div",
        {
          style: {
            height: "162px",
            width: "162px",
            color: "#8BCCFF",
            left: "50%",
            top: "50%",
            zIndex: '0',
            display: "flex",
            alignItems: "center",
            justifyContent: "center",
            flexDirection: "column",
            position: "absolute",
            transform: "translate(-50%,-50%)",
            backgroundPosition: "center"
          }
        },
        [
          h(
            'span',
            {
              style: {
                'font-size': '32px',
                'font-weight': 'bold',
                'margin-bottom': '3px',
                'color': '#CEE1FF',
                'line-height': '28px',
                'text-shadow': '0px 2px 4px rgba(117, 9, 9, 0.1)',
                'background': 'linear-gradient(180deg, #FFF6C7 0%, #FF9A02 100%)',
                '-webkit-background-clip': 'text',
                '-webkit-text-fill-color': 'transparent'
              }
            },
            formatNum(total)
          ),
          h('span', {
            style: {
              'font-size': '16px',
              'color': '#CEE1FF',
              'line-height': '16px',
              'text-shadow': '0px 2px 4px rgba(117, 9, 9, 0.5)',
              'background': 'linear-gradient(180deg, #FFF6C7 0%, #FF9A02 100%)',
              '-webkit-background-clip': 'text',
              '-webkit-text-fill-color': 'transparent'
            }
          }, "总量")
        ]
    )
  }
}