style:清空无效代码
吴延福
parent
6e136a2404
commit
3d77e7584f
|
|
@ -19,27 +19,6 @@ enum COLOR{
|
|||
RED="#FF5959"
|
||||
}
|
||||
export default [ {
|
||||
name:"在管企业",
|
||||
ids:[] as string[],
|
||||
type:"areaMarker",
|
||||
value:"company",
|
||||
colors:["#0a5fff","#5e93fd"],
|
||||
selected:false,
|
||||
pages:["parkFile","companyFile","closePark","smartSafetySupervision","smartEnvironment","smartEnergy","gasConsumption","electricityConsumption","waterConsumption","steamConsumption"]
|
||||
},{
|
||||
name:"视频监控",
|
||||
ids:[] as string[],
|
||||
type:"marker",
|
||||
urls:[
|
||||
"@path:camera_0.png",
|
||||
"@path:camera_1.png",
|
||||
"@path:camera_2.png",
|
||||
"@path:camera_3.png",
|
||||
],
|
||||
value:"video" ,
|
||||
selected:false,
|
||||
pages:["parkFile","smartEmergency","closePark","peopleCar","dangrousCar","boundsManager","smartSafetySupervision"]
|
||||
},{
|
||||
name:"电子围栏",
|
||||
ids:[] as string[],
|
||||
type:"area",
|
||||
|
|
@ -47,14 +26,7 @@ export default [{
|
|||
color:COLOR.BOUNDS,
|
||||
selected:false,
|
||||
pages:["closePark","peopleCar"]
|
||||
},{
|
||||
name:"人员热力图",
|
||||
ids:[] as string[],
|
||||
type:"heatmap",
|
||||
value:"heatmap",
|
||||
selected:false,
|
||||
pages:[]
|
||||
},{
|
||||
}{
|
||||
name:"人员定位",
|
||||
ids:[] as string[],
|
||||
type:"moveMarker",
|
||||
|
|
@ -65,15 +37,7 @@ export default [{
|
|||
coordinateType:1,
|
||||
selected:false,
|
||||
pages:["closePark","peopleCar","smartSafetySupervision","smartEmergency"]
|
||||
},{
|
||||
name:"人员热力图",
|
||||
ids:[] as string[],
|
||||
type:"heatmap",
|
||||
value:"heatmap",
|
||||
coordinateType:1,
|
||||
selected:false,
|
||||
pages:["smartEmergency"]
|
||||
},{
|
||||
}{
|
||||
name:"车辆定位",
|
||||
ids:[] as string[],
|
||||
type:"moveMarker",
|
||||
|
|
@ -88,274 +52,4 @@ export default [{
|
|||
coordinateType:1,
|
||||
selected:false,
|
||||
pages:["closePark","peopleCar","smartSafetySupervision","smartEmergency"]
|
||||
},{
|
||||
name:"重载车辆",
|
||||
ids:[] as string[],
|
||||
type:"model",
|
||||
pakFilePath: "@path:DTS_Library_V5.4.pak",
|
||||
assetPath:"/JC_CustomAssets/VehicleLibrary/Exhibition/重型货车_01",
|
||||
value:"heavy-car",
|
||||
scale:[3,3,3],
|
||||
selected:false,
|
||||
pages:["closePark","dangrousCar"]
|
||||
},{
|
||||
name:"空载车辆",
|
||||
ids:[] as string[],
|
||||
type:"model",
|
||||
pakFilePath: "@path:DTS_Library_V5.4.pak",
|
||||
assetPath:"/JC_CustomAssets/ObjectLibrary/Exhibition/交通工具/车辆/工程车_2",
|
||||
value:"empty-car",
|
||||
scale:[3,3,3],
|
||||
selected:false,
|
||||
pages:["closePark","dangrousCar"]
|
||||
},{
|
||||
name:"疏散路线",
|
||||
ids:[] as string[],
|
||||
type:"line",
|
||||
color:COLOR.GREEN,
|
||||
value:"safe-route",
|
||||
selected:false,
|
||||
pages:["dangrousCar"]
|
||||
},
|
||||
// {
|
||||
// name:"气体监测",
|
||||
// ids:[] as string[],
|
||||
// type:"",
|
||||
// value:"gas-monitor",
|
||||
// selected:false,
|
||||
// pages:["dangrousCar"]
|
||||
// },
|
||||
{
|
||||
name:"重大危险源",
|
||||
ids:[] as string[],
|
||||
type:"areaMarker",
|
||||
value:"dangrous",
|
||||
color:"#FFF",
|
||||
colors:[],
|
||||
selected:false,
|
||||
pages:["parkFile","smartSafetySupervision","smartEmergency"]
|
||||
},{
|
||||
name:"风险四色图",
|
||||
ids:[] as string[],
|
||||
type:"areaMarker",
|
||||
value:"four-color",
|
||||
colors:[COLOR.RED,COLOR.YELLOW,COLOR.BLUE,COLOR.GREEN],
|
||||
selected:false,
|
||||
pages:["parkFile","smartSafetySupervision","risk"]
|
||||
},{
|
||||
name:"风险四色图",
|
||||
ids:[] as string[],
|
||||
type:"areaMarker",
|
||||
value:"four-color2",
|
||||
colors:[COLOR.RED,COLOR.YELLOW,COLOR.BLUE,COLOR.GREEN],
|
||||
selected:false,
|
||||
pages:["dangrousCar"]
|
||||
},{
|
||||
name:"应急设施",
|
||||
ids:[] as string[],
|
||||
type:"model",
|
||||
pakFilePath: "@path:DTS_Library_V5.4.pak",
|
||||
assetPath:"/JC_CustomAssets/EffectLibrary/Exhibition/3DUI/3D_UI_D_2",
|
||||
value:"safe-building",
|
||||
scale:[3,3,3],
|
||||
selected:false,
|
||||
pages:["parkFile","smartEmergency","goods"]
|
||||
},{
|
||||
name:"物资仓库",
|
||||
ids:[] as string[],
|
||||
type:"model",
|
||||
pakFilePath: "@path:DTS_Library_V5.4.pak",
|
||||
assetPath:"/JC_CustomAssets/EffectLibrary/Exhibition/3DUI/3D_UI_C_5",
|
||||
value:"safe-goods",
|
||||
scale:[3,3,3],
|
||||
selected:false,
|
||||
pages:["parkFile","smartEmergency","goods"]
|
||||
},{
|
||||
name:"实控线",
|
||||
ids:[] as string[],
|
||||
type:"area",
|
||||
value:"real-line",
|
||||
color:COLOR.REALLINE,
|
||||
selected:false,
|
||||
pages:["parkFile","boundsManager"]
|
||||
},{
|
||||
name:"安全线",
|
||||
ids:[] as string[],
|
||||
type:"area",
|
||||
value:"safe-line",
|
||||
color:COLOR.SAFELINE,
|
||||
selected:false,
|
||||
pages:["parkFile","boundsManager"]
|
||||
},{
|
||||
name:"规划线",
|
||||
ids:[] as string[],
|
||||
type:"area",
|
||||
value:"plan-line",
|
||||
color:COLOR.PLANLINE,
|
||||
selected:false,
|
||||
pages:["parkFile","boundsManager"]
|
||||
},{
|
||||
name:"卡口设施",
|
||||
ids:[] as string[],
|
||||
type:"model",
|
||||
pakFilePath: "@path:DTS_Library_V5.4.pak",
|
||||
assetPath:"/JC_CustomAssets/EffectLibrary/Exhibition/3DUI/3D_UI_D_2",
|
||||
value:"check-point",
|
||||
scale:[3,3,3],
|
||||
selected:false,
|
||||
pages:["boundsManager"]
|
||||
},{
|
||||
name:"动火",
|
||||
ids:[] as string[],
|
||||
type:"model",
|
||||
pakFilePath: "@path:DTS_Library_V5.4.pak",
|
||||
assetPath:"/JC_CustomAssets/EffectLibrary/Exhibition/3DUI/3D_UI_A_1",
|
||||
value:"use-fire",
|
||||
scale:[3,3,3],
|
||||
selected:false,
|
||||
pages:["dangerousWork"]
|
||||
},{
|
||||
name:"断路",
|
||||
ids:[] as string[],
|
||||
type:"areaMarker",
|
||||
value:"break-road",
|
||||
selected:false,
|
||||
color:"#000",
|
||||
pages:["dangerousWork"]
|
||||
},{
|
||||
name:"高空",
|
||||
ids:[] as string[],
|
||||
type:"model",
|
||||
pakFilePath: "@path:DTS_Library_V5.4.pak",
|
||||
assetPath:"/JC_CustomAssets/EffectLibrary/Exhibition/3DUI/3D_UI_A_1",
|
||||
value:"high-sky",
|
||||
scale:[3,3,3],
|
||||
selected:false,
|
||||
pages:["dangerousWork"]
|
||||
},{
|
||||
name:"吊装",
|
||||
ids:[] as string[],
|
||||
type:"model",
|
||||
pakFilePath: "@path:DTS_Library_V5.4.pak",
|
||||
assetPath:"/JC_CustomAssets/EffectLibrary/Exhibition/3DUI/3D_UI_A_1",
|
||||
value:"hoisting",
|
||||
scale:[3,3,3],
|
||||
selected:false,
|
||||
pages:["dangerousWork"]
|
||||
},{
|
||||
name:"动土",
|
||||
ids:[] as string[],
|
||||
type:"areaMarker",
|
||||
value:"make-ground",
|
||||
selected:false,
|
||||
color:"#efaf00",
|
||||
pages:["dangerousWork"]
|
||||
},{
|
||||
name:"临时用电",
|
||||
ids:[] as string[],
|
||||
type:"model",
|
||||
pakFilePath: "@path:DTS_Library_V5.4.pak",
|
||||
assetPath:"/JC_CustomAssets/EffectLibrary/Exhibition/3DUI/3D_UI_A_1",
|
||||
value:"use-e",
|
||||
scale:[3,3,3],
|
||||
selected:false,
|
||||
pages:["dangerousWork"]
|
||||
},{
|
||||
name:"受限空间",
|
||||
ids:[] as string[],
|
||||
type:"model",
|
||||
pakFilePath: "@path:DTS_Library_V5.4.pak",
|
||||
assetPath:"/JC_CustomAssets/EffectLibrary/Exhibition/3DUI/3D_UI_A_1",
|
||||
value:"forbid-space",
|
||||
scale:[3,3,3],
|
||||
selected:false,
|
||||
pages:["dangerousWork"]
|
||||
},{
|
||||
name:"盲板抽堵",
|
||||
ids:[] as string[],
|
||||
type:"model",
|
||||
pakFilePath: "@path:DTS_Library_V5.4.pak",
|
||||
assetPath:"/JC_CustomAssets/EffectLibrary/Exhibition/3DUI/3D_UI_A_1",
|
||||
value:"blind-plate",
|
||||
scale:[3,3,3],
|
||||
selected:false,
|
||||
pages:["dangerousWork"]
|
||||
},{
|
||||
name:"大气环境",
|
||||
ids:[] as string[],
|
||||
type:"marker",
|
||||
value:"gas-env",
|
||||
hasText:true,
|
||||
coordinateType:1,
|
||||
url:"@path:mp_atmosphere.png",
|
||||
selected:false,
|
||||
pages:["smartEnvironment","airQuality","dangrousCar"]
|
||||
},{
|
||||
name:"土壤环境",
|
||||
ids:[] as string[],
|
||||
type:"marker",
|
||||
value:"ground-env",
|
||||
coordinateType:1,
|
||||
hasText:true,
|
||||
url:"@path:mp_soil.png",
|
||||
selected:false,
|
||||
pages:["smartEnvironment","soilQuality"]
|
||||
},{
|
||||
name:"废气污染源",
|
||||
ids:[] as string[],
|
||||
type:"marker",
|
||||
url:"@path:mp_fluegas.png",
|
||||
value:"fq-wrw",
|
||||
coordinateType:1,
|
||||
hasText:true,
|
||||
selected:false,
|
||||
pages:["smartEnvironment","gas"]
|
||||
},{
|
||||
name:"清下水监控",
|
||||
ids:[] as string[],
|
||||
type:"marker",
|
||||
coordinateType:1,
|
||||
hasText:true,
|
||||
url:"@path:mp_purewater.png",
|
||||
value:"qxs-jk",
|
||||
selected:false,
|
||||
pages:["smartEnvironment","clean"]
|
||||
},{
|
||||
name:"水环境",
|
||||
ids:[] as string[],
|
||||
type:"marker",
|
||||
coordinateType:1,
|
||||
url:"@path:mp_water.png",
|
||||
value:"water-env",
|
||||
hasText:true,
|
||||
selected:false,
|
||||
pages:["smartEnvironment","waterQuality"]
|
||||
},{
|
||||
name:"特征污染物",
|
||||
ids:[] as string[],
|
||||
type:"marker",
|
||||
coordinateType:1,
|
||||
hasText:true,
|
||||
url:"@path:mp_contaminant.png",
|
||||
value:"tz-wrw",
|
||||
selected:false,
|
||||
pages:["smartEnvironment","characteristicContaminants"]
|
||||
},{
|
||||
name:"废水污染源",
|
||||
ids:[] as string[],
|
||||
type:"marker",
|
||||
coordinateType:1,
|
||||
hasText:true,
|
||||
url:"@path:mp_fluewater.png",
|
||||
value:"fs-wrw",
|
||||
selected:false,
|
||||
pages:["smartEnvironment","waste"]
|
||||
},{
|
||||
name:"隐患治理",
|
||||
ids:[] as string[],
|
||||
type:"marker",
|
||||
url:"@path:dt_yinhuan.png",
|
||||
value:"hidden-dangrous",
|
||||
selected:false,
|
||||
pages:["pitfall"]
|
||||
}]
|
||||
|
|
@ -27,12 +27,6 @@ export default class BaseComponent extends Vue {
|
|||
public lock = true;
|
||||
|
||||
public timerList = {} as any;
|
||||
|
||||
public eventAssets = {
|
||||
fire:"/JC_CustomAssets/ParticleLibrary/Exhibition/火/火焰_10",
|
||||
normal:"/JC_CustomAssets/EffectLibrary/Exhibition/Point/Point_R_2"
|
||||
} ;
|
||||
public warnAssets = "/JC_CustomAssets/EffectLibrary/Exhibition/Point/Point_Y_2";
|
||||
public pakFilePath = "@path:DTS_Library_V5.4.pak";
|
||||
public currentWanning:any = null;
|
||||
public currentEvent:any = null;
|
||||
|
|
@ -67,61 +61,6 @@ export default class BaseComponent extends Vue {
|
|||
|
||||
}
|
||||
|
||||
|
||||
public addEvent(data){
|
||||
if(this.currentEvent){
|
||||
this.player.api.customObject.delete(this.currentEvent.id);
|
||||
this.player.api.marker.delete(this.currentEvent.id);
|
||||
this.currentEvent = null;
|
||||
}
|
||||
if(!data.position[2]){
|
||||
data.position[2]=0.5
|
||||
}
|
||||
this.currentEvent = {
|
||||
id: data.id,
|
||||
pakFilePath: this.pakFilePath,
|
||||
assetPath:this.eventAssets[data.type] ,
|
||||
location: data.position,
|
||||
scale: data.type==="fire"?[15, 15, 15]:[10,10,10],
|
||||
popupSize:[355,212],
|
||||
coordinate:data.position,
|
||||
lineSize:[2,40],
|
||||
autoHeight:true,
|
||||
popupOffset:[-176,-106],
|
||||
useTextAnimation: false,
|
||||
autoHidePopupWindow:false,
|
||||
displayMode:2,
|
||||
popupURL:"http://192.168.1.20:8080/#/popup?"+new URLSearchParams(data),
|
||||
}
|
||||
|
||||
this.player.api.marker.add(this.currentEvent, (data) => {
|
||||
this.player.api.marker.showPopupWindow(this.currentEvent.id);
|
||||
this.player.api.marker.focus(this.currentEvent.id,150,2)
|
||||
})
|
||||
|
||||
this.player.api.customObject.add(this.currentEvent, (data) => {
|
||||
})
|
||||
}
|
||||
|
||||
public addWarnning(item){
|
||||
if(this.currentWanning){
|
||||
this.player.api.customObject.delete(this.currentWanning.id)
|
||||
}
|
||||
this.currentWanning = {
|
||||
id:item.id+"",
|
||||
groupId:"warning",
|
||||
pakFilePath:this.pakFilePath,
|
||||
assetPath:this.warnAssets,
|
||||
// coordinateType:1,
|
||||
location:[...item.position,10],
|
||||
rotation:[0,90,0]
|
||||
|
||||
}
|
||||
this.player.api.customObject.add(this.currentWanning,()=>{
|
||||
this.player.api.customObject.focus(this.currentWanning.id,15,2)
|
||||
})
|
||||
}
|
||||
|
||||
// 添加电子围栏 // 安全线 // 实控线 // 规划线
|
||||
public async toggleArea(layer){
|
||||
if(!layer.ids.length){
|
||||
|
|
@ -151,407 +90,6 @@ export default class BaseComponent extends Vue {
|
|||
}
|
||||
}
|
||||
|
||||
// 添加marker
|
||||
public toggleMarker(layer){
|
||||
if(!layer.ids.length){
|
||||
let text = {};
|
||||
const datas = this.dataList[layer.value].map(item=>{
|
||||
if(layer.hasText){
|
||||
text = {
|
||||
useTextAnimation: false,
|
||||
textBackgroundColor:[0,0,0,0.7],
|
||||
textOffset:[0,0],
|
||||
fontSize:12,
|
||||
fontColor:"#FFF",
|
||||
text:item.name || layer.name
|
||||
}
|
||||
}
|
||||
return Object.assign({
|
||||
id:item.id,
|
||||
groupId:layer.value,
|
||||
coordinate:item.position,
|
||||
coordinateType:layer.coordinateType?layer.coordinateType:0,
|
||||
displayMode:2,
|
||||
imagePath:layer.url || layer.urls[item.type],
|
||||
imageSize:[48,48],
|
||||
// popupURL:"http://192.168.1.20:8080/#/popup?"+new URLSearchParams(item),
|
||||
lineSize:[2,40],
|
||||
useTextAnimation: false,
|
||||
lineOffset:[24,0],
|
||||
// textBackgroundColor:[0,0,0,0.7],
|
||||
autoHeight:true,
|
||||
|
||||
},text)
|
||||
});
|
||||
this.player.api.marker.add(datas,(data)=>{
|
||||
layer.ids = datas.map(item=>item.id)
|
||||
})
|
||||
}else{
|
||||
if(layer.selected){
|
||||
// this.player.api.marker.showAllPopupWindow();
|
||||
this.player.api.marker.show(layer.ids)
|
||||
}else{
|
||||
// this.player.api.marker.hideAllPopupWindow();
|
||||
this.player.api.marker.hide(layer.ids)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
// 添加企业面 tag
|
||||
public toggleAreaMarker(layer){
|
||||
if(!layer.ids.length){
|
||||
const result = this.dataList[layer.value];
|
||||
if (!result) return
|
||||
const datas = result.map(item=>{
|
||||
return {
|
||||
id:item.id,
|
||||
groupId:layer.value,
|
||||
coordinate:item.position,
|
||||
displayMode:2,
|
||||
text:item.name,
|
||||
// popupURL:"http://192.168.1.20:8080/#/popup?"+new URLSearchParams(item),
|
||||
// popupSize:[348,156],
|
||||
lineSize:[2,40],
|
||||
useTextAnimation: false,
|
||||
textBackgroundColor:[0,0,0,0.7],
|
||||
textOffset:[0,0],
|
||||
fontSize:12,
|
||||
fontColor:"#FFF",
|
||||
autoHeight:true,
|
||||
|
||||
}
|
||||
});
|
||||
const datas2 = result.map((item,index)=>{
|
||||
return {
|
||||
id:item.id,
|
||||
groupId:layer.value,
|
||||
coordinates:item.area,
|
||||
height:layer.value==="company"?5:40,
|
||||
color:layer.color || layer.colors[index],
|
||||
style:1,
|
||||
generateTop:true,
|
||||
generateBottom:true
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
this.player.api.polygon3d.add(datas2,(data)=>{
|
||||
//
|
||||
console.log(layer.value,data)
|
||||
})
|
||||
this.player.api.marker.add(datas,(data)=>{
|
||||
layer.ids = result.map(item=>item.id)
|
||||
})
|
||||
// this.player.api.marker.showAllPopupWindow();
|
||||
}else{
|
||||
if(layer.selected){
|
||||
// this.player.api.marker.showAllPopupWindow();
|
||||
this.player.api.marker.show(layer.ids)
|
||||
this.player.api.polygon3d.show(layer.ids)
|
||||
}else{
|
||||
// this.player.api.marker.hideAllPopupWindow();
|
||||
this.player.api.marker.hide(layer.ids)
|
||||
this.player.api.polygon3d.hide(layer.ids)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
public async toggleMoveMarker(layer){
|
||||
const result = this.dataList[layer.value];
|
||||
|
||||
if(!layer.ids.length){
|
||||
const datas = result.map(item=>{
|
||||
return {
|
||||
id:item.id,
|
||||
groupId:layer.value,
|
||||
pakFilePath:layer.pakFilePath,
|
||||
assetPath:layer.assetPath,
|
||||
coordinateType:layer.coordinateType?layer.coordinateType:0,
|
||||
location:item.position,
|
||||
smoothMotion:1,
|
||||
scale:[0,0,0],
|
||||
rotation:[0,90,0]
|
||||
|
||||
}
|
||||
});
|
||||
const markerDatas = result.map(item=>{
|
||||
return {
|
||||
id:item.id,
|
||||
groupId:layer.value,
|
||||
coordinate:item.position,
|
||||
coordinateType:layer.coordinateType?layer.coordinateType:0,
|
||||
displayMode:2,
|
||||
imagePath:layer.url || layer.urls[item.type],
|
||||
imageSize:[48,48],
|
||||
// popupURL:"http://192.168.1.20:8080/#/popup?"+new URLSearchParams(item),
|
||||
lineSize:[2,40],
|
||||
useTextAnimation: false,
|
||||
lineOffset:[24,0],
|
||||
// textBackgroundColor:[0,0,0,0.7],
|
||||
autoHeight:true,
|
||||
|
||||
}
|
||||
})
|
||||
this.player.api.marker.add(markerDatas)
|
||||
this.player.api.customObject.add(datas,(data)=>{
|
||||
console.log(data)
|
||||
if(data.resultMessage==="OK"){
|
||||
this.player.api.marker.setAttachCustomObject(result.map(item=>{
|
||||
layer.ids.push(item.id);
|
||||
|
||||
|
||||
return{
|
||||
markerId: item.id, //标注id
|
||||
objectId: item.id, //自定义对象id
|
||||
offset: [0, 0, 0] //偏移量
|
||||
}
|
||||
}));
|
||||
this.player.api.customObject.moveTo(result.map(item=>{
|
||||
return {
|
||||
id:item.id,
|
||||
location:turf.destination(turf.point(item.position),layer.value==="car"?50:1,Math.random()*360,{units:"meters"}).geometry.coordinates,
|
||||
"smoothTime": 5
|
||||
}
|
||||
}))
|
||||
|
||||
this.timerList[layer.value] = setInterval(()=>{
|
||||
this.player.api.customObject.moveTo(result.map(item=>{
|
||||
return {
|
||||
id:item.id,
|
||||
location:turf.destination(turf.point(item.position),layer.value==="car"?50:1,Math.random()*360,{units:"meters"}).geometry.coordinates,
|
||||
"smoothTime": 5
|
||||
}
|
||||
}))
|
||||
},5000)
|
||||
}
|
||||
})
|
||||
}else{
|
||||
if(layer.selected){
|
||||
this.player.api.customObject.show(layer.ids)
|
||||
this.player.api.marker.show(layer.ids)
|
||||
this.player.api.customObject.moveTo(result.map(item=>{
|
||||
return {
|
||||
id:item.id,
|
||||
location:turf.destination(turf.point(item.position),layer.value==="car"?50:1,Math.random()*360,{units:"meters"}).geometry.coordinates,
|
||||
"smoothTime": 5
|
||||
}
|
||||
}))
|
||||
|
||||
this.timerList[layer.value] = setInterval(()=>{
|
||||
this.player.api.customObject.moveTo(result.map(item=>{
|
||||
return {
|
||||
id:item.id,
|
||||
location:turf.destination(turf.point(item.position),layer.value==="car"?50:1,Math.random()*360,{units:"meters"}).geometry.coordinates,
|
||||
"smoothTime": 5
|
||||
}
|
||||
}))
|
||||
},5000)
|
||||
}else{
|
||||
clearInterval(this.timerList[layer.value]);
|
||||
this.timerList[layer.value] = null;
|
||||
this.player.api.customObject.hide(layer.ids)
|
||||
this.player.api.marker.hide(layer.ids)
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// 添加3dMarker
|
||||
public async toggleCustom(layer){
|
||||
if(!layer.type){
|
||||
return
|
||||
}
|
||||
|
||||
if(!layer.ids.length){
|
||||
const result = this.dataList[layer.value] || [];
|
||||
const datas = result.map(item=>{
|
||||
if(!item.position[2]){
|
||||
item.position[2] = item.name==="高空"? 20:3
|
||||
}
|
||||
return {
|
||||
id:item.id,
|
||||
groupId:layer.value,
|
||||
pakFilePath:layer.pakFilePath,
|
||||
assetPath:layer.assetPath,
|
||||
coordinateType:layer.coordinateType?layer.coordinateType:0,
|
||||
location:item.position,
|
||||
scale:layer.scale,
|
||||
rotation:[0,90,0]
|
||||
|
||||
}
|
||||
});
|
||||
this.player.api.customObject.add(datas,(data)=>{
|
||||
if(data.resultMessage==="OK"){
|
||||
if(layer.value.indexOf("car")<0){
|
||||
result.forEach(async (item)=>{
|
||||
let res = await this.player.api.misc.getBPFunction(layer.assetPath);
|
||||
console.log(res,item)
|
||||
if(layer.value==="safe-goods"){
|
||||
this.player.api.customObject.callBatchBPFunction([{
|
||||
id: item.id,
|
||||
functionName: '数据',
|
||||
parameters: [
|
||||
{ "paramType": 5, "paramValue": item.remark},
|
||||
{ "paramType": 6, "paramValue": [1,1,1,1] },
|
||||
]
|
||||
},{
|
||||
id: item.id,
|
||||
functionName: '文字',
|
||||
parameters: [
|
||||
{ "paramType": 5, "paramValue": item.name},
|
||||
{ "paramType": 5, "paramValue": ""},
|
||||
{ "paramType": 6, "paramValue": [1,1,1,1] },
|
||||
{ "paramType": 6, "paramValue": [0, 0.3, 1, 1] },
|
||||
]
|
||||
}],(data)=>{
|
||||
console.error("物资盘点的marker点位供应商方面有问题 无法修改 预计五月底修复 产品经理说先放着不改文字")
|
||||
});
|
||||
}else if (layer.value==="safe-building" || layer.value==="check-point"){
|
||||
this.player.api.customObject.callBatchBPFunction([{
|
||||
id: item.id,
|
||||
functionName: '文字',
|
||||
parameters: [
|
||||
{ "paramType": 5, "paramValue": item.name},
|
||||
{ "paramType": 2, "paramValue": 48 },
|
||||
{ "paramType": 6, "paramValue": [0,1,0.000774,1] },
|
||||
{ "paramType": 3, "paramValue": 1 }
|
||||
]
|
||||
},{
|
||||
id: item.id,
|
||||
functionName: '数据',
|
||||
parameters: [
|
||||
{ "paramType": 5, "paramValue": item.remark},
|
||||
{ "paramType": 2, "paramValue": 150 },
|
||||
]
|
||||
}]);
|
||||
}else{
|
||||
this.player.api.customObject.callBatchBPFunction([{
|
||||
id: item.id,
|
||||
functionName: '文字',
|
||||
parameters: [
|
||||
{ "paramType": 5, "paramValue": layer.name+"作业"},
|
||||
{ "paramType": 2, "paramValue": 48},
|
||||
{ "paramType": 6, "paramValue": [1,1,1,1] },
|
||||
]
|
||||
}],(data)=>{
|
||||
console.log(data)
|
||||
});
|
||||
}
|
||||
})
|
||||
}
|
||||
layer.ids = result.map(item=>item.id)
|
||||
}
|
||||
})
|
||||
}else{
|
||||
if(layer.selected){
|
||||
this.player.api.customObject.show(layer.ids)
|
||||
}else{
|
||||
this.player.api.customObject.hide(layer.ids)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// 热力图
|
||||
public async addHeatMap(layer) {
|
||||
if(!layer.ids.length){
|
||||
const range = [0, 100];
|
||||
const data = [] as any;
|
||||
const bbox = [
|
||||
13312554.24,
|
||||
4098064.96,
|
||||
0,
|
||||
13313446.4,
|
||||
4098892.48,
|
||||
0
|
||||
]
|
||||
for (let i = 0; i < 100; i++) {
|
||||
const x = getRandNumBetween(bbox[0], bbox[3]); //minX ~ maxX
|
||||
const y = getRandNumBetween(bbox[1], bbox[4]); //minY ~ maxY
|
||||
data.push({
|
||||
id: i.toString(),
|
||||
coordinate: [x, y, 0], //热力点的坐标
|
||||
radius: Math.random() * 30, //热力点影像半径范围
|
||||
heatValue: Math.random() * 100 //热力值
|
||||
});
|
||||
}
|
||||
this.player.api.heatmap.add('heatmap', bbox, range, data);
|
||||
layer.ids.push("heatmap")
|
||||
}else{
|
||||
if(layer.selected){
|
||||
this.player.api.heatmap.show(layer.ids)
|
||||
}else{
|
||||
this.player.api.heatmap.hide(layer.ids)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
// 添加逃生路线
|
||||
|
||||
public async addRoute(layer){
|
||||
|
||||
if(!layer.ids.length){
|
||||
const result = this.dataList[layer.value].map(item=>{
|
||||
return {
|
||||
id:item.id,
|
||||
groupId:layer.value,
|
||||
coordinates:item.positions,
|
||||
thickness:5,
|
||||
shape:0,
|
||||
flowRate:0.1,
|
||||
color:layer.color,
|
||||
style:0,
|
||||
}
|
||||
});
|
||||
this.player.api.polyline.add(result,(data)=>{
|
||||
if(data.resultMessage==="OK"){
|
||||
layer.ids = result.map(item=>item.id)
|
||||
}
|
||||
})
|
||||
}else{
|
||||
if(layer.selected){
|
||||
this.player.api.polyline.show(layer.ids)
|
||||
}else{
|
||||
this.player.api.polyline.hide(layer.ids)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
public toggleLayerAssets(layer){
|
||||
if(layer.type === "area"){
|
||||
this.toggleArea(layer)
|
||||
return
|
||||
}
|
||||
if(layer.type === "line"){
|
||||
this.addRoute(layer)
|
||||
return
|
||||
}
|
||||
if(layer.type === "heatmap"){
|
||||
this.addHeatMap(layer)
|
||||
return
|
||||
}
|
||||
if(layer.type==="areaMarker"){
|
||||
this.toggleAreaMarker(layer)
|
||||
return
|
||||
}
|
||||
if(layer.type==="moveMarker"){
|
||||
this.toggleMoveMarker(layer)
|
||||
return
|
||||
}
|
||||
if(layer.type==="model"){
|
||||
this.toggleCustom(layer)
|
||||
return
|
||||
}
|
||||
if(layer.type==="marker"){
|
||||
this.toggleMarker(layer)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
public onFocus(data){
|
||||
this.player.api[data.type].focus(data.id)
|
||||
|
|
@ -564,18 +102,10 @@ export default class BaseComponent extends Vue {
|
|||
console.log(1)
|
||||
}
|
||||
beforeDestory(){
|
||||
//
|
||||
}
|
||||
destroyed(){
|
||||
this.layerData.forEach(item=>{
|
||||
if(item.type){
|
||||
this.player.api[item.type].clear()
|
||||
}
|
||||
if(this.timerList[item.value]){
|
||||
clearInterval(this.timerList[item.value]);
|
||||
this.timerList[item.value] = null;
|
||||
}
|
||||
|
||||
})
|
||||
//
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,8 +1,4 @@
|
|||
<div class="overview-container">
|
||||
<div class="fix-tab-box" v-if="currentNav === 'dangrousCar' ">
|
||||
<el-radio :label="index" class="tab" v-model="currentPark" @input="parkChange" v-for="(item,index) in parkList"
|
||||
:key="index">{{item}}</el-radio>
|
||||
</div>
|
||||
|
||||
<!-- <MapComponent id="map" @onLoaded="getMap" @onHandleChange="handleChange"></MapComponent>-->
|
||||
|
||||
|
|
|
|||
|
|
@ -19,132 +19,7 @@
|
|||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
.new-page{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
position: absolute;
|
||||
left:0;
|
||||
top: 0;
|
||||
z-index: 9;
|
||||
background-color: #0d151e;
|
||||
}
|
||||
.pop-box{
|
||||
width: 430px;
|
||||
border-radius: 4px 4px 4px 4px;
|
||||
opacity: 1;
|
||||
border: 1px solid #FFFFFF;
|
||||
background: rgba($color: #000000, $alpha: 0.6);
|
||||
color: #E8E8E8;
|
||||
padding: 30px;
|
||||
font-size: 14px;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%,-50%);
|
||||
.border{
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
position: absolute;
|
||||
border-left: 1px solid #FFF;
|
||||
border-top: 1px solid #FFF;
|
||||
&.l-t{
|
||||
top: 10px;
|
||||
left: 10px;
|
||||
}
|
||||
&.r-t{
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
&.r-b{
|
||||
bottom: 10px;
|
||||
right: 10px;
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
&.l-b{
|
||||
bottom: 10px;
|
||||
left: 10px;
|
||||
transform: rotate(270deg);
|
||||
}
|
||||
}
|
||||
.title{
|
||||
font-size: 16px;
|
||||
}
|
||||
.close{
|
||||
position: absolute;
|
||||
cursor: pointer;
|
||||
right: 20px;
|
||||
top: 20px;
|
||||
color: #FFF;
|
||||
font-size: 26px;
|
||||
}
|
||||
.block{
|
||||
padding: 20px 0;
|
||||
line-height: 100%;
|
||||
border-bottom: 1px solid rgba($color: $border-color, $alpha: 0.4);
|
||||
&.flex-box{
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.flex-panel{
|
||||
width: 70px;
|
||||
text-align: center;
|
||||
line-height: 100%;
|
||||
svg{
|
||||
font-size: 15px;
|
||||
}
|
||||
&.half{
|
||||
width: 50%;
|
||||
text-align: left;
|
||||
}
|
||||
p{
|
||||
line-height: 100%;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.count{
|
||||
padding: 10px 0;
|
||||
font-size: 20px;
|
||||
margin-bottom: 10px;
|
||||
border-bottom: 1px solid rgba($color: $border-color, $alpha: 0.6);
|
||||
position: relative;
|
||||
&::after{
|
||||
content: "";
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
border: 1px solid rgba($color: $border-color, $alpha: 0.6);
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
display: block;
|
||||
right: -5px;
|
||||
bottom: -3px;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fix-tab-box{
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
height: 40px;
|
||||
background: rgba($color: #000000, $alpha: 0.7);
|
||||
border-radius: 20px;
|
||||
padding-right: 80px;
|
||||
position: fixed;
|
||||
top: 100px;
|
||||
z-index: 99;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
.tab{
|
||||
margin-left: 80px;
|
||||
}
|
||||
.el-radio{
|
||||
color: $font-color;
|
||||
}
|
||||
}
|
||||
|
||||
#map {
|
||||
width: 100%;
|
||||
|
|
|
|||
|
|
@ -14,71 +14,13 @@ import BaseComponent from "./base.component"
|
|||
export default class OverViewComponent extends BaseComponent {
|
||||
//当前菜单
|
||||
public currentNav = '';
|
||||
|
||||
// 当前图层
|
||||
public currentLayers = [] as any;
|
||||
|
||||
public parkList = ["一号停车场","二号停车场","三号停车场"];
|
||||
public currentPark = null;
|
||||
public warnTimer:any;
|
||||
currentVideo = require("@/assets/video/camera.mp4");
|
||||
//弹出层标识
|
||||
dialogVisible = false
|
||||
//隐患详情
|
||||
showHiddenRightFlag = false
|
||||
//许可证弹窗
|
||||
dialogVisibleForPermit = false
|
||||
dialogVisibleForBigPop = false
|
||||
//许可证模拟数据
|
||||
tableDataForPermit: any[] = MockData.xkz().data
|
||||
|
||||
// 是否展开图层
|
||||
public openLayerDrawer = false;
|
||||
//风险管控右侧控制显示隐藏
|
||||
riskFlag = false
|
||||
riskDetailData = {}
|
||||
//危险源详情标记
|
||||
riskDetailFlag = false
|
||||
dangerSourceDetail = {}
|
||||
public popFlag = false;
|
||||
info: any = {}
|
||||
// 告警列表
|
||||
waringList: any[] = [];
|
||||
|
||||
// 是否显示全页新页面
|
||||
public newPageData:any = null;
|
||||
|
||||
//应急准备
|
||||
showPlanFlag = false
|
||||
//事态控制
|
||||
showControlFlag = false
|
||||
//善后
|
||||
showAfterwardsFlag = false
|
||||
//确认警情
|
||||
showConfirmFlag = false
|
||||
//研判
|
||||
judgmentFlag = false
|
||||
//物资详细列表
|
||||
storeGoodsFlag = false
|
||||
public currentCarPeople:any;
|
||||
|
||||
public currentCompany:any = false;
|
||||
|
||||
created(){
|
||||
}
|
||||
|
||||
public getHiddenDangrous(){
|
||||
this.parkService.getHiddenDangrous().then((res:any)=>{
|
||||
this.dataList["hidden-dangrous"] = res.data;
|
||||
this.$store.commit("setHiddenDangrousList",res.data)
|
||||
})
|
||||
}
|
||||
public getWaringList(){
|
||||
this.waringList = MockData.getWaringList().data
|
||||
this.$store.commit("upDateWaringList",this.waringList)
|
||||
}
|
||||
public upDateEventList(){
|
||||
const eventList = MockData.getEventList().data
|
||||
this.$store.commit("upDateEventList",eventList)
|
||||
}
|
||||
// 获取车辆
|
||||
public getCarList(){
|
||||
this.closeService.getCarList().then((res)=>{
|
||||
|
|
@ -92,214 +34,6 @@ export default class OverViewComponent extends BaseComponent {
|
|||
this.$store.commit("setPeopleList",res.data)
|
||||
})
|
||||
}
|
||||
// 获取摄像头
|
||||
public getCameraList(){
|
||||
this.closeService.getCameraList().then((res)=>{
|
||||
this.dataList["video"] = (res.data as any);
|
||||
this.$store.commit("setCameraList",res.data)
|
||||
})
|
||||
}
|
||||
// 获取企业列表
|
||||
public getCompanyList(){
|
||||
this.parkService.getCompanyList().then((res:any)=>{
|
||||
this.dataList["company"] = res.data;
|
||||
this.$store.commit("setCompanyList",res.data)
|
||||
})
|
||||
}
|
||||
|
||||
// 获取电子围栏
|
||||
public getBounds(){
|
||||
this.parkService.getBounds().then((res:any)=>{
|
||||
this.dataList["bounds"] = res.data;
|
||||
})
|
||||
}
|
||||
// 获取实控线
|
||||
public getRealBounds(){
|
||||
this.parkService.getRealBounds().then((res:any)=>{
|
||||
this.dataList["real-line"] = res.data;
|
||||
})
|
||||
}
|
||||
// 获取安全线
|
||||
public getSafeBounds(){
|
||||
this.parkService.getSafeBounds().then((res:any)=>{
|
||||
this.dataList["safe-line"] = res.data;
|
||||
})
|
||||
}
|
||||
// 获取规划线
|
||||
public getPlanBounds(){
|
||||
this.parkService.getPlanBounds().then((res:any)=>{
|
||||
this.dataList["plan-line"] = res.data;
|
||||
})
|
||||
}
|
||||
// 获取疏散线路
|
||||
public getSafeLine(){
|
||||
this.parkService.getSafeLine().then((res:any)=>{
|
||||
this.dataList["safe-route"] = res.data;
|
||||
})
|
||||
}
|
||||
// 获取重载空载车辆
|
||||
public getStopCarList(){
|
||||
this.closeService.getStopCarList().then((res:any)=>{
|
||||
this.dataList["empty-car"] = res.data.filter(item=>item.type=="空载");
|
||||
this.dataList["heavy-car"] = res.data.filter(item=>item.type!="空载");
|
||||
})
|
||||
}
|
||||
// 获取大气监测
|
||||
public getGasData(){
|
||||
this.parkService.getGasData().then(res=>{
|
||||
const datas = MockData.deviceList().data
|
||||
this.dataList["gas-env"] = (res.data as any).map((item,i)=>{
|
||||
item.name = datas.nameList[i]
|
||||
item.value = datas.values[i]
|
||||
return item
|
||||
});
|
||||
})
|
||||
|
||||
}
|
||||
// 获取土壤
|
||||
public getRoilData(){
|
||||
this.parkService.getRoilData().then(res=>{
|
||||
const datas = MockData.deviceList().data
|
||||
this.dataList["ground-env"] = (res.data as any).map((item,i)=>{
|
||||
item.name = datas.nameList[i]
|
||||
item.value = datas.values[i]
|
||||
return item
|
||||
});
|
||||
this.$store.commit("setGroundEnvList",this.dataList["ground-env"])
|
||||
})
|
||||
|
||||
}
|
||||
// 获取废气
|
||||
public getBadGasData(){
|
||||
this.parkService.getBadGasData().then(res=>{
|
||||
this.dataList["fq-wrw"] = res.data;
|
||||
})
|
||||
|
||||
}
|
||||
// 获取清下水
|
||||
public getCleanWaterData(){
|
||||
this.parkService.getCleanWaterData().then(res=>{
|
||||
this.dataList["qxs-jk"] = res.data;
|
||||
})
|
||||
|
||||
}
|
||||
// 获取水环境
|
||||
public getWaterEnvData(){
|
||||
this.parkService.getWaterEnvData().then(res=>{
|
||||
this.dataList["water-env"] = res.data;
|
||||
})
|
||||
|
||||
}
|
||||
// 获取特征污染物
|
||||
public getTzWrwData(){
|
||||
this.parkService.getTzWrwData().then(res=>{
|
||||
const datas = MockData.deviceList().data
|
||||
this.dataList["tz-wrw"] = (res.data as any).map((item,i)=>{
|
||||
item.name = datas.nameList[i]
|
||||
item.value = datas.values[i]
|
||||
return item
|
||||
});
|
||||
this.$store.commit("setSpecialEnvList",this.dataList["tz-wrw"])
|
||||
|
||||
})
|
||||
|
||||
}
|
||||
// 获取废水
|
||||
public getBadWaterData(){
|
||||
this.parkService.getBadWaterData().then(res=>{
|
||||
this.dataList["fs-wrw"] = res.data;
|
||||
})
|
||||
|
||||
}
|
||||
// 获取四色图
|
||||
public getFourList(){
|
||||
this.parkService.getFourList().then(res=>{
|
||||
this.dataList["four-color"] = res.data;
|
||||
})
|
||||
|
||||
}
|
||||
// 获取四色图2
|
||||
public getFourList2(){
|
||||
this.parkService.getFourList2().then(res=>{
|
||||
this.dataList["four-color2"] = res.data;
|
||||
})
|
||||
|
||||
}
|
||||
// 获取卡口
|
||||
public getCheckPoint(){
|
||||
this.parkService.getCheckPoint().then(res=>{
|
||||
this.dataList["check-point"] = res.data;
|
||||
})
|
||||
|
||||
}
|
||||
// 获取应急设施
|
||||
public getBuildingList(){
|
||||
this.parkService.getBuildingList().then(res=>{
|
||||
this.dataList["safe-building"] = res.data;
|
||||
})
|
||||
|
||||
}
|
||||
// 获取应急仓库
|
||||
public getStoreList(){
|
||||
this.parkService.getStoreList().then(res=>{
|
||||
this.dataList["safe-goods"] = res.data;
|
||||
this.$store.commit("setSafeGoods",res.data)
|
||||
})
|
||||
|
||||
}
|
||||
// 获取重大危险源
|
||||
public getDangrous(){
|
||||
this.parkService.getDangrous().then(res=>{
|
||||
this.dataList["dangrous"] = res.data;
|
||||
this.$store.commit("setDangrousList",res.data)
|
||||
})
|
||||
}
|
||||
// 获取动火
|
||||
public getDangrousWorkData(){
|
||||
this.parkService.getDangrousWorkData().then((res:any)=>{
|
||||
res.data.forEach(item=>{
|
||||
const layer = this.layerData.find(layer=>layer.name === item.name) as any;
|
||||
if(!this.dataList[layer.value]){
|
||||
this.dataList[layer.value] = [];
|
||||
}
|
||||
this.dataList[layer.value].push(item);
|
||||
this.$store.commit("setDangrousWorkList",res.data)
|
||||
})
|
||||
|
||||
})
|
||||
}
|
||||
// 停车场切换
|
||||
public parkChange(data){
|
||||
let ids = [];
|
||||
if(data===0){
|
||||
ids = this.currentLayers.find(item=>item.value==="heavy-car").ids;
|
||||
}else if(data===1){
|
||||
ids = this.currentLayers.find(item=>item.value==="empty-car").ids;
|
||||
}
|
||||
this.player.api.customObject.focus(ids)
|
||||
}
|
||||
|
||||
//特殊作业显示隐藏
|
||||
sepRightFlag = false
|
||||
//特殊作业详情
|
||||
sepDetailData = {}
|
||||
//特殊作业详情
|
||||
hiddenDetailData = {}
|
||||
//是否从隐患那边打开的风险
|
||||
fromPage = ''
|
||||
//大弹窗标题
|
||||
bigPopTitle = '人员信息卡'
|
||||
//默认打开的折叠面板
|
||||
activeNames = ['1']
|
||||
//右侧列表显示隐藏
|
||||
rightListFlag = false
|
||||
//右侧列表数据
|
||||
dataListRight:any = {}
|
||||
//右侧主要内容显示隐藏
|
||||
get showMainRight(){
|
||||
return !this.popFlag && !this.riskFlag && (this.currentNav !== 'risk') && !this.sepRightFlag &&
|
||||
!this.showHiddenRightFlag && !this.riskDetailFlag && !this.rightListFlag && !this.showConfirmFlag && !this.judgmentFlag && !this.storeGoodsFlag
|
||||
}
|
||||
// 地图初始化后
|
||||
public getMap(store: any) {
|
||||
this.player = store;
|
||||
|
|
@ -312,44 +46,12 @@ export default class OverViewComponent extends BaseComponent {
|
|||
this.player.api.polyline.clear();
|
||||
this.player.api.heatmap.clear();
|
||||
this.currentLayers = this.getCurrentLayers();
|
||||
// this.addEvent({
|
||||
// type:"fire",
|
||||
// id:new Date().getTime()+"",
|
||||
// typeName:"火灾",
|
||||
// tel:13222078731,
|
||||
// position:[13312990.72, 4098613.12, 0.51],
|
||||
// reporter:"张三",
|
||||
// content:"北京汉邦唐化工厂区发生火灾"
|
||||
|
||||
// })
|
||||
// this.addHeatMap();
|
||||
// document.addEventListener("mousemove",this.fixedCamera)
|
||||
|
||||
}
|
||||
|
||||
public handleChange(data) {
|
||||
console.log(data)
|
||||
if(data.GroupID){
|
||||
const currentData = this.dataList[data.GroupID].find(item=>item.id === data.Id);
|
||||
|
||||
if(data.GroupID==="peo"){
|
||||
this.emitPersonPop(currentData)
|
||||
}
|
||||
if(data.GroupID==="car"){
|
||||
this.emitCarPop(currentData)
|
||||
}
|
||||
if(data.GroupID==="video"){
|
||||
this.openVideo(currentData)
|
||||
}
|
||||
if(data.GroupID==="company"){
|
||||
this.openCompany(currentData)
|
||||
}
|
||||
if(data.GroupID==="hidden-dangrous"){
|
||||
this.showHiddenRight(currentData)
|
||||
}
|
||||
if(["blind-plate","forbid-space","use-e","make-ground","hoisting","high-sky","break-road","use-fire"].includes(data.GroupID)){
|
||||
this.showSepRight(currentData)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -360,7 +62,6 @@ export default class OverViewComponent extends BaseComponent {
|
|||
this.resetMap();
|
||||
}
|
||||
console.log('当前点击导航', data)
|
||||
this.hidePop()
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -404,245 +105,13 @@ export default class OverViewComponent extends BaseComponent {
|
|||
return
|
||||
}
|
||||
layer.selected = !layer.selected;
|
||||
this.toggleLayerAssets(layer)
|
||||
}
|
||||
|
||||
//点击报警信息右侧交互动画
|
||||
public popDrawerChange(flag = false,className='.main') {
|
||||
this.$nextTick(()=>{
|
||||
const popEl = document.querySelector(className) as any;
|
||||
if (!popEl) return
|
||||
if (flag) {
|
||||
popEl.classList.remove("animate__fadeInRight");
|
||||
setTimeout(()=>{
|
||||
popEl.classList.add("animate__fadeInRight");
|
||||
},10)
|
||||
|
||||
} else {
|
||||
popEl.classList.remove("animate__slideInRight");
|
||||
popEl.classList.add("animate__slideOutRight");
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
mounted() {
|
||||
console.log(2)
|
||||
}
|
||||
|
||||
//获取点击的信息
|
||||
getItem(item) {
|
||||
this.addWarnning(item)
|
||||
this.popFlag = true
|
||||
this.riskDetailFlag = false
|
||||
this.riskFlag = false
|
||||
this.info = item
|
||||
this.popDrawerChange(true)
|
||||
}
|
||||
|
||||
//处理信息
|
||||
deal() {
|
||||
this.dialogVisible = true
|
||||
}
|
||||
|
||||
|
||||
closePop(){
|
||||
if(this.currentWanning){
|
||||
this.player.api.customObject.delete(this.currentWanning.id);
|
||||
this.currentWanning = null
|
||||
}
|
||||
this.popFlag = false
|
||||
}
|
||||
//隐藏弹出层
|
||||
hidePop() {
|
||||
if(this.currentEvent){
|
||||
this.player.api.customObject.delete(this.currentEvent.id);
|
||||
this.player.api.marker.delete(this.currentEvent.id);
|
||||
this.currentEvent = null;
|
||||
}
|
||||
if(this.currentWanning){
|
||||
this.player.api.customObject.delete(this.currentWanning.id);
|
||||
this.currentWanning = null
|
||||
}
|
||||
this.newPageData = null;
|
||||
this.currentCompany=false;
|
||||
this.popFlag = false
|
||||
this.riskFlag = false
|
||||
this.sepRightFlag = false
|
||||
this.riskDetailFlag = false
|
||||
this.showHiddenRightFlag = false
|
||||
this.rightListFlag = false
|
||||
this.showConfirmFlag = false
|
||||
this.judgmentFlag = false
|
||||
this.storeGoodsFlag = false
|
||||
this.fromPage = ''
|
||||
}
|
||||
//隐藏危险源弹出层
|
||||
hideDangerPop() {
|
||||
this.popDrawerChange(false,'.riskDetail')
|
||||
this.riskDetailFlag = false
|
||||
}
|
||||
//显示应急plan
|
||||
showPlan(){
|
||||
this.info = {
|
||||
"typeName": "火灾",
|
||||
"content": "北京汉邦唐化工厂区发生火灾",
|
||||
"levelName": "二级",
|
||||
"levelClass": "level-2-text",
|
||||
"levelClassIcon": "level-2",
|
||||
"time": "2023-05-15 15:21:35",
|
||||
"address": "工厂厂房",
|
||||
"reporter": "蒋丽",
|
||||
"tableHeader": [
|
||||
{
|
||||
"prop": "name",
|
||||
"label": "摄像头名称"
|
||||
},
|
||||
{
|
||||
"prop": "type",
|
||||
"label": "类型"
|
||||
},
|
||||
{
|
||||
"prop": "distance",
|
||||
"label": "距离 (m)"
|
||||
}
|
||||
],
|
||||
"tableData": [
|
||||
{
|
||||
"type": "简型摄像头",
|
||||
"distance": "10",
|
||||
"name": "1号摄像头"
|
||||
},
|
||||
{
|
||||
"type": "简型摄像头",
|
||||
"distance": "20",
|
||||
"name": "2号摄像头"
|
||||
},
|
||||
{
|
||||
"type": "简型摄像头",
|
||||
"distance": "22",
|
||||
"name": "3号摄像头"
|
||||
},
|
||||
{
|
||||
"type": "简型摄像头",
|
||||
"distance": "10",
|
||||
"name": "4号摄像头"
|
||||
},
|
||||
{
|
||||
"type": "简型摄像头",
|
||||
"distance": "20",
|
||||
"name": "5号摄像头"
|
||||
},
|
||||
{
|
||||
"type": "简型摄像头",
|
||||
"distance": "22",
|
||||
"name": "6号摄像头"
|
||||
}
|
||||
],
|
||||
"title": "火灾爆炸",
|
||||
"info": "北京汉邦唐化工厂区发生火灾",
|
||||
"level": "1",
|
||||
"type": "fire",
|
||||
"tel": 13231475537,
|
||||
"id": "110000197911038403",
|
||||
"position": [13313085.72,4098442.24,0.51001953125]
|
||||
}
|
||||
this.showPlanFlag = true
|
||||
}
|
||||
//显示控制
|
||||
showControl(){
|
||||
this.showPlanFlag = false
|
||||
this.showControlFlag = true
|
||||
}
|
||||
//显示善后
|
||||
showAfterwards(){
|
||||
this.showControlFlag = false
|
||||
this.showAfterwardsFlag = true
|
||||
}
|
||||
//显示应急首页
|
||||
showHome(){
|
||||
this.showAfterwardsFlag = false
|
||||
}
|
||||
//确认警情
|
||||
showConfirm(){
|
||||
this.showConfirmFlag = true
|
||||
}
|
||||
hideConfirm(){
|
||||
this.showConfirmFlag = false
|
||||
}
|
||||
hideJudgmentFlag(){
|
||||
this.judgmentFlag = false
|
||||
this.showPlanFlag = true
|
||||
}
|
||||
showJudgmentFlag(){
|
||||
this.showConfirmFlag = false
|
||||
this.judgmentFlag = true
|
||||
}
|
||||
//接收处理消息
|
||||
dealSubmit(msg: any) {
|
||||
console.log(msg, 'msg')
|
||||
this.hidePop()
|
||||
}
|
||||
|
||||
|
||||
|
||||
//动态合并表格列
|
||||
objectSpanMethod({row, column, rowIndex, columnIndex}) {
|
||||
if ([0, 1].includes(columnIndex)) {
|
||||
if (rowIndex % 5 === 0) {
|
||||
return {
|
||||
rowspan: 5,
|
||||
colspan: 1
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
rowspan: 0,
|
||||
colspan: 0
|
||||
};
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//显示风险右侧详情
|
||||
showRiskRight(item){
|
||||
this.popFlag = false
|
||||
this.riskDetailFlag = false
|
||||
this.riskFlag = true
|
||||
if (item){
|
||||
this.riskDetailData = item
|
||||
}
|
||||
this.popDrawerChange(true)
|
||||
}
|
||||
// 关闭风险右侧
|
||||
closeRiskRight(){
|
||||
this.riskFlag = false
|
||||
if (this.fromPage === 'hidden'){
|
||||
this.showHiddenRightFlag = true
|
||||
}
|
||||
// this.hidePop()
|
||||
}
|
||||
// 关闭右侧危险源
|
||||
closeRiskDetailRight(){
|
||||
if (this.currentNav === 'smartSafetySupervision'){
|
||||
this.riskDetailFlag = false
|
||||
}else{
|
||||
this.hideDangerPop()
|
||||
this.showRiskRight(false)
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
//弹出危险源相关信息
|
||||
getHazard(item){
|
||||
this.riskDetailFlag = true
|
||||
this.riskFlag = false
|
||||
this.popFlag = false
|
||||
this.dangerSourceDetail = MockData.dangerSourceDetail().data
|
||||
/* this.popDrawerChange()
|
||||
this.popDrawerChange(true,'.main')*/
|
||||
}
|
||||
|
||||
|
||||
public getCurrentLayers(){
|
||||
|
|
@ -663,173 +132,11 @@ export default class OverViewComponent extends BaseComponent {
|
|||
}
|
||||
|
||||
|
||||
//显示特殊作业右侧详情
|
||||
showSepRight(item){
|
||||
this.resetMap()
|
||||
setTimeout(()=>{
|
||||
this.player.api.customObject.focus(item.id,50,2,null,0,()=>{
|
||||
this.sepRightFlag = true
|
||||
if (item){
|
||||
this.sepDetailData = item
|
||||
}
|
||||
this.popDrawerChange(true,'.main')
|
||||
})
|
||||
this.player.api.polygon3d.focus(item.id,50,2)
|
||||
},1000)
|
||||
}
|
||||
//关闭特殊作业详情
|
||||
closeSepDetailRight(){
|
||||
this.sepRightFlag = false
|
||||
}
|
||||
//显示隐患详情
|
||||
showHiddenRight(item){
|
||||
console.log(item)
|
||||
this.player.api.marker.focus(item.id,10,2)
|
||||
setTimeout(()=>{
|
||||
this.showHiddenRightFlag = true
|
||||
this.riskFlag = false
|
||||
this.riskDetailFlag = false
|
||||
if (item){
|
||||
this.hiddenDetailData = item
|
||||
}
|
||||
this.popDrawerChange(true,'.main')
|
||||
},2000)
|
||||
|
||||
}
|
||||
//关闭特殊作业详情
|
||||
closeHiddenDetailRight(){
|
||||
this.showHiddenRightFlag = false
|
||||
}
|
||||
//隐患详情关联风险
|
||||
showRisk(item){
|
||||
this.showHiddenRightFlag = false
|
||||
this.riskFlag = true
|
||||
this.fromPage = 'hidden'
|
||||
if (item){
|
||||
this.riskDetailData = item
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
destroyed() {
|
||||
if (this.player) {
|
||||
this.player = null
|
||||
}
|
||||
if(this.warnTimer){
|
||||
clearInterval(this.warnTimer);
|
||||
this.warnTimer = null;
|
||||
}
|
||||
}
|
||||
//展示人员详情
|
||||
emitPersonPop(item){
|
||||
this.resetMap();
|
||||
setTimeout(()=>{
|
||||
this.currentCarPeople = item;
|
||||
this.player.api.customObject.focus(item.id,50,2,[0,0,0],2);
|
||||
setTimeout(()=>{
|
||||
this.bigPopTitle = '人员信息卡';
|
||||
this.dialogVisibleForBigPop = true
|
||||
},2000)
|
||||
},1000)
|
||||
}
|
||||
//展示车辆详情
|
||||
emitCarPop(item){
|
||||
this.resetMap();
|
||||
setTimeout(()=>{
|
||||
this.currentCarPeople = item;
|
||||
this.player.api.customObject.focus(item.id,50,2,[0,0,0],2);
|
||||
setTimeout(()=>{
|
||||
this.bigPopTitle = '车辆信息卡';
|
||||
this.dialogVisibleForBigPop = true
|
||||
},2000)
|
||||
},1000)
|
||||
}
|
||||
// 打开摄像头
|
||||
openVideo(item){
|
||||
this.resetMap();
|
||||
setTimeout(()=>{
|
||||
this.player.api.marker.focus(item.id,50,2)
|
||||
setTimeout(()=>{
|
||||
layer.open({
|
||||
type:1,
|
||||
shade:0,
|
||||
title:item.remark+"-"+ item.id,
|
||||
content:`<div class="customClass">
|
||||
<video src="${this.currentVideo}" controls style="width:100%" autoplay></video>
|
||||
</div>`
|
||||
})
|
||||
},2000)
|
||||
},1000)
|
||||
}
|
||||
openCompany(item){
|
||||
this.resetMap();
|
||||
setTimeout(()=>{
|
||||
this.player.api.polygon3d.focus(item.id,100,2,null,()=>{
|
||||
this.currentCompany = item;
|
||||
})
|
||||
},1000)
|
||||
}
|
||||
|
||||
selectCompany(item){
|
||||
this.newPageData = item;
|
||||
}
|
||||
|
||||
|
||||
closeCarPersonPop(){
|
||||
this.player.api.customObject.focus(this.currentCarPeople.id,50,2,null,0,()=>{
|
||||
this.currentCarPeople = null;
|
||||
})
|
||||
}
|
||||
|
||||
//显示封闭园区右侧列表
|
||||
showList(item){
|
||||
this.dataListRight = item
|
||||
this.rightListFlag = true
|
||||
}
|
||||
//关闭封闭园区右侧列表
|
||||
closeRight(){
|
||||
this.rightListFlag = false
|
||||
this.dataListRight = {}
|
||||
}
|
||||
//点击右侧柱状图
|
||||
clickBar(item){
|
||||
this.resetMap();
|
||||
setTimeout(()=>{
|
||||
this.player.api.marker.focus(item.id,10,2)
|
||||
},1000)
|
||||
|
||||
}
|
||||
|
||||
//点击应急告警
|
||||
getEmergencyEvent(item){
|
||||
this.addEvent(item)
|
||||
this.showConfirmFlag = false
|
||||
this.judgmentFlag = false
|
||||
this.info = item
|
||||
this.showConfirm()
|
||||
// this.popFlag = true
|
||||
// this.info = item
|
||||
// this.popDrawerChange(true)
|
||||
|
||||
}
|
||||
changePoint(item){
|
||||
this.addEvent(item)
|
||||
}
|
||||
get showBackGround(){
|
||||
let flag = this.currentNav === 'risk' && !this.riskFlag && !this.riskDetailFlag
|
||||
return flag?'none':''
|
||||
}
|
||||
showGoodsList(item){
|
||||
this.storeGoodsFlag = true
|
||||
}
|
||||
focusGood(item){
|
||||
// console.log(item)
|
||||
this.player.api.customObject.focus(item.id)
|
||||
}
|
||||
getCompany(item){
|
||||
console.log(item)
|
||||
this.openCompany(item)
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue