puzhibing
2023-02-11 521efb9bc33d52ef4772f0b30f8a371ba4b0070c
ManagementIGOTravel/guns-admin/src/main/webapp/static/home.js
@@ -1,7 +1,5 @@
var uid = $("#3dnzNxplgTiHaddR",top.window.document).val();
var markers = [];
var companyId = '';
var mark_last;//记录上一次点击的mark
var Home = {
    id: "VersionTable",   //表格id
@@ -110,67 +108,41 @@
    });
    getData();
    getCompanyByUid();
    // setInterval(function () {
    //     Home.webSocketClient(null);
    // }, 60000 * 5);
    // setInterval(function () {
    //     Home.getAllOrder();
    // }, 60000 * 5);
    setInterval(function () {
        Home.webSocketClient(null);
    }, 60000 * 5);
    setInterval(function () {
        Home.getAllOrder();
    }, 60000 * 5);
});
var map = new AMap.Map('container',{
    resizeEnable: true,
    zoom:10
let map;
let markers = [];
let map2;
let markers2 = [];
function initMap() {
    // The location of Uluru
    const uluru = { lat: 5.668430499999999, lng: -0.060339 };
    // The map, centered at Uluru
    map = new google.maps.Map(document.getElementById("map"), {
        zoom: 8,
        center: uluru,
});
var map_ = new AMap.Map('container_',{
    resizeEnable: true,
    mapStyle: 'amap://styles/1de318cbb8d12c02303a22c550b9ccc9',
    zoom:10
    // The map, centered at Uluru
    map2 = new google.maps.Map(document.getElementById("map1"), {
        zoom: 7,
        center: uluru,
});
}
var mouseTool = new AMap.MouseTool(map);
//监听draw事件可获取画好的覆盖物
var overlays = [];
var name = null;
var coordinate = '';//存储坐标
mouseTool.on('draw',function(e){
    overlays.push(e.obj);
    console.log(e.obj.getPath());
    switch (name) {
        case 'polyline':{//折线图
            var polyline = e.obj.getPath();
            getCoordinate(polyline);
            break;
        }
        case 'polygon':{//多边形
            var polygon = e.obj.getPath();
            getCoordinate(polygon);
            break;
        }
        case 'rectangle':{//矩形
            var rectangle = e.obj.getPath();
            getCoordinate(rectangle);
            break;
        }
        case 'circle':{//圆行
            var center = e.obj.getCenter();
            var radius = e.obj.getRadius();
            if(radius > 5000){
                Feng.error("创建电子围栏失败,圆半径不能大于5000米");
                return;
            }
            coordinate = center.lng + ',' + center.lat + ';' + radius;
            break;
        }
    }
    console.log(coordinate);
})
window.initMap = initMap;
function getCompanyByUid() {
    $.ajax({
@@ -285,100 +257,119 @@
}
function clearMarkers() {
    for (let i = 0; i < markers.length; i++) {
        markers[i].setMap(null);
    }
    markers = [];
}
function clearMarkers1() {
    for (let i = 0; i < markers2.length; i++) {
        markers2[i].setMap(null);
    }
    markers2 = [];
}
Home.webSocketClient = function (companyId) {
    $.ajax({
        url: Feng.ctxPath + '/home/getDriverPosition',
        type: 'POST',
        data: {
            companyId: companyId,
            //暂定修改此处,不改方法
            state:$("#driverState").val()
            companyId: companyId
        },
        success: function (res) {
            map.remove(markers);
            markers = [];
            var data = res.driver;
            clearMarkers();
            var data1 = res.driver1;
            var data2 = res.driver2;
            var order = res.order;
            var d = '';
            for(var i in data){
                var driver = data[i].driver;
                var driverId = driver.id
                var state='<span style="font-size:12px;padding:3px 3px;float: right" class="label label-error">离</span>';
                if("2"==driver.state){
                    state='<span style="font-size:12px;padding:3px 3px;float: right" class="label label-warning">听</span>';
                }else if("3"==driver.state){
                    state='<span style="font-size:12px;padding:3px 3px;float: right" class="label label-primary">载</span>';
                }
                d += '<li style="font-size: 12px;" class="list-group-item" ondblclick="Home.dblclickDriver('+i+')" id="' + driverId + '">' + driver.name + '-' + driver.phone +state+ '</li>';
                if('' != data[i].lon){
                    // 创建 AMap.Icon 实例:
                    var icon = new AMap.Icon({
                        size: new AMap.Size(40, 50),    // 图标尺寸
                        image: '/static/car.png',  // Icon的图像
                        // imageOffset: new AMap.Pixel(0, -60),  // 图像相对展示区域的偏移量,适于雪碧图等
                        imageSize: new AMap.Size(40, 50),   // 根据所设置的大小拉伸或压缩图片
                    });
            for(var i in data1){
                var driver = data1[i].driver;
                var driverId = driver.id;
                d += '<li class="list-group-item" id="' + driverId + '">' + driver.name + '-' + driver.phone + '</li>';
                if('' != data1[i].lon){
                    const image = {
                        url: "/static/icon_car@2x.png",
                        size: new google.maps.Size(50, 50),
                        origin: new google.maps.Point(16, 15),
                        anchor: new google.maps.Point(0, 0),
                    };
                    const shape = {
                        coords: [1, 1, 1, 20, 18, 20, 18, 1],
                        type: "poly",
                    };
                    var marker = new AMap.Marker({
                        position: new AMap.LngLat(data[i].lon, data[i].lat),   // 经纬度对象,也可以是经纬度构成的一维数组[116.39, 39.9]
                        offset: new AMap.Pixel(-10, -10),
                        icon: icon, // 添加 Icon 实例
                    });
                    marker.setExtData([driverId])
                    marker.on('click', function(){
                        Home.openNetCarInfo(this);
                    });
                    //console.log(marker);
                    markers.push(marker)
                    markers.push(
                        new google.maps.Marker({
                            position: { lat: parseFloat(data1[i].lat), lng: parseFloat(data1[i].lon) },
                            map,
                            icon: image,
                            shape: shape,
                            title: driver.name + '-' + driver.phone,
                            zIndex: driverId,
                        })
                    )
                }
            }
            for(var i in data2){
                var driver = data2[i].driver;
                var driverId = driver.id;
                d += '<li class="list-group-item" id="' + driverId + '">' + driver.name + '-' + driver.phone + '</li>';
                if('' != data2[i].lon){
                    const image = {
                        url: "/static/car.png",
                        size: new google.maps.Size(50, 50),
                        origin: new google.maps.Point(0, 0),
                        anchor: new google.maps.Point(0, 50),
                    };
                    const shape = {
                        coords: [1, 1, 1, 20, 18, 20, 18, 1],
                        type: "poly",
                    };
                    markers.push(
                        new google.maps.Marker({
                            position: { lat: parseFloat(data2[i].lat), lng: parseFloat(data2[i].lon) },
                            map,
                            icon: image,
                            shape: shape,
                            title: driver.name + '-' + driver.phone,
                            zIndex: driverId,
                        })
                    )
                }
            }
            $('#netcardriver').html(d);
            map.add(markers);
            //订单数据
            var privateCar=order.privateCar;
            var zhuanche = order.zhuanche;
            var kuacheng = order.kuacheng;
            var chuzu = order.chuzu;
            var kuahceng = order.kuahceng;
            var o = '';
            $('#order').html(o);
            console.log(order);
            var zc = '<div class="list-group"><a href="#" class="list-group-item active">专车未接订单</a>'
            for(var i in privateCar){
                zc += '<a href="#" class="list-group-item"><p class="list-group-item-text">起点:' + privateCar[i].start + '</p><p class="list-group-item-text">终点:' + privateCar[i].end + '</p>' +
                    '<p class="list-group-item-text">下单时间:' + privateCar[i].travelTime + '</p><p class="list-group-item-text">车型:' + privateCar[i].carModel + '</p>' +
                    '<p class="list-group-item-text">人数:' + privateCar[i].num + '</p></a>';
            for(var i in zhuanche){
                zc += '<a href="#" class="list-group-item"><p class="list-group-item-text">起点:' + zhuanche[i].startAddress + '</p><p class="list-group-item-text">终点:' + zhuanche[i].endAddress + '</p>' +
                    '<p class="list-group-item-text">下单时间:' + new Date(zhuanche[i].travelTime) + '</p>' +
                    '</a>';
            }
            zc += '</div>';
            o += zc;
            var kc = '<div class="list-group"><a href="#" class="list-group-item active">跨城出行未接订单</a>'
            var kc = '<div class="list-group"><a href="#" class="list-group-item active">市内小件物流未接订单</a>'
            for(var i in kuacheng){
                kc += '<a href="#" class="list-group-item"><p class="list-group-item-text">起点:' + kuacheng[i].start + '</p><p class="list-group-item-text">终点:' + kuacheng[i].end + '</p>' +
                    '<p class="list-group-item-text">下单时间:' + kuacheng[i].travelTime + '</p><p class="list-group-item-text">车型:' + kuacheng[i].carModel + '</p>' +
                    '<p class="list-group-item-text">人数:' + kuacheng[i].num + '</p></a>';
                kc += '<a href="#" class="list-group-item"><p class="list-group-item-text">起点:' + kuacheng[i].startAddress + '</p><p class="list-group-item-text">终点:' + kuacheng[i].endAddress + '</p>' +
                    '<p class="list-group-item-text">下单时间:' + new Date(kuacheng[i].travelTime) + '</p><p class="list-group-item-text">物品类型:' + kuacheng[i].cargoName + '</p>' +
                    '<p class="list-group-item-text">数量:' + kuacheng[i].cargoNumber + '</p></a>';
            }
            kc += '</div>';
            o += kc;
            var cz = '<div class="list-group"><a href="#" class="list-group-item active">出租车未接订单</a>'
            for(var i in chuzu){
                cz += '<a href="#" class="list-group-item"><p class="list-group-item-text">起点:' + chuzu[i].start + '</p><p class="list-group-item-text">终点:' + chuzu[i].end + '</p>' +
                    '<p class="list-group-item-text">下单时间:' + chuzu[i].travelTime + '</p><p class="list-group-item-text">车型:' + chuzu[i].carModel + '</p>' +
                    '<p class="list-group-item-text">人数:' + chuzu[i].num + '</p></a>';
            }
            cz += '</div>';
            o += cz;
            var cx = '<div class="list-group"><a href="#" class="list-group-item active">城乡出行未接订单</a>'
            for(var i in kuahceng){
                cx += '<a href="#" class="list-group-item"><p class="list-group-item-text">起点:' + kuahceng[i].start + '</p><p class="list-group-item-text">终点:' + kuahceng[i].end + '</p>' +
                    '<p class="list-group-item-text">下单时间:' + kuahceng[i].travelTime + '</p><p class="list-group-item-text">车型:' + kuahceng[i].carModel + '</p>' +
                    '<p class="list-group-item-text">人数:' + kuahceng[i].num + '</p></a>';
            }
            cx += '</div>';
            o += cx;
            $('#order').html(o);
        }
@@ -391,85 +382,20 @@
    $.ajax({
        url: Feng.ctxPath + '/home/getAllOrder',
        type: 'POST',
        data: {
            companyId: companyId,
            uid: uid
        },
        success: function (res) {
            var style = [{
                url: 'https://a.amap.com/jsapi_demos/static/images/mass0.png',
                anchor: new AMap.Pixel(6, 6),
                size: new AMap.Size(11, 11)
            }, {
                url: 'https://a.amap.com/jsapi_demos/static/images/mass1.png',
                anchor: new AMap.Pixel(4, 4),
                size: new AMap.Size(7, 7)
            }, {
                url: 'https://a.amap.com/jsapi_demos/static/images/mass2.png',
                anchor: new AMap.Pixel(3, 3),
                size: new AMap.Size(5, 5)
            }];
            var mass = new AMap.MassMarks(citys, {
                opacity: 0.8,
                zIndex: 111,
                cursor: 'pointer',
                style: style
            });
            var marker = new AMap.Marker({content: ' ', map: map_});
            mass.on('mouseover', function (e) {
                marker.setPosition(e.data.lnglat);
                marker.setLabel({content: e.data.name})
            });
            var data = [];
            clearMarkers1()
            for(var i in res){
                var obj = {
                    lnglat: [res[i].lon, res[i].lat]
                markers2.push(
                    new google.maps.Marker({
                        position: { lat: parseFloat(res[i].lat), lng: parseFloat(res[i].lon) },
                        map: map2,
                    })
                )
                }
                data.push(obj);
            }
            mass.setData(data);
            mass.setMap(map_);
        }
    });
}
//双击司机li
/*Home.dblclickDriver=function (lon,lat) {
    var markerPosition = [lon,lat];
    map.panTo(markerPosition);
}*/
Home.dblclickDriver=function (i) {
    var marker=markers[i];
    var position=[marker.w.position.lng,marker.w.position.lat];
    map.panTo(position);
    var iconOld = new AMap.Icon({
        size: new AMap.Size(40, 50),    // 图标尺寸
        image: '/static/car.png',  // Icon的图像
        imageSize: new AMap.Size(40, 50),   // 根据所设置的大小拉伸或压缩图片
    });
    var iconNew = new AMap.Icon({
        size: new AMap.Size(40, 50),    // 图标尺寸
        image: '/static/car_blue.jpg',  // Icon的图像
        imageSize: new AMap.Size(40, 50),   // 根据所设置的大小拉伸或压缩图片
    });
    //标记当前这个的样式
    marker.setIcon(iconNew);
    //还原上一个的样式
    if(typeof (mark_last) != "undefined"){
        if(mark_last!=marker){
            mark_last.setIcon(iconOld);
        }
    }
    //记录为最后一个标记的
    mark_last=marker;
}
function getData1() {