<div class="modal-header">
	<button type="button" class="close" data-ng-click="cancel()">×</button>
	<h3 class="modal-title"><i class="fa fa-calendar"></i> Generate the timesheet report for all users</h3>
</div>
<form class="form-horizontal" data-ng-submit="submit()">
	<div class="modal-body">

		<div class="alert alert-info" data-ng-if="loading">
			<i class="fa fa-spinner fa-spin"></i> Preparing the Excel files for all the users...
		</div>

		<div class="alert alert-danger" data-ng-if="error && !loading">
			Oops, something went wrong!
		</div>

		<div class="alert alert-success" data-ng-if="response && !loading">
			<div data-ng-if="response.emailed.length > 0">
				<p>The reports have been emailed to <span data-ng-bind="::response.emailed.length"></span> users:</p>
				<ul>
					<li data-ng-repeat="user in response.emailed">
						<span data-ng-bind="::user.name"></span> &lt;<span data-ng-bind="::user.email"></span>&gt;
					</li>
				</ul>
			</div>

			<p data-ng-if="response.zip">Download the archive here: <a ng-href="{[{ response.zip }]}">Download</a></p>
		</div>

		<div class="form-group">
			<label for="period" class="col-sm-5 control-label">Select a time period:</label>
			<div class="col-sm-7">
				<div class="pull-left" ng-model="service.selected_period" ng-daterangepicker data-ranges="service.daterangepicker.ranges" data-format="MMMM D, YYYY">
					<i class="fa fa-calendar fa-lg"></i>
					<span>{[{ service.selected_period.startDate.format('D MMM YYYY') }]} - {[{ service.selected_period.endDate.format('D MMM YYYY') }]}</span>
				</div>
			</div>
		</div>

		<div class="form-group checkboxes">
			<label for="send_email" class="col-sm-5 control-label">Send an email with the timesheet attached to all the users?</label>
			<div class="col-sm-7">
				<label class="radio-inline">
					<input type="radio" name="send_email" value="1" data-ng-model="data.send_email" required> Yes
				</label>
				<label class="radio-inline">
					<input type="radio" name="send_email" value="0" data-ng-model="data.send_email" required> No
				</label>
			</div>
		</div>

		<div class="form-group checkboxes">
			<label for="download" class="col-sm-5 control-label">Download a zip file containing all the timesheets?</label>
			<div class="col-sm-7">
				<label class="radio-inline">
					<input type="radio" name="download" value="1" data-ng-model="data.download" required> Yes
				</label>
				<label class="radio-inline">
					<input type="radio" name="download" value="0" data-ng-model="data.download" required> No
				</label>
			</div>
		</div>

	</div>
	<div class="modal-footer">
		<button class="btn btn-default" data-ng-click="cancel()" eat-click>Close</button>
		<button class="btn btn-primary">Go!</button>
	</div>
</form>