Lizandro GuarnizoandClaude Sonnet 4.6
f1dc2cb75d
Display: only prepend + if number doesn't already start with + URL: strip + and spaces so WhatsApp API receives digits only Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
435 lines
16 KiB
Dart
435 lines
16 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:prosapp_web_app/models/setting.dart';
|
|
import 'package:prosapp_web_app/providers/settings_provider.dart';
|
|
import 'package:prosapp_web_app/providers/theme_provider.dart';
|
|
import 'package:prosapp_web_app/services/api_service.dart';
|
|
import 'package:provider/provider.dart';
|
|
import 'package:url_launcher/url_launcher.dart';
|
|
|
|
class SupportView extends StatelessWidget {
|
|
const SupportView({super.key});
|
|
|
|
Future<void> _launchURL(String url) async {
|
|
if (url.isEmpty) return;
|
|
final uri = Uri.parse(url);
|
|
if (await canLaunchUrl(uri)) {
|
|
await launchUrl(uri, mode: LaunchMode.externalApplication, webOnlyWindowName: '_blank');
|
|
}
|
|
}
|
|
|
|
Future<void> _goSugerencias(BuildContext context) async {
|
|
final controller = TextEditingController();
|
|
final api = ApiService.instance;
|
|
bool sending = false;
|
|
|
|
await showDialog(
|
|
context: context,
|
|
builder: (ctx) => StatefulBuilder(
|
|
builder: (ctx, setState) => AlertDialog(
|
|
title: const Text('Enviar sugerencia'),
|
|
content: Column(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
const Text('Cuéntanos cómo podemos mejorar ProsApp',
|
|
style: TextStyle(fontSize: 14)),
|
|
const SizedBox(height: 16),
|
|
TextField(
|
|
controller: controller,
|
|
maxLines: 4,
|
|
decoration: const InputDecoration(
|
|
hintText: 'Escribe tu sugerencia aquí...',
|
|
border: OutlineInputBorder(),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
actions: [
|
|
TextButton(
|
|
onPressed: sending ? null : () => Navigator.pop(ctx),
|
|
child: const Text('Cancelar'),
|
|
),
|
|
FilledButton(
|
|
onPressed: sending
|
|
? null
|
|
: () async {
|
|
final msg = controller.text.trim();
|
|
if (msg.isEmpty) return;
|
|
setState(() => sending = true);
|
|
try {
|
|
await api.post('/suggestions', {'message': msg});
|
|
if (ctx.mounted) {
|
|
Navigator.pop(ctx);
|
|
ScaffoldMessenger.of(context).showSnackBar(
|
|
const SnackBar(
|
|
content: Text('¡Gracias por tu sugerencia!'),
|
|
backgroundColor: Colors.green,
|
|
),
|
|
);
|
|
}
|
|
} catch (_) {
|
|
setState(() => sending = false);
|
|
if (ctx.mounted) {
|
|
ScaffoldMessenger.of(context).showSnackBar(
|
|
const SnackBar(
|
|
content: Text('Error al enviar. Intenta de nuevo.'),
|
|
backgroundColor: Colors.red,
|
|
),
|
|
);
|
|
}
|
|
}
|
|
},
|
|
child: sending
|
|
? const SizedBox(
|
|
width: 16,
|
|
height: 16,
|
|
child: CircularProgressIndicator(strokeWidth: 2, color: Colors.white),
|
|
)
|
|
: const Text('Enviar'),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Future<void> _showPolicy(BuildContext context, String title, String key, bool isDark) async {
|
|
final api = ApiService.instance;
|
|
String? content;
|
|
try {
|
|
final data = await api.get('/settings/policies') as Map<String, dynamic>;
|
|
content = data[key] as String?;
|
|
} catch (_) {}
|
|
|
|
if (!context.mounted) return;
|
|
|
|
showDialog(
|
|
context: context,
|
|
builder: (_) => Dialog(
|
|
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(16)),
|
|
child: Container(
|
|
constraints: const BoxConstraints(maxWidth: 600, maxHeight: 600),
|
|
padding: const EdgeInsets.all(24),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Row(
|
|
children: [
|
|
Expanded(
|
|
child: Text(title,
|
|
style: TextStyle(
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.bold,
|
|
color: isDark ? Colors.white : const Color(0xFF0F172A),
|
|
)),
|
|
),
|
|
IconButton(
|
|
icon: const Icon(Icons.close),
|
|
onPressed: () => Navigator.pop(context),
|
|
),
|
|
],
|
|
),
|
|
const Divider(height: 24),
|
|
Expanded(
|
|
child: SingleChildScrollView(
|
|
child: Text(
|
|
(content != null && content.isNotEmpty)
|
|
? content
|
|
: 'Contenido no disponible aún.',
|
|
style: TextStyle(
|
|
fontSize: 14,
|
|
height: 1.6,
|
|
color: isDark ? Colors.white70 : const Color(0xFF374151),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final isDark = context.watch<ThemeProvider>().isDark;
|
|
|
|
return Consumer<SettingsProvider>(
|
|
builder: (context, settingsProvider, _) {
|
|
final settings = settingsProvider.settings ?? Setting.fromDocument({});
|
|
|
|
final cardBg = isDark ? const Color(0xFF1E293B) : Colors.white;
|
|
final borderColor = isDark ? const Color(0xFF334155) : const Color(0xFFE5E7EB);
|
|
final textPrimary = isDark ? Colors.white : const Color(0xFF111827);
|
|
final textSecondary = isDark ? const Color(0xFF94A3B8) : const Color(0xFF6B7280);
|
|
|
|
return ListView(
|
|
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 20),
|
|
children: [
|
|
Center(
|
|
child: ConstrainedBox(
|
|
constraints: const BoxConstraints(maxWidth: 680),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.stretch,
|
|
children: [
|
|
|
|
// ── Header ──
|
|
Container(
|
|
padding: const EdgeInsets.all(24),
|
|
decoration: BoxDecoration(
|
|
gradient: const LinearGradient(
|
|
colors: [Color(0xFF42A4EF), Color(0xFF1565C0)],
|
|
begin: Alignment.topLeft,
|
|
end: Alignment.bottomRight,
|
|
),
|
|
borderRadius: BorderRadius.circular(16),
|
|
),
|
|
child: Column(
|
|
children: [
|
|
const Icon(Icons.support_agent_rounded, color: Colors.white, size: 44),
|
|
const SizedBox(height: 12),
|
|
Text(
|
|
settings.tituloSoporte,
|
|
style: const TextStyle(
|
|
color: Colors.white,
|
|
fontSize: 22,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
textAlign: TextAlign.center,
|
|
),
|
|
if (settings.parrafoSoporte.isNotEmpty) ...[
|
|
const SizedBox(height: 8),
|
|
Text(
|
|
settings.parrafoSoporte,
|
|
style: const TextStyle(color: Colors.white70, fontSize: 13),
|
|
textAlign: TextAlign.center,
|
|
),
|
|
],
|
|
],
|
|
),
|
|
),
|
|
|
|
const SizedBox(height: 16),
|
|
|
|
// ── Horario ──
|
|
Container(
|
|
padding: const EdgeInsets.symmetric(horizontal: 18, vertical: 14),
|
|
decoration: BoxDecoration(
|
|
color: cardBg,
|
|
borderRadius: BorderRadius.circular(12),
|
|
border: Border.all(color: borderColor),
|
|
),
|
|
child: Row(
|
|
children: [
|
|
Container(
|
|
padding: const EdgeInsets.all(10),
|
|
decoration: BoxDecoration(
|
|
color: const Color(0xFF42A4EF).withOpacity(0.1),
|
|
shape: BoxShape.circle,
|
|
),
|
|
child: const Icon(Icons.schedule, color: Color(0xFF42A4EF), size: 20),
|
|
),
|
|
const SizedBox(width: 14),
|
|
Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Text('Horario de atención',
|
|
style: TextStyle(
|
|
fontSize: 13,
|
|
fontWeight: FontWeight.w600,
|
|
color: textPrimary,
|
|
)),
|
|
const SizedBox(height: 2),
|
|
Text(
|
|
'${settings.diasSoporte} • ${settings.horasSoporte}',
|
|
style: TextStyle(fontSize: 12, color: textSecondary),
|
|
),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
),
|
|
|
|
const SizedBox(height: 16),
|
|
|
|
// ── Contacto ──
|
|
Text('Contáctanos',
|
|
style: TextStyle(
|
|
fontSize: 13,
|
|
fontWeight: FontWeight.w600,
|
|
color: textSecondary,
|
|
letterSpacing: 0.4,
|
|
)),
|
|
const SizedBox(height: 8),
|
|
|
|
_ContactTile(
|
|
icon: Icons.chat_rounded,
|
|
iconColor: const Color(0xFF25D366),
|
|
label: 'WhatsApp',
|
|
subtitle: settings.numeroSoporte.isNotEmpty
|
|
? (settings.numeroSoporte.startsWith('+')
|
|
? settings.numeroSoporte
|
|
: '+${settings.numeroSoporte}')
|
|
: 'No configurado',
|
|
isDark: isDark,
|
|
cardBg: cardBg,
|
|
borderColor: borderColor,
|
|
onTap: settings.numeroSoporte.isNotEmpty
|
|
? () => _launchURL(
|
|
'https://api.whatsapp.com/send?phone=${settings.numeroSoporte.replaceAll('+', '').replaceAll(' ', '')}&text=${Uri.encodeComponent('Hola, soy usuario de ProsApp')}')
|
|
: null,
|
|
),
|
|
|
|
const SizedBox(height: 8),
|
|
|
|
_ContactTile(
|
|
icon: Icons.email_outlined,
|
|
iconColor: const Color(0xFF42A4EF),
|
|
label: 'Email',
|
|
subtitle: settings.emailSoporte.isNotEmpty
|
|
? settings.emailSoporte
|
|
: 'No configurado',
|
|
isDark: isDark,
|
|
cardBg: cardBg,
|
|
borderColor: borderColor,
|
|
onTap: settings.emailSoporte.isNotEmpty
|
|
? () => _launchURL('mailto:${settings.emailSoporte}')
|
|
: null,
|
|
),
|
|
|
|
const SizedBox(height: 8),
|
|
|
|
_ContactTile(
|
|
icon: Icons.lightbulb_outline,
|
|
iconColor: const Color(0xFFF59E0B),
|
|
label: 'Sugerencias',
|
|
subtitle: 'Ayúdanos a mejorar ProsApp',
|
|
isDark: isDark,
|
|
cardBg: cardBg,
|
|
borderColor: borderColor,
|
|
onTap: () => _goSugerencias(context),
|
|
),
|
|
|
|
const SizedBox(height: 20),
|
|
|
|
// ── Legal ──
|
|
Text('Legal',
|
|
style: TextStyle(
|
|
fontSize: 13,
|
|
fontWeight: FontWeight.w600,
|
|
color: textSecondary,
|
|
letterSpacing: 0.4,
|
|
)),
|
|
const SizedBox(height: 8),
|
|
|
|
_ContactTile(
|
|
icon: Icons.shield_outlined,
|
|
iconColor: const Color(0xFF8B5CF6),
|
|
label: 'Políticas de Privacidad',
|
|
subtitle: 'Cómo protegemos tus datos',
|
|
isDark: isDark,
|
|
cardBg: cardBg,
|
|
borderColor: borderColor,
|
|
onTap: () => _showPolicy(context, 'Políticas de Privacidad', 'privacy', isDark),
|
|
),
|
|
|
|
const SizedBox(height: 8),
|
|
|
|
_ContactTile(
|
|
icon: Icons.article_outlined,
|
|
iconColor: const Color(0xFF10B981),
|
|
label: 'Términos y Condiciones',
|
|
subtitle: 'Condiciones de uso de la plataforma',
|
|
isDark: isDark,
|
|
cardBg: cardBg,
|
|
borderColor: borderColor,
|
|
onTap: () => _showPolicy(context, 'Términos y Condiciones', 'terms', isDark),
|
|
),
|
|
|
|
const SizedBox(height: 24),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
],
|
|
);
|
|
},
|
|
);
|
|
}
|
|
}
|
|
|
|
class _ContactTile extends StatelessWidget {
|
|
final IconData icon;
|
|
final Color iconColor;
|
|
final String label;
|
|
final String subtitle;
|
|
final bool isDark;
|
|
final Color cardBg;
|
|
final Color borderColor;
|
|
final VoidCallback? onTap;
|
|
|
|
const _ContactTile({
|
|
required this.icon,
|
|
required this.iconColor,
|
|
required this.label,
|
|
required this.subtitle,
|
|
required this.isDark,
|
|
required this.cardBg,
|
|
required this.borderColor,
|
|
this.onTap,
|
|
});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final textPrimary = isDark ? Colors.white : const Color(0xFF111827);
|
|
final textSecondary = isDark ? const Color(0xFF94A3B8) : const Color(0xFF6B7280);
|
|
|
|
return Material(
|
|
color: cardBg,
|
|
borderRadius: BorderRadius.circular(12),
|
|
child: InkWell(
|
|
onTap: onTap,
|
|
borderRadius: BorderRadius.circular(12),
|
|
child: Container(
|
|
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 14),
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(12),
|
|
border: Border.all(color: borderColor),
|
|
),
|
|
child: Row(
|
|
children: [
|
|
Container(
|
|
padding: const EdgeInsets.all(9),
|
|
decoration: BoxDecoration(
|
|
color: iconColor.withOpacity(0.12),
|
|
shape: BoxShape.circle,
|
|
),
|
|
child: Icon(icon, color: iconColor, size: 20),
|
|
),
|
|
const SizedBox(width: 14),
|
|
Expanded(
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Text(label,
|
|
style: TextStyle(
|
|
fontSize: 14,
|
|
fontWeight: FontWeight.w600,
|
|
color: textPrimary,
|
|
)),
|
|
const SizedBox(height: 2),
|
|
Text(subtitle,
|
|
style: TextStyle(fontSize: 12, color: textSecondary)),
|
|
],
|
|
),
|
|
),
|
|
if (onTap != null)
|
|
Icon(Icons.chevron_right, color: textSecondary, size: 20),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|