@extends('app_admin')

@section('title', 'Reports | Luxury Concierge')

@section('content')
    <div class="container-fluid" ng-controller="reportPreviewCtrl">
        <style type="text/css" media="print"> .page-header { display: none; } .wrapper > .printable:not(:first-child) { page-break-before:always; }</style>
        <div class="page-header">
            <div class="header left">
                <span class="icon icon-layers_windows_multiple_copy_duplicate"></span>
                <h1 class="header-title">Reports</h1>
            </div>
            <div class="requests-filter reports-preview">
                <ul class="filter-list">
                    <form class="row" method="POST" action="{{ url('reports/create') }}">
                        {{ csrf_field() }}
                        <div>
                            <div class="row">
                                <div class="col-sm-6 form-group">
                                    <div class="">
                                        <label for="date">From</label>
                                        <div class="dropdown">
                                            <a id="start_date" data-toggle="dropdown" data-target="#" href="#">
                                                <div class="input-group">
                                                    <input name="startDate" class="form-control"
                                                           type="text"
                                                           data-date-time-input=" MMMM D, YYYY"
                                                           data-ng-model="startDate"
                                                           value="@{{ startDate }}">
                                                    <span class="input-group-addon"><i
                                                                class="icon-calendar_date_schedule_event_month_year_3"></i></span>
                                                </div>
                                            </a>
                                            <ul class="dropdown-menu  fadeIn" data-wow-duration="300ms" role="menu"
                                                aria-labelledby="dLabel">
                                                <datetimepicker style="z-index: 1081"
                                                                data-ng-model="startDate"
                                                                data-on-set-time="startDateOnSetTime()"
                                                                data-before-render="startDateBeforeRender($dates)"
                                                                data-datetimepicker-config="{ minView: 'day', dropdownSelector: '#start_date', renderOn: 'end-date-changed'}"/>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-sm-6 form-group">
                                    <div class="">
                                        <label for="date">Until</label>
                                        <div class="dropdown">
                                            <a id="end_date" data-toggle="dropdown" data-target="#" href="#">
                                                <div class="input-group">
                                                    <input name="endDate" class="form-control"
                                                           type="text"
                                                           data-date-time-input=" MMMM D, YYYY"
                                                           data-ng-model="endDate"
                                                           value="@{{ endDate }}">
                                                    <span class="input-group-addon"><i
                                                                class="icon-calendar_date_schedule_event_month_year_3"></i></span>
                                                </div>
                                            </a>
                                            <ul class="dropdown-menu  fadeIn" data-wow-duration="300ms" role="menu"
                                                aria-labelledby="dLabel">
                                                <datetimepicker style="z-index: 1081"
                                                                data-ng-model="endDate"
                                                                data-on-set-time="endDateOnSetTime()"
                                                                data-before-render="endDateBeforeRender($view, $dates, $leftDate, $upDate, $rightDate)"
                                                                data-datetimepicker-config="{ minView: 'day', dropdownSelector: '#end_date', renderOn: 'start-date-changed' }"/>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="filter-group">
                            <div class="col-xs-12 col-sm-3">
                                <div class="row">
                                    <div class="form-group select">
                                        <select class="ng-pristine ng-valid ng-empty ng-touched" name="property">
                                            <option value="">Property</option>
                                            @foreach(Auth::user()->get_admin_properties() as $property)
                                                <option value="{{ $property->id }}" {{ old('property') == $property->id ? 'selected' : NULL }}>
                                                    {{ $property->name }}
                                                </option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <span class="required">{{ $errors->first('property') }}</span>
                                </div>
                                <br>
                            </div>
                            <div class="col-xs-12 col-sm-6">
                                <div class="form-group">
                                    <textarea name="emails"
                                              placeholder="Email addresses - email@email.com, test@test.com ...">