deletesection.html 9.18 KB
<!-- 编辑路段 -->
<div class="modal fade" id="delete_section_mobal" role="basic"
	aria-hidden="true">
	<div style="margin:5% auto">
		<div class="modal-content">
			<div class="col-md-12">
				<div class="portlet light porttlet-fit bordered">
					<div class="portlet-title">
						<div class="tipso-animation">
						</div>
						<div class="caption">
							<i class="fa fa-info-circle font-dark"></i> <span
								class="caption-subject font-dark sbold uppercase">Road section List</span>
						</div>
						<div class="actions">
							<div class="modal-footer-left">
								<button type="button" class="btn btn-primary" id="batchDeleteSectionButton">批量撤销路段</button>									
								<button type="button" class="btn default" data-dismiss="modal">Cancel</button>
							</div>
						</div>
					</div>
					<div class="portlet-body">
						<div class="table-container" style="margin-top: 10px">
							<from class="form-horizontal" role="form"
								id="batch_delete_section_form">
							<table
								class="table table-striped table-bordered table-hover table-checkable"
								id="datatable_section_detele">
								<thead>
									<tr role="row" class="heading">
										<th width="2%"><input type="checkbox" name="scetionCheckItems"
											id="scetionCheckItems"></input></th>
										<th width="2%">Serial number</th>
										<th width="5%">路段路由编号</th>
										<th width="5%">Line code</th>
										<th width="11%">Line name</th>
										<th width="7%">Direction</th>
										<th width="11%">Section name</th>
										<th width="5%">Section code</th>
										<th width="5%">Section seq</th>
										<th width="5%">Section speed limited</th>
										<th width="5%">Section distance</th>
										<th width="5%">Section duration</th>
										<th width="5%">Version</th>
										<!-- 	<th width="6%">State</th>
								<th width="9%">Operation</th> -->
									</tr>
								</thead>
								<tbody></tbody>
							</table>
							</from>
							<div class="actions">
								<div style="text-align: right">
										<ul id="pagination" class="pagination"></ul>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

<script type="text/html" id="sectionInfo_list_table_temp_detele">
	{{each list as obj i }}
		<tr>
			<td style="vertical-align: middle;">
				<input type="checkbox" class="group-checkable icheck" name="items" value="{{obj.id}}" id="{{obj.id}}" >
			</td>
			<td style="vertical-align: middle;">
				 {{(list.page*10)+(i+1)}}
			</td>
			<td style="vertical-align: middle;">
				{{obj.id}}
			</td>
			<td style="vertical-align: middle;">
				{{obj.lineCode}}
			</td>
			<td style="vertical-align: middle;">
				{{obj.line.name}}
			</td>
			<td style="vertical-align: middle;"> 
				{{if obj.directions == '0'}}
					上行
				{{else if obj.directions == '1'}}
					下行
				{{/if}}
			</td>
			<td style="vertical-align: middle;">
				{{obj.section.sectionName}}
			</td>
			<td style="vertical-align: middle;">
				{{obj.sectionCode}}
			</td>
			<td style="vertical-align: middle;">
				{{obj.sectionrouteCode}}
			</td>
			<td style="vertical-align: middle;">
				{{obj.speedLimit}}
			</td>
			<td style="vertical-align: middle;">
				{{obj.sectionDistance}}
			</td>
			<td style="vertical-align: middle;">
				{{obj.sectionTime}}
			</td>
			<td style="vertical-align: middle;">
				{{obj.versions}}
			</td>			
		</tr>
	{{/each}}
	{{if list.length == 0}}
		<tr>
			<td colspan=13><h6 class="muted">No data</h6></td>
		</tr>
	{{/if}}
</script>
<script type="text/javascript">
$('#delete_section_mobal').on('deleteSectionMobal.show',function(e, ajaxd, line, fun, delBatch) {
	layer.closeAll();
	// 显示mobal
	$('#delete_section_mobal').modal({
		show : true,
		backdrop : 'static',
		keyboard : false
	});
	// 编辑表单元素
	var form = $('#batch_delete_section_form');
	// 提交数据按钮事件
	$('#batchDeleteSectionButton').on('click', function() {
		var checked = $("[name=items]:checked");
		var ids = "";
		checked.each(function() {
			ids = ids + "," + $(this).val();
			//ids.push($(this).val()); 
		});
		if (ids != "" && ids != null && ids != undefined) {
			ids = ids.substr(1, ids.length - 1);
			var params = {};
			params.ids = ids;

			params.status = $($("#versions").find("option:selected")[0]).attr("status");
			$.post('/sectionroute/batchDestroy',params,function(resuntDate) {
                if (resuntDate.status == 'SUCCESS') {
                    // 弹出添加成功提示消息
                    layer.msg('Operation success...');
                    /** 通知更新缓存区 */
                    //$.post('http://192.168.168.171:8800/transport_server/basic/refresh',function(rs) {console.log(rs)})
                } else {
                    // 弹出添加失败提示消息
                    layer.msg('Operation failed...');
                }
                initSearch();
                // 刷新左边树
                fun.resjtreeDate(line.id,delBatch.dir,$("#versions").val());
                
                //var version = $("#versions").val();
                /** 查询路段信息 @param:<Line.id:线路Id;delBatch.dir:方向> @return:data:路段数据 */
                //ajaxd.getSectionRouteInfo(line.id,delBatch.dir,version,function(data) {
                    /** 在地图上画出线路走向  @param:<Line.id:线路Id;delBatch.dir:方向;data:路段数据> */
                //    fun.linePanlThree(line.id,data,delBatch.dir,version);
                //});
            });
		} else {
			layer.msg('请选择要删除的路段!!!');
		}
	});

	/** 全选框 */
	document.getElementById('scetionCheckItems').onclick = function() {
		// 获取所有的复选框  
		var checkElements = document.getElementsByName('items');
		if (this.checked) {
			for ( var i = 0; i < checkElements.length; i++) {
				var checkElement = checkElements[i];
				checkElement.checked = "checked";
			}
		} else {
			for ( var i = 0; i < checkElements.length; i++) {
				var checkElement = checkElements[i];
				checkElement.checked = null;
			}
		}
	}

	/** 页面加载完显示数据 */
	window.onload = initSearch();

	/**
	 * @description : (TODO) 页面加载事件
	 * 
	 */
	function initSearch() {
		var params = new getParams();
		page = 0;
		loadTableDate(params, true);
	}
	function getLineCode(id) {
		var lineCode;
		$.ajax({
	        url: "/line/findById",              //请求地址
	        type: "Get",
	        async:false,
	        //请求方式
	        data: { id : id},        //请求参数
	        success: function (result) {
	        	lineCode = result.lineCode;
	        }
	    });
		return lineCode;
	}
	function getParams() {
		// 搜索参数集合
		params = {};
		params.lineCode_eq = getLineCode(line.id);
		params.directions_eq = delBatch.dir;
		params.destroy_eq = "0"; //默认查没有撤销的路段
		return params;
	}
	/**
	 * @description : (TODO) 表格数据分页加载事件
	 * 
	 * ------@param : 查询参数
	 * 
	 * ------@isPon : 是否重新分页
	 * 
	 */
	function loadTableDate(param, isPon) {
		// 初始化全选按钮
		document.getElementById('scetionCheckItems').checked = null;
		// 搜索参数
		var params = {};
		if (param)
			params = param;
		// 排序(按方向与序号)
		params['order'] = 'directions,sectionrouteCode';
		// 排序方向.
		params['direction'] = 'ASC,ASC';
		// 记录当前页数
		params['page'] = page;
		
		params.version = $("#versions").val();
		
		// 弹出正在加载层
		var i = layer.load(2);
		// 异步请求获取表格数据
		$.get('/sectionroute/allls',params,function(result) {
			// 添加序号
			result.content.page = page;
			// 把数据填充到模版中
			var tbodyHtml = template('sectionInfo_list_table_temp_detele',{list : result.content});
			// 把渲染好的模版html文本追加到表格中
			$('#datatable_section_detele tbody').html(tbodyHtml);
			// 是重新分页且返回数据长度大于0
			if (isPon && result.content.length > 0) {
			// 重新分页
			initPag = true;
			// 分页栏
			showPagination(result);
			}
			// 关闭弹出加载层
			layer.close(i);
		});
	}
	/**
	 * @description : (TODO) 分页栏组件
	 * 
	 */
	function showPagination(data) {
		// 分页组件
		$('#pagination').jqPaginator({
			// 总页数
			totalPages : data.totalPages,
			// 中间显示页数
			visiblePages : 6,
			// 当前页
			urrentPage : page + 1,
			first : '<li class="first"><a href="javascript:void(0);">First<\/a><\/li>',
			prev : '<li class="prev"><a href="javascript:void(0);">Previous<\/a><\/li>',
			next : '<li class="next"><a href="javascript:void(0);">Next<\/a><\/li>',
			last : '<li class="last"><a href="javascript:void(0);">Last<\/a><\/li>',
			page : '<li class="page"><a href="javascript:void(0);">{{page}}<\/a><\/li>',
			onPageChange : function(num, type) {
				if (initPag) {
					initPag = false;
					return;
				}
				var pData = getParams();
				page = num - 1;
				loadTableDate(pData, false);
			}
		});
	}
});
</script>