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

Done all screen landscape responsive for mobile and tablet

Browse Source
This commit is contained in:
Manish 2025-11-18 16:25:25 +05:30
parent bf03023db7
commit 70b144ffce
4 changed files with 435 additions and 435 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

173
lib/model/directory/directory_filter_bottom_sheet.dart
View File

@ -15,6 +15,7 @@ class DirectoryFilterBottomSheet extends StatefulWidget {
class _DirectoryFilterBottomSheetState
extends State<DirectoryFilterBottomSheet> {
final DirectoryController controller = Get.find<DirectoryController>();
final _categorySearchQuery = ''.obs;
final _bucketSearchQuery = ''.obs;
@ -59,84 +60,100 @@ class _DirectoryFilterBottomSheetState
Get.back();
},
onCancel: Get.back,
child: SafeArea(
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 8),
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Obx(() {
final hasSelections = _tempSelectedCategories.isNotEmpty ||
_tempSelectedBuckets.isNotEmpty;
if (!hasSelections) return const SizedBox.shrink();
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
child: LayoutBuilder(
builder: (context, constraints) {
return SingleChildScrollView(
padding: const EdgeInsets.only(bottom: 16, left: 4, right: 4),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Obx(() {
final hasSelections = _tempSelectedCategories.isNotEmpty ||
_tempSelectedBuckets.isNotEmpty;
if (!hasSelections) return const SizedBox.shrink();
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
MyText("Selected Filters:", fontWeight: 600),
const SizedBox(height: 4),
_buildChips(_tempSelectedCategories,
controller.contactCategories, _toggleCategory),
_buildChips(_tempSelectedBuckets,
controller.contactBuckets, _toggleBucket),
const SizedBox(height: 10),
],
);
}),
// RESET BUTTON
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
MyText("Selected Filters:", fontWeight: 600),
const SizedBox(height: 4),
_buildChips(_tempSelectedCategories,
controller.contactCategories, _toggleCategory),
_buildChips(_tempSelectedBuckets, controller.contactBuckets,
_toggleBucket),
],
);
}),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
TextButton.icon(
onPressed: _resetFilters,
icon: const Icon(Icons.restart_alt, size: 18),
label: MyText("Reset All", color: Colors.red),
style: TextButton.styleFrom(
foregroundColor: Colors.red.shade400,
TextButton.icon(
onPressed: _resetFilters,
icon: const Icon(Icons.restart_alt, size: 18),
label: MyText("Reset All", color: Colors.red),
),
),
],
),
if (controller.contactCategories.isNotEmpty)
Obx(() => _buildExpandableFilterSection(
title: "Categories",
expanded: _categoryExpanded,
searchQuery: _categorySearchQuery,
allItems: controller.contactCategories,
selectedItems: _tempSelectedCategories,
onToggle: _toggleCategory,
)),
if (controller.contactBuckets.isNotEmpty)
Obx(() => _buildExpandableFilterSection(
title: "Buckets",
expanded: _bucketExpanded,
searchQuery: _bucketSearchQuery,
allItems: controller.contactBuckets,
selectedItems: _tempSelectedBuckets,
onToggle: _toggleBucket,
)),
],
),
),
],
),
// CATEGORIES
if (controller.contactCategories.isNotEmpty)
Obx(() => _buildExpandableFilterSection(
title: "Categories",
expanded: _categoryExpanded,
searchQuery: _categorySearchQuery,
allItems: controller.contactCategories,
selectedItems: _tempSelectedCategories,
onToggle: _toggleCategory,
)),
// BUCKETS
if (controller.contactBuckets.isNotEmpty)
Obx(() => _buildExpandableFilterSection(
title: "Buckets",
expanded: _bucketExpanded,
searchQuery: _bucketSearchQuery,
allItems: controller.contactBuckets,
selectedItems: _tempSelectedBuckets,
onToggle: _toggleBucket,
)),
const SizedBox(height: 20),
],
),
);
},
),
);
}
// ------------------------------
// CHIP UI FOR SELECTED FILTERS
// ------------------------------
Widget _buildChips(RxList<String> selectedIds, List<dynamic> allItems,
Function(String) onRemoved) {
final idToName = {for (var item in allItems) item.id: item.name};
return Wrap(
spacing: 4,
runSpacing: 4,
children: selectedIds
.map((id) => Chip(
label: MyText(idToName[id] ?? "", color: Colors.black87),
deleteIcon: const Icon(Icons.close, size: 16),
onDeleted: () => onRemoved(id),
backgroundColor: Colors.blue.shade50,
))
.toList(),
children: selectedIds.map((id) {
return Chip(
label: MyText(idToName[id] ?? "", color: Colors.black87),
deleteIcon: const Icon(Icons.close, size: 16),
onDeleted: () => onRemoved(id),
backgroundColor: Colors.blue.shade50,
);
}).toList(),
);
}
// ------------------------------
// EXPANDABLE FILTER UI
// ------------------------------
Widget _buildExpandableFilterSection({
required String title,
required RxBool expanded,
@ -146,7 +163,7 @@ class _DirectoryFilterBottomSheetState
required Function(String) onToggle,
}) {
return Padding(
padding: const EdgeInsets.symmetric(vertical: 6),
padding: const EdgeInsets.symmetric(vertical: 8),
child: Column(
children: [
GestureDetector(
@ -159,28 +176,27 @@ class _DirectoryFilterBottomSheetState
: Icons.keyboard_arrow_right,
size: 20,
),
const SizedBox(width: 4),
MyText(
"$title",
fontWeight: 600,
fontSize: 16,
),
const SizedBox(width: 6),
MyText(title, fontWeight: 600, fontSize: 16),
],
),
),
if (expanded.value)
_buildFilterSection(
title: title,
searchQuery: searchQuery,
allItems: allItems,
selectedItems: selectedItems,
onToggle: onToggle,
title: title,
),
],
),
);
}
// ------------------------------
// FILTER LIST + SEARCH
// ------------------------------
Widget _buildFilterSection({
required String title,
required RxString searchQuery,
@ -189,14 +205,16 @@ class _DirectoryFilterBottomSheetState
required Function(String) onToggle,
}) {
final filteredList = allItems.where((item) {
if (searchQuery.isEmpty) return true;
if (searchQuery.value.isEmpty) return true;
return item.name.toLowerCase().contains(searchQuery.value.toLowerCase());
}).toList();
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const SizedBox(height: 6),
const SizedBox(height: 8),
// SEARCH BOX
TextField(
onChanged: (value) => searchQuery.value = value,
style: const TextStyle(fontSize: 13),
@ -215,7 +233,10 @@ class _DirectoryFilterBottomSheetState
fillColor: Colors.grey.shade100,
),
),
const SizedBox(height: 8),
// NO RESULTS
if (filteredList.isEmpty)
Row(
children: [
@ -227,7 +248,7 @@ class _DirectoryFilterBottomSheetState
)
else
ConstrainedBox(
constraints: const BoxConstraints(maxHeight: 230),
constraints: const BoxConstraints(maxHeight: 260),
child: ListView.builder(
padding: EdgeInsets.zero,
shrinkWrap: true,
@ -238,7 +259,7 @@ class _DirectoryFilterBottomSheetState
return Obx(() {
final isSelected = selectedItems.contains(item.id);
return GestureDetector(
return InkWell(
onTap: () => onToggle(item.id),
child: Container(
padding: const EdgeInsets.symmetric(
@ -271,7 +292,7 @@ class _DirectoryFilterBottomSheetState
});
},
),
)
),
],
);
}

229
lib/view/employees/assign_employee_bottom_sheet.dart
View File

@ -48,116 +48,133 @@ class _AssignProjectBottomSheetState extends State<AssignProjectBottomSheet> {
onCancel: () => Navigator.pop(context),
onSubmit: _handleAssign,
submitText: "Assign",
child: Obx(() {
if (assignController.isLoading.value) {
return const Center(child: CircularProgressIndicator());
}
final projects = assignController.allProjects;
if (projects.isEmpty) {
return const Center(child: Text('No projects available.'));
}
/// 🔥 MAKE BODY SCROLLABLE (fix for landscape)
child: LayoutBuilder(
builder: (context, constraints) {
return Obx(() {
if (assignController.isLoading.value) {
return const Center(child: CircularProgressIndicator());
}
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
MyText.bodySmall(
'Select the projects to assign this employee.',
color: Colors.grey[600],
),
MySpacing.height(8),
final projects = assignController.allProjects;
if (projects.isEmpty) {
return const Center(child: Text('No projects available.'));
}
// Select All
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'Projects (${projects.length})',
style: const TextStyle(
fontWeight: FontWeight.w600,
fontSize: 16,
),
),
TextButton(
onPressed: () {
assignController.toggleSelectAll();
},
child: Obx(() {
return Text(
assignController.areAllSelected()
? 'Deselect All'
: 'Select All',
style: const TextStyle(
color: Colors.blueAccent,
fontWeight: FontWeight.w600,
),
);
}),
),
],
),
// List of Projects
SizedBox(
height: 300,
child: ListView.builder(
controller: _scrollController,
itemCount: projects.length,
itemBuilder: (context, index) {
final GlobalProjectModel project = projects[index];
return Obx(() {
final bool isSelected =
assignController.isProjectSelected(
project.id.toString(),
);
return Theme(
data: Theme.of(context).copyWith(
checkboxTheme: CheckboxThemeData(
fillColor: WidgetStateProperty.resolveWith<Color>(
(states) => states.contains(WidgetState.selected)
? Colors.blueAccent
: Colors.white,
),
side: const BorderSide(
color: Colors.black,
width: 2,
),
checkColor:
WidgetStateProperty.all(Colors.white),
),
),
child: CheckboxListTile(
dense: true,
value: isSelected,
title: Text(
project.name,
style: const TextStyle(
fontWeight: FontWeight.w500,
fontSize: 14,
),
),
onChanged: (checked) {
assignController.toggleProjectSelection(
project.id.toString(),
checked ?? false,
);
},
activeColor: Colors.blueAccent,
controlAffinity: ListTileControlAffinity.leading,
contentPadding: EdgeInsets.zero,
visualDensity: const VisualDensity(
horizontal: -4,
vertical: -4,
),
),
);
});
},
return ConstrainedBox(
constraints: BoxConstraints(
/// 🔥 Always allow enough height for scroll
maxHeight: constraints.maxHeight,
),
),
],
);
}),
child: SingleChildScrollView(
controller: _scrollController,
padding: const EdgeInsets.only(bottom: 16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
MyText.bodySmall(
'Select the projects to assign this employee.',
color: Colors.grey[600],
),
MySpacing.height(8),
// Header Row
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'Projects (${projects.length})',
style: const TextStyle(
fontWeight: FontWeight.w600,
fontSize: 16,
),
),
TextButton(
onPressed: () {
assignController.toggleSelectAll();
},
child: Obx(() {
return Text(
assignController.areAllSelected()
? 'Deselect All'
: 'Select All',
style: const TextStyle(
color: Colors.blueAccent,
fontWeight: FontWeight.w600,
),
);
}),
),
],
),
/// 🔥 List auto grows and scrolls — no fixed height
ListView.builder(
shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(),
itemCount: projects.length,
itemBuilder: (context, index) {
final GlobalProjectModel project = projects[index];
return Obx(() {
final bool isSelected =
assignController.isProjectSelected(
project.id.toString(),
);
return Theme(
data: Theme.of(context).copyWith(
checkboxTheme: CheckboxThemeData(
fillColor:
WidgetStateProperty.resolveWith<Color>(
(states) =>
states.contains(WidgetState.selected)
? Colors.blueAccent
: Colors.white,
),
side: const BorderSide(
color: Colors.black,
width: 2,
),
checkColor:
WidgetStateProperty.all(Colors.white),
),
),
child: CheckboxListTile(
dense: true,
value: isSelected,
title: Text(
project.name,
style: const TextStyle(
fontWeight: FontWeight.w500,
fontSize: 14,
),
),
onChanged: (checked) {
assignController.toggleProjectSelection(
project.id.toString(),
checked ?? false,
);
},
activeColor: Colors.blueAccent,
controlAffinity:
ListTileControlAffinity.leading,
contentPadding: EdgeInsets.zero,
visualDensity: const VisualDensity(
horizontal: -4,
vertical: -4,
),
),
);
});
},
),
],
),
),
);
});
},
),
);
},
);

186
lib/view/layouts/user_profile_right_bar.dart
View File

@ -52,6 +52,7 @@ class _UserProfileBarState extends State<UserProfileBar>
@override
Widget build(BuildContext context) {
final bool isCondensed = widget.isCondensed;
return Padding(
padding: const EdgeInsets.only(left: 14),
child: ClipRRect(
@ -88,41 +89,52 @@ class _UserProfileBarState extends State<UserProfileBar>
bottom: true,
child: Stack(
children: [
// ======================= MAIN PROFILE SIDEBAR =======================
Offstage(
offstage: _isThemeEditorVisible,
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
_isLoading
? const _LoadingSection()
: _userProfileSection(isCondensed),
if (!_isLoading && !isCondensed) _switchTenantRow(),
MySpacing.height(12),
Divider(
indent: 18,
endIndent: 18,
thickness: 0.7,
color: Colors.grey.withOpacity(0.25),
),
MySpacing.height(12),
_supportAndSettingsMenu(isCondensed),
MySpacing.height(12),
// Subtle version text for expanded mode
if (!isCondensed && _appVersion.isNotEmpty)
_versionText(),
const Spacer(),
Divider(
indent: 18,
endIndent: 18,
thickness: 0.35,
color: Colors.grey.withOpacity(0.18),
),
_logoutButton(isCondensed),
],
child: LayoutBuilder(
builder: (context, constraints) {
return SingleChildScrollView(
physics: const ClampingScrollPhysics(),
child: ConstrainedBox(
constraints: BoxConstraints(
minHeight: constraints.maxHeight),
child: IntrinsicHeight(
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
_isLoading
? const _LoadingSection()
: _userProfileSection(isCondensed),
if (!_isLoading && !isCondensed)
_switchTenantRow(),
MySpacing.height(12),
Divider(
indent: 18,
endIndent: 18,
thickness: 0.7,
color: Colors.grey.withOpacity(0.25),
),
MySpacing.height(12),
_supportAndSettingsMenu(isCondensed),
const Spacer(),
Divider(
indent: 18,
endIndent: 18,
thickness: 0.35,
color: Colors.grey.withOpacity(0.18),
),
_logoutButton(isCondensed),
],
),
),
),
);
},
),
),
// ======================= THEME EDITOR VIEW =======================
Offstage(
offstage: !_isThemeEditorVisible,
child: ThemeEditorWidget(
@ -131,9 +143,6 @@ class _UserProfileBarState extends State<UserProfileBar>
},
),
),
// Floating badge for condensed mode
if (isCondensed && _appVersion.isNotEmpty) _versionBadge(),
],
),
),
@ -143,96 +152,7 @@ class _UserProfileBarState extends State<UserProfileBar>
);
}
// =================== Version Widgets ===================
Widget _versionText() {
return Padding(
padding: const EdgeInsets.only(top: 4, bottom: 12),
child: Center(
child: ClipRRect(
borderRadius: BorderRadius.circular(16),
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 10, sigmaY: 10),
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 6),
decoration: BoxDecoration(
color: Colors.grey.shade100.withOpacity(0.85),
borderRadius: BorderRadius.circular(16),
border: Border.all(
color: Colors.grey.shade200,
width: 0.7,
),
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.12),
blurRadius: 3,
offset: const Offset(0, 1),
),
],
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(Icons.info_outline, size: 14, color: Colors.grey[700]),
const SizedBox(width: 4),
Text(
'Version: $_appVersion',
style: TextStyle(
fontSize: 12,
color: Colors.grey[800],
fontWeight: FontWeight.w600,
),
),
],
),
),
),
),
),
);
}
Widget _versionBadge() {
return Positioned(
bottom: 10,
right: 14,
child: ClipRRect(
borderRadius: BorderRadius.circular(16),
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 10, sigmaY: 10),
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 5),
decoration: BoxDecoration(
color: Colors.grey.shade100.withOpacity(0.85),
borderRadius: BorderRadius.circular(16),
border: Border.all(
color: Colors.grey.shade300,
width: 1,
),
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.17),
blurRadius: 6,
offset: const Offset(0, 2),
),
],
),
child: Text(
_appVersion,
style: const TextStyle(
fontSize: 12,
fontWeight: FontWeight.w600,
color: Colors.black87,
letterSpacing: 0.4,
),
),
),
),
),
);
}
// =================== Existing methods ===================
// ==================== EXISTING CODE (UNCHANGED) =====================
Widget _switchTenantRow() {
final TenantSwitchController tenantSwitchController =
@ -337,17 +257,25 @@ class _UserProfileBarState extends State<UserProfileBar>
child: const Center(child: CircularProgressIndicator(strokeWidth: 2)),
);
// ⭐ FIXED — YOUR ORIGINAL INTENT, COMPLETED PROPERLY
Widget _noTenantContainer() => Container(
padding: const EdgeInsets.symmetric(vertical: 12, horizontal: 16),
decoration: BoxDecoration(
color: Colors.blue.shade50,
borderRadius: BorderRadius.circular(12),
border: Border.all(color: Colors.blue.shade200, width: 1),
border: Border.all(
color: Colors.blue.shade200,
width: 1,
),
),
child: MyText.bodyMedium(
"No tenants available",
color: Colors.blueAccent,
fontWeight: 600,
child: const Center(
child: Text(
"No organizations available",
style: TextStyle(
fontWeight: FontWeight.w600,
color: Colors.black87,
),
),
),
);

282
lib/view/service_project/service_project_screen.dart
View File

@ -22,11 +22,11 @@ class _ServiceProjectScreenState extends State<ServiceProjectScreen>
final TextEditingController searchController = TextEditingController();
final ServiceProjectController controller =
Get.put(ServiceProjectController());
@override
void initState() {
super.initState();
// Fetch projects safely after first frame
WidgetsBinding.instance.addPostFrameCallback((_) {
controller.fetchProjects();
});
@ -42,38 +42,29 @@ class _ServiceProjectScreenState extends State<ServiceProjectScreen>
Widget _buildProjectCard(ProjectItem project) {
return Card(
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(5)),
margin: const EdgeInsets.symmetric(horizontal: 6, vertical: 4),
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(5)),
shadowColor: Colors.indigo.withOpacity(0.10),
color: Colors.white,
child: InkWell(
borderRadius: BorderRadius.circular(14),
borderRadius: BorderRadius.circular(5),
onTap: () {
// Navigate to ServiceProjectDetailsScreen
Get.to(() => ServiceProjectDetailsScreen(
projectId: project.id,
projectName: project.name,
));
Get.to(() => ServiceProjectDetailsScreen(projectId: project.id));
},
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 18, vertical: 14),
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 14),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
/// Project Header
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
MyText.titleMedium(
project.name,
fontWeight: 700,
),
MySpacing.height(4),
],
child: MyText.titleMedium(
project.name,
fontWeight: 700,
maxLines: 2,
overflow: TextOverflow.ellipsis,
),
),
if (project.status?.status.isNotEmpty ?? false)
@ -92,47 +83,32 @@ class _ServiceProjectScreenState extends State<ServiceProjectScreen>
),
],
),
MySpacing.height(10),
/// Assigned Date
MySpacing.height(8),
_buildDetailRow(
Icons.date_range_outlined,
Colors.teal,
"Assigned: ${DateTimeUtils.convertUtcToLocal(project.assignedDate.toIso8601String(), format: DateTimeUtils.defaultFormat)}",
fontSize: 13,
),
MySpacing.height(8),
/// Client Info
MySpacing.height(6),
if (project.client != null)
_buildDetailRow(
Icons.account_circle_outlined,
Colors.indigo,
"Client: ${project.client!.name} (${project.client!.contactPerson})",
fontSize: 13,
),
MySpacing.height(8),
/// Contact Info
MySpacing.height(6),
_buildDetailRow(
Icons.phone,
Colors.green,
"Contact: ${project.contactName} (${project.contactPhone})",
fontSize: 13,
),
MySpacing.height(12),
/// Services List
MySpacing.height(10),
if (project.services.isNotEmpty)
Wrap(
spacing: 6,
runSpacing: 4,
children: project.services
.map((service) => _buildServiceChip(service.name))
.map((e) => _buildServiceChip(e.name))
.toList(),
),
],
@ -148,7 +124,7 @@ class _ServiceProjectScreenState extends State<ServiceProjectScreen>
color: Colors.orange.withOpacity(0.1),
borderRadius: BorderRadius.circular(6),
),
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 3),
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
child: MyText.labelSmall(
name,
color: Colors.orange[800],
@ -157,19 +133,18 @@ class _ServiceProjectScreenState extends State<ServiceProjectScreen>
);
}
Widget _buildDetailRow(IconData icon, Color iconColor, String value,
{double fontSize = 12}) {
Widget _buildDetailRow(IconData icon, Color color, String value) {
return Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Icon(icon, size: 18, color: iconColor),
Icon(icon, size: 18, color: color),
MySpacing.width(8),
Flexible(
Expanded(
child: MyText.bodySmall(
value,
color: Colors.grey[900],
maxLines: 2,
overflow: TextOverflow.ellipsis,
fontWeight: 500,
fontSize: fontSize,
color: Colors.grey[900],
),
),
],
@ -184,7 +159,7 @@ class _ServiceProjectScreenState extends State<ServiceProjectScreen>
const Icon(Icons.work_outline, size: 60, color: Colors.grey),
MySpacing.height(18),
MyText.titleMedium('No matching projects found.',
fontWeight: 600, color: Colors.grey),
color: Colors.grey, fontWeight: 600),
MySpacing.height(10),
MyText.bodySmall('Try adjusting your filters or refresh.',
color: Colors.grey),
@ -195,91 +170,150 @@ class _ServiceProjectScreenState extends State<ServiceProjectScreen>
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: const Color(0xFFF5F5F5),
appBar: CustomAppBar(
title: "Service Projects",
projectName: 'All Service Projects',
onBackPressed: () => Get.toNamed('/dashboard'),
),
body: Column(
children: [
/// Search bar and actions
Padding(
padding: MySpacing.xy(8, 8),
child: Row(
return SafeArea(
child: Scaffold(
backgroundColor: const Color(0xFFF5F5F5),
appBar: CustomAppBar(
title: "Service Projects",
onBackPressed: () => Get.toNamed('/dashboard'),
),
body: LayoutBuilder(
builder: (context, constraints) {
return Column(
children: [
Expanded(
child: SizedBox(
height: 35,
child: TextField(
controller: searchController,
decoration: InputDecoration(
contentPadding:
const EdgeInsets.symmetric(horizontal: 12),
prefixIcon: const Icon(Icons.search,
size: 20, color: Colors.grey),
suffixIcon: ValueListenableBuilder<TextEditingValue>(
valueListenable: searchController,
builder: (context, value, _) {
if (value.text.isEmpty) {
return const SizedBox.shrink();
}
return IconButton(
icon: const Icon(Icons.clear,
/// SEARCH BAR AREA
Padding(
padding: const EdgeInsets.all(8),
child: Row(
children: [
Expanded(
child: SizedBox(
height: 38,
child: TextField(
controller: searchController,
decoration: InputDecoration(
contentPadding:
const EdgeInsets.symmetric(horizontal: 12),
prefixIcon: const Icon(Icons.search,
size: 20, color: Colors.grey),
onPressed: () {
searchController.clear();
controller.updateSearch('');
},
);
},
),
hintText: 'Search projects...',
filled: true,
fillColor: Colors.white,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(5),
borderSide: BorderSide(color: Colors.grey.shade300),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(5),
borderSide: BorderSide(color: Colors.grey.shade300),
suffixIcon:
ValueListenableBuilder<TextEditingValue>(
valueListenable: searchController,
builder: (context, value, _) {
return value.text.isNotEmpty
? IconButton(
icon: const Icon(Icons.clear,
size: 20, color: Colors.grey),
onPressed: () {
searchController.clear();
controller.updateSearch('');
},
)
: const SizedBox.shrink();
},
),
hintText: 'Search projects...',
fillColor: Colors.white,
filled: true,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(5),
borderSide:
BorderSide(color: Colors.grey.shade300),
),
),
),
),
),
),
MySpacing.width(8),
/// FILTER BUTTON
_roundIconButton(Icons.tune),
MySpacing.width(8),
/// ACTION MENU
_roundMenuButton(),
],
),
),
/// LIST AREA
Expanded(
child: Obx(() {
if (controller.isLoading.value) {
return const Center(child: CircularProgressIndicator());
}
final projects = controller.filteredProjects;
return MyRefreshIndicator(
onRefresh: _refreshProjects,
color: Colors.white,
backgroundColor: Colors.indigo,
child: projects.isEmpty
? _buildEmptyState()
: ListView.separated(
padding: const EdgeInsets.only(
left: 8, right: 8, top: 4, bottom: 20),
itemCount: projects.length,
separatorBuilder: (_, __) => MySpacing.height(12),
itemBuilder: (_, index) =>
_buildProjectCard(projects[index]),
),
);
}),
),
],
);
},
),
),
);
}
Widget _roundIconButton(IconData icon) {
return Container(
height: 38,
width: 38,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(5),
border: Border.all(color: Colors.grey.shade300),
),
child: Icon(icon, size: 20, color: Colors.black87),
);
}
Widget _roundMenuButton() {
return Container(
height: 38,
width: 38,
decoration: BoxDecoration(
color: Colors.white,
border: Border.all(color: Colors.grey.shade300),
borderRadius: BorderRadius.circular(5),
),
child: PopupMenuButton<int>(
padding: EdgeInsets.zero,
icon: const Icon(Icons.more_vert, size: 20, color: Colors.black87),
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(5)),
itemBuilder: (context) => [
const PopupMenuItem<int>(
enabled: false,
height: 30,
child: Text("Actions",
style:
TextStyle(fontWeight: FontWeight.bold, color: Colors.grey)),
),
const PopupMenuItem<int>(
value: 1,
child: Row(
children: [
Expanded(child: Text("Manage Projects")),
Icon(Icons.chevron_right, size: 20, color: Colors.indigo),
],
),
),
/// Project List
Expanded(
child: Obx(() {
if (controller.isLoading.value) {
return const Center(child: CircularProgressIndicator());
}
final projects = controller.filteredProjects;
return MyRefreshIndicator(
onRefresh: _refreshProjects,
backgroundColor: Colors.indigo,
color: Colors.white,
child: projects.isEmpty
? _buildEmptyState()
: ListView.separated(
physics: const AlwaysScrollableScrollPhysics(),
padding: MySpacing.only(
left: 8, right: 8, top: 4, bottom: 80),
itemCount: projects.length,
separatorBuilder: (_, __) => MySpacing.height(12),
itemBuilder: (_, index) =>
_buildProjectCard(projects[index]),
),
);
}),
),
],
),
);