<div class="row">
	{{#if isByDates}}
		<div class="col-md-5">
			<button type="button" class="btn btn-block btn-default" {{action 'viewByRooms'}}>View by Rooms</button>
		</div>
	{{else}}
		<div class="col-md-5">
			<button type="button" class="btn btn-block btn-default" {{action 'viewByDates'}}>View by Dates</button>
		</div>
	{{/if}}
</div>
<br>

<div class="row row-eq-height">
	<div class="col-md-9 col-xs-9">
		{{#if isByDates}}

			<div class="box max-height-css">
				<div class="box-header with-border">
					<h3 class="box-title">Dates Booked</h3>
				</div>
				<!-- /.box-header -->
				<div class="box-body">
					<table class="table table-bordered">
						<tbody>
							<tr>
								<th style="width: 10px">#</th>
								<th>Room Name</th>
								<th>Room Type</th>
								<th>Booking Contact</th>
								<th>Group Name</th>
								<th>Status</th>
								<th>Date In</th>
								<th>Date Out</th>
								<th>#</th>
							</tr>
							{{#each model as |item|}}
								{{#each item.bookedroomdates as |bkdItem|}}
									<tr>
										<td>#</td>
										<td>{{item.room.name}}</td>
										<td>{{item.room.roomtype.name}}</td>
										<td>{{item.booking.guest.first_name}} {{item.bookedroom.booking.guest.last_name}}
										</td>
										<td>{{item.booking.group_name}}</td>
										<td>{{bkdItem.status}}</td>
										<td>{{moment-format bkdItem.date_in 'MMM Do YYYY, h:mm a'}}
										</td>
										<td>{{moment-format bkdItem.date_out 'MMM Do YYYY, h:mm a'}}
										</td>
										<td>
											{{#link-to 'admin.tasks.bookings.view.rooms.view.dates.view.guests' item.booking
											 item bkdItem class='btn btn-primary btn-xs' }}
												View{{/link-to}}
										</td>
									</tr>
								{{/each}}
							{{/each}}
						</tbody>
					</table>
				</div>
				<!-- /.box-body -->
				<div class="box-footer clearfix">
					{{#if isLoaded}}
						{{simple-pagination limit=bookingDatesController.limit currentPage=bookingDatesController.currentPage
						total=bookingDatesController.total}}
					{{/if}}

				</div>
			</div>
			<!-- /.box -->

		{{else}}

			<div class="box max-height-css">
				<div class="box-header with-border">
					<h3 class="box-title">Booked Rooms</h3>
				</div>
				<!-- /.box-header -->
				<div class="box-body">
					<table class="table table-bordered">
						<tbody>
							<tr>
								<th style="width: 10px">#</th>
								<th>Room Name</th>
								<th>Status</th>
								<th>Is Day Rate</th>
								<th>Date Added</th>
								<th style="width: 40px">#</th>
								<th style="width: 40px">#</th>
							</tr>
							{{#each model as |item|}}
								<tr>
									<td>#</td>
									<td>{{item.room.name}}</td>
									<td>{{item.status}}</td>
									<td>{{item.is_day_rate}}</td>
									<td>{{moment-format item.createdAt 'MMM Do YYYY, h:mm a'}}</td>
									<td>
										{{#link-to 'admin.tasks.bookings.view.rooms.view.dates' item.id class='btn btn-primary btn-xs'
										 }}View Room{{/link-to}}
									</td>
									<td>
										<button class='btn btn-primary btn-xs' onClick= {{perform deleteRoom item}}>{{if deleteRoom.isRunning 'Please Wait' 'Delete Room'}}</button>
									</td>
								</tr>
							{{/each}}
						</tbody>
					</table>
				</div>
				<!-- /.box-body -->
				<div class="box-footer clearfix">
					{{simple-pagination limit=limit currentPage=currentPage total=model.meta.total}}
				</div>
			</div>
			<!-- /.box -->

		{{/if}}
	</div>
	<!--col-md-9 col-xs-9-->
	<div class="col-md-3 col-xs-3">
		<aside class="control-sidebar relative control-sidebar-dark">
			<!-- Create the tabs -->
			<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
				<li class="active"><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></i></a></li>
			</ul>
			<!-- Tab panes -->
			<div class="tab-content">
				<!-- Home tab content -->
				<div class="tab-pane active" id="control-sidebar-home-tab">
					{{!--<h3 class="control-sidebar-heading">Actions</h3>--}}
					<ul class="control-sidebar-menu">

						<li>
							{{#link-to 'admin.tasks.bookings.view' }}
								<i class="menu-icon fa fa-backward bg-red"></i>
								<div class="menu-info">
									<h4 class="control-sidebar-subheading">Back to menu</h4>

									<p>Back to menu</p>
								</div>
							{{/link-to}}
						</li>
						<li>
							{{#link-to 'admin.tasks.bookings.view.rooms.add' }}
								<i class="menu-icon fa fa-plus bg-red"></i>
								<div class="menu-info">
									<h4 class="control-sidebar-subheading">Add rooms</h4>

									<p>Add available rooms</p>
								</div>
							{{/link-to}}
						</li>
					</ul>
					<!-- /.control-sidebar-menu -->
				</div>
				<!-- /.tab-pane -->
			</div>
		</aside>

	</div>
	<!--col-md-3 col-xs-3-->

	<!-- /.col -->
</div>
<!-- row row-eq-height -->