Skip to content

Instantly share code, notes, and snippets.

@somaria
Created June 14, 2024 00:21
Show Gist options
  • Save somaria/0212389890fb1b665850e4d7a42e7984 to your computer and use it in GitHub Desktop.
Save somaria/0212389890fb1b665850e4d7a42e7984 to your computer and use it in GitHub Desktop.
home.blade.php
@extends('layouts.app')
@section('title')
Dashboard
@endsection
@section('content')
@include('layouts.partials.sidebar', array('active' => 'dashboard'))
<?php $role_name=Auth::user()->role->name; ?>
<div class="content-wrapper">
<section class="content">
<h2 >
<i class="fa fa-dashboard icon-content-header"></i> <?php if($role_name=="super_admin" || $role_name=="admin" || $role_name=="help_desk" || $role_name=="site_admin" || $role_name=="site_staff" || $role_name=="other" ) { echo "Analytics Dashboard"; } else {echo "Home"; } ?>
</h2>
<br />
<div class="clearfix"></div>
<div >
<?php if($role_name=="super_admin" || $role_name=="admin" || $role_name=="help_desk" || $role_name=="site_admin" || $role_name=="site_staff" || $role_name=="other" ) {?>
<div class="row">
<style>
canvas {
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
}
.filter-table-box{margin-top:0;}
.filter-field{display:inline-block;margin:4px 16px 4px 0px;}
.filter_site{margin-left:10px;}
</style>
<div class="col-md-12">
<div class="box box-primary">
<div class="box-header with-border">
<h3 class="box-title">Overview of Fault Reported</h3>
<div class="box-tools pull-right">
<button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
</div>
</div>
<div class="box-body">
<div class="filter-table-box">
<div class="filter-field">
<span>Site: &nbsp;</span>
<select class="site_overview filter_overview select2" name="site_overview[]" multiple="multiple">
<?php $site_count=0;?>
@if(!empty($sites))
@foreach($sites as $site)
<option value="{{ $site->id }}" selected>{{ $site->name }}</option>
<?php $site_count++;?>
@endforeach
@endif
</select>
</div>
<span id="location_overview" style="{{ $site_count==1?'':'display:none;' }}">
<div class="filter-field">
<span>Building: &nbsp;</span>
<select id="building_id_filter_overview" class="input-sm form-control filter_overview" disabled="disabled" style="display:inline-block;width:200px;"></select>
</div>
<div class="filter-field">
<span>Floor: &nbsp;</span>
<select id="floor_id_filter_overview" class="input-sm form-control filter_overview" disabled="disabled" style="display:inline-block;width:200px;"></select>
</div>
</span>
<div class="filter-field">
<span>Start Date: </span>
<input data-date-format="yyyy-mm-dd" value="{{ date('Y-01-01') }}" class="d-inline-block input-sm form-control filter_overview datepicker" type="text" id="start_date_filter_overview" style="max-width:200px;" autocomplete="off">
</div>
<div class="filter-field">
<span>End Date: </span>
<input data-date-format="yyyy-mm-dd" value="{{ date('Y-m-d') }}" class="d-inline-block input-sm form-control filter_overview datepicker" type="text" id="end_date_filter_overview" style="max-width:200px;" autocomplete="off">
</div>
</div>
<div class="clearfix"></div>
<br />
<div id="overview_none" class="text-center d-none"><h4>No fault reported at this moment</h4></div>
<div class="chart" id="overview" style="margin:0 auto;max-width:980px;">
<canvas id="canvas_overview"></canvas>
<div id="overview-legend"></div>
<br />
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="box box-primary">
<div class="box-header with-border">
<h3 class="box-title">Breakdown of Defects by Trade / Month</h3>
<div class="box-tools pull-right">
<button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
</div>
</div>
<div class="box-body">
<div class="filter-table-box">
<div class="filter-field">
<span>Site: &nbsp;</span>
<select id="site_id_filter" class="filter select2" name="site_defect[]" multiple="multiple">
@if(!empty($sites))
@foreach($sites as $site)
<option value="{{ $site->id }}" selected>{{ $site->name }}</option>
@endforeach
@endif
</select>
</div>
<span id="location_defect" style="{{ $site_count==1?'':'display:none;' }}">
<div class="filter-field">
<span>Building: &nbsp;</span>
<select id="building_id_filter" class="input-sm form-control filter" disabled="disabled" style="display:inline-block;width:200px;"></select>
</div>
<div class="filter-field">
<span>Floor: &nbsp;</span>
<select id="floor_id_filter" class="input-sm form-control filter" disabled="disabled" style="display:inline-block;width:200px;"></select>
<div class="clearfix"></div>
</div>
</span>
<div class="clearfix"></div>
<div class="filter-field">
<span>Year: &nbsp;</span>
<select id="year_filter" class="filter">
@for($year=$minYear;$year<=$maxYear;$year++)
<option value="{{ $year }}" <?php if(date('Y')==$year) {echo "selected";} ?>>{{ $year }}</option>
@endfor
</select>
</div>
<div class="filter-field">
<span>Month: &nbsp;</span>
<select id="month_filter" class="filter">
<option value="">- All months -</option>
<option value="1">January</option>
<option value="2">February</option>
<option value="3">March</option>
<option value="4">April</option>
<option value="5">May</option>
<option value="6">June</option>
<option value="7">July</option>
<option value="8">August</option>
<option value="9">September</option>
<option value="10">October</option>
<option value="11">November</option>
<option value="12">December</option>
</select>
</div>
</div>
<div class="clearfix"></div>
<br />
<div class="chart" id="chart1">
<canvas id="canvas" style="height:300px;"></canvas>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="box box-primary">
<div class="box-header with-border">
<h3 class="box-title">Percentage of Fault Response</h3>
<div class="box-tools pull-right">
<button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
</div>
</div>
<div class="box-body">
<div class="filter-table-box">
<div class="filter-field">
<span>Site: &nbsp;</span>
<select id="site_id_filter2" class="site_percentage filter2 select2" name="site_percentage[]" multiple="multiple">
@if(!empty($sites))
@foreach($sites as $site)
<option value="{{ $site->id }}" selected>{{ $site->name }}</option>
@endforeach
@endif
</select>
</div>
<span id="location_percentage" style="{{ $site_count==1?'':'display:none;' }}">
<div class="filter-field">
<span>Building: &nbsp;</span>
<select id="building_id_filter2" class="input-sm form-control filter2" disabled="disabled" style="display:inline-block;width:200px;"></select>
</div>
<div class="filter-field">
<span>Floor: &nbsp;</span>
<select id="floor_id_filter2" class="input-sm form-control filter2" disabled="disabled" style="display:inline-block;width:200px;"></select>
</div>
</span>
<div class="clearfix"></div>
<div class="filter-field">
<span>Year: &nbsp;</span>
<select id="year_filter2" class="filter2">
@for($year=$minYear;$year<=$maxYear;$year++)
<option value="{{ $year }}" <?php if(date('Y')==$year) {echo "selected";} ?>>{{ $year }}</option>
@endfor
</select>
</div>
<div class="filter-field">
<span>Month: &nbsp;</span>
<select id="month_filter2" class="filter2">
<option value="">- All months -</option>
<option value="1">January</option>
<option value="2">February</option>
<option value="3">March</option>
<option value="4">April</option>
<option value="5">May</option>
<option value="6">June</option>
<option value="7">July</option>
<option value="8">August</option>
<option value="9">September</option>
<option value="10">October</option>
<option value="11">November</option>
<option value="12">December</option>
</select>
</div>
</div>
<div class="clearfix"></div>
<br />
<div class="chart">
<canvas id="canvas2" style="height:350px;"></canvas>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="box box-primary">
<div class="box-header with-border">
<h3 class="box-title">Defect Status</h3>
<div class="box-tools pull-right">
<button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
</div>
</div>
<div class="box-body">
<div class="filter-table-box">
<div class="filter-field">
<span>Site: &nbsp;</span>
<select id="site_id_filter_status" class="filter_status select2" name="site_id_filter_status[]" multiple="multiple">
@if(!empty($sites))
@foreach($sites as $site)
<option value="{{ $site->id }}" selected>{{ $site->name }}</option>
@endforeach
@endif
</select>
</div>
<span id="location_status" style="{{ $site_count==1?'':'display:none;' }}">
<div class="filter-field">
<span>Building: &nbsp;</span>
<select id="building_id_filter_status" class="input-sm form-control filter_status" disabled="disabled" style="display:inline-block;width:200px;"></select>
</div>
<div class="filter-field">
<span>Floor: &nbsp;</span>
<select id="floor_id_filter_status" class="input-sm form-control filter_status" disabled="disabled" style="display:inline-block;width:200px;"></select>
</div>
</span>
<div class="clearfix"></div>
<div class="filter-field">
<span>Year: &nbsp;</span>
<select id="year_filter_status" class="filter_status">
@for($year=$minYear;$year<=$maxYear;$year++)
<option value="{{ $year }}" <?php if(date('Y')==$year) {echo "selected";} ?>>{{ $year }}</option>
@endfor
</select>
</div>
<div class="filter-field">
<span>Month: &nbsp;</span>
<select id="month_filter_status" class="filter_status">
<option value="">- All months -</option>
<option value="1">January</option>
<option value="2">February</option>
<option value="3">March</option>
<option value="4">April</option>
<option value="5">May</option>
<option value="6">June</option>
<option value="7">July</option>
<option value="8">August</option>
<option value="9">September</option>
<option value="10">October</option>
<option value="11">November</option>
<option value="12">December</option>
</select>
</div>
<div class="filter-field">
<span>Trade: &nbsp;</span>
<select id="trade_id_filter_status" class="filter_status">
@if(!empty($trades))
<option value="" >- All trades -</option>
@foreach($trades as $trade)
<option value="{{ $trade->id }}">{{ $trade->name }}</option>
@endforeach
@else
<option value="">- Select trades -</option>
@endif
</select>
</div>
</div>
<div class="clearfix"></div>
<br />
<div class="chart">
<canvas id="canvas_status" style="height:300px;"></canvas>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="box box-primary">
<div class="box-header with-border">
<h3 class="box-title">Fault By Floor</h3>
<div class="box-tools pull-right">
<button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
</div>
</div>
<div class="box-body">
<div class="filter-table-box">
<div class="filter-field">
<span>Site: &nbsp;</span>
<select id="site_id_filter_floor" class="filter_floor select2" name="site_id_filter_floor[]" multiple="multiple">
@if(!empty($sites))
@foreach($sites as $site)
<option value="{{ $site->id }}" selected>{{ $site->name }}</option>
@endforeach
@endif
</select>
</div>
<span id="location_floor" style="{{ $site_count==1?'':'display:none;' }}">
<div class="filter-field">
<span>Building: &nbsp;</span>
<select id="building_id_filter_floor" class="input-sm form-control filter_floor" disabled="disabled" style="display:inline-block;width:200px;"></select>
</div>
</span>
<div class="clearfix"></div>
<div class="filter-field">
<span>Year: &nbsp;</span>
<select id="year_filter_floor" class="filter_floor">
@for($year=$minYear;$year<=$maxYear;$year++)
<option value="{{ $year }}" <?php if(date('Y')==$year) {echo "selected";} ?>>{{ $year }}</option>
@endfor
</select>
</div>
<div class="filter-field">
<span>Month: &nbsp;</span>
<select id="month_filter_floor" class="filter_floor">
<option value="">- All months -</option>
<option value="1">January</option>
<option value="2">February</option>
<option value="3">March</option>
<option value="4">April</option>
<option value="5">May</option>
<option value="6">June</option>
<option value="7">July</option>
<option value="8">August</option>
<option value="9">September</option>
<option value="10">October</option>
<option value="11">November</option>
<option value="12">December</option>
</select>
</div>
</div>
<br />
<div class="chart">
<canvas id="canvas_floor" style="min-height:1000px;"></canvas>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="box box-primary">
<div class="box-header with-border">
<h3 class="box-title">Fault Breakdown</h3>
<div class="box-tools pull-right">
<button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
</div>
</div>
<div class="box-body">
<style>
.table td, .table th{white-space: normal;vertical-align:middle!important;border:1px solid #ccc!important;font-weight:normal;}
.table tr th{background-color:#f3f3f3;color:#333;font-weight:bold;font-size:11px;}
.table tr th{border-bottom:none!important;}
.dataTables_wrapper.no-footer .dataTables_scrollBody{border:none;}
table {
display: block;
overflow-x: auto;
white-space: nowrap;
}
.table > thead > tr > th, .table > thead > tr > td, .table > tbody > tr > th, .table > tbody > tr > td, .table > tfoot > tr > th, .table > tfoot > tr > td{padding:8px 8px;}
</style>
<div class="filter-table-box">
<div class="filter-field">
<span>Site: &nbsp;</span>
<select id="site_id_filter_breakdown" class="filter_breakdown select2" name="site_id_filter_breakdown[]" multiple="multiple">
@if(!empty($sites))
@foreach($sites as $site)
<option value="{{ $site->id }}" selected>{{ $site->name }}</option>
@endforeach
@endif
</select>
</div>
<span id="location_breakdown" style="{{ $site_count==1?'':'display:none;' }}">
<div class="filter-field">
<span>Building: &nbsp;</span>
<select id="building_id_filter_breakdown" class="input-sm form-control filter_breakdown" disabled="disabled" style="display:inline-block;width:200px;"></select>
</div>
<div class="filter-field">
<span>Floor: &nbsp;</span>
<select id="floor_id_filter_breakdown" class="input-sm form-control filter_breakdown" disabled="disabled" style="display:inline-block;width:200px;"></select>
</div>
</span>
<div class="clearfix"></div>
<div class="filter-field">
<span>Year: &nbsp;</span>
<select id="year_filter_breakdown" class="filter_breakdown">
@for($year=$minYear;$year<=$maxYear;$year++)
<option value="{{ $year }}" <?php if(date('Y')==$year) {echo "selected";} ?>>{{ $year }}</option>
@endfor
</select>
</div>
<div class="filter-field">
<span>Month: &nbsp;</span>
<select id="month_filter_breakdown" class="filter_breakdown">
<option value="">- All months -</option>
<option value="1">January</option>
<option value="2">February</option>
<option value="3">March</option>
<option value="4">April</option>
<option value="5">May</option>
<option value="6">June</option>
<option value="7">July</option>
<option value="8">August</option>
<option value="9">September</option>
<option value="10">October</option>
<option value="11">November</option>
<option value="12">December</option>
</select>
</div>
</div>
<div class="clearfix"></div>
<br />
<?php
$canvas_breakdown_height=$faultCategories->count()*20;
?>
<div class="chart">
<canvas id="canvas_breakdown" style="height:{{$canvas_breakdown_height}}px;"></canvas>
</div>
<br />
</div>
</div>
</div>
<script src="{{ asset('js/chart.js') }}"></script>
<script src="{{ asset('js/chartjs-plugin-datalabels.js') }}"></script>
<script src="{{ asset('js/chartjs-plugin-piechart-outlabels.js') }}"></script>
<style>
[class$="-legend"] {
list-style: none;
cursor: pointer;
padding-left: 0;
margin:0 auto;
text-align:center;
}
[class$="-legend"] li {
display: inline-block;
padding: 0 5px;
}
[class$="-legend"] li.hidden {
text-decoration: line-through;
}
[class$="-legend"] li span {
border-radius: 5px;
display: inline-block;
height: 10px;
margin-right: 10px;
width: 10px;
}
.multiselect-all{padding-left:0px!important;padding-top:8px!important;}
.multiselect-group{display: none;}
.multiselect-container>li>a>label{line-height:16px;padding-top:0;padding-bottom:0px}
</style>
<script>
$('.datepicker').datepicker({autoclose: true})
$('.select2').multiselect({
filterBehavior: 'text',
includeSelectAllOption: true,
enableClickableOptGroups: true,
enableCollapsibleOptGroups: true
});
$('#trades_select').multiselect({
enableFiltering: true,
filterBehavior: 'text'
});
$('.daterange').daterangepicker({
opens: 'right',
showDropdowns: true,
locale: { cancelLabel: 'Clear' }
}, function(start, end, label) {
$('#start_date').val(start.format('YYYY-MM-DD'));
$('#end_date').val(end.format('YYYY-MM-DD'));
});
$('.daterange').on('cancel.daterangepicker', function(ev, picker) {
$(this).val('');
$('#start_date').val('');
$('#end_date').val('');
var start_date = $('#start_date').val();
var end_date = $('#end_date').val();
$.ajax({
type: 'GET',
url: '{{ url("get_fault_overview") }}',
data: {
"start_date": start_date,
"end_date": end_date
},
error: function (msg) {
},
dataType: "json",
success: function (chartData, textStatus, jqXHR){
if(chartData.labels.length == 1){
$('#overview_none').removeClass("d-none")
} else {
$('#overview_none').addClass("d-none")
}
myPie.data = chartData;
myPie.update();
}
});
});
$('.daterange').val('');
var MONTHS = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
window.onload = function() {
var sites=$('.site_overview').val();
var building_id= $('#building_id_filter_overview').val();
var floor_id= $('#floor_id_filter_overview').val();
var year= $('#year_filter_overview').val();
var month= $('#month_filter_overview').val();
var start_date= $('#start_date_filter_overview').val();
var end_date= $('#end_date_filter_overview').val();
$.ajax({
type: 'GET',
url: '{{ url("get_fault_overview") }}',
data: {
"sites": sites,
"building_id": building_id,
"floor_id": floor_id,
"year": year,
"month": month,
"start_date": start_date,
"end_date": end_date,
},
error: function (msg) {
},
dataType: "json",
success: function (chartData, textStatus, jqXHR){
if (chartData.labels.length == 1) {
$('#overview_none').removeClass("d-none")
} else {
$('#overview_none').addClass("d-none")
var ctx0 = document.getElementById('canvas_overview').getContext('2d');
var options = {
layout: {
padding: {
left: 120,
right: 120,
top: 100,
bottom: 100
}
},
responsive: true,
legendCallback: function (chart) {
var text = [];
text.push('<ul class="chart1-legend">');
var data = chart.data;
var datasets = data.datasets;
var labels = data.labels;
var trade = data.trade;
if (datasets.length) {
for (var i = 0; i < datasets[0].data.length; ++i) {
text.push('<li><span style="background-color:' + datasets[0].backgroundColor[i] + '"></span>');
if (labels[i]) {
//text.push(labels[i] + ' (' + datasets[0].data[i] + '%)');
text.push(labels[i]);
}
text.push('</li>');
}
}
text.push('</ul>');
return text.join('');
},
legend: {
position: 'bottom',
labels: {
fontColor: "#000000",
fontSize: 12,
padding: 15,
boxWidth: 20,
},
display: false,
},
tooltips: {
callbacks: {
label: function(tooltipItem, data) {
//return data['labels'][tooltipItem['index']] + ': ' + data['datasets'][0]['data'][tooltipItem['index']] + '% ('+ data['datasets'][0]['number'][tooltipItem['index']]+')';
return data['labels'][tooltipItem['index']];
}
}
},
plugins: {
outlabels: {
//text: '%l %p',
text: '%l',
color: 'white',
stretch: 10,
borderRadius: 4,
borderWidth: 0,
display: true,
font: {
resizable: false,
minSize: 10,
maxSize: 12
}
},
datalabels: {
color: '#ffffff',
align: 'end',
anchor: 'end',
font: {
size: 11,
},
offset: 0,
formatter: (value, ctx0) => {
let datasets = ctx0.chart.data.datasets;
let percentage = value + '%';
if(value==0){
return '';
} else {
//return percentage;
return '';
}
},
}
},
hover: {
onHover: function(e, el) {
$("canvas").css("cursor", el[0] ? "pointer" : "default");
}
}
};
window.myPie = new Chart(ctx0, {
type: 'pie',
data: chartData,
options: options
});
var legend = myPie.generateLegend();
document.getElementById("overview-legend").innerHTML = legend;
var canvas = document.getElementById('canvas_overview');
canvas.onclick = function(evt) {
var activePoint = myPie.getElementAtEvent(evt)[0];
var selectedIndex = activePoint._index;
if(activePoint !== undefined){
var data = activePoint._chart.data;
var trade = encodeURIComponent(data.trade[activePoint._index]);
start_date=$('#start_date').val();
end_date=$('#end_date').val();
url="{{ url('/faults?trade=') }}"+trade;
if(start_date != undefined){
url = url+"&start_date="+start_date+"&end_date="+end_date;
}
site_id_filter=$('.site_overview').val();
building_id_filter=$('#building_id_filter_overview').val();
floor_id_filter=$('#floor_id_filter_overview').val();
month=$('#month_filter_overview').val();
year=$('#year_filter_overview').val();
selectedMonthName="";
if(month!=""){
var month_list = [ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" ];
var selectedMonthName = month_list[month-1];
}
if(site_id_filter.length>0){
if(site_id_filter != null && site_id_filter != ""){
url = url + "&site_id="+site_id_filter;
}
if(building_id_filter != null && building_id_filter != ""){
url = url + "&building_id="+building_id_filter;
}
if(floor_id_filter != null && floor_id_filter != ""){
url = url + "&floor_id="+floor_id_filter;
}
if(month != null){
url = url + "&month="+selectedMonthName;
}
if(year != null){
url = url + "&year="+year;
}
window.location.href = url;
}
}
};
}
}
});
var year= $('#year_filter').val();
var month= $('#month_filter').val();
var sites=$('#site_id_filter').val();
var building_id= $('#building_id_filter').val();
var floor_id= $('#floor_id_filter').val();
$.ajax({
type: 'GET',
url: '{{ url("get_num_fault_stat") }}',
data: {
"year": year,
"month": month,
"sites": sites,
"building_id": building_id,
"floor_id": floor_id
},
error: function (msg) {
},
dataType: "json",
success: function (chartData, textStatus, jqXHR){
var ctx = document.getElementById('canvas').getContext('2d');
window.myBar = new Chart(ctx, {
type: 'bar',
data: chartData,
options: {
responsive: true,
legend: {
position: 'bottom',
labels: {
fontSize: 11,
padding: 20,
boxWidth: 20,
},
},
title: {
display: false,
text: 'Total Number of Fault by System'
},
scales: {
xAxes: [{
barPercentage: 1,
categoryPercentage: 0.9
}],
yAxes: [{
display: true,
ticks: {
beginAtZero: true,
callback: function(value) {if (value % 1 === 0) {return value;}}
}
}]
},
plugins: {
datalabels: {
color: '#222222',
align: 'end',
anchor: 'end',
padding: 0,
offset: 0,
font: {
size: 12,
},
formatter: (value, ctx) => {
let datasets = ctx.chart.data.datasets;
let percentage = value;
if(value==0){
return '';
} else {
return percentage;
}
}
}
},
layout: {
padding: {
top: 32,
}
},
hover: {
onHover: function(e, el) {
$("canvas").css("cursor", el[0] ? "pointer" : "default");
}
}
}
});
var canvas = document.getElementById('canvas');
canvas.onclick = function(evt) {
var activePoint = myBar.getElementAtEvent(evt)[0];
if(activePoint !== undefined){
var data = activePoint._chart.data;
var xValue = data.labels[activePoint._index];
var datasetIndex = activePoint._datasetIndex;
var label = encodeURIComponent(data.datasets[datasetIndex].label);
var value = data.datasets[datasetIndex].data[activePoint._index];
site_id_filter=$('#site_id_filter').val();
building_id_filter=$('#building_id_filter').val();
floor_id_filter=$('#floor_id_filter').val();
year=$('#year_filter').val();
month=xValue;
url="{{ url('/faults?trade=') }}"+label;
if(site_id_filter.length>0){
if(site_id_filter != null && site_id_filter != ""){
url = url + "&site_id="+site_id_filter;
}
if(building_id_filter != null && building_id_filter != ""){
url = url + "&building_id="+building_id_filter;
}
if(floor_id_filter != null && floor_id_filter != ""){
url = url + "&floor_id="+floor_id_filter;
}
if(month != null){
url = url + "&month="+month;
}
if(year != null){
url = url + "&year="+year;
}
window.location.href = url;
}
}
};
}
});
var year= $('#year_filter_status').val();
var month= $('#month_filter_status').val();
var sites= $('#site_id_filter_status').val();
var building_id= $('#building_id_filter_status').val();
var floor_id= $('#floor_id_filter_status').val();
var trade_id= $('#trade_id_filter_status').val();
$.ajax({
type: 'GET',
url: '{{ url("get_fault_status_stat") }}',
data: {
"year": year,
"month": month,
"sites": sites,
"building_id": building_id,
"floor_id": floor_id,
"trade_id": trade_id
},
error: function (msg) {
},
dataType: "json",
success: function (chartData, textStatus, jqXHR){
var ctxStatus = document.getElementById('canvas_status').getContext('2d');
window.myBarStatus = new Chart(ctxStatus, {
type: 'bar',
data: chartData,
options: {
responsive: true,
legend: {
position: 'bottom',
},
title: {
display: false,
text: 'Fault Status'
},
scales: {
yAxes: [{
display: true,
ticks: {
beginAtZero: true,
callback: function(value) {if (value % 1 === 0) {return value;}}
}
}]
},
plugins: {
datalabels: {
color: '#222222',
align: 'end',
anchor: 'end',
padding: 3,
offset: 0,
font: {
size: 12,
},
formatter: (value, ctxStatus) => {
let datasets = ctxStatus.chart.data.datasets;
if(value==0){
return '';
} else {
return value;
}
}
}
},
layout: {
padding: {
top: 32
}
},
hover: {
onHover: function(e, el) {
$("canvas").css("cursor", el[0] ? "pointer" : "default");
}
}
}
});
var canvas = document.getElementById('canvas_status');
canvas.onclick = function(evt) {
var activePoint = myBarStatus.getElementAtEvent(evt)[0];
if(activePoint !== undefined){
var data = activePoint._chart.data;
var xValue = data.labels[activePoint._index];
var datasetIndex = activePoint._datasetIndex;
var label = data.datasets[datasetIndex].label;
var value = data.datasets[datasetIndex].data[activePoint._index];
site_id_filter=$('#site_id_filter_status').val();
building_id_filter=$('#building_id_filter_status').val();
floor_id_filter=$('#floor_id_filter_status').val();
year=$('#year_filter_status').val();
month=xValue;
url="{{ url('/faults?status=') }}"+label;
if(site_id_filter.length>0){
if(site_id_filter != null && site_id_filter != ""){
url = url + "&site_id="+site_id_filter;
}
if(building_id_filter != null && building_id_filter != ""){
url = url + "&building_id="+building_id_filter;
}
if(floor_id_filter != null && floor_id_filter != ""){
url = url + "&floor_id="+floor_id_filter;
}
if(month != null){
url = url + "&month="+month;
}
if(year != null){
url = url + "&year="+year;
}
window.location.href = url;
}
}
};
}
});
var sites= $('#site_id_filter2').val();
var building_id= $('#building_id_filter2').val();
var floor_id= $('#floor_id_filter2').val();
var year_filter2= $('#year_filter2').val();
var month_filter2= $('#month_filter2').val();
$.ajax({
type: 'GET',
url: '{{ url("get_fault_responded_stat") }}',
data: {
"sites": sites,
"building_id": building_id,
"floor_id": floor_id,
"year": year_filter2,
"month": month_filter2
},
error: function (msg) {
},
dataType: "json",
success: function (chartData, textStatus, jqXHR){
var ctx2 = document.getElementById('canvas2').getContext('2d');
window.myBar2 = new Chart(ctx2, {
type: 'bar',
data: chartData,
options: {
title: {
display: false,
text: 'Percentage of Fault Responded within 1 Hour'
},
tooltips: {
mode: 'index',
intersect: false,
callbacks: {
label: function(tooltipItem, data) {
var dataset = data.datasets[tooltipItem.datasetIndex];
var currentValue = dataset.data[tooltipItem.index];
var percentage = currentValue;
return percentage + "% ("+dataset.number[tooltipItem.index]+")";
}
}
},
responsive: true,
scales: {
xAxes: [{
stacked: true,
barPercentage: 0.8
}],
yAxes: [{
stacked: true,
scaleLabel: {
display: true,
labelString: "Percentage"
},
ticks: {
beginAtZero: true
}
}]
},
plugins: {
datalabels: {
color: 'white',
display: function(context) {
return context.dataset.data[context.dataIndex] > 0;
},
formatter: (value, ctx2) => {
let datasets = ctx2.chart.data.datasets;
let percentage = value + '%';
if(value==0){
return '';
} else {
return percentage;
}
}
}
},
hover: {
onHover: function(e, el) {
$("canvas").css("cursor", el[0] ? "pointer" : "default");
}
}
}
});
var canvas = document.getElementById('canvas2');
canvas.onclick = function(evt) {
var activePoint = myBar2.getElementAtEvent(evt)[0];
if(activePoint !== undefined){
var data = activePoint._chart.data;
var xValue = encodeURIComponent(data.labels[activePoint._index]);
var datasetIndex = activePoint._datasetIndex;
var label = data.datasets[datasetIndex].label;
var value = data.datasets[datasetIndex].data[activePoint._index];
site_id_filter=$('#site_id_filter2').val();
building_id_filter=$('#building_id_filter2').val();
floor_id_filter=$('#floor_id_filter2').val();
month=$('#month_filter2').val();
year=$('#year_filter2').val();
selectedMonthName="";
if(month!=""){
var month_list = [ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" ];
var selectedMonthName = month_list[month-1];
}
url="{{ url('/faults?trade=') }}"+xValue;
if(site_id_filter.length>0){
if(site_id_filter != null && site_id_filter != ""){
url = url + "&site_id="+site_id_filter;
}
if(building_id_filter != null && building_id_filter != ""){
url = url + "&building_id="+building_id_filter;
}
if(floor_id_filter != null && floor_id_filter != ""){
url = url + "&floor_id="+floor_id_filter;
}
if(label == "Respondend within 1 hour"){
url = url + "&response_time=quick";
} else {
url = url + "&response_time=fail";
}
if(month != null){
url = url + "&month="+selectedMonthName;
}
if(year != null){
url = url + "&year="+year;
}
window.location.href = url;
}
}
};
}
});
var sites= $('#site_id_filter_floor').val();
var building_id= $('#building_id_filter_floor').val();
var year= $('#year_filter_floor').val();
var month= $('#month_filter_floor').val();
$.ajax({
type: 'GET',
url: '{{ url("get_fault_by_floor") }}',
data: {
"sites": sites,
"building_id": building_id,
"year": year,
"month": month
},
error: function (msg) {
},
dataType: "json",
success: function (chartData, textStatus, jqXHR){
var ctx3 = document.getElementById('canvas_floor').getContext('2d');
window.myBarFloor = new Chart(ctx3, {
type: 'horizontalBar',
data: chartData,
options: {
elements: {
rectangle: {
borderWidth: 1,
}
},
scales: {
yAxes: [{
barPercentage: 0.8,
ticks: {
fontSize: 11
}
}]
},
plugins: {
datalabels: {
color: '#222222',
align: 'end',
anchor: 'end',
padding: 3,
offset: 0,
font: {
size: 12,
},
display: function(context) {
return context.dataset.data[context.dataIndex] > 0;
},
formatter: (value, ctx3) => {
let datasets = ctx3.chart.data.datasets;
if(value==0){
return '';
} else {
return value;
}
}
}
},
layout: {
padding: {
right: 32
}
},
legend: {
display: false
},
responsive: true,
maintainAspectRatio: false,
hover: {
onHover: function(e, el) {
$("#canvas_floor").css("cursor", el[0] ? "pointer" : "default");
}
}
}
});
var canvas = document.getElementById('canvas_floor');
canvas.onclick = function(evt) {
var activePoint = myBarFloor.getElementAtEvent(evt)[0];
if(activePoint !== undefined){
var data = activePoint._chart.data;
site_id=data.locations[activePoint._index]['site_id'];
building_id=data.locations[activePoint._index]['building_id'];
floor_id=data.locations[activePoint._index]['floor_id'];
url="{{ url('/faults?site_id=') }}"+site_id+ "&building_id="+building_id+ "&floor_id="+floor_id;
var year= $('#year_filter_floor').val();
var month= $('#month_filter_floor').val();
if(month != null){
url = url + "&month="+month;
}
if(year != null){
url = url + "&year="+year;
}
window.location.href = url;
}
};
}
});
var year= $('#year_filter_breakdown').val();
var month= $('#month_filter_breakdown').val();
var sites= $('#site_id_filter_breakdown').val();
var building_id= $('#building_id_filter_breakdown').val();
$.ajax({
type: 'GET',
url: '{{ url("get_fault_breakdown") }}',
data: {
"sites": sites,
"building_id": building_id,
"year": year,
"month": month,
},
error: function (msg) {
},
dataType: "json",
success: function (chartData, textStatus, jqXHR){
var ctx4 = document.getElementById('canvas_breakdown').getContext('2d');
window.myBarBreakdown = new Chart(ctx4, {
type: 'horizontalBar',
data: chartData,
options: {
elements: {
rectangle: {
borderWidth: 1,
}
},
scales: {
yAxes: [{
barPercentage: 0.8,
ticks: {
fontSize: 12
}
}]
},
plugins: {
datalabels: {
color: '#222222',
align: 'end',
anchor: 'end',
padding: 3,
offset: 0,
font: {
size: 12,
},
display: function(context) {
return context.dataset.data[context.dataIndex] > 0;
},
formatter: (value, ctx4) => {
let datasets = ctx4.chart.data.datasets;
if(value==0){
return '';
} else {
return value;
}
}
}
},
layout: {
padding: {
right: 32
}
},
legend: {
display: false
},
responsive: true,
maintainAspectRatio: false,
hover: {
onHover: function(e, el) {
$("#canvas_breakdown").css("cursor", el[0] ? "pointer" : "default");
}
}
}
});
var canvas = document.getElementById('canvas_breakdown');
canvas.onclick = function(evt) {
var activePoint = myBarBreakdown.getElementAtEvent(evt)[0];
if(activePoint !== undefined){
var data = activePoint._chart.data;
fault_category_id=data.fault_category_id[activePoint._index];
month=data.month[activePoint._index];
site_id_filter=$('#site_id_filter_breakdown').val();
building_id_filter=$('#building_id_filter_breakdown').val();
floor_id_filter=$('#floor_id_filter_breakdown').val();
year=$('#year_filter_breakdown').val();
url="{{ url('/faults?fault_category_id=') }}"+fault_category_id;
if(site_id_filter.length>0){
if(site_id_filter != null && site_id_filter != ""){
url = url + "&site_id="+site_id_filter;
}
if(building_id_filter != null && building_id_filter != ""){
url = url + "&building_id="+building_id_filter;
}
if(floor_id_filter != null && floor_id_filter != ""){
url = url + "&floor_id="+floor_id_filter;
}
if(month != null){
url = url + "&month="+month;
}
if(year != null){
url = url + "&year="+year;
}
window.location.href = url;
}
}
};
}
});
};
<?php if($site_count==1) { ?>
var sites = $('.site_overview').val();
var site_id = sites[0];
if(site_id!=""){
$('#building_id_filter_overview').removeAttr('disabled');
$('#building_id_filter').removeAttr('disabled');
$('#building_id_filter2').removeAttr('disabled');
$('#building_id_filter_status').removeAttr('disabled');
$('#building_id_filter_floor').removeAttr('disabled');
$('#building_id_filter_breakdown').removeAttr('disabled');
var url = "{{ url('get_buildings') }}/"+site_id;
$.getJSON(url, function (data) {
$('#building_id_filter_overview').append('<option value="">- All buildings -</option>');
$('#building_id_filter').append('<option value="">- All buildings -</option>');
$('#building_id_filter2').append('<option value="">- All buildings -</option>');
$('#building_id_filter_status').append('<option value="">- All buildings -</option>');
$('#building_id_filter_floor').append('<option value="">- All buildings -</option>');
$('#building_id_filter_breakdown').append('<option value="">- All buildings -</option>');
$.each(data, function (index, value) {
$('#building_id_filter_overview').append('<option value="' + value.id + '">' + value.name + '</option>');
$('#building_id_filter').append('<option value="' + value.id + '">' + value.name + '</option>');
$('#building_id_filter2').append('<option value="' + value.id + '">' + value.name + '</option>');
$('#building_id_filter_status').append('<option value="' + value.id + '">' + value.name + '</option>');
$('#building_id_filter_floor').append('<option value="' + value.id + '">' + value.name + '</option>');
$('#building_id_filter_breakdown').append('<option value="' + value.id + '">' + value.name + '</option>');
});
});
}
<?php }?>
$('#daterange_filter').change(function() {
var daterange = $(this).val();
if(daterange!=""){
var start_date = $('#start_date').val();
var end_date = $('#end_date').val();
$.ajax({
type: 'GET',
url: '{{ url("get_fault_overview") }}',
data: {
"start_date": start_date,
"end_date": end_date
},
error: function (msg) {
},
dataType: "json",
success: function (chartData, textStatus, jqXHR){
myPie.data = chartData;
myPie.update();
}
});
}
});
$('#site_id_filter_overview').change(function() {
var site_id = $(this).val();
$('#building_id_filter_overview').html('');
$('#floor_id_filter_overview').html('');
$('#building_id_filter_overview').val('');
$('#floor_id_filter_overview').val('');
if(site_id!=""){
$('#building_id_filter_overview').removeAttr('disabled');
$('#floor_id_filter_overview').attr('disabled','disabled');
var url = "{{ url('get_buildings') }}/"+site_id;
$.getJSON(url, function (data) {
$('#building_id_filter_overview').append('<option value="">- All buildings -</option>');
$.each(data, function (index, value) {
$('#building_id_filter_overview').append('<option value="' + value.id + '">' + value.name + '</option>');
});
});
} else {
$('#building_id_filter_overview').attr('disabled','disabled');
$('#floor_id_filter_overview').attr('disabled','disabled');
}
});
$('#building_id_filter_overview').change(function() {
var sites=$('.site_overview').val();
var site_id = sites[0];
var building_id= $('#building_id_filter_overview').val();
var floor_id= $('#floor_id_filter_overview').val();
$('#floor_id_filter_overview').html('');
$('#floor_id_filter_overview').val('');
if(site_id!=""){
$('#floor_id_filter_overview').removeAttr('disabled');
var url = "{{ url('get_floors') }}/"+building_id;
$.getJSON(url, function (data) {
$('#floor_id_filter_overview').append('<option value="">- All floors -</option>');
$.each(data, function (index, value) {
$('#floor_id_filter_overview').append('<option value="' + value.id + '">' + value.name + '</option>');
});
});
} else {
$('#floor_id_filter_overview').attr('disabled','disabled');
}
$.ajax({
type: 'GET',
url: '{{ url("get_fault_overview") }}',
data: {
"sites": sites,
"building_id": building_id,
"floor_id": floor_id
},
error: function (msg) {
},
dataType: "json",
success: function (chartData, textStatus, jqXHR){
if(chartData.labels.length == 1){
$('#overview_none').removeClass("d-none")
} else {
$('#overview_none').addClass("d-none")
}
myPie.data = chartData;
myPie.update();
var legend = myPie.generateLegend();
document.getElementById("overview-legend").innerHTML = legend;
}
});
});
$('#floor_id_filter_overview').change(function() {
var sites=$('.site_overview').val();
var site_id = sites[0];
var building_id= $('#building_id_filter_overview').val();
var floor_id= $('#floor_id_filter_overview').val();
$.ajax({
type: 'GET',
url: '{{ url("get_fault_overview") }}',
data: {
"sites": sites,
"building_id": building_id,
"floor_id": floor_id
},
error: function (msg) {
},
dataType: "json",
success: function (chartData, textStatus, jqXHR){
if(chartData.labels.length == 1){
$('#overview_none').removeClass("d-none")
} else {
$('#overview_none').addClass("d-none")
}
myPie.data = chartData;
myPie.update();
var legend = myPie.generateLegend();
document.getElementById("overview-legend").innerHTML = legend;
}
});
});
$('.site_overview').change(function() {
var sites=$(this).val();
var building_id= $('#building_id_filter_overview').val();
var floor_id= $('#floor_id_filter_overview').val();
$('#location_overview').hide();
$('#building_id_filter_overview').attr('disabled','disabled');
$('#floor_id_filter_overview').attr('disabled','disabled');
$('#building_id_filter_overview').html('');
$('#floor_id_filter_overview').html('');
$('#building_id_filter_overview').val('');
$('#floor_id_filter_overview').val('');
if(sites.length>1){
$.ajax({
type: 'GET',
url: '{{ url("get_fault_overview") }}',
data: {
"sites": sites
},
error: function (msg) {
},
dataType: "json",
success: function (chartData, textStatus, jqXHR){
if(chartData.labels.length == 1){
$('#overview_none').removeClass("d-none")
} else {
$('#overview_none').addClass("d-none")
}
myPie.data = chartData;
myPie.update();
var legend = myPie.generateLegend();
document.getElementById("overview-legend").innerHTML = legend;
}
});
} else {
if(sites.length==1){
$('#location_overview').show();
}
var site_id = sites[0];
$('#building_id_filter_overview').html('');
$('#floor_id_filter_overview').html('');
$('#building_id_filter_overview').val('');
$('#floor_id_filter_overview').val('');
if(site_id!=""){
$('#building_id_filter_overview').removeAttr('disabled');
$('#floor_id_filter_overview').attr('disabled','disabled');
var url = "{{ url('get_buildings') }}/"+site_id;
$.getJSON(url, function (data) {
$('#building_id_filter_overview').append('<option value="">- All buildings -</option>');
$.each(data, function (index, value) {
$('#building_id_filter_overview').append('<option value="' + value.id + '">' + value.name + '</option>');
});
});
} else {
$('#building_id_filter_overview').attr('disabled','disabled');
$('#floor_id_filter_overview').attr('disabled','disabled');
}
}
});
$('.filter_overview').change(function() {
var sites= $('.site_overview').val();
var building_id= $('#building_id_filter_overview').val();
var floor_id= $('#floor_id_filter_overview').val();
var year= $('#year_filter_overview').val();
var month= $('#month_filter_overview').val();
var start_date= $('#start_date_filter_overview').val();
var end_date= $('#end_date_filter_overview').val();
$.ajax({
type: 'GET',
url: '{{ url("get_fault_overview") }}',
data: {
"sites": sites,
"building_id": building_id,
"floor_id": floor_id,
"year": year,
"month": month,
"start_date": start_date,
"end_date": end_date,
},
error: function (msg) {
},
dataType: "json",
success: function (chartData, textStatus, jqXHR){
if(chartData.labels.length == 1){
$('#overview_none').removeClass("d-none")
} else {
$('#overview_none').addClass("d-none")
}
myPie.data = chartData;
myPie.update();
var legend = myPie.generateLegend();
document.getElementById("overview-legend").innerHTML = legend;
}
});
});
$('#site_id_filter').change(function() {
var sites = $(this).val();
$('#building_id_filter').html('');
$('#floor_id_filter').html('');
$('#building_id_filter').val('');
$('#floor_id_filter').val('');
if(sites.length==1){
$('#location_defect').show();
var site_id = sites[0];
if(site_id!=""){
$('#building_id_filter').removeAttr('disabled');
$('#floor_id_filter').attr('disabled','disabled');
var url = "{{ url('get_buildings') }}/"+site_id;
$.getJSON(url, function (data) {
$('#building_id_filter').append('<option value="">- All buildings -</option>');
$.each(data, function (index, value) {
$('#building_id_filter').append('<option value="' + value.id + '">' + value.name + '</option>');
});
});
} else {
$('#building_id_filter').attr('disabled','disabled');
$('#floor_id_filter').attr('disabled','disabled');
}
} else {
$('#location_defect').hide();
}
});
$('#building_id_filter').change(function() {
var building_id = $(this).val();
$('#floor_id_filter').html('');
$('#floor_id_filter').val('');
if(building_id!=""){
$('#floor_id_filter').removeAttr('disabled');
var url = "{{ url('get_floors') }}/"+building_id;
$.getJSON(url, function (data) {
$('#floor_id_filter').append('<option value="">- All floors -</option>');
$.each(data, function (index, value) {
$('#floor_id_filter').append('<option value="' + value.id + '">' + value.name + '</option>');
});
});
} else {
$('#floor_id_filter').attr('disabled','disabled');
}
});
$('.filter').change(function() {
var year= $('#year_filter').val();
var month= $('#month_filter').val();
var sites= $('#site_id_filter').val();
var building_id= $('#building_id_filter').val();
var floor_id= $('#floor_id_filter').val();
$.ajax({
type: 'GET',
url: '{{ url("get_num_fault_stat") }}',
data: {
"year": year,
"month": month,
"sites": sites,
"building_id": building_id,
"floor_id": floor_id
},
error: function (msg) {
},
dataType: "json",
success: function (chartData, textStatus, jqXHR){
myBar.data = chartData;
myBar.update();
}
});
});
$('#site_id_filter2').change(function() {
var sites = $(this).val();
$('#building_id_filter2').html('');
$('#floor_id_filter2').html('');
$('#building_id_filter2').val('');
$('#floor_id_filter2').val('');
if(sites.length==1){
$('#location_percentage').show();
var site_id = sites[0];
if(site_id!=""){
$('#building_id_filter2').removeAttr('disabled');
$('#floor_id_filter2').attr('disabled','disabled');
var url = "{{ url('get_buildings') }}/"+sites;
$.getJSON(url, function (data) {
$('#building_id_filter2').append('<option value="">- All buildings -</option>');
$.each(data, function (index, value) {
$('#building_id_filter2').append('<option value="' + value.id + '">' + value.name + '</option>');
});
});
} else {
$('#building_id_filter2').attr('disabled','disabled');
$('#floor_id_filter2').attr('disabled','disabled');
}
} else {
$('#location_percentage').hide();
}
});
$('#building_id_filter2').change(function() {
var building_id = $(this).val();
$('#floor_id_filter2').html('');
$('#floor_id_filter2').val('');
if(building_id!=""){
$('#floor_id_filter2').removeAttr('disabled');
var url = "{{ url('get_floors') }}/"+building_id;
$.getJSON(url, function (data) {
$('#floor_id_filter2').append('<option value="">- All floors -</option>');
$.each(data, function (index, value) {
$('#floor_id_filter2').append('<option value="' + value.id + '">' + value.name + '</option>');
});
});
} else {
$('#floor_id_filter2').attr('disabled','disabled');
}
});
$('.filter2').change(function() {
var sites= $('#site_id_filter2').val();
var building_id= $('#building_id_filter2').val();
var floor_id= $('#floor_id_filter2').val();
var year_filter2= $('#year_filter2').val();
var month_filter2= $('#month_filter2').val();
$.ajax({
type: 'GET',
url: '{{ url("get_fault_responded_stat") }}',
data: {
"sites": sites,
"building_id": building_id,
"floor_id": floor_id,
"year": year_filter2,
"month": month_filter2
},
error: function (msg) {
},
dataType: "json",
success: function (chartData, textStatus, jqXHR){
myBar2.data = chartData;
myBar2.update();
}
});
});
$('#site_id_filter_status').change(function() {
var sites = $(this).val();
$('#building_id_filter_status').html('');
$('#floor_id_filter_status').html('');
$('#building_id_filter_status').val('');
$('#floor_id_filter_status').val('');
if(sites.length==1){
$('#location_status').show();
var site_id = sites[0];
if(site_id!=""){
$('#building_id_filter_status').removeAttr('disabled');
$('#floor_id_filter_status').attr('disabled','disabled');
var url = "{{ url('get_buildings') }}/"+site_id;
$.getJSON(url, function (data) {
$('#building_id_filter_status').append('<option value="">- All buildings -</option>');
$.each(data, function (index, value) {
$('#building_id_filter_status').append('<option value="' + value.id + '">' + value.name + '</option>');
});
});
} else {
$('#building_id_filter_status').attr('disabled','disabled');
$('#floor_id_filter_status').attr('disabled','disabled');
}
} else {
$('#location_status').hide();
}
});
$('#building_id_filter_status').change(function() {
var site_id = $(this).val();
$('#floor_id_filter_status').html('');
$('#floor_id_filter_status').val('');
if(site_id!=""){
$('#floor_id_filter_status').removeAttr('disabled');
var url = "{{ url('get_floors') }}/"+site_id;
$.getJSON(url, function (data) {
$('#floor_id_filter_status').append('<option value="">- All floors -</option>');
$.each(data, function (index, value) {
$('#floor_id_filter_status').append('<option value="' + value.id + '">' + value.name + '</option>');
});
});
} else {
$('#floor_id_filter_status').attr('disabled','disabled');
}
});
$('.filter_status').change(function() {
var year= $('#year_filter_status').val();
var month= $('#month_filter_status').val();
var sites= $('#site_id_filter_status').val();
var building_id= $('#building_id_filter_status').val();
var floor_id= $('#floor_id_filter_status').val();
var trade_id= $('#trade_id_filter_status').val();
$.ajax({
type: 'GET',
url: '{{ url("get_fault_status_stat") }}',
data: {
"year": year,
"month": month,
"sites": sites,
"building_id": building_id,
"floor_id": floor_id,
"trade_id": trade_id
},
error: function (msg) {
},
dataType: "json",
success: function (chartData, textStatus, jqXHR){
myBarStatus.data = chartData;
myBarStatus.update();
}
});
});
$('#site_id_filter_floor').change(function() {
var sites = $(this).val();
$('#building_id_filter_floor').html('');
$('#floor_id_filter2').html('');
if(sites.length==1){
$('#location_floor').show();
var site_id = sites[0];
if(site_id!=""){
$('#building_id_filter_floor').removeAttr('disabled');
var url = "{{ url('get_buildings') }}/"+site_id;
$.getJSON(url, function (data) {
$('#building_id_filter_floor').append('<option value="">- All buildings -</option>');
$.each(data, function (index, value) {
$('#building_id_filter_floor').append('<option value="' + value.id + '">' + value.name + '</option>');
});
});
} else {
$('#building_id_filter_floor').attr('disabled','disabled');
}
} else {
$('#location_floor').hide();
}
});
$('.filter_floor').change(function() {
var sites= $('#site_id_filter_floor').val();
var building_id= $('#building_id_filter_floor').val();
var year= $('#year_filter_floor').val();
var month= $('#month_filter_floor').val();
$.ajax({
type: 'GET',
url: '{{ url("get_fault_by_floor") }}',
data: {
"sites": sites,
"building_id": building_id,
"year": year,
"month": month
},
error: function (msg) {
},
dataType: "json",
success: function (chartData, textStatus, jqXHR){
myBarFloor.data = chartData;
myBarFloor.update();
}
});
});
$('#site_id_filter_breakdown').change(function() {
var sites = $(this).val();
$('#building_id_filter_breakdown').html('');
$('#floor_id_filter_breakdown').html('');
$('#building_id_filter_breakdown').val('');
$('#floor_id_filter_breakdown').val('');
if(sites.length==1){
$('#location_breakdown').show();
var site_id = sites[0];
if(site_id!=""){
$('#building_id_filter_breakdown').removeAttr('disabled');
$('#floor_id_filter_breakdown').attr('disabled','disabled');
var url = "{{ url('get_buildings') }}/"+site_id;
$.getJSON(url, function (data) {
$('#building_id_filter_breakdown').append('<option value="">- All buildings -</option>');
$.each(data, function (index, value) {
$('#building_id_filter_breakdown').append('<option value="' + value.id + '">' + value.name + '</option>');
});
});
} else {
$('#building_id_filter_breakdown').attr('disabled','disabled');
$('#floor_id_filter_breakdown').attr('disabled','disabled');
}
} else {
$('#location_breakdown').hide();
}
});
$('#building_id_filter_breakdown').change(function() {
var site_id = $(this).val();
$('#floor_id_filter_breakdown').html('');
$('#floor_id_filter_breakdown').val('');
if(site_id!=""){
$('#floor_id_filter_breakdown').removeAttr('disabled');
var url = "{{ url('get_floors') }}/"+site_id;
$.getJSON(url, function (data) {
$('#floor_id_filter_breakdown').append('<option value="">- All floors -</option>');
$.each(data, function (index, value) {
$('#floor_id_filter_breakdown').append('<option value="' + value.id + '">' + value.name + '</option>');
});
});
} else {
$('#floor_id_filter_status').attr('disabled','disabled');
}
});
$('.filter_breakdown').change(function() {
var year= $('#year_filter_breakdown').val();
var month= $('#month_filter_breakdown').val();
var sites= $('#site_id_filter_breakdown').val();
var building_id= $('#building_id_filter_breakdown').val();
var floor_id= $('#floor_id_filter_breakdown').val();
console.log(sites);
$.ajax({
type: 'GET',
url: '{{ url("get_fault_breakdown") }}',
data: {
"year": year,
"month": month,
"sites": sites,
"building_id": building_id,
"floor_id": floor_id
},
error: function (msg) {
},
dataType: "json",
success: function (chartData, textStatus, jqXHR){
myBarBreakdown.data = chartData;
myBarBreakdown.update();
}
});
});
</script>
</div>
<div class="clearfix"></div>
<?php } else {?>
<div class="row">
<?php if($role_name=="super_admin" || $role_name=="admin" || $role_name=="service_provider" || $role_name=="end_user" || $role_name=="help_desk" || $role_name=="site_staff" || $role_name=="ordinary") {?>
<div class="col-md-4">
<a href="{{ url('/faults') }}" class="widget widget-icon default innerAll inner-2x text-center text-regular">
<span class="lead font-size-large"><i class="display-block fa fa-chain-broken text-xlarge"></i> Faults</span>
</a>
<div class="separator"></div>
</div>
<?php }?>
<?php if($role_name=="super_admin" || $role_name=="admin" || $role_name=="service_provider" || $role_name=="help_desk" || $role_name=="site_staff" || $role_name=="ordinary") {?>
<div class="col-md-4">
<a href="{{ url('/adhoc_works') }}" class="widget widget-icon default innerAll inner-2x text-center text-regular">
<span class="lead"><i class="display-block fa fa-server text-xlarge"></i> Corrective Maintenance</span>
</a>
<div class="separator"></div>
</div>
<?php }?>
<?php if($role_name=="super_admin" || $role_name=="admin" || $role_name=="service_provider" || $role_name=="help_desk" || $role_name=="account" || $role_name=="site_staff") {?>
<div class="col-md-4">
<a href="{{ url('/purchase_orders') }}" class="widget widget-icon default innerAll inner-2x text-center text-regular">
<span class="lead"><i class="display-block fa fa-money text-xlarge"></i> Purchase Orders</span>
</a>
<div class="separator"></div>
</div>
<?php }?>
<?php if($role_name=="super_admin" || $role_name=="admin" || Auth::user()->position_id==16 || Auth::user()->position_id==14 ||Auth::user()->position_id==4) {?>
<div class="col-md-4">
<a href="{{ url('/claims') }}" class="widget widget-icon default innerAll inner-2x text-center text-regular">
<span class="lead"><i class="display-block fa fa-list-alt text-xlarge"></i> Claims</span>
</a>
<div class="separator"></div>
</div>
<?php }?>
<?php if($role_name=="super_admin" || $role_name=="admin" || $role_name=="service_provider" || $role_name=="help_desk" || $role_name=="site_staff") {?>
<div class="col-md-4">
<a href="{{ url('/work_orders') }}" class="widget widget-icon default innerAll inner-2x text-center text-regular">
<span class="lead"><i class="display-block fa fa-clipboard text-xlarge"></i> Work Orders</span>
</a>
<div class="separator"></div>
</div>
<?php }?>
<?php if($role_name=="super_admin" || $role_name=="admin" || $role_name=="help_desk" || $role_name=="site_staff" || $role_name=="service_provider" || $role_name=="end_user" || $role_name=="ordinary") {?>
<div class="col-md-4">
<a href="{{ url('/schedule_calendar') }}" class="widget widget-icon default innerAll inner-2x text-center text-regular">
<span class="lead"><i class="display-block fa fa-calendar text-xlarge"></i> Schedules</span>
</a>
<div class="separator"></div>
</div>
<?php }?>
<?php if($role_name=="super_admin" || $role_name=="admin" || $role_name=="help_desk" || $role_name=="site_staff" || $role_name=="service_provider" || $role_name=="other" || $role_name=="ordinary") {?>
<div class="col-md-4">
<a href="{{ url('/assets') }}" class="widget widget-icon default innerAll inner-2x text-center text-regular">
<span class="lead"><i class="display-block fa fa-folder text-xlarge"></i> Assets</span>
</a>
<div class="separator"></div>
</div>
<?php }?>
<?php if($role_name=="super_admin" || $role_name=="admin" || $role_name=="help_desk" || $role_name=="site_staff" || $role_name=="service_provider" || $role_name=="other" || $role_name=="ordinary" || $role_name=="end_user" ) {?>
<div class="col-md-4">
<a href="{{ url('/inventory_request_listing') }}" class="widget widget-icon default innerAll inner-2x text-center text-regular">
<span class="lead"><i class="display-block fa fa-archive text-xlarge"></i> Inventories</span>
</a>
<div class="separator"></div>
</div>
<?php }?>
<?php if($role_name=="super_admin" || $role_name=="admin") {?>
<div class="col-md-4">
<a href="{{ url('/users') }}" class="widget widget-icon default innerAll inner-2x text-center text-regular">
<span class="lead"><i class="display-block fa fa-comments text-xlarge"></i> Users</span>
</a>
<div class="separator"></div>
</div>
<?php }?>
<div class="col-md-4">
<a href="{{ url('/broadcasts') }}" class="widget widget-icon default innerAll inner-2x text-center text-regular">
<span class="lead"><i class="display-block fa fa-bullhorn text-xlarge"></i> Broadcast</span>
</a>
<div class="separator"></div>
</div>
<div class="col-md-4">
<a href="{{ url('/logout') }}" class="widget widget-icon default innerAll inner-2x text-center text-regular">
<span class="lead"><i class="display-block fa fa-sign-out text-xlarge"></i> Logout</span>
</a>
<div class="separator"></div>
</div>
</div>
<?php }?>
</div>
</section>
</div>
<div class="clearfix"></div>
@endsection
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment