1、数据库链接地址为线上演示地址

2、修改摄像头信息中增加和修改功能，选取摄像头位置 展示方式。

leiSP-admin/src/main/resources/application-druid.yml

@@ -21,9 +21,9 @@ spring:
         druid:
             # 主库数据源
             master:
-                url: jdbc:mysql://127.0.0.1:3306/yanbian?useUnicode=true&characterEncoding=utf8&zeroDateTimeBehavior=convertToNull&serverTimezone=GMT%2B8&useSSL=false
-                username: root
-                password: 123456
+                url: jdbc:mysql://121.37.83.100:53306/yanji?useUnicode=true&characterEncoding=utf8&zeroDateTimeBehavior=convertToNull&serverTimezone=GMT%2B8&useSSL=false
+                username: limeng
+                password: limeng123456
 #                url: jdbc:mysql://121.37.83.100:53306/zhnc?useUnicode=true&characterEncoding=utf8&zeroDateTimeBehavior=convertToNull&serverTimezone=GMT%2B8&useSSL=false
 #                username: limeng
 #                password: limeng123456

mybusiness/src/main/java/com/business/yanbian/camera/controller/CameraController.java

@@ -147,4 +147,12 @@ public class CameraController extends BaseController
         AjaxResult ajax = new AjaxResult();
         return ajax.success(deptService.findCitys(Long.valueOf(parentId)));
     }
+    /**
+     * 跳转到获取坐标页面
+     */
+    @GetMapping("/choseParcel")
+    public String choseParcel(ModelMap mmap)
+    {
+        return prefix + "/choseParcel";
+    }
 }

mybusiness/src/main/resources/templates/camera/camera/add.html

@@ -53,27 +53,23 @@
                 </div>
             </div>
             <div class="form-group">
-                <label class="col-sm-3 control-label">经度：</label>
+                <label class="col-sm-3 control-label" style="cursor: pointer" onclick="choseLatLng()"><a>经度：</a></label>
                 <div class="col-sm-8">
                     <input name="lng" class="form-control" id="lng" type="text" readonly>
                 </div>
             </div>
             <div class="form-group">
-                <label class="col-sm-3 control-label">纬度：</label>
+                <label class="col-sm-3 control-label" style="cursor: pointer" onclick="choseLatLng()"><a>纬度：</a></label>
                 <div class="col-sm-8">
                     <input name="lat" class="form-control" id="lat" type="text" readonly>
                 </div>
             </div>
             <div class="form-group">
-                <label class="col-sm-3 control-label">地址：</label>
+                <label class="col-sm-3 control-label" style="cursor: pointer" onclick="choseLatLng()"><a>地址：</a></label>
                 <div class="col-sm-8">
                     <input name="address" class="form-control" id="address" type="text" readonly>
                 </div>
             </div>
-            <button type="button" id="open">
-                点击显示地图获取地址经纬度
-            </button>
-            <div id='allmap' style='width: 60%; height: 60%; position: absolute; display: none'></div>
         </form>
     </div>
     <th:block th:include="include :: footer" />
@@ -98,64 +94,26 @@
                 $("#"+selectId).html(html);
             });
         }
-    </script>
-    <script type="text/javascript">
-        document.getElementById('open').onclick = function () {
-            if (document.getElementById('allmap').style.display == 'none') {
-                document.getElementById('allmap').style.display = 'block';
-            } else {
-                document.getElementById('allmap').style.display = 'none';
-            }
-        }
-
-        var map = new BMap.Map("allmap");
-        var geoc = new BMap.Geocoder();   //地址解析对象
-        var markersArray = [];
-        var geolocation = new BMap.Geolocation();
-
-
-        var point = new BMap.Point(116.404412, 39.914714);
-        map.centerAndZoom(point, 12); // 中心点
-        geolocation.getCurrentPosition(function (r) {
-            if (this.getStatus() == BMAP_STATUS_SUCCESS) {
-                var mk = new BMap.Marker(r.point);
-                map.addOverlay(mk);
-                map.panTo(r.point);
-                map.enableScrollWheelZoom(true);
-            }
-            else {
-                alert('failed' + this.getStatus());
-            }
-        }, {enableHighAccuracy: true})
-        map.addEventListener("click", showInfo);
-
-
-        //清除标识
-        function clearOverlays() {
-            if (markersArray) {
-                for (i in markersArray) {
-                    map.removeOverlay(markersArray[i])
+        function choseLatLng() {
+            var options = {
+                title: '选择摄像头位置',
+                url: prefix + "/choseParcel",
+                callBack: function (index, layero){
+                    var body = layer.getChildFrame('body', index);
+                    var lng = body.find('#lng').val();
+                    var lat = body.find('#lat').val();
+                    var address = body.find('#address').val();
+                    if (lng.length === 0 || lat.length === 0) {
+                        $.modal.alertWarning("请选择摄像头位置");
+                        return;
+                    }
+                    $("#lng").val(lng);
+                    $("#lat").val(lat);
+                    $("#address").val(address);
+                    layer.close(index);
                 }
-            }
-        }
-        //地图上标注
-        function addMarker(point) {
-            var marker = new BMap.Marker(point);
-            markersArray.push(marker);
-            clearOverlays();
-            map.addOverlay(marker);
-        }
-        //点击地图时间处理
-        function showInfo(e) {
-            document.getElementById('lng').value = e.point.lng;
-            document.getElementById('lat').value =  e.point.lat;
-            geoc.getLocation(e.point, function (rs) {
-                var addComp = rs.addressComponents;
-                var address = addComp.province + addComp.city + addComp.district + addComp.street + addComp.streetNumber;
-                document.getElementById('allmap').style.display = 'none';
-                document.getElementById('address').value = address;
-            });
-            addMarker(e.point);
+            };
+            $.modal.openOptions(options);
         }
     </script>
 </body>

mybusiness/src/main/resources/templates/camera/camera/choseParcel.html

@@ -0,0 +1,60 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>选取摄像头位置</title>
+    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=nKLaDv0nFSjlHTSYGiKaOTMnMMwCCEzN"></script>
+</head>
+<body>
+<input name="lng" class="form-control" id="lng" type="hidden" readonly>
+<input name="lat" class="form-control" id="lat" type="hidden" readonly>
+<input name="address" class="form-control" id="address" type="hidden" readonly>
+<div id='allmap' style='width: 100%; height: 100%; position: absolute;'></div>
+</body>
+<script>
+    var map = new BMap.Map("allmap");
+    var geoc = new BMap.Geocoder();   //地址解析对象
+    var markersArray = [];
+    var geolocation = new BMap.Geolocation();
+    var point = new BMap.Point(129.517085, 42.89847);
+    map.centerAndZoom(point, 12); // 中心点
+    geolocation.getCurrentPosition(function (r) {
+        if (this.getStatus() == BMAP_STATUS_SUCCESS) {
+            var mk = new BMap.Marker(r.point);
+            map.addOverlay(mk);
+            map.panTo(r.point);
+            map.enableScrollWheelZoom(true);
+        }
+        else {
+            alert('failed' + this.getStatus());
+        }
+    }, {enableHighAccuracy: true})
+    map.addEventListener("click", showInfo);
+    //清除标识
+    function clearOverlays() {
+        if (markersArray) {
+            for (i in markersArray) {
+                map.removeOverlay(markersArray[i])
+            }
+        }
+    }
+    //地图上标注
+    function addMarker(point) {
+        var marker = new BMap.Marker(point);
+        markersArray.push(marker);
+        clearOverlays();
+        map.addOverlay(marker);
+    }
+    //点击地图时间处理
+    function showInfo(e) {
+        document.getElementById('lng').value = e.point.lng;
+        document.getElementById('lat').value =  e.point.lat;
+        geoc.getLocation(e.point, function (rs) {
+            var addComp = rs.addressComponents;
+            var address = addComp.province + addComp.city + addComp.district + addComp.street + addComp.streetNumber;
+            document.getElementById('address').value = address;
+        });
+        addMarker(e.point);
+    }
+</script>
+</html>

mybusiness/src/main/resources/templates/camera/camera/edit.html

@@ -57,27 +57,23 @@
                 </div>
             </div>
             <div class="form-group">
-                <label class="col-sm-3 control-label">经度：</label>
+                <label class="col-sm-3 control-label" style="cursor: pointer" onclick="choseLatLng()"><a>经度：</a></label>
                 <div class="col-sm-8">
                     <input name="lng" class="form-control" id="lng" type="text" th:field="*{lng}" readonly>
                 </div>
             </div>
             <div class="form-group">
-                <label class="col-sm-3 control-label">纬度：</label>
+                <label class="col-sm-3 control-label" style="cursor: pointer" onclick="choseLatLng()"><a>纬度：</a></label>
                 <div class="col-sm-8">
                     <input name="lat" class="form-control" id="lat" type="text" th:field="*{lat}" readonly>
                 </div>
             </div>
             <div class="form-group">
-                <label class="col-sm-3 control-label">地址：</label>
+                <label class="col-sm-3 control-label" style="cursor: pointer" onclick="choseLatLng()"><a>地址：</a></label>
                 <div class="col-sm-8">
                     <input name="address" class="form-control" id="address" type="text" th:field="*{address}" readonly>
                 </div>
             </div>
-            <button type="button" id="open">
-                点击显示地图获取地址经纬度
-            </button>
-            <div id='allmap' style='width: 60%; height: 60%; position: absolute; display: none'></div>
         </form>
     </div>
     <th:block th:include="include :: footer" />
@@ -102,64 +98,26 @@
                 $("#"+selectId).html(html);
             });
         }
-    </script>
-    <script type="text/javascript">
-        document.getElementById('open').onclick = function () {
-            if (document.getElementById('allmap').style.display == 'none') {
-                document.getElementById('allmap').style.display = 'block';
-            } else {
-                document.getElementById('allmap').style.display = 'none';
-            }
-        }
-
-        var map = new BMap.Map("allmap");
-        var geoc = new BMap.Geocoder();   //地址解析对象
-        var markersArray = [];
-        var geolocation = new BMap.Geolocation();
-
-
-        var point = new BMap.Point(116.404412, 39.914714);
-        map.centerAndZoom(point, 12); // 中心点
-        geolocation.getCurrentPosition(function (r) {
-            if (this.getStatus() == BMAP_STATUS_SUCCESS) {
-                var mk = new BMap.Marker(r.point);
-                map.addOverlay(mk);
-                map.panTo(r.point);
-                map.enableScrollWheelZoom(true);
-            }
-            else {
-                alert('failed' + this.getStatus());
-            }
-        }, {enableHighAccuracy: true})
-        map.addEventListener("click", showInfo);
-
-
-        //清除标识
-        function clearOverlays() {
-            if (markersArray) {
-                for (i in markersArray) {
-                    map.removeOverlay(markersArray[i])
+        function choseLatLng() {
+            var options = {
+                title: '选择摄像头位置',
+                url: prefix + "/choseParcel",
+                callBack: function (index, layero){
+                    var body = layer.getChildFrame('body', index);
+                    var lng = body.find('#lng').val();
+                    var lat = body.find('#lat').val();
+                    var address = body.find('#address').val();
+                    if (lng.length === 0 || lat.length === 0) {
+                        $.modal.alertWarning("请选择摄像头位置");
+                        return;
+                    }
+                    $("#lng").val(lng);
+                    $("#lat").val(lat);
+                    $("#address").val(address);
+                    layer.close(index);
                 }
-            }
-        }
-        //地图上标注
-        function addMarker(point) {
-            var marker = new BMap.Marker(point);
-            markersArray.push(marker);
-            clearOverlays();
-            map.addOverlay(marker);
-        }
-        //点击地图时间处理
-        function showInfo(e) {
-            document.getElementById('lng').value = e.point.lng;
-            document.getElementById('lat').value =  e.point.lat;
-            geoc.getLocation(e.point, function (rs) {
-                var addComp = rs.addressComponents;
-                var address = addComp.province + addComp.city + addComp.district + addComp.street + addComp.streetNumber;
-                document.getElementById('allmap').style.display = 'none';
-                document.getElementById('address').value = address;
-            });
-            addMarker(e.point);
+            };
+            $.modal.openOptions(options);
         }
     </script>
 </body>