Attendance full view : GWM

This commit is contained in:
Gowtham M 2025-04-07 12:32:44 +05:30
parent 6f81ce7617
commit 03976f97a8
2 changed files with 84 additions and 33 deletions

View File

@ -237,28 +237,48 @@ $currentday = date('d');
</div>
<div class="row">
<div class="col-12">
<div class="card">
<div class="card" id="fullscreenDiv">
<div class="card-body">
<div id="successMessage" style="display: none; position: absolute; top: 10px; left: 50%; transform: translateX(-50%);background: green; color: white; padding: 10px; border-radius: 5px; z-index: 1000;"></div>
<?php
$attributes = array('id' => 'atten');
echo form_open('attendance', $attributes); ?>
<div class="row">
<div class="col-2">
<?php $today = date('M-Y'); ?>
<input type="text" name="month" id="month" value="<?php echo $datefordropdown; ?>" class="form-control" data-provide="datepicker" data-date-format="M-yyyy" data-date-min-view-mode="1">
<div class="row">
<div class="col-md-2">
<?php $today = date('M-Y'); ?>
<input type="text" name="month" id="month" value="<?php echo $datefordropdown; ?>" class="form-control" data-provide="datepicker" data-date-format="M-yyyy" data-date-min-view-mode="1">
</div>
<div class="col-1">
<input type="submit" value="Change Month" class="btn btn-success"
title='click here for load attendance for specified month' style="margin-top:0px;">
</div>
<div class="col-9 text-right d-flex" style="justify-content: end;" id="savebutton">
<input type="text" id="searchInput" placeholder="Search..." style="padding: 8px;margin-bottom: 10px;width: 250px;border: 1px solid #ccc;border-radius: 5px;margin-right:15px;">
<i id="exportButton" class="fas fa-download download-icon" style="margin-right: 15px;margin-top: 8px;font-size:25px;" title="Export Excel"></i>
<i class="fe-maximize noti-icon" onclick="toggleDivFullscreen()" style="margin-right: 15px;margin-top: 5px;font-size: 28px;" title="Full screen view"></i>
<i class="fas fa-save" id="c" style="margin-right: 15px;margin-top: 5px;font-size:28px;" title="Save"></i>
</div>
<!--
<div class="col-1 text-right">
<i id="exportButton" class="fas fa-download download-icon" style="font-size: x-large; margin-top:12px;" title="Export Excel"></i>
</div>
<div class="col-8 text-right">
<input type="button" class="btn btn-success" id="c" value="save" style="margin-top:0px;">
</div>
</div> -->
</div>
<?php echo form_close(); ?>
@ -284,7 +304,7 @@ $currentday = date('d');
?>
<!-- Add table-responsive for horizontal scroll -->
<div class="table-responsive">
<div class="table-responsive" id="table-responsive">
<table id="attendance" class="fht-table table table-striped" style="font-size: small;">
@ -570,7 +590,7 @@ $currentday = date('d');
var totaldata = 0;
$('#loader').show();
showMessage('Processing , Please wait a moment....');
$.ajax({
data: {
param1: alldata,
@ -584,12 +604,8 @@ $currentday = date('d');
success: function(data) {
if (data) {
$('#loader').hide();
alert(data);
//totaldata = totaldata + parseFloat(data);
//console.log(data);
showMessage(data);
}
}
@ -1018,4 +1034,55 @@ $(document).ready(function () {
}
}
function toggleDivFullscreen() {
let div = document.getElementById("fullscreenDiv");
let tableResponsive = document.getElementById("table-responsive"); // Select the table container inside div
if (!document.fullscreenElement) {
div.requestFullscreen().then(() => {
div.style.width = "100vw"; // Full viewport width
div.style.height = "100vh"; // Full viewport height
// If .table-responsive exists, set its height to 90vh
if (tableResponsive) {
tableResponsive.style.maxHeight = "90vh";
tableResponsive.style.overflowY = "auto"; // Allow scrolling if needed
}
}).catch(err => console.log("Error enabling fullscreen:", err));
} else {
document.exitFullscreen().then(() => {
div.style.width = "100%";
div.style.height = "100%";
// Reset .table-responsive height when exiting fullscreen
if (tableResponsive) {
tableResponsive.style.height = "auto";
}
}).catch(err => console.log("Error exiting fullscreen:", err));
}
}
function showMessage(msg) {
let msgBox = document.getElementById("successMessage");
msgBox.innerText = msg; // Set API message
msgBox.style.display = "block";
// Hide message after 3 seconds
setTimeout(() => {
msgBox.style.display = "none";
}, 3000);
}
$("#searchInput").on("keyup", function () {
let value = $(this).val().toLowerCase(); // Convert input to lowercase for case-insensitive search
$("#table-responsive tbody tr").filter(function () {
$(this).toggle($(this).text().toLowerCase().indexOf(value) > -1);
});
});
</script>

View File

@ -128,22 +128,7 @@
<div class="card" id="fullscreenDiv">
<div class="card-body" >
<div id="successMessage" style="display: none; position: absolute; top: 10px; left: 50%; transform: translateX(-50%);background: green; color: white; padding: 10px; border-radius: 5px; z-index: 1000;"></div>
<div class="box">
<div class="box-header">
<!--<center><h3 class="box-title">-->
<div class="box-tools">
<!-- <p><b>
The <span style="background-color:#ff4d4d;">Red</span> highlighted Employee have loan
to pay. Put <span style="background-color:#66ff33;">'NA'</span> for Skip Current
Month Loan Due.
</b></p> -->
</div>
<!--</h3></center>-->
</div><!-- /.box-header -->
<?php
$year = date("Y");
@ -945,7 +930,7 @@ $(document).ready(function () {
alldata = JSON.stringify(alldata);
var month = $('#monthyear').val();
$('#loader').show();
showMessage('Processing , Please wait a moment....');
$.ajax({
data: {
param1: alldata,
@ -957,8 +942,7 @@ $(document).ready(function () {
success: function(data) {
if (data) {
$('#loader').hide();
// alert(data);
showMessage(data);
}