{% extends app.request.get('project_setting').instance_theme_path~":AdminTheme:base.html.twig" %}
{% block breadcrumb %}
        <li> {{ 'admin.sidebar_menu.report.title'|trans({}, 'admin') }}</li>
{% endblock breadcrumb %}

{% block main_page_title %}<i class="fa fa-tachometer"></i> {{ 'admin.sidebar_menu.report.title'|trans({}, 'admin') }}{% endblock main_page_title %}

{% block main_content %}
<div class="page-content">

	<style>
		.ob-dashboard-box { border:1px solid #d9d9d9; box-shadow:0 1px 1px rgba(204, 204, 204, 0.5); margin-bottom:20px; } 
		.ob-dashboard-heading { background:#f2f2f2; margin:0; padding:0 10px; height:40px; font-size:18px; line-height:40px; }
	</style>		
                       
         <nav class="navbar navbar-default top-dropdown">
	        <div class="container-fluid">
	            <div class="row">
	                <div class="col-lg-8 col-md-12 col-xs-12 col-sm-12 js-search-ecatalogue">
					   		    <div class="form-group top-title-form select-col search-width">
		                           <select class="form-control js-search-field" id="option" name="option">
		                           		<option value="">{{ 'admin.options.select_option' |trans }}</option>
										<option value="day">{{ 'admin.options.day'|trans }}</option>
										<option value="week">{{ 'admin.options.week'|trans }}</option>
										<option value="month">{{ 'admin.options.month'|trans }}</option>
										<option value="year">{{ 'admin.options.year'|trans }}</option>
										<option value="range">{{ 'admin.options.date_range'|trans }}</option>
									</select>
		                        </div>

		                        <div class="form-group top-title-form">
                                <div id="datetimepicker1" class="input-append date input-group date-block">
                                    <input type="text" id="date1" data-format="MM/dd/yyyy" class="form-control js-search-field" placeholder="{{ 'admin.options.start_date'|trans }}" readonly="readonly">
                                    <span class="add-on input-group-addon datepicker-color">
                                        <i class="fa-calendar fa"></i>
                                    </span>
                                </div>
                            </div>
                            <div class="form-group top-title-form">
                                <div id="datetimepicker2" class="input-append date input-group date-block" style="display:none">
                                    <input type="text" id="date2" data-format="MM/dd/yyyy" class="form-control js-search-field" placeholder="{{ 'admin.options.end_date'|trans }}" readonly="readonly">
                                    <span class="add-on input-group-addon datepicker-color">
                                        <i class="fa-calendar fa"></i>
                                    </span>
                                </div>
                            </div>
                        <div class="top-title-form">                         
							<input id="js-search-report-btn" type="button" class="button-secondary js-search-report-btn" value="{{ 'admin.options.search'|trans }}" data-searchviewreport-url="{{ path('office_brain_bundle_report_visitor_searchviewAjax') }}">
                        </div>         
	                </div>

	            </div>
	        </div>
	</nav>	

	<div id="reportsearchview" class="tab-content">
	 {% if app.request.attributes.get('_route') == 'office_brain_bundle_report_visitor_view' %}
			{{include('OfficeBrainReportBundle:Chart:searchreport.html.twig')}}
	 {% endif %}
		</div>
	
</div>
{% endblock main_content %}

{% block footer_js %}
{{ parent() }}
{% javascripts '@OfficeBrainReportBundle/Resources/public/js/report.js' %}
		<script src="{{ asset_url }}" type='text/javascript'></script>		
{% endjavascripts %}    
   {% endblock footer_js %}