fix:screen

.env.development

@@ -6,7 +6,7 @@ VUE_APP_WS_API = 'ws://localhost:8000'
 VUE_APP_BASE_API  = 'http://192.168.2.15:8059'
 
 VUE_APP_LOCAL_API = 'http://192.168.2.37:9005'
-VUE_APP_D3Tileset = 'http://192.168.3.226:8080/Apps/assets/media/rushanruibo'
+VUE_APP_D3Tileset = 'http://192.168.2.15:8080/Apps/assets/media/rushanruibo'
 
 VUE_APP_SYS_PORT = '8060'
 #VUE_APP_liveQing = 'http://192.168.3.226:8059/liveQing'

src/views/Screen/index.vue

@@ -457,6 +457,25 @@ export default {
 			finishNum:706,
 			monitorNum:40,
 			areaSwitchFalg:false,
+			personnelList:[
+				{
+					longitude: 121.70710830038986,
+					latitude: 36.853636402927986,
+					height: 100,
+					name: "张三",
+					status: "online", // 在线
+					avatar: "/static/images/avatars/zhangsan.png", // 头像
+				},
+				{
+					longitude: 121.70810830038986,
+					latitude: 36.854636402927986,
+					height: 100,
+					name: "李四",
+					status: "offline", // 离线
+					avatar: "/static/images/avatars/lisi.png", // 头像
+				},
+				// 其他人员数据...
+			]
 		}
 	},
 	mounted() {
@@ -465,6 +484,18 @@ export default {
 			var views = that.$el.querySelectorAll("#b0_>div");
 			var a0a_ = that.$el.querySelector("#a0a_");
 
+
+			// var handler = new Cesium.ScreenSpaceEventHandler(that.viewer.scene.canvas);
+			// handler.setInputAction(function(movement) {
+			// 	var pickedObject = that.viewer.scene.pick(movement.endPosition);
+			// 	if (Cesium.defined(pickedObject) && pickedObject.id && pickedObject.id.description) {
+			// 		// 显示人员信息
+			// 		var description = pickedObject.id.description;
+			// 		that.showPersonInfo(description);
+			// 	}
+			// }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
+
+
 			// header 事件控制
 			qf.funchain(function(start, t, f){
 				var m = this;
@@ -646,7 +677,19 @@ export default {
 		});
 	},
 	methods: {
+		showPersonInfo(description) {
+			// 使用 Cesium 的 InfoBox 显示信息
+			this.viewer.selectedEntity = this.viewer.entities.add({
+				description: description,
+			});
+			this.viewer.infoBox.frame.sandbox = "allow-same-origin allow-top-navigation allow-pointer-lock allow-popups allow-forms allow-scripts";
+			this.viewer.infoBox.frame.src = "about:blank";
+			this.viewer.infoBox.frame.contentDocument.write(description);
+			this.viewer.infoBox.frame.contentDocument.close();
+			this.viewer.infoBox.viewModel.showInfo = true;
+		},
 		module0(m, t, f, dmIndex, view){		// 数据总览
+			console.log(m,t,f,dmIndex,'数据总览')
 			var self = this, Catch = {}, viewData = self['view'+dmIndex];
 			var mediaUrlHost = process.env.VUE_APP_liveQing;
 
@@ -678,28 +721,30 @@ export default {
 					
 					// 创建模型
 					m.createModel();
+					m.createPersonModel();
 				};
 
 				m.initDeviceVisual = function(){
-					m.openVisual();
+					// m.openVisual();
 
 					setTimeout(() => {
 						m.createModel();
+						m.createPersonModel();
 					}, 1500);
 				};
 
 				// 视角
-				m.openVisual = function(){
-					fg3d.Assist.flyToLnglat({
-						longitude:'121.70710830038986',
-						latitude:'36.853636402927986',
-						height:'1000',
-						heading:'0',
-						pitch:Cesium.Math.toRadians(-45),
-						// roll:'6.283179332387251',
-						duration: 1.5,
-					});
-				};
+				// m.openVisual = function(){
+				// 	fg3d.Assist.flyToLnglat({
+				// 		longitude:'121.70710830038986',
+				// 		latitude:'36.853636402927986',
+				// 		height:'1000',
+				// 		heading:'0',
+				// 		pitch:Cesium.Math.toRadians(-45),
+				// 		// roll:'6.283179332387251',
+				// 		duration: 1.5,
+				// 	});
+				// };
 
 				// 创建模型
 				m.createModel = function(){
@@ -848,7 +893,168 @@ export default {
 						return res.body || []
 					});
 				};
-				
+
+				// 创建人员定位卡模型
+				m.createPersonModel = function() {
+					// 人员列表
+					m.personCardList().then(function(list) {
+						console.log(list, 'list');
+						m.bgEntities = m.bgEntities || {};
+						for (var item of list) {
+							var lng = Number(item.lng);
+							var lat =  Number(item.lat);
+							var height = Number(item.hight);
+							var position = Cesium.Cartesian3.fromDegrees(lng, lat, height);
+							console.log(lng, lat, height)
+							var url = "/static/images/poi-marker-default.png";
+							// 创建人员标记
+							var entity = self.viewer.entities.add({
+								position: position,
+								// 'model': {
+								// 	'uri': url,
+								// 	'scale': 1.01,
+								// 	'shadows':'ENABLED',
+								// 	'color':Cesium.Color.WHEAT,
+								// 	//'colorBlendMode':'HIGHLIGHT',
+								// 	//'colorBlendAmount':0.1,
+								// 	//'lightColor':Cesium.Color.RED,
+								// },
+								// ellipse: {
+								// 	semiMinorAxis: 40.0,
+								// 	semiMajorAxis: 60.0,
+								// 	material: url
+								// },
+								label: {
+									text: item.perNme,
+									font: 'normal 28px sans-serif',
+									scale: 0.5,
+									color: Cesium.Color.WHITE,
+									showBackground: true,
+									heightReference: 0,
+									horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
+									verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
+									distanceDisplayCondition: new Cesium.DistanceDisplayCondition(10.0, 8000.0),
+									disableDepthTestDistance: 2500.0,
+									heightReference: Cesium.HeightReference.CLAMP_TO_GROUND, // 确保贴地显示
+									pixelOffset: new Cesium.Cartesian2(0, -35),
+									// eyeOffset: new Cesium.Cartesian2(0, 5.5),
+									fillColor: Cesium.Color.WHITE,
+									backgroundColor: new Cesium.Color(0.0, 0.486, 0.650, .8),
+								},
+								billboard: {
+									image: '/static/images/poi-marker-default.png', // 使用头像作为标记
+									scale: .5,
+									heightReference: Cesium.HeightReference.CLAMP_TO_GROUND, // 确保贴地显示
+									distanceDisplayCondition: new Cesium.DistanceDisplayCondition(10.0, 8000.0),
+									horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
+									verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
+									// pixelOffset: new Cesium.Cartesian2(0, 0), // 确保没有像素偏移
+									// eyeOffset: new Cesium.Cartesian2(0, 5.5), // 确保没有视角偏移
+								},
+								description: `
+									<div>
+										<h4>${item.perNme}</h4>
+										
+									</div>
+								`, 
+							});
+							entity.info = item;
+							m.bgEntities[item.perNme] = entity;
+						}
+					});
+				};
+				// 更新人员定位卡模型监测数据
+				m.updatePersonModelData = function(){
+					m.personCardList().then(function(list){
+						for(var item of list){
+							console.log(item)
+							// var entity = m.bgEntities[item.equipno];
+							// entity && (entity.info = item);
+							// var modelColor = modelAlarmOptons[item.isAlarm];
+	
+							// entity.label.fillColor.setValue(modelColor.fillColor);
+							// entity.label.backgroundColor.setValue(modelColor.backgroundColor);
+							//entity.Wave.Entity.color.setValue(modelColor.WaveColor);
+
+							if(entity.infoWindow){
+								m.updateWindowContent(entity.md, entity.info);
+							};
+						};
+					});
+				};
+				// 人员定位卡列表
+				m.personCardList = function(){
+					return reqApi.common.requstEdge('get', '/api/per/screen/real', {}).then((res)=>{
+						var listPersonCard = res.body || [];
+						console.log(listPersonCard,'listPersonCard')
+						return listPersonCard;
+					});
+				};
+
+				// 添加人员定位卡窗口内容
+				m.updatePersonWindowContent = function(md, item){
+					console.log(md, item,'md, item')
+					// 设置按钮颜色
+					// if(item.isAlarm){
+					// 	md.Wrap.classList.add('alarm');
+					// }else{
+					// 	md.Wrap.classList.remove('alarm');
+					// };
+
+					// 设置数值
+					// var val1Name = md.type === '6' ? '降雨量' : 'x';
+					// var part1 = '<p>'+item.equipname+'</p><p>'+val1Name+': '+item.x+'</p>';
+					// var part2 = item.y ? '<p>y: '+item.y+'</p>' + '<p>z: '+item.z+'</p>' : '';
+					// md.el.innerHTML = '<div style="margin:5px;">' +part1+ part2 + '</div>';
+				};
+				// 打开人员定位卡驱动窗口
+				t.openPersonWindow = function(entity){
+					var info = entity.info;
+					console.log(info,'!!!!!!!!')
+					if(info && !entity.infoWindow){
+						var position = entity.position._value;
+
+						var popClass = info.isAlarm ? 'popupBgImage BgAlarm' : 'popupBgImage';
+						
+						// 生成窗口
+						var popWindow = m['popWindow' + info.equipno] = qf.UI.popWindow({
+							name:'',
+							pointer:{
+								point:'bottom',
+								show:true,
+								x:68,
+							},
+							closeButton:{},
+							close: function(){
+								entity.infoWindow.remove();
+								delete entity.infoWindow;
+								delete m['popWindow' + info.equipno];
+							},
+							container:document.createElement('div'),		// id || Element对象
+							html:'<div class="'+popClass+'" style="color:#fff;width:150px;font-size:15px;padding:10px;"></div>',
+							onload: function(md){
+								var equipno = info.equipno;
+								md.type = info.devicetype;
+								if(equipno){
+									m.updatePersonWindowContent(md, info);
+
+									entity.md = md;
+									// 创建窗口
+									entity.infoWindow = new fg3d.Plugins.View(position, md.Wrap, {
+										render: function(){
+											return {
+												position:position,
+												y:-60,
+												x:-75,
+											};
+										},
+									});
+								};
+							},
+						});
+					};
+				};
+
 				// 环境监测设备列表
 				t.envirDeviceList = function(){
 					return Catch.envirDevices && new Promise(function(a, b){return a(Catch.envirDevices)}) || reqApi.common.requstEdge('get', '/tab/datascreen/enviequip', {}).then((res)=>{
@@ -963,24 +1169,38 @@ export default {
 
 				// 添加窗口内容
 				m.updateWindowContent = function(md, item){
+					console.log(md,item)
 					// 设置按钮颜色
 					if(item.isAlarm){
 						md.Wrap.classList.add('alarm');
 					}else{
 						md.Wrap.classList.remove('alarm');
 					};
+					if(item.perNme){
+						var part1 = '<p>姓名：'+item.perNme+'</p>'
+						var part2 = '<p>性别：'+item.perSex+'</p>';
+						var part3 = '<p>工号：'+item.perNumber+'</p>';
+						var part4 = '<p>部门：'+item.perDept+'</p>';
+						var part5 = '<p>职务：'+item.perOffice+'</p>';
+						var part6 = '<p>定位卡ID：'+item.phone+'</p>';
+						var part7 = '<p>手机号：'+item.perTel+'</p>';
+						md.el.innerHTML = '<div style="margin:5px;">' + part1 + part2 +  part3 +  part4 +  part5 +  part6 + part7 + '</div>';
+					}else{
+						// 设置数值
+						var val1Name = md.type === '6' ? '降雨量' : 'x';
+						var part1 = '<p>'+item.equipname+'</p><p>'+val1Name+': '+item.x+'</p>';
+						var part2 = item.y ? '<p>y: '+item.y+'</p>' + '<p>z: '+item.z+'</p>' : '';
+						md.el.innerHTML = '<div style="margin:5px;">' +part1+ part2 + '</div>';
+					}
 
-					// 设置数值
-					var val1Name = md.type === '6' ? '降雨量' : 'x';
-					var part1 = '<p>'+item.equipname+'</p><p>'+val1Name+': '+item.x+'</p>';
-					var part2 = item.y ? '<p>y: '+item.y+'</p>' + '<p>z: '+item.z+'</p>' : '';
-					md.el.innerHTML = '<div style="margin:5px;">' +part1+ part2 + '</div>';
+					
 				};
 				
 				// 打开驱动窗口
 				t.openDeviceWindow = function(entity){
 					var info = entity.info;
-					if(info && !entity.infoWindow){
+					console.log(entity,'?????????')
+					if(info && !entity.infoWindow&& info.equipname){
 						var position = entity.position._value;
 
 						var popClass = info.isAlarm ? 'popupBgImage BgAlarm' : 'popupBgImage';
@@ -1007,6 +1227,46 @@ export default {
 								if(equipno){
 									m.updateWindowContent(md, info);
 
+									entity.md = md;
+									// 创建窗口
+									entity.infoWindow = new fg3d.Plugins.View(position, md.Wrap, {
+										render: function(){
+											return {
+												position:position,
+												y:-60,
+												x:-75,
+											};
+										},
+									});
+								};
+							},
+						});
+					}else if(info && !entity.infoWindow&&info.perNme){
+						console.log(1111)
+						var position = entity.position._value;
+						var popClass = info.isAlarm ? 'popupBgImage BgAlarm' : 'popupBgImage';
+						// 生成窗口
+						var popWindow = m['popWindow' + info.perNme] = qf.UI.popWindow({
+							name:'',
+							pointer:{
+								point:'bottom',
+								show:true,
+								x:68,
+							},
+							closeButton:{},
+							close: function(){
+								entity.infoWindow.remove();
+								delete entity.infoWindow;
+								delete m['popWindow' + info.perNme];
+							},
+							container:document.createElement('div'),		// id || Element对象
+							html:'<div class="'+popClass+'" style="color:#fff;width:150px;font-size:15px;padding:10px;"></div>',
+							onload: function(md){
+								var perNme = info.perNme;
+								md.perDept = info.perDept;
+								if(perNme){
+									m.updateWindowContent(md, info);
+
 									entity.md = md;
 									// 创建窗口
 									entity.infoWindow = new fg3d.Plugins.View(position, md.Wrap, {
@@ -1262,9 +1522,10 @@ export default {
 					m.percarCount();
 
 					// 边坡实时监测
-					m.timer01 = new qf.Async.timerCtrl(60000, 'timer01');
+					m.timer01 = new qf.Async.timerCtrl(30000, 'timer01');
 					m.timer01(function(){
 						m.updateModelData();
+						m.updatePersonModelData()
 					}); m.timer01.start();