<div class="top-pad"></div>

<div class="content-padding" ng-show="ready">

	<h1 class="title left"><i class="fa fa-bank"></i><span>Scheduled Payments - Restaurants</span></h1>

	<div class="divider"></div>

	<div ng-if="result">

		<h2 class="title">
			<span>Summary</span>
		</h2>
		<h3 class="title">
			Summary updated at {{result.updated_at}} <span class="orange link" ng-click="update()">Update now</span>
		</h3>

		<table class="tb-grid tb-zebra summary">
			<tbody>
				<tr>
					<td>Total of Payments</td>
					<td>{{result.total}}</td>
				</tr>
				<tr>
					<td>Scheduled</td>
					<td>{{result.scheduled}}</td>
				</tr>
				<tr>
					<td>Processing</td>
					<td>{{result.processing}}</td>
				</tr>
				<tr ng-class="{'orange' : result.error > 0 }">
					<td>Error</td>
					<td>{{result.error}}</td>
				</tr>
			</tbody>
		</table>

		<div ng-if="result.restaurants">

			<h2 class="title">
				<span>Scheduled Payments</span>
			</h2>

			<table class="tb-grid tb-zebra">
				<thead>
					<tr>
						<td>#</td>
						<td class="td-medium">Restaurant</td>
						<td>Scheduled at</td>
						<td>Amount</td>
						<td>Status</td>
					</tr>
				</thead>
				<tbody>
					<tr ng-repeat="restaurant in result.restaurants">
						<td>{{restaurant.id_payment_schedule}}</td>
						<td>{{restaurant.restaurant}}</td>
						<td>{{restaurant.date}}</td>
						<td>$ {{restaurant.amount | formatPrice}}</td>
						<td>
							<span class="link orange" ng-click="payment( restaurant.id_payment_schedule )">{{restaurant.status}}</span>
						</td>
					</tr>
				</tbody>
			</table>
		</div>
	</div>
</div>

<spinner-loading></spinner-loading>
<hack-expand-content></hack-expand-content>