liujie
2023-08-16 5cb1979f05446792cc33a8cb6b7aaae906da5a70
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>
@@ -121,7 +120,6 @@
                  </div><br/>
                  <div id="chart1" style="height: 90%;width: 100%"></div>
               </div>
               <div class="initialLevel col-sm-4 control-label form-group" >
               </div>
@@ -139,7 +137,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,76 +160,60 @@
                     <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 class="row content" id="orderDiv">-->
            <!--<div class="col-sm-10" >-->
               <!--<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 id="pendingOrderCount">${pendingOrderCount}</label>-->
                  <!--</div>-->
                  <!--<div class="initialLevel col-sm-2 control-label form-group"  >-->
                     <!--<label>服务中:</label>-->
                     <!--<label id="serverCount">${serverCount}</label>-->
                  <!--</div>-->
                  <!--<div class="initialLevel col-sm-2 control-label form-group"  >-->
                     <!--<label>已完成:</label>-->
                     <!--<label id="finishCount">${finishCount}</label>-->
                  <!--</div>-->
                  <!--<div class="initialLevel col-sm-2 control-label form-group"  >-->
                     <!--<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>
<script type="text/javascript" src="http://tajs.qq.com/stats?sId=9051096" charset="UTF-8"></script>
<script src="${ctxPath}/static/modular/system/tCoupon/tAgent_info.js"></script>
<script src="${ctxPath}/static/modular/system/tCoupon/tAgent.js"></script>
<link rel="stylesheet" href="${ctxPath}/static/css/plugins/lineProgressbar/jquery.lineProgressbar.css">
<script src="${ctxPath}/static/js/plugins/lineProgressbar/jquery.lineProgressbar.js"></script>
@@ -366,7 +348,6 @@
               queryOrderCount()
               break;
            case "map":
               map("",113.264434,23.129162);
               break;
            case "order":
               mapOrder("");
@@ -375,12 +356,6 @@
         }
      })
      // $('#mapDiv').hide()
      // $('#orderDiv').hide()
      // loading()
      // orderByMonth(new Date().getMonth() + 1)
      // orderByYear(new Date().getFullYear())
      // queryOrderCount()
   })
   function selectYear(e){
@@ -417,11 +392,16 @@
         selectMonth(value)// change 每点一次都会监听一遍
      }
   });
   laydate.render({
      elem: '#createTime',
      type: 'date',
      range: true
   });
   // 进度条加载
   function loading(){
      var options = $.extend({
         percentage : $('#agentTotal').text(),
         percentage : $('#agentTotal').text()<100?$('#agentTotal').text():($('#agentTotal').text()>1000?$('#agentTotal').text()/100:$('#agentTotal').text()/10),
         ShowProgressCount: false,
         duration: 10,
@@ -434,7 +414,7 @@
      });
      $('#pro1').LineProgressbar(options);
      var options = $.extend({
         percentage : $('#agentMonthTotal').text(),
         percentage : $('#agentMonthTotal').text()<100?$('#agentMonthTotal').text():($('#agentMonthTotal').text()>1000?$('#agentMonthTotal').text()/100:$('#agentMonthTotal').text()/10),
         ShowProgressCount: false,
         duration: 10,
@@ -460,7 +440,7 @@
      });
      $('#pro3').LineProgressbar(options);
      var options = $.extend({
         percentage : $('#driverMonthTotal').text(),
         percentage : $('#driverMonthTotal').text()<100?$('#driverMonthTotal').text():($('#driverMonthTotal').text()>1000?$('#driverMonthTotal').text()/100:$('#driverMonthTotal').text()/10),
         ShowProgressCount: false,
         duration: 10,
@@ -715,9 +695,9 @@
         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)
         map(data.allList,data.addressLon,data.addressLat)
         $('#onLineDriver').val(data.onLineDriver);
         console.log(data.onLineDriver)
         map(data.onLineDriver,data.addressLon,data.addressLat)
         getOrderData()
      }, function (data) {
@@ -735,45 +715,8 @@
         document.getElementById("serverCount").innerText=data.serverCount
         document.getElementById("finishCount").innerText=data.finishCount
         document.getElementById("cancelCount").innerText=data.cancelCount
         $('#allList').val(data.allList);
         map(data.allList,data.addressLon,data.addressLat)
         getOrderData()
      }, function (data) {
      });
      ajax.set("agentId",$("#agentId").val());
      ajax.set("type",$("#orderType").val());
      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)
         $('#onLineDriver').val(data.onLineDriver);
         map(data.onLineDriver,data.addressLon,data.addressLat)
         getOrderData()
      }, function (data) {
      });
@@ -783,62 +726,143 @@
   }
   function map(e,addressLon,addressLat){
      window._AMapSecurityConfig = {
         securityJsCode:'b62d9146929db08c4c2f4537d045320d',
      };
      laydate.render({
         elem: '#createTime',
         type: 'date',
         range: 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)
            });
         });
    // 创建地图实例
    var map = new AMap.Map("container", {
        zoom: 13,
        center: [103.924660,30.588548],
        resizeEnable: true
    });
         // 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);  //加载错误提示
      });
   }
    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;//流失
            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);
            }
            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);
            }
            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);
   function mapOrder(e){
      window._AMapSecurityConfig = {