"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = CTL;
var _react = _interopRequireDefault(require("react"));
var _echartsForReact = _interopRequireDefault(require("echarts-for-react"));
require("./index.less");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
var chartFontColor = '#000';
function CTL(_ref) {
  var isDeepTheme = _ref.isDeepTheme,
    ctlfxAndLdData = _ref.ctlfxAndLdData;
  var data = ((ctlfxAndLdData === null || ctlfxAndLdData === void 0 ? void 0 : ctlfxAndLdData.garbageList) || []).map(function (item) {
    return {
      name: item.garbageTypeName,
      value: item.weight
    };
  });
  var options = {
    color: ['#438EF7', '#40AAF3', '#62C4F9', '#20BB70', '#1DD27B', '#49E6A2', '#F2953A', '#FAAB59', '#F9C665', '#8A7FEE'],
    backgroundColor: 'transparent',
    title: {
      textAlign: 'center',
      text: '今日接收总量',
      textStyle: {
        fontSize: 14,
        color: '#595959'
      },
      subtext: (ctlfxAndLdData === null || ctlfxAndLdData === void 0 ? void 0 : ctlfxAndLdData.totalWeight) || '0',
      subtextStyle: {
        fontSize: 22,
        color: '#1F1F1F'
      },
      top: '38%',
      left: '19%'
    },
    tooltip: {
      show: true,
      formatter: "{b}\uFF1A{c}\u5428"
    },
    legend: {
      orient: 'vertical',
      left: '45%',
      top: 'middle',
      align: 'left',
      itemGap: 8,
      icon: 'circle',
      itemWidth: 10,
      itemHeight: 10,
      textStyle: {
        fontSize: 14,
        color: isDeepTheme ? '#fff' : '#000',
        rich: {
          name: {
            fontSize: 14,
            width: 100,
            color: isDeepTheme ? '#fff' : '#595959'
          },
          value: {
            fontSize: 14,
            width: 80,
            color: isDeepTheme ? '#fff' : '#1F1F1F'
          },
          rate: {
            fontSize: 14,
            width: 60,
            color: isDeepTheme ? '#fff' : '#8C8C8C'
          }
        }
      },
      pageIconColor: chartFontColor,
      pageIconInactiveColor: chartFontColor,
      pageTextStyle: {
        color: isDeepTheme ? '#fff' : chartFontColor
      },
      formatter: function formatter(name) {
        var value = data.find(function (item) {
          return item.name === name;
        });
        var totalCount = data.reduce(function (acc, cur) {
          return acc + cur.value;
        }, 0);
        var rate = ((value === null || value === void 0 ? void 0 : value.value) || 0) / totalCount * 100;
        if (value) {
          return "{name|".concat(name, "} {value|").concat(value.value, "\u5428} {rate|").concat(rate.toFixed(2), "%}");
        } else {
          return '';
        }
      }
    },
    series: [{
      type: 'pie',
      radius: ['55%', '75%'],
      center: ['20%', '50%'],
      hoverAnimation: true,
      z: 10,
      label: {
        show: false
      },
      data: data,
      labelLine: {
        show: false
      }
    }, {
      type: 'pie',
      radius: ['75%', '85%'],
      center: ['20%', '50%'],
      hoverAnimation: true,
      z: 10,
      label: {
        show: false
      },
      data: data,
      labelLine: {
        show: false
      },
      itemStyle: {
        borderWidth: 0,
        opacity: 0.3
      }
    }]
  };
  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
    className: "jzlj-card-title"
  }, /*#__PURE__*/_react["default"].createElement("span", {
    className: "jzlj-card-title-text"
  }, "\u63A5\u6536\u91CF\u5206\u6790")), /*#__PURE__*/_react["default"].createElement("div", {
    className: "jzlj-card-content"
  }, /*#__PURE__*/_react["default"].createElement("div", {
    className: "jzlj-xnc-ctl-pie"
  }, /*#__PURE__*/_react["default"].createElement(_echartsForReact["default"], {
    option: options,
    notMerge: true,
    lazyUpdate: true,
    style: {
      height: '100%',
      width: '100%'
    }
  }))));
}
//# sourceMappingURL=CTL.js.map
