@51yzone/pc-components/lib/place-search/map.js

An enterprise-class UI design language and React-based implementation

"use strict";

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

var _typeof = require("@babel/runtime/helpers/typeof");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));

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

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

var _rcMap = _interopRequireWildcard(require("@gem-mine/rc-map"));

var _jsAsyncLoader = _interopRequireDefault(require("@gem-mine/js-async-loader"));

var _classnames = _interopRequireDefault(require("classnames"));

var _cache = require("../constants/cache");

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 __awaiter = void 0 && (void 0).__awaiter || function (thisArg, _arguments, P, generator) {
  function adopt(value) {
    return value instanceof P ? value : new P(function (resolve) {
      resolve(value);
    });
  }

  return new (P || (P = Promise))(function (resolve, reject) {
    function fulfilled(value) {
      try {
        step(generator.next(value));
      } catch (e) {
        reject(e);
      }
    }

    function rejected(value) {
      try {
        step(generator["throw"](value));
      } catch (e) {
        reject(e);
      }
    }

    function step(result) {
      result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected);
    }

    step((generator = generator.apply(thisArg, _arguments || [])).next());
  });
};
/**
 * 关键字：地图
 * 新增人：徐友万
 * 完善中
 */


// 地图实例
var map;
var AMap; // 创建信息窗体

var infoWindow;

var createInfoWindow = function createInfoWindow(_ref) {
  var title = _ref.title,
      address = _ref.address;
  var content = "<div class='info-window-wrap'>\n      <h4 class='info-window-title'>".concat(title, "</h4>\n      <p class='info-window-input-item'>\n        <span class='label'>\u5730\u5740\uFF1A</span>\n        <span class='value'>").concat(address, "</span>\n      </p>\n    </div>");
  infoWindow = new AMap.InfoWindow({
    content: content,
    offset: new AMap.Pixel(0, -40)
  });
}; // 创建marker


var createMarker = function createMarker(position) {
  var marker = new AMap.Marker({
    position: position,
    icon: 'http://webapi.amap.com/theme/v1.3/markers/n/mark_b.png',
    map: map,
    animation: 'AMAP_ANIMATION_DROP'
  });
  infoWindow.open(map, marker.getPosition());
  AMap.event.addListener(marker, 'click', function () {
    infoWindow.open(map, marker.getPosition());
  });
  marker.setMap(map);
};

var Map = function Map(props) {
  if (!(window._AMapSecurityConfig && window._AMapSecurityConfig.securityJsCode)) {
    console.warn('请使用项目securityJsCode！');
    window._AMapSecurityConfig = {
      securityJsCode: '6a588873fd8dc0f263e4d360a550b350'
    };
  }

  var value = props.value,
      infoWindowProps = props.infoWindowProps,
      prefixCls = props.prefixCls,
      style = props.style,
      className = props.className,
      getMapInstance = props.getMapInstance,
      onMapClick = props.onMapClick; // 初始化变量

  var _useState = (0, _react.useState)(false),
      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
      init = _useState2[0],
      setInit = _useState2[1]; // 定位到传入的经纬度位置


  (0, _react.useEffect)(function () {
    if (init && value && value.length) {
      console.log('地图初始化完成，且接收到center:', value);

      if (infoWindowProps && infoWindowProps.address) {
        createInfoWindow(infoWindowProps);

        if (getMapInstance) {
          getMapInstance(map, AMap, infoWindow);
        }
      }

      map.panTo(value);
      createMarker(value);
    }
  }, [value, init, infoWindowProps]);
  return /*#__PURE__*/_react["default"].createElement("div", {
    className: (0, _classnames["default"])(className, "".concat(prefixCls, "-wrapper")),
    style: style
  }, /*#__PURE__*/_react["default"].createElement(_rcMap["default"], {
    setComponentInstance: function setComponentInstance(mapInstance, NDMap) {
      return __awaiter(void 0, void 0, void 0, /*#__PURE__*/_regenerator["default"].mark(function _callee() {
        return _regenerator["default"].wrap(function _callee$(_context) {
          while (1) {
            switch (_context.prev = _context.next) {
              case 0:
                _context.next = 2;
                return (0, _jsAsyncLoader["default"])('//webapi.amap.com/ui/1.1/main.js?v=1.1.1');

              case 2:
                _context.next = 4;
                return (0, _jsAsyncLoader["default"])('//webapi.amap.com/ui/1.1/plug/ext/jquery-1.12.4.min.js?v=1.1.1');

              case 4:
                map = mapInstance;
                AMap = NDMap; // 点击事件

                map.on('click', onMapClick);
                createInfoWindow(infoWindowProps);

                if (getMapInstance) {
                  getMapInstance(mapInstance, NDMap, infoWindow);
                }

                setInit(true);

              case 10:
              case "end":
                return _context.stop();
            }
          }
        }, _callee);
      }));
    },
    mapOptions: {
      minZoom: 4,
      maxZoom: 18,
      zoom: 15
    },
    style: {
      height: '100%'
    },
    sdkUrlParams: {
      key: window._AMapKey || _cache.MAP_KEY
    },
    platformType: _rcMap.PlatformType.GAODE
  }));
};

Map.defaultProps = {
  infoWindowProps: {
    title: '',
    address: ''
  },
  prefixCls: 'yz-map',
  className: '',
  style: {}
};
var _default = Map;
exports["default"] = _default;