admin/marco.pms.mobileapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Add employee list skeleton loader for improved loading experience

Browse Source
This commit is contained in:
Vaibhav Surve 2025-06-19 16:22:48 +05:30
parent ef6521faa2
commit 97c873167f
1 changed files with 80 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

89
lib/view/dashboard/Attendence/attendance_screen.dart
View File

@ -304,10 +304,7 @@ class _AttendanceScreenState extends State<AttendanceScreen> with UIMixin {
), ),
), ),
if (isLoading) if (isLoading)
const SizedBox( employeeListSkeletonLoader()
height: 120,
child: Center(child: CircularProgressIndicator()),
)
else if (employees.isEmpty) else if (employees.isEmpty)
SizedBox( SizedBox(
height: 120, height: 120,
@ -453,6 +450,80 @@ class _AttendanceScreenState extends State<AttendanceScreen> with UIMixin {
}); });
} }
Widget employeeListSkeletonLoader() {
return MyCard.bordered(
borderRadiusAll: 4,
paddingAll: 8,
child: Column(
children: List.generate(4, (index) {
return Column(
children: [
Padding(
padding: const EdgeInsets.only(bottom: 8),
child: Row(
children: [
// Avatar placeholder
Container(
width: 31,
height: 31,
decoration: BoxDecoration(
color: Colors.grey.shade300,
shape: BoxShape.circle,
),
),
MySpacing.width(16),
// Employee name/designation & buttons
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
height: 12,
width: 100,
color: Colors.grey.shade300,
),
MySpacing.height(8),
Container(
height: 10,
width: 80,
color: Colors.grey.shade300,
),
MySpacing.height(12),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
Container(
height: 28,
width: 60,
color: Colors.grey.shade300,
),
MySpacing.width(8),
Container(
height: 28,
width: 60,
color: Colors.grey.shade300,
),
],
),
],
),
),
],
),
),
if (index != 3)
Divider(
color: Colors.grey.withOpacity(0.3),
thickness: 1,
height: 1,
),
],
);
}),
),
);
}
Widget employeeLog() { Widget employeeLog() {
return Obx(() { return Obx(() {
final logs = List.of(attendanceController.attendanceLogs); final logs = List.of(attendanceController.attendanceLogs);
@ -503,10 +574,7 @@ class _AttendanceScreenState extends State<AttendanceScreen> with UIMixin {
), ),
), ),
if (attendanceController.isLoadingAttendanceLogs.value) if (attendanceController.isLoadingAttendanceLogs.value)
const SizedBox( employeeListSkeletonLoader()
height: 120,
child: Center(child: CircularProgressIndicator()),
)
else if (logs.isEmpty) else if (logs.isEmpty)
SizedBox( SizedBox(
height: 120, height: 120,
@ -691,10 +759,7 @@ class _AttendanceScreenState extends State<AttendanceScreen> with UIMixin {
Obx(() { Obx(() {
final employees = attendanceController.regularizationLogs; final employees = attendanceController.regularizationLogs;
if (attendanceController.isLoadingRegularizationLogs.value) { if (attendanceController.isLoadingRegularizationLogs.value) {
return SizedBox( return employeeListSkeletonLoader();
height: 120,
child: const Center(child: CircularProgressIndicator()),
);
} }
if (employees.isEmpty) { if (employees.isEmpty) {