import React, { useMemo } from 'react';
import deepCopy from '@/utils/deepCopy';
import ECharts from '@/components/ECharts';

const defaultOpt = {
  title: {
    text: '农机作业量面积统计',
    left: 'center'
  },
  legend: {
    orient: 'vertical',
    left: 'right',
    bottom: '5%',
  },
  toolbox: {},
  series: [
    {
      type: 'pie',
      radius: ['40%', '55%'],
      center: ['40%', '50%'],
      selectedMode: 'single',
      avoidLabelOverlap: false,
      label: {
        color: '#000',
        formatter: '{b}\n{d}%'
      },
    }
  ]
}
export default (props) => {
  const { opt } = props
  const option = useMemo(() => deepCopy(defaultOpt), []);
  option.series[0].data = opt;
  (option.series[0].data[0] || {}).selected = true;
  return <div style={{ height: '300px', width: '100%' }}> <ECharts option={option} /></div>;
}