{{-- CityHub - Communal Service - Reports by city --}}

<script>
	var pdfRoute = '{{URL::route('ReportCreatePdf')}}';

</script>

<!-- City service By city start -->
<div id="cs-bycity">
	<div class="row">
		<div class="col s12">
			<div class="widget-holder hoverable fadeIn">
				<div class="widget-heading">

					<div class="row filter-row">
						<div class="col s12" >
							<h2  class="widget-heading-thick">{{$title}}</h2>
							<!--<button id="showOnMap">Show on map</button>-->
							<a class="waves-effect waves-light btn modal-trigger" id="showOnMap" href="#showOnMapModal">{{ ucfirst(Lang::get('communalService.report_on_map'))}}</a>

							@if (Entrust::hasRole('superadmin'))

								<div class="input-field right">
									<i class="material-icons prefix">domain</i>
									<input id="add-city" type="text">
									<label for="add-city">Choose city...</label>
								</div>

							@endif


							<div class="input-field right">
								<i class="material-icons prefix">search</i>
								<input id="icon_prefix" type="text" onkeyup="filterTable()">
								<label for="icon_prefix">{{ ucfirst(Lang::get('core.search'))}}</label>
							</div>

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


				<div class="widget-content">


					{{ Form::hidden('token', csrf_token(), array('id' => 'token')) }}
					{{ Form::hidden('cityCenterLatitude', $city->city_center_latitude, array('id' => 'cityCenterLatitude')) }}
					{{ Form::hidden('cityCenterLongitude', $city->city_center_longitude, array('id' => 'cityCenterLongitude')) }}
					{{ Form::hidden('coordinates', $city->coordinates, array('id' => 'coordinates')) }}




					@if(count($reports)>0)
					<div class="table-wrapper">
						<table class="bordered responsive-table">
							<thead>
							<tr>
								<th>{{ Lang::get('communalService.header_id') }}</th>
								<th>{{ Lang::get('communalService.header_image') }}</th>
								<th>{{ Lang::get('communalService.header_user') }}</th>
								<th>{{ Lang::get('communalService.header_date_time') }}</th>
								<th>{{ Lang::get('communalService.header_type') }}</th>
								<th>{{ Lang::get('communalService.header_subtype_name') }}</th>
								<th>{{ Lang::get('communalService.header_description') }}</th>
								<th>{{ Lang::get('communalService.header_priority') }}</th>
								<th>{{ Lang::get('communalService.header_status') }}</th>
								<th>{{ Lang::get('communalService.header_action') }}</th>
							</tr>
							</thead>

							<tbody id="searchable">
							@foreach ($reports as $report)

									<tr id="{{$report->id}}">
									<td class="{{ $report->is_active?'element':'error' }}">{{ $report->id }}</td>
									<td><img class="enlargeable" onclick="bigImage=this.src; showImage()" src="{{ URL::to('/') }}/uploads/communalService/{{ $report->image }}" alt=""> </td>
									<td><a href="{{ URL::route('CommunalServiceUserReports', array('id' => $report->user_id)) }}" title="{{ Lang::get('communalService.tooltip_link_reports_by_user', array('name' => $report->user_first_name . ' ' . $report->user_last_name)) }}">{{ $report->user_first_name . ' ' . $report->user_last_name }}</a></td>
									<td>{{ $report->created_at }}</td>
									<td>{{ $report->type_name }}</td>
									<td>{{ $report->subtype_name }}</td>
									<td>{{ str_limit($report->description, $limit = 120, $end = '...') }}</td>
									<td>{{ Lang::get('communalService.' . $report->priority_name) }}</td>
									<td>{{ Lang::get('communalService.' . $report->status_name) }}</td>

									<td>

										<a onclick="manage({{$report->id}})" class="icon-btn icon-btn-edit"><i class="material-icons">mode_edit</i></a>
										<a href="{{ URL::route('CommunalServiceDeleteReport', array('id' => $report->id)) }}" class="icon-btn icon-btn-delete" title="{{ Lang::get('communalService.tooltip_button_delete_template') }}"  data-id="{{ $report->id }}"><i class="material-icons">delete</i></a>

									</td>
							</tr>

							@endforeach

							</tbody>
						</table>


				</div>

					@else

						<div class="card-panel yellow lighten-5 blue-grey-text"><h5>{{Lang::get('communalService.msg_no_reports')}}</h5></div>


					@endif
					<div id="show-image-modal" class="modal modal-fixed-footer">
						<div class="modal-content">
							<img id="big-image" src="">
						</div>

					</div>
					<div id="showOnMapModal" class="modal modal-fixed-footer showOnMapModal">
						<div class="inputs-wrapper">
							<div class="row">
								<div class="col s12 m12 l12">
										<div class="report-map-holder hoverable"  style="height:70vh !important;">
											<div  id="map-canvas-report"  style="height: 100%; width: 100%;"></div>
										</div>
								</div>
							</div>
						</div>

						<div class="modal-footer right-align">
							<a class="modal-action modal-close waves-effect waves-light btn-flat modal-cancel">{{ Lang::get('core.cancel') }}</a>
						<!--	<button class="modal-action waves-effect waves-light btn-flat modal-save">{{ Lang::get('core.save') }}</button> -->

						</div>
					</div>
					<div id="manage-report-modal" class="modal modal-fixed-footer">
						{{ Form::open(array('route' => 'CommunalServicePostEditReport', 'role' => 'form', 'class' => 'form-horizontal', 'id'=>'modal-form', 'autocomplete' => 'off', 'files' => true )) }}

						<div class="modal-content"  id="report" >
							<div id="preloader-bar"  style="display:none;position:relative" class="animated fadeIn progress">
								<div class="indeterminate"></div>
							</div>

							<input type="hidden" name="city" id="city">
							<input type="hidden" name="id" v-bind:value="report.id">
							<input type="hidden" name="reportLatitude" v-bind:value="report.latitude">
							<input type="hidden" name="reportLongitude" v-bind:value="report.longitude">

							<h4 id="title">@{{title}}</h4>

							<ul class="tabs tabs-fixed-width">
								<li class="tab"><a class="active" href="#report-overview">{{Lang::get('dashboard.statistics')}}</a></li>
								<li class="tab"><a href="#report-edit">{{Lang::get('cityForm.table_edit')}}</a></li>
								<li class="tab"><a href="#report-delegate">{{Lang::get('communalService.header_delegate')}}</a></li>
								<li class="tab"><a href="#report-tracking">{{Lang::get('communalService.report_history')}}</a></li>

							</ul>
							@if(count($reports)>0)
							<div id="report-overview" class="fadeIn">
								<div class="inputs-wrapper"  >
									<div class="row">
										<div class="col s12 m4 l4">
											<div class="report-holder hoverable">
												<div class="report-image" v-bind:style="report.imageBack" onclick="showImage()">
													<div class="report-image-fader">
														<p v-if="report.location_address"><i class="material-icons">room</i>@{{ report.location_address }}</p>
														<p><i class="material-icons">schedule</i>@{{ report.created_at }}</p>
													</div>
												</div>
												<div class="report-content">
													<h5 v-if="report.user_first_name!='Anonymous'">{{Lang::get('communalService.report_by')}}: @{{ report.user_first_name + ' ' + report.user_last_name }}</h5>
													<h5 v-if="report.email!=''">{{Lang::get('communalService.report_by')}}: @{{ report.email }}</h5>
													<p>@{{ report.description }}</p>
												</div>
											</div>
										</div>
										<div class="col s12 m4 l4">
											<div class="report-map-holder hoverable" style="height:70vh !important;">
												<div  id="map-canvas"  class="map" style="height: 100%; width: 100%;"></div>
											</div>

										</div>

										<div class="col s12 m4 l4">
											<div class="manage-holder hoverable">

												<h5>{{Lang::get('communalService.options')}}</h5>
												<div class="switch">
													<label>
														{{ucfirst(Lang::get('core.inactive'))}}
														<input name="active" value=1 type="checkbox" v-bind:checked="report.is_active">
														<span class="lever"></span>
														{{ucfirst(Lang::get('core.active'))}}
													</label>
												</div>

												<div class="input-field">
													{{ Form::select('priority', $priorities, null, array('id' => 'priority' , 'class' => 'sort-dropdown reports-input')) }}


												</div>

												<div class="input-field">
													{{ Form::select('status', $statuses, null, array('id' => 'status', 'class' => 'sort-dropdown reports-input')) }}

												</div>
												<div class="input-field">
													<textarea name="admin_note" id="admin-reply" class="materialize-textarea" v-model="report.admin_note"></textarea>
													<label v-bind:class="{active:report.admin_note}" for="admin-reply">{{Lang::get('communalService.label_report_admin_note')}}</label>
												</div>
												<div class="input-field">
													<a v-bind:href="report.pdfRoute + '/' + report.report_id"  class="btn btn-xs btn-success"><i class="material-icons">picture_as_pdf</i></a>
												</div>

											</div>

										</div>
									</div>


								</div>



							</div>
							@endif

							<div id="report-edit" class="fadeIn">
								<div class="inputs-wrapper">
									<div class="row">
										<div  v-if="report.attach_image" class="col s12 m4 l4">
											<div class="report-holder hoverable">
												<div class="report-image" v-bind:style="report.attach_image">
													<div class="report-image-fader">
														<p>{{ Lang::get('communalService.status_resolved') }}</p>

													</div>
												</div>

											</div>
										</div>

										<div class="col" v-bind:class="{'s12 m8 l8':report.attach_image}">
											<div class="edit-holder hoverable">

												<div class="input-field col s6">
													<label  class="active"  for="type">{{ Lang::get('communalService.header_type') }}</label>

													<select name="type" id="type">
														<option value="" disabled selected>{{ Lang::get('communalService.header_type') }}</option>
													</select>

												</div>
												<div class="input-field col s6">
													<label class="active"  for="subtype">{{ Lang::get('communalService.header_subtype_name') }}</label>

													<select name="subtype" id="subtype">
														<option value="" disabled selected>{{ Lang::get('communalService.header_subtype_name') }}</option>
													</select>

												</div>



												<div class="input-field col s12">
													<textarea id="report-desc" class="materialize-textarea" name="description" v-model="report.description"></textarea>
													<label v-bind:class="{active:report.description}" for="repot-desc">{{ Lang::get('communalService.header_description') }}</label>
												</div>


												<div class="file-field input-field col s10">
													<div class="btn">
														<span>{{ Lang::get('communalService.label_current_attach_image') }}</span>
														<input name="attach_image" type="file" id="attach-image-file" >
													</div>
													<div class="file-path-wrapper">
														<input class="file-path validate" type="text"  v-bind:value="report.attach_image">
													</div>
												</div>

												<div class="input-field col s2">
													<input name="votes" id="votes" type="text" v-model="report.votes">
													<label  class="active" for="votes">{{ Lang::get('communalService.label_report_votes') }}</label>
												</div>

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

							<div id="report-delegate" class="fadeIn">
								<div class="inputs-wrapper">
									<div class="row">
										<div class="col s12 m4 l4">
											<div class="report-holder hoverable">
												<div class="report-image" v-bind:style="report.imageBack" onclick="showImage()">
													<div class="report-image-fader">
														<p><i class="material-icons">room</i>@{{ report.location_address }}</p>
														<p><i class="material-icons">schedule</i>@{{ report.created_at }}</p>
													</div>
												</div>
												<div class="report-content">
													<h5 v-if="report.user_first_name!='Anonymous'">{{Lang::get('communalService.report_by')}}: @{{ report.user_first_name + ' ' + report.user_last_name }}</h5>
													<p>@{{ report.description }}</p>
												</div>
											</div>
										</div>
										<div class="col s12 m8 l8">
											<div class="edit-holder hoverable">

												<div class="row">
													<div class="input-field col s12 m6">
														<label class="active">{{Lang::get('core.city_company')}}</label>

														{{ Form::select('company', $citycompanies, null, array('id' => 'company' , 'class' => 'sort-dropdown reports-input')) }}
													</div>

													<div class="input-field col s12 m6">

														<label class="active">{{Lang::get('communalService.title_template_list')}}</label>

														{{ Form::select('template', $templates, null, array('id' => 'template' , 'class' => 'sort-dropdown reports-input')) }}

													</div>
												</div>
												<div class="row">
													<div class="input-field col s12">
														<textarea name="admin_note_for_managers" id="delegate-note" class="materialize-textarea">@{{ report.admin_note_for_managers }}</textarea>
														<label v-bind:class="{active:report.admin_note_for_managers}" for="repot-desc" id="delegate-note-label">{{Lang::get('communalService.details_admin_note_for_managers')}}</label>
													</div>
												</div>
												<div class="row valign-wrapper">
													<a id="doTheDelegate" onclick="delegate()" class="waves-effect waves-light btn btn-primary">{{Lang::get('communalService.header_delegate')}}</a>

												</div>





											</div>

										</div>
									</div>

								</div>

							</div>

							<div id="report-tracking" class="fadeIn">
								<div class="inputs-wrapper">
									<div class="row">
										<div class="col s12 m4 l4">
											<div class="report-holder hoverable">
												<div class="report-image" v-bind:style="report.imageBack" onclick="showImage()">
													<div class="report-image-fader">
														<p><i class="material-icons">room</i>@{{ report.location_address }}</p>
														<p><i class="material-icons">schedule</i>@{{ report.created_at }}</p>
													</div>
												</div>
												<div class="report-content">
													<h5 v-if="report.user_first_name!='Anonymous'">{{Lang::get('communalService.report_by')}}: @{{ report.user_first_name + ' ' + report.user_last_name }}</h5>
													<p>@{{ report.description }}</p>
												</div>
											</div>
										</div>

										<div class="col s12 m4 l4">

											<div class="report-history-holder">
												<template v-if="report.tracking">


													<table class="bordered responsive-table">
														<thead>
														<tr >
															<th>{{ Lang::get('communalService.header_action') }}</th>
															<th>{{ Lang::get('communalService.header_user') }}</th>
															<th>{{ Lang::get('communalService.header_date_time') }}</th>
														</tr>
														</thead>
														<tbody>
														<template v-for="track in report.tracking">
															<tr>
																<td>@{{track.action}}</td>
																<td>@{{track.first_name + ' ' + track.last_name}}</td>
																<td>@{{ track.date }}</td>
															</tr>
														</template>
														</tbody>
													</table>
												</template>



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


						</div>

						<div class="modal-footer right-align">
							<a class="modal-action modal-close waves-effect waves-light btn-flat modal-cancel">{{ Lang::get('core.cancel') }}</a>
							<button class="modal-action waves-effect waves-light btn-flat modal-save">{{ Lang::get('core.save') }}</button>

						</div>
						{{ Form::close() }}
					</div>



				</div>
		</div>
	</div>
</div>
<!-- City service By city end -->




</div>
<script>
	var report_activate_link = "{{ URL::route('CommunalServicePostActivateReport') }}";
	var report_deactivate_link = "{{ URL::route('CommunalServicePostDeactivateReport') }}";
	var lang_activate_tooltip = "{{{ Lang::get('communalService.tooltip_button_activate') }}}";
	var lang_deactivate_tooltip = "{{{ Lang::get('communalService.tooltip_button_deactivate') }}}";
	var lang_activate_message = "{{{ Lang::get('communalService.report_activated') }}}";
	var lang_deactivate_message = "{{{ Lang::get('communalService.report_deactivated') }}}";
	var lang_activate_error = "{{{ Lang::get('communalService.report_activate_error') }}}";
	var lang_delegate_error = "{{{ Lang::get('communalService.msg_no_companies') }}}";
	var lang_delegate_set_error = "{{{ Lang::get('communalService.msg_error_delegating') }}}";
	var lang_delegate_set_success = "{{{ Lang::get('communalService.msg_success_delegating') }}}";
	var lang_confirm_delete_text = "{{ Lang::get('communalService.lang_confirm_delete_text') }}";
	var lang_tooltip_active = "{{ Lang::get('communalService.tooltop_indicator_active') }}";
	var lang_tooltip_inactive = "{{ Lang::get('communalService.tooltop_indicator_inactive') }}";


	var currentLink = '{{ URL::route('CommunalServiceCityReports', array('id' => $city->id)) }}';
	var delegationDataLink = '{{ URL::route('CommunalServicePostDelegationData') }}';
	var delegateLink = '{{ URL::route('CommunalServicePostDelegateReport') }}';
	var submitLink = '{{ URL::route('CommunalServicePostEditReport') }}';

	var statusDictionary=JSON.parse('{{$statusesJSON}}');
	var priorityDictionary=JSON.parse('{{$prioritiesJSON}}');
</script>

<script>
	var routeLink = "{{{ URL::route('CommunalServiceCompanyReports', array('id' => 'tempIDplaceholder')) }}}";
</script>


<script>
    var allCities=JSON.parse('{{$allCities}}');

    var reportsList = [];
    @foreach ($reports as $report)
    reportsList.push({id: {{$report->id}}, status: {{ $report->status_id }}, latitude: {{ $report->latitude }}, longitude: {{ $report->longitude }}, image: "{{ URL::to('/') . '/uploads/communalService/' . $report->image }}", thumb: "{{ URL::to('/') . '/uploads/communalService/thumbs/' . $report->image }}" });
			@endforeach
    var cityCenterLatitude = '{{ $city->city_center_latitude}}';
    var cityCenterLongitude = '{{ $city->city_center_longitude}}';
    $(document).ready(function() {


        //console.log(allCities);


        $( "#add-city" ).autocomplete({
            data: allCities,
            limit: 10, // The max amount of results that can be shown at once. Default: Infinity.
            onAutocomplete: function(val) {


                var url='https://'+window.location.hostname+'/communal-service/reports/city/'+val;

                window.location.assign(url);

            },
            minLength: 1, // The minimum length of the input for the autocomplete to start. Default: 1.
        });

        $( "#add-city" ).keyup(function (e) {
            if(e.keyCode==13){

                var url='https://'+window.location.hostname+'/communal-service/reports/city/'+e.currentTarget.value;

                window.location.assign(url);

            }
        });

    });

    function filterTable() {
        // Declare variables
        var input, filter, table, tr, td, i;
        input = document.getElementById("icon_prefix");
        filter = input.value.toUpperCase();
        table = document.getElementById("searchable");
        tr = table.getElementsByTagName("tr");

        // Loop through all table rows, and hide those who don't match the search query
        for (i = 0; i < tr.length; i++) {
            td = tr[i].getElementsByTagName("td");
            var displayIt=false;
            for (y = 0; y < 9; y++) {


                if (td[y]) {

                    if (td[y].innerHTML.toUpperCase().indexOf(filter) > -1) {
                        displayIt=true;
                    }
                }
                if (displayIt) {
                    tr[i].style.display = "";
                } else {
                    tr[i].style.display = "none";
                }
            }

        }
    }
</script>