|
|
@ -84,7 +84,7 @@ |
|
|
></AddModelWin> |
|
|
></AddModelWin> |
|
|
<AddRoamVideo v-if="addRoamVideoShow"></AddRoamVideo> |
|
|
<AddRoamVideo v-if="addRoamVideoShow"></AddRoamVideo> |
|
|
<!-- AIS信息显示窗口 --> |
|
|
<!-- AIS信息显示窗口 --> |
|
|
<AISInfoWindow v-if="AISInfoWindowShow"></AISInfoWindow> |
|
|
<AISInfoWindow v-if="AISInfoWindowShow" :ship_guid="ship_guid" :ship_aisData="ship_aisData"></AISInfoWindow> |
|
|
</div> |
|
|
</div> |
|
|
</template> |
|
|
</template> |
|
|
|
|
|
|
|
|
@ -117,15 +117,14 @@ |
|
|
import hidePng from '@/assets/earthMap/hide.png'; |
|
|
import hidePng from '@/assets/earthMap/hide.png'; |
|
|
import alarmImg from '@/assets/earthMap/alarm.gif'; |
|
|
import alarmImg from '@/assets/earthMap/alarm.gif'; |
|
|
import VideoFusionWin from './components/VideoFusionWin.vue'; |
|
|
import VideoFusionWin from './components/VideoFusionWin.vue'; |
|
|
import { useMessage } from "/@/hooks/web/useMessage"; |
|
|
import { useMessage } from '/@/hooks/web/useMessage'; |
|
|
import { CircleScan } from '@/utils/earthMap/radarEntity' |
|
|
import { CircleScan } from '@/utils/earthMap/radarEntity'; |
|
|
import { radianToDegreeInLngLatHeight } from '@/utils/earthMap/earth' |
|
|
import { radianToDegreeInLngLatHeight } from '@/utils/earthMap/earth'; |
|
|
|
|
|
|
|
|
import circleDot2 from '@/assets/earthMap/circleDot2.png'; |
|
|
import circleDot2 from '@/assets/earthMap/circleDot2.png'; |
|
|
import circleDot1 from '@/assets/earthMap/circleDot1.png'; |
|
|
import circleDot1 from '@/assets/earthMap/circleDot1.png'; |
|
|
import circleDot3 from '@/assets/earthMap/circleDot3.png'; |
|
|
import circleDot3 from '@/assets/earthMap/circleDot3.png'; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const { createMessage } = useMessage(); |
|
|
const { createMessage } = useMessage(); |
|
|
function setClassEl(setClassEl1, setClassEl2, checked) { |
|
|
function setClassEl(setClassEl1, setClassEl2, checked) { |
|
|
if (checked) { |
|
|
if (checked) { |
|
|
@ -143,7 +142,6 @@ |
|
|
setClassEl2.className = 'xbsj-checkbox xbsj-checkbox-checked'; |
|
|
setClassEl2.className = 'xbsj-checkbox xbsj-checkbox-checked'; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function setClassNoChecked(setClassEl1, setClassEl2) { |
|
|
function setClassNoChecked(setClassEl1, setClassEl2) { |
|
|
// node.checkStatus = '' |
|
|
// node.checkStatus = '' |
|
|
// node.disabled = 'disabled' |
|
|
// node.disabled = 'disabled' |
|
|
@ -206,72 +204,72 @@ |
|
|
AISInfoWindow, |
|
|
AISInfoWindow, |
|
|
}, |
|
|
}, |
|
|
props: { |
|
|
props: { |
|
|
//全部显示 |
|
|
//全部显示 |
|
|
all: { |
|
|
all: { |
|
|
type: Boolean, |
|
|
type: Boolean, |
|
|
default: false |
|
|
default: false, |
|
|
}, |
|
|
}, |
|
|
//头部显示 |
|
|
//头部显示 |
|
|
earthHeaderShow: { |
|
|
earthHeaderShow: { |
|
|
type: Boolean, |
|
|
type: Boolean, |
|
|
default: false |
|
|
default: false, |
|
|
}, |
|
|
}, |
|
|
//图层显示 |
|
|
//图层显示 |
|
|
sceneTreeShow:{ |
|
|
sceneTreeShow: { |
|
|
type: Boolean, |
|
|
type: Boolean, |
|
|
default: false |
|
|
default: false, |
|
|
}, |
|
|
}, |
|
|
//状态栏 |
|
|
//状态栏 |
|
|
statusBarShow:{ |
|
|
statusBarShow: { |
|
|
type: Boolean, |
|
|
type: Boolean, |
|
|
default: true |
|
|
default: true, |
|
|
}, |
|
|
}, |
|
|
//主工具栏 |
|
|
//主工具栏 |
|
|
mainBar:{ |
|
|
mainBar: { |
|
|
type: Boolean, |
|
|
type: Boolean, |
|
|
default: false |
|
|
default: false, |
|
|
}, |
|
|
}, |
|
|
//监听事件 |
|
|
//监听事件 |
|
|
listenMouseHandlerOpen:{ |
|
|
listenMouseHandlerOpen: { |
|
|
type: Boolean, |
|
|
type: Boolean, |
|
|
default: false |
|
|
default: false, |
|
|
}, |
|
|
}, |
|
|
//监听mitt |
|
|
//监听mitt |
|
|
listenMittHandlerOpen:{ |
|
|
listenMittHandlerOpen: { |
|
|
type: Boolean, |
|
|
type: Boolean, |
|
|
default: false |
|
|
default: false, |
|
|
}, |
|
|
}, |
|
|
//地图路线资源 |
|
|
//地图路线资源 |
|
|
createBBHLineOpen:{ |
|
|
createBBHLineOpen: { |
|
|
type: Boolean, |
|
|
type: Boolean, |
|
|
default: false |
|
|
default: false, |
|
|
}, |
|
|
}, |
|
|
//加载区域 |
|
|
//加载区域 |
|
|
getLineInfoShow:{ |
|
|
getLineInfoShow: { |
|
|
type: Boolean, |
|
|
type: Boolean, |
|
|
default: false |
|
|
default: false, |
|
|
}, |
|
|
}, |
|
|
//加载站点 |
|
|
//加载站点 |
|
|
getCameraInfoShow:{ |
|
|
getCameraInfoShow: { |
|
|
type: Boolean, |
|
|
type: Boolean, |
|
|
default: false |
|
|
default: false, |
|
|
}, |
|
|
}, |
|
|
//加载微波和雷达 |
|
|
//加载微波和雷达 |
|
|
getLabelInfoShow:{ |
|
|
getLabelInfoShow: { |
|
|
type: Boolean, |
|
|
type: Boolean, |
|
|
default: false |
|
|
default: false, |
|
|
}, |
|
|
}, |
|
|
//加载绘图 |
|
|
//加载绘图 |
|
|
drawInitShow:{ |
|
|
drawInitShow: { |
|
|
type: Boolean, |
|
|
type: Boolean, |
|
|
default: false |
|
|
default: false, |
|
|
}, |
|
|
}, |
|
|
//加载重点监控区域 |
|
|
//加载重点监控区域 |
|
|
keyControlInitShow:{ |
|
|
keyControlInitShow: { |
|
|
type: Boolean, |
|
|
type: Boolean, |
|
|
default: false |
|
|
default: false, |
|
|
|
|
|
}, |
|
|
}, |
|
|
}, |
|
|
}, |
|
|
|
|
|
}) |
|
|
}) |
|
|
export default class EarthComp extends Vue { |
|
|
export default class EarthComp extends Vue { |
|
|
/** |
|
|
/** |
|
|
@ -417,20 +415,23 @@ |
|
|
monitorPosition: any = []; |
|
|
monitorPosition: any = []; |
|
|
|
|
|
|
|
|
//处理props 由于从父组件传来props，为作区分其他变量，则采用首字母大写命名 |
|
|
//处理props 由于从父组件传来props，为作区分其他变量，则采用首字母大写命名 |
|
|
PropsEarthHeaderShow = this.earthHeaderShow |
|
|
PropsEarthHeaderShow = this.earthHeaderShow; |
|
|
PropsSceneTreeShow = this.sceneTreeShow |
|
|
PropsSceneTreeShow = this.sceneTreeShow; |
|
|
PropsListenMouseHandlerOpen = this.listenMouseHandlerOpen |
|
|
PropsListenMouseHandlerOpen = this.listenMouseHandlerOpen; |
|
|
PropsListenMittHandlerOpen = this.listenMittHandlerOpen |
|
|
PropsListenMittHandlerOpen = this.listenMittHandlerOpen; |
|
|
PropsCreateBBHLineOpen = this.createBBHLineOpen |
|
|
PropsCreateBBHLineOpen = this.createBBHLineOpen; |
|
|
PropsGetLineInfoShow = this.getLineInfoShow |
|
|
PropsGetLineInfoShow = this.getLineInfoShow; |
|
|
PropsGetCameraInfoShow = this.getCameraInfoShow |
|
|
PropsGetCameraInfoShow = this.getCameraInfoShow; |
|
|
PropsGetLabelInfoShow = this.getLabelInfoShow |
|
|
PropsGetLabelInfoShow = this.getLabelInfoShow; |
|
|
PropsDrawInitShow = this.drawInitShow |
|
|
PropsDrawInitShow = this.drawInitShow; |
|
|
PropsKeyControlInitShow = this.keyControlInitShow |
|
|
PropsKeyControlInitShow = this.keyControlInitShow; |
|
|
/////////////////////////////////////////////////////////////////////////// |
|
|
/////////////////////////////////////////////////////////////////////////// |
|
|
//AIS信息窗口显示 |
|
|
//AIS信息窗口显示 |
|
|
AISInfoWindowShow = false; |
|
|
AISInfoWindowShow = false; |
|
|
|
|
|
// 船只guid |
|
|
ship_guid = '123456'; |
|
|
ship_guid = '123456'; |
|
|
|
|
|
// 船只ais信息 |
|
|
|
|
|
ship_aisData = {}; |
|
|
|
|
|
|
|
|
mounted() { |
|
|
mounted() { |
|
|
let that = this; |
|
|
let that = this; |
|
|
@ -480,7 +481,7 @@ |
|
|
}); |
|
|
}); |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
// 打开视频融合 |
|
|
// 打开视频融合 |
|
|
roamPathSet() { |
|
|
roamPathSet() { |
|
|
// 打开视频融合 |
|
|
// 打开视频融合 |
|
|
@ -552,19 +553,19 @@ |
|
|
let that = this; |
|
|
let that = this; |
|
|
//使用store存储XbsjEarthUI |
|
|
//使用store存储XbsjEarthUI |
|
|
this.store.xbsjEarthUI = XbsjEarthUI; |
|
|
this.store.xbsjEarthUI = XbsjEarthUI; |
|
|
//处理props |
|
|
//处理props |
|
|
if(this.all){ |
|
|
if (this.all) { |
|
|
this.PropsEarthHeaderShow = true |
|
|
this.PropsEarthHeaderShow = true; |
|
|
this.PropsSceneTreeShow = true |
|
|
this.PropsSceneTreeShow = true; |
|
|
this.PropsListenMouseHandlerOpen = true |
|
|
this.PropsListenMouseHandlerOpen = true; |
|
|
this.PropsListenMittHandlerOpen = true |
|
|
this.PropsListenMittHandlerOpen = true; |
|
|
this.PropsCreateBBHLineOpen = true |
|
|
this.PropsCreateBBHLineOpen = true; |
|
|
this.PropsGetLineInfoShow = true |
|
|
this.PropsGetLineInfoShow = true; |
|
|
this.PropsGetCameraInfoShow = true |
|
|
this.PropsGetCameraInfoShow = true; |
|
|
this.PropsGetLabelInfoShow = true |
|
|
this.PropsGetLabelInfoShow = true; |
|
|
this.PropsDrawInitShow = true |
|
|
this.PropsDrawInitShow = true; |
|
|
this.PropsKeyControlInitShow = true |
|
|
this.PropsKeyControlInitShow = true; |
|
|
} |
|
|
} |
|
|
XbsjEarthUI.create('earthContainer').then(async (earthUI: any) => { |
|
|
XbsjEarthUI.create('earthContainer').then(async (earthUI: any) => { |
|
|
// 设置全局变量，可调试 |
|
|
// 设置全局变量，可调试 |
|
|
window.$uia = earthUI; |
|
|
window.$uia = earthUI; |
|
|
@ -670,23 +671,20 @@ |
|
|
this.cameraPositionChange(this); |
|
|
this.cameraPositionChange(this); |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
//加载地图实时资源（无人机、车辆、人员、巡逻路线等） |
|
|
//加载地图实时资源（无人机、车辆、人员、巡逻路线等） |
|
|
// this.createRealTimeObj(earthUI) |
|
|
// this.createRealTimeObj(earthUI) |
|
|
|
|
|
|
|
|
//监听鼠标事件 |
|
|
//监听鼠标事件 |
|
|
if (this.PropsListenMouseHandlerOpen) |
|
|
if (this.PropsListenMouseHandlerOpen) this.listenMouseHandler(earthUI); |
|
|
this.listenMouseHandler(earthUI); |
|
|
|
|
|
|
|
|
|
|
|
//监听mitt |
|
|
//监听mitt |
|
|
if (this.PropsListenMittHandlerOpen) |
|
|
if (this.PropsListenMittHandlerOpen) this.listenMittHandler(earthUI); |
|
|
this.listenMittHandler(earthUI); |
|
|
|
|
|
|
|
|
|
|
|
// 飞入方法 |
|
|
// 飞入方法 |
|
|
await this.fly(); |
|
|
await this.fly(); |
|
|
|
|
|
|
|
|
//加载地图线路资源 |
|
|
//加载地图线路资源 |
|
|
if (this.PropsCreateBBHLineOpen) |
|
|
if (this.PropsCreateBBHLineOpen) await this.createBBHLine(earthUI); |
|
|
await this.createBBHLine(earthUI); |
|
|
|
|
|
|
|
|
|
|
|
//创建工具栏 |
|
|
//创建工具栏 |
|
|
this.toolbarShow = true; |
|
|
this.toolbarShow = true; |
|
|
@ -794,7 +792,7 @@ |
|
|
/* 使用async/await 处理异步方法顺序执行。成功的操作放到try里，失败的放在catch里 */ |
|
|
/* 使用async/await 处理异步方法顺序执行。成功的操作放到try里，失败的放在catch里 */ |
|
|
async createBBHLine(earthUI = null) { |
|
|
async createBBHLine(earthUI = null) { |
|
|
console.log('MyScene', this.userStore.userInfo?.sceneId); |
|
|
console.log('MyScene', this.userStore.userInfo?.sceneId); |
|
|
let labelItems: any = undefined |
|
|
let labelItems: any = undefined; |
|
|
let type = 1; //** |
|
|
let type = 1; //** |
|
|
|
|
|
|
|
|
let models: any = { |
|
|
let models: any = { |
|
|
@ -819,26 +817,21 @@ |
|
|
|
|
|
|
|
|
// 加载区域 |
|
|
// 加载区域 |
|
|
// console.log("加载区域"); |
|
|
// console.log("加载区域"); |
|
|
if (this.PropsGetLineInfoShow) |
|
|
if (this.PropsGetLineInfoShow) await this.getLineInfo(models, type); |
|
|
await this.getLineInfo(models, type); |
|
|
|
|
|
|
|
|
|
|
|
// 加载站点 |
|
|
// 加载站点 |
|
|
// console.log("加载站点"); |
|
|
// console.log("加载站点"); |
|
|
if (this.PropsGetCameraInfoShow) |
|
|
if (this.PropsGetCameraInfoShow) await this.getCameraInfo(models, type); |
|
|
await this.getCameraInfo(models, type); |
|
|
|
|
|
|
|
|
|
|
|
// 加载雷达和微波 |
|
|
// 加载雷达和微波 |
|
|
// console.log("加载雷达和微波"); |
|
|
// console.log("加载雷达和微波"); |
|
|
if (this.PropsGetLabelInfoShow) |
|
|
if (this.PropsGetLabelInfoShow) labelItems = await this.getLabelInfo(models, type); |
|
|
labelItems = await this.getLabelInfo(models, type); |
|
|
|
|
|
|
|
|
|
|
|
//加载绘画资源 |
|
|
//加载绘画资源 |
|
|
if (this.PropsDrawInitShow) |
|
|
if (this.PropsDrawInitShow) await drawInit(); |
|
|
await drawInit(); |
|
|
|
|
|
|
|
|
|
|
|
//加载重点监控区域 |
|
|
//加载重点监控区域 |
|
|
if (this.PropsKeyControlInitShow) |
|
|
if (this.PropsKeyControlInitShow) await keyControlInit(); |
|
|
await keyControlInit(); |
|
|
|
|
|
|
|
|
|
|
|
// 监听树的dom节点变化 |
|
|
// 监听树的dom节点变化 |
|
|
// console.log("监听树的dom节点变化"); |
|
|
// console.log("监听树的dom节点变化"); |
|
|
@ -3258,7 +3251,7 @@ |
|
|
createMessage.success('克隆成功'); |
|
|
createMessage.success('克隆成功'); |
|
|
} else { |
|
|
} else { |
|
|
newSn.parent.children.splice(index, 1); |
|
|
newSn.parent.children.splice(index, 1); |
|
|
createMessage.error('克隆成功:'+ res.message); |
|
|
createMessage.error('克隆成功:' + res.message); |
|
|
} |
|
|
} |
|
|
}); |
|
|
}); |
|
|
}) |
|
|
}) |
|
|
@ -3309,7 +3302,7 @@ |
|
|
createMessage.success('克隆成功'); |
|
|
createMessage.success('克隆成功'); |
|
|
} else { |
|
|
} else { |
|
|
newSn.parent.children.splice(index, 1); |
|
|
newSn.parent.children.splice(index, 1); |
|
|
createMessage.error('克隆失败'+ res.message); |
|
|
createMessage.error('克隆失败' + res.message); |
|
|
} |
|
|
} |
|
|
}) |
|
|
}) |
|
|
.catch((err) => { |
|
|
.catch((err) => { |
|
|
@ -4209,8 +4202,8 @@ |
|
|
// 资源销毁 |
|
|
// 资源销毁 |
|
|
beforeDestroy() { |
|
|
beforeDestroy() { |
|
|
// vue程序销毁时，需要清理相关资源 |
|
|
// vue程序销毁时，需要清理相关资源 |
|
|
console.log("vue程序销毁"); |
|
|
console.log('vue程序销毁'); |
|
|
|
|
|
|
|
|
this._earth = this._earth && this._earth.destroy(); |
|
|
this._earth = this._earth && this._earth.destroy(); |
|
|
this.websocketclose(); |
|
|
this.websocketclose(); |
|
|
//清除定时器 |
|
|
//清除定时器 |
|
|
@ -4219,11 +4212,10 @@ |
|
|
clearInterval(this.alarmTrackClearTimer); |
|
|
clearInterval(this.alarmTrackClearTimer); |
|
|
} |
|
|
} |
|
|
// 资源销毁 |
|
|
// 资源销毁 |
|
|
destroy(){ |
|
|
destroy() { |
|
|
// vue程序销毁时，需要清理相关资源 |
|
|
// vue程序销毁时，需要清理相关资源 |
|
|
console.log("vue程序销毁",this._earth); |
|
|
console.log('vue程序销毁', this._earth); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// this.websocketclose(); |
|
|
// this.websocketclose(); |
|
|
//清除定时器 |
|
|
//清除定时器 |
|
|
clearInterval(this.timer); |
|
|
clearInterval(this.timer); |
|
|
@ -4231,8 +4223,8 @@ |
|
|
clearInterval(this.alarmTrackClearTimer); |
|
|
clearInterval(this.alarmTrackClearTimer); |
|
|
// window.$uia.tools.sceneTree.destroy() |
|
|
// window.$uia.tools.sceneTree.destroy() |
|
|
// this._earth = this._earth && this._earth.destroy(); |
|
|
// this._earth = this._earth && this._earth.destroy(); |
|
|
//利用store.xbsjEarthUI 重新赋值 window.XbsjEarthUI |
|
|
//利用store.xbsjEarthUI 重新赋值 window.XbsjEarthUI |
|
|
window.XbsjEarthUI = this.store.xbsjEarthUI |
|
|
window.XbsjEarthUI = this.store.xbsjEarthUI; |
|
|
this._earth = undefined; |
|
|
this._earth = undefined; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
