feat: 1.BaseControl 升级

.eslintrc

@@ -10,10 +10,10 @@
     "browser": true,
     "node": true
   },
-  "parser": "babel-eslint",
-  "parserOptions": {
-    "sourceType": "module"
-  },
+//  "parser": "babel-eslint",
+//  "parserOptions": {
+//    "sourceType": "module"
+//  },
   "plugins": [
     "html"
   ],

packages/component/src/control/BaseControl.ts

@@ -11,14 +11,13 @@ import {
 import { DOM } from '@antv/l7-utils';
 import { EventEmitter } from 'eventemitter3';
 import { Container } from 'inversify';
-import { ControlEvent } from '../interface';
+import { pick } from 'lodash';
 
 export { PositionType } from '@antv/l7-core';
 
 export default abstract class Control<
-  O extends IControlOption = IControlOption,
-  E extends string = ControlEvent
-> extends EventEmitter<E> {
+  O extends IControlOption = IControlOption
+> extends EventEmitter {
   /**
    * 当前类型控件实例个数
    * @protected
@@ -63,32 +62,27 @@ export default abstract class Control<
 
   /**
    * 更新配置的方法，子类如果有自己的配置，也需要重写该方法
-   * @param newOption
+   * @param newOptions
    */
-  public setOption(newOption: Partial<O>): void {
-    const {
-      position: newPosition,
-      className: newClassName,
-      style: newStyle,
-    } = newOption;
+  public setOptions(newOptions: Partial<O>): void {
     const {
       position: oldPosition,
       className: oldClassName,
       style: oldStyle,
     } = this.controlOption;
 
-    if (newPosition && newPosition !== oldPosition) {
-      this.setPosition(newPosition);
+    if ('position' in newOptions && newOptions.position !== oldPosition) {
+      this.setPosition(newOptions.position);
     }
     if (
-      (newClassName && newClassName !== oldClassName) ||
-      (newStyle && newStyle !== oldStyle)
+      ('className' in newOptions && newOptions.className !== oldClassName) ||
+      ('style' in newOptions && newOptions.style !== oldStyle)
     ) {
-      this.setContainerCSS({ className: newClassName, style: newStyle });
+      this.setContainerCSS(pick(newOptions, 'className', 'style'));
     }
     this.controlOption = {
       ...this.controlOption,
-      ...newOption,
+      ...newOptions,
     };
   }
 
@@ -141,6 +135,7 @@ export default abstract class Control<
     const container = this.container;
     DOM.removeClass(container, 'l7-control-hide');
     this.isShow = true;
+    this.emit('show', this);
   }
 
   /**
@@ -163,6 +158,20 @@ export default abstract class Control<
     } as O;
   }
 
+  /**
+   * 获取当前控件对应的 DOM 容器
+   */
+  public getContainer() {
+    return this.container;
+  }
+
+  /**
+   * 获取当前 Control 是否展示
+   */
+  public getIsShow() {
+    return this.isShow;
+  }
+
   public _refocusOnMap(e: MouseEvent) {
     // if map exists and event is not a keyboard event
     if (this.mapsService && e && e.screenX > 0 && e.screenY > 0) {
@@ -200,12 +209,14 @@ export default abstract class Control<
     option: Pick<IControlOption, 'className' | 'style'>,
   ) {
     const { className, style } = option;
-    if (className) {
+    if ('className' in option) {
       const { className: oldClassName } = this.controlOption;
       if (oldClassName) {
         DOM.removeClass(this.container, oldClassName);
       }
-      DOM.addClass(this.container, className);
+      if (className) {
+        DOM.addClass(this.container, className);
+      }
     }
     if (style) {
       DOM.addStyle(this.container, style);

packages/component/src/control/layer.ts

@@ -1,19 +1,13 @@
 import { IControlOption, PositionType } from '@antv/l7-core';
 import { bindAll, DOM } from '@antv/l7-utils';
-import { ControlEvent, ILayerControlOption } from '../interface';
+import { ILayerControlOption } from '../interface';
 import Control from './BaseControl';
 
 interface IInputItem extends HTMLInputElement {
   layerId: string;
 }
 
-export type LayerControlEvent =
-  | ControlEvent
-  | 'overlayadd'
-  | 'overlayremove'
-  | 'baselayerchange';
-
-export default class Layers extends Control<IControlOption, LayerControlEvent> {
+export default class Layers extends Control<IControlOption> {
   private layerControlInputs: any[];
   private layers: any[];
   private lastZIndex: number;

packages/component/src/interface.ts

@@ -1,7 +1,5 @@
 import { IControlOption } from '@antv/l7-core';
 
-export type ControlEvent = 'show' | 'hide' | 'add' | 'remove';
-
 export interface ILayerControlOption extends IControlOption {
   collapsed: boolean;
   autoZIndex: boolean;

packages/core/src/services/component/IControlService.ts

@@ -36,7 +36,7 @@ export interface IControlCorners {
 }
 export interface IControl {
   controlOption: IControlOption;
-  setOption: (newOption: Partial<IControlOption>) => void;
+  setOptions: (newOption: Partial<IControlOption>) => void;
   addTo(sceneContainer: Container): void;
   onAdd(): HTMLElement;
   onRemove(): void;