addstationstemplate.html 9.19 KB
<!-- 手动添加站点 -->
<div class="modal fade" id="add_station_template_mobal" tabindex="-1" role="basic" aria-hidden="true">
	
	<div class="modal-dialog">
		
		<div class="modal-content">
		
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
				<h4 class="modal-title">手动添加站点</h4>
			</div>
			
			<div class="modal-body">
				
				<form class="form-horizontal" role="form" id="save_station_template_form" action="/module" method="post">
				
					<div class="alert alert-danger display-hide"> <button class="close" data-close="alert"></button>
						您的输入有误,请检查下面的输入项
					</div>
					
					<!-- 站点名称 -->
					<div class="form-body">
					
						<div class="form-group">
							<label class="control-label col-md-3">
          						<span class="required"> * </span> 站点名称:
                    		</label>
							<div class="col-md-9">
								<textarea class="form-control" rows="12" name="stations" id="stationsInput" placeholder="站点名称"></textarea> 
							</div>
						</div>
						
					</div>
					
					 <div class="form-group">
						<label class="col-md-3 control-label">坐标系类型:</label>
						<div class="col-md-9">
							<div class="icheck-list">
								<label>
										<input type="radio" class="icheck" name="baseRes" value='No'> 暂无坐标系
								</label>
								<label>
										<input type="radio" class="icheck" name="baseRes" value='GCJ02' > 火星坐标系
								</label>
								<label >
									<input type="radio" class="icheck" name="baseRes" value='BD09'> 百度坐标系
								</label>
								<label >
									<input type="radio" class="icheck" name="baseRes" value='WGS84' checked> WGS84坐标系
								</label>
							</div>
						</div>
					 </div>
					
					 <div class="form-group">
					 	<div class="alert alert-info font-blue-chambray" style="background-color: #2C3E50">
                            <h5 class="block"><span class="help-block" style="color:#1bbc9b;"> * 手动添加站点规划说明: </span></h5>
                            <p>
                            	<span class="help-block" style="color:#1bbc9b;">
                            		&nbsp;请在文本域中按站点顺序依次输入站点名称(如果已有站点GPS坐标,请将坐标跟在站点名称后面用【Tab】键隔开),每输入完一个站名时请按回车键【Enter】换行.
                            		例如:<br><br>
                            		浦东大道金桥路	121.496612	31.238960<br>
                            		浦东大道居家桥路	121.496618	31.238957<br>
                            		浦东大道德平路	121.496622	31.238948<br>
                            	</span> 
                            </p>
                        </div>
					 </div>
				</form>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn default" data-dismiss="modal" id="addMobalHiden">取消</button>
				<button type="button" class="btn btn-primary" id="templateSaveData">提交数据</button>
			</div>
		</div>
	</div>
</div>
<script type="text/javascript">

$('#add_station_template_mobal').on('AddStationTempMobal.show', function(e,map,ajaxd,dir,line,fun){
	
	
	
	// 延迟加载显示mobal
	setTimeout(function(){$('#add_station_template_mobal').modal({show : true,backdrop: 'static', keyboard: false});},200);
	
	// 获取表单元素
	var form = $('#save_station_template_form');
	
	// 获取错误提示信息元素
	var error = $('.alert-danger', form);
	
	// 提交数据点击事件
	$('.modal-footer #templateSaveData').on('click',function() {
		
		// 表单提交
		form.submit();
		
	});
	
	// 表单验证
	form.validate({
		
		errorElement : 'span', 
		
		errorClass : 'help-block help-block-error', 
		
		focusInvalid : false, 
		
		rules : {
			
			'stations' : {
				
				required : true,
				
			}
	
		},
		
		invalidHandler : function(event, validator) {  
			
			error.show();
			
			App.scrollTo(error, -200);
			
		},

		highlight : function(element) { 
			
			$(element).closest('.form-group').addClass('has-error'); 
			
		},

		unhighlight : function(element) { 
			
			$(element).closest('.form-group').removeClass('has-error'); 
			
		},

		success : function(label) {
			
			label.closest('.form-group').removeClass('has-error'); 
			
		},

		submitHandler : function(f) {
			
			// 隐藏手动规划弹出层
			$('#add_station_template_mobal').modal('hide');
			
			var directionData = dir;
			
			// 定义线路名称
			var lineNameV = $('.portlet-title .caption').text();
			
			var dirStr = '';
			
			// 上行
			if(directionData==0){
				
				dirStr = '上行路段';
				
				// 隐藏上行规划
				$('#upToolsMobal').hide();
			
			// 下行
			}else if(directionData==1){
				
				dirStr = '下行路段';
				
				// 隐藏上行规划
				$('#downToolsMobal').hide();
				
			}
			
			// 弹出正在加载层
			var i = layer.load(0,{offset:['200px', '280px']});
			
			// 表单序列化
			var paramsForm = form.serializeJSON();
			
			var baseResValue = paramsForm.baseRes;
			
			// 站点名称字符串切割
			var array = paramsForm.stations.split('\r\n');
			
			var arrayFormat = inputStationValueFormat(array);
			
			 
			// 根据站点名称获取百度坐标
			map.stationsNameToPoints(arrayFormat,function(resultJson) {
				
				// 根据坐标点获取两点之间的时间与距离
				map.getDistanceAndDuration(resultJson,function(stationdataList) {
					
					// 设置第一个站的距离
					stationdataList[0].distance = '';
        			
					// 设置第一个站的时间
					stationdataList[0].duration = '';
					
					// 定义站点信息JSON字符串
					var stationJSON = JSON.stringify(stationdataList);
					
					var addLine = line.getLineObj();
					
					// 参数集合
					var params = {};
					
					params.baseRes =  baseResValue;
					
					// 站点信息JSON字符串
					params.stationJSON = stationJSON;
					
					// 线路ID
					params.lineId = addLine.id;
					
					// 方向
					params.directions = directionData;
					
					// 原始坐标类型
					params.dbType = 'b';
					
					// 圆形半径
					params.radius = '100';
					
					// 限速
					params.speedLimit = '60';
					
					// 图形类型(r:圆形;p:多边形)
					params.shapesType = 'r';
					
					// destroy:是否撤销
					params.destroy = '0';
					
					// versions:版本号
					params.versions = '1';
					
					map.lineInfoPanl(lineNameV,directionData,function(BusLine){
						
						// 如果线路信息不为空
						if(BusLine){
							
							// 获取公交线几何对象, 仅当结果自动添加到地图上时有效
							var Polygon = BusLine.getPolyline();
							
							// 返回多边型的点数组(自1.2新增)
							var polyGonArray = Polygon.getPath();
							
							var jsonArray = [{sectionName:lineNameV+dirStr,points:polyGonArray}];
							
							// 定义路段信息字符串
							var sectionJSON = JSON.stringify(jsonArray);
							
							// 路段信息JSON字符串
							params.sectionJSON = sectionJSON;
							
							addSave(params,addLine.id,directionData);
							/* if(BusLine.zB.length == 0){
								
								
								
							}else {
								
							} */
						}else {
							
							
							// 根据坐标点获取两点之间的折线路段
							map.getSectionListPlonly(stationdataList,function(sectiondata) {
								
								// 定义路段信息字符串
								var sectionJSON = JSON.stringify(sectiondata);
								
								// 路段信息JSON字符串
								params.sectionJSON = sectionJSON;
								
								addSave(params,addLine.id,directionData);
								
							});
							
							
						} 
					});
					
				});
				
			});
			
		}
		
	});
	
	function inputStationValueFormat(paramsStationsArray) {
		
		var stationList = [];
		
		var len = paramsStationsArray.length;
		
		for(var k =0;k<len;k++) {
			
			if(paramsStationsArray[k]=="")
				continue;
			
			var tempStr = paramsStationsArray[k].split('\t');
		 
			if(tempStr.length<2){
				
				stationList.push({name:paramsStationsArray[k]+"公交车站",wgs:{x:'',y:''}});
			 
			}else {
				
				stationList.push({name:tempStr[0]+"公交车站",wgs:{x:tempStr[1], y:tempStr[2]}});
				
			}
				 
		}
		
		return stationList;
		
	}
	
	function addSave(params,lineid,directionData) {
		
		
		// 保存
		ajaxd.manualSave(params,function(rd) {

			if(rd.status='SUCCESS') {
				
				layer.msg('保存成功!');
				
			}else {
				
				layer.msg('保存失败!');
				
			}
			
			// 关闭弹出层
			layer.closeAll();
			
			// 清除地图覆盖物
			map.clearMarkAndOverlays();
			
			// 刷新树
			fun.resjtreeDate(lineid,directionData);
			
			// 查询上行路段信息
			ajaxd.getSectionRouteInfo(lineid,directionData,function(data) {
				
			// 在地图上画出线路走向
			fun.linePanlThree(lineid,data,directionData);
				
			});
			
		});
		
	}
	
});
</script>