240 lines
7.2 KiB
Dart
240 lines
7.2 KiB
Dart
import 'package:flutter/material.dart';
|
|||
|
|
import '../../../../core/theme/app_colors.dart';
|
||
|
|
|
||
|
|
enum SearchStateViewType {
|
||
|
|
initial,
|
||
|
|
loading,
|
||
|
|
empty,
|
||
|
|
error,
|
||
|
|
}
|
||
|
|
|
||
|
|
class SearchEmptyState extends StatelessWidget {
|
||
|
|
final SearchStateViewType type;
|
||
|
|
final String? query;
|
||
|
|
final String? errorMessage;
|
||
|
|
final VoidCallback? onRetry;
|
||
|
|
|
||
|
|
const SearchEmptyState({
|
||
|
|
super.key,
|
||
|
|
required this.type,
|
||
|
|
this.query,
|
||
|
|
this.errorMessage,
|
||
|
|
this.onRetry,
|
||
|
|
});
|
||
|
|
|
||
|
|
@override
|
||
|
|
Widget build(BuildContext context) {
|
||
|
|
switch (type) {
|
||
|
|
case SearchStateViewType.loading:
|
||
|
|
return Center(
|
||
|
|
child: Column(
|
||
|
|
mainAxisSize: MainAxisSize.min,
|
||
|
|
children: [
|
||
|
|
const SizedBox(
|
||
|
|
width: 38,
|
||
|
|
height: 38,
|
||
|
|
child: CircularProgressIndicator(
|
||
|
|
strokeWidth: 3,
|
||
|
|
valueColor: AlwaysStoppedAnimation<Color>(AppColors.primary),
|
||
|
|
),
|
||
|
|
),
|
||
|
|
const SizedBox(height: 18),
|
||
|
|
Text(
|
||
|
|
'Buscando pacientes...',
|
||
|
|
style: TextStyle(
|
||
|
|
fontSize: 14,
|
||
|
|
fontWeight: FontWeight.w600,
|
||
|
|
color: AppColors.textPrimary.withValues(alpha: 0.85),
|
||
|
|
),
|
||
|
|
),
|
||
|
|
const SizedBox(height: 6),
|
||
|
|
const Text(
|
||
|
|
'Consultando base de datos médica',
|
||
|
|
style: TextStyle(
|
||
|
|
fontSize: 12,
|
||
|
|
color: AppColors.textMuted,
|
||
|
|
),
|
||
|
|
),
|
||
|
|
],
|
||
|
|
),
|
||
|
|
);
|
||
|
|
|
||
|
|
case SearchStateViewType.initial:
|
||
|
|
return Center(
|
||
|
|
child: Padding(
|
||
|
|
padding: const EdgeInsets.symmetric(horizontal: 24),
|
||
|
|
child: Column(
|
||
|
|
mainAxisSize: MainAxisSize.min,
|
||
|
|
children: [
|
||
|
|
Container(
|
||
|
|
padding: const EdgeInsets.all(18),
|
||
|
|
decoration: BoxDecoration(
|
||
|
|
color: AppColors.primaryContainer.withValues(alpha: 0.5),
|
||
|
|
shape: BoxShape.circle,
|
||
|
|
),
|
||
|
|
child: const Icon(
|
||
|
|
Icons.person_search_rounded,
|
||
|
|
size: 44,
|
||
|
|
color: AppColors.primary,
|
||
|
|
),
|
||
|
|
),
|
||
|
|
const SizedBox(height: 16),
|
||
|
|
const Text(
|
||
|
|
'Localizador Rápido de Pacientes',
|
||
|
|
style: TextStyle(
|
||
|
|
fontSize: 15,
|
||
|
|
fontWeight: FontWeight.w700,
|
||
|
|
color: AppColors.textPrimary,
|
||
|
|
),
|
||
|
|
textAlign: TextAlign.center,
|
||
|
|
),
|
||
|
|
const SizedBox(height: 6),
|
||
|
|
ConstrainedBox(
|
||
|
|
constraints: const BoxConstraints(maxWidth: 420),
|
||
|
|
child: const Text(
|
||
|
|
'Escriba nombre, apellido, cédula o teléfono y presione Enter o el botón Buscar.',
|
||
|
|
style: TextStyle(
|
||
|
|
fontSize: 12.5,
|
||
|
|
color: AppColors.textSecondary,
|
||
|
|
height: 1.4,
|
||
|
|
),
|
||
|
|
textAlign: TextAlign.center,
|
||
|
|
),
|
||
|
|
),
|
||
|
|
const SizedBox(height: 14),
|
||
|
|
Container(
|
||
|
|
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
|
||
|
|
decoration: BoxDecoration(
|
||
|
|
color: AppColors.cardBg,
|
||
|
|
borderRadius: BorderRadius.circular(8),
|
||
|
|
border: Border.all(color: AppColors.border),
|
||
|
|
),
|
||
|
|
child: const Row(
|
||
|
|
mainAxisSize: MainAxisSize.min,
|
||
|
|
children: [
|
||
|
|
Icon(Icons.keyboard_return_rounded, size: 14, color: AppColors.textMuted),
|
||
|
|
SizedBox(width: 6),
|
||
|
|
Text(
|
||
|
|
'Presione Enter para iniciar la búsqueda',
|
||
|
|
style: TextStyle(fontSize: 11, color: AppColors.textMuted, fontWeight: FontWeight.w500),
|
||
|
|
),
|
||
|
|
],
|
||
|
|
),
|
||
|
|
),
|
||
|
|
],
|
||
|
|
),
|
||
|
|
),
|
||
|
|
);
|
||
|
|
|
||
|
|
case SearchStateViewType.empty:
|
||
|
|
return Center(
|
||
|
|
child: Padding(
|
||
|
|
padding: const EdgeInsets.symmetric(horizontal: 24),
|
||
|
|
child: Column(
|
||
|
|
mainAxisSize: MainAxisSize.min,
|
||
|
|
children: [
|
||
|
|
Container(
|
||
|
|
padding: const EdgeInsets.all(16),
|
||
|
|
decoration: BoxDecoration(
|
||
|
|
color: AppColors.warning.withValues(alpha: 0.12),
|
||
|
|
shape: BoxShape.circle,
|
||
|
|
),
|
||
|
|
child: const Icon(
|
||
|
|
Icons.search_off_rounded,
|
||
|
|
size: 40,
|
||
|
|
color: AppColors.warning,
|
||
|
|
),
|
||
|
|
),
|
||
|
|
const SizedBox(height: 14),
|
||
|
|
const Text(
|
||
|
|
'No se encontraron coincidencias',
|
||
|
|
style: TextStyle(
|
||
|
|
fontSize: 15,
|
||
|
|
fontWeight: FontWeight.w700,
|
||
|
|
color: AppColors.textPrimary,
|
||
|
|
),
|
||
|
|
textAlign: TextAlign.center,
|
||
|
|
),
|
||
|
|
const SizedBox(height: 6),
|
||
|
|
ConstrainedBox(
|
||
|
|
constraints: const BoxConstraints(maxWidth: 400),
|
||
|
|
child: Text(
|
||
|
|
query != null && query!.isNotEmpty
|
||
|
|
? 'No hay registros que coincidan con "$query". Intente con un término más corto o verifique la ortografía.'
|
||
|
|
: 'No se encontraron resultados para los criterios ingresados.',
|
||
|
|
style: const TextStyle(
|
||
|
|
fontSize: 12.5,
|
||
|
|
color: AppColors.textSecondary,
|
||
|
|
height: 1.4,
|
||
|
|
),
|
||
|
|
textAlign: TextAlign.center,
|
||
|
|
),
|
||
|
|
),
|
||
|
|
],
|
||
|
|
),
|
||
|
|
),
|
||
|
|
);
|
||
|
|
|
||
|
|
case SearchStateViewType.error:
|
||
|
|
return Center(
|
||
|
|
child: Padding(
|
||
|
|
padding: const EdgeInsets.symmetric(horizontal: 24),
|
||
|
|
child: Column(
|
||
|
|
mainAxisSize: MainAxisSize.min,
|
||
|
|
children: [
|
||
|
|
Container(
|
||
|
|
padding: const EdgeInsets.all(16),
|
||
|
|
decoration: BoxDecoration(
|
||
|
|
color: AppColors.error.withValues(alpha: 0.12),
|
||
|
|
shape: BoxShape.circle,
|
||
|
|
),
|
||
|
|
child: const Icon(
|
||
|
|
Icons.error_outline_rounded,
|
||
|
|
size: 40,
|
||
|
|
color: AppColors.error,
|
||
|
|
),
|
||
|
|
),
|
||
|
|
const SizedBox(height: 14),
|
||
|
|
const Text(
|
||
|
|
'Error al consultar el servidor',
|
||
|
|
style: TextStyle(
|
||
|
|
fontSize: 15,
|
||
|
|
fontWeight: FontWeight.w700,
|
||
|
|
color: AppColors.textPrimary,
|
||
|
|
),
|
||
|
|
textAlign: TextAlign.center,
|
||
|
|
),
|
||
|
|
const SizedBox(height: 6),
|
||
|
|
ConstrainedBox(
|
||
|
|
constraints: const BoxConstraints(maxWidth: 420),
|
||
|
|
child: Text(
|
||
|
|
errorMessage ?? 'Ocurrió un error inesperado al conectar con el servidor.',
|
||
|
|
style: const TextStyle(
|
||
|
|
fontSize: 12,
|
||
|
|
color: AppColors.error,
|
||
|
|
height: 1.4,
|
||
|
|
),
|
||
|
|
textAlign: TextAlign.center,
|
||
|
|
),
|
||
|
|
),
|
||
|
|
if (onRetry != null) ...[
|
||
|
|
const SizedBox(height: 14),
|
||
|
|
OutlinedButton.icon(
|
||
|
|
onPressed: onRetry,
|
||
|
|
icon: const Icon(Icons.refresh_rounded, size: 16),
|
||
|
|
label: const Text('Reintentar búsqueda'),
|
||
|
|
style: OutlinedButton.styleFrom(
|
||
|
|
foregroundColor: AppColors.primary,
|
||
|
|
side: const BorderSide(color: AppColors.primary),
|
||
|
|
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
|
||
|
|
),
|
||
|
|
),
|
||
|
|
],
|
||
|
|
],
|
||
|
|
),
|
||
|
|
),
|
||
|
|
);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|