Co-authored-by: eddgranados12 <eddgranados12@users.noreply.github.com>
Co-authored-by: MENDOZA BALLARDO GAEL RICARDO <gael-meb123@users.noreply.github.com> Co-authored-by: Azareth-Tr <Azareth-Tr@users.noreply.github.com> modificacion de las vistas principales para el usuario ciudadano, primer avance para el panel admin
This commit is contained in:
shinra32
@@ -1,9 +1,9 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/foundation.dart';
|
||||
import 'package:flutter/services.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import 'package:dio/dio.dart';
|
||||
import 'package:flutter_secure_storage/flutter_secure_storage.dart';
|
||||
import 'package:flutter_map/flutter_map.dart';
|
||||
import 'package:latlong2/latlong.dart';
|
||||
|
||||
@@ -11,6 +11,8 @@ import '../../core/theme/app_theme.dart';
|
||||
import '../../core/widgets/app_widgets.dart';
|
||||
import '../../core/services/auth_controller.dart';
|
||||
import '../../core/models/auth_state.dart';
|
||||
import '../../core/constants/auth_constants.dart';
|
||||
import 'package:flutter_secure_storage/flutter_secure_storage.dart';
|
||||
import '../../core/models/colonia.dart';
|
||||
import '../home/colonias_data.dart';
|
||||
import '../addresses/colonias_provider.dart';
|
||||
@@ -199,34 +201,6 @@ class _RegisterPageState extends ConsumerState<RegisterPage> {
|
||||
FocusScope.of(context).unfocus(); // Cierra el teclado
|
||||
}
|
||||
|
||||
Future<void> _postAddressInBackground(String calle, String colonia) async {
|
||||
try {
|
||||
const storage = FlutterSecureStorage();
|
||||
// Esperar un momento para asegurar que el token se haya guardado
|
||||
await Future.delayed(const Duration(milliseconds: 500));
|
||||
final token = await storage.read(key: 'token') ?? '';
|
||||
|
||||
if (token.isNotEmpty) {
|
||||
final dio = Dio(
|
||||
BaseOptions(
|
||||
baseUrl: const String.fromEnvironment(
|
||||
'API_BASE_URL',
|
||||
defaultValue: 'http://localhost:8000',
|
||||
),
|
||||
headers: {'Authorization': 'Bearer $token'},
|
||||
),
|
||||
);
|
||||
|
||||
await dio.post(
|
||||
'/addresses',
|
||||
data: {'label': 'Mi Casa', 'calle': calle, 'colonia': colonia},
|
||||
);
|
||||
}
|
||||
} catch (e) {
|
||||
debugPrint('Aviso: No se pudo guardar la dirección inicial: $e');
|
||||
}
|
||||
}
|
||||
|
||||
Future<void> _register() async {
|
||||
if (_calleCtrl.text.trim().isEmpty || _selectedColonia == null) {
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
@@ -238,32 +212,65 @@ class _RegisterPageState extends ConsumerState<RegisterPage> {
|
||||
return;
|
||||
}
|
||||
|
||||
// Capturar variables antes del proceso asíncrono
|
||||
final phoneDigits = _telefonoCtrl.text.replaceAll(RegExp(r'\D'), '');
|
||||
final phone = phoneDigits.isNotEmpty ? '+52$phoneDigits' : '';
|
||||
|
||||
final calle = _calleCtrl.text.trim();
|
||||
final colonia = _selectedColonia!.nombre;
|
||||
final lat = _selectedLocation?.latitude;
|
||||
final lng = _selectedLocation?.longitude;
|
||||
|
||||
// 1. Registra al usuario
|
||||
await ref
|
||||
.read(authControllerProvider.notifier)
|
||||
.register(
|
||||
email: _emailCtrl.text.trim(),
|
||||
phone: _telefonoCtrl.text.trim(),
|
||||
password: _passCtrl.text,
|
||||
);
|
||||
try {
|
||||
await ref
|
||||
.read(authControllerProvider.notifier)
|
||||
.register(
|
||||
email: _emailCtrl.text.trim(),
|
||||
phone: phone,
|
||||
password: _passCtrl.text,
|
||||
addressCalle: calle,
|
||||
addressColonia: colonia,
|
||||
addressLabel: 'Mi Casa',
|
||||
addressLat: lat,
|
||||
addressLng: lng,
|
||||
);
|
||||
|
||||
// Si el widget ya no está montado, GoRouter nos redirigió automáticamente al Home por éxito.
|
||||
if (!mounted) {
|
||||
_postAddressInBackground(calle, colonia);
|
||||
return;
|
||||
// Guardado silencioso de la dirección tras un registro exitoso
|
||||
_postAddressInBackground(calle, colonia, lat, lng);
|
||||
} catch (_) {
|
||||
// El error ya es manejado por el listener y muestra el SnackBar
|
||||
}
|
||||
}
|
||||
|
||||
// Si seguimos aquí, verificar si hubo un error (ej. contraseña corta)
|
||||
if (ref.read(authControllerProvider).hasError) return;
|
||||
Future<void> _postAddressInBackground(
|
||||
String calle,
|
||||
String colonia,
|
||||
double? lat,
|
||||
double? lng,
|
||||
) async {
|
||||
try {
|
||||
const storage = FlutterSecureStorage();
|
||||
await Future.delayed(
|
||||
const Duration(milliseconds: 800),
|
||||
); // Esperar a que se guarde el JWT
|
||||
final token = await storage.read(key: authTokenStorageKey) ?? '';
|
||||
|
||||
// Fallback: guardar dirección y navegar manualmente
|
||||
await _postAddressInBackground(calle, colonia);
|
||||
if (mounted) {
|
||||
context.go('/home');
|
||||
if (token.isNotEmpty) {
|
||||
final dio = Dio(
|
||||
BaseOptions(
|
||||
baseUrl: const String.fromEnvironment(
|
||||
'API_BASE_URL',
|
||||
defaultValue: 'http://localhost:8000',
|
||||
),
|
||||
headers: {'Authorization': 'Bearer $token'},
|
||||
),
|
||||
);
|
||||
await dio.post(
|
||||
'/addresses',
|
||||
data: {'label': 'Mi Casa', 'calle': calle, 'colonia': colonia},
|
||||
);
|
||||
}
|
||||
} catch (e) {
|
||||
debugPrint('Aviso: No se pudo crear la dirección: $e');
|
||||
}
|
||||
}
|
||||
|
||||
@@ -400,12 +407,7 @@ class _Step1 extends StatelessWidget {
|
||||
},
|
||||
),
|
||||
const SizedBox(height: 14),
|
||||
AppFormField(
|
||||
label: 'Teléfono',
|
||||
hint: '+52 461 123 4567',
|
||||
controller: telefonoCtrl,
|
||||
keyboardType: TextInputType.phone,
|
||||
),
|
||||
_PhoneField(controller: telefonoCtrl),
|
||||
const SizedBox(height: 14),
|
||||
AppFormField(
|
||||
label: 'Contraseña',
|
||||
@@ -523,14 +525,6 @@ class _Step2 extends StatelessWidget {
|
||||
|
||||
final mapCenter = selectedLocation ?? baseCenter;
|
||||
|
||||
// Magia de privacidad: Restringir paneo a 1km a la redonda usando el centro original
|
||||
final bounds = selectedColonia != null
|
||||
? LatLngBounds(
|
||||
LatLng(baseCenter.latitude - 0.01, baseCenter.longitude - 0.01),
|
||||
LatLng(baseCenter.latitude + 0.01, baseCenter.longitude + 0.01),
|
||||
)
|
||||
: null;
|
||||
|
||||
return SingleChildScrollView(
|
||||
padding: const EdgeInsets.all(24),
|
||||
child: Column(
|
||||
@@ -611,11 +605,13 @@ class _Step2 extends StatelessWidget {
|
||||
size: 18,
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
Text(
|
||||
'Colonia: ${selectedColonia!.nombre}',
|
||||
style: const TextStyle(
|
||||
fontWeight: FontWeight.w600,
|
||||
color: AppTheme.primaryDark,
|
||||
Expanded(
|
||||
child: Text(
|
||||
'Colonia: ${selectedColonia!.nombre}',
|
||||
style: const TextStyle(
|
||||
fontWeight: FontWeight.w600,
|
||||
color: AppTheme.primaryDark,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
@@ -668,9 +664,6 @@ class _Step2 extends StatelessWidget {
|
||||
options: MapOptions(
|
||||
initialCenter: mapCenter,
|
||||
initialZoom: 15.0,
|
||||
cameraConstraint: bounds != null
|
||||
? CameraConstraint.containCenter(bounds: bounds)
|
||||
: const CameraConstraint.unconstrained(),
|
||||
onTap: (_, latlng) => onLocationChanged(latlng),
|
||||
),
|
||||
children: [
|
||||
@@ -807,7 +800,10 @@ class _Step2 extends StatelessWidget {
|
||||
children: [
|
||||
Icon(Icons.check, size: 18),
|
||||
SizedBox(width: 8),
|
||||
Text('Registrarme'),
|
||||
Flexible(
|
||||
child: Text('Registrarme',
|
||||
overflow: TextOverflow.ellipsis),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
@@ -831,6 +827,153 @@ class _Step2 extends StatelessWidget {
|
||||
}
|
||||
}
|
||||
|
||||
// ── Campo de teléfono con lada ────────────────────────────────────────────────
|
||||
// Muestra +52 🇲🇽 fijo (escalable a selector multi-país en el futuro).
|
||||
// Formatea la entrada como 000-000-0000 y valida exactamente 10 dígitos.
|
||||
class _PhoneField extends StatelessWidget {
|
||||
final TextEditingController controller;
|
||||
const _PhoneField({required this.controller});
|
||||
|
||||
// Países disponibles (lista para escalamiento futuro)
|
||||
static const _ladas = [(flag: '🇲🇽', code: '+52', name: 'México')];
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final lada = _ladas.first;
|
||||
return Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
const Text(
|
||||
'Teléfono',
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: AppTheme.textSecondary,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 6),
|
||||
Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
// Selector de lada (por ahora solo +52)
|
||||
Container(
|
||||
height: 50,
|
||||
padding: const EdgeInsets.symmetric(horizontal: 12),
|
||||
decoration: BoxDecoration(
|
||||
color: AppTheme.background,
|
||||
borderRadius: BorderRadius.circular(AppTheme.radiusSm),
|
||||
border: Border.all(color: AppTheme.border),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Text(lada.flag, style: const TextStyle(fontSize: 20)),
|
||||
const SizedBox(width: 6),
|
||||
Text(
|
||||
lada.code,
|
||||
style: const TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: AppTheme.textPrimary,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
// Número (solo dígitos, formato 000-000-0000)
|
||||
Expanded(
|
||||
child: TextFormField(
|
||||
controller: controller,
|
||||
keyboardType: TextInputType.number,
|
||||
inputFormatters: [
|
||||
FilteringTextInputFormatter.digitsOnly,
|
||||
LengthLimitingTextInputFormatter(10),
|
||||
_PhoneInputFormatter(),
|
||||
],
|
||||
style: const TextStyle(
|
||||
fontSize: 14,
|
||||
color: AppTheme.textPrimary,
|
||||
),
|
||||
decoration: InputDecoration(
|
||||
hintText: '000-000-0000',
|
||||
hintStyle: const TextStyle(
|
||||
color: AppTheme.textSecondary,
|
||||
fontSize: 14,
|
||||
),
|
||||
filled: true,
|
||||
fillColor: AppTheme.background,
|
||||
contentPadding: const EdgeInsets.symmetric(
|
||||
horizontal: 14,
|
||||
vertical: 15,
|
||||
),
|
||||
border: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(AppTheme.radiusSm),
|
||||
borderSide: const BorderSide(color: AppTheme.border),
|
||||
),
|
||||
enabledBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(AppTheme.radiusSm),
|
||||
borderSide: const BorderSide(color: AppTheme.border),
|
||||
),
|
||||
focusedBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(AppTheme.radiusSm),
|
||||
borderSide: const BorderSide(
|
||||
color: AppTheme.primary,
|
||||
width: 1.5,
|
||||
),
|
||||
),
|
||||
errorBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(AppTheme.radiusSm),
|
||||
borderSide: const BorderSide(color: AppTheme.danger),
|
||||
),
|
||||
focusedErrorBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(AppTheme.radiusSm),
|
||||
borderSide: const BorderSide(
|
||||
color: AppTheme.danger,
|
||||
width: 1.5,
|
||||
),
|
||||
),
|
||||
),
|
||||
validator: (v) {
|
||||
if (v == null || v.isEmpty) return null; // opcional
|
||||
final digits = v.replaceAll('-', '');
|
||||
if (digits.length != 10)
|
||||
return 'Ingresa exactamente 10 dígitos';
|
||||
return null;
|
||||
},
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
// Formatea dígitos en tiempo real: 4611234567 → 461-123-4567
|
||||
class _PhoneInputFormatter extends TextInputFormatter {
|
||||
@override
|
||||
TextEditingValue formatEditUpdate(
|
||||
TextEditingValue oldValue,
|
||||
TextEditingValue newValue,
|
||||
) {
|
||||
final digits = newValue.text.replaceAll(RegExp(r'\D'), '');
|
||||
final String formatted;
|
||||
if (digits.length <= 3) {
|
||||
formatted = digits;
|
||||
} else if (digits.length <= 6) {
|
||||
formatted = '${digits.substring(0, 3)}-${digits.substring(3)}';
|
||||
} else {
|
||||
formatted =
|
||||
'${digits.substring(0, 3)}-${digits.substring(3, 6)}-${digits.substring(6)}';
|
||||
}
|
||||
return TextEditingValue(
|
||||
text: formatted,
|
||||
selection: TextSelection.collapsed(offset: formatted.length),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
// ── Opción radio ──────────────────────────────────────────────────────────────
|
||||
class _RadioOption extends StatelessWidget {
|
||||
final int value, groupValue;
|
||||
|
||||
Reference in New Issue
Block a user