nhance/app/Views/employee_list.php

760 lines
28 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 class="card-body">
<div id="accordion" class="mb-3">
<div class="card mb-1">
<h4>
Filter
<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>
</h4>
<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"
style="background-color: #F5FFFF; color:black; border:1px solid #00999E;"
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>
</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);
}
// Handle href navigation
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');
// }
});
var client_list = ''; // local variable for storing the client branch list
var branch_list = ''; // local variable for storing the client branch list
var policy_list = ''; // local variable for storing the client policy list
var branch_policy = '';
var policy_list_by_client = '';
$(document).ready(function() {
getClientAndBranchAndPolicy();
})
//featch client and branch and policy
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;
policy_list = res.policy_data;
policy_list_by_client = res.policyListByClient;
appendClients(client_list);
// appendBranch(branch_list);
// appendPolicies(policy_list);
} else {
console.log('No data found');
}
},
error: function(xhr, status, error) {
console.error(xhr.responseText);
console.error(status, error);
}
});
}
// 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 ?? ''}`
value: item.id,
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() {
$('#branch_id').empty();
$('#branch_id').append($('<option>', { value: '0', text: 'Select'}));
$('#policies').empty();
$('#policies').append($('<option>', {
value: '0',
text: 'Select'
}));
var selectedClient = $(this).val();
// alert(selectedClient);
// console.log(branch_list);
var filteredBranch = branch_list[selectedClient];
if (filteredBranch) {
console.log("Found Data for Client " + selectedClient, filteredBranch);
appendBranch(filteredBranch);
} else {
console.warn("No data found for client ID: " + selectedClient);
}
});
});
$(document).ready(function() {
$('#branch_id').on('change', function() {
var selectedBranch = $(this).val();
var selectedClient = $('#clients').val();
var filteredPoliciesByClient = policy_list_by_client[selectedClient];
var filteredPoliciesByBranch = filteredPoliciesByClient.filter(function(item) {
// console.log('item', item);
return item.client_branch_id === selectedBranch;
});
console.log("filteredPoliciesByClient => ",filteredPoliciesByClient);
console.log("filteredPoliciesByBranch => ",filteredPoliciesByBranch);
if (Array.isArray(filteredPoliciesByBranch) && filteredPoliciesByBranch.length === 0) {
appendPolicies(filteredPoliciesByBranch);
toastr.warning('No policies found for the selected client branch.');
} else {
appendPolicies(filteredPoliciesByBranch);
}
});
});
// 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>