done landscape responsive of all screen

This commit is contained in:
Manish 2025-11-18 10:50:50 +05:30
parent d05e26bc87
commit c94efac1de
7 changed files with 606 additions and 422 deletions

View File

@ -282,90 +282,129 @@ class ExpenseList extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
if (expenseList.isEmpty && !Get.find<ExpenseController>().isLoading.value) { final ExpenseController controller = Get.find<ExpenseController>();
return Center(child: MyText.bodyMedium('No expenses found.'));
}
return ListView.separated( return SafeArea(
padding: const EdgeInsets.fromLTRB(12, 12, 12, 80), child: LayoutBuilder(
itemCount: expenseList.length, builder: (context, constraints) {
separatorBuilder: (_, __) => final bool isLandscape = constraints.maxWidth > constraints.maxHeight;
Divider(color: Colors.grey.shade300, height: 20),
itemBuilder: (context, index) {
final expense = expenseList[index];
final formattedDate = DateTimeUtils.convertUtcToLocal(
expense.transactionDate.toIso8601String(),
format: 'dd MMM yyyy',
);
return Material( if (controller.isLoading.value && expenseList.isEmpty) {
color: Colors.transparent, return const Center(child: CircularProgressIndicator());
child: InkWell( }
borderRadius: BorderRadius.circular(8),
onTap: () async { if (expenseList.isEmpty) {
final result = await Get.to( return const Center(
() => ExpenseDetailScreen(expenseId: expense.id), child: Text(
arguments: {'expense': expense}, 'No expenses found.',
); style: TextStyle(color: Colors.grey),
if (result == true && onViewDetail != null) { ),
await onViewDetail!(); );
} }
},
child: Padding( // PORTRAIT MODE
padding: const EdgeInsets.symmetric(vertical: 8), if (!isLandscape) {
child: Column( return ListView.separated(
crossAxisAlignment: CrossAxisAlignment.start, padding: const EdgeInsets.fromLTRB(12, 12, 12, 80),
itemCount: expenseList.length,
separatorBuilder: (_, __) =>
Divider(color: Colors.grey.shade300, height: 20),
itemBuilder: _buildItem,
);
}
// LANDSCAPE WRAP IN SCROLL FOR SAFETY
return SingleChildScrollView(
child: SizedBox(
height: constraints.maxHeight * 1.3,
child: ListView.separated(
padding: const EdgeInsets.fromLTRB(12, 12, 12, 80),
itemCount: expenseList.length,
separatorBuilder: (_, __) =>
Divider(color: Colors.grey.shade300, height: 20),
itemBuilder: _buildItem,
),
),
);
},
),
);
}
Widget _buildItem(BuildContext context, int index) {
final expense = expenseList[index];
final formattedDate = DateTimeUtils.convertUtcToLocal(
expense.transactionDate.toIso8601String(),
format: 'dd MMM yyyy',
);
return Material(
color: Colors.transparent,
child: InkWell(
borderRadius: BorderRadius.circular(8),
onTap: () async {
final result = await Get.to(
() => ExpenseDetailScreen(expenseId: expense.id),
arguments: {'expense': expense},
);
if (result == true && onViewDetail != null) {
await onViewDetail!();
}
},
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 8),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [ children: [
MyText.bodyMedium(expense.expenseCategory.name,
fontWeight: 600),
Row( Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [ children: [
MyText.bodyMedium(expense.expenseCategory.name, MyText.bodyMedium('${expense.formattedAmount}',
fontWeight: 600), fontWeight: 600),
Row( if (expense.status.name.toLowerCase() == 'draft') ...[
children: [ const SizedBox(width: 8),
MyText.bodyMedium('${expense.formattedAmount}', GestureDetector(
fontWeight: 600), onTap: () =>
if (expense.status.name.toLowerCase() == 'draft') ...[ _showDeleteConfirmation(context, expense),
const SizedBox(width: 8), child: const Icon(Icons.delete,
GestureDetector( color: Colors.red, size: 20),
onTap: () =>
_showDeleteConfirmation(context, expense),
child: const Icon(Icons.delete,
color: Colors.red, size: 20),
),
],
],
),
],
),
const SizedBox(height: 6),
Row(
children: [
MyText.bodySmall(formattedDate, fontWeight: 500),
const Spacer(),
Container(
padding: const EdgeInsets.symmetric(
horizontal: 8, vertical: 4),
decoration: BoxDecoration(
color: Color(int.parse(
'0xff${expense.status.color.substring(1)}'))
.withOpacity(0.5),
borderRadius: BorderRadius.circular(5),
), ),
child: MyText.bodySmall( ],
expense.status.name,
color: Colors.white,
fontWeight: 500,
),
),
], ],
), ),
], ],
), ),
), const SizedBox(height: 6),
Row(
children: [
MyText.bodySmall(formattedDate, fontWeight: 500),
const Spacer(),
Container(
padding:
const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
decoration: BoxDecoration(
color: Color(int.parse(
'0xff${expense.status.color.substring(1)}'))
.withOpacity(0.5),
borderRadius: BorderRadius.circular(5),
),
child: MyText.bodySmall(
expense.status.name,
color: Colors.white,
fontWeight: 500,
),
),
],
),
],
), ),
); ),
}, ),
); );
} }
} }

View File

@ -123,7 +123,6 @@ class _AttendanceFilterBottomSheetState
}).toList(); }).toList();
final List<Widget> widgets = [ final List<Widget> widgets = [
// 🔹 View Section
Padding( Padding(
padding: const EdgeInsets.only(bottom: 4), padding: const EdgeInsets.only(bottom: 4),
child: Align( child: Align(
@ -146,7 +145,6 @@ class _AttendanceFilterBottomSheetState
}), }),
]; ];
// 🔹 Organization filter
widgets.addAll([ widgets.addAll([
const Divider(), const Divider(),
Padding( Padding(
@ -165,24 +163,6 @@ class _AttendanceFilterBottomSheetState
color: Colors.grey.shade300, color: Colors.grey.shade300,
borderRadius: BorderRadius.circular(12), borderRadius: BorderRadius.circular(12),
), ),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Container(
width: 100,
height: 14,
color: Colors.grey.shade400,
),
Container(
width: 18,
height: 18,
decoration: BoxDecoration(
color: Colors.grey.shade400,
shape: BoxShape.circle,
),
),
],
),
); );
} else if (widget.controller.organizations.isEmpty) { } else if (widget.controller.organizations.isEmpty) {
return Center( return Center(
@ -200,7 +180,6 @@ class _AttendanceFilterBottomSheetState
}), }),
]); ]);
// 🔹 Date Range (only for Attendance Logs)
if (tempSelectedTab == 'attendanceLogs') { if (tempSelectedTab == 'attendanceLogs') {
widgets.addAll([ widgets.addAll([
const Divider(), const Divider(),
@ -211,16 +190,12 @@ class _AttendanceFilterBottomSheetState
child: MyText.titleSmall("Date Range", fontWeight: 600), child: MyText.titleSmall("Date Range", fontWeight: 600),
), ),
), ),
// Reusable DateRangePickerWidget
DateRangePickerWidget( DateRangePickerWidget(
startDate: widget.controller.startDateAttendance, startDate: widget.controller.startDateAttendance,
endDate: widget.controller.endDateAttendance, endDate: widget.controller.endDateAttendance,
startLabel: "Start Date", startLabel: "Start Date",
endLabel: "End Date", endLabel: "End Date",
onDateRangeSelected: (start, end) { onDateRangeSelected: (_, __) => setState(() {}),
// Optional: trigger UI updates if needed
setState(() {});
},
), ),
]); ]);
} }
@ -232,18 +207,36 @@ class _AttendanceFilterBottomSheetState
Widget build(BuildContext context) { Widget build(BuildContext context) {
return ClipRRect( return ClipRRect(
borderRadius: const BorderRadius.vertical(top: Radius.circular(24)), borderRadius: const BorderRadius.vertical(top: Radius.circular(24)),
child: BaseBottomSheet( child: LayoutBuilder(
title: "Attendance Filter", builder: (context, constraints) {
submitText: "Apply", final bool isLandscape = constraints.maxWidth > constraints.maxHeight;
onCancel: () => Navigator.pop(context),
onSubmit: () => Navigator.pop(context, { return BaseBottomSheet(
'selectedTab': tempSelectedTab, title: "Attendance Filter",
'selectedOrganization': widget.controller.selectedOrganization?.id, submitText: "Apply",
}), onCancel: () => Navigator.pop(context),
child: Column( onSubmit: () => Navigator.pop(context, {
crossAxisAlignment: CrossAxisAlignment.start, 'selectedTab': tempSelectedTab,
children: buildMainFilters(), 'selectedOrganization':
), widget.controller.selectedOrganization?.id,
}),
// ---------------- UPDATED RESPONSIVE CHILD ----------------
child: SizedBox(
height: isLandscape
? constraints.maxHeight // 🔥 Full screen in landscape
: constraints.maxHeight * 0.78, // normal in portrait
child: SingleChildScrollView(
padding: const EdgeInsets.only(bottom: 24),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: buildMainFilters(),
),
),
),
);
},
), ),
); );
} }

View File

@ -58,12 +58,10 @@ class _PaymentRequestBottomSheetState extends State<_PaymentRequestBottomSheet>
if (widget.isEdit && widget.existingData != null) { if (widget.isEdit && widget.existingData != null) {
final data = widget.existingData!; final data = widget.existingData!;
// Prefill text fields
controller.titleController.text = data["title"] ?? ""; controller.titleController.text = data["title"] ?? "";
controller.amountController.text = data["amount"]?.toString() ?? ""; controller.amountController.text = data["amount"]?.toString() ?? "";
controller.descriptionController.text = data["description"] ?? ""; controller.descriptionController.text = data["description"] ?? "";
// Prefill due date
if (data["dueDate"] != null && data["dueDate"].toString().isNotEmpty) { if (data["dueDate"] != null && data["dueDate"].toString().isNotEmpty) {
DateTime? dueDate = DateTime.tryParse(data["dueDate"].toString()); DateTime? dueDate = DateTime.tryParse(data["dueDate"].toString());
if (dueDate != null) { if (dueDate != null) {
@ -73,15 +71,14 @@ class _PaymentRequestBottomSheetState extends State<_PaymentRequestBottomSheet>
} }
} }
// Prefill dropdowns & toggles
controller.selectedProject.value = { controller.selectedProject.value = {
'id': data["projectId"], 'id': data["projectId"],
'name': data["projectName"], 'name': data["projectName"],
}; };
controller.selectedPayee.value = data["payee"] ?? ""; controller.selectedPayee.value = data["payee"] ?? "";
controller.isAdvancePayment.value = data["isAdvancePayment"] ?? false; controller.isAdvancePayment.value = data["isAdvancePayment"] ?? false;
// Categories & currencies
everAll([controller.categories, controller.currencies], (_) { everAll([controller.categories, controller.currencies], (_) {
controller.selectedCategory.value = controller.categories controller.selectedCategory.value = controller.categories
.firstWhereOrNull((c) => c.id == data["expenseCategoryId"]); .firstWhereOrNull((c) => c.id == data["expenseCategoryId"]);
@ -89,7 +86,6 @@ class _PaymentRequestBottomSheetState extends State<_PaymentRequestBottomSheet>
.firstWhereOrNull((c) => c.id == data["currencyId"]); .firstWhereOrNull((c) => c.id == data["currencyId"]);
}); });
// Attachments
final attachmentsData = data["attachments"]; final attachmentsData = data["attachments"];
if (attachmentsData != null && if (attachmentsData != null &&
attachmentsData is List && attachmentsData is List &&
@ -116,51 +112,56 @@ class _PaymentRequestBottomSheetState extends State<_PaymentRequestBottomSheet>
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Obx(() => Form( return Obx(() => SafeArea(
key: _formKey, child: Form(
child: BaseBottomSheet( key: _formKey,
title: widget.isEdit child: BaseBottomSheet(
? "Edit Payment Request" title: widget.isEdit
: "Create Payment Request", ? "Edit Payment Request"
isSubmitting: controller.isSubmitting.value, : "Create Payment Request",
onCancel: Get.back, isSubmitting: controller.isSubmitting.value,
submitText: "Save as Draft", onCancel: Get.back,
onSubmit: () async { submitText: "Save as Draft",
if (_formKey.currentState!.validate() && _validateSelections()) { onSubmit: () async {
bool success = false; if (_formKey.currentState!.validate() &&
if (widget.isEdit && widget.existingData != null) { _validateSelections()) {
final requestId = bool success = false;
widget.existingData!['id']?.toString() ?? '';
if (requestId.isNotEmpty) { if (widget.isEdit && widget.existingData != null) {
success = await controller.submitEditedPaymentRequest( final requestId =
requestId: requestId); widget.existingData!['id']?.toString() ?? '';
if (requestId.isNotEmpty) {
success = await controller.submitEditedPaymentRequest(
requestId: requestId);
} else {
_showError("Invalid Payment Request ID");
return;
}
} else { } else {
_showError("Invalid Payment Request ID"); success = await controller.submitPaymentRequest();
return;
} }
} else {
success = await controller.submitPaymentRequest();
}
if (success) { if (success) {
Get.back(); Get.back();
if (widget.onUpdated != null) widget.onUpdated!(); widget.onUpdated?.call();
showAppSnackbar( showAppSnackbar(
title: "Success", title: "Success",
message: widget.isEdit message: widget.isEdit
? "Payment request updated successfully!" ? "Payment request updated successfully!"
: "Payment request created successfully!", : "Payment request created successfully!",
type: SnackbarType.success, type: SnackbarType.success,
); );
}
} }
} },
}, child: SingleChildScrollView(
child: SingleChildScrollView( padding: const EdgeInsets.only(bottom: 20),
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ mainAxisSize: MainAxisSize.min,
_buildDropdown( children: [
_buildDropdown(
"Select Project", "Select Project",
Icons.work_outline, Icons.work_outline,
controller.selectedProject.value?['name'] ?? controller.selectedProject.value?['name'] ??
@ -168,9 +169,10 @@ class _PaymentRequestBottomSheetState extends State<_PaymentRequestBottomSheet>
controller.globalProjects, controller.globalProjects,
(p) => p['name'], (p) => p['name'],
controller.selectProject, controller.selectProject,
key: _projectDropdownKey), key: _projectDropdownKey,
_gap(), ),
_buildDropdown( _gap(),
_buildDropdown(
"Expense Category", "Expense Category",
Icons.category_outlined, Icons.category_outlined,
controller.selectedCategory.value?.name ?? controller.selectedCategory.value?.name ??
@ -178,30 +180,35 @@ class _PaymentRequestBottomSheetState extends State<_PaymentRequestBottomSheet>
controller.categories, controller.categories,
(c) => c.name, (c) => c.name,
controller.selectCategory, controller.selectCategory,
key: _categoryDropdownKey), key: _categoryDropdownKey,
_gap(), ),
_buildTextField( _gap(),
"Title", Icons.title_outlined, controller.titleController, _buildTextField("Title", Icons.title_outlined,
hint: "Enter title", validator: Validators.requiredField), controller.titleController,
_gap(), hint: "Enter title",
_buildRadio("Is Advance Payment", Icons.attach_money_outlined, validator: Validators.requiredField),
controller.isAdvancePayment, ["Yes", "No"]), _gap(),
_gap(), _buildRadio(
_buildDueDateField(), "Is Advance Payment",
_gap(), Icons.attach_money_outlined,
_buildTextField("Amount", Icons.currency_rupee, controller.isAdvancePayment,
controller.amountController, ["Yes", "No"]),
hint: "Enter Amount", _gap(),
keyboardType: TextInputType.number, _buildDueDateField(),
validator: (v) => (v != null && _gap(),
v.isNotEmpty && _buildTextField("Amount", Icons.currency_rupee,
double.tryParse(v) != null) controller.amountController,
? null hint: "Enter Amount",
: "Enter valid amount"), keyboardType: TextInputType.number,
_gap(), validator: (v) => (v != null &&
_buildPayeeAutocompleteField(), v.isNotEmpty &&
_gap(), double.tryParse(v) != null)
_buildDropdown( ? null
: "Enter valid amount"),
_gap(),
_buildPayeeAutocompleteField(),
_gap(),
_buildDropdown(
"Currency", "Currency",
Icons.monetization_on_outlined, Icons.monetization_on_outlined,
controller.selectedCurrency.value?.currencyName ?? controller.selectedCurrency.value?.currencyName ??
@ -209,16 +216,19 @@ class _PaymentRequestBottomSheetState extends State<_PaymentRequestBottomSheet>
controller.currencies, controller.currencies,
(c) => c.currencyName, (c) => c.currencyName,
controller.selectCurrency, controller.selectCurrency,
key: _currencyDropdownKey), key: _currencyDropdownKey,
_gap(), ),
_buildTextField("Description", Icons.description_outlined, _gap(),
controller.descriptionController, _buildTextField("Description", Icons.description_outlined,
hint: "Enter description", controller.descriptionController,
maxLines: 3, hint: "Enter description",
validator: Validators.requiredField), maxLines: 3,
_gap(), validator: Validators.requiredField),
_buildAttachmentsSection(), _gap(),
], _buildAttachmentsSection(),
MySpacing.height(30),
],
),
), ),
), ),
), ),
@ -284,6 +294,7 @@ class _PaymentRequestBottomSheetState extends State<_PaymentRequestBottomSheet>
final i = entry.key; final i = entry.key;
final label = entry.value; final label = entry.value;
final value = i == 0; final value = i == 0;
return Expanded( return Expanded(
child: RadioListTile<bool>( child: RadioListTile<bool>(
contentPadding: EdgeInsets.zero, contentPadding: EdgeInsets.zero,
@ -354,7 +365,6 @@ class _PaymentRequestBottomSheetState extends State<_PaymentRequestBottomSheet>
displayStringForOption: (option) => option, displayStringForOption: (option) => option,
fieldViewBuilder: fieldViewBuilder:
(context, fieldController, focusNode, onFieldSubmitted) { (context, fieldController, focusNode, onFieldSubmitted) {
// Avoid updating during build
WidgetsBinding.instance.addPostFrameCallback((_) { WidgetsBinding.instance.addPostFrameCallback((_) {
if (fieldController.text != controller.selectedPayee.value) { if (fieldController.text != controller.selectedPayee.value) {
fieldController.text = controller.selectedPayee.value; fieldController.text = controller.selectedPayee.value;

View File

@ -99,34 +99,60 @@ class _DirectoryMainScreenState extends State<DirectoryMainScreen>
), ),
), ),
), ),
body: Column( body: SafeArea(
children: [ child: Column(
// ---------------- TabBar ---------------- children: [
Container( // ---------------- TabBar ----------------
color: Colors.white, Container(
child: TabBar( color: Colors.white,
controller: _tabController, child: TabBar(
labelColor: Colors.black, controller: _tabController,
unselectedLabelColor: Colors.grey, labelColor: Colors.black,
indicatorColor: Colors.red, unselectedLabelColor: Colors.grey,
tabs: const [ indicatorColor: Colors.red,
Tab(text: "Directory"), tabs: const [
Tab(text: "Notes"), Tab(text: "Directory"),
], Tab(text: "Notes"),
],
),
), ),
),
// ---------------- TabBarView ---------------- // ---------------- TabBarView + Scroll / Landscape Support ----------------
Expanded( Expanded(
child: TabBarView( child: LayoutBuilder(
controller: _tabController, builder: (context, constraints) {
children: [ final bool isLandscape =
DirectoryView(), constraints.maxWidth > constraints.maxHeight;
NotesView(),
], if (isLandscape) {
return SingleChildScrollView(
physics: const AlwaysScrollableScrollPhysics(),
child: SizedBox(
height: constraints.maxHeight * 1.3,
child: TabBarView(
controller: _tabController,
children: [
DirectoryView(),
NotesView(),
],
),
),
);
}
// Portrait
return TabBarView(
controller: _tabController,
children: [
DirectoryView(),
NotesView(),
],
);
},
),
), ),
), ],
], ),
), ),
); );
} }

View File

@ -49,39 +49,72 @@ class _AdvancePaymentScreenState extends State<AdvancePaymentScreen>
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Scaffold( return Scaffold(
backgroundColor: const Color( backgroundColor: const Color(0xFFF5F5F5),
0xFFF5F5F5),
appBar: _buildAppBar(), appBar: _buildAppBar(),
body: GestureDetector( body: SafeArea(
onTap: () => FocusScope.of(context).unfocus(), child: LayoutBuilder(
child: RefreshIndicator( builder: (context, constraints) {
onRefresh: () async { final bool isLandscape =
final emp = controller.selectedEmployee.value; constraints.maxWidth > constraints.maxHeight;
if (emp != null) {
await controller.fetchAdvancePayments(emp.id.toString()); return GestureDetector(
} onTap: () => FocusScope.of(context).unfocus(),
}, child: RefreshIndicator(
color: Colors.white, onRefresh: () async {
backgroundColor: contentTheme.primary, final emp = controller.selectedEmployee.value;
strokeWidth: 2.5, if (emp != null) {
displacement: 60, await controller.fetchAdvancePayments(emp.id.toString());
child: SingleChildScrollView( }
physics: const AlwaysScrollableScrollPhysics(), },
child: Container( color: Colors.white,
color: backgroundColor: contentTheme.primary,
const Color(0xFFF5F5F5), strokeWidth: 2.5,
child: Column( displacement: 60,
children: [
_buildSearchBar(), // ---------------- PORTRAIT (UNCHANGED) ----------------
_buildEmployeeDropdown(context), child: !isLandscape
_buildTopBalance(), ? SingleChildScrollView(
_buildPaymentList(), physics: const AlwaysScrollableScrollPhysics(),
], child: Container(
color: const Color(0xFFF5F5F5),
child: Column(
children: [
_buildSearchBar(),
_buildEmployeeDropdown(context),
_buildTopBalance(),
_buildPaymentList(),
],
),
),
)
// ---------------- LANDSCAPE (FIXED) ----------------
: SingleChildScrollView(
physics: const AlwaysScrollableScrollPhysics(),
child: Container(
width: double.infinity,
color: const Color(0xFFF5F5F5),
// Removed IntrinsicHeight
// Removed ConstrainedBox
// Dropdown can now open freely
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
_buildSearchBar(),
_buildEmployeeDropdown(
context), // now overlay works
_buildTopBalance(),
_buildPaymentList(),
],
),
),
),
), ),
), );
), },
), ),
), ),
); );

View File

@ -113,171 +113,219 @@ class _FinanceScreenState extends State<FinanceScreen>
), ),
), ),
), ),
body: FadeTransition( body: SafeArea(
opacity: _fadeAnimation, child: FadeTransition(
child: Obx(() { opacity: _fadeAnimation,
if (menuController.isLoading.value) { child: LayoutBuilder(
return const Center(child: CircularProgressIndicator()); builder: (context, constraints) {
} final bool isLandscape =
constraints.maxWidth > constraints.maxHeight;
if (menuController.hasError.value || menuController.menuItems.isEmpty) { return Obx(() {
return const Center( if (menuController.isLoading.value) {
child: Text( return const Center(child: CircularProgressIndicator());
"Failed to load menus. Please try again later.", }
style: TextStyle(color: Colors.red),
),
);
}
// Filter allowed Finance menus dynamically if (menuController.hasError.value ||
final financeMenuIds = [ menuController.menuItems.isEmpty) {
MenuItems.expenseReimbursement, return const Center(
MenuItems.paymentRequests, child: Text(
MenuItems.advancePaymentStatements, "Failed to load menus. Please try again later.",
]; style: TextStyle(color: Colors.red),
),
);
}
final financeMenus = menuController.menuItems // Filter allowed Finance menus dynamically
.where((m) => financeMenuIds.contains(m.id) && m.available) final financeMenuIds = [
.toList(); MenuItems.expenseReimbursement,
MenuItems.paymentRequests,
MenuItems.advancePaymentStatements,
];
if (financeMenus.isEmpty) { final financeMenus = menuController.menuItems
return const Center( .where((m) => financeMenuIds.contains(m.id) && m.available)
child: Text( .toList();
"You dont have access to the Finance section.",
style: TextStyle(color: Colors.grey),
),
);
}
return SingleChildScrollView( if (financeMenus.isEmpty) {
padding: const EdgeInsets.all(16), return const Center(
child: Column( child: Text(
children: [ "You dont have access to the Finance section.",
_buildFinanceModulesCompact(financeMenus), style: TextStyle(color: Colors.grey),
MySpacing.height(24), ),
ExpenseByStatusWidget(controller: dashboardController), );
MySpacing.height(24), }
ExpenseTypeReportChart(),
MySpacing.height(24), // ---------------------- PORTRAIT MODE ----------------------
MonthlyExpenseDashboardChart(), if (!isLandscape) {
], return SingleChildScrollView(
), padding: const EdgeInsets.all(16),
); child: Column(
}), children: [
_buildFinanceModulesCompact(financeMenus),
MySpacing.height(24),
ExpenseByStatusWidget(controller: dashboardController),
MySpacing.height(24),
ExpenseTypeReportChart(),
MySpacing.height(24),
MonthlyExpenseDashboardChart(),
],
),
);
}
// ---------------------- LANDSCAPE MODE ----------------------
return SingleChildScrollView(
padding: const EdgeInsets.all(16),
child: Column(
children: [
_buildFinanceModulesCompact(financeMenus),
MySpacing.height(24),
// Wider charts behave better side-by-side or full width
SizedBox(
width: constraints.maxWidth,
child: ExpenseByStatusWidget(
controller: dashboardController),
),
MySpacing.height(24),
SizedBox(
width: constraints.maxWidth,
child: ExpenseTypeReportChart(),
),
MySpacing.height(24),
SizedBox(
width: constraints.maxWidth,
child: MonthlyExpenseDashboardChart(),
),
],
),
);
});
},
),
),
), ),
); );
} }
// --- Finance Modules (Compact Dashboard-style) --- // --- Finance Modules (Compact Dashboard-style) ---
Widget _buildFinanceModulesCompact(List<MenuItem> financeMenus) { Widget _buildFinanceModulesCompact(List<MenuItem> financeMenus) {
// Map menu IDs to icon + color // Map menu IDs to icon + color
final Map<String, _FinanceCardMeta> financeCardMeta = { final Map<String, _FinanceCardMeta> financeCardMeta = {
MenuItems.expenseReimbursement: _FinanceCardMeta(LucideIcons.badge_dollar_sign, contentTheme.info), MenuItems.expenseReimbursement:
MenuItems.paymentRequests: _FinanceCardMeta(LucideIcons.receipt_text, contentTheme.primary), _FinanceCardMeta(LucideIcons.badge_dollar_sign, contentTheme.info),
MenuItems.advancePaymentStatements: _FinanceCardMeta(LucideIcons.wallet, contentTheme.warning), MenuItems.paymentRequests:
}; _FinanceCardMeta(LucideIcons.receipt_text, contentTheme.primary),
MenuItems.advancePaymentStatements:
_FinanceCardMeta(LucideIcons.wallet, contentTheme.warning),
};
// Build the stat items using API-provided mobileLink // Build the stat items using API-provided mobileLink
final stats = financeMenus.map((menu) { final stats = financeMenus.map((menu) {
final meta = financeCardMeta[menu.id]!; final meta = financeCardMeta[menu.id]!;
// --- Log the routing info --- // --- Log the routing info ---
debugPrint( debugPrint(
"[Finance Card] ID: ${menu.id}, Title: ${menu.name}, Route: ${menu.mobileLink}"); "[Finance Card] ID: ${menu.id}, Title: ${menu.name}, Route: ${menu.mobileLink}");
return _FinanceStatItem( return _FinanceStatItem(
meta.icon, meta.icon,
menu.name, menu.name,
meta.color, meta.color,
menu.mobileLink, // Each card navigates to its own route menu.mobileLink, // Each card navigates to its own route
); );
}).toList(); }).toList();
final projectSelected = projectController.selectedProject != null; final projectSelected = projectController.selectedProject != null;
return LayoutBuilder(builder: (context, constraints) { return LayoutBuilder(builder: (context, constraints) {
// Determine number of columns dynamically // Determine number of columns dynamically
int crossAxisCount = (constraints.maxWidth ~/ 80).clamp(2, 4); int crossAxisCount = (constraints.maxWidth ~/ 80).clamp(2, 4);
double cardWidth = (constraints.maxWidth - (crossAxisCount - 1) * 6) / crossAxisCount; double cardWidth =
(constraints.maxWidth - (crossAxisCount - 1) * 6) / crossAxisCount;
return Wrap( return Wrap(
spacing: 6, spacing: 6,
runSpacing: 6, runSpacing: 6,
alignment: WrapAlignment.end, alignment: WrapAlignment.end,
children: stats children: stats
.map((stat) => _buildFinanceModuleCard(stat, projectSelected, cardWidth)) .map((stat) =>
.toList(), _buildFinanceModuleCard(stat, projectSelected, cardWidth))
); .toList(),
}); );
} });
}
Widget _buildFinanceModuleCard( Widget _buildFinanceModuleCard(
_FinanceStatItem stat, bool isProjectSelected, double width) { _FinanceStatItem stat, bool isProjectSelected, double width) {
return Opacity( return Opacity(
opacity: isProjectSelected ? 1.0 : 0.4, // Dim if no project selected opacity: isProjectSelected ? 1.0 : 0.4, // Dim if no project selected
child: IgnorePointer( child: IgnorePointer(
ignoring: !isProjectSelected, ignoring: !isProjectSelected,
child: InkWell( child: InkWell(
onTap: () => _onCardTap(stat, isProjectSelected), onTap: () => _onCardTap(stat, isProjectSelected),
borderRadius: BorderRadius.circular(5), borderRadius: BorderRadius.circular(5),
child: MyCard.bordered( child: MyCard.bordered(
width: width, width: width,
height: 60, height: 60,
paddingAll: 4, paddingAll: 4,
borderRadiusAll: 5, borderRadiusAll: 5,
border: Border.all(color: Colors.grey.withOpacity(0.15)), border: Border.all(color: Colors.grey.withOpacity(0.15)),
child: Column( child: Column(
mainAxisAlignment: MainAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center,
children: [ children: [
Container( Container(
padding: const EdgeInsets.all(4), padding: const EdgeInsets.all(4),
decoration: BoxDecoration( decoration: BoxDecoration(
color: stat.color.withOpacity(0.1), color: stat.color.withOpacity(0.1),
borderRadius: BorderRadius.circular(4), borderRadius: BorderRadius.circular(4),
), ),
child: Icon( child: Icon(
stat.icon, stat.icon,
size: 16, size: 16,
color: stat.color, color: stat.color,
),
),
MySpacing.height(4),
Flexible(
child: Text(
stat.title,
textAlign: TextAlign.center,
style: const TextStyle(
fontSize: 10,
overflow: TextOverflow.ellipsis,
), ),
maxLines: 2,
softWrap: true,
), ),
), MySpacing.height(4),
], Flexible(
child: Text(
stat.title,
textAlign: TextAlign.center,
style: const TextStyle(
fontSize: 10,
overflow: TextOverflow.ellipsis,
),
maxLines: 2,
softWrap: true,
),
),
],
),
), ),
), ),
), ),
),
);
}
void _onCardTap(_FinanceStatItem statItem, bool isEnabled) {
if (!isEnabled) {
Get.defaultDialog(
title: "No Project Selected",
middleText: "Please select a project before accessing this section.",
confirm: ElevatedButton(
onPressed: () => Get.back(),
child: const Text("OK"),
),
); );
} else { }
// Navigate to the card's specific route
Get.toNamed(statItem.route); void _onCardTap(_FinanceStatItem statItem, bool isEnabled) {
if (!isEnabled) {
Get.defaultDialog(
title: "No Project Selected",
middleText: "Please select a project before accessing this section.",
confirm: ElevatedButton(
onPressed: () => Get.back(),
child: const Text("OK"),
),
);
} else {
// Navigate to the card's specific route
Get.toNamed(statItem.route);
}
} }
} }
}
class _FinanceStatItem { class _FinanceStatItem {
final IconData icon; final IconData icon;

View File

@ -88,41 +88,76 @@ class _PaymentRequestMainScreenState extends State<PaymentRequestMainScreen>
return Scaffold( return Scaffold(
backgroundColor: Colors.white, backgroundColor: Colors.white,
appBar: _buildAppBar(), appBar: _buildAppBar(),
body: Column( body: SafeArea(
children: [ child: LayoutBuilder(
Container( builder: (context, constraints) {
color: Colors.white, final bool isLandscape =
child: TabBar( constraints.maxWidth > constraints.maxHeight;
controller: _tabController,
labelColor: Colors.black, return Column(
unselectedLabelColor: Colors.grey, children: [
indicatorColor: Colors.red, // ---------------- TabBar ----------------
tabs: const [ Container(
Tab(text: "Current Month"), color: Colors.white,
Tab(text: "History"), child: TabBar(
], controller: _tabController,
), labelColor: Colors.black,
), unselectedLabelColor: Colors.grey,
Expanded( indicatorColor: Colors.red,
child: Container( tabs: const [
color: Colors.grey[100], Tab(text: "Current Month"),
child: Column( Tab(text: "History"),
children: [ ],
_buildSearchBar(),
Expanded(
child: TabBarView(
controller: _tabController,
children: [
_buildPaymentRequestList(isHistory: false),
_buildPaymentRequestList(isHistory: true),
],
),
), ),
], ),
),
), // ---------------- Content Area ----------------
), Expanded(
], child: Container(
color: Colors.grey[100],
child: isLandscape
? SingleChildScrollView(
physics: const AlwaysScrollableScrollPhysics(),
child: SizedBox(
height: constraints.maxHeight * 1.3,
child: Column(
children: [
_buildSearchBar(),
Expanded(
child: TabBarView(
controller: _tabController,
children: [
_buildPaymentRequestList(
isHistory: false),
_buildPaymentRequestList(
isHistory: true),
],
),
),
],
),
),
)
: Column(
children: [
_buildSearchBar(),
Expanded(
child: TabBarView(
controller: _tabController,
children: [
_buildPaymentRequestList(isHistory: false),
_buildPaymentRequestList(isHistory: true),
],
),
),
],
),
),
),
],
);
},
),
), ),
floatingActionButton: Obx(() { floatingActionButton: Obx(() {
if (permissionController.permissions.isEmpty) { if (permissionController.permissions.isEmpty) {