import React from 'react';
import _ from 'lodash';
import { connect } from 'react-redux';
import AMapLoader from '@amap/amap-jsapi-loader';
import { store } from '@wisdom-utils/utils';
import { actionCreators } from '@/containers/App/store';
import MapComponent from '@/components/MapView';
class CreateMap extends React.Component {
  constructor(props) {
    super(props);
    this.mapManganerRef = React.createRef();
    [
      '_AMap_vectorlayer',
      '_AMap_AMap.MouseTool',
      '_AMap_AMap.DistrictSearch',
      '_AMap_AMap.Autocomplete',
      '_AMap_sync',
      '_AMap_AMap.PlaceSearch',
      '_AMap_wgl',
      '_AMap_overlay',
      '_AMap_mouse',
    ].forEach(item => {
      localStorage.removeItem(item);
    });
    AMapLoader.reset();
  }

  getView = view => {
    store.set('view', view);
    this.props.updageMapView(view);
  };

  render() {
    if (_.isNull(this.props.global.mapsettings.areasettings)) {
      return null;
    }

    const props = {
      loading: true,
      config: this.props.global.mapsettings,
      widgets: this.props.global.uiwidgets,
    };

    return (
      <>
        <MapComponent {...props} getMapInfo={this.getView} />
      </>
    );
  }
}

const mapStateToProps = state => ({
  global: state.getIn(['global', 'globalConfig']),
});

const mapDispatchToProps = dispatch => ({
  updageMapView(mapView) {
    dispatch(actionCreators.updageMapView(mapView));
  },
});

export default connect(
  mapStateToProps,
  mapDispatchToProps,
)(CreateMap);