nhance/app/Views/vehicle_master_list.php

812 lines
31 KiB
PHP
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<style>
.table th,
.table td {
padding: 8px;
}
table.dataTable tbody td {
padding: 4px 4px !important;
}
/* table.dataTable thead th {
padding: 4px 4px !important;
} */
.col-12 {
max-width: 98% !important;
}
.readonly-select {
pointer-events: none;
background-color: #f0f0f0;
color: #666;
}
</style>
<div class="row" id="client_list">
<div class="col-12">
<div class="card">
<div class="card-body">
<div class="row" style="margin-bottom:1rem;">
<div class="col-6" style="align-self: center;">
<h4 style="position: relative;">Vehicle Master List</h4>
</div>
<div class="col-6" style="text-align: right; position: relative;top: 56px;">
<button type="button" id="btnAdd" class="btn btn-primary"
onclick="showModal('add')">ADD</button>
</div>
</div>
<table id="scroll-horizontal-datatable" class="table w-100 nowrap">
<thead class="bg-light">
<tr>
<th class="font-weight-medium">S.No.</th>
<th class="font-weight-medium">Owner Type</th>
<th class="font-weight-medium">Owner Name</th>
<th class="font-weight-medium">RC Book No</th>
<th class="font-weight-medium">Vehicle No</th>
<th class="font-weight-medium">Vehicle type</th>
<th class="font-weight-medium">Description</th>
<th class="font-weight-medium">Action</th>
</tr>
</thead>
<tbody>
<?php foreach($vehicle_Master_Data as $index => $row){ ?>
<tr>
<td><?php echo $index+1; ?></td>
<td><?php echo $row['owner_type']; ?></td>
<td><?php echo $row['owner_name']; ?></td>
<td><?php echo $row['rc']; ?></td>
<td><?php echo $row['vehicle_no']; ?></td>
<td><?php echo $vehicle_type[$row['type']]; ?></td>
<td><?php echo $vehicle_des[$row['description']]; ?></td>
<td>
<div class="btn-group dropdown">
<a href="javascript: void(0);"
class="dropdown-toggle arrow-none btn btn-light btn-sm" data-toggle="dropdown"
aria-expanded="false"><i class="mdi mdi-dots-horizontal"></i></a>
<div class="dropdown-menu dropdown-menu-right">
<a class="dropdown-item" data-id="<?= $row['id'];?>"
onclick="getEditVehicleDetailsData(this)"> <i
class="mdi mdi-pencil mr-2 text-muted font-18 vertical-middle"></i>Edit</a>
<a class="dropdown-item" data-id="<?= $row['id'];?>"
onclick="removeVehicleMasterData(this)"><i
class="mdi mdi-delete mr-2 text-muted font-18 vertical-middle"></i>Delete</a>
</div>
</div>
</td>
</tr>
<?php } ?>
</tbody>
</table>
</div>
</div>
</div><!-- end col -->
</div>
<!-- end row -->
<!-- modal content -->
<div class="modal fade" id="vehicle_modal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="myCenterModalLabel">Add New Vehicle</h4>
<button type="button" id="close_btn" class="close" data-dismiss="modal" aria-label="Close"
aria-hidden="true">×</button>
</div>
<div class="modal-body">
<form class="parsley-examples" method="post" id="vehicle_form" enctype="multipart/form-data">
<div class="form-group">
<input type="hidden" id="vehicle_primary_key" name="vehicle_primary_key">
<div class="form-row">
<div class="form-group col-md-6 client_type_div">
<label for="owner_type">Owner Type<span class="text-danger">*</span></label>
<select class="form-control" id="Owner_type" name="Owner_type"
onchange="ownerTypeBasedShowAndHideOwnerBranch(this)" required>
<option value="">Select Owner type</option>
<option value="1">Group</option>
<option value="2">Individual</option>
</select>
</div>
<div class="form-group col-md-6">
<label for="cost_center">Vehicle No<span class="text-danger">*</span></label>
<input type="text" class="form-control" id="vehicle_no" placeholder="Enter Vehicle No"
name="vehicle_no"
data-parsley-error-message="Invalid Vehicle Number. Example: TN22AB1234"
data-parsley-trigger="change"
data-parsley-pattern="^[A-Z]{2}[0-9]{2}[A-Z]{1,2}[0-9]{4}$" required>
</div>
<div class="form-group col-md-6">
<label for="rc">RC Book <span class="text-danger">*</span></label>
<input type="text" class="form-control" id="rc" placeholder="Enter RC Book No" name="rc"
required>
</div>
<div class="form-group col-md-6">
<label for="type">Type<span class="text-danger">*</span></label>
<select class="form-control" id="type" name="type" required>
<option value="">Select Type</option>
<?php
if (isset($vehicle_type) && count($vehicle_type)) {
foreach ($vehicle_type as $key => $value) {
echo "<option value=" . $key . ">" . $value . "</option>";
}
}
?>
</select>
</div>
<div class="form-group col-md-6">
<label for="description">Description<span class="text-danger">*</span></label>
<select class="form-control" id="description" name="description" required>
<option value="">Select Description</option>
<?php
if (isset($vehicle_des) && count($vehicle_des)) {
foreach ($vehicle_des as $key => $value) {
echo "<option value=" . $key . ">" . $value . "</option>";
}
}
?>
</select>
</div>
<div class="form-group col-md-6">
<label for="rc"> Old Owner Name <span class="text-danger">(if exist)</span></label>
<input type="text" class="form-control" id="old_onwer" name="old_onwer"
placeholder="Enter Old Owner Name">
</div>
<div class="form-group col-md-12">
<label for="owner">Owner Name <span class="text-danger">*</span></label>
<select class="form-control" id="owner" name="owner"
onchange="listOwnerBranch(this); addClient(this)" required>
<option value="">Select Owner</option>
</select>
</div>
<div class="form-group col-md-12 ownerbranchdiv">
<label for="client_branch">Branch<span class="text-danger"></span></label>
<select class="form-control" id="owner_branch" name="branch_id">
<option value="">Select Branch</option>
</select>
</div>
</div>
</div>
<div class="form-group text-right m-b-0" id="hide_smbt_btn">
<button type="submit" id="btnSubmit" class="btn btn-primary">Submit</button>
</div>
</form>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div>
<!-- /.modal -->
<!-- Client form content modal-->
<div class="modal fade" id="upload_enrollment_model" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="myCenterModalLabel">Add New Client</h4>
<button type="button" id="close_btn" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
<div class="modal-body">
<form class="parsley-examples" method="post" id="client_form" enctype="multipart/form-data">
<div class="form-group">
<div class="form-row">
<div class="form-group col-md-12">
<label for="client_type">Client type<span class="text-danger">*</span></label>
<select class="form-control" id="client_type" name="client_type"
onchange="ownerTypeBasedShowAndHideOwnerBranch(this)" required>
<option value="">Select Owner type</option>
<option value="1">Group</option>
<option value="2">Individual</option>
</select>
</div>
<div class="form-group col-md-12">
<label for="client_name">Client Name<span class="text-danger">*</span></label>
<input type="text" class="form-control" id="client_name" name="client_name" required>
</div>
<div class="form-group col-md-12">
<label for="short_name">Client Short name<span class="text-danger">*</span></label>
<input type="text" class="form-control" id="short_name" name="short_name" required>
</div>
<div class="form-group col-md-12">
<label for="cost_center">PAN<span class="text-danger">*</span></label>
<input type="text" class="form-control" id="pan" placeholder="Enter PAN No" name="pan">
</div>
</div>
<hr>
<!-- Individual Client HTML -->
<div class="form-row clienttypediv" style="display: none;">
<div class="form-group col-md-6">
<label for="dob">Date of Birth<span class="text-danger">*</span></label>
<input type="text" class="form-control" id="dob" placeholder="DD/MM/YYYY" name="dob">
</div>
<div class="form-group col-md-6">
<label for="cost_center">Mobile<span class="text-danger">*</span></label>
<input type="text" class="form-control" id="phone" placeholder="Enter Mobile Number"
maxlength="10" name="phone" onkeypress="return onlyNumbers(event)">
</div>
<div class="form-group col-md-12">
<label for="cost_center">Email<span class="text-danger">*</span></label>
<input type="email" class="form-control" id="email" placeholder="Enter Email"
name="email">
</div>
<div class="form-group col-md-12">
<label for="aadhar">Aadhar<span class="text-danger">*</span></label>
<input type="text" class="form-control" id="aadhar" placeholder="Enter PAN No"
name="aadhar">
</div>
</div>
<!-- Group client HTML -->
<div class="form-row branchdiv">
<div class="form-group col-md-12">
<label for="short_name">Entity Type<span class="text-danger">*</span></label>
<select class="form-control" id="entity_type_id" name="entity_type_id">
<option value="" selected>Select Entity</option>
<?php
if (isset($entity) && count($entity)) {
foreach ($entity as $key => $value) {
echo "<option value=" . $value['id'] . ">" . $value['name'] . "</option>";
}
}
?>
</select>
</div>
<div class="form-group col-md-6">
<label for="client_name">Branch Name<span class="text-danger">*</span></label>
<input type="text" class="form-control" id="branch_name" name="branch_name">
</div>
<div class="form-group col-md-6">
<label for="branch_code">Branch Code<span class="text-danger">*</span></label>
<input type="text" class="form-control" id="branch_code" name="branch_code">
</div>
<div class="form-group col-md-6">
<label for="branch_code">Name<span class="text-danger">*</span></label>
<input type="text" class="form-control" id="name" name="name">
</div>
<div class="form-group col-md-6">
<label for="branch_code">Mobile<span class="text-danger">*</span></label>
<input type="text" class="form-control" id="mobile" maxlength="10" name="mobile"
onkeypress="return onlyNumbers(event)">
</div>
<div class="form-group col-md-12">
<label for="gst">GST<span class="text-danger">*</span></label>
<input type="text" class="form-control" id="gst" placeholder="Enter GST Number"
data-parsley-error-message="Invalid GST Number. Example: 12ABCDE1234F5Z6" name="gst"
data-parsley-trigger="change"
data-parsley-pattern="^\d{2}[A-Z]{5}\d{4}[A-Z]{1}[A-Z\d]{1}[Z]{1}[A-Z\d]{1}$"
required>
</div>
</div>
</div>
<div class="form-group text-right m-b-0" id="hide_smbt_btn">
<button type="submit" class="btn btn-primary waves-effect waves-light mr-1">Submit</button>
</div>
</form>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div>
<!-- end of Client form content modal -->
<script>
var client_list = ''; // local variable for storing the client list
var branch_list = ''; // local variable for storing the client branch list
$(document).ready(function() {
getClientAndBranchAndPolicy()
$('#owner').select2();
$('#owner_branch').select2();
})
$(document).ready(function() {
$('#scroll-horizontal-datatable').DataTable({
scrollX: true,
dom: "<'row'<'col-sm-0'f><'col-sm-9 text-right'B>>" +
"<'row'<'col-sm-12'tr>>" +
"<'row'<'col-sm-5'i><'col-sm-7'p>>",
buttons: [{
extend: 'csv',
text: 'CSV',
title: 'Vehicle-Master-List',
className: 'my_class',
exportOptions: {
columns: ':not(:last-child)'
},
}],
language: {
search: "_INPUT_",
searchPlaceholder: "Search..."
},
paging: true,
});
})
function getEditVehicleDetailsData(input) {
$('.loader').fadeIn();
$('.loader-mask').fadeIn();
var vehicle_id = $(input).attr('data-id');
$('#myCenterModalLabel').text('Update Vehicle Details');
showModal()
$.ajax({
url: '<?php echo base_url('master/vehicle/list/');?>' + vehicle_id,
type: "GET",
dataType: 'json',
success: function(res) {
$('.loader').fadeOut();
$('.loader-mask').delay(350).fadeOut('slow');
console.log(res)
// $('#vehicle_form').attr('action', '<?php echo base_url('master/vehicle/edit');?>');
$('#vehicle_primary_key').val(res.data.id);
$('#Owner_type').val(res.data.client_type);
$('#vehicle_no').val(res.data.vehicle_no);
$('#rc').val(res.data.rc);
$('#type').val(res.data.type);
$('#description').val(res.data.description);
$('#owner').val(res.data.owner).addClass('readonly-select').change().select2('destroy');
setTimeout(function() {
$('#owner_branch').val(res.data.branch_id).addClass('readonly-select').change()
.select2('destroy');
$('.loader').fadeOut();
$('.loader-mask').delay(350).fadeOut('slow');
}, 1000)
$('#btnSubmit').text('Update');
if (res.data.client_type == 2) {
$('.ownerbranchdiv').hide();
} else {
$('.ownerbranchdiv').show();
}
},
error: function(xhr, status, error) {
$('.loader').fadeOut();
$('.loader-mask').delay(350).fadeOut('slow');
console.error(xhr.responseText);
console.error(status, error);
}
});
}
function showModal(type) {
if (type == 'add') {
$('#myCenterModalLabel').text('Add New Vehicle');
$('#Owner_type').val('');
$('#vehicle_no').val('');
$('#rc').val('');
$('#type').val('');
$('#description').val('');
$('#owner').val('').select2();
$('#owner_branch').val('').select2();
$('#btnSubmit').text('Submit');
}
var myModal = new bootstrap.Modal(document.getElementById('vehicle_modal'));
myModal.show();
}
function removeVehicleMasterData(element) {
Swal.fire({
title: "Are you sure?",
text: "You need to remove this Vehicle.",
icon: "info",
showCancelButton: true,
confirmButtonColor: "#3085d6",
confirmButtonText: "Yes",
}).then((result) => {
if (result.isConfirmed) {
var id = element.getAttribute('data-id');
var form_action = '<?= base_url("master/vehicle/remove/") ?>' + id;
$.ajax({
url: form_action,
type: "GET",
dataType: 'json',
processData: false,
contentType: false,
success: function(res) {
// console.log(res.status == true);
if (res) {
if (res.status == true) {
toastr.success('Vehicle Data removed successfully.', 'success');
location.reload();
} else {
toastr.warning('Failed to remove Vehicle Data.', 'warning');
}
}
},
error: function(xhr, status, error) {
console.error(xhr.responseText);
console.error(status, error);
$('.loader').fadeOut();
$('.loader-mask').delay(350).fadeOut('slow');
console.log('Something Wrong!', 'warning');
}
});
}
});
}
function ownerTypeBasedShowAndHideOwnerBranch(input) {
var owner_type_id = $(input).val()
if (owner_type_id == 2) {
$('.ownerbranchdiv').hide();
// $('#owner_branch').prop('required', false);
} else {
$('.ownerbranchdiv').show();
// $('#owner_branch').prop('required', true);
}
// Clear and add default options for client
$('#owner').empty().append($('<option>', {
value: '',
text: 'Select Client'
}));
$('#owner').append($('<option>', {
value: 'add_owner',
text: '+ Add Owner'
}));
// Populate client options based on selected client type
if (owner_type_id) {
$.each(client_list, function(index, item) {
if (item.client_type == owner_type_id) {
var option = $('<option>', {
value: item.id,
text: item.client_name,
'data-cn': item.client_name,
'data-ct': item.client_type
});
$('#owner').append(option);
}
});
}
// Initialize or refresh Select2 for both dropdowns
$('#owner').select2();
}
function addClient(input) {
let client_id = $(input).val();
console.log('client_id ----', client_id);
if (client_id === 'add_owner') {
// Initialize the modals
// $('.close').click();
var vehicleModal = new bootstrap.Modal(document.getElementById('vehicle_modal'));
var clientModal = new bootstrap.Modal(document.getElementById('upload_enrollment_model'));
// Clear the form fields
$('#entity_type_id').val('');
$('#branch_name').val('');
$('#client_branch_id').val('');
$('#branch_code').val('');
$('#name').val('');
$('#mobile').val('');
$('#gst').val('');
$('#dob').val('');
$('#phone').val('');
$('#email').val('');
$('#aadhar').val('');
$('#owner').val('').change();
// Hide the vehicle modal
// vehicleModal.hide();
clientModal.show();
// Once the vehicle modal is hidden, show the client modal
// document.getElementById('vehicle_modal').addEventListener('hidden.bs.modal', function () {
// console.log('vehicle_modal is hidden');
// clientModal.show();
// });
}
}
//---------------------------------------------------------------------------------------------------
$("#vehicle_form").submit(function(event) {
event.preventDefault();
var isValid = $('#vehicle_form').parsley().validate();
if (!isValid) {
console.log('Form is Empty', 'Warning');
return;
}
form_action = '<?= base_url("util/createVehicleWithMinimalData"); ?>';
$('.loader').fadeIn();
$('.loader-mask').fadeIn();
var formData = new FormData($('#vehicle_form')[0]);
$.ajax({
data: formData,
url: form_action,
type: "POST",
dataType: 'json',
processData: false,
contentType: false,
success: function(res) {
$('.loader').fadeOut();
$('.loader-mask').delay(350).fadeOut('slow');
console.log('create Vehicle Data response', res);
if (res.status == true) {
toastr.success(res.message, 'Success');
window.location.reload()
} else {
toastr.error(res.message, 'Error');
}
$('.close').click();
},
error: function(xhr, status, error) {
console.error(xhr.responseText);
console.error(status, error);
$('.loader').fadeOut();
$('.loader-mask').delay(350).fadeOut('slow');
}
});
});
$("#client_form").submit(function(event) {
event.preventDefault();
var isValid = $('#client_form').parsley().validate();
if (!isValid) {
console.log('Form is Empty', 'Warning');
return;
}
form_action = '<?= base_url("util/createClientWithMinimalData"); ?>';
$('.loader').fadeIn();
$('.loader-mask').fadeIn();
var client_type = $('#client_type').val();
var formData = new FormData($('#client_form')[0]);
formData.append('client_type', client_type)
$.ajax({
data: formData,
url: form_action,
type: "POST",
dataType: 'json',
processData: false,
contentType: false,
success: function(res) {
$('.loader').fadeOut();
$('.loader-mask').delay(350).fadeOut('slow');
console.log('create Client With Minimal Data response', res)
// console.log('create Client With Minimal Data response', res.data)
if (res.status == true) {
getClientAndBranchAndPolicy();
if (res.data.client_type == 2) {
$('.ownerbranchdiv').hide();
} else {
$('.ownerbranchdiv').show();
}
$('#Owner_type').val(res.data.client_type);
setTimeout(function() {
$('#owner').val(res.client_id).change();
setTimeout(function() {
$('#owner_branch').val(res.branch_id).select2();
}, 1000);
}, 2000)
toastr.success(res.message, 'Success');
} else {
toastr.error(res.message, 'Error');
}
$('.close').click();
showModal()
},
error: function(xhr, status, error) {
console.error(xhr.responseText);
console.error(status, error);
$('.loader').fadeOut();
$('.loader-mask').delay(350).fadeOut('slow');
}
});
});
//----------------------------------------------------------------------------------------------------
$('#client_type').change(function() {
if ($(this).val() == 2) {
$('.branchdiv').hide();
$('.clienttypediv').show();
$('#entity_type_id').prop('required', false);
$('#branch_name').prop('required', false);
$('#client_branch_id').prop('required', false);
$('#branch_code').prop('required', false);
$('#name').prop('required', false);
$('#mobile').prop('required', false);
$('#gst').prop('required', false);
$('#dob').prop('required', true);
$('#phone').prop('required', true);
$('#email').prop('required', true);
$('#aadhar').prop('required', true);
} else {
$('.branchdiv').show();
$('.clienttypediv').hide();
$('#entity_type_id').prop('required', true);
$('#branch_name').prop('required', true);
$('#client_branch_id').prop('required', true);
$('#branch_code').prop('required', true);
$('#name').prop('required', true);
$('#mobile').prop('required', true);
$('#gst').prop('required', true);
$('#dob').prop('required', false);
$('#phone').prop('required', false);
$('#email').prop('required', false);
$('#aadhar').prop('required', false);
}
});
//----------------------------------------------------------------------------------------------------
function getClientAndBranchAndPolicy() {
$.ajax({
url: '<?= base_url("/util/getClientAndBranchAndPolicy") ?>',
type: "GET",
dataType: 'json',
success: function(res) {
console.log('getClientAndBranchAndPolicy', res);
if (res.status == true) {
client_list = res.client_data;
branch_list = res.branch_data;
appendOwner(client_list)
} else {
console.log('No data found');
}
},
error: function(xhr, status, error) {
console.error(xhr.responseText);
console.error(status, error);
}
});
}
function appendOwner(data) {
$('#owner').empty();
$('#owner').append($('<option>', {
value: '',
text: 'Select Owner'
}));
$('#owner').append($('<option>', {
value: 'add_owner',
text: '+ Add Owner'
}));
$.each(data, function(index, item) {
var option = $('<option>', {
value: item.id,
text: item.client_name,
});
$('#owner').append(option);
});
}
function listOwnerBranch(input) {
let owner_id = $(input).val();
console.log('owner_id', owner_id);
if (branch_list != '') {
// console.log(branch_list[client_id]);
let data = branch_list[owner_id];
appendOwnerBranch(data);
}
}
function appendOwnerBranch(data) {
$('#owner_branch').empty();
$('#owner_branch').append($('<option>', {
value: '',
text: 'Select Branch'
}));
$.each(data, function(index, item) {
var option = $('<option>', {
value: item.id,
text: item.branch_name
});
$('#owner_branch').append(option);
});
}
function onlyNumbers(event) {
var charcode;
charcode = event.which || event.keyCode;
if (charcode >= 48 && charcode <= 57 || charcode == 46) return true;
return false;
}
</script>