Skip to content

Attendance Bulk

Can be filter by center, department or department All, date
Selected Date should be based on the calendar
columns should be load based on the calendar date type(DOT Hours, TOT Hours like wise), if it’s working date load - OTHours, OTRate, NormalOT Amount
Mercantile - DOTHours, DOTRate, DoubleOT
Salutary - TOTHours, TOTRate, TripleOT
isAttProcessDone value should be true when save the attendance check it in tblpay_attendancetransaction table
Load isNoPay value true values
Editable columns are InTime,OutTime,OTHours,OTRate, OTAmount

InTime , OutTime, OTHours, OTRate, OTRate coulmn should be editable.
If no records available based on the selected date range , load employee code,name and date . Date should be load between selected date range. InTime , OutTime, OTHours, OTRate, OTRate this coumn should be empty but editable
Table header make fixed
I have get the OT type show the different colord to identify is that date OT,DOT or TOT to give the best user experience
remove to indicate OT Type using column, I expect to show small label

show type of OT as small label with different color , right side top of the OT hours Text Field.
Load up to selected date range , if not exist records, if already exists for some date , load with them
And adjust UI filtration part

Load data up to the selected date range.
If no records exist for a given employee and date within that range, populate with empty rows including:
Employee Code, Employee Name, and Date (pre-filled),
In Time, Out Time, OT Hours, OT Rate, and OT Amount (empty but editable).
If records already exist for some of the dates, load those with the saved values.
2. OT Type UI Badge:
For each row, show the OT Type (e.g., OT, DOT, TOT) as a small colored label/badge.
Place this badge at the top-right corner of the OT Hours text field to give a clear and visually intuitive indication of OT type.
Use distinct colors per type (e.g., blue for OT, orange for DOT, green for TOT).
3. mprove Filter Section:
Refine the UI layout of the filter controls (e.g., date range, employee selection, department).
Ensure the filter section is well-aligned, responsive, and does not shift when the table loads or reloads.
Load employees attendance based on the select date range , if the attendance exist or not load all dates based on the selected date range , If the attendance already exist in the tblpay_attendnance transaction load them , Just say attendance have only for few dates in the table , load them with values others should be load with out intime, outime and other details , only enough emp code ,emp name , date, intime,outime ,ot hours, Ot rate , ot amount ,

Improve by code by adding only I have mentioned thing:
Add Linnear progress bar to loading in appropriate way
Add the proper option if all below options are false: ​if (workdayType.isWorkday) otLabel = 'OT';
else if (workdayType.isMercantile) otLabel = 'DOT'; else if (workdayType.isSalutaryHol) otLabel = 'TOT';

when the user use tab key to move , is that possible to skip the Date Time filed symbol
Want to print your doc?
This is not the way.
Try clicking the ··· in the right corner or using a keyboard shortcut (
CtrlP
) instead.