import { useRootStore } from '@/store/root'
import { storeToRefs } from 'pinia'
import { getMapData } from '@/http/api/base'
import Message from '@/base/Message/Message'
import { PREFIX } from '@/enums'

export const useInitMap = async function () {
  const store = useRootStore()
  const { device, facilityList, shopList, artPlaceList } = storeToRefs(store)
  try {
    const { data } = await getMapData()
    const delPrefixOfFacilityList = facilityList.value.map(item => ({
      ...item,
      filePath: item.filePath?.replace(PREFIX.STATIC_URL, '')
    }))

    //初始化地图
    window.MainMap_QM.init(
      () => {
        store.SET_MAP_STATUS(true)
        window.Map_QM.addEventListener('shop', onClickShop, false)
        window.Map_QM.renderer.domElement.addEventListener('webglcontextlost', onContextLost)
        const arr: string[] = []
        window.Map_QM.util.allMap[0].buildArr.forEach((item: any) => {
          item.mapData.parkArea.forEach((park: any) => {
            arr.push(park.parkNum)
          })
        })
        store.SET_MAP_PARK_LIST(arr)
      },
      {
        build: device.value?.buildingOrder ?? 0,
        floor: 6,
        navPoint: device.value.location,
        angle: device.value.angle,
        iconUrl: delPrefixOfFacilityList,
        artUrl: artPlaceList,
        mapData: data,
        shopData: shopList.value.slice()
      }
    )
  } catch (error) {
    console.log(error)
    Message({ text: '获取地图数据失败', type: 'success' })
  }
}

//点击地图店铺box
function onClickShop(event: any) {
  const store = useRootStore()

  if (event.data) {
    showMapDialog()
    !window.shopInfo && document.getElementById('shopInfo')
    window.Map_QM.addElementLabel(window.shopInfo, event.data.xaxis, event.data.yaxis)
    store.SET_SHOP(event.data.shopData)
  }
  // else {
  //   hideMapDialog()
  // }
}

//地图弹框消失
export function hideMapDialog() {
  window.shopInfo.style.visibility = 'hidden'
  const art: any = document.getElementById('artInfo')
  const artWork: any = document.getElementById('artWorkInfo')
  art.style.visibility = 'hidden'
  artWork.style.visibility = 'hidden'
}

//显示地图弹框
function showMapDialog() {
  window.shopInfo.style.visibility = 'visible'
}

//监听地图上下文丢失 刷新页面
function onContextLost() {
  window.location.href = '/'
}