lionsdev/unionflow-mobile-apps
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initial commit: unionflow-mobile-apps

Browse Source 
Application Flutter complète (sans build artifacts).

Signed-off-by: lions dev Team
This commit is contained in:
dahoud
2026-03-15 16:30:08 +00:00
commit d094d6db9c
1790 changed files with 507435 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

445
lib/features/members/presentation/pages/members_page_connected.dart Normal file
View File

@@ -0,0 +1,445 @@
import 'dart:async';
import 'package:flutter/material.dart';
import '../../../../shared/design_system/unionflow_design_v2.dart';
import '../../../../shared/design_system/components/uf_app_bar.dart';
import '../../../../core/constants/app_constants.dart';
import '../widgets/add_member_dialog.dart';
/// Annuaire des Membres - Design UnionFlow
class MembersPageWithDataAndPagination extends StatefulWidget {
final List<Map<String, dynamic>> members;
final int totalCount;
final int currentPage;
final int totalPages;
final Function(int page, String? recherche) onPageChanged;
final VoidCallback onRefresh;
final void Function(String? query)? onSearch;
final VoidCallback? onAddMember;
const MembersPageWithDataAndPagination({
super.key,
required this.members,
required this.totalCount,
required this.currentPage,
required this.totalPages,
required this.onPageChanged,
required this.onRefresh,
this.onSearch,
this.onAddMember,
});
@override
State<MembersPageWithDataAndPagination> createState() => _MembersPageWithDataAndPaginationState();
}
class _MembersPageWithDataAndPaginationState extends State<MembersPageWithDataAndPagination> {
final TextEditingController _searchController = TextEditingController();
String _searchQuery = '';
String _filterStatus = 'Tous';
Timer? _searchDebounce;
@override
void dispose() {
_searchDebounce?.cancel();
_searchController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: UnionFlowColors.background,
appBar: UFAppBar(
title: 'Annuaire Membres',
backgroundColor: UnionFlowColors.surface,
foregroundColor: UnionFlowColors.textPrimary,
actions: [
if (widget.onAddMember != null)
IconButton(
icon: const Icon(Icons.person_add_outlined),
color: UnionFlowColors.unionGreen,
onPressed: widget.onAddMember,
tooltip: 'Ajouter un membre',
),
const SizedBox(width: 8),
],
),
body: Column(
children: [
_buildHeader(),
_buildSearchAndFilters(),
Expanded(child: _buildMembersList()),
if (widget.totalPages > 1) _buildPagination(),
],
),
);
}
Widget _buildHeader() {
final activeCount = widget.members.where((m) => m['status'] == 'Actif').length;
final pendingCount = widget.members.where((m) => m['status'] == 'En attente').length;
return Container(
padding: const EdgeInsets.all(20),
decoration: BoxDecoration(
color: UnionFlowColors.surface,
border: Border(
bottom: BorderSide(color: UnionFlowColors.border.withOpacity(0.5), width: 1),
),
),
child: Row(
children: [
Expanded(child: _buildStatBadge('Total', widget.totalCount.toString(), UnionFlowColors.unionGreen)),
const SizedBox(width: 12),
Expanded(child: _buildStatBadge('Actifs', activeCount.toString(), UnionFlowColors.success)),
const SizedBox(width: 12),
Expanded(child: _buildStatBadge('Attente', pendingCount.toString(), UnionFlowColors.warning)),
],
),
);
}
Widget _buildStatBadge(String label, String value, Color color) {
return Container(
padding: const EdgeInsets.symmetric(vertical: 12, horizontal: 8),
decoration: BoxDecoration(
color: color.withOpacity(0.1),
borderRadius: BorderRadius.circular(12),
border: Border.all(color: color.withOpacity(0.3), width: 1),
),
child: Column(
children: [
Text(value, style: TextStyle(fontSize: 20, fontWeight: FontWeight.w700, color: color)),
const SizedBox(height: 2),
Text(label, style: TextStyle(fontSize: 10, fontWeight: FontWeight.w600, color: color)),
],
),
);
}
Widget _buildSearchAndFilters() {
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: UnionFlowColors.surface,
border: Border(bottom: BorderSide(color: UnionFlowColors.border.withOpacity(0.5), width: 1)),
),
child: Column(
children: [
TextField(
controller: _searchController,
onChanged: (v) {
setState(() => _searchQuery = v);
_searchDebounce?.cancel();
_searchDebounce = Timer(AppConstants.searchDebounce, () {
widget.onSearch?.call(v.isEmpty ? null : v);
});
},
style: const TextStyle(fontSize: 14, color: UnionFlowColors.textPrimary),
decoration: InputDecoration(
hintText: 'Rechercher un membre...',
hintStyle: const TextStyle(fontSize: 13, color: UnionFlowColors.textTertiary),
prefixIcon: const Icon(Icons.search, size: 20, color: UnionFlowColors.textSecondary),
suffixIcon: _searchQuery.isNotEmpty
? IconButton(
icon: const Icon(Icons.clear, size: 18, color: UnionFlowColors.textSecondary),
onPressed: () {
_searchDebounce?.cancel();
_searchController.clear();
setState(() => _searchQuery = '');
widget.onSearch?.call(null);
},
)
: null,
contentPadding: const EdgeInsets.symmetric(vertical: 12, horizontal: 16),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: BorderSide(color: UnionFlowColors.border.withOpacity(0.3)),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: BorderSide(color: UnionFlowColors.border.withOpacity(0.3)),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: const BorderSide(color: UnionFlowColors.unionGreen, width: 1.5),
),
filled: true,
fillColor: UnionFlowColors.surfaceVariant.withOpacity(0.3),
),
),
const SizedBox(height: 12),
SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: Row(
children: [
_buildFilterChip('Tous'),
const SizedBox(width: 8),
_buildFilterChip('Actif'),
const SizedBox(width: 8),
_buildFilterChip('Inactif'),
const SizedBox(width: 8),
_buildFilterChip('En attente'),
],
),
),
],
),
);
}
Widget _buildFilterChip(String label) {
final isSelected = _filterStatus == label;
return GestureDetector(
onTap: () => setState(() => _filterStatus = label),
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
decoration: BoxDecoration(
color: isSelected ? UnionFlowColors.unionGreen : UnionFlowColors.surface,
borderRadius: BorderRadius.circular(20),
border: Border.all(color: isSelected ? UnionFlowColors.unionGreen : UnionFlowColors.border, width: 1),
),
child: Text(
label,
style: TextStyle(
fontSize: 12,
fontWeight: FontWeight.w600,
color: isSelected ? Colors.white : UnionFlowColors.textSecondary,
),
),
),
);
}
Widget _buildMembersList() {
final filtered = widget.members.where((m) {
final matchesSearch = _searchQuery.isEmpty ||
m['name']!.toLowerCase().contains(_searchQuery.toLowerCase()) ||
(m['email']?.toLowerCase().contains(_searchQuery.toLowerCase()) ?? false);
final matchesStatus = _filterStatus == 'Tous' || m['status'] == _filterStatus;
return matchesSearch && matchesStatus;
}).toList();
if (filtered.isEmpty) return _buildEmptyState();
return RefreshIndicator(
onRefresh: () async => widget.onRefresh(),
color: UnionFlowColors.unionGreen,
child: ListView.separated(
padding: const EdgeInsets.all(16),
itemCount: filtered.length,
separatorBuilder: (_, __) => const SizedBox(height: 12),
itemBuilder: (context, index) => _buildMemberCard(filtered[index]),
),
);
}
Widget _buildMemberCard(Map<String, dynamic> member) {
return GestureDetector(
onTap: () => _showMemberDetails(member),
child: Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: UnionFlowColors.surface,
borderRadius: BorderRadius.circular(16),
boxShadow: UnionFlowColors.softShadow,
border: Border.all(color: UnionFlowColors.border.withOpacity(0.3), width: 1),
),
child: Row(
children: [
Container(
width: 48,
height: 48,
decoration: const BoxDecoration(gradient: UnionFlowColors.primaryGradient, shape: BoxShape.circle),
alignment: Alignment.center,
child: Text(
member['initiales'] ?? '??',
style: const TextStyle(color: Colors.white, fontWeight: FontWeight.w700, fontSize: 18),
),
),
const SizedBox(width: 12),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
member['name'] ?? 'Inconnu',
style: const TextStyle(fontSize: 14, fontWeight: FontWeight.w600, color: UnionFlowColors.textPrimary),
),
const SizedBox(height: 2),
Text(
member['role'] ?? 'Membre',
style: const TextStyle(fontSize: 12, color: UnionFlowColors.textSecondary),
),
if (member['email'] != null) ...[
const SizedBox(height: 4),
Row(
children: [
const Icon(Icons.email_outlined, size: 12, color: UnionFlowColors.textTertiary),
const SizedBox(width: 4),
Text(member['email']!, style: const TextStyle(fontSize: 11, color: UnionFlowColors.textTertiary)),
],
),
],
],
),
),
_buildStatusBadge(member['status']),
],
),
),
);
}
Widget _buildStatusBadge(String? status) {
Color color;
switch (status) {
case 'Actif':
color = UnionFlowColors.success;
break;
case 'Inactif':
color = UnionFlowColors.error;
break;
case 'En attente':
color = UnionFlowColors.warning;
break;
default:
color = UnionFlowColors.textSecondary;
}
return Container(
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
decoration: BoxDecoration(
color: color.withOpacity(0.1),
borderRadius: BorderRadius.circular(12),
border: Border.all(color: color.withOpacity(0.3), width: 1),
),
child: Text(status ?? '?', style: TextStyle(fontSize: 11, fontWeight: FontWeight.w600, color: color)),
);
}
Widget _buildEmptyState() {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
padding: const EdgeInsets.all(24),
decoration: const BoxDecoration(color: UnionFlowColors.unionGreenPale, shape: BoxShape.circle),
child: const Icon(Icons.people_outline, size: 64, color: UnionFlowColors.unionGreen),
),
const SizedBox(height: 24),
const Text(
'Aucun membre trouvé',
style: TextStyle(fontSize: 16, fontWeight: FontWeight.w700, color: UnionFlowColors.textPrimary),
),
const SizedBox(height: 8),
Text(
_searchQuery.isEmpty ? 'Changez vos filtres' : 'Essayez une autre recherche',
style: const TextStyle(fontSize: 13, color: UnionFlowColors.textSecondary),
),
],
),
);
}
Widget _buildPagination() {
return Container(
padding: const EdgeInsets.symmetric(vertical: 12),
decoration: BoxDecoration(
color: UnionFlowColors.surface,
border: Border(top: BorderSide(color: UnionFlowColors.border.withOpacity(0.5), width: 1)),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
IconButton(
icon: const Icon(Icons.chevron_left, size: 24),
color: widget.currentPage > 0 ? UnionFlowColors.unionGreen : UnionFlowColors.textTertiary,
onPressed: widget.currentPage > 0
? () => widget.onPageChanged(
widget.currentPage - 1,
_searchQuery.isEmpty ? null : _searchQuery,
)
: null,
),
Container(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
decoration: BoxDecoration(gradient: UnionFlowColors.primaryGradient, borderRadius: BorderRadius.circular(20)),
child: Text(
'Page ${widget.currentPage + 1} / ${widget.totalPages}',
style: const TextStyle(fontSize: 13, fontWeight: FontWeight.w600, color: Colors.white),
),
),
IconButton(
icon: const Icon(Icons.chevron_right, size: 24),
color: widget.currentPage < widget.totalPages - 1 ? UnionFlowColors.unionGreen : UnionFlowColors.textTertiary,
onPressed: widget.currentPage < widget.totalPages - 1
? () => widget.onPageChanged(
widget.currentPage + 1,
_searchQuery.isEmpty ? null : _searchQuery,
)
: null,
),
],
),
);
}
void _showMemberDetails(Map<String, dynamic> member) {
showModalBottomSheet(
context: context,
backgroundColor: Colors.transparent,
builder: (context) => Container(
padding: const EdgeInsets.all(24),
decoration: const BoxDecoration(
color: UnionFlowColors.surface,
borderRadius: BorderRadius.vertical(top: Radius.circular(24)),
),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Container(
width: 80,
height: 80,
decoration: const BoxDecoration(gradient: UnionFlowColors.primaryGradient, shape: BoxShape.circle),
alignment: Alignment.center,
child: Text(
member['initiales'] ?? '??',
style: const TextStyle(color: Colors.white, fontWeight: FontWeight.w900, fontSize: 32),
),
),
const SizedBox(height: 16),
Text(
member['name'] ?? '',
style: const TextStyle(fontSize: 18, fontWeight: FontWeight.w700, color: UnionFlowColors.textPrimary),
),
const SizedBox(height: 4),
Text(
member['role'] ?? '',
style: const TextStyle(fontSize: 13, color: UnionFlowColors.textSecondary),
),
const SizedBox(height: 20),
_buildInfoRow(Icons.email_outlined, member['email'] ?? 'Non fourni'),
_buildInfoRow(Icons.phone_outlined, member['phone'] ?? 'Non fourni'),
_buildInfoRow(Icons.location_on_outlined, member['location'] ?? 'Non renseigné'),
_buildInfoRow(Icons.work_outline, member['department'] ?? 'Aucun département'),
const SizedBox(height: 24),
],
),
),
);
}
Widget _buildInfoRow(IconData icon, String text) {
return Padding(
padding: const EdgeInsets.symmetric(vertical: 8),
child: Row(
children: [
Icon(icon, size: 18, color: UnionFlowColors.unionGreen),
const SizedBox(width: 12),
Expanded(child: Text(text, style: const TextStyle(fontSize: 13, color: UnionFlowColors.textPrimary))),
],
),
);
}
}