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

{% block style %}
<style type="text/css">
#split-page {
	text-align: center;
}

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

</style>
{% endblock %}

{% block content %}
{% raw %}
<div ng-controller="userListController">
	<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" />
		<button class="form-control" ng-click="searchUserList(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>openId</th>
		        </tr>
	      </thead>
	      <tbody>
	        <tr ng-repeat="user in userList">
	        	<td>{{ user.id }}</td>
	        	<td>{{ user.telephone }}</td>
	        	<td>{{ user.name }}</td>
	        	<td>{{ user.idCard }}</td>
	        	<td>{{ user.sex==1 ? '男' : '女' }}</td>
	        	<td>{{ user.openId }}</td>
	        </tr>
	      </tbody>
		</table>
	</div>
	<div id="split-page">
		<tm-pagination conf="paginationConf"></tm-pagination>
	</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('userListController',function($scope,$http){
		init($scope,$http);
	});
function init($scope,$http)
{
	$scope.search={};
	$scope.paginationConf = {
        currentPage: 1,
        itemsPerPage: 10,
        pagesLength: 9,
        onChange: function(){
        }
    };

    $scope.searchUserList=function(target){
		getUserList($scope,$http);
	};

	$("#user-manage").addClass('active');
	$("#user-list").addClass("active");
	$("#user-manage-list").addClass('in');
	getUserList($scope,$http);
}
function getUserList($scope,$http)
{
	var json={
		'name':$scope.search.name,
		'telephone':$scope.search.telephone,
		'page':$scope.paginationConf.currentPage,
		'rows':$scope.paginationConf.itemsPerPage
	}
	httpOther(
		$http,
		apiPath('/api/user/search'),
		'post',
		json,
		function(data,textStatus){
			$scope.userList=data.rows;
			$scope.paginationConf.totalItems=data.total;
			$scope.paginationConf.onChange=function(){
				getUserList($scope,$http);
			};
		},
		function(errno,errmsg){

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