Update: 2026-05-08 01:41:28
This commit is contained in:
@@ -1,86 +1,174 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:get/get.dart';
|
||||
import '../controllers/notifications_controller.dart';
|
||||
|
||||
class NotificationsView extends StatelessWidget {
|
||||
const NotificationsView({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final controller = Get.put(NotificationsController());
|
||||
final isDark = Theme.of(context).brightness == Brightness.dark;
|
||||
|
||||
return Column(
|
||||
children: [
|
||||
// Top Bar
|
||||
Container(
|
||||
padding: EdgeInsets.only(top: MediaQuery.of(context).padding.top, left: 8, right: 8, bottom: 12),
|
||||
color: isDark ? const Color(0xFF1E1E2E) : const Color(0xFF0F4C81),
|
||||
child: Row(
|
||||
children: [
|
||||
const SizedBox(width: 48),
|
||||
Expanded(
|
||||
child: Center(
|
||||
child: Text(
|
||||
'الإشعارات',
|
||||
style: TextStyle(color: Colors.white, fontSize: 18, fontWeight: FontWeight.bold),
|
||||
),
|
||||
),
|
||||
),
|
||||
IconButton(
|
||||
icon: const Icon(Icons.done_all_rounded, color: Colors.white),
|
||||
onPressed: () {},
|
||||
tooltip: 'قراءة الكل',
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
return Scaffold(
|
||||
backgroundColor: isDark ? const Color(0xFF121212) : const Color(0xFFF5F7FA),
|
||||
appBar: AppBar(
|
||||
title: const Text('الإشعارات', style: TextStyle(fontWeight: FontWeight.bold)),
|
||||
backgroundColor: const Color(0xFF0F4C81),
|
||||
foregroundColor: Colors.white,
|
||||
actions: [
|
||||
Obx(() => controller.unreadCount.value > 0
|
||||
? TextButton.icon(
|
||||
onPressed: () => controller.markAllRead(),
|
||||
icon: const Icon(Icons.done_all, color: Colors.white, size: 18),
|
||||
label: const Text('قراءة الكل', style: TextStyle(color: Colors.white, fontSize: 12)),
|
||||
)
|
||||
: const SizedBox.shrink()),
|
||||
],
|
||||
),
|
||||
body: Obx(() {
|
||||
if (controller.isLoading.value) {
|
||||
return const Center(child: CircularProgressIndicator(color: Color(0xFF0F4C81)));
|
||||
}
|
||||
|
||||
// Notifications List
|
||||
Expanded(
|
||||
child: _buildEmptyState(isDark),
|
||||
),
|
||||
],
|
||||
if (controller.notifications.isEmpty) {
|
||||
return Center(
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Icon(Icons.notifications_none, size: 72, color: isDark ? Colors.white12 : Colors.grey.shade300),
|
||||
const SizedBox(height: 12),
|
||||
Text('لا توجد إشعارات', style: TextStyle(color: isDark ? Colors.white38 : Colors.grey, fontSize: 16)),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
return RefreshIndicator(
|
||||
onRefresh: controller.fetchNotifications,
|
||||
child: ListView.builder(
|
||||
padding: const EdgeInsets.all(12),
|
||||
itemCount: controller.notifications.length,
|
||||
itemBuilder: (context, index) {
|
||||
final notif = controller.notifications[index];
|
||||
return _buildNotifItem(notif, controller, isDark);
|
||||
},
|
||||
),
|
||||
);
|
||||
}),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildEmptyState(bool isDark) {
|
||||
return Center(
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Container(
|
||||
width: 100,
|
||||
height: 100,
|
||||
decoration: BoxDecoration(
|
||||
color: isDark ? Colors.white.withOpacity(0.05) : const Color(0xFFF1F5F9),
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: Icon(
|
||||
Icons.notifications_off_rounded,
|
||||
size: 48,
|
||||
color: isDark ? Colors.white12 : Colors.grey.shade300,
|
||||
),
|
||||
Widget _buildNotifItem(Map<String, dynamic> notif, NotificationsController ctrl, bool isDark) {
|
||||
final isRead = notif['is_read'] == 1;
|
||||
final type = notif['type']?.toString() ?? 'info';
|
||||
final category = notif['category']?.toString() ?? 'general';
|
||||
|
||||
final IconData icon;
|
||||
final Color color;
|
||||
switch (type) {
|
||||
case 'success':
|
||||
icon = Icons.check_circle;
|
||||
color = const Color(0xFF10B981);
|
||||
break;
|
||||
case 'warning':
|
||||
icon = Icons.warning_amber_rounded;
|
||||
color = const Color(0xFFF59E0B);
|
||||
break;
|
||||
case 'error':
|
||||
icon = Icons.error;
|
||||
color = const Color(0xFFEF4444);
|
||||
break;
|
||||
default:
|
||||
icon = _categoryIcon(category);
|
||||
color = const Color(0xFF3B82F6);
|
||||
}
|
||||
|
||||
return GestureDetector(
|
||||
onTap: () {
|
||||
if (!isRead) ctrl.markAsRead(notif['id']);
|
||||
if (notif['entity_type'] == 'invoice' && notif['entity_id'] != null) {
|
||||
Get.toNamed('/invoice-detail', arguments: {'id': notif['entity_id']});
|
||||
}
|
||||
},
|
||||
child: Container(
|
||||
margin: const EdgeInsets.only(bottom: 8),
|
||||
padding: const EdgeInsets.all(14),
|
||||
decoration: BoxDecoration(
|
||||
color: isRead
|
||||
? (isDark ? const Color(0xFF1E1E2E) : Colors.white)
|
||||
: (isDark ? const Color(0xFF1A2332) : const Color(0xFFF0F7FF)),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
border: Border.all(
|
||||
color: isRead
|
||||
? (isDark ? Colors.white10 : Colors.grey.shade200)
|
||||
: const Color(0xFF3B82F6).withValues(alpha: 0.2),
|
||||
),
|
||||
const SizedBox(height: 20),
|
||||
Text(
|
||||
'لا توجد إشعارات',
|
||||
style: TextStyle(
|
||||
fontSize: 18,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: isDark ? Colors.white38 : Colors.grey,
|
||||
),
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Container(
|
||||
width: 42, height: 42,
|
||||
decoration: BoxDecoration(
|
||||
color: color.withValues(alpha: 0.1),
|
||||
borderRadius: BorderRadius.circular(10),
|
||||
),
|
||||
child: Icon(icon, color: color, size: 20),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
'ستظهر هنا إشعارات معالجة الفواتير\nوتحديثات الاشتراك',
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
fontSize: 13,
|
||||
color: isDark ? Colors.white24 : Colors.grey.shade400,
|
||||
height: 1.5,
|
||||
const SizedBox(width: 12),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: Text(
|
||||
notif['title'] ?? '',
|
||||
style: TextStyle(
|
||||
fontWeight: isRead ? FontWeight.w500 : FontWeight.w700,
|
||||
fontSize: 14,
|
||||
color: isDark ? Colors.white : Colors.black87,
|
||||
),
|
||||
),
|
||||
),
|
||||
if (!isRead)
|
||||
Container(
|
||||
width: 8, height: 8,
|
||||
decoration: const BoxDecoration(shape: BoxShape.circle, color: Color(0xFF3B82F6)),
|
||||
),
|
||||
],
|
||||
),
|
||||
if (notif['body'] != null && notif['body'].toString().isNotEmpty) ...[
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
notif['body'],
|
||||
style: TextStyle(fontSize: 13, color: isDark ? Colors.white54 : Colors.grey.shade600),
|
||||
maxLines: 2, overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
],
|
||||
const SizedBox(height: 6),
|
||||
Text(
|
||||
notif['created_at'] ?? '',
|
||||
style: TextStyle(fontSize: 11, color: isDark ? Colors.white24 : Colors.grey.shade400, fontFamily: 'monospace'),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
IconData _categoryIcon(String category) {
|
||||
return switch (category) {
|
||||
'invoice' => Icons.receipt_long,
|
||||
'payment' => Icons.payment,
|
||||
'subscription' => Icons.workspace_premium,
|
||||
'system' => Icons.settings,
|
||||
_ => Icons.notifications,
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user