{% extends 'MirrorOamBundle:Base:base.html.twig' %}

{% block style %}
<link rel="stylesheet" type="text/css" href="{{ asset('bundles/mirroroam/css/datetimepicker.css') }}">
<style type="text/css">

#split-page {
	text-align: center;
}
#employee-table td{
	height: 40px;
}
#employee-table input{
	width:200px;
}
#employee-info{
	width: 66%;
	height: 520px;
	left: 0px;
	right: 0px;
	top: 100px;
	margin: 0px auto;
	background-color: #ffffff;
}
#test-info{
	width:10%;
	height:200px;
	left: 0px;
	right: 0px;
	top: 100px;
	margin: 0px auto;
	background-color: red;
}

.tableul li:not(.AutoNewline){
	display: inline-block;
	text-align: center;;
}
.ulth li{
	font-weight: bold;
}
.AutoNewline
{
	Word-break: break-all;/*必须*/
}
.tableCaseOne{
	width:7%;
}
.tableCaseTwo{
	width:13%;
}
.tableCaseThree{
	width:30%;
}
.tableCaseSix{
	width:7%;
}
.tableCaseSeven{
	width:7%;
}
.tableCaseEight{
	width:7%;
}
.tableCaseNine{
	width:15%;
}
.tableCaseTen{
	width:7%;
}
.tableCaseEleven{
	width:6%;
}

.modal-body {
	height: 368px;
	/*//max-height: 240px;*/
	overflow-y: scroll;
}
.modal-body>div {
	margin-bottom: 8px;
}
.modal-body>div>.close {
	line-height: 35px;
}
.modal-body .form-control {
	width: 30%;
	display: inline-block;
}

.form-control {
	width: auto;
	display: inline-block;
}

#mapframe{
	/*//     position:absolute;*/
	/*//     top:20%;*/
	/*//     right:10%;*/
	/*//     z-index:2000;*/
	/*//     display:none;*/
	/*//     width:50%;*/
	/*//     height:60%;*/
	width:84%;
	height:400px;
	position:absolute;
	margin-bottom:10px;
	display:none;
}
/*// #container1{*/
/*// 	width:100%;*/
/*// 	height:300px;*/
/*// 	display:none;*/
/*// }*/
.panel1{
	background-color: #ddf;
	color: #333;
	border: 1px solid silver;
	box-shadow: 3px 4px 3px 0px silver;
	position: absolute;
	top: 20px;
	right: 10px;
	/*//z-index:2000;*/
	border-radius: 5px;
	overflow: hidden;
	line-height: 20px;
}
#input{
	width: 250px;
	height: 25px;
	border: 0;
}
#container{
	height: 100%;
	margin: 0px
}
#closemap{
	font-size:25px;
	position: absolute;
	top: -5px;
	right: 5px;
	cursor: pointer;
}

.icon-arrow-left {
	display: inline-block;
	width: 14px;
	height: 14px;
	margin-top: 1px;
	line-height: 14px;
	vertical-align: text-top;
	background-image: url(/bundles/mirroroam/images/glyphicons-halflings.png);
	background-position: -240px -95px;
	background-repeat: no-repeat;
}
.icon-arrow-right {
	display: inline-block;
	width: 14px;
	height: 14px;
	margin-top: 1px;
	line-height: 14px;
	vertical-align: text-top;
	background-image: url(/bundles/mirroroam/images/glyphicons-halflings.png);
	background-position: -265px -95px;
	background-repeat: no-repeat;
}
.icon-remove {
	display: inline-block;
	width: 14px;
	height: 14px;
	margin-top: 1px;
	line-height: 14px;
	vertical-align: text-top;
	background-image: url(/bundles/mirroroam/images/glyphicons-halflings.png);
	background-position: -310px 0px;
	background-repeat: no-repeat;
}
</style>
{% endblock %}

{% block content %}
{% raw %}
<div ng-controller="groupListController">
	<h1 class="page-header">车组列表</h1>
	<div class="page-header">
		城市：
		<select class="form-control" ng-change="SelectProvince(this)" ng-model="endProvinceInfo">
			<option ng-repeat="province in provinceEnd" value="{{province}}" ng-selected="search.cityArr.r1Code=={{province.code}}">
				{{province.name}}
			</option>
		</select>
		<select class="form-control" ng-change="SelectCity(this)" ng-model="endCityInfo">
			<option ng-repeat="city in cityEnd" value="{{city}}" ng-selected="search.cityArr.r2Code=={{city.code}}">
				{{city.name}}
			</option>
		</select>
		<select class="form-control" ng-change="SelectRegion(this)" ng-model="endRegionInfo">
			<option ng-repeat="region in regionEnd" value="{{region}}" ng-selected="search.cityArr.r3Code=={{region.code}}">
				{{region.name}}
			</option>
		</select>
		<i class="icon-remove" ng-click="setEmptyCity(this)"></i>
		&nbsp;
		&nbsp;
		&nbsp;
		&nbsp;
		组织：
		<select class="form-control" ng-change="SelectOrganization(this)" ng-model="organization">
			<option ng-repeat="organization in organizationList" value="{{ organization }}">{{ organization.name }}</option>
		</select>
		<i class="icon-remove" ng-click="setEmptyOrganization(this)"></i>
		<br/>
		<br/>
		起始时间：
		<input id="begin-time" ng-model="beginTime" type="text" readonly class="form_datetime form-control" />
		<span class="add-on" ng-click="cleanBeginTime(this)"><i class="icon-remove"></i></span>
		&nbsp;
		&nbsp;
		&nbsp;
		&nbsp;
		结束时间：
		<input id="end-time" ng-model="endTime" type="text" readonly class="form_datetime form-control" />
		<span class="add-on" ng-click="cleanEndTime(this)"><i class="icon-remove"></i></span>
	</div>
	<div class="table-responsive">
		<table class="table table-striped">
			<thead>
		        <tr>
		          <th>#</th>
		          <th>上班时间</th>
		          <th>下班时间</th>
		          <th>车组人员</th>
					<th>车辆信息</th>
		          <th style="width:250px;">位置</th>
		          <th>操作</th>
		        </tr>
			</thead>
			<tbody>
				<tr ng-repeat="group in groupList">
					<td>{{ group.ID }}</td>
					<td>{{ group.Begintime }}</td>
					<td>{{ group.EndTime }}</td>
					<td>
						<table style="text-align:center;width:100%;">
							<tr >
								<td>
									{{ group.EmployeeName }}
								</td>
								<td>
									{{ group.EmployeeTelephone }}
								</td>
								<td>
									{{ group.EmployeeType }}
								</td>
							</tr>
						</table>
					</td>
					<td>{{ group.Plate }}</td>
					<td>{{ group.Position }}</td>
					<td>
						<a href="#" class="btn" ng-click="delete(this)">删除</a>&nbsp;&nbsp;&nbsp;<a href="#" data-target="#employee-info" role="button" data-toggle="modal" ng-click="setEmployeeInfo(this)" >修改信息</a><br/>
					</td>
				</tr>
			</tbody>
		</table>
	</div>
	<div id="split-page">
		<tm-pagination conf="paginationConf"></tm-pagination>
	</div>

	<div id="employee-info" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-header">
			<button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-click="cleanDetail(this)">×</button>
			<h3 id="myModalLabel">修改</h3>
		</div>
		<div class="modal-body">
			<div>
				<table id="employee-table" width="">
					<tr>
						<td>
							上班时间：
						</td>
						<td>
							<input id="modifyBegin-time" ng-model="saveInfo.Begintime" type="text" readonly class="form_datetime form-control"/>
						</td>
					<tr/>
					<tr>
						<td>
							下班时间：
						</td>
						<td>
							<input id="modifyEnd-time" ng-model="saveInfo.EndTime"  type="text" readonly class="form_datetime form-control" />
						</td>
					<tr/>
					<tr>
						<td>位置：</td>
						<td>
							<select class="form-control" ng-change="SelectProvince2(this)" ng-model="endProvinceInfo">
								<option ng-repeat="province in provinceModify" value="{{province}}" ng-selected="saveInfo.ProvinceCode=={{province.code}}">
									{{province.name}}
								</option>
							</select>
							<select class="form-control" ng-change="SelectCity2(this)" ng-model="endCityInfo">
								<option ng-repeat="city in cityModify" value="{{city}}" ng-selected="saveInfo.CityCode=={{city.code}}">
									{{city.name}}
								</option>
							</select>
							<select class="form-control" ng-change="SelectRegion2(this)" ng-model="endRegionInfo">
								<option ng-repeat="region in regionModify" value="{{region}}" ng-selected="saveInfo.RegionCode=={{region.code}}">
									{{region.name}}
								</option>
							</select>
						</td>
					</tr>
					<tr>
						<td></td>
						<td>
							<div class="create-position">
								<input id="keyword1" type="text" class="create-input-full form-control" placeholder="请输入详细地址" ng-blur="clearLat();" onkeydown='keydown(event,"1")' ng-model="saveInfo.Position" style="margin-right:4px;width:400px;"/><a ng-click="selectMap()"><i class="fa fa-map-pin"></i></a>
								<div id="result1" ></div>
							</div>
							<div id="mapframe">
								<div id="container" tabindex="0"></div>
								<div class ='panel1'>
									<input id = 'input' value = '点击地图显示地址/输入地址显示位置' onfocus="this.value=''"/>
									<div id = 'message'></div>

								</div>
								<span id="closemap">×</span>
							</div>
						</td>
					</tr>
					<tr>
						<!--<table class="table table-striped">
							<caption style="font-size:15px;color:black;">车辆信息</caption>
							<thead>
							<tr>
								<th>#</th>
								<th>车牌号</th>
								<th>所属站点</th>
								<th>车辆人员</th>
								<th>联系方式</th>
								<th>市内公里数</th>
								<th>长途公里数</th>
								<th>金额</th>
								<th>状态</th>
								<th>操作</th>
							</tr>
							</thead>
							<tbody>
							<tr ng-repeat="ambulte in ambultetteList" id="{{ ambulte.ID }}" class="test">
								<td>{{ ambulte.ID }}</td>
								<td>{{ ambulte.PlateNumber }}</td>
								<td>{{getStationName(ambulte.StationID)}}</td>
								<td>{{ ambulte.DriverName}}</td>
								<td>{{ ambulte.DriverTelephone }}</td>
								<td>{{ ambulte. Mileage}}</td>
								<td>{{ ambulte.MileageLongWay}}</td>
								<td>{{ ambulte.Sum }}</td>
								<td>{{ ambulte. Status}}</td>
								<td><span id="beSelected{{ ambulte.ID }}" style="font-size:16px;color:green;display: none;">√</span><a id="assignAmbult{{ ambulte.ID }}" href="#" ng-click="assignAmbultette(this)">分配</a></td>
							</tr>
							</tbody>
						</table>-->
						<table class="table table-striped">
							<thead>
							<ul class="tableul ulth" style="list-style: none;margin-top:20px;">
								<li class="tableCaseOne">#</li>
								<li class="tableCaseTwo">车牌号</li>
								<li class="tableCaseThree">所属站点</li>
								<li class="tableCaseSix">市内公里数</li>
								<li class="tableCaseSeven">长途公里数</li>
								<li class="tableCaseEight">金额</li>
								<li class="tableCaseNine">车辆人员</li>
								<li class="tableCaseEleven">操作</li>
							</ul>
							</thead>
							<tbody class="panel panel-default" style="border-color:white;">
							<tr ng-repeat="ambulte in ambultetteList" data-toggle="collapse" data-parent="#accordion" href="#collapse{{ambulte.ID}}"><!--  data-toggle="collapse" data-parent="#accordion" href="#collapse{{staffs.ID}}"-->
								<td style="padding:0px;text-align: left;">
									<ul class="tableul" style="list-style: none;" >
										<li class="tableCaseOne">{{ambulte.ID}}</li>
										<li class="tableCaseTwo">{{ambulte.PlateNumber}}</li>
										<li class="tableCaseThree">{{getStationName(ambulte.StationID)}}</li><li style="display:none;">{{getEmployee(ambulte.Employees)}}</li>
										<li class="tableCaseSix">{{ambulte.Mileage}}</li>
										<li class="tableCaseSeven">{{ambulte.MileageLongWay}}</li>
										<li class="tableCaseEight">{{ambulte.Sum}}</li>
										<li class="tableCaseNine"><p ng-repeat="employee in employeeName">{{employee}}</p></li>
										<li class="tableCaseEleven"><br><span id="beSelected{{ ambulte.ID }}" style="font-size:20px;color:green;margin:0 10px;display: none;">√</span>
											<span id="cancelSelected{{ ambulte.ID }}" style="font-size:24px;color:orangered;margin:0 10px;display: none;cursor:pointer;" ng-click="cancelSelected(ambulte.ID);">×</span><a id="assignAmbult{{ ambulte.ID }}" href="#" ng-click="assignAmbultette(this,$index)">分配</a>
										</li>
										<br>
										<br>
										<li id="collapse{{ambulte.ID}}" class="panel-collapse collapse AutoNewline">
											<span style="display: none;">{{getOrder(ambulte.Orders)}}</span>
											<!--<span style="font-size:14px;">车辆人员：</span><p>{{staffs.Employees}}</p>-->
											<span style="font-size:14px;">订单信息：</span><p ng-repeat="order in ordersInfos"><span>{{order.id}}</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#428bca;">{{order.beginPosition}}</span>-<span style="color:orangered;">{{order.endPosition}}</span>
												&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span>{{order.name}}</span>-<span>{{order.telephone}}</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span>{{order.status}}</span>
												&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#428bca;">{{order.hopeTime}}</span>-<span style="color:orangered;">{{order.estTime}}</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span>{{order.distance}}</span></p>
										</li>
									</ul>
								</td>
							</tr>
							</tbody>
						</table>
					</tr>
				</table>
			</div>
		</div>
		<div class="modal-footer">
			<button class="btn" data-dismiss="modal" ng-click="cleanDetail(this)">关闭</button>
			<button class="btn btn-primary" ng-click="update(this)">保存</button>
		</div>
	</div>

	<!--<div id="test-info" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		1231231231231
	</div>-->


	<div id="mapContainer" >
		<input type="hidden" id="close" value="关闭" onclick="mapHidden()"/>
	</div>
	<script type="text/javascript" src="/bundles/mirrormain/js/city.js"></script>
	<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=4005d9116ab7d2f8b5a8cd0f062605fd"></script>
	<script type="text/javascript">
		var geolocation;
		var MARKER_FLAG='1';
		var START_MARKER;
		var END_MARKER;
		var START_ADDRESS;
		var END_ADDRESS;
		var windowsArr = [];
		var marker = [];
		var focus_marker;
		var START_CITY_CODE='';
		var END_CITY_CODE='';
		var START_POSITION_LONG;
		var END_POSITION_LONG;
		var mapObj = new AMap.Map("");
		mapObj.plugin('AMap.Geolocation',function(){
			geolocation = new AMap.Geolocation({
				enableHighAccuracy: true,//是否使用高精度定位，默认:true
				timeout: 10000,          //超过10秒后停止定位，默认：无穷大
				maximumAge: 0,           //定位结果缓存0毫秒，默认：0
				convert: false,           //自动偏移坐标，偏移后的坐标为高德坐标，默认：true
				showButton: false,        //显示定位按钮，默认：true
				buttonPosition: 'LB',    //定位按钮停靠位置，默认：'LB'，左下角
				buttonOffset: new AMap.Pixel(10, 20),//定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20)
				showMarker: false,        //定位成功后在定位到的位置显示点标记，默认：true
				showCircle: false,        //定位成功后用圆圈表示定位精度范围，默认：true
				panToLocation: true,     //定位成功后将定位到的位置作为地图中心点，默认：true
				zoomToAccuracy:false      //定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
			});
			mapObj.addControl(geolocation);
			AMap.event.addListener(geolocation, 'complete', initMarker);//返回定位信息
			AMap.event.addListener(geolocation, 'error', function(data){});      //返回定位出错信息
		});
		function mapShow(flag)
		{
			MARKER_FLAG=flag;
			if(!START_MARKER || !END_MARKER)
			{
				geolocation.getCurrentPosition();
			}
			//document.getElementById('mapContainer').style.display='block';
			//document.getElementById('tip').style.display='none';
		}
		function mapHidden()
		{
			document.getElementById('mapContainer').style.display='none';
			document.getElementById('tip').style.display='block';
			//if(START_ADDRESS)
			//document.getElementById('keyword1').value=START_ADDRESS.formattedAddress;
			//if(END_ADDRESS)
			//document.getElementById('keyword2').value=END_ADDRESS.formattedAddress;
		}

		//document.getElementById("keyword"+MARKER_FLAG).onkeyup = keydown;
		//输入提示
		function autoSearch() {
			var keywords = document.getElementById("keyword"+MARKER_FLAG).value;
			var auto;
			//加载输入提示插件
			AMap.service(["AMap.Autocomplete"], function() {
				var autoOptions = {
					city: MARKER_FLAG==1 ? START_CITY_CODE : START_CITY_CODE //城市，默认全国
				};
				auto = new AMap.Autocomplete(autoOptions);
				//查询成功时返回查询结果
				if ( keywords.length > 0) {
					auto.search(keywords, function(status, result){
						autocomplete_CallBack(result);
					});
				}
				else {
					document.getElementById("result"+MARKER_FLAG).style.display = "none";
				}
			});
		}

		//输出输入提示结果的回调函数
		function autocomplete_CallBack(data) {
			var resultStr = "";
			var tipArr = data.tips;
			if (tipArr&&tipArr.length>0) {
				for (var i = 0; i < tipArr.length; i++) {
					resultStr += "<div id='"+MARKER_FLAG+"divid" + (i + 1) + "' onmouseover='openMarkerTipById(" + (i + 1)
							+ ",this)' onclick='selectResult(" + i + ")' onmouseout='onmouseout_MarkerStyle(" + (i + 1)
							+ ",this)' style=\"font-size: 14px;cursor:pointer;padding:3px 3px 3px 3px;\"" + "data=" + tipArr[i].adcode + ">" + tipArr[i].name + "<span style='color:#C1C1C1;'>"+ tipArr[i].district + "</span></div>";
				}
			}
			else  {
				resultStr = " π__π 亲,人家找不到结果!<br />要不试试：<br />1.请确保所有字词拼写正确<br />2.尝试不同的关键字<br />3.尝试更宽泛的关键字";
			}
			document.getElementById("result"+MARKER_FLAG).curSelect = -1;
			document.getElementById("result"+MARKER_FLAG).tipArr = tipArr;
			document.getElementById("result"+MARKER_FLAG).innerHTML = resultStr;
			document.getElementById("result"+MARKER_FLAG).style.display = "block";
		}

		//输入提示框鼠标滑过时的样式
		function openMarkerTipById(pointid, thiss) {  //根据id打开搜索结果点tip
			thiss.style.background = '#CAE1FF';
		}

		//输入提示框鼠标移出时的样式
		function onmouseout_MarkerStyle(pointid, thiss) {  //鼠标移开后点样式恢复
			thiss.style.background = "";
		}

		//从输入提示框中选择关键字并查询
		function selectResult(index) {
			if(index<0){
				return;
			}
			if (navigator.userAgent.indexOf("MSIE") > 0) {
				document.getElementById("keyword"+MARKER_FLAG).onpropertychange = null;
				document.getElementById("keyword"+MARKER_FLAG).onfocus = focus_callback;
			}
			//截取输入提示的关键字部分
			var text = document.getElementById(MARKER_FLAG+"divid" + (index + 1)).innerHTML.replace(/<[^>].*?>.*<\/[^>].*?>/g,"");
			var cityCode = document.getElementById(MARKER_FLAG+"divid" + (index + 1)).getAttribute('data');
			document.getElementById("keyword"+MARKER_FLAG).value = text;
			document.getElementById("result"+MARKER_FLAG).style.display = "none";
			//根据选择的输入提示关键字查询
			mapObj.plugin(["AMap.PlaceSearch"], function() {
				var msearch = new AMap.PlaceSearch();  //构造地点查询类
				AMap.event.addListener(msearch, "complete", placeSearch_CallBack); //查询成功时的回调函数
				msearch.setCity(cityCode);
				msearch.search(text);  //关键字查询查询
			});
		}

		//定位选择输入提示关键字
		function focus_callback() {
			if (navigator.userAgent.indexOf("MSIE") > 0) {
				document.getElementById("keyword"+MARKER_FLAG).onpropertychange = autoSearch;
			}
		}

		//输出关键字查询结果的回调函数
		function placeSearch_CallBack(data) {
			//清空地图上的InfoWindow和Marker
			windowsArr = [];
			marker     = [];
			//mapObj.clearMap();
			var resultStr1 = "";
			var poiArr = data.poiList.pois;
			var resultCount = poiArr.length;
			/*
			 for (var i = 0; i < resultCount; i++) {
			 resultStr1 += "<div id='divid" + (i + 1) + "' onmouseover='openMarkerTipById1(" + i + ",this)' onmouseout='onmouseout_MarkerStyle(" + (i + 1) + ",this)' style=\"font-size: 12px;cursor:pointer;padding:0px 0 4px 2px; border-bottom:1px solid #C1FFC1;\"><table><tr><td><img src=\"http://webapi.amap.com/images/" + (i + 1) + ".png\"></td>" + "<td><h3><font color=\"#00a6ac\">名称: " + poiArr[i].name + "</font></h3>";
			 resultStr1 += TipContents(poiArr[i].type, poiArr[i].address, poiArr[i].tel) + "</td></tr></table></div>";
			 addmarker(i, poiArr[i]);
			 }
			 */
			if(resultCount)
			{
				var address=poiArr[0].name;
				var lngX=poiArr[0].location.getLng();
				var latY=poiArr[0].location.getLat();
				//alert('address='+address+'x='+lngX+',y='+latY);
				addmarker(0,poiArr[0]);
				if(MARKER_FLAG==1)
					START_ADDRESS=address;
				else
					END_ADDRESS=address;
				getAddressInfo(lngX,latY);
			}
			mapObj.setFitView();
		}

		//鼠标滑过查询结果改变背景样式，根据id打开信息窗体
		function openMarkerTipById1(pointid, thiss) {
			thiss.style.background = '#CAE1FF';
			windowsArr[pointid].open(mapObj, marker[pointid]);
		}
		function getAddressInfo(lngX,latY)
		{
			AMap.service(["AMap.Geocoder"], function() { //加载地理编码
				geocoder = new AMap.Geocoder({
					radius: 1000,
					extensions: "all"
				});
				//步骤三：通过服务对应的方法回调服务返回结果，本例中通过逆地理编码方法getAddress回调结果
				geocoder.getAddress(new AMap.LngLat(lngX,latY), function(status, result){
					//根据服务请求状态处理返回结果
					if(status=='error') {
						alert("服务请求出错啦！ ");
					}
					if(status=='no_data') {
						alert("无数据返回，请换个关键字试试～～");
					}
					else {
						if(MARKER_FLAG==1)
						{
							//START_ADDRESS=result.regeocode;
							START_POSITION_LONG=result.regeocode.formattedAddress;
						}
						else if(MARKER_FLAG==2)
						{
							//END_ADDRESS=result.regeocode;
							END_POSITION_LONG=result.regeocode.formattedAddress;
						}
						//alert('address:'+result.regeocode.formattedAddress+',lngX:'+lngX+',latY:'+latY);
					}
				});
			});
		}
		function dragend_callback(){
			var lngX=this.getPosition().getLng();
			var latY=this.getPosition().getLat();
			getAddressInfo(lngX,latY);
		};
		function checkNaN(target){
			var value = target.value;
			target.value=target.value.replace(/\D/g,'');
		}
		function initMarker(data)
		{
			var markerOption = {
				title:name,
				map:mapObj,
				icon:"http://webapi.amap.com/images/" + (MARKER_FLAG) + ".png",
				draggable:true,
				position:data.position
			};
			if(MARKER_FLAG==1 && !START_MARKER)
			{
				START_MARKER= new AMap.Marker(markerOption);
				getAddressInfo(data.position.getLng(),data.position.getLat());
				AMap.event.addListener(START_MARKER, "dragend", dragend_callback);
			}
			else if(MARKER_FLAG==2 && !END_MARKER)
			{
				END_MARKER= new AMap.Marker(markerOption);
				getAddressInfo(data.position.getLng(),data.position.getLat());
				AMap.event.addListener(END_MARKER, "dragend", dragend_callback);
			}
		}

		//添加查询结果的marker&infowindow
		function addmarker(i, d) {
			var lngX = d.location.getLng();
			var latY = d.location.getLat();
			var name=d.name;
			var markerOption = {
				title:name,
				//map:mapObj,
				icon:"http://webapi.amap.com/images/" + (MARKER_FLAG) + ".png",
				draggable:true,
				position:new AMap.LngLat(lngX, latY)
			};



			if(MARKER_FLAG==1)
			{
				if(START_MARKER)
				{
					START_MARKER.setPosition(d.location);
				}
				else
				{
					START_MARKER = new AMap.Marker(markerOption);
					AMap.event.addListener(START_MARKER, "dragend", dragend_callback);
				}
			}
			else
			{
				if(END_MARKER)
				{
					END_MARKER.setPosition(d.location);
				}
				else
				{
					END_MARKER= new AMap.Marker(markerOption);
					AMap.event.addListener(END_MARKER, "dragend", dragend_callback);
				}
			}

			marker.push(new AMap.LngLat(lngX, latY));

			var infoWindow = new AMap.InfoWindow({
				content:"<h3><font color=\"#00a6ac\">  " + (i + 1) + ". " + d.name + "</font></h3>" + TipContents(d.type, d.address, d.tel),
				draggable:true,
				size:new AMap.Size(300, 0),
				autoMove:true,
				offset:new AMap.Pixel(0,-30)
			});
			windowsArr.push(infoWindow);
			//var aa = function (e) {infoWindow.open(mapObj, mar.getPosition());};


		}

		//infowindow显示内容
		function TipContents(type, address, tel) {  //窗体内容
			if (type == "" || type == "undefined" || type == null || type == " undefined" || typeof type == "undefined") {
				type = "暂无";
			}
			if (address == "" || address == "undefined" || address == null || address == " undefined" || typeof address == "undefined") {
				address = "暂无";
			}
			if (tel == "" || tel == "undefined" || tel == null || tel == " undefined" || typeof address == "tel") {
				tel = "暂无";
			}
			var str = "  地址：" + address + "<br />  电话：" + tel + " <br />  类型：" + type;
			return str;
		}
		function keydown(event,flag){
			MARKER_FLAG=flag;
			var key = (event||window.event).keyCode;
			var result = document.getElementById("result"+MARKER_FLAG);
			var cur = result.curSelect;
			if(key===40){//down
				if(cur + 1 < result.childNodes.length){
					if(result.childNodes[cur]){
						result.childNodes[cur].style.background='';
					}
					result.curSelect=cur+1;
					result.childNodes[cur+1].style.background='#CAE1FF';
					document.getElementById("keyword"+MARKER_FLAG).value = result.tipArr[cur+1].name;
				}
			}else if(key===38){//up
				if(cur-1>=0){
					if(result.childNodes[cur]){
						result.childNodes[cur].style.background='';
					}
					result.curSelect=cur-1;
					result.childNodes[cur-1].style.background='#CAE1FF';
					document.getElementById("keyword"+MARKER_FLAG).value = result.tipArr[cur-1].name;
				}
			}else if(key === 13){
				var res = document.getElementById("result"+MARKER_FLAG);
				if(res && res['curSelect'] !== -1){
					selectResult(document.getElementById("result"+MARKER_FLAG).curSelect);
				}
			}else{
				autoSearch();
			}
		}
	</script>


</div>
{% endraw %}
{% endblock %}

{% block script %}
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css">
	<script data-main="scripts/main" src="/bundles/mirrormain/js/mobiscroll/dev/js/mobiscroll.android-ics-2.5.2.js"></script>
	<script data-main="scripts/main" src="/bundles/mirrormain/js/mobiscroll/dev/js/mobiscroll.core-2.5.2.js"></script>
	<script data-main="scripts/main" src="/bundles/mirrormain/js/mobiscroll/dev/js/mobiscroll.core-2.5.2-zh.js"></script>
<script type="text/javascript" src="{{ asset('bundles/mirroroam/js/tm-pagination.js') }}"></script>
<script type="text/javascript" src="{{ asset('bundles/mirroroam/js/bootstrap-datetimepicker.js') }}"></script>
<script type="text/javascript">
angular.module('myApp',['tm.pagination'])
	.controller('groupListController',function($scope,$http){
		init($scope,$http);
		$scope.delete=function(target){
			$scope.id=target.group.id;
			deleteGroup($scope,$http);
		};
	});
//站点列表id转info
function getStationName($scope,realValue)
{
	var str='';
	$.each($scope.serviceList,function(key,value){
		if(value.ID==realValue)
			str=value.Info;
	});
	return str;
}

function getCityArr($scope,$http,value,type){
	httpOther($http,apiPath('/api/region/list/'+value),'GET',
		{},
		function(response){
			switch(type){
				case 1:
					$scope.provinceEnd = response.regionList;
					getCityArr($scope,$http,$scope.provinceEnd[0].code,2);
				break;
				case 2:
					$scope.cityEnd = response.regionList;
					getCityArr($scope,$http,$scope.cityEnd[0].code,3);
				break;
				case 3:
					$scope.regionEnd = response.regionList;
				break;
			}
		},
		function(errno,errmsg){

	});
}
function deleteGroup($scope,$http)
{
	httpOther(
		$http,
		apiPath('/api/group/delete/by/director/'+$scope.id),
		'get',
		'',
		function(data,textStatus){
			alert('操作成功');
			getGroupList($scope,$http);
		},
		function(errno,errmsg){
			alert(errmsg);
		}

	);
}


function init($scope,$http)
{
	$scope.setEmptyOrganization=function(target){
		$scope.organization={};
		$scope.search.organizationId=0;
		getGroupList($scope,$http);
	};
	$scope.setEmptyCity=function(target){
		$scope.search.cityCode='';
		$scope.endProvinceInfo={};
		$scope.endCityInfo={};
		$scope.endRegionInfo={};
		$scope.organization={};
		$scope.search.organizationId=0;
		$scope.organizationList=[];
		getGroupList($scope,$http);
	};
	$scope.cleanEndTime=function(target){
		$scope.endTime='';
		$scope.paginationConf.currentPage=1;
		getGroupList($scope,$http);
	};
	$scope.cleanBeginTime=function(target){
		$scope.beginTime='';
		$scope.paginationConf.currentPage=1;
		getGroupList($scope,$http);
	};
	$("#begin-time").datetimepicker({
		format:'yyyy-mm-dd hh:ii',
		minuteStep:1,
		autoclose:true
	}).on('changeDate',function(ev){
		getGroupList($scope,$http);
	});

	$("#modifyBegin-time").datetimepicker({
		format:'yyyy/mm/dd hh:ii:ss',  //时间格式要与接口返回值格式一致
		minuteStep:1,
		autoclose:true
	}).on('changeDate',function(ev){
		getGroupList($scope,$http);
	});
	$("#modifyEnd-time").datetimepicker({
		format:'yyyy/mm/dd hh:ii:ss',
		minuteStep:1,
		autoclose:true
	}).on('changeDate',function(ev){
		getGroupList($scope,$http);
	});

	$("#end-time").datetimepicker({
		format:'yyyy-mm-dd hh:ii',
		minuteStep:1,
		autoclose:true
	}).on('changeDate',function(ev){
		getGroupList($scope,$http);
	});
	$scope.search={};
	$scope.organizationList=[];
	$scope.organization={};
	$scope.paginationConf = {
        currentPage: 1,
        itemsPerPage: 10,
        pagesLength: 9,
        onChange: function(){
        }
    };
    $scope.end = {
		'province':'省份',
		'city':'城市',
		'region':'区/县'
	};
    $scope.SelectOrganization=function(target){
		var targetInfo = $.evalJSON(target.organization);
		$scope.search.organizationId=targetInfo.id;
		getGroupList($scope,$http);
	};
	$scope.selectRoleType=function(target){
		$scope.search.roleType=target.roleType.realValue;
	};
	$scope.create=function(target){
		createEmployee($scope,$http);
	};
	$scope.SelectProvince=function(target){
		var targetInfo = $.evalJSON(target.endProvinceInfo);
		$scope.end.province = targetInfo.name;
		$scope.end.city = '城市';
		$scope.end.region = '区/县';
		getCityArr($scope,$http,targetInfo.code,2);
	};
	$scope.SelectCity=function(target){
		var targetInfo = $.evalJSON(target.endCityInfo);
		$scope.end.city = targetInfo.name;
		$scope.end.region = '区/县';
		$scope.search.cityCode=targetInfo.code;
		getCityArr($scope,$http,targetInfo.code,3);
	};
	$scope.SelectRegion=function(target){
		var targetInfo = $.evalJSON(target.endRegionInfo);
		$scope.end.region = targetInfo.name;
		if(targetInfo.code)
		{
			$scope.search.cityCode=targetInfo.code;
			$scope.search.organizationId=null;
			getOrganizationList($scope,$http);
			getGroupList($scope,$http);
		}
	};
	//换行
	 $scope.getOrder=function (target){
		 $scope.ordersInfos=[];
		 if(target!=null){
			 var arr=target;
			 $scope.ordersInfo=arr.split(',');
			 for (var i=0;i<$scope.ordersInfo.length;i++){
				 var arr2=$scope.ordersInfo[i];
				 $scope.ordersInfos=arr2.split("*");
				 $scope.ordersInfos[i].id=arr2.split("*")[0];
				 $scope.ordersInfos[i].beginPosition=arr2.split("*")[1]+arr2.split("*")[2];
				 $scope.ordersInfos[i].endPosition=arr2.split("*")[3]+arr2.split("*")[4];
				 $scope.ordersInfos[i].name=arr2.split("*")[5];
				 $scope.ordersInfos[i].telephone=arr2.split("*")[6];
				 $scope.ordersInfos[i].status=arr2.split("*")[7];
				 $scope.ordersInfos[i].hopeTime=arr2.split("*")[8];
				 $scope.ordersInfos[i].estTime=arr2.split("*")[9];
				 if(arr2.split("*")[10] != "-1"){
					 $scope.ordersInfos[i].distance=parseInt(arr2.split("*")[10]/1000)+'公里';
				 }else{
					 $scope.ordersInfos[i].distance=arr2.split("*")[10];
				 }
			 }
		 }else{
			 $scope.ordersInfo=[];
			 return
		 }
	}

	$scope.getEmployee=function(target){
		$scope.employeeName=[];
		if(target!=null){
			var arr=target;
			$scope.employeeName=arr.split(',');
		}else{
			$scope.employeeName=[];
			return;
		}
	}
  //修改地点位置
	$scope.SelectProvince2=function(target){
		var targetInfo = $.evalJSON(target.endProvinceInfo);
		modifyCityArr($scope,$http,targetInfo.code,2);
	};
	$scope.SelectCity2=function(target){
		var targetInfo = $.evalJSON(target.endCityInfo);
		START_CITY_CODE = targetInfo.code;
		$scope.saveInfo.CityCode=targetInfo.code;
		modifyCityArr($scope,$http,targetInfo.code,3);
		getAmbultetteList($scope,$http);
	};
	$scope.SelectRegion2=function(target){
		var targetInfo = $.evalJSON(target.endRegionInfo);
	};

	//获取所属站点
	$scope.getStationName=function(value){
		return getStationName($scope,value);
	};

	$('#closemap').click(function(){
		$('#mapframe').css('display','none');
	})

	$scope.getMapHref=function(order){
		return getStaticMap(order.beginLongitude,order.beginLatitude,order.endLongitude,order.endLatitude);
	};
	$("#group-manage").addClass('active');
	$("#group-list").addClass("active");
	$("#group-manage-list").addClass('in');
	getGroupList($scope,$http);
	getCityArr($scope,$http,0,1);
	modifyCityArr($scope,$http,0,1);
	getOrganizationList($scope,$http);




	//修改信息按钮
	$scope.setEmployeeInfo=function(target){
		$scope.saveInfo = target.group;
		START_CITY_CODE = $scope.saveInfo.CityCode;
		modifyCityArr($scope,$http,0,1,$scope.saveInfo.ProvinceCode,$scope.saveInfo.CityCode);
		getAmbultetteList($scope,$http);
		getServiceList($scope,$http);
		var num=$scope.saveInfo.AmbulatteID;

		//待车辆数据信息加载完成后才能更改第num个数据元素样式
		setTimeout(function(){
			$("#beSelected"+num).css('display','inline-block');//分配车辆样式√
			$("#cancelSelected"+num).css('display','inline-block');
			$("#assignAmbult"+num).css('display','none');
			//console.log($("#beSelected"+num));
		},1500);

	};
	//分配车辆
	$scope.assignAmbultette=function(target,index){
		$("#beSelected"+$scope.saveInfo.AmbultetteId).css('display','none');//清空上一次分配车辆样式√
		$("#cancelSelected"+$scope.saveInfo.AmbultetteId).css('display','none');//×
		$("#assignAmbult"+$scope.saveInfo.AmbultetteId).css('display','inline-block');
		//$('#test-info').modal('show');
		if(confirm("确定分配该车辆吗？")){
			$scope.saveInfo.AmbultetteId=target.ambulte.ID;
			//console.log($scope.saveInfo.AmbulatteID);
			//console.log($("#beSelected"+$scope.saveInfo.AmbultetteID));
			$("#beSelected"+$scope.saveInfo.AmbulatteID).css('display','none');//清空 初始时 分配车辆样式√
			$("#cancelSelected"+$scope.saveInfo.AmbulatteID).css('display','none');//×
			$("#assignAmbult"+$scope.saveInfo.AmbulatteID).css('display','inline-block');

			$("#beSelected"+$scope.saveInfo.AmbultetteId).css('display','inline-block');//分配车辆样式√
			$("#cancelSelected"+$scope.saveInfo.AmbultetteId).css('display','inline-block');
			$("#assignAmbult"+$scope.saveInfo.AmbultetteId).css('display','none');
		}
		else{
			return;
		}
	}
	$scope.cancelSelected=function(target){
		if(confirm("确定取消该分配吗？")){
			$scope.saveInfo.AmbultetteId=0;
			$("#beSelected"+target).css('display','none');//分配车辆样式√
			$("#cancelSelected"+target).css('display','none');
			$("#assignAmbult"+target).css('display','inline-block');
		}else{
			return;
		}
	}

	//获取经纬度，进行选点
	var flag=1;
	$scope.selectMap=function(){
		if(START_MARKER || $scope.saveInfo.Longitude)
		{
			if(START_MARKER){
				$scope.saveInfo.Longitude=START_MARKER.getPosition().getLng();
				$scope.saveInfo.Latitude=START_MARKER.getPosition().getLat();
				$scope.saveInfo.Position=START_ADDRESS;
				$scope.saveInfo.PositionLong=START_POSITION_LONG;
			}
			//地址与经纬度选址插件
			var map = new AMap.Map('container',{
				resizeEnable: true,
				zoom: 13,
				center: [$scope.saveInfo.Longitude,$scope.saveInfo.Latitude]
			});
			AMap.plugin('AMap.Geocoder',function(){
				var geocoder = new AMap.Geocoder({
					//city: "311"//城市，默认：“全国”
				});
				var marker = new AMap.Marker({
					map:map,
					bubble:true
				})
				var input = document.getElementById('input');
				var message = document.getElementById('message');
				map.on('click',function(e){
					marker.setPosition(e.lnglat);
					geocoder.getAddress(e.lnglat,function(status,result){
						if(status=='complete'){
							input.value = result.regeocode.formattedAddress;
							$scope.saveInfo.Position=input.value;
							$('#keyword1').val(input.value);
							message.innerHTML = ''
						}else{
							message.innerHTML = '无法获取地址'
						}
					})
					$scope.saveInfo.Longitude=e.lnglat.lng;
					$scope.saveInfo.Latitude=e.lnglat.lat;
					//console.log($scope.saveInfo.Longitude);
					//console.log($scope.saveInfo.Latitude);
				})

				input.onchange = function(e){
					var address = input.value;
					geocoder.getLocation(address,function(status,result){
						if(status=='complete'){
							marker.setPosition(result.geocodes[0].location);
							map.setCenter(marker.getPosition())
							$scope.saveInfo.Position=input.value;
							$("#keyword1").val(input.value);
							message.innerHTML = ''
							$scope.saveInfo.Longitude=result.geocodes[0].location.lat;
							$scope.saveInfo.Latitude=result.geocodes[0].location.lng;
						}else{
							message.innerHTML = '无法获取位置'
						}

					})
				}
			});
		}else{
			alert('请选择地址并输入详细地址');
			return;
		}
		if(flag==1){
			flag=0;
			$('#mapframe').css('display','block');
		}else{
			flag=1;
			$('#mapframe').css('display','none');
		}
	}

	//更改地址
	$scope.clearLat=function(){
		$scope.saveInfo.Longitude=undefined;
	}

	$scope.update = function(){
		//alert(angular.toJson($scope.saveInfo));
		if($scope.saveInfo.Longitude==undefined) {
			if (START_MARKER || $scope.saveInfo.Longitude) {
				if (START_MARKER) {
					$scope.saveInfo.Longitude=START_MARKER.getPosition().getLng();
					$scope.saveInfo.Latitude=START_MARKER.getPosition().getLat();
					$scope.saveInfo.Position=START_ADDRESS;
					$scope.saveInfo.PositionLong=START_POSITION_LONG;
				}
			} else {
				alert('请选择地址并输入详细地址');
				return;
			}
		}
		var json={
			"ID": $scope.saveInfo.ID,
			"BeginTime":$scope.saveInfo.Begintime,
			"EndTime": $scope.saveInfo.EndTime,
			"Longitude": $scope.saveInfo.Longitude,
			"Latitude":$scope.saveInfo.Latitude,
			"CityCode":$scope.saveInfo.CityCode,
			"AmbuletteID":$scope.saveInfo.AmbultetteId,
			"Position":$('#keyword1').val()
		}
		$http({
			url:Testurl+'/api/GroupEdite',
			method:'post',
			data:json,
		}).then(function(data,textStatus){
					alert('修改成功');
					$('#employee-info').modal('hide');
					//$('.modal-backdrop').remove();
					getGroupList($scope,$http);
				},
				function(errno,errmsg){
					alert(errmsg);
				}
		);
	}



}
function test(target){
	console.log(target);

}
function getOrganizationList($scope,$http)
{
	var json={
		'cityCode':$scope.search.cityCode ? $scope.search.cityCode : '000000'
	};
	httpOther(
		$http,
		apiPath('/api/organization/search'),
		'post',
		json,
		function(data,textStatus){
			$scope.organizationList=data.rows;
		},
		function(errno,errmsg){

		}

	);
}
//车辆接口，车辆列表根据saveinfo.citycode选择车辆
function getAmbultetteList($scope,$http)
{
	if(START_CITY_CODE==undefined){
		START_CITY_CODE=0;
	}
	if($scope.search.StationID==undefined){
		$scope.search.StationID=0;
	}
	$http({
		url:Testurl+'/api/AmbuletteSearch?CityCode='+START_CITY_CODE+'&StationID='+$scope.search.StationID,
		method:'GET'
	}).then(function(data,textStatus){
				$scope.ambultetteList=data.data.Data;
			},
			function(errno,errmsg){
				alert(errmsg);
			}
	);
}
//站点接口，车辆所属站点
function getServiceList($scope,$http)
{
	$http({
		url:Testurl+'/api/StationListGet?CityCode='+0,
		method:'GET'
	}).then(function(data,textStatus){
				$scope.serviceList=data.data.Data;
				//console.log($scope.serviceList);
			},
			function(errno,errmsg){
				$scope.serviceList=[];
			}
	);
}

function getGroupList($scope,$http)
{
	//var currentPage=$scope.paginationConf.currentPage;
	$page = $scope.paginationConf.currentPage ? $scope.paginationConf.currentPage : 1
	var json={
		'Page':$page ,
		'OrderNumberPerPage':$scope.paginationConf.itemsPerPage,
		'CityCode':$scope.search.cityCode,
		'OrganizationID':$scope.search.organizationId,
		'BeginTime':$scope.beginTime,
		'EndTime':$scope.endTime
	}
		$http({
		url:Testurl+'/api/GroupSearch',
		method:'post',
		data:json
		}).then(function(data,textStatus){
			$scope.groupList=data.data.Data;
			//console.log($scope.groupList);
			$scope.paginationConf.totalItems=data.data.TotalCount;
			$scope.paginationConf.onChange=function(){
				getGroupList($scope,$http);
			};
		},
		function(errno,errmsg){

		}

	);
}

function modifyCityArr($scope,$http,value,type,firatValue,nextValuse){
	httpOther($http,apiPath('/api/region/list/'+value),'GET',
			{},
			function(response){
				switch(type){
					case 1:
						$scope.provinceModify = response.regionList;
						if(firatValue)
							if(nextValuse)
								modifyCityArr($scope,$http,firatValue,2,nextValuse);
							else
								modifyCityArr($scope,$http,$scope.provinceModify[0].code,2);
						break;
					case 2:
						$scope.cityModify = response.regionList;
						if(value)
							modifyCityArr($scope,$http,firatValue,3);
						else
							modifyCityArr($scope,$http,$scope.cityModify[0].code,3);
						break;
					case 3:
						$scope.regionModify = response.regionList;
						break;
				}
			},
			function(errno,errmsg){

			});
}
</script>
{% endblock %}