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

{% block style %}
<style type="text/css">
#employee-table td {
	height: 40px;
}
#split-page {
	text-align: center;
}
.form-control {
	width: auto;
	display: inline-block;
}
#employee-info {
	width: 50%;
	height: 400px;
	left: 0px;
	right: 0px;
	top: 100px;
	margin: 0px auto;
	background-color: #ffffff;
}
.modal-body {
	height: 240px;
	max-height: 240px;
	overflow-y: scroll;
}
.modal-body>div {
	margin-bottom: 8px;
}
.modal-body>div>.close {
	line-height: 35px;
}
.modal-body .form-control {
	width: 40%;
	display: inline-block;
}
</style>
{% endblock %}

{% block content %}
{% raw %}
<div ng-controller="staffListController">
	<h1 class="page-header">助手管理</h1>
	<div class="page-header">
		姓名：
		<input ng-model="search.name" type="text" class="form-control" />
		手机号：
		<input ng-model="search.telephone" type="text" class="form-control" />
		组织：
		<select ng-model="search.organizationId" class="form-control">
			<option ng-repeat="organization in organizationList" value="{{ organization.id }}">{{ organization.name }}</option>
		</select>
		<button class="form-control" ng-click="searchStaffList(this)">搜索</button>
	</div>
	<div class="table-responsive">
		<table class="table table-striped">
			<thead>
		        <tr>
		          <th>#</th>
		          <th>手机号</th>
		          <th>姓名</th>
		          <th>组织</th>
		          <th>服务机构单位</th>
		          <th>状态</th>
		          <th>操作</th>
		        </tr>
	      </thead>
	      <tbody>
	        <tr ng-repeat="staff in staffList">
	        	<td>{{ staff.id }}</td>
	        	<td>{{ staff.telephone }}</td>
	        	<td>{{ staff.name }}</td>
	        	<td>{{ getOrganizationName(staff.organizationId) }}</td>
	        	<td>{{ staff.serviceOrgName }}</td>
	        	<td>{{ staff.status==1 ? '在职' : '离职' }}</td>
	        	<td>
	        		<a href="#" data-target="#employee-info" role="button" data-toggle="modal" ng-click="setStaffInfo(this)" >修改</a>
	        		<br />
	        		<a ng-click="getStaffCode(this)" href="#" >查看二维码</a>
	        	</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="500px;">
	  			<tr>
			  		<td>
				  		名称：
				  	</td>
				  	<td>
				  		<input type="text" class="form-control" placeholder="" ng-model="focusStaff.name" />
				  	</td>
			  	</tr>
			  	<tr>
			  		<td>
				  		手机号：
				  	</td>
				  	<td>
				  		<input type="text" class="form-control" placeholder="" maxlength="11" onkeyup="checkNaN(this);" onblur="checkNaN(this);" ng-model="focusStaff.telephone" />
				  	</td>
			  	</tr>
			  	<tr>
			  		<td>
				  		组织：
				  	</td>
				  	<td>
				  		<select ng-model="focusStaff.organizationId" class="form-control">
							<option ng-repeat="focusorganization in focusorganizationList" value="{{ focusorganization.id }}">{{ focusorganization.name }}</option>
						</select>
				  	</td>
			  	</tr>
			  	<tr>
			  		<td>
				  		服务机构单位：
				  	</td>
				  	<td>
				  		<select ng-model="focusStaff.serviceOrgId" class="form-control">
							<option ng-repeat="service in serviceList" value="{{ service.id }}">{{ service.name }}</option>
						</select>
				  	</td>
			  	</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="save(this)">保存</button>
	  </div>
	</div>
</div>
{% endraw %}
{% endblock %}

{% block script %}
<script type="text/javascript" src="{{ asset('bundles/mirroroam/js/tm-pagination.js') }}"></script>
<script type="text/javascript">
angular.module('myApp',['tm.pagination'])
	.controller('staffListController',function($scope,$http){
		init($scope,$http);
	});
function getOrganizationList($scope,$http)
{
	var json={};
	httpOther(
		$http,
		apiPath('/api/staff/organization/list'),
		'post',
		json,
		function(data,textStatus){
			$scope.organizationList=data.rows;
			$scope.focusorganizationList=data.rows;
		},
		function(errno,errmsg){
			$scope.roleTypeArr=[];
		}
	);
}
function getServiceList($scope,$http)
{
	httpOther(
		$http,
		apiPath('/api/organization/search'),
		'post',
		'',
		function(data,textStatus){
			data.rows.unshift({
				'id':'',
				'name':''
			});
			$scope.serviceList=data.rows;
		},
		function(errno,errmsg){
			$scope.serviceList=[];
		}
	);
}
function getRoleShowValue($scope,realValue)
{
	var str='';
	$.each($scope.roleTypeArr,function(key,value){
		if(value.realValue==realValue)
			str=value.showValue;
	});
	return str;
}
function getOrganizationName($scope,realValue)
{
	var str='';
	$.each($scope.organizationList,function(key,value){
		if(value.id==realValue)
			str=value.name;
	});
	return str;
}
function getServiceName($scope,realValue)
{
	var str='';
	$.each($scope.serviceList,function(key,value){
		if(value.id==realValue)
			str=value.name;
	});
	return str;
}
function saveStaff($scope,$http)
{
	var json={
		'id':$scope.focusStaff.id,
		'name':$scope.focusStaff.name,
		'telephone':$scope.focusStaff.telephone,
		'organizationId':$scope.focusStaff.organizationId,
		'status':$scope.focusStaff.status,
		'password':$.trim($scope.focusStaff.password),
		'serviceOrgId':$scope.focusStaff.serviceOrgId
	}
	httpOther(
		$http,
		apiPath('/api/staff/update'),
		'post',
		json,
		function(data,textStatus){
			alert('修改成功');
			$("#employee-info").modal('hide');
			getStaffList($scope,$http);
		},
		function(errno,errmsg){

		}
	);
}
function init($scope,$http)
{
	$scope.search={};
	$scope.staff={};
	$scope.end = {
		'province':'省份',
		'city':'城市',
		'region':'区/县'
	};
	$scope.organizationList=[];
	$scope.roleTypeArr=[];
	$scope.getStaffCode=function(target){
		$scope.id=target.staff.id;
		getStaffCode($scope,$http);
	};
	$scope.cleanDetail=function(){
		getStaffList($scope,$http);
	};
	$scope.searchStaffList=function(target){
		getStaffList($scope,$http);
	};
	$scope.SelectOrganization=function(target){
		var targetInfo = $.evalJSON(target.organizationInfo);
		$scope.focusStaff.organizationId=targetInfo.id;
	};
	$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.employee.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.focusStaff.cityCode=targetInfo.code;
			getOrganizationList($scope,$http);
		}
	};
	$scope.getOrganizationName=function(value){
		return getOrganizationName($scope,value);
	};
	$scope.getRoleShowValue=function(value){
		return getRoleShowValue($scope,value);
	};
	$scope.save=function(target){
		saveStaff($scope,$http);
	};
	$scope.statusArr=[
		{
			'realValue':1,
			'showValue':'在职'
		},
		{
			'realValue':2,
			'showValue':'离职'
		}
	];
	$scope.setStaffInfo=function(target){
		$scope.focusStaff.id=target.staff.id;
		$scope.focusStaff.telephone=target.staff.telephone;
		$scope.focusStaff.name=target.staff.name;
		$scope.focusStaff.status=target.staff.status;
		$scope.focusStaff.organizationId=target.staff.organizationId;
		$scope.focusStaff.serviceOrgId=target.staff.serviceOrgId;
		//getCityArr($scope,$http,0,1,$scope.focusStaff.cityArr.r1Code,$scope.focusStaff.cityArr.r2Code);
	};
	$scope.focusStaff={};
	$scope.paginationConf = {
        currentPage: 1,
        itemsPerPage: 10,
        pagesLength: 9,
        onChange: function(){
        }
    };

	$("#staff-manage").addClass('active');
	$("#staff-list").addClass("active");
	$("#staff-manage-list").addClass('in');
	//getRoleType($scope,$http);
	getOrganizationList($scope,$http);
	getServiceList($scope,$http);
	getStaffList($scope,$http);
}
function getStaffCode($scope,$http)
{
	httpOther($http,apiPath('/api/staff/get/code/'+$scope.id),'GET',
		{},
		function(response){
			window.open(response.url);
		},
		function(errno,errmsg){});
}
function getCityArr($scope,$http,value,type,newP,newC){
	httpOther($http,apiPath('/api/region/list/'+value),'GET',
		{},
		function(response){
			switch(type){
				case 1:
					$scope.provinceEnd = response.regionList;
					if(newP)
						getCityArr($scope,$http,newP,2);
					else
						getCityArr($scope,$http,$scope.provinceEnd[0].code,2);
				break;
				case 2:
					$scope.cityEnd = response.regionList;
					if(newC)
						getCityArr($scope,$http,newC,3);
					else
						getCityArr($scope,$http,$scope.cityEnd[0].code,3);
				break;
				case 3:
					$scope.regionEnd = response.regionList;
					//if(response.regionList.length==0 && $scope.employee.cityCode)
					//{
						getOrganizationList($scope,$http);
					//}
				break;
			}
		},
		function(errno,errmsg){

	});
}
function getRoleType($scope,$http)
{
	httpOther(
		$http,
		apiPath('/api/dict/key/3'),
		'get',
		'',
		function(data,textStatus){
			$scope.roleTypeArr=data.valueList;
		},
		function(errno,errmsg){
			$scope.roleTypeArr=[];
		}
	);
}
function getStaffList($scope,$http)
{
	var currentPage=$scope.paginationConf.currentPage;
	var json={
		'name':$scope.search.name,
		'telephone':$scope.search.telephone,
		'organizationId':$scope.search.organizationId,
		'page':currentPage ? currentPage : 1,
		'rows':$scope.paginationConf.itemsPerPage
	}
	httpOther(
		$http,
		apiPath('/api/staff/list'),
		'post',
		json,
		function(data,textStatus){
			$scope.staffList=data.rows;
			$scope.paginationConf.totalItems=data.total;
			$scope.paginationConf.onChange=function(){
				getStaffList($scope,$http);
			};
		},
		function(errno,errmsg){

		}

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