增加定位内容

application/index/view/store/index.html

@@ -3,6 +3,11 @@
 <style>
     /*获取百度经纬度样式*/
 	/*********************************************************百度定位页面iframe引入*************************************/
+	.address-search-head-div{
+		height: 88px;
+		overflow: hidden;
+		padding-left: 12%;
+	}
 	
 	#position_box {
 		height: 750px;
@@ -126,7 +131,6 @@
 		text-align: center;
 		display: none;
 	}
-    /**/
 </style>
 <div id="page-content-wrapper">
     <div class="container">
@@ -287,7 +291,7 @@
                     </div>
                     <div class="form-group">
                         <label class="col-sm-3 control-label">详细地址：</label>
-                        <input type="text" value="" name="address" class="form-control btn6" placeholder="请输入详细地址">
+                        <input type="text" value="" name="address" id="address" class="form-control btn6" placeholder="请输入详细地址">
                     </div>
                     <div class="form-group">
                         <label class="col-sm-3 control-label">公司名：</label>

public/resource/js/storeList.js

@@ -2,55 +2,172 @@
  * Created by 刘丹 on 2017/12/11.
  */
 
-define (['doT', 'text!temp/store_template_tpl.html', 'css!style/home.css','ckfinder','ckfinderStart','pagination','bootstrapJs'], function (doT, template) {
+define(['doT', 'text!temp/store_template_tpl.html', 'css!style/home.css', 'ckfinder', 'ckfinderStart', 'pagination', 'bootstrapJs'], function(doT, template) {
 	store = {
-        pageNo: 1, /*第几页*/
-        pageSize: 10, /*每页显示多少条*/
-        id : '',
-        house_id:'',
-        type:'',
-        valueCurrent:'',
-        ajaxObj:'',
-        stopstatus:true,
-        boxphoto:'',
-        init: function () {
+		pageNo: 1,
+		/*第几页*/
+		pageSize: 10,
+		/*每页显示多少条*/
+		id: '',
+		house_id: '',
+		type: '',
+		valueCurrent: '',
+		ajaxObj: '',
+		stopstatus: true,
+		boxphoto: '',
+		init: function() {
 			//初始化dot
-            $ ("body").append (template);
-            store.getList ();
-            store.event ();
+			$("body").append(template);
+			store.getList();
+			store.event();
 			store.getRegionsDisc();
 		},
-        event: function () {
-            $("#search").click(function () {
+		event: function() {
+			$("#search").click(function() {
 				store.getList(1);
 			});
 
-            $("#reset").click(function () {//重置
+			$("#reset").click(function() { //重置
 				document.getElementById("form_search").reset();
 			});
 
-            $ (document).delegate (".del_modal", "click", function () {
-                store.id = $ (this).attr ("data-id");
+			$(document).delegate(".del_modal", "click", function() {
+				store.id = $(this).attr("data-id");
 
 			});
 
+			/************************************************百度地址定位相关*************************************************************/
+			var _doc = $(document),
+				_provinceInternalObj = $('#province_internal'),
+				_cityInternalObj = $('#city_internal'),
+				_discInternalObj = $('#disc_internal'),
+				_addressInternalObj = $('#address'),
+				_longitudeObj = $('#longitude'),
+				_latitudeObj = $('#latitude'),
+				ulHtml = $('#main_ul>ul'),
+				loadItem = $("#loading_pic"),
+				noMoreItem = $("#no_more"),
+				_inputObj = $('#search_input'),
+				valueCurrent = '';
+			//初始化,百度地图相关对象
+			var LocalSearch = new BMap.LocalSearch(),
+				myGeo = new BMap.Geocoder();
 
+			//搜索地址的回调
+			LocalSearch.setSearchCompleteCallback(function(data) {
+				if(LocalSearch.getStatus() == BMAP_STATUS_SUCCESS) {
+					console.log(data);
+					var _html = "";
+					for(var i = 0; i < data.getCurrentNumPois(); i++) {
+						_html += '<li data-city="{2}" data-lat="{3}" data-lng="{4}" data-dismiss="modal"><p>{0}</p><p>{1}</p></li>'.stringFormatObj({
+							'0': data.getPoi(i)["title"],
+							'1': data.getPoi(i)["address"],
+							'2': data.getPoi(i)["city"],
+							'3': data.getPoi(i)["point"]["lat"],
+							'4': data.getPoi(i)["point"]["lng"]
+						});
+					};
+					ulHtml.html(_html);
+					loadItem.hide();
+					noMoreItem.show();
+				};
+			});
+
+			_inputObj.on('input', function(e) {
+				e.preventDefault();
+				e.stopPropagation();
+				valueCurrent = $(this).val();
+				if(valueCurrent != '') {
+					addressResetLoad();
+					addressLoadMain(valueCurrent);
+				} else {
+					ulHtml.html('');
+					loadItem.hide();
+					noMoreItem.show();
+					return false;
+				}
+			});
+
+			//输入框的取消图标点击事件
+			$('.cancel-pic').click(function(e) {
+				e.preventDefault();
+				e.stopPropagation();
+				_inputObj.val('').focus();
+				addressResetLoad();
+			});
+
+			_doc.on('click', '#main_ul>ul>li', function(e) {
+				e.preventDefault();
+				e.stopPropagation();
+				var _this = $(this),
+					_city = _this.data('city'),
+					_lng = Number(_this.data('lng')), //经度
+					_lat = Number(_this.data('lat')); //纬度
+
+				getDistrict(_lng, _lat, function(data) {
+					console.log(data);
+					if(data['city']) {
+						_provinceInternalObj.val(data['province']);
+						_cityInternalObj.val(data['city']);
+						_discInternalObj.val(data['district']);
+						var _htmlOri = _this.find('p:nth-of-type(2)').html(),
+							_htmlDeal = '',
+							_index1 = _htmlOri.indexOf('市'),
+							_index2 = _htmlOri.indexOf('区');
+						if((_index1 > 0) && (_index2 > 2) && (_index2 > _index1)) {
+							_htmlDeal = _htmlOri.slice(_index2 + 1);
+						} else {
+							_htmlDeal = _htmlOri;
+						}
+						_addressInternalObj.val(_htmlDeal);
+						_longitudeObj.val(_lng);
+						_latitudeObj.val(_lat);
+						//						$('#position_box').hide();
+					} else {
+						alert('请重新选择地址');
+						return false;
+					}
+				}); //根据经纬度获取城市区域名
+			});
+
+			function addressResetLoad() {
+				ulHtml.html('');
+				loadItem.hide();
+				noMoreItem.show();
+			};
+
+			function addressLoadMain(keyword) {
+				loadItem.show();
+				noMoreItem.hide();
+				LocalSearch.setLocation('上海市');
+				LocalSearch.search(keyword);
+			};
+
+			function getDistrict(str1, str2, fn) {
+				myGeo.getLocation(new BMap.Point(str1, str2), function(result) {
+					if(result) {
+						console.log(result);
+						fn(result['addressComponents']);
+					}
+				});
+			};
+			/************************************************百度地址定位相关****结束*************************************************************/
 
 		},
-        getRegionsDisc : function (name) {
+		getRegionsDisc: function(name) {
 			var params = {};
 			params.parent_code = 310100;
-            $.ajax ({
+			$.ajax({
 				url: '/index/regions',
 				type: 'GET',
 				async: true,
 				data: params,
 				dataType: 'json',
-                success: function (data) {
-                    if (data.code == 200) {
+				success: function(data) {
+					if(data.code == 200) {
 						var _html = '';
-                        $.each(data.data, function (i,n) {
-                                _html += '<option value="'+n.fullName+'">'+n.fullName+'</option>';
+						$.each(data.data, function(i, n) {
+							_html += '<option value="' + n.fullName + '">' + n.fullName + '</option>';
 						});
 						$("#area").append(_html);
 					} else {
@@ -59,36 +176,35 @@ define (['doT', 'text!temp/store_template_tpl.html', 'css!style/home.css','ckfin
 				}
 			});
 		},
-        getList: function (pageNo) {
+		getList: function(pageNo) {
 			store.pageNo = pageNo;
 			var params = {};
 			params.pageNo = store.pageNo;
 			params.pageSize = store.pageSize;
-            params.district  = $('#area option:selected') .val();;//城市区
-            params.store_name  = $('#mend_name') .val();//门店名
-            params.agents_name  = $('#name') .val();//店长名
-            params.agents_phone  = $('#phone') .val();//手机号
+			params.district = $('#area option:selected').val();; //城市区
+			params.store_name = $('#mend_name').val(); //门店名
+			params.agents_name = $('#name').val(); //店长名
+			params.agents_phone = $('#phone').val(); //手机号
 
-            $.ajax ({
-                url: '/index/storeList',//获取列表
+			$.ajax({
+				url: '/index/storeList', //获取列表
 				type: 'GET',
 				async: true,
 				data: params,
 				dataType: 'json',
-                success: function (data) {
+				success: function(data) {
 					console.log(data.data);
-                    var temp = document.getElementById ('store_list_tpl').innerHTML;
-                    var doTtmpl = doT.template (temp);
-                    $ ("#store_list").html (doTtmpl (data.data.list));
-
+					var temp = document.getElementById('store_list_tpl').innerHTML;
+					var doTtmpl = doT.template(temp);
+					$("#store_list").html(doTtmpl(data.data.list));
 
 					/*分页代码*/
-                    $ ("#pagediv").pagination ({
+					$("#pagediv").pagination({
 						length: data.data.total,
 						current: pageNo,
 						every: store.pageSize,
-                        onClick: function (el) {
-                            store.getList (el.num.current);
+						onClick: function(el) {
+							store.getList(el.num.current);
 						}
 					});
 				}