Your changes
This commit is contained in:
divya abdar
@@ -2,7 +2,6 @@ import 'package:flutter/material.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
import '../providers/order_provider.dart';
|
||||
import 'order_detail_screen.dart';
|
||||
import 'order_shipment_screen.dart';
|
||||
import 'order_invoice_screen.dart';
|
||||
import 'order_track_screen.dart';
|
||||
|
||||
@@ -14,6 +13,7 @@ class OrdersScreen extends StatefulWidget {
|
||||
}
|
||||
|
||||
class _OrdersScreenState extends State<OrdersScreen> {
|
||||
String searchQuery = "";
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
@@ -31,77 +31,290 @@ class _OrdersScreenState extends State<OrdersScreen> {
|
||||
return const Center(child: CircularProgressIndicator());
|
||||
}
|
||||
|
||||
return ListView.builder(
|
||||
padding: const EdgeInsets.all(16),
|
||||
itemCount: provider.orders.length,
|
||||
itemBuilder: (_, i) {
|
||||
final o = provider.orders[i];
|
||||
final screenWidth = MediaQuery.of(context).size.width;
|
||||
final scale = (screenWidth / 420).clamp(0.85, 1.15);
|
||||
|
||||
return Card(
|
||||
elevation: 2,
|
||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(12),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text("Order ID: ${o['order_id']}",
|
||||
style: const TextStyle(fontSize: 17, fontWeight: FontWeight.bold)),
|
||||
const SizedBox(height: 4),
|
||||
Text(o['description']),
|
||||
Text("₹ ${o['amount']}"),
|
||||
Text(o['status'], style: const TextStyle(color: Colors.indigo)),
|
||||
// FILTER ORDERS
|
||||
final filteredOrders = provider.orders.where((o) {
|
||||
final q = searchQuery.toLowerCase();
|
||||
return o["order_id"].toString().toLowerCase().contains(q) ||
|
||||
o["status"].toString().toLowerCase().contains(q) ||
|
||||
o["description"].toString().toLowerCase().contains(q) ||
|
||||
o["amount"].toString().toLowerCase().contains(q);
|
||||
}).toList();
|
||||
|
||||
const SizedBox(height: 10),
|
||||
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
_btn("Order", () => _openOrderDetails(o['order_id'])),
|
||||
_btn("Shipment", () => _openShipment(o['order_id'])),
|
||||
_btn("Invoice", () => _openInvoice(o['order_id'])),
|
||||
_btn("Track", () => _openTrack(o['order_id'])),
|
||||
],
|
||||
)
|
||||
],
|
||||
),
|
||||
return Column(
|
||||
children: [
|
||||
// ⭐⭐ WHITE ELEVATED SEARCH BAR ⭐⭐
|
||||
Container(
|
||||
margin: EdgeInsets.fromLTRB(16 * scale, 16 * scale, 16 * scale, 10 * scale),
|
||||
padding: EdgeInsets.symmetric(horizontal: 14 * scale),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
borderRadius: BorderRadius.circular(16 * scale),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.black12.withOpacity(0.12),
|
||||
blurRadius: 10 * scale,
|
||||
spreadRadius: 1 * scale,
|
||||
offset: Offset(0, 4 * scale),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
},
|
||||
child: Row(
|
||||
children: [
|
||||
Icon(Icons.search,
|
||||
size: 22 * scale, color: Colors.grey.shade700),
|
||||
|
||||
SizedBox(width: 10 * scale),
|
||||
|
||||
Expanded(
|
||||
child: TextField(
|
||||
onChanged: (value) => setState(() => searchQuery = value),
|
||||
style: TextStyle(fontSize: 15 * scale),
|
||||
decoration: InputDecoration(
|
||||
hintText: "Search orders...",
|
||||
hintStyle: TextStyle(
|
||||
fontSize: 14 * scale,
|
||||
color: Colors.grey.shade600,
|
||||
),
|
||||
border: InputBorder.none,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
// LIST OF ORDERS
|
||||
Expanded(
|
||||
child: ListView.builder(
|
||||
padding: EdgeInsets.all(16 * scale),
|
||||
itemCount: filteredOrders.length,
|
||||
itemBuilder: (context, i) {
|
||||
final order = filteredOrders[i];
|
||||
return _orderCard(order, scale);
|
||||
},
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
Widget _btn(String text, VoidCallback onTap) {
|
||||
return InkWell(
|
||||
onTap: onTap,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(6),
|
||||
color: Colors.indigo.shade50,
|
||||
// ORDER CARD UI
|
||||
Widget _orderCard(Map<String, dynamic> o, double scale) {
|
||||
final progress = getProgress(o['status']);
|
||||
final badgeColor = getStatusColor(o['status']);
|
||||
|
||||
return Card(
|
||||
elevation: 3 * scale,
|
||||
color: Colors.white,
|
||||
margin: EdgeInsets.only(bottom: 16 * scale),
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(16 * scale),
|
||||
),
|
||||
child: Padding(
|
||||
padding: EdgeInsets.all(16 * scale),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
// TOP ROW
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(
|
||||
"Order #${o['order_id']}",
|
||||
style: TextStyle(
|
||||
fontSize: 18 * scale,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
Container(
|
||||
padding: EdgeInsets.symmetric(
|
||||
horizontal: 12 * scale,
|
||||
vertical: 6 * scale,
|
||||
),
|
||||
decoration: BoxDecoration(
|
||||
color: badgeColor.withOpacity(0.15),
|
||||
borderRadius: BorderRadius.circular(12 * scale),
|
||||
),
|
||||
child: Text(
|
||||
o['status'],
|
||||
style: TextStyle(
|
||||
color: badgeColor,
|
||||
fontWeight: FontWeight.bold,
|
||||
fontSize: 13 * scale,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
|
||||
SizedBox(height: 10 * scale),
|
||||
|
||||
Text(
|
||||
o['description'],
|
||||
style: TextStyle(fontSize: 14 * scale),
|
||||
),
|
||||
|
||||
SizedBox(height: 5 * scale),
|
||||
|
||||
Text(
|
||||
"₹${o['amount']}",
|
||||
style: TextStyle(
|
||||
fontSize: 16 * scale,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
|
||||
SizedBox(height: 18 * scale),
|
||||
|
||||
_AnimatedProgressBar(progress: progress, scale: scale),
|
||||
|
||||
SizedBox(height: 18 * scale),
|
||||
|
||||
// BUTTONS
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
_btn(Icons.visibility, "View", Colors.green.shade800,
|
||||
Colors.green.shade50, () => _openOrderDetails(o['order_id']), scale),
|
||||
|
||||
_btn(Icons.receipt_long, "Invoice", Colors.orange.shade800,
|
||||
Colors.orange.shade50, () => _openInvoice(o['order_id']), scale),
|
||||
|
||||
_btn(Icons.local_shipping, "Track", Colors.blue.shade800,
|
||||
Colors.blue.shade50, () => _openTrack(o['order_id']), scale),
|
||||
],
|
||||
)
|
||||
],
|
||||
),
|
||||
child: Text(text, style: const TextStyle(color: Colors.indigo)),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
void _openOrderDetails(String id) {
|
||||
Navigator.push(context, MaterialPageRoute(
|
||||
builder: (_) => OrderDetailScreen(orderId: id)));
|
||||
// BUTTON UI
|
||||
Widget _btn(IconData icon, String text, Color fg, Color bg,
|
||||
VoidCallback onTap, double scale) {
|
||||
return InkWell(
|
||||
borderRadius: BorderRadius.circular(12 * scale),
|
||||
onTap: onTap,
|
||||
child: Container(
|
||||
padding: EdgeInsets.symmetric(
|
||||
horizontal: 20 * scale,
|
||||
vertical: 12 * scale,
|
||||
),
|
||||
decoration: BoxDecoration(
|
||||
color: bg,
|
||||
borderRadius: BorderRadius.circular(12 * scale),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
Icon(icon, size: 18 * scale, color: fg),
|
||||
SizedBox(width: 8 * scale),
|
||||
Text(
|
||||
text,
|
||||
style: TextStyle(
|
||||
color: fg,
|
||||
fontWeight: FontWeight.w600,
|
||||
fontSize: 14 * scale,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
void _openShipment(String id) {
|
||||
Navigator.push(context, MaterialPageRoute(
|
||||
builder: (_) => OrderShipmentScreen(orderId: id)));
|
||||
// NAVIGATION
|
||||
void _openOrderDetails(String id) {
|
||||
Navigator.push(
|
||||
context,
|
||||
MaterialPageRoute(builder: (_) => OrderDetailScreen(orderId: id)),
|
||||
);
|
||||
}
|
||||
|
||||
void _openInvoice(String id) {
|
||||
Navigator.push(context, MaterialPageRoute(
|
||||
builder: (_) => OrderInvoiceScreen(orderId: id)));
|
||||
Navigator.push(
|
||||
context,
|
||||
MaterialPageRoute(builder: (_) => OrderInvoiceScreen(orderId: id)),
|
||||
);
|
||||
}
|
||||
|
||||
void _openTrack(String id) {
|
||||
Navigator.push(context, MaterialPageRoute(
|
||||
builder: (_) => OrderTrackScreen(orderId: id)));
|
||||
Navigator.push(
|
||||
context,
|
||||
MaterialPageRoute(builder: (_) => OrderTrackScreen(orderId: id)),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
// PROGRESS BAR
|
||||
class _AnimatedProgressBar extends StatelessWidget {
|
||||
final double progress;
|
||||
final double scale;
|
||||
|
||||
const _AnimatedProgressBar({required this.progress, required this.scale});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return LayoutBuilder(
|
||||
builder: (context, constraints) {
|
||||
final maxW = constraints.maxWidth;
|
||||
|
||||
return Stack(
|
||||
children: [
|
||||
Container(
|
||||
height: 10 * scale,
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.grey.shade300,
|
||||
borderRadius: BorderRadius.circular(20 * scale),
|
||||
),
|
||||
),
|
||||
AnimatedContainer(
|
||||
duration: const Duration(milliseconds: 650),
|
||||
curve: Curves.easeInOut,
|
||||
height: 10 * scale,
|
||||
width: maxW * progress,
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(20 * scale),
|
||||
gradient: const LinearGradient(
|
||||
colors: [
|
||||
Color(0xFF4F8CFF),
|
||||
Color(0xFF8A4DFF),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
// PROGRESS VALUES
|
||||
double getProgress(String? status) {
|
||||
final s = (status ?? '').toLowerCase();
|
||||
|
||||
if (s == "pending") return 0.25;
|
||||
if (s == "loading") return 0.40;
|
||||
if (s == "in transit" || s == "intransit") return 0.65;
|
||||
if (s == "dispatched") return 0.85;
|
||||
if (s == "delivered") return 1.0;
|
||||
|
||||
return 0.05;
|
||||
}
|
||||
|
||||
// STATUS COLORS
|
||||
Color getStatusColor(String? status) {
|
||||
final s = (status ?? '').toLowerCase();
|
||||
|
||||
if (s == "pending") return Colors.orange;
|
||||
if (s == "loading") return Colors.amber.shade800;
|
||||
if (s == "in transit" || s == "intransit") return Colors.red;
|
||||
if (s == "dispatched") return Colors.blue.shade700;
|
||||
if (s == "delivered") return Colors.green.shade700;
|
||||
|
||||
return Colors.black54;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user