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

feat: Enhance AttendanceLogViewButton with state management and improved log display

Browse Source
This commit is contained in:
Vaibhav Surve 2025-09-25 14:42:22 +05:30
parent 7c21324b42
commit 98612db7b5
2 changed files with 335 additions and 188 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

129
lib/model/attendance/attendance_log_view_model.dart
View File

@ -1,57 +1,114 @@
import 'package:intl/intl.dart'; import 'package:intl/intl.dart';
class AttendanceLogViewModel { class Employee {
final DateTime? activityTime; final String id;
final String? imageUrl; final String firstName;
final String? comment; final String lastName;
final String? thumbPreSignedUrl; final String? photo;
final String? preSignedUrl; final String jobRoleId;
final String? longitude; final String jobRoleName;
final String? latitude;
final int? activity;
AttendanceLogViewModel({ Employee({
this.activityTime, required this.id,
this.imageUrl, required this.firstName,
this.comment, required this.lastName,
this.thumbPreSignedUrl, this.photo,
this.preSignedUrl, required this.jobRoleId,
this.longitude, required this.jobRoleName,
this.latitude,
required this.activity,
}); });
factory AttendanceLogViewModel.fromJson(Map<String, dynamic> json) { factory Employee.fromJson(Map<String, dynamic> json) {
return AttendanceLogViewModel( return Employee(
activityTime: json['activityTime'] != null id: json['id'],
? DateTime.tryParse(json['activityTime']) firstName: json['firstName'] ?? '',
: null, lastName: json['lastName'] ?? '',
imageUrl: json['imageUrl']?.toString(), photo: json['photo']?.toString(),
comment: json['comment']?.toString(), jobRoleId: json['jobRoleId'] ?? '',
thumbPreSignedUrl: json['thumbPreSignedUrl']?.toString(), jobRoleName: json['jobRoleName'] ?? '',
preSignedUrl: json['preSignedUrl']?.toString(),
longitude: json['longitude']?.toString(),
latitude: json['latitude']?.toString(),
activity: json['activity'] ?? 0,
); );
} }
Map<String, dynamic> toJson() { Map<String, dynamic> toJson() {
return { return {
'activityTime': activityTime?.toIso8601String(), 'id': id,
'imageUrl': imageUrl, 'firstName': firstName,
'lastName': lastName,
'photo': photo,
'jobRoleId': jobRoleId,
'jobRoleName': jobRoleName,
};
}
}
class AttendanceLogViewModel {
final String id;
final String? comment;
final Employee employee;
final DateTime? activityTime;
final int activity;
final String? photo;
final String? thumbPreSignedUrl;
final String? preSignedUrl;
final String? longitude;
final String? latitude;
final DateTime? updatedOn;
final Employee? updatedByEmployee;
final String? documentId;
AttendanceLogViewModel({
required this.id,
this.comment,
required this.employee,
this.activityTime,
required this.activity,
this.photo,
this.thumbPreSignedUrl,
this.preSignedUrl,
this.longitude,
this.latitude,
this.updatedOn,
this.updatedByEmployee,
this.documentId,
});
factory AttendanceLogViewModel.fromJson(Map<String, dynamic> json) {
return AttendanceLogViewModel(
id: json['id'],
comment: json['comment']?.toString(),
employee: Employee.fromJson(json['employee']),
activityTime: json['activityTime'] != null ? DateTime.tryParse(json['activityTime']) : null,
activity: json['activity'] ?? 0,
photo: json['photo']?.toString(),
thumbPreSignedUrl: json['thumbPreSignedUrl']?.toString(),
preSignedUrl: json['preSignedUrl']?.toString(),
longitude: json['longitude']?.toString(),
latitude: json['latitude']?.toString(),
updatedOn: json['updatedOn'] != null ? DateTime.tryParse(json['updatedOn']) : null,
updatedByEmployee: json['updatedByEmployee'] != null ? Employee.fromJson(json['updatedByEmployee']) : null,
documentId: json['documentId']?.toString(),
);
}
Map<String, dynamic> toJson() {
return {
'id': id,
'comment': comment, 'comment': comment,
'employee': employee.toJson(),
'activityTime': activityTime?.toIso8601String(),
'activity': activity,
'photo': photo,
'thumbPreSignedUrl': thumbPreSignedUrl, 'thumbPreSignedUrl': thumbPreSignedUrl,
'preSignedUrl': preSignedUrl, 'preSignedUrl': preSignedUrl,
'longitude': longitude, 'longitude': longitude,
'latitude': latitude, 'latitude': latitude,
'activity': activity, 'updatedOn': updatedOn?.toIso8601String(),
'updatedByEmployee': updatedByEmployee?.toJson(),
'documentId': documentId,
}; };
} }
String? get formattedDate => activityTime != null String? get formattedDate =>
? DateFormat('yyyy-MM-dd').format(activityTime!) activityTime != null ? DateFormat('yyyy-MM-dd').format(activityTime!) : null;
: null;
String? get formattedTime => String? get formattedTime =>
activityTime != null ? DateFormat('hh:mm a').format(activityTime!) : null; activityTime != null ? DateFormat('hh:mm a').format(activityTime!) : null;

260
lib/model/attendance/log_details_view.dart
View File

@ -2,16 +2,24 @@ import 'package:flutter/material.dart';
import 'package:url_launcher/url_launcher.dart'; import 'package:url_launcher/url_launcher.dart';
import 'package:marco/helpers/widgets/my_text.dart'; import 'package:marco/helpers/widgets/my_text.dart';
import 'package:marco/helpers/utils/base_bottom_sheet.dart'; import 'package:marco/helpers/utils/base_bottom_sheet.dart';
import 'package:marco/helpers/utils/date_time_utils.dart';
class AttendanceLogViewButton extends StatelessWidget { class AttendanceLogViewButton extends StatefulWidget {
final dynamic employee; final dynamic employee;
final dynamic attendanceController; final dynamic attendanceController;
const AttendanceLogViewButton({ const AttendanceLogViewButton({
Key? key, Key? key,
required this.employee, required this.employee,
required this.attendanceController, required this.attendanceController,
}) : super(key: key); }) : super(key: key);
@override
State<AttendanceLogViewButton> createState() =>
_AttendanceLogViewButtonState();
}
class _AttendanceLogViewButtonState extends State<AttendanceLogViewButton> {
Future<void> _openGoogleMaps( Future<void> _openGoogleMaps(
BuildContext context, double lat, double lon) async { BuildContext context, double lat, double lon) async {
final url = 'https://www.google.com/maps/search/?api=1&query=$lat,$lon'; final url = 'https://www.google.com/maps/search/?api=1&query=$lat,$lon';
@ -48,7 +56,8 @@ class AttendanceLogViewButton extends StatelessWidget {
} }
void _showLogsBottomSheet(BuildContext context) async { void _showLogsBottomSheet(BuildContext context) async {
await attendanceController.fetchLogsView(employee.id.toString()); await widget.attendanceController
.fetchLogsView(widget.employee.id.toString());
showModalBottomSheet( showModalBottomSheet(
context: context, context: context,
@ -57,29 +66,37 @@ class AttendanceLogViewButton extends StatelessWidget {
borderRadius: BorderRadius.vertical(top: Radius.circular(16)), borderRadius: BorderRadius.vertical(top: Radius.circular(16)),
), ),
backgroundColor: Colors.transparent, backgroundColor: Colors.transparent,
builder: (context) => BaseBottomSheet( builder: (context) {
Map<int, bool> expandedDescription = {};
return BaseBottomSheet(
title: "Attendance Log", title: "Attendance Log",
onCancel: () => Navigator.pop(context), onCancel: () => Navigator.pop(context),
onSubmit: () => Navigator.pop(context), onSubmit: () => Navigator.pop(context),
showButtons: false, showButtons: false,
child: attendanceController.attendenceLogsView.isEmpty child: widget.attendanceController.attendenceLogsView.isEmpty
? Padding( ? Padding(
padding: const EdgeInsets.symmetric(vertical: 24.0), padding: const EdgeInsets.symmetric(vertical: 24.0),
child: Column( child: Column(
children: const [ children: [
Icon(Icons.info_outline, size: 40, color: Colors.grey), Icon(Icons.info_outline, size: 40, color: Colors.grey),
SizedBox(height: 8), SizedBox(height: 8),
Text("No attendance logs available."), MyText.bodySmall("No attendance logs available."),
], ],
), ),
) )
: ListView.separated( : StatefulBuilder(
builder: (context, setStateSB) {
return ListView.separated(
shrinkWrap: true, shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(), physics: const NeverScrollableScrollPhysics(),
itemCount: attendanceController.attendenceLogsView.length, itemCount:
widget.attendanceController.attendenceLogsView.length,
separatorBuilder: (_, __) => const SizedBox(height: 16), separatorBuilder: (_, __) => const SizedBox(height: 16),
itemBuilder: (_, index) { itemBuilder: (_, index) {
final log = attendanceController.attendenceLogsView[index]; final log = widget
.attendanceController.attendenceLogsView[index];
return Container( return Container(
decoration: BoxDecoration( decoration: BoxDecoration(
color: Theme.of(context).colorScheme.surfaceVariant, color: Theme.of(context).colorScheme.surfaceVariant,
@ -92,89 +109,41 @@ class AttendanceLogViewButton extends StatelessWidget {
) )
], ],
), ),
padding: const EdgeInsets.all(8), padding: const EdgeInsets.all(12),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Expanded(
flex: 3,
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
// Header: Icon + Date + Time
Row( Row(
children: [ children: [
_getLogIcon(log), _getLogIcon(log),
const SizedBox(width: 10), const SizedBox(width: 12),
Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: [
MyText.bodyLarge( MyText.bodyLarge(
log.formattedDate ?? '-', (log.formattedDate != null &&
log.formattedDate!.isNotEmpty)
? DateTimeUtils.convertUtcToLocal(
log.formattedDate!,
format: 'd MMM yyyy',
)
: '-',
fontWeight: 600, fontWeight: 600,
), ),
const SizedBox(width: 12),
MyText.bodySmall( MyText.bodySmall(
"Time: ${log.formattedTime ?? '-'}", log.formattedTime != null
? "Time: ${log.formattedTime}"
: "",
color: Colors.grey[700], color: Colors.grey[700],
), ),
], ],
), ),
],
),
const SizedBox(height: 12), const SizedBox(height: 12),
const Divider(height: 1, color: Colors.grey),
// Middle Row: Image + Text (Done by, Description & Location)
Row( Row(
crossAxisAlignment: crossAxisAlignment: CrossAxisAlignment.start,
CrossAxisAlignment.start,
children: [ children: [
if (log.latitude != null && // Image Column
log.longitude != null)
GestureDetector(
onTap: () {
final lat = double.tryParse(
log.latitude.toString()) ??
0.0;
final lon = double.tryParse(
log.longitude.toString()) ??
0.0;
if (lat >= -90 &&
lat <= 90 &&
lon >= -180 &&
lon <= 180) {
_openGoogleMaps(
context, lat, lon);
} else {
ScaffoldMessenger.of(context)
.showSnackBar(
const SnackBar(
content: Text(
'Invalid location coordinates')),
);
}
},
child: const Padding(
padding:
EdgeInsets.only(right: 8.0),
child: Icon(Icons.location_on,
size: 18, color: Colors.blue),
),
),
Expanded(
child: MyText.bodyMedium(
log.comment?.isNotEmpty == true
? log.comment
: "No description provided",
fontWeight: 500,
),
),
],
),
],
),
),
const SizedBox(width: 16),
if (log.thumbPreSignedUrl != null) if (log.thumbPreSignedUrl != null)
GestureDetector( GestureDetector(
onTap: () { onTap: () {
@ -190,24 +159,145 @@ class AttendanceLogViewButton extends StatelessWidget {
height: 60, height: 60,
width: 60, width: 60,
fit: BoxFit.cover, fit: BoxFit.cover,
errorBuilder: (context, error, stackTrace) { errorBuilder: (_, __, ___) =>
return const Icon(Icons.broken_image, const Icon(Icons.broken_image,
size: 20, color: Colors.grey); size: 40, color: Colors.grey),
),
),
),
if (log.thumbPreSignedUrl != null)
const SizedBox(width: 12),
// Text Column
Expanded(
child: Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: [
// Done by
if (log.updatedByEmployee != null)
MyText.bodySmall(
"By: ${log.updatedByEmployee!.firstName} ${log.updatedByEmployee!.lastName}",
color: Colors.grey[700],
),
const SizedBox(height: 8),
// Location
if (log.latitude != null &&
log.longitude != null)
Row(
crossAxisAlignment:
CrossAxisAlignment.center,
children: [
GestureDetector(
onTap: () {
final lat = double.tryParse(
log.latitude
.toString()) ??
0.0;
final lon = double.tryParse(
log.longitude
.toString()) ??
0.0;
if (lat >= -90 &&
lat <= 90 &&
lon >= -180 &&
lon <= 180) {
_openGoogleMaps(
context, lat, lon);
} else {
ScaffoldMessenger.of(
context)
.showSnackBar(
SnackBar(
content: MyText.bodySmall(
"Invalid location coordinates")),
);
}
}, },
child: Row(
children: [
Icon(Icons.location_on,
size: 16,
color: Colors.blue),
SizedBox(width: 4),
MyText.bodySmall(
"View Location",
color: Colors.blue,
decoration:
TextDecoration.underline,
),
],
), ),
), ),
],
),
const SizedBox(height: 8),
// Description with label and more/less using MyText
if (log.comment != null &&
log.comment!.isNotEmpty)
Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: [
MyText.bodySmall(
"Description: ${log.comment!}",
maxLines: expandedDescription[
index] ==
true
? null
: 2,
overflow: expandedDescription[
index] ==
true
? TextOverflow.visible
: TextOverflow.ellipsis,
),
if (log.comment!.length > 100)
GestureDetector(
onTap: () {
setStateSB(() {
expandedDescription[
index] =
!(expandedDescription[
index] ==
true);
});
},
child: MyText.bodySmall(
expandedDescription[
index] ==
true
? "less"
: "more",
color: Colors.blue,
fontWeight: 600,
),
),
],
) )
else else
const Icon(Icons.broken_image, MyText.bodySmall(
size: 20, color: Colors.grey), "Description: No description provided",
fontWeight: 700,
),
],
),
),
], ],
), ),
], ],
), ),
); );
}, },
);
},
), ),
), );
},
); );
} }
@ -222,12 +312,12 @@ class AttendanceLogViewButton extends StatelessWidget {
textStyle: const TextStyle(fontSize: 12), textStyle: const TextStyle(fontSize: 12),
padding: const EdgeInsets.symmetric(horizontal: 12), padding: const EdgeInsets.symmetric(horizontal: 12),
), ),
child: const FittedBox( child: FittedBox(
fit: BoxFit.scaleDown, fit: BoxFit.scaleDown,
child: Text( child: MyText.bodySmall(
"View", "View",
overflow: TextOverflow.ellipsis, overflow: TextOverflow.ellipsis,
style: TextStyle(fontSize: 12, color: Colors.white), color: Colors.white,
), ),
), ),
), ),
@ -248,7 +338,7 @@ class AttendanceLogViewButton extends StatelessWidget {
final today = DateTime(now.year, now.month, now.day); final today = DateTime(now.year, now.month, now.day);
final logDay = DateTime(logDate.year, logDate.month, logDate.day); final logDay = DateTime(logDate.year, logDate.month, logDate.day);
final yesterday = today.subtract(Duration(days: 1)); final yesterday = today.subtract(const Duration(days: 1));
isTodayOrYesterday = (logDay == today) || (logDay == yesterday); isTodayOrYesterday = (logDay == today) || (logDay == yesterday);
} }