Commit 85dbc8af4b02d9ab24deace68d4daa17f439d571
1 parent
bf13ef90
update...
Showing
9 changed files
with
1172 additions
and
20 deletions
src/main/java/com/bsth/controller/gps/GpsController.java
| ... | ... | @@ -96,4 +96,16 @@ public class GpsController { |
| 96 | 96 | public Map<String, Object> gpsCompletion(@RequestParam long schId) { |
| 97 | 97 | return gpsService.gpsCompletion(schId); |
| 98 | 98 | } |
| 99 | + | |
| 100 | + /** | |
| 101 | + * 历史GPS查询 ,第二版轨迹回放用 | |
| 102 | + * @param nbbm | |
| 103 | + * @param st | |
| 104 | + * @param et | |
| 105 | + * @return | |
| 106 | + */ | |
| 107 | + @RequestMapping(value = "/history_v2/{nbbm}") | |
| 108 | + public Map<String, Object> history_v2(@PathVariable("nbbm") String nbbm, @RequestParam long st, @RequestParam long et){ | |
| 109 | + return gpsService.history_v2(nbbm, st, et); | |
| 110 | + } | |
| 99 | 111 | } | ... | ... |
src/main/java/com/bsth/controller/realcontrol/BasicDataController.java
| ... | ... | @@ -4,6 +4,8 @@ import com.alibaba.fastjson.JSON; |
| 4 | 4 | import com.alibaba.fastjson.serializer.PropertyFilter; |
| 5 | 5 | import com.bsth.common.ResponseCode; |
| 6 | 6 | import com.bsth.data.BasicData; |
| 7 | +import com.bsth.entity.Line; | |
| 8 | +import com.google.common.collect.ArrayListMultimap; | |
| 7 | 9 | import org.slf4j.Logger; |
| 8 | 10 | import org.slf4j.LoggerFactory; |
| 9 | 11 | import org.springframework.beans.factory.annotation.Autowired; |
| ... | ... | @@ -11,9 +13,7 @@ import org.springframework.web.bind.annotation.RequestMapping; |
| 11 | 13 | import org.springframework.web.bind.annotation.RequestMethod; |
| 12 | 14 | import org.springframework.web.bind.annotation.RestController; |
| 13 | 15 | |
| 14 | -import java.util.HashMap; | |
| 15 | -import java.util.List; | |
| 16 | -import java.util.Map; | |
| 16 | +import java.util.*; | |
| 17 | 17 | |
| 18 | 18 | @RestController |
| 19 | 19 | @RequestMapping("/basic") |
| ... | ... | @@ -126,4 +126,23 @@ public class BasicDataController { |
| 126 | 126 | public Map<String, String> nbbm2PlateNo(){ |
| 127 | 127 | return basicData.getNbbm2PlateNo(); |
| 128 | 128 | } |
| 129 | + | |
| 130 | + | |
| 131 | + /** | |
| 132 | + * 获取线路配车信息 | |
| 133 | + * @return | |
| 134 | + */ | |
| 135 | + @RequestMapping("/ccInfo") | |
| 136 | + public Map<String, Collection<String>> ccInfo(){ | |
| 137 | + | |
| 138 | + ArrayListMultimap<String, String> listMultimap = ArrayListMultimap.create(); | |
| 139 | + Set<String> ks = BasicData.nbbm2LineMap.keySet(); | |
| 140 | + | |
| 141 | + Line line; | |
| 142 | + for(String nbbm : ks){ | |
| 143 | + line = BasicData.nbbm2LineMap.get(nbbm); | |
| 144 | + listMultimap.put(line.getLineCode(), nbbm); | |
| 145 | + } | |
| 146 | + return listMultimap.asMap(); | |
| 147 | + } | |
| 129 | 148 | } | ... | ... |
src/main/java/com/bsth/service/gps/GpsService.java
src/main/java/com/bsth/service/gps/GpsServiceImpl.java
| ... | ... | @@ -5,11 +5,14 @@ import com.bsth.data.BasicData; |
| 5 | 5 | import com.bsth.data.arrival.ArrivalEntity; |
| 6 | 6 | import com.bsth.data.gpsdata.GpsEntity; |
| 7 | 7 | import com.bsth.data.gpsdata.GpsRealData; |
| 8 | +import com.bsth.data.gpsdata.arrival.utils.GeoUtils; | |
| 8 | 9 | import com.bsth.data.schedule.DayOfSchedule; |
| 9 | 10 | import com.bsth.entity.realcontrol.ScheduleRealInfo; |
| 10 | 11 | import com.bsth.repository.CarParkRepository; |
| 11 | 12 | import com.bsth.repository.StationRepository; |
| 12 | 13 | import com.bsth.repository.realcontrol.ScheduleRealInfoRepository; |
| 14 | +import com.bsth.service.gps.entity.HistoryGps_DTO; | |
| 15 | +import com.bsth.service.gps.entity.Road_DTO; | |
| 13 | 16 | import com.bsth.util.DateUtils; |
| 14 | 17 | import com.bsth.util.TransGPS; |
| 15 | 18 | import com.bsth.util.TransGPS.Location; |
| ... | ... | @@ -235,6 +238,9 @@ public class GpsServiceImpl implements GpsService { |
| 235 | 238 | bdLoc = TransGPS.bd_encrypt(gdLoc); |
| 236 | 239 | map.put("bd_lon", bdLoc.getLng()); |
| 237 | 240 | map.put("bd_lat", bdLoc.getLat()); |
| 241 | + //原始坐标 | |
| 242 | + map.put("lon", lon); | |
| 243 | + map.put("lat", lat); | |
| 238 | 244 | |
| 239 | 245 | map.put("deviceId", rs.getString("DEVICE_ID")); |
| 240 | 246 | map.put("ts", rs.getLong("TS")); |
| ... | ... | @@ -510,6 +516,49 @@ public class GpsServiceImpl implements GpsService { |
| 510 | 516 | return rs; |
| 511 | 517 | } |
| 512 | 518 | |
| 519 | + @Override | |
| 520 | + public Map<String, Object> history_v2(String nbbm, long st, long et) { | |
| 521 | + Map<String, Object> rs = new HashMap<>(); | |
| 522 | + | |
| 523 | + try { | |
| 524 | + //获取历史gps 数据 | |
| 525 | + List<HistoryGps_DTO> list = HistoryGps_DTO.craete(history(new String[]{nbbm}, st, et)); | |
| 526 | + if(list!=null && list.size() > 0){ | |
| 527 | + //获取路段信息 | |
| 528 | + String sql = "select ID, ST_AsText(GROAD_VECTOR) as GROAD_VECTOR,ROAD_CODE,ROAD_NAME,SPEED from bsth_c_road where road_code in(select section_code from bsth_c_sectionroute where line_code=? and destroy=0)"; | |
| 529 | + List<Road_DTO> roads = Road_DTO.craete(jdbcTemplate.queryForList(sql, list.get(0).getLineId())); | |
| 530 | + | |
| 531 | + //为GPS数据关联路段信息 | |
| 532 | + for(HistoryGps_DTO gps : list){ | |
| 533 | + matchRoadToGps(gps, roads); | |
| 534 | + } | |
| 535 | + } | |
| 536 | + | |
| 537 | + rs.put("status", ResponseCode.SUCCESS); | |
| 538 | + rs.put("list", list); | |
| 539 | + }catch (Exception e){ | |
| 540 | + logger.error("", e); | |
| 541 | + rs.put("status", ResponseCode.ERROR); | |
| 542 | + } | |
| 543 | + return rs; | |
| 544 | + } | |
| 545 | + | |
| 546 | + private void matchRoadToGps(HistoryGps_DTO gps, List<Road_DTO> roads){ | |
| 547 | + double min = -1,distance; | |
| 548 | + Road_DTO nearRoad = null; | |
| 549 | + for(Road_DTO road : roads){ | |
| 550 | + distance = GeoUtils.getDistanceFromLine(road.getLineStr(), gps.getPoint()); | |
| 551 | + | |
| 552 | + if (min > distance || min == -1) { | |
| 553 | + min = distance; | |
| 554 | + nearRoad = road; | |
| 555 | + } | |
| 556 | + } | |
| 557 | + | |
| 558 | + gps.setRoad(nearRoad); | |
| 559 | + gps.setRoadMinDistance(min); | |
| 560 | + } | |
| 561 | + | |
| 513 | 562 | private void sortGpsList(final Field f, List<GpsEntity> rs) { |
| 514 | 563 | Collections.sort(rs, new Comparator<GpsEntity>() { |
| 515 | 564 | ... | ... |
src/main/java/com/bsth/service/gps/entity/HistoryGps_DTO.java
0 → 100644
| 1 | +package com.bsth.service.gps.entity; | |
| 2 | + | |
| 3 | +import com.alibaba.fastjson.JSON; | |
| 4 | +import com.alibaba.fastjson.JSONObject; | |
| 5 | +import com.bsth.data.arrival.ArrivalEntity; | |
| 6 | +import com.fasterxml.jackson.annotation.JsonIgnore; | |
| 7 | +import com.vividsolutions.jts.geom.Coordinate; | |
| 8 | +import com.vividsolutions.jts.geom.GeometryFactory; | |
| 9 | +import com.vividsolutions.jts.geom.Point; | |
| 10 | + | |
| 11 | +import java.util.List; | |
| 12 | +import java.util.Map; | |
| 13 | + | |
| 14 | +/** | |
| 15 | + * 历史GPS DTO | |
| 16 | + * Created by panzhao on 2017/4/5. | |
| 17 | + */ | |
| 18 | +public class HistoryGps_DTO { | |
| 19 | + | |
| 20 | + public static List<HistoryGps_DTO> craete(List<Map<String, Object>> mapList){ | |
| 21 | + List<HistoryGps_DTO> list = JSONObject.parseArray(JSON.toJSONString(mapList), HistoryGps_DTO.class); | |
| 22 | + | |
| 23 | + GeometryFactory geometryFactory = new GeometryFactory(); | |
| 24 | + Point point; | |
| 25 | + for(HistoryGps_DTO gps : list){ | |
| 26 | + point = geometryFactory.createPoint(new Coordinate(gps.getLat(), gps.getLon())); | |
| 27 | + gps.setPoint(point); | |
| 28 | + } | |
| 29 | + return list; | |
| 30 | + } | |
| 31 | + | |
| 32 | + private double gcj_lon; | |
| 33 | + private double gcj_lat; | |
| 34 | + | |
| 35 | + private double bd_lon; | |
| 36 | + private double bd_lat; | |
| 37 | + | |
| 38 | + private double lon; | |
| 39 | + private double lat; | |
| 40 | + | |
| 41 | + private String deviceId; | |
| 42 | + private long ts; | |
| 43 | + private long timestamp; | |
| 44 | + private String stopNo; | |
| 45 | + private float direction; | |
| 46 | + | |
| 47 | + private String lineId; | |
| 48 | + private float speed; | |
| 49 | + private ArrivalEntity inout_stop_info; | |
| 50 | + private int inout_stop; | |
| 51 | + | |
| 52 | + private String nbbm; | |
| 53 | + private int state; | |
| 54 | + private int upDown; | |
| 55 | + | |
| 56 | + @JsonIgnore | |
| 57 | + private Point point; | |
| 58 | + | |
| 59 | + /** 路段 */ | |
| 60 | + private Road_DTO road; | |
| 61 | + /** 和路段的最短距离 */ | |
| 62 | + private double roadMinDistance; | |
| 63 | + | |
| 64 | + public double getGcj_lon() { | |
| 65 | + return gcj_lon; | |
| 66 | + } | |
| 67 | + | |
| 68 | + public void setGcj_lon(double gcj_lon) { | |
| 69 | + this.gcj_lon = gcj_lon; | |
| 70 | + } | |
| 71 | + | |
| 72 | + public double getGcj_lat() { | |
| 73 | + return gcj_lat; | |
| 74 | + } | |
| 75 | + | |
| 76 | + public void setGcj_lat(double gcj_lat) { | |
| 77 | + this.gcj_lat = gcj_lat; | |
| 78 | + } | |
| 79 | + | |
| 80 | + public double getBd_lon() { | |
| 81 | + return bd_lon; | |
| 82 | + } | |
| 83 | + | |
| 84 | + public void setBd_lon(double bd_lon) { | |
| 85 | + this.bd_lon = bd_lon; | |
| 86 | + } | |
| 87 | + | |
| 88 | + public double getBd_lat() { | |
| 89 | + return bd_lat; | |
| 90 | + } | |
| 91 | + | |
| 92 | + public void setBd_lat(double bd_lat) { | |
| 93 | + this.bd_lat = bd_lat; | |
| 94 | + } | |
| 95 | + | |
| 96 | + public String getDeviceId() { | |
| 97 | + return deviceId; | |
| 98 | + } | |
| 99 | + | |
| 100 | + public void setDeviceId(String deviceId) { | |
| 101 | + this.deviceId = deviceId; | |
| 102 | + } | |
| 103 | + | |
| 104 | + public long getTs() { | |
| 105 | + return ts; | |
| 106 | + } | |
| 107 | + | |
| 108 | + public void setTs(long ts) { | |
| 109 | + this.ts = ts; | |
| 110 | + } | |
| 111 | + | |
| 112 | + public long getTimestamp() { | |
| 113 | + return timestamp; | |
| 114 | + } | |
| 115 | + | |
| 116 | + public void setTimestamp(long timestamp) { | |
| 117 | + this.timestamp = timestamp; | |
| 118 | + } | |
| 119 | + | |
| 120 | + public String getStopNo() { | |
| 121 | + return stopNo; | |
| 122 | + } | |
| 123 | + | |
| 124 | + public void setStopNo(String stopNo) { | |
| 125 | + this.stopNo = stopNo; | |
| 126 | + } | |
| 127 | + | |
| 128 | + public float getDirection() { | |
| 129 | + return direction; | |
| 130 | + } | |
| 131 | + | |
| 132 | + public void setDirection(float direction) { | |
| 133 | + this.direction = direction; | |
| 134 | + } | |
| 135 | + | |
| 136 | + public String getLineId() { | |
| 137 | + return lineId; | |
| 138 | + } | |
| 139 | + | |
| 140 | + public void setLineId(String lineId) { | |
| 141 | + this.lineId = lineId; | |
| 142 | + } | |
| 143 | + | |
| 144 | + public float getSpeed() { | |
| 145 | + return speed; | |
| 146 | + } | |
| 147 | + | |
| 148 | + public void setSpeed(float speed) { | |
| 149 | + this.speed = speed; | |
| 150 | + } | |
| 151 | + | |
| 152 | + public ArrivalEntity getInout_stop_info() { | |
| 153 | + return inout_stop_info; | |
| 154 | + } | |
| 155 | + | |
| 156 | + public void setInout_stop_info(ArrivalEntity inout_stop_info) { | |
| 157 | + this.inout_stop_info = inout_stop_info; | |
| 158 | + } | |
| 159 | + | |
| 160 | + public int getInout_stop() { | |
| 161 | + return inout_stop; | |
| 162 | + } | |
| 163 | + | |
| 164 | + public void setInout_stop(int inout_stop) { | |
| 165 | + this.inout_stop = inout_stop; | |
| 166 | + } | |
| 167 | + | |
| 168 | + public String getNbbm() { | |
| 169 | + return nbbm; | |
| 170 | + } | |
| 171 | + | |
| 172 | + public void setNbbm(String nbbm) { | |
| 173 | + this.nbbm = nbbm; | |
| 174 | + } | |
| 175 | + | |
| 176 | + public int getState() { | |
| 177 | + return state; | |
| 178 | + } | |
| 179 | + | |
| 180 | + public void setState(int state) { | |
| 181 | + this.state = state; | |
| 182 | + } | |
| 183 | + | |
| 184 | + public int getUpDown() { | |
| 185 | + return upDown; | |
| 186 | + } | |
| 187 | + | |
| 188 | + public void setUpDown(int upDown) { | |
| 189 | + this.upDown = upDown; | |
| 190 | + } | |
| 191 | + | |
| 192 | + public Road_DTO getRoad() { | |
| 193 | + return road; | |
| 194 | + } | |
| 195 | + | |
| 196 | + public void setRoad(Road_DTO road) { | |
| 197 | + this.road = road; | |
| 198 | + } | |
| 199 | + | |
| 200 | + public double getRoadMinDistance() { | |
| 201 | + return roadMinDistance; | |
| 202 | + } | |
| 203 | + | |
| 204 | + public void setRoadMinDistance(double roadMinDistance) { | |
| 205 | + this.roadMinDistance = roadMinDistance; | |
| 206 | + } | |
| 207 | + | |
| 208 | + public double getLon() { | |
| 209 | + return lon; | |
| 210 | + } | |
| 211 | + | |
| 212 | + public void setLon(double lon) { | |
| 213 | + this.lon = lon; | |
| 214 | + } | |
| 215 | + | |
| 216 | + public double getLat() { | |
| 217 | + return lat; | |
| 218 | + } | |
| 219 | + | |
| 220 | + public void setLat(double lat) { | |
| 221 | + this.lat = lat; | |
| 222 | + } | |
| 223 | + | |
| 224 | + public Point getPoint() { | |
| 225 | + return point; | |
| 226 | + } | |
| 227 | + | |
| 228 | + public void setPoint(Point point) { | |
| 229 | + this.point = point; | |
| 230 | + } | |
| 231 | +} | ... | ... |
src/main/java/com/bsth/service/gps/entity/Road_DTO.java
0 → 100644
| 1 | +package com.bsth.service.gps.entity; | |
| 2 | + | |
| 3 | +import com.alibaba.fastjson.JSON; | |
| 4 | +import com.alibaba.fastjson.JSONObject; | |
| 5 | +import com.fasterxml.jackson.annotation.JsonIgnore; | |
| 6 | +import com.vividsolutions.jts.geom.Coordinate; | |
| 7 | +import com.vividsolutions.jts.geom.GeometryFactory; | |
| 8 | +import com.vividsolutions.jts.geom.LineString; | |
| 9 | + | |
| 10 | +import java.util.ArrayList; | |
| 11 | +import java.util.List; | |
| 12 | +import java.util.Map; | |
| 13 | + | |
| 14 | +/** | |
| 15 | + * 路段信息DTO | |
| 16 | + * Created by panzhao on 2017/4/5. | |
| 17 | + */ | |
| 18 | +public class Road_DTO { | |
| 19 | + | |
| 20 | + public static List<Road_DTO> craete(List<Map<String, Object>> mapList){ | |
| 21 | + List<Road_DTO> list = JSONObject.parseArray(JSON.toJSONString(mapList), Road_DTO.class); | |
| 22 | + //处理路段坐标 | |
| 23 | + String polygonStr; | |
| 24 | + String[] coords; | |
| 25 | + int i, len; | |
| 26 | + String[] temps;//1, temps2; | |
| 27 | + List<Coordinate> cds; | |
| 28 | + | |
| 29 | + GeometryFactory geometryFactory = new GeometryFactory(); | |
| 30 | + for(Road_DTO road : list){ | |
| 31 | + polygonStr = road.getGROAD_VECTOR(); | |
| 32 | + coords = polygonStr.substring(11, polygonStr.length() - 1).split(","); | |
| 33 | + len = coords.length; | |
| 34 | + | |
| 35 | + cds = new ArrayList<>(); | |
| 36 | + //每2个点连一条线 | |
| 37 | + for(i = 0; i < len; i ++){ | |
| 38 | + temps = coords[i].split(" "); | |
| 39 | + cds.add(new Coordinate(Float.parseFloat(temps[1]), Float.parseFloat(temps[0]))); | |
| 40 | + } | |
| 41 | + | |
| 42 | + Coordinate[] cdsArray = new Coordinate[cds.size()]; | |
| 43 | + road.setLineStr(geometryFactory.createLineString(cds.toArray(cdsArray))); | |
| 44 | + } | |
| 45 | + return list; | |
| 46 | + } | |
| 47 | + | |
| 48 | + private long ID; | |
| 49 | + | |
| 50 | + @JsonIgnore | |
| 51 | + private String GROAD_VECTOR; | |
| 52 | + | |
| 53 | + private String ROAD_CODE; | |
| 54 | + | |
| 55 | + private String ROAD_NAME; | |
| 56 | + | |
| 57 | + private double SPEED; | |
| 58 | + | |
| 59 | + @JsonIgnore | |
| 60 | + private LineString lineStr; | |
| 61 | + | |
| 62 | + public long getID() { | |
| 63 | + return ID; | |
| 64 | + } | |
| 65 | + | |
| 66 | + public void setID(long ID) { | |
| 67 | + this.ID = ID; | |
| 68 | + } | |
| 69 | + | |
| 70 | + public String getGROAD_VECTOR() { | |
| 71 | + return GROAD_VECTOR; | |
| 72 | + } | |
| 73 | + | |
| 74 | + public void setGROAD_VECTOR(String GROAD_VECTOR) { | |
| 75 | + this.GROAD_VECTOR = GROAD_VECTOR; | |
| 76 | + } | |
| 77 | + | |
| 78 | + public String getROAD_CODE() { | |
| 79 | + return ROAD_CODE; | |
| 80 | + } | |
| 81 | + | |
| 82 | + public void setROAD_CODE(String ROAD_CODE) { | |
| 83 | + this.ROAD_CODE = ROAD_CODE; | |
| 84 | + } | |
| 85 | + | |
| 86 | + public String getROAD_NAME() { | |
| 87 | + return ROAD_NAME; | |
| 88 | + } | |
| 89 | + | |
| 90 | + public void setROAD_NAME(String ROAD_NAME) { | |
| 91 | + this.ROAD_NAME = ROAD_NAME; | |
| 92 | + } | |
| 93 | + | |
| 94 | + public double getSPEED() { | |
| 95 | + return SPEED; | |
| 96 | + } | |
| 97 | + | |
| 98 | + public void setSPEED(double SPEED) { | |
| 99 | + this.SPEED = SPEED; | |
| 100 | + } | |
| 101 | + | |
| 102 | + public LineString getLineStr() { | |
| 103 | + return lineStr; | |
| 104 | + } | |
| 105 | + | |
| 106 | + public void setLineStr(LineString lineStr) { | |
| 107 | + this.lineStr = lineStr; | |
| 108 | + } | |
| 109 | +} | ... | ... |
src/main/resources/static/real_control_v2/js/modal_extend.js
| ... | ... | @@ -26,22 +26,25 @@ var show_modal = function (id, dom) { |
| 26 | 26 | |
| 27 | 27 | var open_modal = function (pageUrl, data, opt) { |
| 28 | 28 | $.get(pageUrl, function (dom) { |
| 29 | - if (!$(dom).hasClass('uk-modal')) { | |
| 30 | - alert('无效的dom片段!'); | |
| 31 | - return; | |
| 32 | - } | |
| 33 | - var id = '#' + $(dom).attr('id'); | |
| 34 | - | |
| 35 | - $(document.body).append(dom); | |
| 36 | - UIkit.modal(id, opt).show(); | |
| 37 | - //move | |
| 38 | - modal_move($('.uk-modal-header',id)); | |
| 39 | - | |
| 40 | - if (data) | |
| 41 | - $(id).trigger('init', data); | |
| 29 | + open_modal_dom(dom, data, opt); | |
| 42 | 30 | }); |
| 43 | 31 | }; |
| 44 | 32 | |
| 33 | +var open_modal_dom = function (dom, data, opt) { | |
| 34 | + if (!$(dom).hasClass('uk-modal')) { | |
| 35 | + alert('无效的dom片段!'); | |
| 36 | + return; | |
| 37 | + } | |
| 38 | + var id = '#' + $(dom).attr('id'); | |
| 39 | + | |
| 40 | + $(document.body).append(dom); | |
| 41 | + UIkit.modal(id, opt).show(); | |
| 42 | + //move | |
| 43 | + modal_move($('.uk-modal-header',id)); | |
| 44 | + | |
| 45 | + if (data) | |
| 46 | + $(id).trigger('init', data); | |
| 47 | +}; | |
| 45 | 48 | |
| 46 | 49 | var modal_move = function (m_header) { |
| 47 | 50 | var _moveFlag; | ... | ... |
src/main/resources/static/real_control_v2/mapmonitor/css/real.css
| ... | ... | @@ -649,4 +649,155 @@ input[type=checkbox].disabled{ |
| 649 | 649 | padding-top: 15px; |
| 650 | 650 | border-right: 1px solid #d8d7d7; |
| 651 | 651 | box-shadow: 3px 1px 8px 0 rgba(0, 0, 0, 0.12), 1px 0px 8px 0 rgba(0, 0, 0, 0.12); |
| 652 | +} | |
| 653 | + | |
| 654 | +.playBackForm{ | |
| 655 | + margin-bottom: 0 !important; | |
| 656 | +} | |
| 657 | + | |
| 658 | +.playBackForm .uk-form-label{ | |
| 659 | + width: 70px; | |
| 660 | +} | |
| 661 | + | |
| 662 | +.playBackForm .uk-form-controls{ | |
| 663 | + margin-left: 75px; | |
| 664 | +} | |
| 665 | + | |
| 666 | +.playBackForm>.uk-grid{ | |
| 667 | + margin-top: 14px; | |
| 668 | +} | |
| 669 | +.playBackForm .autocomplete-nbbm{ | |
| 670 | + width: 100%; | |
| 671 | +} | |
| 672 | +.playBackForm .autocomplete-nbbm input{ | |
| 673 | + width: calc(100% - 28px); | |
| 674 | +} | |
| 675 | +.playBackForm>.uk-grid>*{ | |
| 676 | + padding-left: 18px; | |
| 677 | +} | |
| 678 | + | |
| 679 | +.abnormal_table_wrap{ | |
| 680 | + height: calc(50% - 210px); | |
| 681 | + margin-left: -35px; | |
| 682 | + border-top: 1px solid #ededed; | |
| 683 | + margin-top: 26px; | |
| 684 | + position: relative; | |
| 685 | + /*border-bottom: 1px solid #ededed;*/ | |
| 686 | +} | |
| 687 | + | |
| 688 | +.other_info_table_wrap{ | |
| 689 | + height: calc(50% - 20px); | |
| 690 | +} | |
| 691 | + | |
| 692 | +.abnormal_table_wrap:before{ | |
| 693 | + content: '异常信息'; | |
| 694 | + position: absolute; | |
| 695 | + top: -12px; | |
| 696 | + left: 20px; | |
| 697 | + background: white; | |
| 698 | + padding: 2px 5px; | |
| 699 | + color: #9e9e9e; | |
| 700 | +} | |
| 701 | + | |
| 702 | +.playBackForm .playBackButton{ | |
| 703 | + width: 90%; | |
| 704 | + margin-left: 5%; | |
| 705 | + border: 0 !important; | |
| 706 | + background-image: none !important; | |
| 707 | + background-color: #00aff2; | |
| 708 | +} | |
| 709 | + | |
| 710 | + | |
| 711 | +.ct_table.gps-road-info dl dt:nth-of-type(1), .ct_table.gps-road-info dl dd:nth-of-type(1) { | |
| 712 | + width: 26%; | |
| 713 | + text-indent: 15px; | |
| 714 | +} | |
| 715 | +.ct_table.gps-road-info dl dt:nth-of-type(2), .ct_table.gps-road-info dl dd:nth-of-type(2) { | |
| 716 | + width: 16%; | |
| 717 | +} | |
| 718 | +.ct_table.gps-road-info dl dt:nth-of-type(3), .ct_table.gps-road-info dl dd:nth-of-type(3) { | |
| 719 | + width: 57%; | |
| 720 | + border-right: 0; | |
| 721 | +} | |
| 722 | + | |
| 723 | + | |
| 724 | +.inout_table_wrap .ct_table dl dt:nth-of-type(1), .inout_table_wrap .ct_table dl dd:nth-of-type(1){ | |
| 725 | + width: 36%; | |
| 726 | + text-indent: 12px; | |
| 727 | +} | |
| 728 | +.inout_table_wrap .ct_table dl dt:nth-of-type(2), .inout_table_wrap .ct_table dl dd:nth-of-type(2){ | |
| 729 | + width: 21%; | |
| 730 | +} | |
| 731 | +.inout_table_wrap .ct_table dl dt:nth-of-type(3), .inout_table_wrap .ct_table dl dd:nth-of-type(3){ | |
| 732 | + width: 20%; | |
| 733 | +} | |
| 734 | +.inout_table_wrap .ct_table dl dt:nth-of-type(4), .inout_table_wrap .ct_table dl dd:nth-of-type(4){ | |
| 735 | + width: 11%; | |
| 736 | +} | |
| 737 | +.inout_table_wrap .ct_table dl dt:nth-of-type(5), .inout_table_wrap .ct_table dl dd:nth-of-type(5){ | |
| 738 | + width: 11%; | |
| 739 | + border-right: 0; | |
| 740 | +} | |
| 741 | + | |
| 742 | +.abnormal_table_panel .ct_table dl dt:nth-of-type(1), .abnormal_table_panel .ct_table dl dd:nth-of-type(1){ | |
| 743 | + width: 28%; | |
| 744 | + text-indent: 12px; | |
| 745 | +} | |
| 746 | +.abnormal_table_panel .ct_table dl dt:nth-of-type(2), .abnormal_table_panel .ct_table dl dd:nth-of-type(2){ | |
| 747 | + width: 26%; | |
| 748 | +} | |
| 749 | +.abnormal_table_panel .ct_table dl dt:nth-of-type(3), .abnormal_table_panel .ct_table dl dd:nth-of-type(3){ | |
| 750 | + width: 26%; | |
| 751 | +} | |
| 752 | +.abnormal_table_panel .ct_table dl dt:nth-of-type(4), .abnormal_table_panel .ct_table dl dd:nth-of-type(4){ | |
| 753 | + width: 19%; | |
| 754 | + border-right: 0; | |
| 755 | +} | |
| 756 | + | |
| 757 | + | |
| 758 | +.playBackForm .ct_table .ct_table_body dl:last-child dd{ | |
| 759 | + border-bottom: 1px solid #dedede; | |
| 760 | +} | |
| 761 | + | |
| 762 | +.ct_table.gps-road-info .ct_table_head, | |
| 763 | +.inout_table_wrap .ct_table .ct_table_head, | |
| 764 | +.abnormal_table_panel .ct_table .ct_table_head{ | |
| 765 | + background: none; | |
| 766 | + background-image: linear-gradient(to right,rgba(255, 255, 255, 0) 1% ,#eee 7% ,#eee 99%); | |
| 767 | +} | |
| 768 | + | |
| 769 | +#map-playback2-modal .uk-accordion-title{ | |
| 770 | + margin-bottom: 5px; | |
| 771 | + border-radius: 0; | |
| 772 | + font-size: 15px; | |
| 773 | + font-weight: 600; | |
| 774 | + border-right: 0; | |
| 775 | +} | |
| 776 | + | |
| 777 | +.cc_info_accordion ul{ | |
| 778 | + background: #e1e1e1; | |
| 779 | +} | |
| 780 | + | |
| 781 | +.cc_info_accordion ul li{ | |
| 782 | + cursor: default; | |
| 783 | + padding: 5px 9px; | |
| 784 | + background: #fff; | |
| 785 | + margin-top: 1px; | |
| 786 | + -webkit-border-start: 6px solid transparent; | |
| 787 | + -webkit-padding-start: 18px; | |
| 788 | + user-select: none; | |
| 789 | +} | |
| 790 | + | |
| 791 | +.cc_info_accordion ul li:hover, | |
| 792 | +.cc_info_accordion ul li.active{ | |
| 793 | + background: #d5fff6; | |
| 794 | + -webkit-border-start-color: #1bbc9b; | |
| 795 | +} | |
| 796 | + | |
| 797 | +.cc_info_accordion .uk-accordion-content{ | |
| 798 | + padding: 0; | |
| 799 | +} | |
| 800 | +.cc_info_accordion{ | |
| 801 | + height: calc(100% - 40px); | |
| 802 | + overflow: auto; | |
| 652 | 803 | } |
| 653 | 804 | \ No newline at end of file | ... | ... |
src/main/resources/static/real_control_v2/mapmonitor/fragments/playback_v2/main.html
| ... | ... | @@ -2,17 +2,593 @@ |
| 2 | 2 | <div class="uk-modal-dialog uk-modal-dialog-blank"> |
| 3 | 3 | <button class="uk-modal-close uk-close" type="button"></button> |
| 4 | 4 | <div class="uk-grid uk-flex-middle" data-uk-grid-margin> |
| 5 | - <div class="uk-width-medium-1-10 uk-height-viewport z-depth-viewport" > | |
| 5 | + <div class="uk-width-medium-1-10 uk-height-viewport z-depth-viewport"> | |
| 6 | + <h5 style="color: #868484;text-indent: 5px;"> | |
| 7 | + 线路配车 | |
| 8 | + </h5> | |
| 9 | + <div class="uk-accordion cc_info_accordion" data-uk-accordion data-uk-observe> | |
| 10 | + </div> | |
| 11 | + | |
| 6 | 12 | </div> |
| 7 | - <div class="uk-width-medium-2-10 uk-height-viewport z-depth-viewport"> | |
| 13 | + <div class="uk-width-medium-2-10 uk-height-viewport z-depth-viewport "> | |
| 14 | + <form class="uk-form uk-form-horizontal playBackForm"> | |
| 15 | + <div class="uk-grid"> | |
| 16 | + <div class="uk-width-1-1"> | |
| 17 | + <div class="uk-form-row"> | |
| 18 | + <label class="uk-form-label">车辆编码</label> | |
| 19 | + <div class="uk-form-controls"> | |
| 20 | + <div class="uk-autocomplete uk-form autocomplete-nbbm"> | |
| 21 | + <input name="nbbm" required/> | |
| 22 | + </div> | |
| 23 | + </div> | |
| 24 | + </div> | |
| 25 | + </div> | |
| 26 | + </div> | |
| 27 | + <div class="uk-grid"> | |
| 28 | + <div class="uk-width-2-3"> | |
| 29 | + <div class="uk-form-row"> | |
| 30 | + <label class="uk-form-label">开始时间</label> | |
| 31 | + <div class="uk-form-controls"> | |
| 32 | + <input name="sDate" type="date" required/> | |
| 33 | + </div> | |
| 34 | + </div> | |
| 35 | + </div> | |
| 36 | + <div class="uk-width-1-3" style="padding-left: 15px;"> | |
| 37 | + <div class="uk-form-row"> | |
| 38 | + <div class="uk-form-controls" style="margin-left: 0;"> | |
| 39 | + <input name="sTime" type="time" required/> | |
| 40 | + </div> | |
| 41 | + </div> | |
| 42 | + </div> | |
| 43 | + </div> | |
| 44 | + <div class="uk-grid"> | |
| 45 | + <div class="uk-width-2-3"> | |
| 46 | + <div class="uk-form-row"> | |
| 47 | + <label class="uk-form-label">结束时间</label> | |
| 48 | + <div class="uk-form-controls"> | |
| 49 | + <input name="eDate" type="date" required/> | |
| 50 | + </div> | |
| 51 | + </div> | |
| 52 | + </div> | |
| 53 | + <div class="uk-width-1-3" style="padding-left: 15px;"> | |
| 54 | + <div class="uk-form-row"> | |
| 55 | + <div class="uk-form-controls" style="margin-left: 0;"> | |
| 56 | + <input name="eTime" type="time" required/> | |
| 57 | + </div> | |
| 58 | + </div> | |
| 59 | + </div> | |
| 60 | + </div> | |
| 61 | + <div class="uk-grid"> | |
| 62 | + <button class="uk-button uk-button-large uk-button-primary playBackButton" type="submit"><i | |
| 63 | + class="uk-icon-search"> </i> 搜索轨迹 | |
| 64 | + </button> | |
| 65 | + </div> | |
| 66 | + </form> | |
| 67 | + <!-- 异常警报 --> | |
| 68 | + <div class="abnormal_table_wrap"> | |
| 69 | + <div class="abnormal_table_panel" | |
| 70 | + style="height: calc(100% - 15px);margin-top: 15px;overflow: auto;"> | |
| 71 | + <div class="ct_table abnormal_table" style="height: calc(100% - 30px);"> | |
| 72 | + <div class="ct_table_head"> | |
| 73 | + <dl> | |
| 74 | + <dt>异常状态</dt> | |
| 75 | + <dt>开始时间</dt> | |
| 76 | + <dt>结束时间</dt> | |
| 77 | + <dt>图像</dt> | |
| 78 | + </dl> | |
| 79 | + </div> | |
| 80 | + <div class="ct_table_body"> | |
| 81 | + <dl> | |
| 82 | + <dd>超速(80)</dd> | |
| 83 | + <dd>05:00.20</dd> | |
| 84 | + <dd>05:00.20</dd> | |
| 85 | + <dd></dd> | |
| 86 | + </dl> | |
| 87 | + <dl> | |
| 88 | + <dd>越界</dd> | |
| 89 | + <dd>05:00.20</dd> | |
| 90 | + <dd>05:00.20</dd> | |
| 91 | + <dd></dd> | |
| 92 | + </dl> | |
| 93 | + <dl> | |
| 94 | + <dd>超速(80)</dd> | |
| 95 | + <dd>05:00.20</dd> | |
| 96 | + <dd>05:00.20</dd> | |
| 97 | + <dd></dd> | |
| 98 | + </dl> | |
| 99 | + <dl> | |
| 100 | + <dd>越界</dd> | |
| 101 | + <dd>05:00.20</dd> | |
| 102 | + <dd>05:00.20</dd> | |
| 103 | + <dd></dd> | |
| 104 | + </dl> | |
| 105 | + <dl> | |
| 106 | + <dd>超速(180)</dd> | |
| 107 | + <dd>05:00.20</dd> | |
| 108 | + <dd>05:00.20</dd> | |
| 109 | + <dd></dd> | |
| 110 | + </dl> | |
| 111 | + <dl> | |
| 112 | + <dd>越界</dd> | |
| 113 | + <dd>05:00.20</dd> | |
| 114 | + <dd>05:00.20</dd> | |
| 115 | + <dd></dd> | |
| 116 | + </dl> | |
| 117 | + <dl> | |
| 118 | + <dd>超速(80)</dd> | |
| 119 | + <dd>05:00.20</dd> | |
| 120 | + <dd>05:00.20</dd> | |
| 121 | + <dd></dd> | |
| 122 | + </dl> | |
| 123 | + <dl> | |
| 124 | + <dd>越界</dd> | |
| 125 | + <dd>05:00.20</dd> | |
| 126 | + <dd>05:00.20</dd> | |
| 127 | + <dd></dd> | |
| 128 | + </dl> | |
| 129 | + <dl> | |
| 130 | + <dd>超速(80)</dd> | |
| 131 | + <dd>05:00.20</dd> | |
| 132 | + <dd>05:00.20</dd> | |
| 133 | + <dd></dd> | |
| 134 | + </dl> | |
| 135 | + <dl> | |
| 136 | + <dd>越界</dd> | |
| 137 | + <dd>05:00.20</dd> | |
| 138 | + <dd>05:00.20</dd> | |
| 139 | + <dd></dd> | |
| 140 | + </dl> | |
| 141 | + <dl> | |
| 142 | + <dd>超速(80)</dd> | |
| 143 | + <dd>05:00.20</dd> | |
| 144 | + <dd>05:00.20</dd> | |
| 145 | + <dd></dd> | |
| 146 | + </dl> | |
| 147 | + <dl> | |
| 148 | + <dd>越界</dd> | |
| 149 | + <dd>05:00.20</dd> | |
| 150 | + <dd>05:00.20</dd> | |
| 151 | + <dd></dd> | |
| 152 | + </dl> | |
| 153 | + <dl> | |
| 154 | + <dd>超速(80)</dd> | |
| 155 | + <dd>05:00.20</dd> | |
| 156 | + <dd>05:00.20</dd> | |
| 157 | + <dd></dd> | |
| 158 | + </dl> | |
| 159 | + <dl> | |
| 160 | + <dd>越界</dd> | |
| 161 | + <dd>05:00.20</dd> | |
| 162 | + <dd>05:00.20</dd> | |
| 163 | + <dd></dd> | |
| 164 | + </dl> | |
| 165 | + <dl> | |
| 166 | + <dd>超速(80)</dd> | |
| 167 | + <dd>05:00.20</dd> | |
| 168 | + <dd>05:00.20</dd> | |
| 169 | + <dd></dd> | |
| 170 | + </dl> | |
| 171 | + <dl> | |
| 172 | + <dd>越界</dd> | |
| 173 | + <dd>05:00.20</dd> | |
| 174 | + <dd>05:00.20</dd> | |
| 175 | + <dd></dd> | |
| 176 | + </dl> | |
| 177 | + <dl> | |
| 178 | + <dd>超速(80)</dd> | |
| 179 | + <dd>05:00.20</dd> | |
| 180 | + <dd>05:00.20</dd> | |
| 181 | + <dd></dd> | |
| 182 | + </dl> | |
| 183 | + <dl> | |
| 184 | + <dd>越界</dd> | |
| 185 | + <dd>05:00.20</dd> | |
| 186 | + <dd>05:00.20</dd> | |
| 187 | + <dd></dd> | |
| 188 | + </dl> | |
| 189 | + <dl> | |
| 190 | + <dd>超速(80)</dd> | |
| 191 | + <dd>05:00.20</dd> | |
| 192 | + <dd>05:00.20</dd> | |
| 193 | + <dd></dd> | |
| 194 | + </dl> | |
| 195 | + <dl> | |
| 196 | + <dd>越界</dd> | |
| 197 | + <dd>05:00.20</dd> | |
| 198 | + <dd>05:00.20</dd> | |
| 199 | + <dd></dd> | |
| 200 | + </dl> | |
| 201 | + | |
| 202 | + </div> | |
| 203 | + </div> | |
| 204 | + </div> | |
| 205 | + </div> | |
| 206 | + <!-- 路段 和 到离站信息 --> | |
| 207 | + <div class="uk-margin uk-grid other_info_table_wrap" data-uk-grid-margin> | |
| 208 | + <div class="uk-width-medium-1-1" style="padding-left: 0;"> | |
| 209 | + | |
| 210 | + <ul class="uk-tab" data-uk-tab="{connect:'#real_gps_info_tab_content'}" | |
| 211 | + style="padding-left: 12px;"> | |
| 212 | + <li class="uk-active"><a>行车轨迹</a></li> | |
| 213 | + <li><a>到离站信息</a></li> | |
| 214 | + </ul> | |
| 215 | + | |
| 216 | + <ul id="real_gps_info_tab_content" class="uk-switcher uk-margin" | |
| 217 | + style="height: calc(100% - 44px);margin-top: 7px;"> | |
| 218 | + <li class="uk-active" style="height: 100%;"> | |
| 219 | + <div class="road_table_wrap" style="height: 100%;overflow: auto;"> | |
| 220 | + <div class="ct_table gps-road-info" | |
| 221 | + style="height: calc(100% - 30px);"> | |
| 222 | + <div class="ct_table_head"> | |
| 223 | + <dl> | |
| 224 | + <dt>时间</dt> | |
| 225 | + <dt>速度</dt> | |
| 226 | + <dt>所在路段</dt> | |
| 227 | + </dl> | |
| 228 | + </div> | |
| 229 | + <div class="ct_table_body"> | |
| 230 | + </div> | |
| 231 | + </div> | |
| 232 | + </div> | |
| 233 | + </li> | |
| 234 | + <!-- 到离站数据 --> | |
| 235 | + <li style="height: 100%;"> | |
| 236 | + <div class="inout_table_wrap" style="height: 100%;overflow: auto;"> | |
| 237 | + <div class="ct_table" style="height: calc(100% - 30px);"> | |
| 238 | + <div class="ct_table_head"> | |
| 239 | + <dl> | |
| 240 | + <dt>站点</dt> | |
| 241 | + <dt>到站时间</dt> | |
| 242 | + <dt>离站时间</dt> | |
| 243 | + <dt>上客</dt> | |
| 244 | + <dt>下客</dt> | |
| 245 | + </dl> | |
| 246 | + </div> | |
| 247 | + <div class="ct_table_body"> | |
| 248 | + <dl> | |
| 249 | + <dd>金桥路朴珊德拉</dd> | |
| 250 | + <dd>05:02.4</dd> | |
| 251 | + <dd>05:04.6</dd> | |
| 252 | + <dd>5</dd> | |
| 253 | + <dd>12</dd> | |
| 254 | + </dl> | |
| 255 | + <dl> | |
| 256 | + <dd>金桥路朴珊德拉</dd> | |
| 257 | + <dd>05:02.4</dd> | |
| 258 | + <dd>05:04.6</dd> | |
| 259 | + <dd>5</dd> | |
| 260 | + <dd>12</dd> | |
| 261 | + </dl> | |
| 262 | + <dl> | |
| 263 | + <dd>金桥路朴珊德拉</dd> | |
| 264 | + <dd>05:02.4</dd> | |
| 265 | + <dd>05:04.6</dd> | |
| 266 | + <dd>5</dd> | |
| 267 | + <dd>12</dd> | |
| 268 | + </dl> | |
| 269 | + <dl> | |
| 270 | + <dd>金桥路朴珊德拉</dd> | |
| 271 | + <dd>05:02.4</dd> | |
| 272 | + <dd>05:04.6</dd> | |
| 273 | + <dd>5</dd> | |
| 274 | + <dd>12</dd> | |
| 275 | + </dl> | |
| 276 | + <dl> | |
| 277 | + <dd>金桥路朴珊德拉</dd> | |
| 278 | + <dd>05:02.4</dd> | |
| 279 | + <dd>05:04.6</dd> | |
| 280 | + <dd>5</dd> | |
| 281 | + <dd>12</dd> | |
| 282 | + </dl> | |
| 283 | + <dl> | |
| 284 | + <dd>金桥路朴珊德拉</dd> | |
| 285 | + <dd>05:02.4</dd> | |
| 286 | + <dd>05:04.6</dd> | |
| 287 | + <dd>5</dd> | |
| 288 | + <dd>12</dd> | |
| 289 | + </dl> | |
| 290 | + <dl> | |
| 291 | + <dd>金桥路朴珊德拉</dd> | |
| 292 | + <dd>05:02.4</dd> | |
| 293 | + <dd>05:04.6</dd> | |
| 294 | + <dd>5</dd> | |
| 295 | + <dd>12</dd> | |
| 296 | + </dl> | |
| 297 | + <dl> | |
| 298 | + <dd>金桥路朴珊德拉</dd> | |
| 299 | + <dd>05:02.4</dd> | |
| 300 | + <dd>05:04.6</dd> | |
| 301 | + <dd>5</dd> | |
| 302 | + <dd>12</dd> | |
| 303 | + </dl> | |
| 304 | + <dl> | |
| 305 | + <dd>金桥路朴珊德拉</dd> | |
| 306 | + <dd>05:02.4</dd> | |
| 307 | + <dd>05:04.6</dd> | |
| 308 | + <dd>5</dd> | |
| 309 | + <dd>12</dd> | |
| 310 | + </dl> | |
| 311 | + <dl> | |
| 312 | + <dd>金桥路朴珊德拉</dd> | |
| 313 | + <dd>05:02.4</dd> | |
| 314 | + <dd>05:04.6</dd> | |
| 315 | + <dd>5</dd> | |
| 316 | + <dd>12</dd> | |
| 317 | + </dl> | |
| 318 | + <dl> | |
| 319 | + <dd>金桥路朴珊德拉</dd> | |
| 320 | + <dd>05:02.4</dd> | |
| 321 | + <dd>05:04.6</dd> | |
| 322 | + <dd>5</dd> | |
| 323 | + <dd>12</dd> | |
| 324 | + </dl> | |
| 325 | + <dl> | |
| 326 | + <dd>金桥路朴珊德拉</dd> | |
| 327 | + <dd>05:02.4</dd> | |
| 328 | + <dd>05:04.6</dd> | |
| 329 | + <dd>5</dd> | |
| 330 | + <dd>12</dd> | |
| 331 | + </dl> | |
| 332 | + <dl> | |
| 333 | + <dd>金桥路朴珊德拉</dd> | |
| 334 | + <dd>05:02.4</dd> | |
| 335 | + <dd>05:04.6</dd> | |
| 336 | + <dd>5</dd> | |
| 337 | + <dd>12</dd> | |
| 338 | + </dl> | |
| 339 | + <dl> | |
| 340 | + <dd>金桥路朴珊德拉</dd> | |
| 341 | + <dd>05:02.4</dd> | |
| 342 | + <dd>05:04.6</dd> | |
| 343 | + <dd>5</dd> | |
| 344 | + <dd>12</dd> | |
| 345 | + </dl> | |
| 346 | + <dl> | |
| 347 | + <dd>金桥路朴珊德拉</dd> | |
| 348 | + <dd>05:02.4</dd> | |
| 349 | + <dd>05:04.6</dd> | |
| 350 | + <dd>5</dd> | |
| 351 | + <dd>12</dd> | |
| 352 | + </dl> | |
| 353 | + <dl> | |
| 354 | + <dd>金桥路朴珊德拉</dd> | |
| 355 | + <dd>05:02.4</dd> | |
| 356 | + <dd>05:04.6</dd> | |
| 357 | + <dd>5</dd> | |
| 358 | + <dd>12</dd> | |
| 359 | + </dl> | |
| 360 | + <dl> | |
| 361 | + <dd>金桥路朴珊德拉</dd> | |
| 362 | + <dd>05:02.4</dd> | |
| 363 | + <dd>05:04.6</dd> | |
| 364 | + <dd>5</dd> | |
| 365 | + <dd>12</dd> | |
| 366 | + </dl> | |
| 367 | + <dl> | |
| 368 | + <dd>金桥路朴珊德拉</dd> | |
| 369 | + <dd>05:02.4</dd> | |
| 370 | + <dd>05:04.6</dd> | |
| 371 | + <dd>5</dd> | |
| 372 | + <dd>12</dd> | |
| 373 | + </dl> | |
| 374 | + <dl> | |
| 375 | + <dd>金桥路朴珊德拉</dd> | |
| 376 | + <dd>05:02.4</dd> | |
| 377 | + <dd>05:04.6</dd> | |
| 378 | + <dd>5</dd> | |
| 379 | + <dd>12</dd> | |
| 380 | + </dl> | |
| 381 | + <dl> | |
| 382 | + <dd>金桥路朴珊德拉</dd> | |
| 383 | + <dd>05:02.4</dd> | |
| 384 | + <dd>05:04.6</dd> | |
| 385 | + <dd>5</dd> | |
| 386 | + <dd>12</dd> | |
| 387 | + </dl> | |
| 388 | + <dl> | |
| 389 | + <dd>金桥路朴珊德拉</dd> | |
| 390 | + <dd>05:02.4</dd> | |
| 391 | + <dd>05:04.6</dd> | |
| 392 | + <dd>5</dd> | |
| 393 | + <dd>12</dd> | |
| 394 | + </dl> | |
| 395 | + | |
| 396 | + </div> | |
| 397 | + </div> | |
| 398 | + </div> | |
| 399 | + </li> | |
| 400 | + </ul> | |
| 401 | + | |
| 402 | + </div> | |
| 403 | + </div> | |
| 8 | 404 | </div> |
| 9 | - <div class="uk-width-medium-7-10 uk-height-viewport"> | |
| 405 | + <div class="uk-width-medium-7-10 uk-height-viewport map-wrap"> | |
| 10 | 406 | </div> |
| 11 | 407 | </div> |
| 12 | 408 | </div> |
| 409 | + | |
| 410 | + <script id="cc_info_accordion_cont_temp" type="text/html"> | |
| 411 | + {{each ccInfo as cc i}} | |
| 412 | + <h3 class="uk-accordion-title">{{cc.name}}</h3> | |
| 413 | + <div class="uk-accordion-content"> | |
| 414 | + <ul class="uk-list"> | |
| 415 | + {{each cc.cars as c j}} | |
| 416 | + <li>{{c}}</li> | |
| 417 | + {{/each}} | |
| 418 | + </ul> | |
| 419 | + </div> | |
| 420 | + {{/each}} | |
| 421 | + </script> | |
| 422 | + | |
| 423 | + <script id="gps_road_info_cont_temp" type="text/html"> | |
| 424 | + {{each array as gps i}} | |
| 425 | + <dl data-code="{{gps.road.road_CODE}}"> | |
| 426 | + <dd>{{gps.timeStr}}</dd> | |
| 427 | + <dd>{{gps.speed}}</dd> | |
| 428 | + <dd>{{gps.road.road_NAME}}</dd> | |
| 429 | + </dl> | |
| 430 | + {{/each}} | |
| 431 | + </script> | |
| 13 | 432 | <script> |
| 14 | 433 | (function () { |
| 15 | - var modal = '#map-playback2-modal'; | |
| 434 | + var modal = '#map-playback2-modal', gpsArray; | |
| 435 | + | |
| 436 | + $(modal).on('init', function (e, data) { | |
| 437 | + //初始化地图 | |
| 438 | + map = new BMap.Map($('.map-wrap', modal)[0]); | |
| 439 | + //中心点和缩放级别 | |
| 440 | + map.centerAndZoom(new BMap.Point(gb_map_consts.center_point.lng, gb_map_consts.center_point.lat), 16); | |
| 441 | + map.enableScrollWheelZoom(); | |
| 442 | + | |
| 443 | + //固定表头 | |
| 444 | + gb_ct_table.fixedHead($('.road_table_wrap', modal)); | |
| 445 | + gb_ct_table.fixedHead($('.inout_table_wrap', modal)); | |
| 446 | + gb_ct_table.fixedHead($('.abnormal_table_panel', modal)); | |
| 447 | + //线路配车 | |
| 448 | + ccInfo.init(); | |
| 449 | + | |
| 450 | + //表单初始值 | |
| 451 | + searchForm.init(data); | |
| 452 | + }); | |
| 453 | + | |
| 454 | + /** | |
| 455 | + * 线路配车相关 | |
| 456 | + */ | |
| 457 | + var ccInfo = (function () { | |
| 458 | + | |
| 459 | + function init() { | |
| 460 | + $.get('/basic/ccInfo', function (rs) { | |
| 461 | + var ccInfo = [], lines = gb_data_basic.codeToLine; | |
| 462 | + for (var code in lines) { | |
| 463 | + ccInfo.push({ | |
| 464 | + name: lines[code].name, | |
| 465 | + cars: carSort(rs[code]) | |
| 466 | + }); | |
| 467 | + } | |
| 468 | + | |
| 469 | + var htmlStr = template('cc_info_accordion_cont_temp', {ccInfo: ccInfo}); | |
| 470 | + $('.cc_info_accordion', modal).html(htmlStr) | |
| 471 | + .find('.uk-list li').on('click', itemClick); | |
| 472 | + }); | |
| 473 | + } | |
| 474 | + | |
| 475 | + function carSort(list) { | |
| 476 | + if (!list) | |
| 477 | + return []; | |
| 478 | + return list.sort(); | |
| 479 | + } | |
| 480 | + | |
| 481 | + function itemClick() { | |
| 482 | + $(this).parent().find('li.active').removeClass('active'); | |
| 483 | + $(this).addClass('active'); | |
| 484 | + searchForm.setNbbm($(this).text()); | |
| 485 | + } | |
| 486 | + | |
| 487 | + return { | |
| 488 | + init: init | |
| 489 | + }; | |
| 490 | + })(); | |
| 491 | + | |
| 492 | + /** | |
| 493 | + * 搜索表单相关 | |
| 494 | + */ | |
| 495 | + var searchForm = (function () { | |
| 496 | + | |
| 497 | + var f = $('.playBackForm', modal); | |
| 498 | + | |
| 499 | + var init = function (data) { | |
| 500 | + //设置初始值 | |
| 501 | + if (data.nbbm) | |
| 502 | + $('[name=nbbm]', f).val(data.nbbm); | |
| 503 | + var st = moment().subtract(2, 'hour'); | |
| 504 | + if (data.st) | |
| 505 | + st = moment(data.st, 'YYYY-MM-DD HH:mm'); | |
| 506 | + $('[name=sDate]', f).val(st.format('YYYY-MM-DD')); | |
| 507 | + $('[name=sTime]', f).val(st.format('HH:mm')); | |
| 508 | + var et = moment(); | |
| 509 | + if (data.et) | |
| 510 | + et = moment(data.et, 'YYYY-MM-DD HH:mm'); | |
| 511 | + $('[name=eDate]', f).val(et.format('YYYY-MM-DD')); | |
| 512 | + $('[name=eTime]', f).val(et.format('HH:mm')); | |
| 513 | + | |
| 514 | + //搜索事件 | |
| 515 | + $('button[type=submit]', f).on('click', search); | |
| 516 | + }; | |
| 517 | + | |
| 518 | + var setNbbm = function (v) { | |
| 519 | + $('[name=nbbm]', f).val(v); | |
| 520 | + }; | |
| 521 | + | |
| 522 | + var ONE_DAY = 60 * 60 * 24; | |
| 523 | + var MIN_SPACE = 60; | |
| 524 | + var search = function (e) { | |
| 525 | + e.stopPropagation(); | |
| 526 | + var data = f.serializeJSON(); | |
| 527 | + | |
| 528 | + //校验时间间隔 | |
| 529 | + var fs = 'YYYY-MM-DDHH:mm'; | |
| 530 | + var st = parseInt(moment(data.sDate + data.sTime, fs).format('X')); | |
| 531 | + var et = parseInt(moment(data.eDate + data.eTime, fs).format('X')); | |
| 532 | + | |
| 533 | + if (et < st) | |
| 534 | + notify_err('结束时间不能小于开始时间'); | |
| 535 | + else if ((et - st) > ONE_DAY) | |
| 536 | + notify_err('最大间隔24小时!'); | |
| 537 | + else if ((et - st) < MIN_SPACE) | |
| 538 | + notify_err('最小间隔1分钟!'); | |
| 539 | + else { | |
| 540 | + $.ajax({ | |
| 541 | + url: '/gps/history_v2/' + data.nbbm, | |
| 542 | + traditional: true, | |
| 543 | + data: {st: st, et: et}, | |
| 544 | + success: function (rs) { | |
| 545 | + gpsArray = rs.list; | |
| 546 | + if (!rs || rs.length == 0) { | |
| 547 | + notify_err('没有搜索到轨迹数据!'); | |
| 548 | + return; | |
| 549 | + } | |
| 550 | + | |
| 551 | + //行车轨迹 | |
| 552 | + trailTableObj.showInitData(gpsArray); | |
| 553 | + } | |
| 554 | + }); | |
| 555 | + } | |
| 556 | + return false; | |
| 557 | + }; | |
| 558 | + return { | |
| 559 | + init: init, | |
| 560 | + setNbbm: setNbbm | |
| 561 | + }; | |
| 562 | + })(); | |
| 563 | + | |
| 564 | + /** | |
| 565 | + * 行车轨迹表格 | |
| 566 | + */ | |
| 567 | + var trailTableObj = (function () { | |
| 568 | + | |
| 569 | + var showInitData = function (list) { | |
| 570 | + var array = []; | |
| 571 | + for (var i = 0, gps; gps = list[i++];) { | |
| 572 | + //格式化时间 | |
| 573 | + gps.timeStr = moment(this.timestamp).format('HH:mm.ss'); | |
| 574 | + try { | |
| 575 | + if (i > 0 && array[array.length - 1].road.road_CODE == gps.road.road_CODE) | |
| 576 | + array.pop(); | |
| 577 | + } | |
| 578 | + catch (e) {} | |
| 579 | + | |
| 580 | + if (gps.road) | |
| 581 | + array.push(gps); | |
| 582 | + } | |
| 583 | + | |
| 584 | + var htmlStr = template('gps_road_info_cont_temp', {array: array}); | |
| 585 | + $('.gps-road-info .ct_table_body', modal).html(htmlStr); | |
| 586 | + }; | |
| 587 | + | |
| 588 | + return { | |
| 589 | + showInitData: showInitData | |
| 590 | + }; | |
| 591 | + })(); | |
| 16 | 592 | })(); |
| 17 | 593 | </script> |
| 18 | 594 | </div> | ... | ... |