<ion-view view-title="待办事项-collection" ng-controller="ListController">
<ion-nav-buttons side="right">
	<button class="button button-icon button-clear ion-navicon" ng-click="showDelete();">
    </button>
</ion-nav-buttons> 
<ion-content class="padding" on-scroll-complete="ionContentScrollComplete();">
	
	<ion-refresher pulling-text="{{refresherText}}" on-refresh="downRefresh();" on-pulling="onPulling();">
	</ion-refresher>
	<style>	/* 以下为修改默认ion-checkbox样式的代码  */
		.br-todo-list-item .item-checkbox{
			padding-left: 0px;
		}
		.br-todo-list-item .checkbox{
			padding-left: 1px;
			padding-right: 0px;
			right: 1px;
			left: 1px;
		}
		.br-todo-list-item .item-checkbox {
			border-top-width: 0px;
			border-bottom-width: 0px;
			margin-top: 5px;
		}
		.br-todo-list-item .checkbox-icon {
			width: 26px;
			height: 26px;
		}
	</style>
  <ion-list can-swipe="listConfig.listCanSwipe" show-delete="listConfig.shouldShowDelete">
	<ion-item item="item" class="todo-list-item" style="padding-bottom: 2.5%;" collection-repeat="item in todoListData track by item.RECORD_ID" collection-item-width="'95%'" collection-item-height="'19%'">
	<div class="br-todo-list-item">
		<div class="left">
				<span>{{$index+1}}</span>
				<ion-checkbox ng-model="item.selected" ng-checked="item.selected">
        		</ion-checkbox>
			</div>
		<div style="height:33.3%" class="center">
			<div style="height:100%;" class="center_top">
				<table style="height:100%;"><tr><td>
						公司/单据:{{item.COMPANY_DOC_TYPE}}
				</td></tr></table>
			</div>
			<div style="height:100%;" class="center_center">
				<div style="height:100%;" class="center_center_left">
					<table style="height:100%;"><tr><td>
						经办人:{{item.EMPLOYEE_NAME}}
					</td></tr></table>				
				</div>
				<div style="height:100%;" class="center_center_right">
					<table style="height:100%;"><tr><td>
						金额:{{item.DOC_AMOUNT}}
					</td></tr></table>
				</div>
			</div>
			<div style="height:100%;" class="center_bottom">
					<table style="height:100%;"><tr><td>
						事项:{{item.DOC_TITLE}}
					</td></tr></table>
			</div>
		</div>
		<div class="right" ng-click="lookDetail($index, todoListData);">
			<table style="height:100%;">
				<tr><td>
					<div class="fa fa-chevron-right pull-right" style="color:red;"></div>
				</td></tr>
			</table>					
		</div>
		<ion-delete-button class="ion-minus-circled" 
                           ng-click="onItemDelete(item)">
        </ion-delete-button>
        <ion-option-button class="button-assertive">
          同意
        </ion-option-button>
        <ion-option-button class="button-calm">
          拒绝
        </ion-option-button>
	</div>
	</ion-item>
  </ion-list>
  <div class="no-more-data" ng-if="noMoreData && !isLoadingMore" style="text-align:center; margin-top:10px; margin-bottom: 7px; color:#999;">
  	上拉加载更多
  </div>
  <ion-infinite-scroll ng-if="noMoreData" distance="1%" on-infinite="loadMoreData()">
  </ion-infinite-scroll>  
  <div class="no-more-data" ng-if="!noMoreData" style="text-align:center; margin-top:10px; margin-bottom: 7px; color:#999;">
  	暂无更多数据了
  </div>

<style>
	.item-content {
		height: 100%;
		padding: 0px !important;
	}
	.todo-list-item{
		background-color: white;
		height: 4.5rem;
		border-width: 0px;
	}
	.br-todo-list-item{
		margin-top: 0.5rem;
		background-color: white;
		width: 96%;
		margin-left: 2%;
		height: 4.5rem;
		box-shadow: 2px 2px 2px 2px #cacaca;
		font-size: 14px;
		border-radius: 8px;
	}
	.br-todo-list-item .left {
		width: 10%;
		float: left;
		display: inline-block;
		height: 100%;
		border-right: 1px #CCCCCC solid;
		text-align: center;
	}
	.br-todo-list-item .left span{
		display: inline-block;
		width: 100%;
		text-align: center;
		color: #FB9F55;
	}
	.br-todo-list-item .left input{
		display: inline-block;
		width: 100%;
	}
	.br-todo-list-item .center {
		width: 75%;
		display: inline-block;
		padding-left: 5px;
	}
	.center_center_left{
		display: inline-block;
		width: 70%;
		float: left;
	}
	.center_center_right{
		display: inline-block;
		width: 30%;
		float: right;
	}
	.br-todo-list-item .right{
		width: 10%;	
		height: 100%;
		float: right;
		display: table-row;
	}
	.br-todo-list-item .right:active{
		background-color: #eee;
	}
</style>
</ion-content>
<ion-footer-bar align-title="center" class="bar-assertive">
  <div class="buttons" ng-click="selectAll();">
    <button class="button">全选</button>
  </div>
  <h1 class="title">List-Collection</h1>
  <div class="buttons">
    <button class="button">拒绝</button>
  </div>
</ion-footer-bar>

</ion-view>