File: /var/www/html/pmw24/app/application/views/customer/car/car_history.php
<!-- Page Content -->
<style>
.car-tab .panel-heading {
padding: 0;
}
.car-tab li {
display: inline-block;
}
.car-tab li a {
color: #000;
border: 1px solid #000;
}
.tab-content {
margin: 0;
padding: 0;
}
.car-history {
width: 100%;
}
.panel .panel-body {
padding: 0;
margin-top: 25px;
}
.car-tab li.active a {
background: #000;
color: #fff;
}
#service_table_1 {
width: 100% !important;
}
</style>
<div id="page-wrapper">
<div class="container-fluid">
<div class="row bg-title">
<div class="col-lg-3 col-md-4 col-sm-4 col-xs-12">
<h4 class="page-title">Car Service History</h4>
</div>
</div>
<!-- /row -->
<div class="row">
<div class="col-sm-12">
<div class="white-box">
<?php if ($this->session->flashdata('cus_success_msg')) { ?>
<div class="alert alert-success alert-dismissable">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
<?= $this->session->flashdata('cus_success_msg') ?>
</div>
<?php } ?>
<?php if ($this->session->flashdata('cus_error_msg')) { ?>
<div class="alert alert-danger alert-dismissable">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
<?= $this->session->flashdata('cus_error_msg') ?>
</div>
<?php } ?>
<div class="panel car-tab">
<div class="panel-heading">
<!-- Tabs -->
<ul class="nav panel-tabs">
<li class="active"><a href="#tab1" data-toggle="tab">Car History</a></li>
<li><a href="#tab2" data-toggle="tab">Car Invoice History</a></li>
</ul>
</div>
<div class="panel-body">
<div class="tab-content">
<div class="tab-pane active" id="tab1">
<h3 class="box-title m-b-0">Car Servicing History</h3>
<p class="text-muted m-b-30">Service List</p>
<div class="table-responsive">
<table id="service_table" class="car-history table table-striped">
<thead>
<tr>
<th>Sl. NO.</th>
<th>Car No</th>
<th>Mechanic</th>
<th class="no-sort">Service</th>
<th>Service Date</th>
<th class="no-sort">Job Status</th>
<!-- <th class="no-sort">Assign Status</th> -->
<th class="no-sort">Detail</th>
</tr>
</thead>
<tbody></tbody>
<tfoot></tfoot>
</table>
</div>
</div>
<div class="tab-pane" id="tab2">
<h3 class="box-title m-b-0">Invoice Servicing History</h3>
<p class="text-muted m-b-30">Service List</p>
<div class="table-responsive">
<table id="service_table_1" class="car-history table table-striped">
<thead>
<tr>
<th>Sl. NO.</th>
<th>Car No</th>
<th>Mechanic</th>
<th class="no-sort">Service</th>
<th>Service Date</th>
<th class="no-sort">Job Status</th>
<th class="no-sort">Detail</th>
</tr>
</thead>
<tbody></tbody>
<tfoot></tfoot>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /.row -->
</div>
</div>
<div class="modal" id='myModal2'>
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span></button>
<h4 class="modal-title">Details</h4>
</div>
<div class="modal-body" id='modalContent2' title="">
<!-- <p>Would you like to continue ?</p>-->
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal" id="cdel2">Ok</button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
<script src="<?= base_url('public/customer_assets/plugins/bower_components/datatables/jquery.dataTables.min.js') ?>"></script>
<!-- start - This is for export functionality only -->
<script src="https://cdn.datatables.net/buttons/1.2.2/js/dataTables.buttons.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.2.2/js/buttons.flash.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js"></script>
<script src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/pdfmake.min.js"></script>
<script src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/vfs_fonts.js"></script>
<script src="https://cdn.datatables.net/buttons/1.2.2/js/buttons.html5.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.2.2/js/buttons.print.min.js"></script>
<script src="https://cdn.datatables.net/rowreorder/1.2.7/js/dataTables.rowReorder.min.js"></script>
<script src="https://cdn.datatables.net/responsive/2.2.5/js/dataTables.responsive.min.js"></script>
<!-- end - This is for export functionality only -->
<script>
$(document).ready(function() {
table = $('#service_table').DataTable({
"pageLength": 10,
"processing": true, //Feature control the processing indicator.
"serverSide": true, //Feature control DataTables' server-side processing mode.
"order": [],
// Load data for the table's content from an Ajax source
"ajax": {
"url": "<?php echo site_url('customer/car/all_content_list_history') ?>",
"type": "POST"
},
//Set column definition initialisation properties.
"columnDefs": [
{
"targets": 'no-sort', //1st and last column
"orderable": false, //set not orderable
},
],
});
$('#service_table_filter input').off().on('keyup', function() {
$('#service_table').DataTable().search(this.value.trim(), true, false).draw();
});
invoice_table = $('#service_table_1').DataTable({
"pageLength": 10,
"processing": true, //Feature control the processing indicator.
"serverSide": true, //Feature control DataTables' server-side processing mode.
"order": [],
// Load data for the table's content from an Ajax source
"ajax": {
"url": "<?php echo site_url('customer/car/all_content_list_invoice_history') ?>",
"type": "POST"
},
//Set column definition initialisation properties.
"columnDefs": [
{
"targets": 'no-sort', //1st and last column
"orderable": false, //set not orderable
},
],
});
$('#service_table_1_filter input').off().on('keyup', function() {
$('#service_table_1').DataTable().search(this.value.trim(), true, false).draw();
});
});
$(document).on("click", '#car_invoice_history_view.cstm_view', function() {
var id = $(this).data('id');
var content = '<div class="box-body"><table class="table table-bordered">';
$.ajax({
type: 'POST',
url: '<?php echo base_url('customer/car/car_invoice_history_details'); ?>',
data: 'invoice_id=' + id,
dataType: 'json',
success: function(result) {
content += '<tr><td><strong>Car Registration No</strong></td> <td><strong>Job Status</strong></td><td><strong>Service Date</strong></td></tr>';
var job_status = "Completed";
content += '<tr><td>' + result.car_no + '</td><td>' + job_status + '</td><td>' + result.date_of_creation + '</td></tr>';
var i = 1;
content += ' <tr><th>Mechanic</th><th>Remarks</th></tr>';
content += ' <tr><td>' + result.mechanic + '</td><td>' + result.remarks + '</td></tr>';
content += '</table></div>';
content += '<h1 style="font-size: 24px; font-weight: 500; padding:5px 0;">Services</h1>';
$.each(result.services, function(key, value) {
content += '<h3 style="padding:0 0 0 0; font-size:20px"><u>' + value.item + '</u></h3>';
});
$('#modalContent2').html(content);
$('#myModal2').modal('show');
},
error: function() {
}
});
});
$(document).on("click", '#car_history_view.cstm_view', function() {
var id = $(this).data('id');
var content = '<div class="box-body"><table class="table table-bordered">';
$.ajax({
type: 'POST',
url: '<?php echo base_url('customer/car/car_history_details'); ?>',
data: 'job_id=' + id,
dataType: 'json',
success: function(result) {
content += '<tr><td><strong>Car Registration No</strong></td> <td><strong>Job Status</strong></td><td><strong>Service Date</strong></td></tr>';
if (result.job_status == 0) {
var job_status = "Not Started";
} else if (result.job_status == 1) {
var job_status = "In Progerss";
} else if (result.job_status == 2) {
var job_status = "Completed";
}
content += '<tr><td>' + result.car_no + '</td><td>' + job_status + '</td><td>' + result.service_date + '</td></tr>';
var i = 1;
content += ' <tr><th>Mechanic</th><th>Remarks</th></tr>';
$.each(result.assign_job, function(key, value) {
content += ' <tr><td>' + value.name + '</td><td>' + value.remarks + '</td></tr>';
i++;
});
content += '</table></div>';
content += '<h1 style="font-size: 24px; font-weight: 500; padding:5px 0;">Services</h1>';
$.each(result.services, function(key, value) {
content += '<h3 style="padding:0 0 0 0; font-size:20px"><u>' + value.service_name + '</u></h3><p>Note : ' + value.additional_note + '</p>';
content += '<ul>';
$.each(value.task, function(keyv, valuet) {
content += '<li>' + valuet.task_name + '</li>';
});
content += '</ul>';
});
$('#modalContent2').html(content);
$('#myModal2').modal('show');
},
error: function() {
}
});
});
$(document).on('click', 'a.deactive_btn', function() {
var href = $(this).data('href');
$.confirm({
title: "Confirm Deactive",
content: "Do you want to deactivate this car?",
buttons: {
Deactive: {
btnClass: 'btn-red',
action: function() {
location.href = href;
}
},
Close: {
btnClass: 'btn-default',
action: function() {}
},
}
});
})
$(document).on('click', 'a.active_btn', function() {
var href = $(this).data('href');
$.confirm({
title: "confirm Active",
content: "Do you want to active this car?",
buttons: {
Activate: {
btnClass: 'btn-green',
action: function() {
location.href = href;
}
},
Close: {
btnClass: 'btn-default',
action: function() {}
},
}
});
})
</script>