@cainiaofe/cn-ui-charts/lib/lowcode/cn-column-chart/view.js

菜鸟图表组件

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports["default"] = exports.CnColumnChart = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _react = _interopRequireWildcard(require("react"));
var _cnChart = require("../../components/cn-chart");
var _request = require("../../common/util/request");
var _util = require("../../common/util/util");
var _requestError = require("./components/request-error");
var _emptyData = require("./components/empty-data");
var _loading = require("./components/loading");
var _useFilterSearchListener = _interopRequireDefault(require("./hooks/useFilterSearchListener"));
var _setterSnippet = require("../../common/manager/setter-snippet");
var _merge = _interopRequireDefault(require("lodash/merge"));
var _featurePosition = require("../../types/feature-position");
var _useStopLoop = _interopRequireDefault(require("./hooks/useStopLoop"));
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
var CnColumnChart = function CnColumnChart(props) {
  var _xField$, _yField$, _xField$2, _yField$2, _series$;
  var _ref = props || {},
    dataFrom = _ref.dataFrom,
    _context = _ref._context,
    filterConfig = _ref.filterConfig;
  var _ref2 = dataFrom || {},
    requestConfig = _ref2.requestConfig;
  var _ref3 = requestConfig || {},
    serviceType = _ref3.serviceType,
    guid = _ref3.guid,
    xField = _ref3.xField,
    yField = _ref3.yField,
    series = _ref3.series;
  var _useState = (0, _react.useState)([]),
    listData = _useState[0],
    setListData = _useState[1];
  var _useState2 = (0, _react.useState)(),
    loading = _useState2[0],
    setLoading = _useState2[1];
  var _useState3 = (0, _react.useState)(),
    error = _useState3[0],
    setError = _useState3[1];
  var realXField = xField === null || xField === void 0 ? void 0 : (_xField$ = xField[0]) === null || _xField$ === void 0 ? void 0 : _xField$.fieldName;
  var realYField = yField === null || yField === void 0 ? void 0 : (_yField$ = yField[0]) === null || _yField$ === void 0 ? void 0 : _yField$.fieldName;
  var xAliasName = xField === null || xField === void 0 ? void 0 : (_xField$2 = xField[0]) === null || _xField$2 === void 0 ? void 0 : _xField$2.aliasName;
  var yAliasName = yField === null || yField === void 0 ? void 0 : (_yField$2 = yField[0]) === null || _yField$2 === void 0 ? void 0 : _yField$2.aliasName;
  var seriesField = (series === null || series === void 0 ? void 0 : (_series$ = series[0]) === null || _series$ === void 0 ? void 0 : _series$.fieldName) || undefined;
  var isDesign = (0, _util.isDesignMode)(props);
  var _ref4 = filterConfig || {},
    _bindFilter = _ref4._bindFilter;
  var sendRequest = function sendRequest(config) {
    if (requestConfig && requestConfig.serviceType) {
      var realRequestConfig = (0, _util.makeChartRequestConfig)({
        requestConfig: requestConfig,
        _context: _context,
        filterConfig: filterConfig,
        isDesign: isDesign
      });
      var _ref5 = config || {},
        needLoading = _ref5.needLoading;
      if (needLoading !== false) {
        setLoading(true);
      }
      _request.makeRequest === null || _request.makeRequest === void 0 ? void 0 : (0, _request.makeRequest)(realRequestConfig).then(function (res) {
        var data = (0, _util.getRealData)(realRequestConfig, res, _context);
        var _ref6 = data || {},
          _ref6$value = _ref6.value,
          value = _ref6$value === void 0 ? [] : _ref6$value;
        setListData(value);
        setLoading(false);
        setError(undefined);
      }, function () {
        setLoading(false);
        setError('请求失败');
      });
    }
  };
  (0, _useFilterSearchListener["default"])({
    _bindFilter: _bindFilter,
    sendRequest: sendRequest,
    _context: _context
  });
  (0, _useStopLoop["default"])({
    _nodeId: props === null || props === void 0 ? void 0 : props._nodeId
  });
  var realOptions = (0, _extends2["default"])({}, (0, _setterSnippet.getColumnCharOptions)(), {
    encode: {
      x: realXField,
      y: realYField,
      series: seriesField,
      color: seriesField
    },
    data: listData,
    style: {
      maxWidth: 50
    },
    legend: {
      color: {
        title: false
      }
    }
  });
  if (seriesField) {
    (0, _merge["default"])(realOptions, (0, _util.getCommonInteraction)());
  }
  (0, _util.setAliasName)('x', xAliasName, realOptions);
  (0, _util.setAliasName)('y', yAliasName, realOptions);
  var finalOptions = (0, _util.calculateAdvancedConfig)({
    props: props,
    options: (0, _util.calculateFeature)({
      props: props,
      options: realOptions,
      position: _featurePosition.FeaturePosition.column,
      sendRequest: sendRequest
    }),
    state: _context === null || _context === void 0 ? void 0 : _context.state
  });
  if (isDesign && loading === undefined) {
    return /*#__PURE__*/_react["default"].createElement(_cnChart.CnChart, (0, _extends2["default"])({}, (0, _util.getChartCommonStyle)(props), finalOptions, {
      encode: {
        x: 'year',
        y: 'amount'
      },
      data: [{
        year: '2022',
        amount: 111
      }, {
        year: '2023',
        amount: 222
      }]
    }));
  }
  if (error) {
    return /*#__PURE__*/_react["default"].createElement(_requestError.RequestError, {
      error: error
    });
  }
  return /*#__PURE__*/_react["default"].createElement(_loading.Loading, {
    visible: loading
  }, (0, _util.judgeDataEmpty)(finalOptions) ? /*#__PURE__*/_react["default"].createElement(_emptyData.EmptyData, {
    emptyImg: 'https://img.alicdn.com/imgextra/i2/O1CN01orZ7vd1m0aOdNMzMp_!!6000000004892-55-tps-500-260.svg'
  }) : /*#__PURE__*/_react["default"].createElement(_cnChart.CnChart, (0, _extends2["default"])({}, (0, _util.getChartCommonStyle)(props), finalOptions)));

  // return <EmptyData
  //   emptyImg={'https://img.alicdn.com/imgextra/i1/O1CN01h2uPcg1Untx4htgLQ_!!6000000002563-55-tps-500-260.svg'}
  // />
};
exports.CnColumnChart = CnColumnChart;
CnColumnChart.displayName = 'CnColumnChart';
var _default = CnColumnChart;
exports["default"] = _default;