<?php /* CityHub - Communal Service - Reports by user */ ?>

<div id="">
	<div class="row">
		<div class="col s12">
			<div class="widget-holder hoverable fadeIn">
				<div class="widget-content">
					<div class="table-wrapper">
						<?php echo Form::hidden('token', csrf_token(), array('id' => 'token')); ?>

						<table class="bordered responsive-table">
							<thead>
							<tr>
								<th class="text-center"><?php echo Lang::get('communalService.header_id'); ?></th>
								<th></th>
								<th><?php echo Lang::get('communalService.header_user'); ?><br><small><?php echo Lang::get('communalService.header_date_time'); ?></small></th>
								<th class="text-center"><?php echo Lang::get('communalService.header_is_active'); ?></th>
								<th class="text-center"><?php echo Lang::get('communalService.header_city'); ?></th>
								<th class="text-center"><?php echo Lang::get('communalService.header_priority'); ?></th>
								<th class="text-center"><?php echo Lang::get('communalService.header_status'); ?></th>
								<th class="text-center"><?php echo Lang::get('communalService.header_action'); ?></th>

							</tr>
							</thead>

							<tbody id="searchable">
							<?php foreach($reports as $report): ?>
								<tr>
									<td class="text-center"><?php echo Form::button($report->id, array('type' => 'button', 'class' => 'btn btn-sm btn-default focusButton', 'data-id' => $report->id, 'data-latitude' => $report->latitude, 'data-longitude' => $report->longitude, 'title' => Lang::get('communalService.tooltip_button_focus'))); ?></td>
									<td class="text-center">
										<?php if($report->is_active == true): ?>
											<span class="text-success" id="report<?php echo $report->id; ?>active" title="<?php echo Lang::get('communalService.tooltop_indicator_active'); ?>"><span class="icon-done" id="report<?php echo $report->id; ?>activeicon"></span></span>
										<?php else: ?>
											<span class="text-danger" id="report<?php echo $report->id; ?>active" title="<?php echo Lang::get('communalService.tooltop_indicator_inactive'); ?>"><span class="icon-close" id="report<?php echo $report->id; ?>activeicon"></span></span>
										<?php endif; ?>
									</td>
									<td><strong><?php echo $report->user_first_name . ' ' . $report->user_last_name; ?></strong><br><small><?php echo $report->created_at; ?></small></td>
									<td class="text-center">
										<?php if($report->is_active == true): ?>
											<?php echo Form::button('<i class="material-icons">block</i>', array('type' => 'button', 'class' => 'btn  red   activateButton', 'data-id' => $report->id, 'data-status' => 'true', 'title' => Lang::get('communalService.tooltip_button_deactivate'))); ?>

										<?php else: ?>
											<?php echo Form::button('<i class="material-icons">done</i>', array('type' => 'button', 'class' => 'btn waves-effect waves-light green activateButton', 'data-id' => $report->id, 'data-status' => 'false', 'title' => Lang::get('communalService.tooltip_button_activate'))); ?>

										<?php endif; ?>
									</td>
									<td class="text-center">
										<?php if(isset($citiesReports[$report->id])): ?>
											<a href="<?php echo URL::route('CommunalServiceCityReports', array('id' => $citiesReports[$report->id]->city_id)); ?>" title="<?php echo Lang::get('communalService.link_city_view', array('name' => $citiesReports[$report->id]->city_name)); ?>"><?php echo $citiesReports[$report->id]->city_name; ?></a>
										<?php else: ?>
											-
										<?php endif; ?>
									</td>
									<td class="text-center"><span id="report<?php echo $report->id; ?>prioritydisplay"><?php echo Lang::get('communalService.' . $report->priority_name); ?></span></td>
									<td class="text-center"><?php echo Lang::get('communalService.' . $report->status_name); ?></td>
									<td class="text-center">
										<a onclick="manage(<?php echo $report->id; ?>)" class="icon-btn icon-btn-edit"><i class="material-icons">mode_edit</i></a>
										<a href="<?php echo URL::route('CommunalServiceDeleteReport', array('id' => $report->id)); ?>" class="icon-btn icon-btn-delete" title="<?php echo Lang::get('communalService.tooltip_button_delete_template'); ?>"  data-id="<?php echo $report->id; ?>"><i class="material-icons">delete</i></a>
									</td>
								</tr>

							<?php endforeach; ?>

							</tbody>
						</table>
					</div>
					<div id="report-modal" class="modal modal-fixed-footer">
						<?php echo Form::open(array('route' => 'CommunalServicePostEditReport', 'role' => 'form', 'class' => 'form-horizontal', 'id'=>'modal-form', 'autocomplete' => 'off', 'files' => true )); ?>


						<div class="modal-content"  id="report">


							<input type="hidden" name="city" id="city" v-bind:value="report.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>{{report.title}}</h4>

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

							</ul>
							<?php 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.image" 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'"><?php echo 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-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><?php echo Lang::get('communalService.options'); ?></h5>
													<div class="switch">
														<label>
															<?php echo ucfirst(Lang::get('core.inactive')); ?>

															<input name="active" value=1 type="checkbox" v-bind:checked="report.is_active">
															<span class="lever"></span>
															<?php echo ucfirst(Lang::get('core.active')); ?>

														</label>
													</div>

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


													</div>

													<div class="input-field">
														<?php /* 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"><?php echo Lang::get('communalService.label_report_admin_note'); ?></label>
													</div>
													<div class="input-field">
														<a v-bind:href="report.pdfRoute + '/' + report.id"  class="btn btn-xs btn-success"><i class="material-icons">picture_as_pdf</i></a>
													</div>

												</div>

											</div>
										</div>


									</div>



								</div>
							<?php endif; ?>

							<div id="report-edit" 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.image" 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'"><?php echo Lang::get('communalService.report_by'); ?>: {{ report.user_first_name + ' ' + report.user_last_name }}</h5>
													<p>{{ report.description }}</p>
												</div>
											</div>
										</div>
										<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><?php echo Lang::get('communalService.status_resolved'); ?></p>

													</div>
												</div>

											</div>
										</div>

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


												<div class=" col s6">
													<label  class="active"  for="type"><?php echo Lang::get('communalService.header_type'); ?></label>
													<select class="browser-default" name="type" id="type"  onchange="changeSubtypes(0)">
														<option selected  disabled><?php echo Lang::get('communalService.header_type'); ?></option>

														<option v-for="(type,id) in report.types" :value="id " :selected="id == report.type_id"  >{{ type.name }}</option>
													</select>

												</div>
												<div class="col s6">
													<label class="active"  for="subtype"><?php echo Lang::get('communalService.header_subtype_name'); ?></label>

													<select class="browser-default" name="subtype" id="subtype" >
														<option value=""  disabled selected><?php echo 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"><?php echo Lang::get('communalService.header_description'); ?></label>
												</div>


												<div class="file-field input-field col s10">
													<div class="btn">
														<span><?php echo 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=" col s2">
													<label  class="active" for="votes"><?php echo Lang::get('communalService.label_report_votes'); ?></label>

													<input name="votes" id="votes" type="text" v-model="report.votes">
												</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.image" 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'"><?php echo 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"><?php echo Lang::get('core.city_company'); ?></label>
														<select class="browser-default" name="type" id="company">
															<option selected  disabled><?php echo Lang::get('communalService.header_type'); ?></option>

															<option v-for="(company,id) in report.companies" :value="company.id "  >{{ company.name }}</option>
														</select>
														<?php /* Form::select('company', $citycompanies, null, array('id' => 'company' , 'class' => 'sort-dropdown reports-input')) */ ?>
													</div>

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

														<label class="active"><?php echo Lang::get('communalService.title_template_list'); ?></label>
														<select class="browser-default" name="type" >
															<option selected  disabled><?php echo Lang::get('communalService.header_type'); ?></option>

															<option v-for="(template,id) in report.answer_template" :value="id "  >{{ template }}</option>
														</select>
														<?php /* Form::select('template', $templates, null, array('id' => 'template' , 'class' => 'sort-dropdown reports-input')) */ ?>

													</div>
													<div class="input-field col s12 m6">
														<label  class="active" ><?php echo Lang::get('communalService.label_report_priority'); ?>:</label>
															<select class="browser-default" name="priority" id="priority">
																<option selected  disabled><?php echo Lang::get('communalService.header_type'); ?></option>

																<option v-for="(priority,id) in report.priorities" :value="priority.id "  >{{ priority.identifier }}</option>
															</select>
													</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"><?php echo 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"><?php echo 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'"><?php echo 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><?php echo Lang::get('communalService.header_action'); ?></th>
															<th><?php echo Lang::get('communalService.header_user'); ?></th>
															<th><?php echo 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"><?php echo Lang::get('core.cancel'); ?></a>
							<button class="modal-action waves-effect waves-light btn-flat modal-save"><?php echo Lang::get('core.save'); ?></button>

						</div>
						<?php echo Form::close(); ?>

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

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






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

    var priorityLang = {
        'priority'				:	'Prioritet',
        'priority_undefined'	:	'Nedefiniran',
        'priority_urgent'		:	'Hitno',
        'priority_high'			:	'Visoko',
        'priority_medium'		:	'Srednje',
        'priority_low'			: 	'Nisko',
        'priority_all'			:	'Svi prioriteti',
	}
    var reportsList = {};
    var citiesList = {};

    var bigImage;
    var currentLink = '<?php echo URL::route('CommunalServiceUserReports', array('id' => $user->id)); ?>';
    var delegationDataLink = '<?php echo URL::route('CommunalServicePostDelegationData'); ?>';
    var delegateLink = '<?php echo URL::route('CommunalServicePostDelegateReport'); ?>';

	<?php foreach($reports as $report): ?>
        reportsList[<?php echo $report->id; ?>] = { status: <?php echo $report->status_id; ?>, latitude: <?php echo $report->latitude; ?>, longitude: <?php echo $report->longitude; ?>, image: "<?php echo URL::to('/') . '/uploads/communalService/' . $report->image; ?>", thumb: "<?php echo URL::to('/') . '/uploads/communalService/thumbs/' . $report->image; ?>" };
	<?php endforeach; ?>

			<?php foreach($cities as $city): ?>
        citiesList[<?php echo $city->city_id; ?>] = { name: '<?php echo $city->city_name; ?>', latitude: '<?php echo $city->city_center_latitude; ?>', longitude: '<?php echo $city->city_center_longitude; ?>', radius: '<?php echo $city->city_radius_from_center; ?>', zipcode: '<?php echo $city->city_zip_code; ?>' };
	<?php endforeach; ?>

    var report= new Vue( {
            el:'#report',
            data:{report:{
                votes:null
            }},
            computed:{zerovotes:function () {
                return
            }},
            watch:{
                report:function () {
                    Materialize.updateTextFields();

                }
            },

        });
    function initializeMap(mapLatitude, mapLongitude) {
        var mapOptions = {
            zoom: 11,
            center: new google.maps.LatLng(mapLatitude, mapLongitude)
        };
        map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
        google.maps.event.trigger(map, 'resize');
    }
    function initMap() {
        // Get city data
        cityCenterLatitude = report.report.city_coords.lat;
        cityCenterLongitude = report.report.city_coords.lon;
        coordinates = $('#coordinates').val();

        // Initialize map
        initializeMap(cityCenterLatitude, cityCenterLongitude);

        // Create city marker image
        cityCenterImage = {
            url: rootPath + '/img/core/ch-city-center.png',
            size: new google.maps.Size(54, 72),
            origin: new google.maps.Point(0, 0),
            anchor: new google.maps.Point(13, 35),
            scaledSize: new google.maps.Size(27, 36),
        };

        // Create first city marker
        cityCenterMarker = new google.maps.Marker({
            position: new google.maps.LatLng(cityCenterLatitude, cityCenterLongitude),
            map: map,
            icon: cityCenterImage
        });

        var marker = new google.maps.Marker({
            position: new google.maps.LatLng(reportsList[report.report_id].latitude, reportsList[report.report_id].longitude),
            icon: rootPath + '/img/modules/communalService/ch-report-in-progress.png'
        });
		marker.setMap(map);
    }

	function changeSubtypes(type)
	{
	    console.log(report.report.types[type]);
	    if(type == 0)
			type = $("#type").val();
		var subtypes = '<option value="" disabled selected><?php echo Lang::get('communalService.header_subtype_name'); ?></option>';
		$.each(report.report.types[type].subtypes,function(index,value)
		{
		    if(index == report.report.subtype_id)
		    	subtypes += '<option selected value="'+index+'">'+value+'</option>';
		    else
                subtypes += '<option  value="'+index+'">'+value+'</option>';

        });
		$("#subtype").html(subtypes);
	};

    function manage(id){

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

        $.get(url).then(function(resp){

            if(!resp.report.votes>0) resp.report.votes='Nema';

            report.title=resp.title;
            report.report=resp.report;
            report.report_id = id;
            report.report.city = resp.reportCity.city_id;
            report.report.city_coords = {lat:resp.reportCity.city_center_latitude,lon:resp.reportCity.city_center_longitude};
            report.report.types = resp.typesGrid;
            report.report.pdfRoute = pdfRoute;
            $.each(resp.priorities,function(index,value)
			{
			     value.identifier = priorityLang[value.identifier];
			});

            report.report.priorities = resp.priorities;
			report.report.companies = resp.companies;
            report.report.answer_template = resp.templates;
            if(resp.tracking.length>0){
                resp.report.tracking=resp.tracking;
            }else{
                resp.report.tracking=null;
            }
            bigImage="https://"+window.location.hostname+"/uploads/communalService/"+resp.report.image;
            resp.report.image="background-image: url('https://"+window.location.hostname+"/uploads/communalService/"+resp.report.image+"')";


            $('#report-modal').modal('open');

            initMap();
            changeSubtypes(report.report.type_id);
        });
    }
    function delegate() {

        var companyID = $('#company').val();
        var priorityID = $('#priority').val();
        var noteContent = $('#delegate-note').val();

        var loadCityCompanies = $.ajax({
            url: delegateLink,
            dataType: 'json',
            data: {
                '_token': $('#token').val(),
                'report': report.report.id,
                'company': companyID,
                'priority': (priorityID=='all')?1:priorityID,
                'note': noteContent
            },
            type: 'post',
        }).done(function(data) {
            console.log('data', data);

            if (data.status == '1') {
                $('#doTheDelegate').attr('disabled', 'disabled');

                var n = noty({
                    text: lang_delegate_set_success,
                    type: 'success',
                    theme: 'cityhub',
                    layout: 'bottomRight',
                    animation: {
                        open: 'animated bounceInUp',
                        close: 'animated bounceOutDown',
                    }
                });

            } else {
                var n = noty({
                    text: lang_delegate_set_error,
                    type: 'error',
                    theme: 'cityhub',
                    layout: 'bottomRight',
                    animation: {
                        open: 'animated bounceInUp',
                        close: 'animated bounceOutDown',
                    }
                });
            }
            refreshReportData(report.report.id);
        }).fail(function(data) {
            var n = noty({
                text: lang_delegate_set_error,
                type: 'error',
                theme: 'cityhub',
                layout: 'bottomRight',
                animation: {
                    open: 'animated bounceInUp',
                    close: 'animated bounceOutDown',
                }
            });
        });

    }

    function showImage(){
        console.log(bigImage);


        $('#show-image-modal').modal('open');

        $('#big-image').prop('src', bigImage);


    }
    $('#show-image-modal').click(function(){
        $('#show-image-modal').modal('close');
    });




</script>
