function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
import { useEffect, useState } from "react";
import ReactEcharts from "echarts-for-react";
import { jsx as _jsx } from "react/jsx-runtime";
var BarList = function BarList(props) {
  var _props$data, _result$, _result$2;
  var _useState = useState({}),
    _useState2 = _slicedToArray(_useState, 2),
    option = _useState2[0],
    setOption = _useState2[1];
  var isProfit = props.name === "实现利润总额";
  var isCashRate = props.name === "营业现金比率";
  var isTotal = props.name == "综合得分";
  //按照数值排序
  var result = (props === null || props === void 0 ? void 0 : (_props$data = props.data) === null || _props$data === void 0 ? void 0 : _props$data.map(function (item, index) {
    var showValue = (item === null || item === void 0 ? void 0 : item.value) + "%";
    if (isTotal) {
      showValue = item === null || item === void 0 ? void 0 : item.value;
    }
    var value = item.value;
    if ((item === null || item === void 0 ? void 0 : item.value) < 0) {
      showValue = isProfit ? Math.abs(item === null || item === void 0 ? void 0 : item.value) / 100 : Math.abs(item === null || item === void 0 ? void 0 : item.value);
      value = Math.abs(item === null || item === void 0 ? void 0 : item.value);
    }
    //利润总额 负值显示万元
    if ((item === null || item === void 0 ? void 0 : item.value) < 0 && isProfit) {
      showValue = "-" + showValue + "万元";
      value = 0.1;
    }
    // 营业现金比例
    if ((item === null || item === void 0 ? void 0 : item.value) < 0 && isCashRate) {
      showValue = "-" + showValue + "%";
    }
    if (props !== null && props !== void 0 && props.hideNo) {
      showValue = item === null || item === void 0 ? void 0 : item.value;
      if (item !== null && item !== void 0 && item.label) {
        showValue = item === null || item === void 0 ? void 0 : item.label;
      }
      if (index == 0) {
        showValue = ((props === null || props === void 0 ? void 0 : props.firstLabel) || "") + showValue;
      }
    }
    return _objectSpread(_objectSpread({}, item), {}, {
      showValue: showValue,
      value: value
    });
  })) || [];
  var max = (result === null || result === void 0 ? void 0 : (_result$ = result[0]) === null || _result$ === void 0 ? void 0 : _result$.value) > 100 ? result === null || result === void 0 ? void 0 : (_result$2 = result[0]) === null || _result$2 === void 0 ? void 0 : _result$2.value : 100;
  var typeColor = props.type === "bottom" ? "#E24A3B" : "#11d8ff";
  var typeColorStart = props.type === "bottom" ? "pink" : "skyblue";
  if (props.type == "topscore") {
    typeColor = "white";
  }
  useEffect(function () {
    //右侧文本
    var rightText = {
      color: typeColor,
      fontSize: 20,
      fontWeight: 700
    };
    var rightValue = function rightValue(value, index) {
      var _result$index;
      return result === null || result === void 0 ? void 0 : (_result$index = result[index]) === null || _result$index === void 0 ? void 0 : _result$index.showValue;
    };

    //左侧文本
    var optionNew = {
      animation: true,
      animationThreshold: 10000,
      animationEasing: "elasticOut",
      quadraticIn: function quadraticIn(idx) {
        return idx * idx;
      },
      backgroundColor: "transparent",
      tooltip: {
        show: props !== null && props !== void 0 && props.hideNo ? false : true,
        trigger: "item",
        padding: [8, 0],
        backgroundColor: "rgba(23, 51, 67,1)",
        textStyle: {
          color: "rgba(255, 255, 255, 1)"
        }
      },
      legend: {
        show: false
      },
      grid: {
        left: "10",
        right: "16",
        top: "10",
        bottom: props.bottom || "0"
      },
      xAxis: [{
        splitLine: {
          show: false
        },
        type: "value",
        show: false,
        // 最大值
        max: max
      }],
      yAxis: [{
        splitLine: {
          show: false
        },
        axisLine: {
          show: false
        },
        type: "category",
        axisTick: {
          show: false
        },
        inverse: true,
        data: result,
        axisLabel: {
          color: "white",
          // color: "red",
          fontSize: 20,
          margin: 10
        }
      }, {
        type: "category",
        inverse: true,
        axisTick: "none",
        axisLine: "none",
        show: true,
        axisLabel: {
          verticalAlign: "bottom",
          align: "right",
          margin: 0,
          padding: [0, 0, 15, 0],
          textStyle: rightText,
          formatter: rightValue
        },
        data: result
      }],
      series: [{
        name: "",
        type: "bar",
        barWidth: 5,
        // 柱子宽度
        MaxSize: 0,
        showBackground: true,
        barBorderRadius: [30, 0, 0, 30],
        backgroundStyle: {
          color: "rgba(80, 121, 150, 0.6)"
        },
        label: {
          show: true,
          offset: [10, -25],
          //左侧文本颜色

          color: "white",
          fontWeight: 500,
          fontSize: 20,
          position: "left",
          align: "left",
          formatter: function formatter(params) {
            var _params$data$name, _params$data$name2;
            var id = (_params$data$name = params.data.name) === null || _params$data$name === void 0 ? void 0 : _params$data$name.split("-")[0];
            var name = (_params$data$name2 = params.data.name) === null || _params$data$name2 === void 0 ? void 0 : _params$data$name2.split("-")[1];
            if (props !== null && props !== void 0 && props.hideNo) {
              return name;
            }
            return "{icon1|".concat(id, "}") + name;
          },
          rich: {
            icon1: {
              width: 75,
              height: 0,
              padding: [5, 0, 2, 0],
              color: typeColor,
              fontSize: 20
            }
          }
        },
        data: result.map(function (item, index) {
          var sColor = item === null || item === void 0 ? void 0 : item.startColor;
          var eColor = item === null || item === void 0 ? void 0 : item.bgColor;
          if (props.type !== "topscore") {
            sColor = typeColorStart;
            eColor = typeColor;
          }
          return {
            name: item.name,
            value: item.value,
            itemStyle: {
              barBorderRadius: [30, 0, 0, 30],
              color: {
                type: "linear",
                x: 0,
                y: 0,
                x2: 1,
                y2: 1,
                colorStops: [{
                  offset: 0,
                  color: sColor
                }, {
                  offset: 1,
                  color: eColor
                }]
              }
            }
          };
        })
      }, {
        name: "外圆",
        type: "scatter",
        emphasis: {
          scale: false
        },
        symbol: "circle",
        symbolSize: [10, 10],
        // 进度条白点
        itemStyle: {
          barBorderRadius: [30, 0, 0, 30],
          color: "white",
          shadowColor: "rgba(255, 255, 255, 0.5)",
          shadowBlur: 5,
          borderWidth: 1,
          opacity: 1
        },
        z: 2,
        data: result,
        animationDelay: 500
      },
      // 进度条的小圆圈
      {
        name: "指标",
        type: "scatter",
        emphasis: {
          scale: false
        },
        symbol: "image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAAXNSR0IArs4c6QAACCpJREFUSEuFl+uPXVUZxn/rus9lru200zt2SrEJjQSlDWAipv2AGtQYouGDJhpDofgnmNhTv/pFjAItaGL8QtRojCbEaJXEBKUU4YNtKNCW0tqm6XRmembOZe91M2vP9AKWspJ9zsneZ69nvc9a7/M+r+BjRkpJ3HcYfRHGo2BaSFaX0DJgiAgnqbSkKyLdpmL2vW9zKQEizytE/nnLUT//4EiCBEnA3R3MwnpmnGZrCpj8PwWE/HFthGs3l28k6JM4r5ucu/Qt+jcji5sW8n/AnU6SnQOw5hlmMGyXAusDSMEVZZgLA+baLYbvnaWfgTasRzvPWDKMkdiYJGMikWJkkAQn557gnOgg6JBSyiQss1ADZzqFyN9wEMTTz7JTSrZiQQbmUuTdEcu8n0fE9vI7Nw/ZI7EJdI/Ugwk822NktRBElTiz/yLHOwdI+c1r4CuTLNPbOYj42SbuiYktIhGs4h0rOVtVSOeRl5cQq5ori+0jmARR5jdhboIwnVk/TbJ3EKvIHZXnziTRInJu9iJvpgP1DtZ7fyPig4jJ9dxtJTNJMhAVbyrJUmgi3AIqBmRMyGQRowaxCLTL5UX0JFFOEicrUneRaCYIZpa4MMFIK3FviDR15PT+fRzv1CHWVCfR6SB+PMVmbbmHQBwWvDrm6FUaFTwy9FAtjYoRWShU0ojBCtfCk5pA2SDIAVG3CL1A0J5gNDEa2t6xG4GSieNPXeRMpyNiDTz9I1p+nAcQtIXjrcYU75eXUe0W2vVQzqOjQkWJKgpkf4BsKMQQaGTQSGgZkoyEqsSbSXxvjmA24ovzhDjOljKyQwbcFsFfju3DC1ISU7/gruTYIRVzxSLHygLlNco7dENggkVHgRoBM4zI5FBJIawF54j5EMlEqIE1XoMzFt8f4m0T3zxN6G1kV0pMWsPbF74j3hL5RK97nr0+0haCoxauZoqrq5iGxCwW6DGNjRqtEiYJlHaoSiJwdQ4n4Yle4qXEK4HLwAs9nBrBWYGznlC1GE9DdktBuSVwREwdSusR7EqCpVHNKwOFKq9gQgttI0UwaOOxQWIVmAO72P3QJva1DXdJweii4/W35/njk3/nDwqcB6cNlRvijKMajuJMHz++FXf1v+yuo068IiZfSDtVZAbPycaQ94fjaNdAF32sr7BaY2WiyMAvPsxT2yZ4/FYaeGqB5x/7M8+oSBU0VZCUaoArCyp7BTeyFtd1bDOwDclpsfZwejBE1sjAq0bTHZbopsTMG2yOuGUpgsf+dA+P7lrLgY/S3qxDfzrNkz88xr8GjrLdpPQVZemoTMS11uGG80wowa4AV8Waw+mLMWJl4Ijsk6oxtAdjGxS6qqNuSEPxt6/xwqjlM7cBZtFxbM9v2BcjQ92kXOwxVJYq73kTnLXYJcfnjKQSU4fTV1JETK/ipStDTDVAuxI73qRYcthmpOkNxbHHeP12oPlZSHTv/y2fD31KM8LQl5SFpBzM4+YncVzET2/gC0GSxNRz6csJ5JVVvLRhHj0AUxisU1gdKFyO2NM4+k1ezofpY8DTfS9yX0wMtViOeFxT1fvcxY8W+IU2D6tEuk51FLyc6cjAzdE6cqtKGj5RSCiOfJ2fjxV8+rZUVxzb83ser4ElZRhSWks1LKnm5vCfmkFcGLL3GtUPAeMkXss5XB+ucUw5xPocdaTIEf/gAe5/ZIZDtztcb8xy8Mm/8rsgKL2kdCWl1HiTgT1uqs2E0uxKgVkx/WzaGRQzEU61ljhdp1OJtjmFwFxPp0Tx4pfY/5Hp1OX5R1/iGamp6pQqKUtLpRZxRUF1uYXf6NjiFTtE4JTYcChNVYIHhWD+8kaOTh9HN6cwVyp0obH1yVbYWGGUwj63h69un+SRTHuMLC053vnHBQ5//yivNsCFLB6BSmcF6+GGAVesxl1awK9u8lkhaBM4Jvh1smsW2BsFVgx5bcOQq+cL1JxGjQiMddggMKbA6IjOkpl1m4DIimkUyRuCKAlZMn2gUi1c2cdJg8+SOXsVn2lOkt0kelce50hdJFYf5pNCcJeILLQLjg5mUXU+N9DNCu0HmGjQVi6DpoQka3UFaJLIVyI4h897WvZwExrfN/hcHtst/ELJbi2ZsIqTF74rTtZlkZ9g11j2RoXJZdEqzrlJpJ9HtRpo36/rsra5SkXksAG2QolAwpDKXJ2yGVipUKbE99qErNHmMrHazOYU2aEC/anAP098TywtAydY+0tmYuBuPEFFXsvuI9udXB6DQo0EZDciGxKFRqTqhvcSGTRfitiPBHWTEega2saxW0p0EXlj30XOdzorFqg2eyvWR0pmVGIoh/xbFvSy9bnkkBNdVBxFpuEN63NNTUSDtNQjZv+1oIhrFDG7jwxqHfcKuWx9Lj3Bfz5k9mqvmS2oWHPN7EW8Dbxrm5x9r42YHiKDQ8beitkrVjx7m8QcyDZJzRFVjyTHSLHNHQPYJhNaWM7Nvs+bdERcduw3m70Vv5n919Mb2Slha16OZNnezpbMbfLI2EVcWA8bgAvZV68oirVEzsLSeiZF4M6oWK0FEcOZ/Wc5nunNgB8Avq5GKYk6jg5i/SY2x8j2AK1cRFAsisR5EouqSzfr7rvAJwLNpRbNKFiVPKukYVU29AJcI/H2uX2crluaD7UzHzDn9V5f854J1v2KVnBsUoHNSJoh1hzlKa53JnVLc5OOCoFPklNrRzlz4gSe2shnh5Wbhhu91C16pxudxfJ8y/RMHWKdiqxOijEH41aiM6CI+NwvaZiViUsTk3RPfENUWR9WTsEtG7f/ARqeIzUaHVUWAAAAAElFTkSuQmCC",
        symbolSize: [20, 20],
        itemStyle: {
          color: typeColor,
          shadowColor: "rgba(255, 255, 255, 1)",
          shadowBlur: 5,
          borderWidth: 1,
          opacity: 1
        },
        z: 2,
        zlevel: 10,
        data: result,
        animationDelay: 500
      }
      //流光动画
      // {
      //   type: "lines",
      //   coordinateSystem: "cartesian2d",
      //   data: result.map((item, index) => {
      //     return {
      //       coords: [
      //         [0, index],
      //         [item?.value - 4, index],
      //       ],
      //     };
      //   }),
      //   effect: {
      //     show: true,
      //     period: 2.5,
      //     trailLength: 0.5,
      //     symbolSize: 14,
      //     symbol: "pin",
      //     loop: true,
      //     color: typeColor,
      //   },
      //   lineStyle: {
      //     width: 0,
      //     opacity: 0.6,
      //     curveness: 0,
      //   },
      //   z: 99,
      // },
      ]
    };

    setOption(optionNew);
  }, [props.name, props.data]);
  return /*#__PURE__*/_jsx(ReactEcharts, {
    option: option,
    theme: "Imooc",
    style: {
      height: props.height || "250px"
    }
  });
};
export default BarList;