Perbarui tampilan dashboard Petugas Desa dengan desain baru

- Tambahkan Google Fonts untuk styling teks
- Implementasi ulang dashboard dengan desain modern
- Tambahkan drawer navigasi dan bottom navigation bar
- Tambahkan berbagai widget statistik dan informasi penyaluran
- Konfigurasi aset dan dependensi google_fonts
This commit is contained in:
Khafidh Fuadi
2025-03-08 10:55:26 +07:00
parent b1665307c5
commit b6b4d63802
7 changed files with 529 additions and 192 deletions

View File

@ -0,0 +1,5 @@
<svg width="24" height="27" viewBox="0 0 24 27" fill="none" xmlns="http://www.w3.org/2000/svg">
<g id="Group 20343">
<path id="icon" fill-rule="evenodd" clip-rule="evenodd" d="M2.88537 11.3404C2.70161 11.7441 2.66659 11.9503 2.66659 12V20.4971C2.66659 21.0823 3.18753 21.557 3.83325 21.557H7.33325V15.1857C7.33325 14.0127 8.37792 13.0619 9.66659 13.0619H14.3333C15.6219 13.0619 16.6666 14.0127 16.6666 15.1857V21.557H20.1666C20.8123 21.557 21.3333 21.0823 21.3333 20.4971V12C21.3333 11.9503 21.2982 11.7441 21.1145 11.3404C20.9438 10.9653 20.685 10.5055 20.3471 9.98501C19.6724 8.94576 18.7257 7.73116 17.6662 6.5739C16.6042 5.41399 15.4578 4.3434 14.3918 3.57337C13.859 3.18843 13.3692 2.8954 12.9397 2.70247C12.5005 2.50519 12.1914 2.44294 11.9999 2.44294C11.8085 2.44294 11.4994 2.50519 11.0602 2.70247C10.6307 2.8954 10.1409 3.18843 9.608 3.57337C8.54203 4.3434 7.39564 5.41399 6.33368 6.5739C5.27414 7.73116 4.32747 8.94576 3.65277 9.98501C3.31488 10.5055 3.05608 10.9653 2.88537 11.3404ZM10.0276 0.797973C10.6411 0.522378 11.3164 0.319153 11.9999 0.319153C12.6835 0.319153 13.3587 0.522378 13.9723 0.797973C14.5955 1.07792 15.2268 1.46516 15.8424 1.90983C17.0733 2.799 18.3331 3.98494 19.4587 5.21428C20.5866 6.44629 21.6087 7.75368 22.3559 8.90458C22.7289 9.4792 23.0444 10.0315 23.2701 10.5275C23.4829 10.9949 23.6666 11.5187 23.6666 12V20.4971C23.6666 22.2577 22.0982 23.6808 20.1666 23.6808H16.6666C15.3779 23.6808 14.3333 22.73 14.3333 21.557V15.1857H9.66659V21.557C9.66659 22.73 8.62192 23.6808 7.33325 23.6808H3.83325C1.90165 23.6808 0.333252 22.2577 0.333252 20.4971V12C0.333252 11.5187 0.51698 10.9949 0.729704 10.5275C0.955481 10.0315 1.27089 9.4792 1.64394 8.90458C2.39112 7.75368 3.41319 6.44629 4.54116 5.21428C5.6667 3.98494 6.92656 2.799 8.15746 1.90983C8.77303 1.46516 9.40433 1.07792 10.0276 0.797973Z" fill="#2E5077"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.8 KiB

View File

@ -0,0 +1,5 @@
<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
<g id="icons navbar petugas">
<path id="Vector" d="M5.83325 25.6666C5.19159 25.6666 4.64247 25.4384 4.18592 24.9818C3.72936 24.5253 3.5007 23.9758 3.49992 23.3333V10.1791C3.14992 9.96526 2.86797 9.68837 2.65409 9.34848C2.4402 9.00859 2.33325 8.61465 2.33325 8.16665V4.66665C2.33325 4.02498 2.56192 3.47587 3.01925 3.01931C3.47659 2.56276 4.0257 2.33409 4.66659 2.33331H23.3333C23.9749 2.33331 24.5244 2.56198 24.9818 3.01931C25.4391 3.47665 25.6674 4.02576 25.6666 4.66665V8.16665C25.6666 8.61387 25.5596 9.00781 25.3458 9.34848C25.1319 9.68915 24.8499 9.96565 24.4999 10.178V23.3333C24.4999 23.975 24.2716 24.5245 23.8151 24.9818C23.3585 25.4391 22.809 25.6674 22.1666 25.6666H5.83325ZM5.83325 10.5V23.3333H22.1666V10.5H5.83325ZM4.66659 8.16665H23.3333V4.66665H4.66659V8.16665ZM11.6666 16.3333H16.3333C16.6638 16.3333 16.9411 16.2213 17.1651 15.9973C17.3891 15.7733 17.5007 15.4964 17.4999 15.1666C17.4991 14.8369 17.3871 14.56 17.1639 14.336C16.9407 14.112 16.6638 14 16.3333 14H11.6666C11.336 14 11.0591 14.112 10.8359 14.336C10.6127 14.56 10.5007 14.8369 10.4999 15.1666C10.4991 15.4964 10.6111 15.7737 10.8359 15.9985C11.0607 16.2233 11.3376 16.3349 11.6666 16.3333Z" fill="#B3B3B3"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

View File

@ -0,0 +1,5 @@
<svg width="29" height="28" viewBox="0 0 29 28" fill="none" xmlns="http://www.w3.org/2000/svg">
<g id="icons navbar petugas">
<path id="Vector" d="M14.3332 16.3333C14.5639 16.3333 14.7895 16.2649 14.9813 16.1367C15.1732 16.0085 15.3227 15.8263 15.411 15.6131C15.4993 15.3999 15.5224 15.1654 15.4774 14.939C15.4324 14.7127 15.3213 14.5049 15.1581 14.3417C14.995 14.1785 14.7871 14.0674 14.5608 14.0224C14.3345 13.9774 14.0999 14.0005 13.8867 14.0888C13.6735 14.1771 13.4913 14.3266 13.3631 14.5185C13.2349 14.7103 13.1665 14.9359 13.1665 15.1666C13.1665 15.4761 13.2894 15.7728 13.5082 15.9916C13.727 16.2104 14.0238 16.3333 14.3332 16.3333ZM20.1665 16.3333C20.3972 16.3333 20.6228 16.2649 20.8147 16.1367C21.0065 16.0085 21.1561 15.8263 21.2444 15.6131C21.3327 15.3999 21.3558 15.1654 21.3108 14.939C21.2657 14.7127 21.1546 14.5049 20.9915 14.3417C20.8283 14.1785 20.6204 14.0674 20.3941 14.0224C20.1678 13.9774 19.9332 14.0005 19.72 14.0888C19.5069 14.1771 19.3247 14.3266 19.1965 14.5185C19.0683 14.7103 18.9998 14.9359 18.9998 15.1666C18.9998 15.4761 19.1228 15.7728 19.3415 15.9916C19.5603 16.2104 19.8571 16.3333 20.1665 16.3333ZM14.3332 21C14.5639 21 14.7895 20.9316 14.9813 20.8034C15.1732 20.6752 15.3227 20.493 15.411 20.2798C15.4993 20.0666 15.5224 19.832 15.4774 19.6057C15.4324 19.3794 15.3213 19.1715 15.1581 19.0084C14.995 18.8452 14.7871 18.7341 14.5608 18.6891C14.3345 18.644 14.0999 18.6672 13.8867 18.7555C13.6735 18.8438 13.4913 18.9933 13.3631 19.1851C13.2349 19.377 13.1665 19.6026 13.1665 19.8333C13.1665 20.1427 13.2894 20.4395 13.5082 20.6583C13.727 20.8771 14.0238 21 14.3332 21ZM20.1665 21C20.3972 21 20.6228 20.9316 20.8147 20.8034C21.0065 20.6752 21.1561 20.493 21.2444 20.2798C21.3327 20.0666 21.3558 19.832 21.3108 19.6057C21.2657 19.3794 21.1546 19.1715 20.9915 19.0084C20.8283 18.8452 20.6204 18.7341 20.3941 18.6891C20.1678 18.644 19.9332 18.6672 19.72 18.7555C19.5069 18.8438 19.3247 18.9933 19.1965 19.1851C19.0683 19.377 18.9998 19.6026 18.9998 19.8333C18.9998 20.1427 19.1228 20.4395 19.3415 20.6583C19.5603 20.8771 19.8571 21 20.1665 21ZM8.49984 16.3333C8.73058 16.3333 8.95615 16.2649 9.148 16.1367C9.33986 16.0085 9.4894 15.8263 9.5777 15.6131C9.666 15.3999 9.6891 15.1654 9.64409 14.939C9.59907 14.7127 9.48796 14.5049 9.3248 14.3417C9.16163 14.1785 8.95375 14.0674 8.72744 14.0224C8.50113 13.9774 8.26655 14.0005 8.05337 14.0888C7.84019 14.1771 7.65798 14.3266 7.52979 14.5185C7.40159 14.7103 7.33317 14.9359 7.33317 15.1666C7.33317 15.4761 7.45609 15.7728 7.67488 15.9916C7.89367 16.2104 8.19042 16.3333 8.49984 16.3333ZM22.4998 4.66665H21.3332V3.49998C21.3332 3.19056 21.2103 2.89381 20.9915 2.67502C20.7727 2.45623 20.4759 2.33331 20.1665 2.33331C19.8571 2.33331 19.5603 2.45623 19.3415 2.67502C19.1228 2.89381 18.9998 3.19056 18.9998 3.49998V4.66665H9.6665V3.49998C9.6665 3.19056 9.54359 2.89381 9.3248 2.67502C9.106 2.45623 8.80926 2.33331 8.49984 2.33331C8.19042 2.33331 7.89367 2.45623 7.67488 2.67502C7.45609 2.89381 7.33317 3.19056 7.33317 3.49998V4.66665H6.1665C5.23825 4.66665 4.34801 5.0354 3.69163 5.69177C3.03525 6.34815 2.6665 7.23839 2.6665 8.16665V22.1666C2.6665 23.0949 3.03525 23.9851 3.69163 24.6415C4.34801 25.2979 5.23825 25.6666 6.1665 25.6666H22.4998C23.4281 25.6666 24.3183 25.2979 24.9747 24.6415C25.6311 23.9851 25.9998 23.0949 25.9998 22.1666V8.16665C25.9998 7.23839 25.6311 6.34815 24.9747 5.69177C24.3183 5.0354 23.4281 4.66665 22.4998 4.66665ZM23.6665 22.1666C23.6665 22.4761 23.5436 22.7728 23.3248 22.9916C23.106 23.2104 22.8093 23.3333 22.4998 23.3333H6.1665C5.85708 23.3333 5.56034 23.2104 5.34155 22.9916C5.12275 22.7728 4.99984 22.4761 4.99984 22.1666V11.6666H23.6665V22.1666ZM23.6665 9.33331H4.99984V8.16665C4.99984 7.85723 5.12275 7.56048 5.34155 7.34169C5.56034 7.1229 5.85708 6.99998 6.1665 6.99998H22.4998C22.8093 6.99998 23.106 7.1229 23.3248 7.34169C23.5436 7.56048 23.6665 7.85723 23.6665 8.16665V9.33331ZM8.49984 21C8.73058 21 8.95615 20.9316 9.148 20.8034C9.33986 20.6752 9.4894 20.493 9.5777 20.2798C9.666 20.0666 9.6891 19.832 9.64409 19.6057C9.59907 19.3794 9.48796 19.1715 9.3248 19.0084C9.16163 18.8452 8.95375 18.7341 8.72744 18.6891C8.50113 18.644 8.26655 18.6672 8.05337 18.7555C7.84019 18.8438 7.65798 18.9933 7.52979 19.1851C7.40159 19.377 7.33317 19.6026 7.33317 19.8333C7.33317 20.1427 7.45609 20.4395 7.67488 20.6583C7.89367 20.8771 8.19042 21 8.49984 21Z" fill="#B3B3B3"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 4.3 KiB

View File

@ -0,0 +1,6 @@
<svg width="22" height="26" viewBox="0 0 22 26" fill="none" xmlns="http://www.w3.org/2000/svg">
<g id="Group">
<path id="Vector" fill-rule="evenodd" clip-rule="evenodd" d="M11.3597 25.1343L11.3457 25.1367L11.2629 25.1775L11.2395 25.1822L11.2232 25.1775L11.1404 25.1355C11.1279 25.1324 11.1186 25.1347 11.1124 25.1425L11.1077 25.1542L11.0879 25.6535L11.0937 25.6768L11.1054 25.692L11.2267 25.7783L11.2442 25.783L11.2582 25.7783L11.3795 25.692L11.3935 25.6733L11.3982 25.6535L11.3784 25.1553C11.3753 25.1429 11.369 25.1359 11.3597 25.1343ZM11.6677 25.0025L11.6514 25.0048L11.4367 25.1133L11.425 25.125L11.4215 25.1378L11.4425 25.6395L11.4484 25.6535L11.4577 25.6628L11.6922 25.7702C11.707 25.7741 11.7183 25.771 11.726 25.7608L11.7307 25.7445L11.691 25.0282C11.6871 25.0134 11.6794 25.0048 11.6677 25.0025ZM10.8335 25.0048C10.8284 25.0017 10.8223 25.0007 10.8164 25.002C10.8105 25.0033 10.8054 25.0068 10.802 25.0118L10.795 25.0282L10.7554 25.7445C10.7561 25.7585 10.7628 25.7678 10.7752 25.7725L10.7927 25.7702L11.0272 25.6617L11.0389 25.6523L11.0424 25.6395L11.0634 25.1378L11.0599 25.1238L11.0482 25.1122L10.8335 25.0048Z" fill="#B3B3B3"/>
<path id="Vector_2" fill-rule="evenodd" clip-rule="evenodd" d="M2.49996 8.49998C2.49996 6.33405 3.36037 4.25682 4.89192 2.72527C6.42347 1.19373 8.50069 0.333313 10.6666 0.333313C12.8326 0.333313 14.9098 1.19373 16.4413 2.72527C17.9729 4.25682 18.8333 6.33405 18.8333 8.49998V12.8913L20.959 17.1426C21.0568 17.3383 21.103 17.5558 21.0932 17.7743C21.0834 17.9929 21.0178 18.2053 20.9028 18.3914C20.7878 18.5775 20.6271 18.7311 20.436 18.8376C20.2449 18.9441 20.0297 19 19.811 19H15.1863C14.9268 20.0013 14.3421 20.888 13.5241 21.5211C12.7061 22.1541 11.701 22.4976 10.6666 22.4976C9.63226 22.4976 8.62718 22.1541 7.80915 21.5211C6.99113 20.888 6.40647 20.0013 6.14696 19H1.52229C1.30352 19 1.08836 18.9441 0.897271 18.8376C0.706177 18.7311 0.545487 18.5775 0.430462 18.3914C0.315437 18.2053 0.249897 17.9929 0.240066 17.7743C0.230235 17.5558 0.27644 17.3383 0.374293 17.1426L2.49996 12.8913V8.49998ZM8.64596 19C8.85076 19.3547 9.14531 19.6492 9.50001 19.854C9.85471 20.0587 10.2571 20.1665 10.6666 20.1665C11.0762 20.1665 11.4785 20.0587 11.8332 19.854C12.1879 19.6492 12.4825 19.3547 12.6873 19H8.64596ZM10.6666 2.66665C9.11953 2.66665 7.6358 3.28123 6.54184 4.37519C5.44787 5.46915 4.83329 6.95288 4.83329 8.49998V12.8913C4.83327 13.2534 4.74899 13.6105 4.58713 13.9343L3.22213 16.6666H18.1123L16.7473 13.9343C16.585 13.6106 16.5003 13.2535 16.5 12.8913V8.49998C16.5 6.95288 15.8854 5.46915 14.7914 4.37519C13.6975 3.28123 12.2137 2.66665 10.6666 2.66665Z" fill="#B3B3B3"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.6 KiB

View File

@ -1,219 +1,526 @@
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:penyaluran_app/app/modules/dashboard/controllers/dashboard_controller.dart';
import 'package:google_fonts/google_fonts.dart';
class PetugasDesaDashboardView extends GetView<DashboardController> {
const PetugasDesaDashboardView({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Dashboard Petugas Desa'),
actions: [
IconButton(
icon: const Icon(Icons.logout),
onPressed: controller.logout,
tooltip: 'Logout',
),
],
final TextTheme textTheme =
GoogleFonts.dmSansTextTheme(Theme.of(context).textTheme);
return Theme(
data: Theme.of(context).copyWith(
textTheme: textTheme,
),
body: SafeArea(
child: Padding(
padding: const EdgeInsets.all(20.0),
child: Obx(() {
if (controller.isLoading.value) {
return const Center(
child: CircularProgressIndicator(),
);
}
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// Greeting
Text(
'Halo, ${controller.roleData.value?['namaLengkap'] ?? controller.user?.email ?? 'Petugas'}!',
style: const TextStyle(
fontSize: 24,
fontWeight: FontWeight.bold,
),
),
const SizedBox(height: 5),
Text(
'Selamat datang di Dashboard Petugas Desa ${controller.roleData.value?['Desa'] ?? ''}',
style: const TextStyle(
fontSize: 16,
color: Colors.grey,
),
),
const SizedBox(height: 30),
// Petugas Data
if (controller.roleData.value != null) ...[
const Text(
'Data Petugas',
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
),
),
const SizedBox(height: 10),
Card(
elevation: 2,
child: Padding(
padding: const EdgeInsets.all(16.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_buildInfoRow(
'NIP', controller.roleData.value?['NIP'] ?? '-'),
_buildInfoRow('Nama',
controller.roleData.value?['namaLengkap'] ?? '-'),
_buildInfoRow('Jabatan',
controller.roleData.value?['jabatan'] ?? '-'),
_buildInfoRow('Desa',
controller.roleData.value?['Desa'] ?? '-'),
_buildInfoRow('No. HP',
controller.roleData.value?['noHP'] ?? '-'),
_buildInfoRow('Email',
controller.roleData.value?['email'] ?? '-'),
],
),
),
),
] else ...[
const Center(
child: Text(
'Data petugas belum tersedia',
style: TextStyle(
fontSize: 16,
color: Colors.grey,
),
),
),
],
const SizedBox(height: 30),
// Menu
const Text(
'Menu',
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
),
),
const SizedBox(height: 10),
_buildMenuCard(
'Penyaluran Bantuan',
'Kelola penyaluran bantuan',
Icons.local_shipping,
Colors.blue,
() {
// Navigasi ke halaman penyaluran bantuan
},
),
const SizedBox(height: 10),
_buildMenuCard(
'Pengaduan',
'Kelola pengaduan warga',
Icons.report_problem,
Colors.orange,
() {
// Navigasi ke halaman pengaduan
},
),
const SizedBox(height: 10),
_buildMenuCard(
'Laporan',
'Lihat laporan penyaluran',
Icons.assessment,
Colors.green,
() {
// Navigasi ke halaman laporan
},
),
],
);
}),
),
),
);
}
Widget _buildInfoRow(String label, String value) {
return Padding(
padding: const EdgeInsets.only(bottom: 8.0),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
width: 120,
child: Text(
label,
style: const TextStyle(
fontWeight: FontWeight.bold,
),
),
),
Expanded(
child: Text(value),
),
],
),
);
}
Widget _buildMenuCard(String title, String subtitle, IconData icon,
Color color, VoidCallback onTap) {
return Card(
elevation: 2,
child: InkWell(
onTap: onTap,
child: Padding(
padding: const EdgeInsets.all(16.0),
child: Row(
child: Scaffold(
drawer: Drawer(
child: ListView(
padding: EdgeInsets.zero,
children: [
Container(
padding: const EdgeInsets.all(8.0),
decoration: BoxDecoration(
color: color.withOpacity(0.1),
borderRadius: BorderRadius.circular(8.0),
DrawerHeader(
decoration: const BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [Color(0xFF2E5077), Color(0xFF5882B1)],
transform: GradientRotation(96.93 * 3.14159 / 180),
),
),
child: Icon(
icon,
color: color,
size: 30,
),
),
const SizedBox(width: 16),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
title,
style: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
const CircleAvatar(
radius: 30,
backgroundColor: Colors.white,
child: Icon(
Icons.person,
size: 40,
color: Color(0xFF2E5077),
),
),
const SizedBox(height: 4),
const SizedBox(height: 10),
Text(
subtitle,
style: TextStyle(
'Petugas Desa',
style: textTheme.titleLarge?.copyWith(
color: Colors.white,
fontSize: 18,
),
),
Text(
controller.user?.email ?? 'email@example.com',
style: textTheme.bodyMedium?.copyWith(
color: Colors.white70,
fontSize: 14,
color: Colors.grey[600],
),
),
],
),
),
const Icon(Icons.arrow_forward_ios, size: 16),
ListTile(
leading: const Icon(Icons.home),
title: const Text('Beranda'),
onTap: () {
Get.back();
},
),
ListTile(
leading: const Icon(Icons.calendar_today),
title: const Text('Jadwal'),
onTap: () {
Get.back();
},
),
ListTile(
leading: const Icon(Icons.notifications),
title: const Text('Notifikasi'),
onTap: () {
Get.back();
},
),
ListTile(
leading: const Icon(Icons.inventory),
title: const Text('Inventaris'),
onTap: () {
Get.back();
},
),
const Divider(),
ListTile(
leading: const Icon(Icons.logout),
title: const Text('Logout'),
onTap: controller.logout,
),
],
),
),
body: SafeArea(
child: SingleChildScrollView(
child: Padding(
padding: const EdgeInsets.all(16.0),
child: Obx(() {
if (controller.isLoading.value) {
return const Center(
child: CircularProgressIndicator(),
);
}
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// Header dengan greeting
_buildGreetingHeader(textTheme),
const SizedBox(height: 20),
// Jadwal penyaluran hari ini
_buildScheduleCard(
textTheme,
title: 'Jadwal Penyaluran Hari ini',
location: 'Kantor Kepala Desa (Beras)',
dateTime: '15 April 2023, 13:00 - 14:00',
isToday: true,
),
const SizedBox(height: 10),
// Jadwal penyaluran mendatang
_buildScheduleCard(
textTheme,
title: 'Jadwal Penyaluran Mendatang',
location: 'Balai Desa A (Sembako)',
dateTime: '17 April 2023, 13:00 - 14:00',
isToday: false,
),
const SizedBox(height: 20),
// Statistik penyaluran
_buildStatisticsRow(textTheme),
const SizedBox(height: 20),
// Progress penyaluran
_buildProgressSection(textTheme),
const SizedBox(height: 20),
// Daftar penerima
_buildRecipientsList(textTheme),
],
);
}),
),
),
),
bottomNavigationBar: BottomNavigationBar(
currentIndex: 0,
type: BottomNavigationBarType.fixed,
selectedLabelStyle: textTheme.bodySmall,
unselectedLabelStyle: textTheme.bodySmall,
items: const [
BottomNavigationBarItem(
icon: Icon(Icons.home),
label: 'Beranda',
),
BottomNavigationBarItem(
icon: Icon(Icons.calendar_today),
label: 'Jadwal',
),
BottomNavigationBarItem(
icon: Icon(Icons.notifications),
label: 'Notifikasi',
),
BottomNavigationBarItem(
icon: Icon(Icons.inventory),
label: 'Inventaris',
),
],
),
),
);
}
Widget _buildGreetingHeader(TextTheme textTheme) {
return Container(
width: double.infinity,
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(12),
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.1),
spreadRadius: 1,
blurRadius: 3,
offset: const Offset(0, 1),
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'Selamat Datang, Ahmad!',
style: textTheme.headlineSmall?.copyWith(
fontSize: 24,
fontWeight: FontWeight.bold,
),
),
const SizedBox(height: 5),
Text(
'Kamu Login Sebagai Petugas Desa Jatihurip.',
style: textTheme.bodyMedium?.copyWith(
fontSize: 14,
color: Colors.grey[600],
),
),
],
),
);
}
Widget _buildScheduleCard(
TextTheme textTheme, {
required String title,
required String location,
required String dateTime,
bool isToday = true,
}) {
return Container(
width: double.infinity,
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
gradient: const LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [Color(0xFF2E5077), Color(0xFF5882B1)],
transform: GradientRotation(96.93 * 3.14159 / 180),
),
borderRadius: BorderRadius.circular(12),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
title,
style: textTheme.bodyMedium?.copyWith(
fontSize: 14,
color: Colors.white.withOpacity(0.8),
),
),
const SizedBox(height: 8),
Text(
location,
style: textTheme.titleLarge?.copyWith(
fontSize: 18,
fontWeight: FontWeight.bold,
color: Colors.white,
),
),
const SizedBox(height: 4),
Text(
dateTime,
style: textTheme.bodyMedium?.copyWith(
fontSize: 14,
color: Colors.white,
),
),
],
),
);
}
Widget _buildStatisticsRow(TextTheme textTheme) {
return Row(
children: [
Expanded(
child: _buildStatCard('Penerima', '3', 'Konfirmasi', textTheme),
),
const SizedBox(width: 10),
Expanded(
child: _buildStatCard('Pengajuan', '1', 'Pengajuan', textTheme),
),
const SizedBox(width: 10),
Expanded(
child: _buildStatCard('Pengaduan', '1', 'Pengaduan', textTheme),
),
],
);
}
Widget _buildStatCard(
String title, String count, String subtitle, TextTheme textTheme) {
return Container(
width: double.infinity,
padding: const EdgeInsets.all(12),
decoration: BoxDecoration(
gradient: const LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [Color(0xFF2E5077), Color(0xFF5882B1)],
transform: GradientRotation(96.93 * 3.14159 / 180),
),
borderRadius: BorderRadius.circular(12),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
count,
style: textTheme.headlineSmall?.copyWith(
fontSize: 24,
fontWeight: FontWeight.bold,
color: Colors.white,
),
),
const SizedBox(height: 4),
Text(
subtitle,
style: textTheme.bodySmall?.copyWith(
fontSize: 12,
color: Colors.white,
),
),
],
),
);
}
Widget _buildProgressSection(TextTheme textTheme) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'Progress Penyaluran',
style: textTheme.titleMedium?.copyWith(
fontSize: 16,
fontWeight: FontWeight.bold,
),
),
const SizedBox(height: 10),
ClipRRect(
borderRadius: BorderRadius.circular(8),
child: LinearProgressIndicator(
value: 0.7,
minHeight: 10,
backgroundColor: Colors.grey[300],
valueColor: const AlwaysStoppedAnimation<Color>(Color(0xFF2E5077)),
),
),
const SizedBox(height: 10),
Text(
'70% Selesai',
style: textTheme.bodyMedium?.copyWith(
fontSize: 14,
fontWeight: FontWeight.bold,
color: const Color(0xFF2E5077),
),
),
const SizedBox(height: 10),
_buildProgressDetailRow('Telah Menerima', 70, textTheme),
_buildProgressDetailRow('Dijedwalkan', 20, textTheme),
_buildProgressDetailRow('Belum Dijadwalkan', 10, textTheme),
const SizedBox(height: 5),
Text(
'Total : 100 Penerima, Telah Disalurkan : 70 Penerima, Belum Disalurkan : 30',
style: textTheme.bodySmall?.copyWith(
fontSize: 12,
color: Colors.grey[600],
),
),
],
);
}
Widget _buildProgressDetailRow(String label, int value, TextTheme textTheme) {
return Padding(
padding: const EdgeInsets.symmetric(vertical: 2),
child: Row(
children: [
Expanded(
flex: 3,
child: Text(
label,
style: textTheme.bodyMedium?.copyWith(
fontSize: 14,
color: Colors.grey[700],
),
),
),
Expanded(
flex: 7,
child: Stack(
children: [
Container(
height: 8,
decoration: BoxDecoration(
color: Colors.grey[300],
borderRadius: BorderRadius.circular(4),
),
),
Container(
height: 8,
width: (MediaQuery.of(Get.context!).size.width - 32) *
0.7 *
(value / 100),
decoration: BoxDecoration(
color: const Color(0xFF2E5077),
borderRadius: BorderRadius.circular(4),
),
),
],
),
),
const SizedBox(width: 10),
Text(
'$value',
style: textTheme.bodyMedium?.copyWith(
fontSize: 14,
fontWeight: FontWeight.bold,
),
),
],
),
);
}
Widget _buildRecipientsList(TextTheme textTheme) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'Daftar Penerima',
style: textTheme.titleMedium?.copyWith(
fontSize: 16,
fontWeight: FontWeight.bold,
),
),
TextButton(
onPressed: () {},
child: Row(
children: [
Text(
'Lihat Semua',
style: textTheme.bodyMedium?.copyWith(
color: const Color(0xFF2E5077),
),
),
Icon(
Icons.chevron_right,
size: 16,
color: const Color(0xFF2E5077),
),
],
),
),
],
),
const SizedBox(height: 10),
_buildRecipientItem(
'Siti Rahayu', '3201020107030010', 'Selesai', textTheme),
_buildRecipientItem(
'Siti Rahayu', '3201020107030010', 'Selesai', textTheme),
_buildRecipientItem(
'Siti Rahayu', '3201020107030010', 'Selesai', textTheme),
],
);
}
Widget _buildRecipientItem(
String name, String nik, String status, TextTheme textTheme) {
return Container(
width: double.infinity,
margin: const EdgeInsets.only(bottom: 10),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(12),
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.1),
spreadRadius: 1,
blurRadius: 3,
offset: const Offset(0, 1),
),
],
),
child: ListTile(
title: Text(
name,
style: textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.bold,
),
),
subtitle: Text(
'NIK: $nik',
style: textTheme.bodyMedium,
),
trailing: Row(
mainAxisSize: MainAxisSize.min,
children: [
Container(
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
decoration: BoxDecoration(
color: Colors.green.withOpacity(0.1),
borderRadius: BorderRadius.circular(12),
),
child: Text(
status,
style: textTheme.bodySmall?.copyWith(
color: Colors.green,
fontSize: 12,
),
),
),
IconButton(
icon: const Icon(
Icons.chevron_right,
color: Colors.grey,
),
onPressed: () {},
),
],
),
),
);
}

View File

@ -168,6 +168,14 @@ packages:
url: "https://pub.dev"
source: hosted
version: "4.7.2"
google_fonts:
dependency: "direct main"
description:
name: google_fonts
sha256: b1ac0fe2832c9cc95e5e88b57d627c5e68c223b9657f4b96e1487aa9098c7b82
url: "https://pub.dev"
source: hosted
version: "6.2.1"
gotrue:
dependency: transitive
description:

View File

@ -49,6 +49,7 @@ dependencies:
# Untuk tampilan loading
flutter_spinkit: ^5.2.0
google_fonts: ^6.2.1
dev_dependencies:
flutter_test:
@ -72,9 +73,9 @@ flutter:
uses-material-design: true
# To add assets to your application, add an assets section, like this:
# assets:
# - images/a_dot_burr.jpeg
# - images/a_dot_ham.jpeg
assets:
- assets/icons/
- assets/images/
# An image asset can refer to one or more resolution-specific "variants", see
# https://flutter.dev/to/resolution-aware-images