添加地图

src/main/resources/templates/enterprise/save.html

@@ -28,17 +28,30 @@
                         <input type="text" id="enterpriseName" name="enterpriseName" class="layui-input" value="" placeholder="请输入名称"  maxlength="255">
                     </div>
                 </div>
-                <div class="layui-form-item">
+                <div class="layui-form-item layui-row">
-                    <label class="layui-form-label">经度</label>
+                    <div class="layui-col-md2">
-                    <div class="layui-input-block">
+                        <select id="pollType" name="pollType" lay-filter="pollType">
-                        <input type="text" id="enterpriseLng" name="enterpriseLng" class="layui-input" value="" placeholder="请输入经度"  maxlength="255">
+                            <option value="areaSearch" selected>地区搜索</option>
+                            <option value="lngLatSearch">经纬度搜索</option>
+                        </select>
+                    </div>
+                    <div id="areaBox" class="layui-col-md2">
+                        <input type="text" id="area" class="layui-input" value="" placeholder="请输入地区"  maxlength="255">
+                    </div>
+                    <div id="lngBox" class="layui-col-md2" style="display: none;">
+                        <input type="number" id="lng" class="layui-input" value="" placeholder="请输入经度"  maxlength="255">
+                    </div>
+                    <div id="latBox" class="layui-col-md2" style="display: none;">
+                        <input type="number" id="lat" class="layui-input" value="" placeholder="请输入纬度"  maxlength="255">
+                    </div>
+                    <div class="layui-col-md2">
+                        <button type="button" id="searchBtn" class="layui-btn">搜索定位</button>
                     </div>
                 </div>
                 <div class="layui-form-item">
-                    <label class="layui-form-label">纬度</label>
+                    <div id="baiduMap" style="width: 100%; height: 400px;"></div>
-                    <div class="layui-input-block">
+                    <input type="hidden" id="enterpriseLng" name="enterpriseLng" maxlength="255">
-                        <input type="text" id="enterpriseLat" name="enterpriseLat" class="layui-input" value="" placeholder="请输入纬度"  maxlength="255">
+                    <input type="hidden" id="enterpriseLat" name="enterpriseLat" maxlength="255">
-                    </div>
                 </div>
                 <div class="layui-form-item layui-layout-admin">
                     <div class="layui-input-block">
@@ -52,10 +65,8 @@
         </div>
     </div>
 </div>
-<script src="assets/js/vendor/wangEditor/wangEditor.min.js"></script>
-<script src="assets/js/vendor/ckplayer/ckplayer/ckplayer.js"></script>
-<script src="assets/js/vendor/viewer/viewer.min.js"></script>
 <script src="assets/layuiadmin/layui/layui.js"></script>
+<script type="text/javascript" src="http://api.map.baidu.com/api?v=3.0&ak=pFMM3KjMlPlpzEGTXwB5vdj6cDCfB6Py"></script>
 <script>
     layui.config({
         base: 'assets/layuiadmin/' //静态资源所在路径
@@ -66,67 +77,27 @@
         var form = layui.form;
         var laytpl = layui.laytpl;
         var laydate = layui.laydate;
-        var wangEditor = window.wangEditor;
+        var baiduMap = {
-        var wangEditorObj = {};
+            map: null,
-        var viewerObj = {};
+            local: null
+        }
 
         function closeBox() {
             parent.layer.close(parent.layer.getFrameIndex(window.name));
         }
 
-        function refreshDownloadTemplet(fileName, file) {
+        function initBaiduMap() {
-            var dataRander = {};
+            baiduMap.map = new BMap.Map("baiduMap");
-            dataRander[fileName] = file;
+            var point = new BMap.Point(116.404, 39.915);
-
+            baiduMap.map.centerAndZoom(point, 15);
-            laytpl(document.getElementById(fileName +'FileDownload').innerHTML).render(dataRander, function(html) {
+            baiduMap.local = new BMap.LocalSearch(baiduMap.map, {
-                document.getElementById(fileName +'FileBox').innerHTML = html;
+                renderOptions:{map: baiduMap.map}
             });
         }
 
-        // 初始化文件列表
-        function initFileList(fileName, ids, callback) {
-            var dataForm = {};
-            dataForm[fileName] = ids;
-            form.val('dataForm', dataForm);
-
-            if(!ids) {
-                refreshDownloadTemplet(fileName, []);
-                if(callback) {
-                    callback(fileName, []);
-                }
-                return;
-            }
-
-            top.restAjax.get(top.restAjax.path('api/file/listfilebyfileid', []), {
-                ids: ids
-            }, null, function(code, data) {
-                refreshDownloadTemplet(fileName, data);
-                if(callback) {
-                    callback(fileName, data);
-                }
-            }, function(code, data) {
-                top.dialog.msg(data.msg);
-            });
-        }
-
-        // 初始化视频
-        function initVideo(fileName, data) {
-            for(var i = 0, item; item = data[i++];) {
-                var player = new ckplayer({
-                    container: '#'+ fileName + i,
-                    variable: 'player',
-                    flashplayer: false,
-                    video: {
-                        file: 'route/file/downloadfile/true/'+ item.fileId,
-                        type: 'video/mp4'
-                    }
-                });
-            }
-        }
-
-
         // 初始化内容
         function initData() {
+            initBaiduMap();
         }
         initData();
 
@@ -166,6 +137,41 @@
         // 校验
         form.verify({
         });
+
+        $('#searchBtn').click(function() {
+            var searchType = $('#pollType').val();
+            if(searchType === 'areaSearch') {
+                var area = $('#area').val();
+                if(!area) {
+                    top.dialog.msg('请输入地名');
+                    return;
+                }
+                baiduMap.local.search(area);
+            } else if(searchType === 'lngLatSearch') {
+                var lng = $('#lng').val();
+                var lat = $('#lat').val();
+                if(!lng || !lat) {
+                    top.dialog.msg('请输入经纬度');
+                    return;
+                }
+                var point = new BMap.Point(lng, lat);
+                baiduMap.map.centerAndZoom(point, 15);
+                var marker = new BMap.Marker(point);
+                baiduMap.map.addOverlay(marker);
+            }
+        });
+
+        form.on('select(pollType)', function(data) {
+            if(data.value === 'areaSearch') {
+                $('#areaBox').show();
+                $('#lngBox').hide();
+                $('#latBox').hide();
+            } else if(data.value === 'lngLatSearch') {
+                $('#lngBox').show();
+                $('#latBox').show();
+                $('#areaBox').hide();
+            }
+        });
     });
 </script>
 </body>