import 'package:flutter/material.dart';
import 'package:get/get.dart';
import '../../controller/home_controller.dart';

class HomePage extends GetView<HomeController> {
  static const String namedRoute = '/home';
  const HomePage({super.key});
  @override
  Widget build(BuildContext context) {
    var homeCtrl = controller;
    return SafeArea(
      child: Scaffold(
        appBar: AppBar(
          toolbarHeight: 90,
          backgroundColor: Colors.grey.shade800,
          centerTitle: true,
          title: Text(
            'Kantine Ausgaben Liste',
            style: TextStyle(color: Colors.grey.shade200, fontSize: 35.0),
          ),
        ),
        body: Obx(
          () =>
              homeCtrl.isloadingData.value
                  ? Center(child: CircularProgressIndicator())
                  : Container(
                    decoration: BoxDecoration(color: Colors.grey.shade600),
                    child: ListView.separated(
                      itemCount: homeCtrl.listKantine.length,
                      separatorBuilder:
                          (context, index) =>
                              Divider(color: Colors.grey.shade700),
                      padding: EdgeInsets.all(10),
                      physics: BouncingScrollPhysics(),
                      shrinkWrap: true,
                      scrollDirection: Axis.vertical,
                      primary: false,
                      itemBuilder: (context, index) {
                        var properties = homeCtrl.listKantine[index];
                        var dateStart = properties['Verkaufsdatum']['date']['start'];
                        var betrag = properties['Betrag']['number'].toString();
                        var belegName = properties['BelegName']['title'][0]['plain_text'];
                        return Container(
                          decoration: BoxDecoration(
                            color: Colors.grey.shade800,
                            borderRadius: BorderRadius.circular(10),
                          ),
                          child: Dismissible(
                            key: Key(properties['id']),
                            background: Container(
                              color: Colors.red,
                              child: Icon(Icons.delete),
                            ),
                            direction: DismissDirection.endToStart,
                            onDismissed: (direction) {
                              homeCtrl.deleteBeleg(properties['id'], index);
                            },
                            child: ListTile(
                              title: Text(
                                dateStart,
                                style: TextStyle(
                                  color: Colors.grey.shade200,
                                  fontSize: 20.0,
                                ),
                              ),
                              subtitle: Text(
                                belegName,
                                style: TextStyle(
                                  color: Colors.grey.shade400,
                                  fontSize: 25.0,
                                ),
                              ),
                              tileColor: Colors.grey.shade800,
                              textColor: Colors.grey.shade200,
                              shape: RoundedRectangleBorder(
                                borderRadius: BorderRadius.circular(10),
                              ),
                              contentPadding: EdgeInsets.all(10),
                              leading: Icon(Icons.money),
                              trailing: Text(
                                '€$betrag',
                                style: TextStyle(
                                  color: Colors.green.shade200,
                                  fontSize: 30.0,
                                ),
                              ),
                            ),
                          ),
                        );
                      },
                    ),
                  ),
        ),
        floatingActionButton: FloatingActionButton(
          onPressed: () {
            homeCtrl.addBeleg(); // Add your action here
          },
          backgroundColor: Colors.grey.shade400,
          child: Icon(Icons.add),
        ),
      ),
    );
  }
}