import { useRouter } from 'vue-router'
import { useStore } from '@/store'
import { uniqBy } from '@/utils/utils'
import { getCurrentFloor, getShopList, getFloorsList, getMapErrorLogToSend } from '@/http/api'

type Map = {
  floorOrder: number
  yaxis: string
  angle: string
}

export const setInitMapAndMallInfo = async function () {
  const res = await Promise.all([getCurrentFloor(), getShopList(), getFloorsList()])
  const [currentFloor, shopList, floorsList] = res
  const store = useStore()
  store.$patch(state => ({
    ...state,
    shopList: shopList.data,
    currentFloor: currentFloor.data,
    floorsList: floorsList.data
  }))
  //初始化地图
  onReady(currentFloor.data as Map, () => {
    const facilityList = window.Map_QM.getAllIcon().flat(Infinity)

    const list = facilityList.map((item: { imgUrl: string }) => {
      item.imgUrl.replace('./', '/')
      return item
    })
    window.Map_QM.addEventListener('shop', onClickShop, false)

    store.SET_FACILITY_LIST(uniqBy(list, 'type'))
    window.Map_QM.renderer.domElement.addEventListener('webglcontextlost', onContextLost)
  })
}

//点击地图店铺box
function onClickShop(event: { data: { shopName: string; xaxis: any; yaxis: any; shopData: Record<string, any> } }) {
  if (event.data) {
    const store = useStore()
    showMapDialog()
    ;(document.getElementById('shopNum') as HTMLElement).innerText = event.data.shopName
    window.Map_QM.addElementLabel(document.getElementById('shopInfo'), event.data.xaxis, event.data.yaxis)
    store.SET_SHOP(event.data.shopData)
  } else {
    hideMapDialog()
    window.Map_QM.cancelSelectShop()
  }
}

//地图弹框消失
function hideMapDialog() {
  ;(document.getElementById('shopInfo') as HTMLElement).style.visibility = 'hidden' //  清除店铺弹窗
}
//显示地图弹框
function showMapDialog() {
  const tipInfo = document.getElementById('shopInfo')
  ;(tipInfo as HTMLElement).style.visibility = 'visible'
}

//地图初始化
function onReady({ floorOrder, yaxis, angle }: Map, callback: () => void) {
  window.Config.getInstance(callback, 0, floorOrder, yaxis, angle) //设备楼栋, 设备楼层, 点位(机器点位直连主干道而不在主干道上), 方向    84   85
}

//监听地图上下文丢失 刷新页面
function onContextLost() {
  const store = useStore()
  const params = {
    appName: '导视',
    ip: store.currentFloor.ip,
    logMsg: '地图上下文丢失'
  }
  getMapErrorLogToSend(params).finally(() => {
    const router = useRouter()
    router.push('/')
    location.reload()
  })
}