From d6c02727ff5005990c704873668769ee2c6375b4 Mon Sep 17 00:00:00 2001
From: puzhibing <393733352@qq.com>
Date: 星期三, 26 七月 2023 17:16:49 +0800
Subject: [PATCH] 开发2.0功能

---
 management/guns-admin/src/main/webapp/WEB-INF/view/blackboardBlank.html |  369 ++++++++++++++++++++--------------------------------
 1 files changed, 143 insertions(+), 226 deletions(-)

diff --git a/management/guns-admin/src/main/webapp/WEB-INF/view/blackboardBlank.html b/management/guns-admin/src/main/webapp/WEB-INF/view/blackboardBlank.html
index 2b98994..a48a2a9 100644
--- a/management/guns-admin/src/main/webapp/WEB-INF/view/blackboardBlank.html
+++ b/management/guns-admin/src/main/webapp/WEB-INF/view/blackboardBlank.html
@@ -5,8 +5,7 @@
 			<div class="row" style="border-style: none none solid; border-color: #e7eaec; border-width: 1px 0px;">
 				<ul class="breadcrumb" style="height: 45px; line-height: 45px; padding-left: 20px;">
 					<li><a href="#" class="statistics">运营数据总览</a></li>
-					<li><a href="#" class="map">车辆地图总览</a></li>
-					<li><a href="#" class="order">订单热点图</a></li>
+					<li><a href="#" class="map">地图总览</a></li>
 				</ul>
 			</div>
 
@@ -139,7 +138,7 @@
 						</select>
 					</div>
 					<div class="initialLevel col-sm-2 control-label form-group" >
-						<button type="button" class="btn btn-primary" onclick="getData()" style="height: 33px">
+						<button type="button" class="btn btn-primary" onclick="getMapData()" style="height: 33px">
 							<i class="fa fa-search"></i>&nbsp;查询
 						</button>
 						<button type="button" class="btn btn-primary button-margin" onclick="reset()" style="height: 33px">
@@ -162,68 +161,25 @@
 							<label id="onLineDriverCount">${onLineDriverCount}</label>
 							<label>人</label>
 						</div>
-					</div>
-				</div>
-			</div>
-
-			<div class="row content" id="orderDiv">
-				<div class="initialLevel col-sm-12 control-label form-group" style="cursor: pointer;text-align: left;">
-					<div class="initialLevel col-sm-2 control-label form-group"  >
-						<select class="input-group" id="orderType" style="width: 180px;height: 33px" name="orderType">
-							<option value="">请选择订单类型</option>
-							<option value="1">未接单</option>
-							<option value="2">服务中</option>
-							<option value="3">已完成</option>
-							<option value="4">已取消</option>
-						</select>
-					</div>
-					<div class="initialLevel col-sm-2 control-label form-group"  >
-						<button type="button" class="btn btn-primary " onclick="getDataOrder()" style="height: 33px">
-							<i class="fa fa-search"></i>&nbsp;查询
-						</button>
-						<button type="button" class="btn btn-primary button-margin" onclick="resetOrder()" style="height: 33px">
-							<i class="fa fa-trash"></i>&nbsp;重置
-						</button>
-					</div>
-				</div>
-				<div class="col-sm-10" >
-					<input hidden id="allList" value="${allList}">
-					<div class="initialLevel col-sm-12 control-label form-group" style="cursor: pointer;text-align: left;">
-						<div class="initialLevel col-sm-12 control-label form-group"  >
-							<div id="containerOrder" ></div>
-							<div id="panelOrder" ></div>
-						</div>
-					</div>
-
-					<div class="initialLevel col-sm-12 control-label form-group" style="cursor: pointer;text-align: left;">
 						<div class="initialLevel col-sm-2 control-label form-group"  >
-							<label>未接单</label>
+							<label>未接单:</label>
 							<label id="pendingOrderCount">${pendingOrderCount}</label>
 						</div>
 						<div class="initialLevel col-sm-2 control-label form-group"  >
-							<label>服务中</label>
+							<label>服务中:</label>
 							<label id="serverCount">${serverCount}</label>
 						</div>
 						<div class="initialLevel col-sm-2 control-label form-group"  >
-							<label>已完成</label>
+							<label>已完成:</label>
 							<label id="finishCount">${finishCount}</label>
 						</div>
 						<div class="initialLevel col-sm-2 control-label form-group"  >
-							<label>已取消</label>
+							<label>已取消:</label>
 							<label id="cancelCount">${cancelCount}</label>
 						</div>
 					</div>
 				</div>
-				<div class="col-sm-2">
-					<div class="ibox float-e-margins">
-						<div class="ibox-content">
-							<div class="form-horizontal" id="serverOrder" style="overflow:scroll;width: 100%; height:650px;">
-							</div>
-						</div>
-					</div>
-				</div>
 			</div>
-
 		</div>
 	</div>
 </div>
@@ -366,7 +322,6 @@
 					queryOrderCount()
 					break;
 				case "map":
-					map("",113.264434,23.129162);
 					break;
 				case "order":
 					mapOrder("");
@@ -745,187 +700,149 @@
 		ajax.start();
 	}
 
-	function getDataOrder(){
-		var ajax = new $ax(Feng.ctxPath + "/tHomePage/getMap", function (data) {
-			document.getElementById("onLineDriverCount").innerText=data.onLineDriverCount
-			document.getElementById("pendingOrderCount").innerText=data.pendingOrderCount
-			document.getElementById("serverCount").innerText=data.serverCount
-			document.getElementById("finishCount").innerText=data.finishCount
-			document.getElementById("cancelCount").innerText=data.cancelCount
-			$('#allList').val(data.allList);
-			console.log(data.allList)
-			mapOrder(data.allList)
-			getOrderData()
-
-		}, function (data) {
-		});
-		ajax.set("agentId",$("#agentId").val());
-		ajax.set("type",$("#orderType").val());
-		ajax.start();
-	}
-	function resetOrder(){
-		$("#agentId").val('')
-		$("#orderType").val('')
-		var ajax = new $ax(Feng.ctxPath + "/tHomePage/getMap", function (data) {
-			document.getElementById("onLineDriverCount").innerText=data.onLineDriverCount
-			document.getElementById("pendingOrderCount").innerText=data.pendingOrderCount
-			document.getElementById("serverCount").innerText=data.serverCount
-			document.getElementById("finishCount").innerText=data.finishCount
-			document.getElementById("cancelCount").innerText=data.cancelCount
-			$('#allList').val(data.allList);
-			mapOrder(data.allList)
-			getOrderData()
-		}, function (data) {
-		});
-		ajax.set("agentId",$("#agentId").val());
-		ajax.set("type",$("#orderType").val());
-		ajax.start();
-	}
 
 
-	function map(e,addressLon,addressLat){
-		window._AMapSecurityConfig = {
-			securityJsCode:'b62d9146929db08c4c2f4537d045320d',
-		};
-		laydate.render({
-			elem: '#createTime',
-			type: 'date',
-			range: true
-		});
+    // 创建地图实例
+    var map = new AMap.Map("container", {
+        zoom: 13,
+        center: [103.924660,30.588548],
+        resizeEnable: true
+    });
 
-		AMapLoader.reset() // 需要把这个reset一下
-		AMapLoader.load({
-			"key": "1d43098bcd98ab124623e7e4bcc9595e",              // 申请好的Web端开发者Key,首次调用 load 时必填
-			"version": "2.0",   // 指定要加载的 JSAPI 的版本,缺省时默认为 1.4.15
-			"plugins": ['AMap.Driving'],           // 需要使用的的插件列表,如比例尺'AMap.Scale'等
-			"AMapUI": {             // 是否加载 AMapUI,缺省不加载
-				"version": '1.1',   // AMapUI 版本
-				"plugins":['overlay/SimpleMarker'],       // 需要加载的 AMapUI ui插件
-			},
-			"Loca":{                // 是否加载 Loca, 缺省不加载
-				"version": '2.0'  // Loca 版本
-			},
-		}).then((AMap)=>{
-			//初始化地图对象,加载地图
-			var map = new AMap.Map('container', {
-				viewMode: '2D', // 默认使用 2D 模式,如果希望使用带有俯仰角的 3D 模式,请设置 viewMode: '3D',
-				zoom:10, //初始化地图层级
-				center: [addressLon,addressLat] //初始化地图中心点
-			});
-			// map.clearMap();  // 清除地图覆盖物
-			// 经纬度坐标数组
-			const  onLineDriver = $('#onLineDriver').val();
-			var list1 = JSON.stringify(onLineDriver)
-			const jsonArr = JSON.parse(list1)
-			const jsonArr1 = JSON.parse(jsonArr);
-			console.log(jsonArr1)
-			M = jsonArr1;
-			M.forEach(function(marker) {
-				new AMap.Marker({
-					map: map,
-					icon: marker[2]==1?'https://csxdj.obs.cn-south-1.myhuaweicloud.com/c1d2f38187de40daa353fcc70993288e.png':'https://csxdj.obs.cn-south-1.myhuaweicloud.com/c1d2f38187de40daa353fcc70993288e.png',
-					position: [marker[0], marker[1]],
-					offset: new AMap.Pixel(-13, -30)
-				});
-			});
+	let texts = [];
+	function getMapData() {
+        map.remove(texts);
+        var ajax = new $ax(Feng.ctxPath + "/tHomePage/getMap", function (data) {
+			let lobby = data.lobby;//大厅
+			let service = data.service;//服务中
+			let receivedOrder = data.receivedOrder;//已接单
+			let leisure = data.leisure;//空闲
+			let cancel = data.cancel;//流失
 
-			// var center = map.getCenter();
-			// var centerText = '当前中心点坐标:' + center.getLng() + ',' + center.getLat();
-			// 添加事件监听, 使地图自适应显示到合适的范围
-			AMap.event.addDomListener(document.getElementById('container'), 'click', function() {
-				var newCenter = map.setFitView();
-			});
-		}).catch((e)=>{
-			console.error(e);  //加载错误提示
-		});
-	}
+            for (let i = 0; i < cancel.length; i++) {
+				let lonLat = cancel[i].lonLat;
+                let positon = lonLat.split(",");
+                var text = new AMap.Text({
+                    text:'流 失',
+                    anchor:'center', // 设置文本标记锚点
+                    draggable:true,
+                    cursor:'pointer',
+                    style:{
+                        // 'padding': '.75rem 1.25rem',
+                        // 'margin-bottom': '1rem',
+                        // 'border-radius': '.25rem',
+                        // 'background-color': 'white',
+                        // 'width': '15rem',
+                        'border-width': 0,
+                        'box-shadow': '0 2px 6px 0 rgba(114, 124, 245, .5)',
+                        'text-align': 'center',
+                        'font-size': '16px',
+                        'color': 'red'
+                    },
+                    position: [parseFloat(positon[0]),parseFloat(positon[1])]
+                });
+                text.setMap(map);
+                texts.push(text);
+            }
+            for (let i = 0; i < lobby.length; i++) {
+                let lonLat = lobby[i].lonLat;
+                let positon = lonLat.split(",");
+                var text = new AMap.Text({
+                    text:'大 厅',
+                    anchor:'center', // 设置文本标记锚点
+                    draggable:true,
+                    cursor:'pointer',
+                    style:{
+                        'border-width': 0,
+                        'box-shadow': '0 2px 6px 0 rgba(114, 124, 245, .5)',
+                        'text-align': 'center',
+                        'font-size': '16px',
+                        'color': 'blue'
+                    },
+                    position: [parseFloat(positon[0]),parseFloat(positon[1])]
+                });
+                text.setMap(map);
+                texts.push(text);
+            }
 
-	function mapOrder(e){
-		window._AMapSecurityConfig = {
-			securityJsCode:'b62d9146929db08c4c2f4537d045320d',
-		};
-		AMapLoader.reset() // 需要把这个reset一下
-		AMapLoader.load({
-			"key": "1d43098bcd98ab124623e7e4bcc9595e",              // 申请好的Web端开发者Key,首次调用 load 时必填
-			"version": "2.0",   // 指定要加载的 JSAPI 的版本,缺省时默认为 1.4.15
-			"plugins": ['AMap.Driving'],           // 需要使用的的插件列表,如比例尺'AMap.Scale'等
-			"AMapUI": {             // 是否加载 AMapUI,缺省不加载
-				"version": '1.1',   // AMapUI 版本
-				"plugins":['overlay/SimpleMarker'],       // 需要加载的 AMapUI ui插件
-			},
-			"Loca":{                // 是否加载 Loca, 缺省不加载
-				"version": '2.0'  // Loca 版本
-			},
-		}).then((AMap)=>{
-			//初始化地图对象,加载地图
-			var map = new AMap.Map('containerOrder', {
-				viewMode: '2D', // 默认使用 2D 模式,如果希望使用带有俯仰角的 3D 模式,请设置 viewMode: '3D',
-				zoom:10, //初始化地图层级
-				center: [113.264434,23.129162] //初始化地图中心点
-			});
-			// map.clearMap();  // 清除地图覆盖物
-			// 经纬度坐标数组
-			var  allList;
-			if(e==""){
-				allList = $('#allList').val();
-				var list = JSON.stringify(allList)
-				const jsonArray = JSON.parse(list)
-				const jsonArray1 = JSON.parse(jsonArray);
-				console.log(jsonArray1)
-				M = jsonArray1;
-			}else{
-				M=e;
-			}
-			console.log(M)
-			M.forEach(function(marker) {
-				new AMap.Marker({
-					map: map,
-					icon: marker[2]==301?'https://csxdj.obs.cn-south-1.myhuaweicloud.com/8a6bb84da305438faba9fa1552c59f64.png':((marker[2]==109||marker[2]==107||marker[2]==108)?'https://csxdj.obs.cn-south-1.myhuaweicloud.com/6132e18884e24916a507b4b55d38d07b.png':
-									(marker[2]==101?'https://csxdj.obs.cn-south-1.myhuaweicloud.com/7461e4a7e4004c548e91aafa538246a1.png':'https://csxdj.obs.cn-south-1.myhuaweicloud.com/d8739241fa36482b80df7cacac2cc3d1.png')
-					),
-					position: [marker[0], marker[1]],
-					offset: new AMap.Pixel(-13, -30)
-				});
-			});
-			// var center = map.getCenter();
-			// var centerText = '当前中心点坐标:' + center.getLng() + ',' + center.getLat();
-			// 添加事件监听, 使地图自适应显示到合适的范围
-			AMap.event.addDomListener(document.getElementById('containerOrder'), 'click', function() {
-				var newCenter = map.setFitView();
-			});
-		}).catch((e)=>{
-			console.error(e);  //加载错误提示
-		});
-	}
+            for (let i = 0; i < leisure.length; i++) {
+                let name = leisure[i].name;
+                let lonLat = leisure[i].lonLat;
+                let positon = lonLat.split(",");
+                var text = new AMap.Text({
+                    text:name,
+                    anchor:'center', // 设置文本标记锚点
+                    draggable:true,
+                    cursor:'pointer',
+                    style:{
+                        'border-width': 0,
+                        'box-shadow': '0 2px 6px 0 rgba(114, 124, 245, .5)',
+                        'text-align': 'center',
+                        'font-size': '16px',
+                        'color': 'white',
+						'background-color':'green'
+                    },
+                    position: [parseFloat(positon[0]),parseFloat(positon[1])]
+                });
+                text.setMap(map);
+                texts.push(text);
+            }
 
-	function getOrderData(){
-		$.ajax({
-			url: Feng.ctxPath + '/tHomePage/getServerOrder',
-			type: 'POST',
-			data: {
-				agentId: $("#agentId").val()
-			},
-			success: function (res) {
-				var order = res.serverList
-				var str = '<table><tr><h3>服务中</h3></tr><hr/><br>';
-				if(order.length > 0){
-					for(var i in order){
-						console.log(order[i].startTime)
-						str +=
-								'<tr><img src=' + order[i].avatar + ' style="height: 40px;width: 40px"></img>' + order[i].driverName +'</tr><br>' +
-								'<table><tr><td class="name1">驾龄</td><td class="name1">' + order[i].drivingExperience + '年'+'</td><td class="name1">代驾次数</td><td class="name1">' + order[i].valetDrivingCount + '次'+'</td></tr><br></table>' +
-								'<table><br><tr><td class="name1">出行时间</td><td class="name1">' + order[i].startTime + '</td></tr>' +
-								'<tr><td class="name1">起点</td><td class="name1">' + order[i].startAddress + '</td></tr>' +
-								'<tr><td class="name1">终点</td><td class="name1">' + order[i].endAddress + '</td></tr></table><br>' +
-								'<table><tr><td class="name1">预估费用</td><td class="name1">' + order[i].estimatedPrice + '元'+'</td><td class="name1">行驶里程</td><td class="name1">' + order[i].mileageTraveled + '公里'+'</td></tr>' +
-								'<tr><td class="name1">等待时间</td><td class="name1">' + order[i].waitTime + '分钟'+'</td><td class="name1">行驶时间</td><td class="name1">' + order[i].goTime + '分钟'+'</td></tr></table><hr/>';
-					}
-				}
-				str += '</table>';
-				$('#serverOrder').html(str);
-			}
-		});
-	}
+            for (let i = 0; i < service.length; i++) {
+                let name = service[i].name;
+                let lonLat = service[i].lonLat;
+                let positon = lonLat.split(",");
+                var text = new AMap.Text({
+                    text:name,
+                    anchor:'center', // 设置文本标记锚点
+                    draggable:true,
+                    cursor:'pointer',
+                    style:{
+                        'border-width': 0,
+                        'box-shadow': '0 2px 6px 0 rgba(114, 124, 245, .5)',
+                        'text-align': 'center',
+                        'font-size': '16px',
+                        'color': 'white',
+                        'background-color':'red'
+                    },
+                    position: [parseFloat(positon[0]),parseFloat(positon[1])]
+                });
+                text.setMap(map);
+                texts.push(text);
+            }
+
+            for (let i = 0; i < receivedOrder.length; i++) {
+                let name = receivedOrder[i].name;
+                let lonLat = receivedOrder[i].lonLat;
+                let positon = lonLat.split(",");
+                var text = new AMap.Text({
+                    text:name,
+                    anchor:'center', // 设置文本标记锚点
+                    draggable:true,
+                    cursor:'pointer',
+                    style:{
+                        'border-width': 0,
+                        'box-shadow': '0 2px 6px 0 rgba(114, 124, 245, .5)',
+                        'text-align': 'center',
+                        'font-size': '16px',
+                        'color': 'black',
+                        'background-color':'yellow'
+                    },
+                    position: [parseFloat(positon[0]),parseFloat(positon[1])]
+                });
+                text.setMap(map);
+                texts.push(text);
+            }
+        }, function (data) {
+        });
+        ajax.set("agentId", $("#agentId").val());
+        ajax.start();
+    }
+
+    getMapData();
+    setInterval(function () {
+        getMapData();
+    }, 30000);
 
 </script>
 @}

--
Gitblit v1.7.1