416 lines
13 KiB
Dart
416 lines
13 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:sijentik/component/app_theme.dart';
|
|
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
|
|
|
|
class ProfilePetugasPage extends StatefulWidget {
|
|
const ProfilePetugasPage({super.key});
|
|
|
|
@override
|
|
State<ProfilePetugasPage> createState() => _ProfilePetugasPageState();
|
|
}
|
|
|
|
class _ProfilePetugasPageState extends State<ProfilePetugasPage> {
|
|
// Data dummy petugas
|
|
final Map<String, dynamic> _petugasData = {
|
|
'nama': 'Dr. Ahmad Fauzi',
|
|
'nip': '198304122006041001',
|
|
'jabatan': 'Petugas Kesehatan',
|
|
'instansi': 'Puskesmas Mekar Jaya',
|
|
'email': 'ahmad.fauzi@puskesmas.id',
|
|
'telepon': '081234567899',
|
|
'alamat': 'Jl. Kesehatan No. 45, Bandung',
|
|
'mulaiTugas': '01 Januari 2020',
|
|
'foto': 'assets/images/profile_petugas.jpg',
|
|
};
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Scaffold(
|
|
appBar: AppBar(
|
|
backgroundColor: AppColors.button,
|
|
elevation: 4,
|
|
centerTitle: true,
|
|
title: const Text(
|
|
'Profil Saya',
|
|
style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20, color: Colors.white),
|
|
),
|
|
shape: const RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.vertical(bottom: Radius.circular(16)),
|
|
),
|
|
flexibleSpace: Container(
|
|
decoration: const BoxDecoration(
|
|
gradient: LinearGradient(
|
|
colors: [AppColors.button, AppColors.button],
|
|
begin: Alignment.topLeft,
|
|
end: Alignment.bottomRight,
|
|
),
|
|
borderRadius: BorderRadius.vertical(bottom: Radius.circular(16)),
|
|
),
|
|
),
|
|
// removed AppBar edit action per request
|
|
),
|
|
body: SingleChildScrollView(
|
|
child: Column(
|
|
children: [
|
|
// Header: remove background color — keep layout, adjust colors for light background
|
|
Container(
|
|
width: double.infinity,
|
|
padding: const EdgeInsets.symmetric(vertical: 18, horizontal: 16),
|
|
decoration: BoxDecoration(
|
|
color: Colors.transparent,
|
|
borderRadius: const BorderRadius.only(
|
|
bottomLeft: Radius.circular(24),
|
|
bottomRight: Radius.circular(24),
|
|
),
|
|
),
|
|
child: Column(
|
|
mainAxisSize: MainAxisSize.min,
|
|
crossAxisAlignment: CrossAxisAlignment.center,
|
|
children: [
|
|
const SizedBox(height: 8), // slight downward shift
|
|
// Avatar centered
|
|
Container(
|
|
margin: const EdgeInsets.only(bottom: 12),
|
|
decoration: BoxDecoration(
|
|
shape: BoxShape.circle,
|
|
border: Border.all(color: AppColors.button, width: 2),
|
|
),
|
|
child: CircleAvatar(
|
|
radius: 56,
|
|
backgroundColor: Colors.white,
|
|
child: const Icon(Icons.person, size: 56, color: Colors.grey),
|
|
),
|
|
),
|
|
// Name and info centered
|
|
Text(
|
|
_petugasData['nama'],
|
|
textAlign: TextAlign.center,
|
|
style: TextStyle(
|
|
color: AppColors.textDark,
|
|
fontSize: 20,
|
|
fontWeight: FontWeight.w700,
|
|
),
|
|
),
|
|
const SizedBox(height: 6),
|
|
Text(
|
|
_petugasData['jabatan'],
|
|
textAlign: TextAlign.center,
|
|
style: TextStyle(color: AppColors.textGrey, fontSize: 13),
|
|
),
|
|
const SizedBox(height: 2),
|
|
Text(
|
|
_petugasData['instansi'],
|
|
textAlign: TextAlign.center,
|
|
style: TextStyle(color: AppColors.textGrey, fontSize: 12),
|
|
),
|
|
const SizedBox(height: 12),
|
|
// Buttons centered beneath
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: [
|
|
ElevatedButton(
|
|
onPressed: _editProfile,
|
|
style: ElevatedButton.styleFrom(
|
|
backgroundColor: AppColors.button,
|
|
foregroundColor: Colors.white,
|
|
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 10),
|
|
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
|
|
),
|
|
child: const Text('Ubah Profil', style: TextStyle(fontWeight: FontWeight.w600)),
|
|
),
|
|
const SizedBox(width: 12),
|
|
OutlinedButton(
|
|
onPressed: _logout,
|
|
style: OutlinedButton.styleFrom(
|
|
side: BorderSide(color: AppColors.textGrey.withOpacity(0.4)),
|
|
foregroundColor: AppColors.textDark,
|
|
padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 10),
|
|
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
|
|
),
|
|
child: const Text('Keluar'),
|
|
),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
),
|
|
// Menu profil
|
|
Padding(
|
|
padding: const EdgeInsets.all(16),
|
|
child: Column(
|
|
children: [
|
|
// Informasi pribadi
|
|
_buildInfoSection(),
|
|
const SizedBox(height: 24),
|
|
// Menu lainnya
|
|
_buildMenuSection(),
|
|
const SizedBox(height: 24),
|
|
// Statistik
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildInfoSection() {
|
|
return Card(
|
|
elevation: 2,
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(16),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
const Text(
|
|
'Informasi Pribadi',
|
|
style: TextStyle(
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
const SizedBox(height: 16),
|
|
_buildInfoRow(
|
|
Icons.assignment_ind,
|
|
'NIP',
|
|
_petugasData['nip'],
|
|
),
|
|
_buildInfoRow(
|
|
Icons.email,
|
|
'Email',
|
|
_petugasData['email'],
|
|
),
|
|
_buildInfoRow(
|
|
Icons.phone,
|
|
'Telepon',
|
|
_petugasData['telepon'],
|
|
),
|
|
_buildInfoRow(
|
|
Icons.location_on,
|
|
'Alamat',
|
|
_petugasData['alamat'],
|
|
),
|
|
_buildInfoRow(
|
|
Icons.date_range,
|
|
'Mulai Tugas',
|
|
_petugasData['mulaiTugas'],
|
|
),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildInfoRow(IconData icon, String label, String value) {
|
|
return Padding(
|
|
padding: const EdgeInsets.symmetric(vertical: 10),
|
|
child: Row(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Icon(icon, color: AppColors.button, size: 22),
|
|
const SizedBox(width: 16),
|
|
Expanded(
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Text(
|
|
label,
|
|
style: const TextStyle(
|
|
fontSize: 14,
|
|
color: Colors.grey,
|
|
),
|
|
),
|
|
const SizedBox(height: 4),
|
|
Text(
|
|
value,
|
|
style: const TextStyle(
|
|
fontSize: 16,
|
|
fontWeight: FontWeight.w500,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildMenuSection() {
|
|
final List<Map<String, dynamic>> menuItems = [
|
|
{
|
|
'icon': Icons.notifications,
|
|
'title': 'Notifikasi',
|
|
'subtitle': 'Pengaturan notifikasi',
|
|
'color': Colors.orange,
|
|
},
|
|
];
|
|
return Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
const Text(
|
|
'Pengaturan',
|
|
style: TextStyle(
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
const SizedBox(height: 12),
|
|
...menuItems.map((item) => _buildMenuItem(item)).toList(),
|
|
],
|
|
);
|
|
}
|
|
|
|
Widget _buildMenuItem(Map<String, dynamic> item) {
|
|
return Card(
|
|
margin: const EdgeInsets.only(bottom: 12),
|
|
elevation: 1,
|
|
child: ListTile(
|
|
leading: Container(
|
|
padding: const EdgeInsets.all(12),
|
|
decoration: BoxDecoration(
|
|
color: item['color'].withOpacity(0.1),
|
|
borderRadius: BorderRadius.circular(10),
|
|
),
|
|
child: Icon(item['icon'], color: item['color']),
|
|
),
|
|
title: Text(item['title']),
|
|
subtitle: Text(item['subtitle']),
|
|
trailing: const Icon(Icons.chevron_right),
|
|
onTap: () {
|
|
// TODO: Navigasi ke halaman masing-masing
|
|
},
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildStatCard(String value, String label, IconData icon, Color color) {
|
|
return Column(
|
|
children: [
|
|
Container(
|
|
padding: const EdgeInsets.all(12),
|
|
decoration: BoxDecoration(
|
|
color: color.withOpacity(0.1),
|
|
shape: BoxShape.circle,
|
|
),
|
|
child: FaIcon(icon, color: color, size: 24),
|
|
),
|
|
const SizedBox(height: 8),
|
|
Text(
|
|
value,
|
|
style: const TextStyle(
|
|
fontSize: 20,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
Text(
|
|
label,
|
|
textAlign: TextAlign.center,
|
|
style: const TextStyle(
|
|
fontSize: 12,
|
|
color: Colors.grey,
|
|
),
|
|
),
|
|
],
|
|
);
|
|
}
|
|
|
|
void _editProfile() {
|
|
showDialog(
|
|
context: context,
|
|
builder: (context) => AlertDialog(
|
|
title: const Text('Edit Profil'),
|
|
content: SingleChildScrollView(
|
|
child: Column(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
TextField(
|
|
decoration: const InputDecoration(
|
|
labelText: 'Nama Lengkap',
|
|
border: OutlineInputBorder(),
|
|
),
|
|
controller: TextEditingController(text: _petugasData['nama']),
|
|
),
|
|
const SizedBox(height: 12),
|
|
TextField(
|
|
decoration: const InputDecoration(
|
|
labelText: 'Email',
|
|
border: OutlineInputBorder(),
|
|
),
|
|
controller: TextEditingController(text: _petugasData['email']),
|
|
),
|
|
const SizedBox(height: 12),
|
|
TextField(
|
|
decoration: const InputDecoration(
|
|
labelText: 'Telepon',
|
|
border: OutlineInputBorder(),
|
|
),
|
|
controller: TextEditingController(text: _petugasData['telepon']),
|
|
),
|
|
const SizedBox(height: 12),
|
|
TextField(
|
|
decoration: const InputDecoration(
|
|
labelText: 'Alamat',
|
|
border: OutlineInputBorder(),
|
|
),
|
|
maxLines: 3,
|
|
controller: TextEditingController(text: _petugasData['alamat']),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
actions: [
|
|
TextButton(
|
|
onPressed: () => Navigator.pop(context),
|
|
child: const Text('Batal'),
|
|
),
|
|
ElevatedButton(
|
|
onPressed: () {
|
|
Navigator.pop(context);
|
|
ScaffoldMessenger.of(context).showSnackBar(
|
|
const SnackBar(
|
|
content: Text('Profil berhasil diperbarui'),
|
|
backgroundColor: Colors.green,
|
|
),
|
|
);
|
|
},
|
|
child: const Text('Simpan'),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
void _logout() {
|
|
showDialog(
|
|
context: context,
|
|
builder: (context) => AlertDialog(
|
|
title: const Text('Konfirmasi Keluar'),
|
|
content: const Text('Apakah Anda yakin ingin keluar dari aplikasi?'),
|
|
actions: [
|
|
TextButton(
|
|
onPressed: () => Navigator.pop(context),
|
|
child: const Text('Batal'),
|
|
),
|
|
ElevatedButton(
|
|
onPressed: () {
|
|
Navigator.pop(context);
|
|
// TODO: Implement logout logic
|
|
ScaffoldMessenger.of(context).showSnackBar(
|
|
const SnackBar(
|
|
content: Text('Berhasil keluar'),
|
|
backgroundColor: Colors.green,
|
|
),
|
|
);
|
|
},
|
|
style: ElevatedButton.styleFrom(
|
|
backgroundColor: Colors.red,
|
|
),
|
|
child: const Text('Keluar'),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
} |