// ============================================================
// 高德地图 Composable — 封装地图加载与实例管理
// ============================================================

import { ref, shallowRef, onUnmounted } from 'vue'
import AMapLoader from '@amap/amap-jsapi-loader'
import { AMAP_JSAPI_KEY, AMAP_SECURITY_CODE, AMAP_VERSION, AMAP_PLUGINS } from '@/config/amap'

/** 全局加载状态：避免重复加载 JSAPI 脚本 */
let amapPromise: Promise<typeof AMap> | null = null

/** 高德地图 JSAPI 全局对象缓存 */
let AMapGlobal: typeof AMap | null = null

/**
 * 加载高德地图 JSAPI（单例模式，全局只加载一次）
 * 返回 AMap 全局对象
 */
export async function loadAMap(): Promise<typeof AMap> {
  if (AMapGlobal) return AMapGlobal

  if (!amapPromise) {
    // ⚠️ 安全密钥必须在 JSAPI 脚本加载之前设置
    // 2021/12/02 之后申请的 Key 必须配合 securityJsCode 使用
    // 否则 Driving / Geocoder 等服务会报 INVALID_USER_SCODE
    if (AMAP_SECURITY_CODE && !(window as any)._AMapSecurityConfig) {
      ;(window as any)._AMapSecurityConfig = {
        securityJsCode: AMAP_SECURITY_CODE,
      }
    }

    amapPromise = AMapLoader.load({
      key: AMAP_JSAPI_KEY,
      version: AMAP_VERSION,
      plugins: [...AMAP_PLUGINS],
    })
      .then((amap) => {
        AMapGlobal = amap
        return amap
      })
      .catch((err) => {
        amapPromise = null // 失败后允许重试
        throw new Error(`高德地图 JSAPI 加载失败: ${err.message}`)
      })
  }

  return amapPromise
}

/**
 * 地图 Composable — 管理地图实例的生命周期
 *
 * @example
 * ```vue
 * <template>
 *   <div ref="containerRef" style="width: 100%; height: 400px" />
 * </template>
 *
 * <script setup lang="ts">
 * import { useAmap } from '@/composables/useAmap'
 * const { containerRef, loading, error } = useAmap({
 *   center: [116.397428, 39.90923],
 *   zoom: 11
 * })
 * </script>
 * ```
 */
export function useAmap(options: AMap.MapOptions = {}) {
  const containerRef = ref<HTMLDivElement | null>(null)
  const mapInstance = shallowRef<AMap.Map | null>(null)
  const loading = ref(false)
  const error = ref<string | null>(null)

  /** 初始化地图 */
  async function initMap(): Promise<AMap.Map | null> {
    if (!containerRef.value) {
      error.value = '地图容器不存在'
      return null
    }

    loading.value = true
    error.value = null

    try {
      const AMap = await loadAMap()

      if (mapInstance.value) {
        mapInstance.value.destroy()
      }

      const defaultOptions: AMap.MapOptions = {
        center: [116.397428, 39.90923], // 默认：北京天安门
        zoom: 11,
        viewMode: '3D', // 3D 模式
        resizeEnable: true,
      }

      mapInstance.value = new AMap.Map(containerRef.value, {
        ...defaultOptions,
        ...options,
      })

      // 添加缩放工具条（右上角）
      mapInstance.value.addControl(new AMap.ToolBar({
        position: 'RT',
      }))

      return mapInstance.value
    } catch (err: any) {
      error.value = err.message || '地图初始化失败'
      return null
    } finally {
      loading.value = false
    }
  }

  /** 销毁地图实例 */
  function destroyMap(): void {
    if (mapInstance.value) {
      mapInstance.value.destroy()
      mapInstance.value = null
    }
  }

  // 组件卸载时自动销毁地图
  onUnmounted(() => {
    destroyMap()
  })

  return {
    containerRef, // 模板绑定到地图容器 div
    mapInstance, // 地图实例
    loading, // 加载状态
    error, // 错误信息
    initMap, // 初始化方法
    destroyMap, // 销毁方法
  }
}
