nhance-enrollment/app/Views/employee_list.php

714 lines
24 KiB
PHP
Executable File

<style>
.table th,
.table td {
padding: 8px;
}
table.dataTable tbody td {
padding: 4px 4px !important;
}
.select2-selection__choice {
background-color: #0a8794 !important;
color: white !important;
font-weight: bold;
}
.select2-selection__choice__remove {
color: white !important;
margin-right: 5px;
}
.custom-dropdown-menu {
display: none;
position: absolute;
background-color: #ffffff !important;
border: 1px solid rgba(0, 0, 0, 0.15);
border-radius: 0.25rem;
padding: 0.5rem 0;
min-width: 10rem;
z-index: 9999;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
.custom-dropdown-menu .dropdown-item {
display: block !important;
width: 100% !important;
padding: 0.5rem 1rem !important;
color: #212529 !important;
text-decoration: none !important;
background-color: transparent !important;
}
.custom-dropdown-menu .dropdown-item:hover {
background-color: #f8f9fa !important;
color: #16181b !important;
cursor: pointer !important;
}
</style>
<div class="row">
<div class="col-xl-12">
<div id="accordion" class="mb-3">
<div class="card mb-1">
<h5 class="m-1">
<a id="toggleIcon" class="text-dark float-right" data-toggle="collapse" href="#collapseOne"
aria-expanded="true">
<i id="icon" class="mdi mdi-chevron-down mr-1 text-primary" style="font-size: 28px;"></i>
</a>
</h5>
<div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordion">
<div class="card-body">
<!-- <div class="text-center"> -->
<div class="form-row">
<div class="form-group col-md-4">
<label>Client</label> <br />
<select class="form-control" id="clients">
<option value="0">Select</option>
</select>
</div>
<div class="form-group col-md-4">
<label>Branch</label> <br />
<select name="branch_id" class="form-control" id="branch_id">
<option value="0">Select</option>
</select>
</div>
<div class="form-group col-md-4">
<label>Policy</label> <br />
<select class="form-control" id="policies">
<option value="0">Select</option>
</select>
</div>
<div class="form-group col-md-4">
<label>Status</label> <br />
<select class="form-control" name="status2[]" id="status2" multiple>
<option value="0">Select</option>
<?php foreach($status as $key => $value) { ?>
<option value="<?= $key ?>"
<?php
if ((!isset($getData) || in_array('active', $getData['status'])) && $key == 'active') {
echo 'selected';
}
?>>
<?= $value ?>
</option>
<?php } ?>
</select>
</div>
<div class="form-group col-md-4">
<label>Employee Code</label> <br />
<input type="text" class="form-control" id="emp_code" name="emp_code" value="<?= isset($getData['emp_code']) && !empty($getData['emp_code']) ? $getData['emp_code'] : '' ?>">
</div>
<div class="form-group col-md-4">
<label>Employee Name</label> <br />
<input type="text" class="form-control" id="emp_name" name="emp_name" value="<?= isset($getData['emp_name']) && !empty($getData['emp_name']) ? $getData['emp_name'] : '' ?>">
</div>
</div>
<div class="row justify-content-end">
<div class="col-auto">
<!-- <div id="categoryFilter_12"> -->
<a href="#" class="btn btn-primary waves-effect waves-light" onclick="sendManualEcard(this)">Send Ecard</a>
<!-- </div> -->
</div>
<div class="col-auto">
<a href="<?= base_url("employee/list"); ?>"
class="btn btn-primary waves-effect waves-light" id="get-emp-list"
onclick="fetchEmpolyeeList(event);">Submit</a>
</div>
</div>
<!-- </div> -->
</div>
</div>
</div>
</div>
</div>
</div>
<?php // include('employee_data_list.php');?>
<div id="employee_table_list"></div>
<!-- end row -->
<div id="loader" class="loader" style="display:none;">SPINNER</div>
<script>
// document.addEventListener("DOMContentLoaded", function () {
// const table = document.getElementById("tickets-table");
// // Create custom dropdown
// function createCustomDropdown(row) {
// // Get the original dropdown items
// const originalDropdown = row.querySelector('.dropdown-menu');
// if (!originalDropdown) return null;
// // Create new dropdown with proper background and spacing
// const customDropdown = document.createElement('div');
// customDropdown.className = 'custom-dropdown-menu';
// // Copy inner content while maintaining icon alignment
// customDropdown.innerHTML = originalDropdown.innerHTML;
// return customDropdown;
// }
// let activeDropdown = null;
// // Add click event listener to rows
// table.querySelectorAll("tbody tr").forEach(row => {
// const customDropdown = createCustomDropdown(row);
// if (!customDropdown) return;
// document.body.appendChild(customDropdown);
// row.addEventListener("click", function(event) {
// // Ignore clicks on the action column
// if (event.target.closest('td:last-child')) {
// return;
// }
// // Hide any active dropdown
// if (activeDropdown) {
// activeDropdown.style.display = 'none';
// }
// // Get click position
// const rect = event.target.getBoundingClientRect();
// // Position the dropdown with some offset
// customDropdown.style.display = 'block';
// customDropdown.style.position = 'fixed';
// customDropdown.style.left = `${rect.left}px`;
// customDropdown.style.top = `${rect.bottom + 5}px`; // Add 5px gap
// // Set as active dropdown
// activeDropdown = customDropdown;
// event.stopPropagation();
// });
// // Preserve click handlers and add auto-close
// customDropdown.querySelectorAll('.dropdown-item').forEach(item => {
// item.addEventListener('click', function(e) {
// const onclickAttr = this.getAttribute('onclick');
// if (onclickAttr) {
// eval(onclickAttr);
// }
// const href = this.getAttribute('href');
// if (href && href !== '#') {
// window.location.href = href;
// }
// // Close the dropdown after handling the click
// if (activeDropdown) {
// activeDropdown.style.display = 'none';
// activeDropdown = null;
// }
// e.stopPropagation();
// });
// });
// });
// // Close dropdown when clicking outside
// document.addEventListener("click", function() {
// if (activeDropdown) {
// activeDropdown.style.display = 'none';
// activeDropdown = null;
// }
// });
// });
document.addEventListener("DOMContentLoaded", init);
function init() {
const table = document.getElementById("tickets-table");
let activeDropdown = null;
// Add click event listener to rows
table.querySelectorAll("tbody tr").forEach(row => {
const customDropdown = createCustomDropdown(row);
if (!customDropdown) return;
document.body.appendChild(customDropdown);
row.addEventListener("click", function(event) {
handleRowClick(event, customDropdown);
});
// Preserve click handlers and add auto-close
customDropdown.querySelectorAll('.dropdown-item').forEach(item => {
item.addEventListener('click', function(e) {
handleItemClick(e, item);
});
});
});
// Close dropdown when clicking outside
document.addEventListener("click", handleDocumentClick);
function createCustomDropdown(row) {
const originalDropdown = row.querySelector('.dropdown-menu');
if (!originalDropdown) return null;
const customDropdown = document.createElement('div');
customDropdown.className = 'custom-dropdown-menu';
// Clone original dropdown items while moving onclick handlers to data attributes
const originalItems = originalDropdown.querySelectorAll('.dropdown-item');
customDropdown.innerHTML = originalDropdown.innerHTML;
// Transfer onclick handlers to data attributes
customDropdown.querySelectorAll('.dropdown-item').forEach((item, index) => {
const originalItem = originalItems[index];
const originalOnclick = originalItem.getAttribute('onclick');
if (originalOnclick) {
item.setAttribute('data-onclick', originalOnclick);
item.removeAttribute('onclick'); // Remove original handler
}
});
return customDropdown;
}
function handleRowClick(event, customDropdown) {
if (event.target.closest('td:last-child')) return;
if (activeDropdown) {
activeDropdown.style.display = 'none';
}
const rect = event.target.getBoundingClientRect();
customDropdown.style.display = 'block';
customDropdown.style.position = 'fixed';
customDropdown.style.left = `${rect.left}px`;
customDropdown.style.top = `${rect.bottom + 5}px`;
activeDropdown = customDropdown;
event.stopPropagation();
}
function handleItemClick(e, item) {
e.preventDefault();
// Execute the stored onclick handler
const onclickAttr = item.getAttribute('data-onclick');
if (onclickAttr) {
eval(onclickAttr);
}
const href = item.getAttribute('href');
if (href && href !== '#') {
window.location.href = href;
}
if (activeDropdown) {
activeDropdown.style.display = 'none';
activeDropdown = null;
}
e.stopPropagation();
}
function handleDocumentClick() {
if (activeDropdown) {
activeDropdown.style.display = 'none';
activeDropdown = null;
}
}
}
</script>
<script>
$(document).ready(function() {
// Initialize select2
$("#clients").select2();
$("#policies").select2();
$("#branch_id").select2();
$("#status2").select2({
placeholder : 'Select Status'
});
$("textarea.select2-search__field").attr('rows', '1');
$("textarea.select2-search__field").css('resize', 'none');
// if ($('.select2-selection__arrow').length > 0) {
// $('.select2-selection__arrow').removeClass('select2-selection__arrow').addClass('fa fa-chevron-down');
// }
});
// Declare a global variable to store API response data
var clientPolicies = [];
var clientPoliciesWithBranch = {
policies: []
};
var client_id = '<?= isset($getData) ? $getData['client_id'] : '0' ?>';
var client_branch_id = '<?= isset($getData) ? $getData['branch_id'] : '0' ?>';
var statusData = <?= json_encode(isset($getData['status']) ? $getData['status'] : []) ?>;
$(document).ready(function() {
// Loop through each item in statusData and set the option as selected.
statusData.forEach(function(status) {
$('#status2 option[value="' + status + '"]').prop('selected', true);
});
// Refresh the select element (necessary if you are using a plugin like Select2).
$('#status2').trigger('change');
});
$(document).ready(function() {
console.log("document loaded");
//fetchClientPolicies();
});
$(window).on("load", function() {
console.log("window loaded");
fetchClientPolicies();
});
function fetchClientPolicies() {
$('#loader').show();
var apiURL = '<?php echo base_url();?>' + 'util/clients-with-policies';
console.log('fetchClientPolicies');
// console.log(apiURL);
$.ajax({
url: apiURL,
method: 'GET',
headers: {
"Content-Type": "application/json",
"X-Requested-With": "XMLHttpRequest"
},
success: function(response) {
// console.log(response.code);
// console.log(response.dataStatus);
// console.log(response.data);
if (response.code === 200 && response.dataStatus === true && response.data !== "") {
try {
clientPolicies = (response.data);
response.data.forEach(policy => {
// console.log('policies', policy.policies);
policy.policies.forEach(p => {
clientPoliciesWithBranch.policies.push(p);
});
});
// console.log('1',clientPolicies);
appendClients(clientPolicies);
//this function for reselect the policy
setTimeout(function() {
if (client_id != 0 ) {
var foundPolicies = clientPolicies.find(function(item) {
// console.log(typeof item.id)
return item.id == client_id;
});
appendBranch(foundPolicies.branchs);
}
}, 500);
setTimeout(function() {
if (client_branch_id != 0 ) {
var foundPolicies = clientPoliciesWithBranch.policies.filter(function(item) {
// console.log('item', item);
return item.branch_id === client_branch_id;
});
if (foundPolicies) {
// console.log('foundPolicies', foundPolicies);
appendPolicies(foundPolicies);
} else {
console.log('No policies found for the selected client');
}
}
}, 500);
//end
} catch (error) {
console.error('Error parsing API response data:', error);
}
} else if (response.code === 404 && response.dataStatus === false) {
console.error('no data found', response);
} else {
console.error('Something went wrong!');
}
},
error: function(xhr, status, error) {
console.error('Error fetching data from API:', error);
}
});
$('#loader').hide();
}
function appendClients(data) {
var clientID = <?= isset($getData) ? $getData['client_id'] : '0' ?>;
$.each(data, function(index, item) {
var option = $('<option>', {
value: item.id,
text: item.client_name
});
if (clientID == item.id) {
option.attr('selected', true);
}
$('#clients').append(option);
});
}
function appendBranch(data) {
$('#branch_id').empty();
$('#branch_id').append($('<option>', {
value: '0',
text: 'Select'
}));
$.each(data, function(index, item) {
var option = $('<option>', {
value: item.id,
text: item.branch_name
});
if (client_branch_id == item.id) {
option.attr('selected', true);
}
$('#branch_id').append(option);
});
}
function appendPolicies(data) {
$('#policies').empty();
$('#policies').append($('<option>', {
value: '0',
text: 'Select'
}));
var PolicyID = <?= isset($getData) ? $getData['policy_id'] : '0'?>;
// console.log(PolicyID)
$.each(data, function(index, item) {
var option = $('<option>', {
value: item.client_policy_id,
// text: `${item.name ?? ''} - ${item.policy_no ?? ''} - ${item.policy_type ?? ''}`
text:`${item.policy_type ?? ''} - ${item.policy_no ?? ''}`
});
if (PolicyID == item.client_policy_id) {
option.attr('selected', true);
}
$('#policies').append(option);
});
}
$(document).ready(function() {
$('#clients').on('change', function() {
$('#policies').empty();
$('#policies').append($('<option>', {
value: '0',
text: 'Select'
}));
var selectedClient = $(this).val();
// console.log('selectedClient', selectedClient);
// $('#selectedOptionInfo').text('Selected option: ' + selectedOption);
// Check if the selected option exists in apiData
var foundPolicies = clientPolicies.find(function(item) {
return item.id === selectedClient;
});
// console.log(foundPolicies.branchs);
appendBranch(foundPolicies.branchs);
});
});
$(document).ready(function() {
$('#branch_id').on('change', function() {
var selectedClient = $(this).val();
// console.log('selectedBranch', selectedClient);
// console.log('clientPolicies', clientPoliciesWithBranch);
var foundPolicies = clientPoliciesWithBranch.policies.filter(function(item) {
// console.log('item', item);
return item.branch_id === selectedClient;
});
if (Array.isArray(foundPolicies) && foundPolicies.length === 0) {
appendPolicies(foundPolicies);
toastr.warning('No policies found for the selected client branch.');
} else {
// console.log('foundPolicies', foundPolicies);
appendPolicies(foundPolicies);
}
});
});
// Function to convert object to query parameters
function objectToQueryString(obj) {
return Object.keys(obj).map(key => `${encodeURIComponent(key)}=${encodeURIComponent(obj[key])}`).join('&');
}
function fetchEmpolyeeList(event = null) {
if(event){
event.preventDefault(); // Prevent default action
}
var client_id = $('#clients').val();
var policy_id = $('#policies').val();
var status = $('#status2').val();
var branch_id = $('#branch_id').val();
var emp_code = $('#emp_code').val();
var emp_name = $('#emp_name').val();
var statusArray = [];
$('#status2 option:selected').each(function() {
statusArray.push($(this).val());
});
// console.log(client_id + '-' + policy_id);
// if (client_id == '0' || policy_id == '0') {
// alert('Please select values in both dropdowns.');
// return;
// }
var queryParams = {
client_id: client_id,
policy_id: policy_id,
branch_id: branch_id,
emp_code : emp_code,
emp_name : emp_name,
status : statusArray,
};
const queryString = objectToQueryString(queryParams);
const apiURL = $('#get-emp-list').attr('href') + "?" + queryString;
// console.log(apiURL);
// window.location.href = apiURL;
$('.loader').fadeIn();
$('.loader-mask').fadeIn();
// var apiURL2 = $('#get-emp-list').attr('href'); // Get href attribute value
console.log(apiURL);
$.ajax({
url: apiURL,
method: 'GET',
data: queryParams,
success: function(response) {
if(response.status == true){
$('#employee_table_list').html(response.html);
$('.loader').fadeOut();
$('.loader-mask').delay(350).fadeOut('slow');
setTimeout(function(){
init()
}, 1000)
}
},
error: function(xhr, status, error) {
console.error('Error:', error);
toastr.error('Failed to fetch Data','Error');
$('.loader').fadeOut();
$('.loader-mask').delay(350).fadeOut('slow');
}
});
}
document.getElementById('toggleIcon').addEventListener('click', function() {
var icon = document.getElementById('icon');
icon.classList.toggle('mdi-chevron-down');
icon.classList.toggle('mdi-chevron-up');
});
function sendManualEcard(input)
{
console.log('sendManualEcard function called');
var client_id = $('#clients').val()
var client_branch_id = $('#branch_id').val()
var policy_id = $('#policies').val()
console.log('input', input);
console.log('client_id', client_id);
console.log('client_branch_id', client_branch_id);
if(client_id == 0 || client_branch_id == 0 || policy_id == 0)
{
Swal.fire({
title: "warning!",
text: 'Please select the Client, Client Branch and Policy.',
icon: "warning"
});
return false
}
Swal.fire({
title: "Do you want to send Ecard Mail?",
showDenyButton: true,
showCancelButton: false,
confirmButtonText: "Yes,Send",
denyButtonText: "Don't Send"
}).then((result) => {
if (result.isConfirmed) {
$.ajax({
url: '<?= base_url("util/send_manual_ecard/") ?>' + client_id + '/' + client_branch_id+'/'+policy_id,
type: "GET",
dataType: 'json',
success: function(res) {
console.log('send_manual_ecard', res)
$('.loader').fadeOut();
$('.loader-mask').delay(350).fadeOut('slow');
if(res.status == false){
toastr.info(res.message, 'Info');
}else{
toastr.success(res.message, 'Success');
}
},
error: function(xhr, status, error) {
console.error(xhr.responseText);
console.error(status, error);
$('.loader').fadeOut();
$('.loader-mask').delay(350).fadeOut('slow');
}
});
// Swal.fire("Saved!", "", "success");
}
});
}
</script>