google maps + penyesuaian

android/app/src/main/AndroidManifest.xml

@@ -24,7 +24,7 @@
 
         <meta-data
             android:name="com.google.android.geo.API_KEY"
-            android:value="YOUR_GOOGLE_MAPS_API_KEY_HERE"/>
+            android:value="AIzaSyAElDL1y9HnBCx5d_r1LB-Mg3VTA1faVug"/>
 
         <activity
             android:name=".MainActivity"
@@ -48,6 +48,12 @@
                 <category android:name="android.intent.category.LAUNCHER"/>
             </intent-filter>
         </activity>
+
+        <!-- image_cropper: UCrop Activity -->
+        <activity
+            android:name="com.yalantis.ucrop.UCropActivity"
+            android:theme="@style/Theme.AppCompat.Light.NoActionBar" />
+
         <!-- Don't delete the meta-data below.
              This is used by the Flutter tool to generate GeneratedPluginRegistrant.java -->
         <meta-data

ios/Runner/AppDelegate.swift

@@ -9,7 +9,7 @@ import GoogleMaps
     _ application: UIApplication,
     didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
   ) -> Bool {
-    GMSServices.provideAPIKey("YOUR_GOOGLE_MAPS_API_KEY_HERE")
+    GMSServices.provideAPIKey("AIzaSyAElDL1y9HnBCx5d_r1LB-Mg3VTA1faVug")
     GeneratedPluginRegistrant.register(with: self)
     return super.application(application, didFinishLaunchingWithOptions: launchOptions)
   }

lib/models/presensi_model.dart

@@ -78,6 +78,8 @@ class PresensiHistoryModel {
   final bool verifikasiWajah;
   final int? statusValidasi;
   final String? alasanPenolakan;
+  final String? fotoMasukUrl;
+  final String? fotoPulangUrl;
 
   PresensiHistoryModel({
     this.idPresensi,
@@ -94,6 +96,8 @@ class PresensiHistoryModel {
     this.verifikasiWajah = false,
     this.statusValidasi,
     this.alasanPenolakan,
+    this.fotoMasukUrl,
+    this.fotoPulangUrl,
   });
 
   factory PresensiHistoryModel.fromJson(Map<String, dynamic> json) {
@@ -123,6 +127,8 @@ class PresensiHistoryModel {
       verifikasiWajah: json['verifikasi_wajah'] ?? false,
       statusValidasi: json['status_validasi'],
       alasanPenolakan: json['alasan_penolakan'],
+      fotoMasukUrl: json['foto_masuk_url'],
+      fotoPulangUrl: json['foto_pulang_url'],
     );
   }
 }

lib/providers/attendance_provider.dart

@@ -1,6 +1,6 @@
 import 'dart:io';
 import 'package:flutter/material.dart';
-import 'package:latlong2/latlong.dart';
+import 'package:google_maps_flutter/google_maps_flutter.dart';
 import 'package:geolocator/geolocator.dart';
 import '../repositories/attendance_repository.dart';
 import '../models/presensi_model.dart';
@@ -21,6 +21,7 @@ class AttendanceProvider extends ChangeNotifier {
 
   String? reasonOutsideRadius;
   String? reasonEarlyCheckout;
+  String? reasonLateCheckin;
 
   Future<bool> getCurrentPosition() async {
     bool serviceEnabled;
@@ -92,6 +93,11 @@ class AttendanceProvider extends ChangeNotifier {
     notifyListeners();
   }
 
+  void setReasonLateCheckin(String? reason) {
+    reasonLateCheckin = reason;
+    notifyListeners();
+  }
+
   Future<void> fetchHistory() async {
     isLoading = true;
     notifyListeners();
@@ -137,11 +143,13 @@ class AttendanceProvider extends ChangeNotifier {
         photoFile,
         keteranganLuarRadius: !isWithinRadius ? reasonOutsideRadius : null,
         keteranganPulang: type == 'pulang' ? reasonEarlyCheckout : null,
+        alasanTelat: type == 'masuk' ? reasonLateCheckin : null,
       );
 
       if (success) {
         reasonOutsideRadius = null;
         reasonEarlyCheckout = null;
+        reasonLateCheckin = null;
       }
 
       return success;
@@ -175,6 +183,7 @@ class AttendanceProvider extends ChangeNotifier {
   void reset() {
     reasonOutsideRadius = null;
     reasonEarlyCheckout = null;
+    reasonLateCheckin = null;
     notifyListeners();
   }
 }

lib/repositories/attendance_repository.dart

@@ -35,6 +35,7 @@ class AttendanceRepository {
     File photoFile, {
     String? keteranganLuarRadius,
     String? keteranganPulang,
+    String? alasanTelat,
   }) async {
     try {
       String fileName = photoFile.path.split('/').last;
@@ -51,6 +52,8 @@ class AttendanceRepository {
           'keterangan_luar_radius': keteranganLuarRadius,
         if (keteranganPulang != null)
           'keterangan_pulang': keteranganPulang,
+        if (alasanTelat != null)
+          'alasan_telat': alasanTelat,
       });
 
       final response = await _client.dio.post(

lib/screens/presensi/presensi_map_screen.dart

@@ -3,7 +3,7 @@ import 'dart:ui';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:geolocator/geolocator.dart';
-import 'package:latlong2/latlong.dart';
+import 'package:google_maps_flutter/google_maps_flutter.dart';
 import 'package:provider/provider.dart';
 import '../../core/error_handler.dart';
 import '../../core/theme.dart';
@@ -89,7 +89,10 @@ class _PresensiMapScreenState extends State<PresensiMapScreen> {
     final currentLocation = attendanceProvider.currentLocation ?? _officeLocation;
 
     final distance = attendanceProvider.currentLocation != null
-        ? const Distance().as(LengthUnit.Meter, currentLocation, _officeLocation)
+        ? Geolocator.distanceBetween(
+            currentLocation.latitude, currentLocation.longitude,
+            _officeLocation.latitude, _officeLocation.longitude,
+          )
         : double.infinity;
 
     final isWithinRadius = attendanceProvider.currentLocation != null && distance <= _radius;
@@ -470,6 +473,32 @@ class _PresensiMapScreenState extends State<PresensiMapScreen> {
       }
     }
 
+    if (widget.type == 'masuk') {
+      final homeProvider = context.read<HomeProvider>();
+      final presensi = homeProvider.presensiToday;
+
+      if (presensi?.jadwalJamMasuk != null) {
+        try {
+          final now = DateTime.now();
+          final parts = presensi!.jadwalJamMasuk!.split(':');
+          final scheduled = DateTime(
+            now.year, now.month, now.day,
+            int.parse(parts[0]), int.parse(parts[1]),
+            parts.length > 2 ? int.parse(parts[2]) : 0
+          );
+
+          final batasToleransi = scheduled.add(const Duration(minutes: 10));
+
+          if (now.isAfter(batasToleransi)) {
+            _showLateCheckinDialog(context, isWithinRadius);
+            return;
+          }
+        } catch (e) {
+          print("Error parsing jadwalJamMasuk: $e");
+        }
+      }
+    }
+
     if (!isWithinRadius) {
       _showOutsideRadiusDialog(context);
     } else {
@@ -700,7 +729,12 @@ class _PresensiMapScreenState extends State<PresensiMapScreen> {
 
                       final attendanceProvider = context.read<AttendanceProvider>();
                       final distance = attendanceProvider.currentLocation != null
-                          ? const Distance().as(LengthUnit.Meter, attendanceProvider.currentLocation!, _officeLocation)
+                          ? Geolocator.distanceBetween(
+                              attendanceProvider.currentLocation!.latitude,
+                              attendanceProvider.currentLocation!.longitude,
+                              _officeLocation.latitude,
+                              _officeLocation.longitude,
+                            )
                           : double.infinity;
 
                       if (distance > _radius) {
@@ -719,6 +753,127 @@ class _PresensiMapScreenState extends State<PresensiMapScreen> {
     );
   }
 
+  void _showLateCheckinDialog(BuildContext context, bool isWithinRadius) {
+    final reasonController = TextEditingController();
+
+    showModalBottomSheet(
+      context: context,
+      isScrollControlled: true,
+      backgroundColor: Colors.transparent,
+      builder: (context) => Padding(
+        padding: EdgeInsets.only(bottom: MediaQuery.of(context).viewInsets.bottom),
+        child: Container(
+          decoration: const BoxDecoration(
+            color: AppTheme.bgLight,
+            borderRadius: BorderRadius.only(
+              topLeft: Radius.circular(AppTheme.radiusXl),
+              topRight: Radius.circular(AppTheme.radiusXl),
+            ),
+          ),
+          padding: const EdgeInsets.fromLTRB(24, 16, 24, 32),
+          child: Column(
+            mainAxisSize: MainAxisSize.min,
+            crossAxisAlignment: CrossAxisAlignment.start,
+            children: [
+              Center(
+                child: Container(
+                  width: 40,
+                  height: 4,
+                  margin: const EdgeInsets.only(bottom: 24),
+                  decoration: BoxDecoration(
+                    color: AppTheme.textTertiary.withOpacity(0.3),
+                    borderRadius: BorderRadius.circular(2),
+                  ),
+                ),
+              ),
+              Row(
+                children: [
+                  Container(
+                    padding: const EdgeInsets.all(8),
+                    decoration: BoxDecoration(
+                      color: AppTheme.statusRed.withOpacity(0.1),
+                      shape: BoxShape.circle,
+                    ),
+                    child: const Icon(Icons.access_time_filled, color: AppTheme.statusRed),
+                  ),
+                  const SizedBox(width: 12),
+                  const Expanded(
+                    child: Text(
+                      "Presensi Terlambat",
+                      style: TextStyle(fontWeight: FontWeight.bold, fontSize: 18),
+                    )
+                  ),
+                ],
+              ),
+              const SizedBox(height: 16),
+              Text(
+                "Anda melakukan absen masuk melewati batas toleransi. Mohon sertakan alasan keterlambatan:",
+                style: AppTheme.bodyMedium,
+              ),
+              const SizedBox(height: 16),
+              TextField(
+                controller: reasonController,
+                decoration: InputDecoration(
+                  hintText: "Contoh: Ban bocor di jalan",
+                  border: OutlineInputBorder(
+                    borderRadius: BorderRadius.circular(AppTheme.radiusSm),
+                    borderSide: BorderSide(color: AppTheme.textTertiary.withOpacity(0.3)),
+                  ),
+                  enabledBorder: OutlineInputBorder(
+                    borderRadius: BorderRadius.circular(AppTheme.radiusSm),
+                    borderSide: BorderSide(color: AppTheme.textTertiary.withOpacity(0.3)),
+                  ),
+                  focusedBorder: OutlineInputBorder(
+                    borderRadius: BorderRadius.circular(AppTheme.radiusSm),
+                    borderSide: const BorderSide(color: AppTheme.primaryBlue),
+                  ),
+                  filled: true,
+                  fillColor: AppTheme.bgInput,
+                  contentPadding: const EdgeInsets.all(16),
+                ),
+                maxLines: 3,
+                maxLength: 500,
+              ),
+              const SizedBox(height: 24),
+              Row(
+                mainAxisAlignment: MainAxisAlignment.end,
+                children: [
+                  TextButton(
+                    onPressed: () => Navigator.pop(context),
+                    child: Text("Batal", style: TextStyle(color: AppTheme.textSecondary)),
+                  ),
+                  const SizedBox(width: 12),
+                  CustomButton(
+                    text: "Lanjutkan",
+                    type: ButtonType.primary,
+                    backgroundColor: AppTheme.statusRed,
+                    isFullWidth: false,
+                    onPressed: () {
+                      final reason = reasonController.text.trim();
+                      if (reason.isEmpty) {
+                        ErrorHandler.showWarning('Alasan terlambat wajib diisi!');
+                        return;
+                      }
+
+                      context.read<AttendanceProvider>().setReasonLateCheckin(reason);
+                      Navigator.pop(context);
+
+                      if (!isWithinRadius) {
+                        _showOutsideRadiusDialog(this.context);
+                      } else {
+                        _startFaceRecognitionFlow(this.context);
+                      }
+                    },
+                  ),
+                ],
+              ),
+            ],
+          ),
+        ),
+      ),
+    );
+  }
+
   Future<void> _startFaceRecognitionFlow(BuildContext context) async {
     final File? photoResult = await Navigator.push(
       context,

lib/screens/profile/edit_profile_screen.dart

@@ -2,6 +2,7 @@ import 'dart:io';
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
 import 'package:image_picker/image_picker.dart';
+import 'package:image_cropper/image_cropper.dart';
 import '../../core/error_handler.dart';
 import '../../core/theme.dart';
 import '../../providers/auth_provider.dart';
@@ -46,11 +47,45 @@ class _EditProfileScreenState extends State<EditProfileScreen> {
       imageQuality: 80,
     );
     if (picked != null) {
+      final croppedFile = await ImageCropper().cropImage(
+        sourcePath: picked.path,
+        aspectRatio: const CropAspectRatio(ratioX: 1, ratioY: 1),
+        compressQuality: 80,
+        maxWidth: 512,
+        maxHeight: 512,
+        uiSettings: [
+          AndroidUiSettings(
+            toolbarTitle: 'Atur Foto Profil',
+            toolbarColor: AppTheme.primaryDark,
+            toolbarWidgetColor: Colors.white,
+            statusBarColor: AppTheme.primaryDark,
+            backgroundColor: AppTheme.primaryDark,
+            activeControlsWidgetColor: AppTheme.primaryBlue,
+            cropGridColor: Colors.white.withValues(alpha: 0.3),
+            cropFrameColor: Colors.white,
+            cropStyle: CropStyle.circle,
+            initAspectRatio: CropAspectRatioPreset.square,
+            lockAspectRatio: true,
+            hideBottomControls: false,
+          ),
+          IOSUiSettings(
+            title: 'Atur Foto Profil',
+            doneButtonTitle: 'Simpan',
+            cancelButtonTitle: 'Batal',
+            cropStyle: CropStyle.circle,
+            aspectRatioLockEnabled: true,
+            resetAspectRatioEnabled: false,
+          ),
+        ],
+      );
+
+      if (croppedFile != null) {
         setState(() {
-        _selectedPhoto = File(picked.path);
+          _selectedPhoto = File(croppedFile.path);
         });
       }
     }
+  }
 
   Future<void> _saveProfile() async {
     if (!_formKey.currentState!.validate()) return;

lib/widgets/molecules/profile_info_card.dart

@@ -1,5 +1,5 @@
 import 'package:flutter/material.dart';
-import 'package:latlong2/latlong.dart';
+import 'package:google_maps_flutter/google_maps_flutter.dart';
 import '../../core/theme.dart';
 import '../../models/user_model.dart';
 import '../atoms/custom_avatar.dart';

lib/widgets/organisms/map_view_organism.dart

@@ -1,6 +1,5 @@
 import 'package:flutter/material.dart';
-import 'package:flutter_map/flutter_map.dart';
+import 'package:google_maps_flutter/google_maps_flutter.dart';
-import 'package:latlong2/latlong.dart';
 import '../../core/theme.dart';
 
 class MapViewOrganism extends StatefulWidget {
@@ -23,99 +22,72 @@ class MapViewOrganism extends StatefulWidget {
   State<MapViewOrganism> createState() => _MapViewOrganismState();
 }
 
-class _MapViewOrganismState extends State<MapViewOrganism> with SingleTickerProviderStateMixin {
+class _MapViewOrganismState extends State<MapViewOrganism> {
-  late AnimationController _pulseController;
+  GoogleMapController? _mapController;
 
   @override
-  void initState() {
+  void didUpdateWidget(covariant MapViewOrganism oldWidget) {
-    super.initState();
+    super.didUpdateWidget(oldWidget);
-    _pulseController = AnimationController(
+    if (widget.userLocation != null &&
-      vsync: this,
+        widget.userLocation != oldWidget.userLocation &&
-      duration: const Duration(seconds: 2),
+        _mapController != null) {
-    )..repeat(reverse: false);
+      _mapController!.animateCamera(
+        CameraUpdate.newLatLng(widget.userLocation!),
+      );
+    }
   }
 
   @override
   void dispose() {
-    _pulseController.dispose();
+    _mapController?.dispose();
     super.dispose();
   }
 
+  Set<Circle> _buildCircles() {
+    return {
+      Circle(
+        circleId: const CircleId('office_radius'),
+        center: widget.officeLocation,
+        radius: widget.radiusInMeters,
+        fillColor: widget.isWithinRadius
+            ? AppTheme.primaryBlue.withOpacity(0.1)
+            : AppTheme.statusRed.withOpacity(0.05),
+        strokeColor: widget.isWithinRadius ? AppTheme.primaryBlue : AppTheme.statusRed,
+        strokeWidth: 2,
+      ),
+    };
+  }
+
+  Set<Marker> _buildMarkers() {
+    return {
+      Marker(
+        markerId: const MarkerId('office'),
+        position: widget.officeLocation,
+        icon: BitmapDescriptor.defaultMarkerWithHue(BitmapDescriptor.hueRed),
+        infoWindow: const InfoWindow(title: 'Lokasi Kantor'),
+      ),
+    };
+  }
+
   @override
   Widget build(BuildContext context) {
-    Widget mapContent = FlutterMap(
+    final initialTarget = widget.userLocation ?? widget.officeLocation;
-      options: MapOptions(
+
-        initialCenter: widget.userLocation ?? widget.officeLocation,
+    Widget mapContent = GoogleMap(
-        initialZoom: 16.0,
+      initialCameraPosition: CameraPosition(
-        interactionOptions: const InteractionOptions(
+        target: initialTarget,
-          flags: InteractiveFlag.all & ~InteractiveFlag.rotate,
+        zoom: 16.0,
       ),
-      ),
+      circles: _buildCircles(),
-      children: [
+      markers: _buildMarkers(),
-        TileLayer(
+      myLocationEnabled: true,
-          urlTemplate: 'https://tile.openstreetmap.org/{z}/{x}/{y}.png',
+      myLocationButtonEnabled: false,
-          userAgentPackageName: 'com.example.mpg_mobile',
+      zoomControlsEnabled: false,
-        ),
+      mapToolbarEnabled: false,
-        CircleLayer(
+      rotateGesturesEnabled: false,
-          circles: [
+      onMapCreated: (controller) {
-            CircleMarker(
+        _mapController = controller;
-              point: widget.officeLocation,
-              color: widget.isWithinRadius
-                  ? AppTheme.primaryBlue.withOpacity(0.1)
-                  : AppTheme.statusRed.withOpacity(0.05),
-              borderStrokeWidth: 2,
-              borderColor: widget.isWithinRadius ? AppTheme.primaryBlue : AppTheme.statusRed,
-              useRadiusInMeter: true,
-              radius: widget.radiusInMeters,
-            ),
-          ],
-        ),
-        MarkerLayer(
-          markers: [
-            if (widget.userLocation != null)
-              Marker(
-                point: widget.userLocation!,
-                width: 80,
-                height: 80,
-                child: AnimatedBuilder(
-                  animation: _pulseController,
-                  builder: (context, child) {
-                    return Stack(
-                      alignment: Alignment.center,
-                      children: [
-                        Container(
-                          width: 30 + (_pulseController.value * 50),
-                          height: 30 + (_pulseController.value * 50),
-                          decoration: BoxDecoration(
-                            shape: BoxShape.circle,
-                            color: (widget.isWithinRadius ? AppTheme.statusGreen : AppTheme.statusRed)
-                                .withOpacity(0.4 * (1.0 - _pulseController.value)),
-                          ),
-                        ),
-                        Container(
-                          width: 24,
-                          height: 24,
-                          decoration: BoxDecoration(
-                            shape: BoxShape.circle,
-                            color: widget.isWithinRadius ? AppTheme.statusGreen : AppTheme.statusRed,
-                            border: Border.all(color: Colors.white, width: 3),
-                            boxShadow: [
-                              BoxShadow(
-                                color: (widget.isWithinRadius ? AppTheme.statusGreen : AppTheme.statusRed).withOpacity(0.5),
-                                blurRadius: 8,
-                                spreadRadius: 2,
-                              )
-                            ]
-                          ),
-                        ),
-                      ],
-                    );
       },
-                ),
-              ),
-          ],
-        ),
-      ],
     );
 
     if (widget.isFullscreen) {

lib/widgets/organisms/pengajuan_detail_sheet.dart

@@ -75,6 +75,14 @@ class PengajuanDetailSheet extends StatelessWidget {
     }
   }
 
+  String _formatDurasi(int menit) {
+    final jam = menit ~/ 60;
+    final sisa = menit % 60;
+    if (jam > 0 && sisa > 0) return '$jam jam $sisa menit';
+    if (jam > 0) return '$jam jam';
+    return '$menit menit';
+  }
+
   @override
   Widget build(BuildContext context) {
     final bool isLembur = pengajuan.jenis.toLowerCase() == 'lembur';
@@ -176,6 +184,26 @@ class PengajuanDetailSheet extends StatelessWidget {
                 label: "Jam Lembur",
                 value: "${_formatTime(pengajuan.jamMulai)} - ${_formatTime(pengajuan.jamSelesai)}",
               ),
+              if (pengajuan.durasiMenit != null)
+                _buildInfoRow(
+                  icon: Icons.timer_outlined,
+                  label: "Durasi Lembur",
+                  value: _formatDurasi(pengajuan.durasiMenit!),
+                ),
+              const Divider(height: 1, color: AppTheme.bgCard),
+              const SizedBox(height: 14),
+              if (pengajuan.namaKompensasi != null)
+                _buildInfoRow(
+                  icon: Icons.card_giftcard_outlined,
+                  label: "Jenis Kompensasi",
+                  value: pengajuan.namaKompensasi!,
+                ),
+              if (pengajuan.jumlahPoin != null && pengajuan.jumlahPoin! > 0)
+                _buildInfoRow(
+                  icon: Icons.stars_rounded,
+                  label: "Poin Diperoleh",
+                  value: "+${pengajuan.jumlahPoin} Poin",
+                ),
             ] else ...[
               _buildInfoRow(
                 icon: Icons.date_range_outlined,

lib/widgets/organisms/presensi_detail_sheet.dart

@@ -270,6 +270,40 @@ class _PresensiDetailSheetState extends State<PresensiDetailSheet> {
 
                     const SizedBox(height: 20),
 
+                    // Foto Absensi
+                    if (history.fotoMasukUrl != null || history.fotoPulangUrl != null) ...[
+                      Text(
+                        "Foto Absensi",
+                        style: AppTheme.labelLarge.copyWith(color: AppTheme.textSecondary),
+                      ),
+                      const SizedBox(height: 12),
+                      Row(
+                        children: [
+                          if (history.fotoMasukUrl != null)
+                            Expanded(
+                              child: _buildFotoCard(
+                                context,
+                                label: "Masuk",
+                                imageUrl: history.fotoMasukUrl!,
+                                color: AppTheme.statusGreen,
+                              ),
+                            ),
+                          if (history.fotoMasukUrl != null && history.fotoPulangUrl != null)
+                            const SizedBox(width: 12),
+                          if (history.fotoPulangUrl != null)
+                            Expanded(
+                              child: _buildFotoCard(
+                                context,
+                                label: "Pulang",
+                                imageUrl: history.fotoPulangUrl!,
+                                color: AppTheme.primaryOrange,
+                              ),
+                            ),
+                        ],
+                      ),
+                      const SizedBox(height: 20),
+                    ],
+
                     _buildDetailRow(
                       icon: _statusIcon(history.statusMasuk),
                       iconColor: _statusColor(history.statusMasuk),
@@ -520,4 +554,159 @@ class _PresensiDetailSheetState extends State<PresensiDetailSheet> {
       ),
     );
   }
+
+  Widget _buildFotoCard(
+    BuildContext context, {
+    required String label,
+    required String imageUrl,
+    required Color color,
+  }) {
+    return GestureDetector(
+      onTap: () => _showFullImage(context, imageUrl, label),
+      child: Column(
+        children: [
+          Container(
+            height: 140,
+            width: double.infinity,
+            decoration: BoxDecoration(
+              borderRadius: BorderRadius.circular(AppTheme.radiusMd),
+              border: Border.all(color: color.withValues(alpha: 0.3)),
+            ),
+            child: ClipRRect(
+              borderRadius: BorderRadius.circular(AppTheme.radiusMd),
+              child: Image.network(
+                imageUrl,
+                fit: BoxFit.cover,
+                loadingBuilder: (context, child, progress) {
+                  if (progress == null) return child;
+                  return Container(
+                    color: AppTheme.bgCard,
+                    alignment: Alignment.center,
+                    child: CircularProgressIndicator(
+                      value: progress.expectedTotalBytes != null
+                          ? progress.cumulativeBytesLoaded / progress.expectedTotalBytes!
+                          : null,
+                      strokeWidth: 2,
+                      color: color,
+                    ),
+                  );
+                },
+                errorBuilder: (context, error, stackTrace) {
+                  return Container(
+                    color: AppTheme.bgCard,
+                    alignment: Alignment.center,
+                    child: Column(
+                      mainAxisAlignment: MainAxisAlignment.center,
+                      children: [
+                        Icon(Icons.broken_image_outlined, size: 28, color: AppTheme.textTertiary),
+                        const SizedBox(height: 4),
+                        Text(
+                          "Gagal memuat",
+                          style: AppTheme.bodySmall.copyWith(color: AppTheme.textTertiary, fontSize: 10),
+                        ),
+                      ],
+                    ),
+                  );
+                },
+              ),
+            ),
+          ),
+          const SizedBox(height: 6),
+          Row(
+            mainAxisAlignment: MainAxisAlignment.center,
+            children: [
+              Container(
+                width: 6,
+                height: 6,
+                decoration: BoxDecoration(
+                  color: color,
+                  shape: BoxShape.circle,
+                ),
+              ),
+              const SizedBox(width: 4),
+              Text(
+                label,
+                style: AppTheme.bodySmall.copyWith(color: color, fontWeight: FontWeight.w600, fontSize: 11),
+              ),
+            ],
+          ),
+        ],
+      ),
+    );
+  }
+
+  void _showFullImage(BuildContext context, String imageUrl, String label) {
+    showDialog(
+      context: context,
+      builder: (ctx) => Dialog(
+        backgroundColor: Colors.black,
+        insetPadding: EdgeInsets.zero,
+        child: Stack(
+          children: [
+            InteractiveViewer(
+              minScale: 0.5,
+              maxScale: 4.0,
+              child: Center(
+                child: Image.network(
+                  imageUrl,
+                  fit: BoxFit.contain,
+                  loadingBuilder: (context, child, progress) {
+                    if (progress == null) return child;
+                    return const Center(
+                      child: CircularProgressIndicator(color: Colors.white),
+                    );
+                  },
+                  errorBuilder: (context, error, stackTrace) {
+                    return Center(
+                      child: Column(
+                        mainAxisSize: MainAxisSize.min,
+                        children: [
+                          const Icon(Icons.broken_image, color: Colors.white54, size: 48),
+                          const SizedBox(height: 8),
+                          Text(
+                            "Gagal memuat gambar",
+                            style: AppTheme.bodyMedium.copyWith(color: Colors.white54),
+                          ),
+                        ],
+                      ),
+                    );
+                  },
+                ),
+              ),
+            ),
+            Positioned(
+              top: MediaQuery.of(ctx).padding.top + 8,
+              left: 16,
+              child: Container(
+                padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
+                decoration: BoxDecoration(
+                  color: Colors.black.withValues(alpha: 0.5),
+                  borderRadius: BorderRadius.circular(AppTheme.radiusFull),
+                ),
+                child: Text(
+                  "Foto $label",
+                  style: AppTheme.labelMedium.copyWith(color: Colors.white),
+                ),
+              ),
+            ),
+            Positioned(
+              top: MediaQuery.of(ctx).padding.top + 8,
+              right: 8,
+              child: IconButton(
+                onPressed: () => Navigator.pop(ctx),
+                icon: Container(
+                  padding: const EdgeInsets.all(6),
+                  decoration: BoxDecoration(
+                    color: Colors.black.withValues(alpha: 0.5),
+                    shape: BoxShape.circle,
+                  ),
+                  child: const Icon(Icons.close, color: Colors.white, size: 22),
+                ),
+              ),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
 }

pubspec.lock

@@ -169,22 +169,6 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "1.0.8"
-  dart_earcut:
-    dependency: transitive
-    description:
-      name: dart_earcut
-      sha256: e485001bfc05dcbc437d7bfb666316182e3522d4c3f9668048e004d0eb2ce43b
-      url: "https://pub.dev"
-    source: hosted
-    version: "1.2.0"
-  dart_polylabel2:
-    dependency: transitive
-    description:
-      name: dart_polylabel2
-      sha256: "7eeab15ce72894e4bdba6a8765712231fc81be0bd95247de4ad9966abc57adc6"
-      url: "https://pub.dev"
-    source: hosted
-    version: "1.0.0"
   dbus:
     dependency: transitive
     description:
@@ -406,14 +390,6 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "2.0.1"
-  flutter_map:
-    dependency: "direct main"
-    description:
-      name: flutter_map
-      sha256: "391e7dc95cc3f5190748210a69d4cfeb5d8f84dcdfa9c3235d0a9d7742ccb3f8"
-      url: "https://pub.dev"
-    source: hosted
-    version: "8.2.2"
   flutter_plugin_android_lifecycle:
     dependency: transitive
     description:
@@ -696,6 +672,30 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "4.7.2"
+  image_cropper:
+    dependency: "direct main"
+    description:
+      name: image_cropper
+      sha256: "266760ed426d7121f0ada02c672bfe5c1b5c714e908328716aee756f045709dc"
+      url: "https://pub.dev"
+    source: hosted
+    version: "8.1.0"
+  image_cropper_for_web:
+    dependency: transitive
+    description:
+      name: image_cropper_for_web
+      sha256: fd81ebe36f636576094377aab32673c4e5d1609b32dec16fad98d2b71f1250a9
+      url: "https://pub.dev"
+    source: hosted
+    version: "6.1.0"
+  image_cropper_platform_interface:
+    dependency: transitive
+    description:
+      name: image_cropper_platform_interface
+      sha256: "2d8db8f4b638e448fa89a1e77cd8f053b4547472bd3ae073169e86626d03afef"
+      url: "https://pub.dev"
+    source: hosted
+    version: "7.2.0"
   image_picker:
     dependency: "direct main"
     description:
@@ -768,14 +768,6 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "0.20.2"
-  latlong2:
-    dependency: "direct main"
-    description:
-      name: latlong2
-      sha256: "98227922caf49e6056f91b6c56945ea1c7b166f28ffcd5fb8e72fc0b453cc8fe"
-      url: "https://pub.dev"
-    source: hosted
-    version: "0.9.1"
   leak_tracker:
     dependency: transitive
     description:
@@ -808,22 +800,6 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "5.1.1"
-  lists:
-    dependency: transitive
-    description:
-      name: lists
-      sha256: "4ca5c19ae4350de036a7e996cdd1ee39c93ac0a2b840f4915459b7d0a7d4ab27"
-      url: "https://pub.dev"
-    source: hosted
-    version: "1.0.1"
-  logger:
-    dependency: transitive
-    description:
-      name: logger
-      sha256: a7967e31b703831a893bbc3c3dd11db08126fe5f369b5c648a36f821979f5be3
-      url: "https://pub.dev"
-    source: hosted
-    version: "2.6.2"
   matcher:
     dependency: transitive
     description:
@@ -848,14 +824,6 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "1.16.0"
-  mgrs_dart:
-    dependency: transitive
-    description:
-      name: mgrs_dart
-      sha256: fb89ae62f05fa0bb90f70c31fc870bcbcfd516c843fb554452ab3396f78586f7
-      url: "https://pub.dev"
-    source: hosted
-    version: "2.0.0"
   mime:
     dependency: transitive
     description:
@@ -1048,14 +1016,6 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "6.0.3"
-  proj4dart:
-    dependency: transitive
-    description:
-      name: proj4dart
-      sha256: c8a659ac9b6864aa47c171e78d41bbe6f5e1d7bd790a5814249e6b68bc44324e
-      url: "https://pub.dev"
-    source: hosted
-    version: "2.1.0"
   provider:
     dependency: "direct main"
     description:
@@ -1293,14 +1253,6 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "1.4.0"
-  unicode:
-    dependency: transitive
-    description:
-      name: unicode
-      sha256: "0f69e46593d65245774d4f17125c6084d2c20b4e473a983f6e21b7d7762218f1"
-      url: "https://pub.dev"
-    source: hosted
-    version: "0.3.1"
   uuid:
     dependency: transitive
     description:
@@ -1373,14 +1325,6 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "1.1.5"
-  wkt_parser:
-    dependency: transitive
-    description:
-      name: wkt_parser
-      sha256: "8a555fc60de3116c00aad67891bcab20f81a958e4219cc106e3c037aa3937f13"
-      url: "https://pub.dev"
-    source: hosted
-    version: "2.0.0"
   xdg_directories:
     dependency: transitive
     description:

pubspec.yaml

@@ -42,12 +42,11 @@ dependencies:
   geolocator: ^14.0.2
   google_maps_flutter: ^2.14.0
   image_picker: ^1.2.1
+  image_cropper: ^8.0.2
   intl: ^0.20.2
   permission_handler: ^12.0.1
   google_fonts: ^8.0.0
   cached_network_image: ^3.4.1
-  flutter_map: ^8.2.2
-  latlong2: ^0.9.1
   table_calendar: ^3.2.0
   camera: ^0.10.6
   device_info_plus: ^10.1.0