@aliretail/react-materials-components/lib/AreaSelector/components/FullAreaSelector/index.js

B 端物料组件库

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

exports.__esModule = true;
exports["default"] = void 0;

var _cascaderSelect = _interopRequireDefault(require("@alifd/next/lib/cascader-select"));

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));

var React = _interopRequireWildcard(require("react"));

var _reactUniversalRequest = _interopRequireDefault(require("@aliretail/react-universal-request"));

var _GraduallyAreaSelector = _interopRequireDefault(require("../GraduallyAreaSelector"));

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 AreaSelector = /*#__PURE__*/function (_React$Component) {
  (0, _inheritsLoose2["default"])(AreaSelector, _React$Component);

  AreaSelector.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, prevState) {
    var _nextProps$dataSource, _prevState$dataSource;

    if (nextProps !== null && nextProps !== void 0 && nextProps.dataSource && (nextProps === null || nextProps === void 0 ? void 0 : (_nextProps$dataSource = nextProps.dataSource) === null || _nextProps$dataSource === void 0 ? void 0 : _nextProps$dataSource.length) !== (prevState === null || prevState === void 0 ? void 0 : (_prevState$dataSource = prevState.dataSource) === null || _prevState$dataSource === void 0 ? void 0 : _prevState$dataSource.length)) {
      var handleData = function handleData(data) {
        if (data === void 0) {
          data = [];
        }

        var res = data.length ? data.map(function (ele) {
          var _ele$children;

          return (0, _extends2["default"])({}, ele, {
            name: ele.label,
            code: ele.value,
            childElements: (_ele$children = ele.children) !== null && _ele$children !== void 0 && _ele$children.length ? handleData(ele.children) : []
          });
        }) : [];
        return res;
      };

      var data = handleData(nextProps.dataSource);
      return {
        dataSource: data
      };
    }

    return null;
  };

  function AreaSelector(props) {
    var _this;

    _this = _React$Component.call(this, props) || this;

    _this.areaData = function (app, api) {
      // 默认值
      var appCode = app || 'retailforce_oms_pro';
      var apiCode = api || 'find_three_full_region'; // 请求数据

      (0, _reactUniversalRequest["default"])({
        appCode: appCode,
        apiCode: apiCode,
        type: 'json',
        method: 'post',
        autoShowErrorMessage: true
      }).then(function (res) {
        if (res.result && res.result.success === true) {
          var data = res.result.result || [];

          _this.handleData(data);

          _this.setState({
            dataSource: data
          });
        }
      });
    };

    _this.handleData = function (data) {
      if (data === void 0) {
        data = [];
      }

      data.length && data.forEach(function (item) {
        item.name = item.label;
        item.code = item.value;

        if (item.children && item.children.length) {
          item.childElements = item.children;

          _this.handleData(item.children);
        } else {
          item.childElements = [];
        }
      });
    };

    _this.genMap = function (infoData) {
      var map = {};

      var invoke = function invoke(items) {
        items.forEach(function (item) {
          map[item.code] = item;

          if (Array.isArray(item.childElements)) {
            invoke(item.childElements);
          }
        });
      };

      invoke(infoData);
      return map;
    };

    _this.genPostData = function (values) {
      if (values === void 0) {
        values = [];
      }

      var dataSource = _this.state.dataSource;

      var dataMap = _this.genMap(dataSource);

      var findRelation = function findRelation(value) {
        var data = dataMap[value];
        var relationArr = [];

        while (data && data.divLevel !== 1) {
          relationArr.unshift(data.code);
          data = dataMap[data.parentCode];
        }

        return relationArr;
      };

      var resultMap = {};
      Array.isArray(values) && values.forEach(function (item) {
        var relationArr = findRelation(item);

        var genChild = function genChild() {
          if (relationArr.length === 2) {
            return {
              code: relationArr[1]
            };
          } else {
            return {
              code: relationArr[1],
              childElements: [{
                code: relationArr[2]
              }]
            };
          }
        };

        if (resultMap[relationArr[0]]) {
          // 需要做合并
          resultMap[relationArr[0]].childElements = resultMap[relationArr[0]].childElements || [];
          var secondChild = resultMap[relationArr[0]].childElements.find(function (el) {
            return el.code === relationArr[1];
          });

          if (secondChild) {
            secondChild.childElements = secondChild.childElements || [];
            secondChild.childElements.push({
              code: relationArr[1]
            });
          } else {
            resultMap[relationArr[0]].childElements.push(genChild());
          }
        } else {
          resultMap[relationArr[0]] = {
            code: relationArr[0]
          };

          if (relationArr.length > 1) {
            resultMap[relationArr[0]].childElements = [genChild()];
          }
        }
      });
      return Object.keys(resultMap).map(function (code) {
        return resultMap[code];
      });
    };

    _this.getThreeCode = function () {
      var _this$state = _this.state,
          dataSource = _this$state.dataSource,
          valueArr = _this$state.valueArr;

      var data = _this.genPostData(valueArr);

      var overData = [];
      data.forEach(function (el) {
        dataSource.forEach(function (item) {
          if (item.childElements && item.childElements.length) {
            item.childElements.forEach(function (ele) {
              if (el && ele.code === el.code) {
                overData.push({
                  code: ele.parentCode,
                  childElements: el
                });
              }
            });
          }
        });
      });
      Array.isArray(valueArr) && valueArr.forEach(function (el) {
        dataSource.forEach(function (item) {
          if (item.code === el) {
            overData.push({
              code: el
            });
          }
        });
      });
      var indexArr = [];
      var arr = [];
      overData.forEach(function (item) {
        if (indexArr.indexOf(item.code) === -1) {
          indexArr.push(item.code);
          arr.push({
            code: item.code,
            childElements: item.childElements ? [item.childElements] : []
          });
        } else {
          arr.forEach(function (ele) {
            if (ele && ele.code === item.code) {
              item.childElements && ele.childElements.push(item.childElements);
            }
          });
        }
      });
      return arr;
    };

    _this.getNameOrCode = function (val) {
      if (val === void 0) {
        val = [];
      }

      var dataSource = _this.state.dataSource;

      var dataMap = _this.genMap(dataSource);

      var values = Array.isArray(val) && val.filter(function (ele) {
        var flag = 0;
        dataSource.forEach(function (item) {
          if (ele === item.code) {
            flag = 1;
          }
        });

        if (flag === 0) {
          return ele;
        }

        return null;
      });

      var findRelation = function findRelation(value) {
        var data = dataMap[value];
        var relationArr = [];

        while (data && data.divLevel !== 1) {
          relationArr.unshift({
            code: data.code,
            name: data.name
          });
          data = dataMap[data.parentCode];
        }

        return relationArr;
      };

      var resultMap = {};
      Array.isArray(values) && values.forEach(function (item) {
        var relationArr = findRelation(item);

        var genChild = function genChild() {
          if (relationArr.length === 2) {
            return (0, _extends2["default"])({}, relationArr[1]);
          } else {
            return (0, _extends2["default"])({}, relationArr[1], {
              childElements: [(0, _extends2["default"])({}, relationArr[2])]
            });
          }
        };

        if (resultMap[relationArr[0] && relationArr[0].code]) {
          // 需要做合并
          resultMap[relationArr[0] && relationArr[0].code].childElements = resultMap[relationArr[0] && relationArr[0].code].childElements || [];
          var secondChild = resultMap[relationArr[0] && relationArr[0].code].childElements.find(function (el) {
            return el.code ? el.code === relationArr[1].code : '';
          });

          if (secondChild) {
            secondChild.childElements = secondChild.childElements || [];
            secondChild.childElements.push((0, _extends2["default"])({}, relationArr[1]));
          } else {
            resultMap[relationArr[0] && relationArr[0].code].childElements.push(genChild());
          }
        } else {
          resultMap[relationArr[0] && relationArr[0].code] = (0, _extends2["default"])({}, relationArr[0]);

          if (relationArr.length > 1) {
            resultMap[relationArr[0] && relationArr[0].code].childElements = [genChild()];
          }
        }
      });
      return Object.keys(resultMap).map(function (code) {
        return resultMap[code];
      });
    };

    _this.getThreeCodeOrName = function () {
      var valueArr = _this.state.valueArr;
      var dataSource = _this.state.dataSource;

      var data = _this.getNameOrCode(valueArr);

      var overData = [];
      data.forEach(function (el) {
        dataSource.forEach(function (item) {
          if (item.childElements && item.childElements.length) {
            item.childElements.forEach(function (ele) {
              if (el && ele.code === el.code) {
                overData.push({
                  name: item.name,
                  code: ele.parentCode,
                  childElements: el
                });
              }
            });
          }
        });
      });
      Array.isArray(valueArr) && valueArr.forEach(function (el) {
        dataSource.forEach(function (item) {
          if (item.code === el) {
            overData.push({
              name: item.name,
              code: el
            });
          }
        });
      });
      var indexArr = [];
      var arr = [];
      overData.forEach(function (item) {
        if (indexArr.indexOf(item.code) === -1) {
          indexArr.push(item.code);
          arr.push({
            name: item.name,
            code: item.code,
            childElements: item.childElements ? [item.childElements] : []
          });
        } else {
          arr.forEach(function (ele) {
            if (ele && ele.code === item.code) {
              item.childElements && ele.childElements.push(item.childElements);
            }
          });
        }
      });
      return arr;
    };

    _this.handleChange = function (val, item, obj) {
      var multiple = _this.props.multiple;
      var valueStatus = _this.state.valueStatus;

      if (Array.isArray(val) && val.length && valueStatus) {
        _this.setState({
          valueStatus: 0
        });
      }

      _this.setState({
        valueArr: val
      }, function () {
        var codeData = _this.getThreeCode(); // code


        var renderData = _this.getThreeCodeOrName(); // code or name


        var data = val || [];

        if (multiple === false) {
          data = _this.getCodeOrName(val, item, obj);
        }

        _this.props.onChange && _this.props.onChange(data, codeData, renderData, item, obj);

        if (!(val !== null && val !== void 0 && val.length)) {
          _this.setState({
            valueStatus: 1
          });
        }
      });
    };

    _this.getCodeOrName = function (val, item, obj) {
      var data = [];
      obj && obj.selectedPath.forEach(function (ele) {
        data.push({
          name: ele.label,
          code: ele.value
        });
      });

      if (data[3]) {
        data[2].childElements = [data[3]];
      }

      if (data[2]) {
        data[1].childElements = [data[2]];
      }

      if (data[1]) {
        data[0].childElements = [data[1]];
      }

      var param = data[0] ? [data[0]] : [];
      return param;
    };

    _this.dataHandle = function (val) {
      var _value$;

      var value = val || '';

      if (value !== null && value !== void 0 && value.length && (_value$ = value[0]) !== null && _value$ !== void 0 && _value$.code) {
        var _value$2, _value$2$childElement, _value$3, _value$3$childElement, _value$5, _value$5$childElement, _value$5$childElement2, _value$5$childElement3;

        if (!((_value$2 = value[0]) !== null && _value$2 !== void 0 && (_value$2$childElement = _value$2.childElements) !== null && _value$2$childElement !== void 0 && _value$2$childElement.length)) {
          return value[0].code;
        } else if (!((_value$3 = value[0]) !== null && _value$3 !== void 0 && (_value$3$childElement = _value$3.childElements[0]) !== null && _value$3$childElement !== void 0 && _value$3$childElement.childElements.length)) {
          var _value$4;

          return (_value$4 = value[0]) === null || _value$4 === void 0 ? void 0 : _value$4.childElements[0].code;
        } else if (!((_value$5 = value[0]) !== null && _value$5 !== void 0 && (_value$5$childElement = _value$5.childElements[0]) !== null && _value$5$childElement !== void 0 && (_value$5$childElement2 = _value$5$childElement.childElements[0]) !== null && _value$5$childElement2 !== void 0 && (_value$5$childElement3 = _value$5$childElement2.childElements) !== null && _value$5$childElement3 !== void 0 && _value$5$childElement3.length)) {
          var _value$6;

          return (_value$6 = value[0]) === null || _value$6 === void 0 ? void 0 : _value$6.childElements[0].childElements[0].code;
        } else {
          return value[0].childElements[0].childElements[0].childElements[0].code;
        }
      } else {
        return value;
      }
    };

    _this.state = {
      valueArr: props.value || [],
      valueStatus: 0,
      dataSource: []
    };
    return _this;
  }

  var _proto = AreaSelector.prototype;

  _proto.componentDidMount = function componentDidMount() {
    var _this$props = this.props,
        appCode = _this$props.appCode,
        apiCode = _this$props.apiCode,
        dataSource = _this$props.dataSource;

    if (dataSource && dataSource.length) {
      this.handleData(dataSource);
      this.setState({
        dataSource: dataSource
      });
    } else if (!dataSource) {
      this.areaData(appCode, apiCode);
    }
  } // 区域数据请求
  ;

  _proto.render = function render() {
    var _this$props2 = this.props,
        _this$props2$value = _this$props2.value,
        value = _this$props2$value === void 0 ? [] : _this$props2$value,
        _this$props2$multiple = _this$props2.multiple,
        multiple = _this$props2$multiple === void 0 ? true : _this$props2$multiple,
        _this$props2$isPrevie = _this$props2.isPreview,
        isPreview = _this$props2$isPrevie === void 0 ? false : _this$props2$isPrevie,
        _this$props2$placehol = _this$props2.placeholder,
        placeholder = _this$props2$placehol === void 0 ? '' : _this$props2$placehol,
        _this$props2$disabled = _this$props2.disabled,
        disabled = _this$props2$disabled === void 0 ? false : _this$props2$disabled,
        maxTagCount = _this$props2.maxTagCount,
        _this$props2$readOnly = _this$props2.readOnly,
        readOnly = _this$props2$readOnly === void 0 ? false : _this$props2$readOnly,
        hasClear = _this$props2.hasClear,
        _this$props2$followTr = _this$props2.followTrigger,
        followTrigger = _this$props2$followTr === void 0 ? true : _this$props2$followTr;
    var val = this.dataHandle(value);
    var dataSource = this.state.dataSource;
    return /*#__PURE__*/React.createElement("div", {
      className: "aliretail-area-select",
      "data-name": "AliretailAreaSelect"
    }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(_cascaderSelect["default"], {
      className: "area-select-box",
      popupClassName: "area-select-content",
      value: val,
      multiple: multiple,
      isPreview: isPreview,
      dataSource: dataSource,
      onChange: this.handleChange,
      placeholder: placeholder,
      disabled: disabled,
      maxTagCount: maxTagCount,
      readOnly: readOnly,
      hasClear: hasClear,
      followTrigger: followTrigger
    })));
  };

  return AreaSelector;
}(React.Component);

AreaSelector.Gradually = _GraduallyAreaSelector["default"];
var _default = AreaSelector;
exports["default"] = _default;