import { ref, nextTick } from 'vue' import { Subscriber } from 'cesium-extends' import { parseWKT } from '@/utils/parseWKT' import { cesiumTime2Format } from '@/utils/date' import { difference } from 'lodash' import { getMubiao, getMubiaoPos, sendCheckedTargetIds } from '@/api/Mubiao' import { useTree } from '@/utils/tree' import { useMubiaoPopup } from './mubiaoPopup' import { useEntity } from '@/hooks/entity' // import { useEntity } from '@/stores/entity' // import { storeToRefs } from 'pinia' interface IMubiaoNode { country: string targetName: string targetType: string id: string extendInfo: Record } interface IMubiao { dataId: string data: IMubiaoNode nodeName: string children?: IMubiao[] } const checkedKeys = ref>([]) const data = ref[]>([]) const { mubiaoMap, getMBEntityOpt, createMBConicSensor, mubiaoConicMap, mbPayloadShowMap, } = useEntity() // const { mubiaoMap } = storeToRefs(entity) // const mubiaoMap = ref>(new Map()) let subscriber: Subscriber | null = null const { filterTreeNodeByField, getLeafNode } = useTree() const { popupMap, createPopup } = useMubiaoPopup() export const useMubiao = () => { const addMubiao = async (ids: Array) => { subscriber = new Subscriber(viewer, { pickResult: { enable: true, }, }) postCheckedIds(ids) // console.log(subscriber, 'subscriber') // const ids = data.map(item => item.id) const addIds = difference(ids, [...mubiaoMap.keys()]) const removeIds = difference([...mubiaoMap.keys()], ids) // 删除 if (removeIds.length > 0) { removeIds.forEach(id => { removeMubiao(id) }) } // 添加 if (addIds.length > 0) { const nodes = filterTreeNodeByField({ treeData: data.value, params: addIds, paramName: 'dataId', }) const targetIdList = nodes.map(({ dataId }: IMubiao) => dataId) // 获取目标坐标 const mbPos = await getMubiaoCurPos(targetIdList) // console.log('mbPos', mbPos) nodes.forEach(async ({ data, dataId: id }: IMubiao) => { const { target_time, target_geom } = mbPos.find(item => item.target_id === id) ?? {} const pos = parseWKT(target_geom).coordinates const mbEntity = await addMubiaoEntity({ id, position: pos, target_time, country: data.country, targetType: data.targetType, extendInfo: data.extendInfo, }) // console.log(mbEntity, 'mbEntity') addEventSub(id, mbEntity, data) mubiaoMap.set(id, mbEntity) }) } } async function postCheckedIds(ids: Array) { const res = await sendCheckedTargetIds(ids) } const addMubiaoEntity = async ({ id, position, country, target_time, targetType, extendInfo, }: Record) => { // 添加目标实体 // console.log(window.settings, targetType, '-----') const mbEntityOpt = await getMBEntityOpt({ id, country, targetType, extendInfo, }) const mubiaoEntity = viewer.entities.add({ name: id, position: Cesium.Cartesian3.fromDegrees( ...(position as number[]), targetType === '甲' ? 20000 : 0 ), ...mbEntityOpt, }) if (extendInfo?.detectingPayload?.angle) { const conic = createMBConicSensor({ entity: mubiaoEntity, radius: extendInfo?.detectingPayload?.radius, angle: extendInfo?.detectingPayload?.angle, heading: extendInfo?.detectingPayload?.heading, pitch: extendInfo?.detectingPayload?.pitch, show: mbPayloadShowMap.get(id).detectingPayload.show, }) mubiaoConicMap.set(id, conic) } return mubiaoEntity } const addEventSub = ( id: string | number, entity: Cesium.Entity, mbData: Record ) => { subscriber && subscriber.add( entity, (movement, entity) => { // console.log(movement, 'movement') // console.log(entity, 'entity') createPopup(id, entity, mbData) }, 'LEFT_CLICK' ) // console.log(subscriber, '-------') } const removeMubiao = (id: string | number) => { if (mubiaoMap.has(id)) { subscriber && subscriber.remove(mubiaoMap.get(id), 'LEFT_CLICK') viewer.entities.remove(mubiaoMap.get(id)) mubiaoMap.delete(id) } if (popupMap.has(id)) { popupMap.get(id).windowClose() popupMap.delete(id) } if (mubiaoConicMap.has(id)) { viewer.entities.remove(mubiaoConicMap.get(id)) mubiaoConicMap.delete(id) } } const updateMubiaoPos = async ( mbs: Array> ) => { // const existsIds = [...mubiaoMap.keys()] if (mbs.length === 0) { return } mbs.forEach( ({ target_id: id, target_lon: lon, target_lat: lat, target_direction, }) => { if (mubiaoMap.has(id)) { const entity = mubiaoMap.get(id) const position = Cesium.Cartesian3.fromDegrees(lon, lat) entity.position = position // console.log(target_direction) entity.billboard.rotation = Cesium.Math.toRadians( 360 - target_direction + 90 ) entity.orientation = getOrientation({ position, heading: target_direction as number, }) } } ) } const getOrientation = ({ position, heading, pitch = 0, roll = 0, }: Record) => { //模型朝向 const h = Cesium.Math.toRadians(heading - 90) const p = Cesium.Math.toRadians(pitch) const r = Cesium.Math.toRadians(roll) const hpr = new Cesium.HeadingPitchRoll(h, p, r) const orientation = Cesium.Transforms.headingPitchRollQuaternion( position, hpr ) return orientation } return { data, checkedKeys, getMubiaoData, addMubiao, updateMubiaoPos, } } async function getMubiaoCurPos(ids: Array) { const time = cesiumTime2Format(viewer.clock.currentTime) // 获取当前目标位置 const { code, data } = await getMubiaoPos({ ids, current: time }) if (code === '200') { return data } else { return [] } } async function getMubiaoData() { const checked = JSON.parse(JSON.stringify(checkedKeys.value)) // console.log(checked) const { code, data: resData } = await getMubiao() if (code === '200') { data.value = [resData] checkedKeys.value = [] getAllNodesToPayload() nextTick(() => { checkedKeys.value = checked }) } } function getAllNodesToPayload() { const mbList = getLeafNode(data.value[0]) mbList.forEach(node => { const { dataId, data: nodeData } = node const { extendInfo } = nodeData const detectingShow = mbPayloadShowMap.get(dataId)?.detectingPayload?.show || false if (extendInfo) { mbPayloadShowMap.set(dataId, { data: toRaw(nodeData), detectingPayload: { ...extendInfo, show: detectingShow }, }) } }) console.log('mbPayloadShowMap', mbPayloadShowMap) }