import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import '../providers/auth_provider.dart'; import '../theme.dart'; import '../l10n/app_localizations.dart'; class EmployeePage extends ConsumerStatefulWidget { const EmployeePage({super.key}); @override ConsumerState createState() => _EmployeePageState(); } class _EmployeePageState extends ConsumerState { final List> _employees = [ {'name': '李员工', 'phone': '138****6666', 'role': '前台', 'status': '在职'}, {'name': '王维修', 'phone': '139****5555', 'role': '维修工', 'status': '在职'}, {'name': '张清洁', 'phone': '137****4444', 'role': '保洁', 'status': '休假'}, {'name': '刘行政', 'phone': '136****3333', 'role': '行政', 'status': '在职'}, {'name': '赵救生员', 'phone': '135****2222', 'role': '救生员', 'status': '在职'}, ]; void _showAddEmployeeSheet() { final l10n = AppLocalizations.of(context)!; final nameCtrl = TextEditingController(); final phoneCtrl = TextEditingController(); String role = l10n.receptionist; final roles = [ l10n.receptionist, l10n.maintenance, l10n.cleaner, l10n.admin, l10n.lifeguard, l10n.chef, l10n.security, ]; showModalBottomSheet( context: context, backgroundColor: Colors.transparent, isScrollControlled: true, builder: (ctx) { return Padding( padding: EdgeInsets.only(bottom: MediaQuery.of(ctx).viewInsets.bottom), child: Container( padding: const EdgeInsets.all(24), decoration: const BoxDecoration( color: Colors.white, borderRadius: BorderRadius.vertical(top: Radius.circular(24)), ), child: SafeArea( child: Column( mainAxisSize: MainAxisSize.min, crossAxisAlignment: CrossAxisAlignment.start, children: [ Center( child: Container( width: 40, height: 4, decoration: BoxDecoration( color: AppColors.divider, borderRadius: BorderRadius.circular(2), ), ), ), const SizedBox(height: 20), Text( l10n.addEmployee, style: TextStyle( fontSize: 20, fontWeight: FontWeight.bold, color: AppColors.textPrimary, ), ), const SizedBox(height: 20), TextField( controller: nameCtrl, decoration: InputDecoration( hintText: l10n.employeeName, prefixIcon: const Icon(Icons.person_outline), filled: true, fillColor: AppColors.background, border: OutlineInputBorder( borderRadius: BorderRadius.circular(12), borderSide: BorderSide.none, ), ), ), const SizedBox(height: 12), TextField( controller: phoneCtrl, keyboardType: TextInputType.phone, decoration: InputDecoration( hintText: l10n.phoneNumber, prefixIcon: const Icon(Icons.phone_outlined), filled: true, fillColor: AppColors.background, border: OutlineInputBorder( borderRadius: BorderRadius.circular(12), borderSide: BorderSide.none, ), ), ), const SizedBox(height: 12), StatefulBuilder( builder: (context, setLocalState) { return Container( padding: const EdgeInsets.symmetric(horizontal: 12), decoration: BoxDecoration( color: AppColors.background, borderRadius: BorderRadius.circular(12), ), child: DropdownButtonHideUnderline( child: DropdownButton( isExpanded: true, value: role, items: roles .map((r) => DropdownMenuItem( value: r, child: Text(r), )) .toList(), onChanged: (v) { if (v != null) { setLocalState(() => role = v); } }, ), ), ); }, ), const SizedBox(height: 24), SizedBox( width: double.infinity, height: 52, child: ElevatedButton( onPressed: () { if (nameCtrl.text.trim().isEmpty || phoneCtrl.text.trim().isEmpty) { ScaffoldMessenger.of(ctx).showSnackBar( SnackBar(content: Text(l10n.pleaseComplete)), ); return; } setState(() { _employees.add({ 'name': nameCtrl.text.trim(), 'phone': phoneCtrl.text.trim(), 'role': role, 'status': l10n.active, }); }); Navigator.of(ctx).pop(); ScaffoldMessenger.of(context).showSnackBar( SnackBar( content: Text(l10n.addSuccess), backgroundColor: AppColors.success, ), ); }, style: ElevatedButton.styleFrom( backgroundColor: AppColors.primary, foregroundColor: Colors.white, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(14), ), ), child: Text(l10n.confirmAdd, style: const TextStyle( fontSize: 16, fontWeight: FontWeight.w600)), ), ), ], ), ), ), ); }, ); } void _showEmployeeActions(int index) { final l10n = AppLocalizations.of(context)!; final emp = _employees[index]; showModalBottomSheet( context: context, backgroundColor: Colors.transparent, builder: (ctx) { return Container( padding: const EdgeInsets.all(20), decoration: const BoxDecoration( color: Colors.white, borderRadius: BorderRadius.vertical(top: Radius.circular(24)), ), child: SafeArea( child: Column( mainAxisSize: MainAxisSize.min, children: [ Container( width: 40, height: 4, decoration: BoxDecoration( color: AppColors.divider, borderRadius: BorderRadius.circular(2), ), ), const SizedBox(height: 20), Text( emp['name'], style: TextStyle( fontSize: 18, fontWeight: FontWeight.bold, color: AppColors.textPrimary, ), ), const SizedBox(height: 4), Text( '${emp['role']} | ${emp['phone']}', style: TextStyle( fontSize: 14, color: AppColors.textSecondary, ), ), const SizedBox(height: 20), ListTile( leading: const Icon(Icons.phone, color: AppColors.primary), title: Text(l10n.call), shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(12), ), onTap: () { Navigator.of(ctx).pop(); ScaffoldMessenger.of(context).showSnackBar( SnackBar(content: Text('${l10n.call} ${emp['name']}...')), ); }, ), ListTile( leading: Icon( emp['status'] == l10n.active ? Icons.pause_circle_outline : Icons.play_circle_outline, color: AppColors.warning, ), title: Text(emp['status'] == l10n.active ? l10n.setOnLeave : l10n.restoreActive), shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(12), ), onTap: () { Navigator.of(ctx).pop(); setState(() { _employees[index]['status'] = emp['status'] == l10n.active ? l10n.onLeave : l10n.active; }); }, ), ListTile( leading: const Icon(Icons.delete_outline, color: AppColors.error), title: Text(l10n.deleteEmployee, style: const TextStyle(color: AppColors.error)), shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(12), ), onTap: () { Navigator.of(ctx).pop(); showDialog( context: context, builder: (_) => AlertDialog( title: Text(l10n.confirmDelete), content: Text(l10n.deleteConfirm(emp['name'])), actions: [ TextButton( onPressed: () => Navigator.of(_).pop(), child: Text(l10n.cancel), ), TextButton( onPressed: () { Navigator.of(_).pop(); setState(() => _employees.removeAt(index)); ScaffoldMessenger.of(context).showSnackBar( SnackBar( content: Text(l10n.deleteSuccess), backgroundColor: AppColors.error, ), ); }, child: Text(l10n.delete, style: const TextStyle(color: AppColors.error)), ), ], ), ); }, ), ], ), ), ); }, ); } @override Widget build(BuildContext context) { final l10n = AppLocalizations.of(context)!; final authState = ref.watch(authProvider); final isBoss = authState.user?.isBoss ?? false; return Scaffold( backgroundColor: AppColors.background, appBar: AppBar(title: Text(l10n.employeeList)), body: _employees.isEmpty ? Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ Icon(Icons.people_outline, size: 64, color: AppColors.textTertiary.withValues(alpha: 0.5)), const SizedBox(height: 16), Text(l10n.noEmployees, style: TextStyle( fontSize: 16, color: AppColors.textSecondary)), ], ), ) : ListView.builder( padding: const EdgeInsets.all(16), itemCount: _employees.length, itemBuilder: (context, index) { final emp = _employees[index]; return Container( margin: const EdgeInsets.only(bottom: 12), padding: const EdgeInsets.all(16), decoration: BoxDecoration( color: AppColors.surface, borderRadius: BorderRadius.circular(16), boxShadow: [ BoxShadow( color: Colors.black.withValues(alpha: 0.03), blurRadius: 10, offset: const Offset(0, 2), ), ], ), child: Row( children: [ CircleAvatar( radius: 24, backgroundColor: AppColors.primary.withValues(alpha: 0.1), child: Text( emp['name'].toString().substring(0, 1), style: const TextStyle( fontSize: 16, fontWeight: FontWeight.bold, color: AppColors.primary, ), ), ), const SizedBox(width: 14), Expanded( child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Row( children: [ Text( emp['name'], style: TextStyle( fontSize: 16, fontWeight: FontWeight.w600, color: AppColors.textPrimary, ), ), const SizedBox(width: 8), Container( padding: const EdgeInsets.symmetric( horizontal: 8, vertical: 2), decoration: BoxDecoration( color: emp['status'] == l10n.active ? AppColors.success.withValues(alpha: 0.1) : AppColors.warning.withValues(alpha: 0.1), borderRadius: BorderRadius.circular(4), ), child: Text( emp['status'], style: TextStyle( fontSize: 11, color: emp['status'] == l10n.active ? AppColors.success : AppColors.warning, fontWeight: FontWeight.w500, ), ), ), ], ), const SizedBox(height: 6), Text( '${emp['role']} | ${emp['phone']}', style: TextStyle( fontSize: 13, color: AppColors.textSecondary, ), ), ], ), ), if (isBoss) IconButton( icon: Icon(Icons.more_vert, color: AppColors.textTertiary), onPressed: () => _showEmployeeActions(index), ), ], ), ); }, ), floatingActionButton: isBoss ? FloatingActionButton( onPressed: _showAddEmployeeSheet, child: const Icon(Icons.add), ) : null, ); } }