import 'package:flutter/material.dart';

void main() {
  runApp(const BookingApp());
}

class BookingApp extends StatelessWidget {
  const BookingApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: '簡單預約App',
      theme: ThemeData(primarySwatch: Colors.blue),
      home: const BookingPage(),
    );
  }
}

class BookingPage extends StatefulWidget {
  const BookingPage({super.key});

  @override
  State<BookingPage> createState() => _BookingPageState();
}

class _BookingPageState extends State<BookingPage> {
  DateTime? selectedDate;
  String? selectedTime;

  final List<String> timeSlots = [
    "09:00 - 10:00",
    "10:00 - 11:00",
    "11:00 - 12:00",
    "13:00 - 14:00",
    "14:00 - 15:00",
  ];

  void _pickDate() async {
    final DateTime? datePicked = await showDatePicker(
      context: context,
      initialDate: DateTime.now(),
      firstDate: DateTime.now(),
      lastDate: DateTime.now().add(const Duration(days: 30)),
    );

    if (datePicked != null) {
      setState(() {
        selectedDate = datePicked;
      });
    }
  }

  void _confirmBooking() {
    if (selectedDate == null || selectedTime == null) {
      ScaffoldMessenger.of(context).showSnackBar(
        const SnackBar(content: Text("請先選擇日期與時段")),
      );
      return;
    }

    showDialog(
      context: context,
      builder: (_) => AlertDialog(
        title: const Text("預約成功"),
        content: Text(
          "日期：${selectedDate!.toLocal().toString().split(' ')[0]}\n"
          "時段：$selectedTime",
        ),
        actions: [
          TextButton(
            onPressed: () => Navigator.pop(context),
            child: const Text("OK"),
          )
        ],
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text("預約系統")),
      body: Padding(
        padding: const EdgeInsets.all(16),
        child: Column(
          children: [
            ElevatedButton(
              onPressed: _pickDate,
              child: const Text("選擇日期"),
            ),
            if (selectedDate != null)
              Text("已選日期：${selectedDate!.toLocal().toString().split(' ')[0]}"),

            const SizedBox(height: 20),
            const Text("選擇時段："),
            Wrap(
              spacing: 8,
              children: timeSlots.map((slot) {
                return ChoiceChip(
                  label: Text(slot),
                  selected: selectedTime == slot,
                  onSelected: (_) {
                    setState(() {
                      selectedTime = slot;
                    });
                  },
                );
              }).toList(),
            ),

            const Spacer(),
            ElevatedButton(
              onPressed: _confirmBooking,
              child: const Text("確認預約"),
            ),
          ],
        ),
      ),
    );
  }
}

<script defer data-domain="html.cafe" src="https://milkymouse.com/js/script.js"></script>