ria/app/Views/employeeLeaveApplicationForm.php
2025-03-28 03:11:33 +00:00

498 lines
24 KiB
PHP
Executable File
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.

<div class="content-wrapper"></div>
<div class="content-page">
<div class="content">
<!-- Start Content-->
<div class="container-fluid">
<!-- start page title -->
<div class="row">
<div class="col-12">
<div class="page-title-box page-title-box-alt">
<div class="page-title-right">
<ol class="breadcrumb m-0">
<li class="breadcrumb-item"><a href="javascript: void(0);">HR</a></li>
<li class="breadcrumb-item"><a href="javascript: void(0);">Leave</a></li>
<li class="breadcrumb-item active">
<h4 class="page-title">Leave Application Form</h4>
</li>
</ol>
</div>
<a data-toggle="modal" href="#applicationModal" data-id="0" data-name=""
class="btn btn-success">Add Leave Application Form</a>
</div>
</div>
</div><!-- /.end 1st r o w -->
<div class="row">
<div class="col-12">
<div class="card">
<!-- <form class="Date-filter-form" id="DateRangeFilter"
style="margin-top: 14px;margin-bottom: -11px;margin-left: 33px;">
<input type="hidden" name="table" value="requisition">
<label for="fromDate">From:</label>
<input class="form-control date_range form-date-search" id="fromDate" name="fromDate"
placeholder="Select From Date" autocomplete="off" required>
<label for="toDate">To:</label>
<input class="form-control date_range to-date-search" id="toDate" name="toDate"
placeholder="Select To Date" autocomplete="off" required>
<button type="submit" class="range_search_button"><i class="fe-search" aria-hidden="true"
class="icon-button" title="Search"></i></button>
<i class="fe-rotate-cw range_reset_button" aria-hidden="true" class="icon-button"
id="resetButton" title="Reset"></i>
<div class="error" id="error"></div>
</form> -->
<!-- <div style="margin-left:auto">
<div class="form-check" style="margin-right: 25px;">
<form id="archiveFormId" action="<?php // echo base_url()?>/transporterListing" method="post">
<input class="form-check-input" type="checkbox" id="showArchiveId"
name="showArchive" value="1" <?php // echo $showArchive ? "checked" : " " ?>
style="width: 18px; height: 18px;">
<label class="form-check-label" for="showArchiveId"
style="font-size: 1rem; margin-left: 8px;">
Show Archive
</label>
</form>
</div>
</div> -->
<div class="card-body" style="overflow-x:scroll;">
<div class="card-body">
<div class="box">
<div class="box-header">
<div class="box-tools"></div>
</div>
<div class="box-body">
<div class="table-responsive" style="overflow-x:scroll;">
<table id="leave_app_listing" class="table dt-responsive nowrap w-100">
<thead>
<tr>
<th>Create Date</th>
<th>Create By</th>
<th>Employee Name</th>
<th>Number Of Days</th>
<th>Status</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<?php
if (!empty($leave_info)) :
foreach ($leave_info as $d) {
$createdat = new DateTime($d['created_on']);
$crdate = $createdat->format('d-m-Y');
$crtime = $createdat->format('h:i A');
?>
<tr>
<td><?= esc($crdate) ?></td>
<td><?= esc($d['creatorFullName']) ?></td>
<td><?= esc($d['employeeFullName']) ?></td>
<td><?= esc($d['no_of_days']) ?></td>
<td><?= esc($d['status']) ?></td>
<td><?php if($d['leave_application_id']){ ?>
<a data-toggle="modal" href="#applicationModal" data-arr='<?php echo json_encode($d); ?>' data-id='<?= esc($d['leave_application_id']) ?>'>
<i class="fas fa-edit"></i>&nbsp;&nbsp;&nbsp;
</a>
<a onclick="confirmDelete(event)" style="cursor:pointer;" href="<?php echo base_url() . 'deleteLeaveApplicationForm?leave_application_id=' . esc($d['leave_application_id']); ?>">
<i class="fa fa-trash"></i>&nbsp;&nbsp;&nbsp;
</a>
<?php } ?>
<?php if($d['status'] == "APPROVED"){} ?>
<a style="cursor:pointer;" href="<?php echo base_url() . 'leaveApplicationPDF/' . esc($d['leave_application_id']); ?>">
<i class="fa fa-download"></i>&nbsp;&nbsp;&nbsp;
</a>
</td>
</tr>
<?php } ?>
<?php endif; ?>
</tbody>
</table>
</div>
<p>&nbsp;</p>
</div><!-- /. end b o x-b o d y -->
</div><!-- /.end b o x -->
</div> <!-- end c a r d b o d y-->
</div> <!-- /. end c a r d -->
</div><!-- /. end c o l-->
</div> <!-- /.end 2nd r o w -->
</div> <!-- /.end c o n t a i n e r -->
</div> <!-- /.end c o n t e n t -->
</div>
<!-- leave Application entries modal -->
<div class="modal fade" id="applicationModal" tabindex="-1" role="dialog" aria-labelledby="applicationformTitle" aria-hidden="true">
<div class="modal-dialog modal-xl" style="width:900px;">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="applicationformTitle">Add Application</h4>
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
<div class="modal-body">
<form id="applicationForm" class="form-horizontal" role="form">
<input type="hidden" class="form-control" id="leave_application_id" name="leave_application_id">
<div class="row mt-2">
<div class="col-md-2" style="text-align: end; align-content: center;">
<label class="form" for="emp_name">Employee Name</label>
</div>
<div class="col-md-9">
<select class="form-control select2" id="emp_name" name="emp_name" onchange="fetchemployees(this);">
<option value="">Select</option>
<?php foreach ($employee_info as $key => $value) { ?>
<option value="<?= $value->EmpID; ?>"
data-department="<?= $value->DepartmentName; ?>"
data-designation="<?= $value->Designation; ?>">
<?= $value->FullName; ?>
</option>
<?php } ?>
</select>
</div>
</div><!--/. r o w 1 -->
<div class="row mt-2">
<div class="col-md-2" style="text-align: end; align-content: center;">
<label class="form" for="emp_id">Employee ID</label>
</div>
<div class="col-md-9">
<input type="text" class="form-control" id="emp_id" name="emp_id" readonly>
</div>
</div><!--/. r o w 2-->
<div class="row mt-2">
<div class="col-md-2" style="text-align: end; align-content: center;">
<label class="form" for="department">Department</label>
</div>
<div class="col-md-9">
<input type="text" class="form-control" id="department" name="department" readonly>
</div>
</div><!--/. r o w 3 -->
<div class="row mt-2">
<div class="col-md-2" style="text-align: end; align-content: center;">
<label class="form" for="designation">Designation </label>
</div>
<div class="col-md-9">
<input type="text" class="form-control" id="designation" name="designation" readonly>
</div>
</div><!--/. r o w 4 -->
<div class="row mt-2">
<div class="col-md-2" style="text-align: end; align-content: center;">
<label class="form" for="No. of days">No. of days </label>
</div>
<div class="col-md-3">
<label class="form" for="start_date">from Date</label>
<input type="date" class="form-control" id="start_date" name="start_date" required>
</div>
<div class="col-md-3">
<label class="form" for="end_date">to Date</label>
<input type="date" class="form-control" id="end_date" name="end_date" required>
</div>
<div class="col-md-3">
<label class="form" for="no_of_days">No's Days </label>
<input type="text" class="form-control" id="no_of_days" name="no_of_days">
</div>
</div><!--/. r o w 5 -->
<div class="row mt-2">
<div class="col-md-2" style="text-align: end; align-content: center;">
<label class="form" for="status_val">Status</label>
</div>
<div class="col-md-9">
<select class="form-control select2" id="status_val" name="status_val">
<option value="">Select</option>
<?php foreach ($status_info as $key => $value) { ?>
<option value="<?= $value; ?>"> <?= $value; ?> </option>
<?php } ?>
</select>
</div>
</div><!--/. r o w 6 -->
<div class="row mt-2">
<div class="col-md-2" style="text-align: end; align-content: center;">
<label class="form" for="reason">Reason</label>
</div>
<div class="col-md-9">
<textarea class="form-control" id="reason" name="reason" ></textarea>
</div>
</div><!--/. r o w 7 -->
</form>
</div><!-- /. m o d a l b o d y -->
<div class="modal-footer">
<button type="button" class="btn btn-secondary waves-effect" data-dismiss="modal"
value="Cancel">Cancel</button>
<button type="button" class="btn btn-info waves-effect waves-light tempClick"
id="tempClick">Submit</button>
</div>
</div><!-- /. m o d a l-c o n t e n t -->
</div><!-- /.m o d a l-d i a l o g -->
</div>
<script type="text/javascript" src="<?php echo base_url(); ?>public/assets/js/common.js" charset="utf-8"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.5/xlsx.full.min.js"></script>
<script>
$(document).ready(function () {
$('#start_date, #end_date').change(function() {
const start = new Date($('#start_date').val());
const end = new Date($('#end_date').val());
if (!isNaN(start) && !isNaN(end)) {
const days = Math.floor((end - start) / 86400000) + 1;
$('#no_of_days').val(days > 0 ? days : 1);
} else {
$('#no_of_days').val('');
}
});
$("#applicationModal").on("shown.bs.modal", function (e) {
var id = $(e.relatedTarget).data('id');
let fields = ['leave_application_id','emp_id','start_date','end_date','no_of_days','reason','status_val','emp_name','department','designation'];
fields.forEach(function(field) {
$("#" + field).val("");
});
if (id == 0) {
$('#applicationformTitle').html("Add Leave Application Form");
$("#leave_application_id").val(0);
} else {
var arr = $(e.relatedTarget).data('arr');
fields.forEach(function(field) {
$("#" + field).val(arr && arr[field] ? arr[field] : "");
if(field == 'emp_name'){
$("#emp_name").val(arr && arr['emp_id']);
}
if(field == 'status_val'){
$("#status_val").val(arr && arr['status']);
}
});
$('#applicationformTitle').html("Edit Leave Application Form");
}
});
$('#tempClick').click(function () {
if ($('#emp_id').val() === '') {
alert('Please Select the Valid Employee');
return;
}
if ($('#start_date').val() === '') {
alert('Please Enter the Valid From Date');
return;
}
if ($('#end_date').val() === '') {
alert('Please Enter the Valid To Date');
return;
}
if ($('#reason').val() === '') {
alert('Please Enter the Reason');
return;
}
if ($('#status_val').val() === '') {
alert('Please Select Status');
return;
}
var formData = {
leave_application_id:$('#leave_application_id').val(),
emp_id:$('#emp_id').val(),
start_date:$('#start_date').val(),
end_date:$('#end_date').val(),
no_of_days:$('#no_of_days').val(),
reason:$('#reason').val(),
status:$('#status_val').val(),
};
$('#loader').show();
$.ajax({
type: 'POST',
url: "<?php echo base_url(); ?>fetchLeaveApplicationForm",
data: formData,
dataType: 'json',
success: function (response) {
$('#loader').hide();
if (response.status) {
alert(response.message);
location.reload();
} else {
alert(response.message);
}
},
error: function (xhr, status, error) {
$('#loader').hide();
console.error('An error occurred: ' + error);
},
complete: function () {
$('#loader').hide();
console.log("ajax call completed");
}
});
});
$.fn.dataTable.ext.type.order['date-eu-pre'] = function (date) {
var dateSplit = date.split('-');
return (dateSplit[2] + dateSplit[1] + dateSplit[0]) * 1;
};
// Initialize the DataTable
var table = $('#leave_app_listing').DataTable({
dom: 'Blfrtip',
buttons: [
'excel', 'pdf'
],
pageLength: 10,
lengthMenu: [
[10, 20, 30, 50, -1],
[10, 20, 30, 50, "All"]
],
responsive: false,
order: false,
language: {
paginate: {
next: '<i class="fas fa-angle-right"></i>', // Next button icon
previous: '<i class="fas fa-angle-left"></i>' // Previous button icon
}
}
});
// Date range filter function
$.fn.dataTable.ext.search.push(
function (settings, data, dataIndex) {
var fromDate = $('#fromDate').val();
var toDate = $('#toDate').val();
if (!fromDate || !toDate) {
return true; // If no dates selected, don't filter
}
// Convert the fromDate and toDate from dd-mm-yyyy to Date objects
var fromParts = fromDate.split("-");
var toParts = toDate.split("-");
var startDate = new Date(fromParts[2], fromParts[1] - 1, fromParts[0]); // Year, month (0-based), day
var endDate = new Date(toParts[2], toParts[1] - 1, toParts[0]);
// Adjust startDate to include the day before the selected fromDate
startDate.setDate(startDate.getDate() - 1);
// Ensure endDate includes the entire end date by setting time to the end of the day
endDate.setHours(23, 59, 59, 999);
// Get the date from the DataTable row (assuming it's in the first column in dd-mm-yyyy format)
var dateStr = data[0];
var dateParts = dateStr.split("-");
var rowDate = new Date(dateParts[2], dateParts[1] - 1, dateParts[0]);
// Return true if the row date is within the range
return rowDate >= startDate && rowDate <= endDate;
}
);
// Handle form submission for the date range filter
// $("#DateRangeFilter").submit(function (e) {
// e.preventDefault();
// table.draw(); // Redraw the table to apply the filter
// });
// Reset button functionality
// $("#resetButton").click(function () {
// $("#fromDate").val('');
// $("#toDate").val('');
// table.draw(); // Redraw the table to clear the filter
// });
// Automatically focus and open the To Date picker when From Date is selected
// document.getElementById('fromDate').addEventListener('change', function () {
// var fromDate = this.value;
// var toDateInput = document.getElementById('toDate');
// // Set the min attribute of the To Date input to the selected From Date
// toDateInput.min = fromDate;
// // Optionally reset the To Date input if the current value is before the new min date
// if (toDateInput.value < fromDate) {
// toDateInput.value = fromDate;
// }
// });
});
</script>
<script>
$(window).on('load', function () {
function flashMessage() {
// Fetch the flash data from PHP and encode it for JavaScript
let message = <?= json_encode(session()->getFlashdata('success')) ?>;
if (message) {
alert(message);
}
}
flashMessage();
})
function confirmDelete(event) {
let result = confirm(` Do you Confirm to Delete the Leave Applicationform Detail?`);
if (result) { return result; } else { event.preventDefault(); }
}
function confirmReActivate(event) {
let result = confirm(` Do you Confirm to Re-activate the Leave Applicationform Detail?`);
if (result) { return result; } else { event.preventDefault(); }
}
function fetchemployees(selectElement){
$('#emp_id').val("");
$('#department').val("");
$('#designation').val("");
const selectedOption = selectElement.options[selectElement.selectedIndex];
let empId = selectedOption.value;
// Check if nothing is selected
if (empId === "") {
alert("Please select an employee!");
return; // Exit the function early
}
let department = selectedOption.getAttribute('data-department');
let position = selectedOption.getAttribute('data-designation');
$('#emp_id').val(empId);
$('#department').val(department);
$('#designation').val(position);
}
</script>