Remove status badges, phone button, and order amounts from delivery cards. Display only customer name and address with left accent bar for status color. This fixes the layout overflow issue by removing unnecessary elements. Updated delivery_list_item.dart: - Removed status badge container with icon and label - Removed call button - Removed order count text - Removed total amount display - Cleaned up unused helper methods (_getStatusIcon, _getStatusLabel) - Reduced left accent bar height from 60 to 48 Result: Clean, simple delivery card showing only essential information Generated with Claude Code Co-Authored-By: Claude <noreply@anthropic.com>
183 lines
6.1 KiB
Dart
183 lines
6.1 KiB
Dart
import 'package:flutter/material.dart';
|
|
import '../models/delivery.dart';
|
|
import '../theme/animation_system.dart';
|
|
import '../theme/color_system.dart';
|
|
|
|
class DeliveryListItem extends StatefulWidget {
|
|
final Delivery delivery;
|
|
final bool isSelected;
|
|
final VoidCallback onTap;
|
|
final VoidCallback? onCall;
|
|
final Function(String)? onAction;
|
|
final int? animationIndex;
|
|
|
|
const DeliveryListItem({
|
|
super.key,
|
|
required this.delivery,
|
|
required this.isSelected,
|
|
required this.onTap,
|
|
this.onCall,
|
|
this.onAction,
|
|
this.animationIndex,
|
|
});
|
|
|
|
@override
|
|
State<DeliveryListItem> createState() => _DeliveryListItemState();
|
|
}
|
|
|
|
class _DeliveryListItemState extends State<DeliveryListItem>
|
|
with SingleTickerProviderStateMixin {
|
|
late AnimationController _controller;
|
|
late Animation<double> _slideAnimation;
|
|
late Animation<double> _fadeAnimation;
|
|
late Animation<double> _scaleAnimation;
|
|
bool _isHovered = false;
|
|
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
_controller = AnimationController(
|
|
duration: const Duration(milliseconds: 400),
|
|
vsync: this,
|
|
);
|
|
|
|
final staggerDelay = Duration(
|
|
milliseconds:
|
|
(widget.animationIndex ?? 0) * AppAnimations.staggerDelayMs,
|
|
);
|
|
|
|
Future.delayed(staggerDelay, () {
|
|
if (mounted) {
|
|
_controller.forward();
|
|
}
|
|
});
|
|
|
|
_slideAnimation = Tween<double>(begin: 20, end: 0).animate(
|
|
CurvedAnimation(parent: _controller, curve: Curves.easeOut),
|
|
);
|
|
|
|
_fadeAnimation = Tween<double>(begin: 0, end: 1).animate(
|
|
CurvedAnimation(parent: _controller, curve: Curves.easeOut),
|
|
);
|
|
|
|
_scaleAnimation = Tween<double>(begin: 0.95, end: 1).animate(
|
|
CurvedAnimation(parent: _controller, curve: Curves.easeOut),
|
|
);
|
|
}
|
|
|
|
@override
|
|
void dispose() {
|
|
_controller.dispose();
|
|
super.dispose();
|
|
}
|
|
|
|
Color _getStatusColor(Delivery delivery) {
|
|
if (delivery.isSkipped == true) return SvrntyColors.statusCancelled;
|
|
if (delivery.delivered == true) return SvrntyColors.statusCompleted;
|
|
// Default: in-transit or pending deliveries
|
|
return SvrntyColors.statusInTransit;
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final isDark = Theme.of(context).brightness == Brightness.dark;
|
|
final statusColor = _getStatusColor(widget.delivery);
|
|
|
|
return ScaleTransition(
|
|
scale: _scaleAnimation,
|
|
child: FadeTransition(
|
|
opacity: _fadeAnimation,
|
|
child: Transform.translate(
|
|
offset: Offset(_slideAnimation.value, 0),
|
|
child: MouseRegion(
|
|
onEnter: (_) => setState(() => _isHovered = true),
|
|
onExit: (_) => setState(() => _isHovered = false),
|
|
child: GestureDetector(
|
|
onTap: widget.onTap,
|
|
child: AnimatedContainer(
|
|
duration: AppAnimations.durationFast,
|
|
margin: const EdgeInsets.symmetric(
|
|
horizontal: 12,
|
|
vertical: 6,
|
|
),
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(10),
|
|
color: widget.delivery.delivered
|
|
? Colors.green.withValues(alpha: 0.15)
|
|
: (_isHovered || widget.isSelected
|
|
? Theme.of(context).colorScheme.surfaceContainer
|
|
: Colors.transparent),
|
|
boxShadow: (_isHovered || widget.isSelected) && !widget.delivery.delivered
|
|
? [
|
|
BoxShadow(
|
|
color: Colors.black.withValues(
|
|
alpha: isDark ? 0.3 : 0.08,
|
|
),
|
|
blurRadius: 8,
|
|
offset: const Offset(0, 4),
|
|
),
|
|
]
|
|
: [],
|
|
),
|
|
padding: const EdgeInsets.all(12),
|
|
child: Column(
|
|
children: [
|
|
// Main delivery info row
|
|
Row(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
// Left accent bar
|
|
Container(
|
|
width: 4,
|
|
height: 48,
|
|
decoration: BoxDecoration(
|
|
color: statusColor,
|
|
borderRadius: BorderRadius.circular(2),
|
|
),
|
|
),
|
|
const SizedBox(width: 12),
|
|
// Delivery info
|
|
Expanded(
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
// Customer Name
|
|
Text(
|
|
widget.delivery.name,
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.titleSmall
|
|
?.copyWith(
|
|
fontWeight: FontWeight.w600,
|
|
),
|
|
maxLines: 1,
|
|
overflow: TextOverflow.ellipsis,
|
|
),
|
|
const SizedBox(height: 4),
|
|
// Address
|
|
Text(
|
|
widget.delivery.deliveryAddress
|
|
?.formattedAddress ??
|
|
'No address',
|
|
style: Theme.of(context)
|
|
.textTheme
|
|
.bodySmall,
|
|
maxLines: 2,
|
|
overflow: TextOverflow.ellipsis,
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|