潘钊 / bsth_control · Files

<link href="/pages/base/line/css/bmap_base.css" rel="stylesheet"
	type="text/css" />
<div class="portlet-body">
	<!-- 地图 -->
	<div id="bmap_basic" class="bmaps"></div>
	<!-- 绘画工具栏 -->
	<div class="leftUtils hidden">
		<div class="btn-group" style="left: 100px;">
		    <a class="btn btn-sm green-seagreen dropdown-toggle" style="width: 98px;" href="javascript:;" data-toggle="dropdown" aria-expanded="false"> 绘制工具
		        <i class="fa fa-angle-down"></i>
		    </a>
		    <ul class="dropdown-menu pull-right" style="min-width:100px">
		        <li>
		            <a href="javascript:;" id="oppenDrawingManager"><i class="fa fa-pencil"></i> 打开 </a>
		        </li>
		        <li>
		            <a href="javascript:;" id = "closeDrawingManager"> <i class="fa fa-reply"></i> 关闭 </a>
		        </li>
		    </ul>
		</div>
	</div>
	<!-- 右边显示栏 -->
	<div class="cut-section" id="scrllmouseEvent_div">
		<div class="portlet-title">
			<div class="caption">途径站点</div>
		</div>
		<div class="portlet-body">
			<div class="table-toolbar" style="text-align: center;" id="generationRoute_div">
				<button class="btn btn-circle blue" id="generationRoute">
					<i class="fa fa-plus"></i> 生成路线
				</button>
			</div>
			<!-- 生成走向跳转的div -->
			<div class="portlet-body hidden" id="route_show">
				<div>
					<ul class="nav nav-pills nav-justified steps">
						<li class="active">
							<a id="section"><span>路段</span></a>
						</li>
						<li>
							<a class="station" id="station"><span>Station</span></a>
						</li>
					</ul>
				</div>
				<div id="section_list_div" class="active" style="margin: 5px;">
				<!-- 上传gps生成路段div -->
					<div id="gpsSection">
						<div class="defeat-scroll"
							style="height: 400px; overflow-y: auto; ">
							<table class="table table-bordered table-hover table-checkable "
								id="section_table" style="color: white;">
								<thead>
									<tr role="row" class="heading">
										<th>截取路段的名称</th>
									</tr>
								</thead>
								<tbody></tbody>
							</table>
						</div>
						<div class="table-toolbar">
							<a class="btn btn-circle blue" id="Undo">撤销切点</a>
							<a class="btn btn-circle blue" id="cutSection">Submit option</a>
						</div>
					</div>
					<!-- 引用当前版本路段div -->
					<div id="citeSection">
						<div class="defeat-scroll"
							style="height: 400px; overflow-y: auto; ">
						</div>
						<div class="table-toolbar">
							<a class="btn btn-circle blue" id="findSection">View section</a>
							<a class="btn btn-circle blue" id="addSection">Add section</a>
							<a class="btn btn-circle blue" id="submitOptions">Submit option</a>
						</div>
					</div>
				</div>
				<div id="station_list_div" class="hidden">
					<div class="defeat-scroll"
						style="height: 400px; overflow-y: auto; ">
					</div>
					<div class="table-toolbar">
						<a class="btn btn-circle blue" id="addStation">Add station</a>
						<a class="btn btn-circle blue" id="findStation">View station</a>
						<a class="btn btn-circle blue" id="updateStation">Edit station</a>
					</div>			
				</div>
			</div>
		</div>
	</div>
</div>
<!-- 右侧悬浮框截取路段List -->
<script type="text/html" id="section_list">
	{{each list as obj i }}
		<tr>
			<td style="vertical-align: middle;">
				{{obj.name}}
			</td>
	{{/each}}
	{{if list.length == 0}}
		<tr>
			<td colspan=13><h6 class="muted">沒有相关数据</h6></td>
		</tr>
	{{/if}}
</script>
<!--上传GPS坐标生成路线监听事件 -->
<script type="text/javascript">
$(function(){
	// 关闭左侧栏
	if (!$('body').hasClass('page-sidebar-closed')) {$('.menu-toggler.sidebar-toggler').click();}
	// 线路id
	var id = $.url().param('no');
	// 方向 （0:上行；1:下行）默认上行
	var direction = 0;
	// 房防止页面session失效
    setInterval(function () {
        $get('/line/' + id ,null, function(result){});
    },1000*60*120);
	// 站点Map
	var stationRouteMap = new Map();
	// 路段Map
	var sectionRouteMap = new Map();
	// 如果线路ID不为空
	if(id) {
		var styleOptions = {
				strokeColor : "blue",//边线颜色。
				fillColor : "blue",//填充颜色。当参数为空时，圆形将没有填充效果。
				strokeWeight : 3,//边线的宽度，以像素为单位。
				strokeOpacity : 0.8,//边线透明度，取值范围0 - 1。
				fillOpacity : 0.6,//填充的透明度，取值范围0 - 1。
				strokeStyle : 'solid' //边线的样式，solid或dashed。
		};
		
		// 等候500毫秒执行
		setTimeout(function(){
			
			/** 初始化线路标题 @param:<id:线路ID> */
			PublicFunctions.setTiteText(id);
			
			/** 初始化地图对象map @return:Map对象 */
			var map_ = WorldsBMapLine.init();
			
			/** 初始化绘图工具类 @param:<map_:map对象；styleOptions:绘图样式对象> @return:DrawingManager对象 */
			DrawingManagerObj.init(map_,styleOptions);
			
			layer.msg('请生成路线！！！');
						
		},500);
	}else {
		
		// 缺少ID
		layer.confirm('【ID缺失，请点击返回，重新进行操作】', {btn : [ 'Back' ],icon: 3, title:'Tip' }, function(index){
			
			// 关闭提示弹出层
			layer.close(index);
			
			// 返回线路list页面
			loadPage('/pages/base/line/list.html');
			
		});
		
	}
	
	// 上传GPS坐标生成路线事件
	$('#generationRoute').on('click', function() {
		EditRoute.setLineId(id);
// 		EditRoute.setLineDir(direction);
		$.get('editRoute.html', function(m){
			$(pjaxContainer).append(m);
			$('#edit_route_mobal').trigger('editRouteMobal.show',[TransGPS,EditRoute,WorldsBMapLine,DrawingManagerObj,MapGetAjaxData,PublicFunctions]);
		});
		// 更新section_table 和缓存中的切点
		WorldsBMapLine.initCutSectionPoint();
		WorldsBMapLine.setPointIndex(0);
		WorldsBMapLine.setFirstPoint(null);// 删除点后清空数据(第一个点坐标)
	});
	
	// 提交截取事件
	$('#cutSection').on('click', function() {
		if(WorldsBMapLine.getSectionList().length != 0) {
			var sectionList = WorldsBMapLine.getSectionList();
			var data = {};
			var section = EditSectionObj.getEitdSection();
			var josnSectionList = JSON.stringify(sectionList);
			section.cutSectionList = josnSectionList;
			// 版本号
			$.get('/lineVersions/findCurrentVersion',{'lineId':id},function(versions){
				section.versions = versions;
				layer.confirm('提交马上会把原有的站点和路段覆盖，您确定要提交吗？', {
					btn: ['提交','取消'] //按钮
				}, function(index){
					layer.close(index);
					$.post('/section/sectionCut', section, function(resuntDate){
						if(resuntDate.status=='SUCCESS') {
							// 弹出添加成功提示消息
							layer.msg('提交成功，跳转到线路详情页面！');
							window.location.href = "/pages/base/stationroute/list.html?no="+section.sectionrouteLine+","+section.sectionrouteDirections;
						}else {
							// 弹出添加失败提示消息
							layer.msg('提交失败...');
						}
					});
				});	
			});
// 			$.get('submit_select.html', function(m){
// 				$(pjaxContainer).append(m);
// 				$('#submit_select_mobal').trigger('submitSelectMobal.show',[section,EditRoute]);
// 			});
		} else {
			layer.msg("请先截取路段！！！");
		}
		//});		
	});	
	
	// 删除最后一个路段
	$('#Undo').on('click', function() {
		if(WorldsBMapLine.getPointIndex() > 1) {
			// 点总数-1
			var pointIndex = WorldsBMapLine.getPointIndex() - 1;
			WorldsBMapLine.setPointIndex(pointIndex);
			// 截取的路段list
			var sectionList = WorldsBMapLine.getSectionList();
			var sectionListLen = sectionList.length;
			// 要删除的点
			var point = sectionList[sectionListLen-1].section[1];
			sectionList.splice(sectionListLen-1,1);
			WorldsBMapLine.setSectionList(sectionList);
			WorldsBMapLine.deleteCutSectionPoint(point);
			WorldsBMapLine.refreshCutSectionTable();
		} else if(WorldsBMapLine.getPointIndex() == 1 ) {
			var pointIndex = WorldsBMapLine.getPointIndex() - 1;
			WorldsBMapLine.setPointIndex(pointIndex);
			var firstPoint = WorldsBMapLine.getFirstPoint();
			WorldsBMapLine.deleteCutSectionPoint(firstPoint);
			WorldsBMapLine.setIsCutSection(false);
			WorldsBMapLine.setFirstPoint(null);// 删除点后清空数据
		} else {
			layer.msg("没有截取路段，不可以撤销！！！");
		}
	});
	
	// 监听右侧悬浮框导航栏事件
	$('#section').on('click',function(){
		$('#station').parent().removeClass('active');
		$('#section').parent().addClass('active');
		$('#station_list_div').removeClass('active');
		$('#station_list_div').addClass('hidden');
		$('#section_list_div').removeClass('hidden');
		$('#section_list_div').addClass('active');
		var generationType = EditRoute.getLineGenerationType();
		// 更具生成类型展示不同页面
		if(generationType == 'cite'){
			$('#gpsSection').addClass('hidden');
			
		} else if(generationType == 'uploadGPS') {
			$('#citeSection').addClass('hidden');
		}
		// 清除地图覆盖物
		WorldsBMapLine.clearMarkAndOverlays();
		var params = {};
		var line = EditRoute.getLineObj();
		params.lineId=line.id;
		params.dir = line.dir;
		// 查询路段信息
		$get('/sectionroute/findCacheSection',params,function(data) {
			var section_radio_html = '<div id="section_radio">';
			var cont = 1;
			var check = 'checked="checked"';
			$.each(data,function(){
				sectionRouteMap[this.sectionrouteId] = this;
				section_radio_html += '<div class="radio"><label class="radio_label section"><input name="sectionRadio" type="radio" class="radioclass" value="'+this.sectionrouteId+'" '+(cont==1?check:"")+' />'+this.sectionName+"</label></div>";
				cont++;
			});
			section_radio_html +=  '</div>';
			$("#section_list_div #citeSection .defeat-scroll").html(section_radio_html);
			// 在地图上画出线路走向
			PublicFunctions.linePanlThree(line.id,data,line.dir);
		});
	});
	
	// 监听右侧悬浮框导航栏事件
	$('#station').on('click',function(){
		$('#section').parent().removeClass('active');
		$('#station').parent().addClass('active');
		$('#station_list_div').removeClass('hidden');
		$('#station_list_div').addClass('active');
		$('#section_list_div').removeClass('active');
		$('#section_list_div').addClass('hidden');
		// 清除地图覆盖物
		WorldsBMapLine.clearMarkAndOverlays();
								 
		var params = {};
		var line = EditRoute.getLineObj();
		params.lineId=line.id;
		params.dir = line.dir;
		$.get('/stationroute/findCachePoint',params,function(data){
			var station_radio_html = '<div id="station_radio">';
			var cont = 1;
			var check = 'checked="checked"';
			$.each(data,function(){
				stationRouteMap[this.stationRouteId] = this;
				station_radio_html += '<div class="radio"><label class="radio_label station"><input name="stationRadio" type="radio" class="radioclass" value="'+this.stationRouteId+'" '+(cont==1?check:"")+' />'+this.stationRouteStationName+"</label></div>";
				cont++;
			});
			station_radio_html +=  '</div>';
			$("#station_list_div .defeat-scroll").html(station_radio_html);
		});
	});
	
	// 查询路段
	$('#findSection').on('click', function(){
		var id = $(".section input[type='radio']:checked").val();
		var sectionRoute = sectionRouteMap[id];
		if(id && sectionRoute){
			WorldsBMapLine.drawingSection(sectionRoute);
		} else if(id && !sectionRoute){
			layer.msg('您选择的路段不存在，请重新选择！');
		}else{
			layer.msg('请先选择要查看的路段！');
		}		
	});
	
	// 添加站点
	$('#addStation').on('click', function(){
		$.get('addstation_select.html', function(m){
			$(pjaxContainer).append(m);
			$('#addstation_select_mobal').trigger('AddSelectMobal.show', [WorldsBMapLine, DrawingManagerObj, MapGetAjaxData, EditRoute, PublicFunctions]);
		});
	});
	
	// 查询站点
	$('#findStation').on('click', function(){
		var id = $(".station input[type='radio']:checked").val();
		var stationRoute = stationRouteMap[id];
		if(id && stationRoute){
			// 站点形状
			var shapesType = stationRoute.stationShapesType;
			// 如果是圆
			if(shapesType =='r') {
				
				// 百度地图画圆
				WorldsBMapLine.pointsCircle(stationRoute);
			
			// 如果是多变行
			}else if(shapesType == 'd') {
				
				// 百度地图画多边形
				WorldsBMapLine.pointsPolygon(stationRoute);
			}
		} else if(id && !stationRoute){
			layer.msg('您选择的站点不存在，请重新选择！');
		}else{
			layer.msg('请先选择要查看的站点！');
		}		
	});
	
	// 修改站点
	$('#updateStation').on('click', function(){
		var id = $(".station input[type='radio']:checked").val();
		var stationRoute = stationRouteMap[id];
		if(id && stationRoute){
			$.get('editstation_select.html', function(m){
				$(pjaxContainer).append(m);
				$('#editstation_select_mobal').trigger('editStationSelectMobal_show', [WorldsBMapLine, PublicFunctions, DrawingManagerObj, stationRoute]);
			});
		} else if(id && !stationRoute){
			layer.msg('您选择的站点不存在，请重新选择！');
		}else{
			layer.msg('请先选择要编辑的站点！');
		}
	});
	
	// 监听打开鼠标绘制工具按钮事件.
	$('#oppenDrawingManager').on('click',function() {
		DrawingManagerObj.drawingManagerOpen();
	});
	// 监听关闭鼠标绘制工具按钮事件.
	$('#closeDrawingManager').on('click',function() {
		DrawingManagerObj.drawingManagerClose();
	});
	
	// 滚动轴监听事件
	$('#scrllmouseEvent_div').on('mousemove',function() {
		$('.defeat-scroll').css('overflow','auto');
	}).on('mouseleave',function() {
		$('.defeat-scroll').css('overflow','hidden');
	});	
});
</script>
<!--编辑路线类 -->
<script src="/pages/base/line/js/editRoute.js"></script>
<!--坐标转换类 -->
<script src="/pages/base/line/js/transGPS.js"></script>
<!-- 地图类 -->
<script src="/pages/base/line/js/map.js"></script>
<!-- 函数与方法 -->
<script src="/pages/base/line/js/map-function.js"></script>
<!-- 修改路段对象类 -->
<script src="/pages/base/stationroute/js/editsection.js"></script>
<!-- 绘图类 -->
<script src="/pages/base/line/js/drawingManager.js"></script>
<!-- ajax请求类 -->
<!-- <script src="/pages/base/stationroute/js/stationroute-ajax-getdata.js"></script> -->
<!-- ajax请求类 -->
<script src="/pages/base/line/js/map-ajax-getdata.js"></script>