From 688d0f8c596e0f605974899eeb11a170ecb67866 Mon Sep 17 00:00:00 2001
From: hdw <496960745@qq.com>
Date: 星期五, 09 十一月 2018 11:31:04 +0800
Subject: [PATCH] 添加工具栏
---
gx_tieta/WebRoot/index.jsp | 165 ++++++++++++++++++++++++++++++------------------------
1 files changed, 91 insertions(+), 74 deletions(-)
diff --git a/gx_tieta/WebRoot/index.jsp b/gx_tieta/WebRoot/index.jsp
index bf69554..2d3d475 100644
--- a/gx_tieta/WebRoot/index.jsp
+++ b/gx_tieta/WebRoot/index.jsp
@@ -112,38 +112,54 @@
<div class="nav-map small">
<!-- 鍦板浘鍐呭绛涢�� -->
- <div class="map-info-panel-left">
+ <div class="map-info-panel-left w300">
<div class="map-info-panel-content">
<div class="map-info">
- <span>闄愬埗鏄剧ず鍖哄煙: </span><span class="k-point red" id="mapVsArea">涓浗</span>
- <span class="mr5">鏈烘埧鏄剧ず绫诲瀷:</span><span class="k-point red" id="mapIconStyle">鍏ㄩ儴</span>
+ <span>鍦板浘宸ュ叿</span>
<span class="map-info-btn-icon" id="showMapInfoDetail" title="璇︽儏"><i class="fa fa-angle-double-down"></i></span>
</div>
<div class="map-info-detail">
- <table>
- <tbody>
- <tr>
- <td class="w8em alg-c">闄愬埗鏄剧ず鍖哄煙:</td>
- <td>
- <select name="mapVsAreaSel" id="mapVsAreaSel">
- <option>涓浗</option>
- <option>涓浗-骞胯タ</option>
- </select>
- </td>
- </tr>
- <tr>
- <td class="w8em alg-c">鏈烘埧鏄剧ず绫诲瀷:</td>
- <td>
- <select name="mapIconStyleSel" id="mapIconStyleSel">
- <option>鍏ㄩ儴</option>
- </select>
- </td>
- </tr>
- </tbody>
- </table>
- <div class="map-info-footer alg-r">
- <button type="button" class="mr10 map-panel-hide" value="纭畾" id="mapPanelEn">纭畾</button>
- <button type="button" class="mr10 map-panel-hide" value="闅愯棌">闅愯棌</button>
+ <div class="layui-collapse" lay-filter="test" lay-accordion="">
+ <div class="layui-colla-item">
+ <h2 class="layui-colla-title">娣诲姞鏈烘埧</h2>
+ <div class="layui-colla-content layui-show"">
+ <table>
+ <tbody>
+ <tr>
+ <td class="w4em alg-c f-bold">缁忓害:</td>
+ <td><input type="text" class="lng"></td>
+ </tr>
+ <tr>
+ <td class="w4em alg-c f-bold">绾害:</td>
+ <td><input type="text" class="lat"></td>
+ </tr>
+ <tr>
+ <td colspan="2" class="alg-r btn-container">
+ <button type="button" value="娣诲姞" id="mapToolAddHome" class="mrr8">娣诲姞</button>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </div>
+ <div class="layui-colla-item">
+ <h2 class="layui-colla-title">瀹氫綅鏈烘埧</h2>
+ <div class="layui-colla-content">
+ <table>
+ <tbody>
+ <tr>
+ <td class="w5em alg-c f-bold">鏈烘埧鍚嶇О:</td>
+ <td><input type="text" id="mapToolSearch"></td>
+ </tr>
+ <tr>
+ <td colspan="2" class="alg-r btn-container">
+ <button type="button" value="鎼滅储" id="mapToolSearchBtn" class="mrr8">鎼滅储</button>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </div>
</div>
</div>
</div>
@@ -1788,7 +1804,7 @@
});
magImgStyles.push('');
// 鏍规嵁褰撳墠鍐呭鏇存柊鍦板浘鍥炬爣
- searchStation();
+ //searchStation();
}
// 妫�娴嬪綋鍓嶅浘鏍囨槸鍚︾鍚�
@@ -2308,6 +2324,9 @@
bmap.queryInRect(map, createMapDot);
updateStation();
+ // 鏇存柊灏忓伐鍏锋悳绱㈡満鎴垮姛鑳�
+ updateSearchSource(allStation);
+
// 鏄惁绗竴娆℃墽琛�
if(setRect) {
map.addEventListener("moveend", bmap.queryInRect.bind({},map, createMapDot)); // 鎷栧姩
@@ -2415,7 +2434,7 @@
// 鏌ヨ鏈烘埧闈㈡澘淇℃伅
function searchPanelInfo(data) {
- var point = data.point;
+ var point = new BMap.Point(data.point.lng, data.point.lat);
var stationInfo = getStaionByPoint(point);
if(!stationInfo) {
alert('闈㈡澘淇℃伅鏌ヨ澶辫触锛�');
@@ -3461,10 +3480,11 @@
});
});
- layui.use(['form', 'layer', 'laytpl'], function() {
+ layui.use(['form', 'layer', 'laytpl', 'element'], function() {
var form = layui.form;
var layer = layui.layer;
var laytpl = layui.laytpl;
+ var element = layui.element;
// 鐐瑰嚮楗肩姸鍥鹃厤缃�
$('#faCog').click(function() {
@@ -3603,9 +3623,7 @@
});
}
- // 鍦板浘宸︿笂鏂归潰鏉挎ā鍧�
- var mapViewArea = GLOBAL.BMap.mapViewArea; // 鍦板浘鏄剧ず鍖哄煙鐨勪俊鎭�
- // 鐐瑰嚮闈㈡澘涓婃柟鐨勫皬鍥炬爣鏄剧ず璁惧畾淇℃伅
+ // 鍦板浘宸︿笂鏂归潰鏉挎ā鍧�-鐐瑰嚮闈㈡澘涓婃柟鐨勫皬鍥炬爣鏄剧ず璁惧畾淇℃伅
$('#showMapInfoDetail').click(function() {
$('.map-info-detail').slideToggle();
});
@@ -3615,50 +3633,49 @@
$('.map-info-detail').slideUp();
});
- // 閬嶅巻mapViewArea鑾峰彇mapVsAreaSel涓嬫媺妗嗙殑鍊�
- var mapVsAreaSel = $('#mapVsAreaSel');
- var mapVsAreaSelOpts = [];
- for(var i=0; i<mapViewArea.length; i++) {
- var _data = mapViewArea[i];
- var tmp = getOptionsData(_data.name, _data.area, _data);
- mapVsAreaSelOpts.push(tmp);
- }
- // 鐢熸垚闈㈡澘涓殑mapVsAreaSel
- createOptions(mapVsAreaSel, mapVsAreaSelOpts);
- // 鏄剧ず榛樿鍖哄煙-涓浗
- setMapViewArea(mapViewArea[0]);
- centerMapByPoint(map); // 鏍规嵁褰撳墠鐢ㄦ埛璁惧畾鐨勪綅缃樉绀轰腑蹇冪偣
- // 鐐瑰嚮闈㈡澘纭畾鎸夐挳
- $('#mapPanelEn').click(function() {
- var areaData = mapVsAreaSel.find('option:selected').data('attr');
-
- // 璁剧疆澶撮儴鍙鍖哄煙鐨勬枃鏈�
- $('#mapVsArea').text(areaData.name);
-
- // 璁剧疆鍙鍖哄煙
- setMapViewArea(areaData);
+ // 鍐呭鏀瑰彉鍒濆璇�$('#mapToolSearchBtn').data('homeInfo')鐨勫��
+ $( "#mapToolSearch" ).on('input propertychange', function(){
+ $('#mapToolSearchBtn').data('homeInfo', 0);
+ });
+ // 瀹氫箟鏈烘埧鏌ヨ淇℃伅
+ $( "#mapToolSearch" ).autocomplete({
+ source: [],
+ select: function(event, ui) {
+ $('#mapToolSearchBtn').data('homeInfo', ui.item); // 璁剧疆鏈烘埧淇℃伅鍐呭
+ }
});
- // 璁剧疆鍦板浘鐨勫彲瑙嗗尯鍩�
- function setMapViewArea(data) {
- var left = new BMap.Point(data.left.lng, data.left.lat);
- var right = new BMap.Point(data.right.lng, data.right.lat);
- var b = new BMap.Bounds(left, right);
-
- var cLng = (data.left.lng+data.right.lng)/2;
- var cLat = (data.left.lat+data.right.lat)/2;
- var f = new BMap.Point(cLng, cLat);
- map.panTo(f, {
- noAnimation: "no"
- });
-
-
- try {
- BMapLib.AreaRestriction.setBounds(map, b);
- } catch (e) {
- alert(e);
+ // 鐐瑰嚮鏌ョ湅homeInfo鐨勫��
+ $('#mapToolSearchBtn').click(function() {
+ var homeInfo = $(this).data('homeInfo');
+ if(homeInfo) {
+ searchPanelInfo(homeInfo);
+ $(this).data('homeInfo', 0);
+ $( "#mapToolSearch" ).val('');
+ }else {
+ layer.msg('璇烽噸鏂拌緭鍏ユ満鎴夸俊鎭紒');
+ $( "#mapToolSearch" ).val("");
}
- }
+ });
+
});
+
+ // 鏇存柊鍦板浘宸ュ叿鎼滅储鏈烘埧
+ function updateSearchSource(data) {
+ var homeSource = [];
+ for(var i=0; i<data.length; i++) {
+ var _data = data[i];
+ var tmp = {
+ label: _data.title+'('+_data.sId+')',
+ point: {
+ lng: _data.lng,
+ lat: _data.lat
+ }
+ };
+ homeSource.push(tmp);
+ }
+
+ $( "#mapToolSearch" ).autocomplete('option', 'source', homeSource);
+ }
</script>
</html>
--
Gitblit v1.9.1