status dashboard

This commit is contained in:
VE10-Sanjeev 2025-05-26 09:44:56 +00:00
parent 8f4e2c8c99
commit 3bf6caabe5

View File

@ -110,12 +110,13 @@ class StatusDashboardState extends State<StatusDashboard> {
(apiData?['data']?['statusBasedCount']) ?? []); (apiData?['data']?['statusBasedCount']) ?? []);
print("statusBasedCount - => $statusBasedCount"); print("statusBasedCount - => $statusBasedCount");
// 👇 Local function to create the card widget // 👇 Local function to create the card widget
Widget buildInfoCard(String title, int count) { Widget buildInfoCard(String title, int count, double width) {
return Card( return Card(
elevation: 3, elevation: 3,
color: Colors.white,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)), shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
child: Container( child: Container(
width: 150, width: width,
padding: const EdgeInsets.all(12), padding: const EdgeInsets.all(12),
child: Column( child: Column(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
@ -124,7 +125,6 @@ class StatusDashboardState extends State<StatusDashboard> {
title, title,
textAlign: TextAlign.center, textAlign: TextAlign.center,
style: const TextStyle(fontWeight: FontWeight.w600), style: const TextStyle(fontWeight: FontWeight.w600),
), ),
const SizedBox(height: 8), const SizedBox(height: 8),
Text( Text(
@ -139,6 +139,9 @@ class StatusDashboardState extends State<StatusDashboard> {
), ),
), ),
); );
} }
return ResponsiveBuilder(builder: (context, sizingInfo) { return ResponsiveBuilder(builder: (context, sizingInfo) {
@ -163,31 +166,36 @@ class StatusDashboardState extends State<StatusDashboard> {
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
const Text(
'Type Based Count',
style:
TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
),
Wrap( Wrap(
spacing: 10, spacing: 10,
runSpacing: 10, runSpacing: 10,
children: typeBasedCount children: typeBasedCount.map((item) {
.map((item) => buildInfoCard(item['value'], item['count'])) double cardWidth = isDesktop
.toList(), ? (MediaQuery.of(context).size.width * 0.75 - 10) / 2 // 80% width padding adjusted
: MediaQuery.of(context).size.width - 24; // full width with padding
return SizedBox(
width: cardWidth,
child: buildInfoCard(item['value'], item['count'], cardWidth),
);
}).toList(),
), ),
const SizedBox(height: 20), const SizedBox(height: 20),
const Text(
'Status Based Count',
style:
TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
),
Wrap( Wrap(
spacing: 10, spacing: 10,
runSpacing: 10, runSpacing: 10,
children: statusBasedCount children: statusBasedCount.map((item) {
.map((item) => buildInfoCard(item['value'], item['count'])) double cardWidth = isDesktop
.toList(), ? (MediaQuery.of(context).size.width * 0.90 - 50) / 6 // desktop layout: 6 cards per row
: MediaQuery.of(context).size.width - 24; // mobile: full width
return SizedBox(
width: cardWidth,
child: buildInfoCard(item['value'], item['count'], cardWidth),
);
}).toList(),
), ),
], ],
), ),
), ),
@ -197,6 +205,7 @@ class StatusDashboardState extends State<StatusDashboard> {
), ),
); );
}); });
} }
} }