useBaiduMapSDK.ts 2.29 KB
import { onMounted, onUnmounted, ref } from 'vue';
import { useInjectScript } from '/@/hooks/web/useInjectScript';
import { BAI_DU_MAP_GL_LIB, BAI_DU_MAP_TRACK_ANIMATION } from '/@/utils/fnUtils';

export enum LoadStatusEnum {
  LOADING = 'LOADING',
  SUCCESS = 'SUCCESS',
  ERROR = 'ERROR',
}

export const useBaiduMapSDK = (completeCallback: Fn) => {
  const loadGLKey = 'loadBaiMapGL';
  const loadGLLibKey = 'loadBaiMapGLLib';
  const BaiduMapGLGlobalName = 'BMapGL';
  const BaiduMapGLLibGlobalName = 'BMapGLLib';
  const hasBMapGLFlag = Reflect.has(window, BaiduMapGLGlobalName);
  const hasBMapGLLibFlag = Reflect.has(window, BaiduMapGLLibGlobalName);
  const BMapGLRepeatLoadFlag = hasBMapGLFlag || Reflect.has(window, loadGLKey);
  const BMapGLLibRepeatLoadFlag = hasBMapGLLibFlag || Reflect.has(window, loadGLLibKey);

  if (!BMapGLRepeatLoadFlag) {
    Reflect.set(window, loadGLKey, true);
    const { toInject } = useInjectScript({ src: BAI_DU_MAP_GL_LIB });
    toInject();
  }

  if (!BMapGLLibRepeatLoadFlag) {
    Reflect.set(window, loadGLLibKey, true);
    const { toInject } = useInjectScript({ src: BAI_DU_MAP_TRACK_ANIMATION });
    toInject();
  }

  const waitFn = async () => {
    return new Promise((resolve) => {
      let interval: Nullable<NodeJS.Timer> = setInterval(() => {
        const hasBMapGLFlag = Reflect.has(window, BaiduMapGLGlobalName);
        const hasBMapGLLibFlag = Reflect.has(window, BaiduMapGLLibGlobalName);
        if (hasBMapGLFlag && hasBMapGLLibFlag) {
          resolve('success');
          status.value = LoadStatusEnum.SUCCESS;
          loading.value = false;
          clearInterval(interval!);
          interval = null;
          clearTimeout(timeout!);
          timeout = null;
        }
      }, 300);

      let timeout: Nullable<NodeJS.Timeout> = setTimeout(() => {
        status.value = LoadStatusEnum.ERROR;
        clearTimeout(timeout!);
        timeout = null;
        resolve('error');
      }, 10000);
    });
  };

  const loading = ref(true);

  const status = ref(LoadStatusEnum.LOADING);

  onMounted(async () => {
    await waitFn();
    completeCallback?.();
    loading.value = false;
  });

  onUnmounted(() => {
    Reflect.deleteProperty(window, loadGLKey);
    Reflect.deleteProperty(window, loadGLLibKey);
  });

  return {
    loading,
    status,
  };
};