Replace CircularProgressIndicator with skeleton loaders in dashboard; reintroduce project dropdown list with search functionality
This commit is contained in:
parent
c9e73771b0
commit
6ed069d924
@ -12,6 +12,7 @@ import 'package:on_field_work/helpers/widgets/dashbaord/expense_by_status_widget
|
||||
import 'package:on_field_work/helpers/widgets/dashbaord/monthly_expense_dashboard_chart.dart';
|
||||
import 'package:on_field_work/view/layouts/layout.dart';
|
||||
import 'package:on_field_work/helpers/utils/permission_constants.dart';
|
||||
import 'package:on_field_work/helpers/widgets/my_custom_skeleton.dart ';
|
||||
|
||||
class DashboardScreen extends StatefulWidget {
|
||||
const DashboardScreen({super.key});
|
||||
@ -190,7 +191,9 @@ class _DashboardScreenState extends State<DashboardScreen> with UIMixin {
|
||||
final selectedId = projectController.selectedProjectId.value;
|
||||
|
||||
if (isLoading) {
|
||||
return const Center(child: CircularProgressIndicator());
|
||||
// Use skeleton instead of CircularProgressIndicator
|
||||
return SkeletonLoaders.dashboardCardsSkeleton(
|
||||
maxWidth: MediaQuery.of(context).size.width);
|
||||
}
|
||||
|
||||
return Column(
|
||||
@ -247,61 +250,6 @@ class _DashboardScreenState extends State<DashboardScreen> with UIMixin {
|
||||
});
|
||||
}
|
||||
|
||||
Widget _projectDropdownList(projects, selectedId) {
|
||||
return Container(
|
||||
margin: const EdgeInsets.only(top: 10),
|
||||
padding: const EdgeInsets.all(12),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
borderRadius: BorderRadius.circular(5),
|
||||
border: Border.all(color: Colors.black12.withOpacity(.2)),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.black12.withOpacity(.07),
|
||||
blurRadius: 10,
|
||||
offset: const Offset(0, 3),
|
||||
),
|
||||
],
|
||||
),
|
||||
constraints:
|
||||
BoxConstraints(maxHeight: MediaQuery.of(context).size.height * 0.33),
|
||||
child: Column(
|
||||
children: [
|
||||
TextField(
|
||||
decoration: InputDecoration(
|
||||
hintText: "Search project...",
|
||||
isDense: true,
|
||||
prefixIcon: const Icon(Icons.search),
|
||||
border:
|
||||
OutlineInputBorder(borderRadius: BorderRadius.circular(5)),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 10),
|
||||
Expanded(
|
||||
child: ListView.builder(
|
||||
itemCount: projects.length,
|
||||
itemBuilder: (_, index) {
|
||||
final project = projects[index];
|
||||
return RadioListTile<String>(
|
||||
dense: true,
|
||||
value: project.id,
|
||||
groupValue: selectedId,
|
||||
onChanged: (v) {
|
||||
if (v != null) {
|
||||
projectController.updateSelectedProject(v);
|
||||
projectController.isProjectSelectionExpanded.value =
|
||||
false;
|
||||
}
|
||||
},
|
||||
title: Text(project.name),
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
//---------------------------------------------------------------------------
|
||||
// DASHBOARD MODULE CARDS (UPDATED FOR MINIMAL PADDING / SLL SIZE)
|
||||
//---------------------------------------------------------------------------
|
||||
@ -309,7 +257,9 @@ class _DashboardScreenState extends State<DashboardScreen> with UIMixin {
|
||||
Widget _dashboardCards() {
|
||||
return Obx(() {
|
||||
if (menuController.isLoading.value) {
|
||||
return const Center(child: CircularProgressIndicator());
|
||||
// Show skeleton instead of CircularProgressIndicator
|
||||
return SkeletonLoaders.dashboardCardsSkeleton(
|
||||
maxWidth: MediaQuery.of(context).size.width);
|
||||
}
|
||||
|
||||
final projectSelected = projectController.selectedProject != null;
|
||||
@ -440,6 +390,62 @@ class _DashboardScreenState extends State<DashboardScreen> with UIMixin {
|
||||
});
|
||||
}
|
||||
|
||||
Widget _projectDropdownList(projects, selectedId) {
|
||||
return Container(
|
||||
margin: const EdgeInsets.only(top: 10),
|
||||
padding: const EdgeInsets.all(12),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
borderRadius: BorderRadius.circular(5),
|
||||
border: Border.all(color: Colors.black12.withOpacity(.2)),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.black12.withOpacity(.07),
|
||||
blurRadius: 10,
|
||||
offset: const Offset(0, 3),
|
||||
),
|
||||
],
|
||||
),
|
||||
constraints:
|
||||
BoxConstraints(maxHeight: MediaQuery.of(context).size.height * 0.33),
|
||||
child: Column(
|
||||
children: [
|
||||
TextField(
|
||||
decoration: InputDecoration(
|
||||
hintText: "Search project...",
|
||||
isDense: true,
|
||||
prefixIcon: const Icon(Icons.search),
|
||||
border:
|
||||
OutlineInputBorder(borderRadius: BorderRadius.circular(5)),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 10),
|
||||
Expanded(
|
||||
child: ListView.builder(
|
||||
itemCount: projects.length,
|
||||
itemBuilder: (_, index) {
|
||||
final project = projects[index];
|
||||
return RadioListTile<String>(
|
||||
dense: true,
|
||||
value: project.id,
|
||||
groupValue: selectedId,
|
||||
onChanged: (v) {
|
||||
if (v != null) {
|
||||
projectController.updateSelectedProject(v);
|
||||
projectController.isProjectSelectionExpanded.value =
|
||||
false;
|
||||
}
|
||||
},
|
||||
title: Text(project.name),
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
//---------------------------------------------------------------------------
|
||||
// MAIN UI
|
||||
//---------------------------------------------------------------------------
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user