map_view.dart

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:intl/intl.dart';
import 'package:signbook/app/data/models/sign_model.dart';

import '../controllers/map_controller.dart';

class MapView extends GetView<MapController> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('路徑紀錄'),
        centerTitle: true,
      ),
      body: Obx(() {
        if (controller.isLoading) {
          return const Center(
            child: CircularProgressIndicator(),
          );
        }

        return Stack(
          children: [
            GoogleMap(
              mapType: MapType.normal,
              initialCameraPosition: controller.initialCameraPosition,
              onMapCreated: (mapCtrl) => controller.setMapController(mapCtrl),
              markers: controller.markers,
              polylines: controller.polylines,
            ),
            SafeArea(
              child: Row(
                children: [
                  Expanded(
                    child: Container(
                      margin: const EdgeInsets.all(8),
                      padding: const EdgeInsets.symmetric(
                          horizontal: 16, vertical: 4),
                      width: 100,
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(8),
                        color: Colors.white,
                      ),
                      child: DropdownButton<Sign>(
                        onChanged: (sign) => controller.selectPoint(sign!),
                        value: controller.selectedPoint,
                        items: controller.checkPoints
                            .map(
                              (sign) => DropdownMenuItem(
                                value: sign,
                                child: Text(
                                    '${sign.signer!.displayName} - ${DateFormat('yyyy-MM-dd HH:mm').format(sign.at!.toLocal())} - ${sign.action!}'),
                              ),
                            )
                            .toList(),
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ],
        );
      }),
    );
  }
}