import 'package:flutter/material.dart';
import 'package:queue_mgr/backend/DataManager.dart';
import 'package:queue_mgr/scanning_page.dart';

class ServicePage extends StatefulWidget {
  ServicePage({super.key,required this.serviceId});
  String serviceId;
  @override
  State<ServicePage> createState() => _ServicePageState();
}

class _ServicePageState extends State<ServicePage> {
  @override
  Widget build(BuildContext context) {
    Map<String, dynamic> service = DataManager.instance().GetServiceById(widget.serviceId.toString());
    List<String> members = service['members'].toString().split(',');
    members.removeAt(0);
    return Scaffold(
      appBar: AppBar(title: Text(service['name']),),
      body: SafeArea(
        child: SingleChildScrollView(
          child: Padding(
            padding: const EdgeInsets.all(12.0),
            child: Column(
              children: [
                GridView.count(shrinkWrap: true,crossAxisCount: 2,children: [
                  Card(child:
                    Column(
                      mainAxisAlignment: MainAxisAlignment.spaceAround,
                      children: [
                        Row(mainAxisAlignment: MainAxisAlignment.center,children: [Icon(Icons.play_arrow),Text("  Starting Time")],),
                        Column(
                          children: [
                            Text(dateFormat.format(DateTime.parse(service['start_time']))),
                            Text(timeFormat.format(DateTime.parse(service['start_time'])),style: TextStyle(fontSize: 20)),
                          ],
                        ),
                        Container(height: 20,)
                      ],
                    ),),
                  Card(child:
                  Column(
                    mainAxisAlignment: MainAxisAlignment.spaceAround,
                    children: [
                      Row(mainAxisAlignment: MainAxisAlignment.center,children: [Icon(Icons.stop),Text("  Ending Time")],),
                      Column(
                        children: [
                          Text(dateFormat.format(DateTime.parse(service['end_time']))),
                          Text(timeFormat.format(DateTime.parse(service['end_time'])),style: TextStyle(fontSize: 20)),
                        ],
                      ),
                      Container(height: 20,)
                    ],
                  ),),

                ],),
                Card(
                  child: Padding(
                    padding: const EdgeInsets.all(12.0),
                    child: Column(
                      children: [
                        Row(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            Icon(Icons.people_alt_rounded),
                            Text("  Queue Length"),
                          ],
                        ),
                        Text(members.length.toString(),style: TextStyle(fontSize: 25),)
                      ],
                    ),
                  ),
                ),
                SizedBox(
                  height: 50,
                ),
                ElevatedButton(onPressed: (){
                  Navigator.of(context).push(MaterialPageRoute(builder: (context)=> ScanningPage(id: widget.serviceId)));
                }, child: Padding(
                  padding: const EdgeInsets.all(20.0),
                  child: Column(
                    children: [
                      Icon(Icons.qr_code_scanner),
                      SizedBox(height: 10,),
                      Text("Scan Mode"),
                    ],
                  ),
                )),
                SizedBox(height: 50,),
                (members.length >0) ? Card(
                  child: Padding(
                    padding: const EdgeInsets.all(8.0),
                    child: Column(
                      children: [
                        Row(mainAxisAlignment: MainAxisAlignment.center,children: [
                          Icon(Icons.emoji_people),
                          Text("  Queue")
                        ],),
                        SizedBox(height: 20,),
                        GridView.count(
                          crossAxisCount: 5,
                          mainAxisSpacing: 10,
                          crossAxisSpacing: 10,
                          shrinkWrap: true,
                          children: List.generate(members.length, (index){
                            if(members[index].length <=0){return Container();}
                            return Container(decoration: BoxDecoration(borderRadius: BorderRadius.circular(20),color: Colors.black.withOpacity(0.2)),child: Padding(
                              padding: const EdgeInsets.all(8.0),
                              child: Center(child: Text(members[index],style: TextStyle(fontSize: 18),)),
                            ));
                          }),
                        ),
                      ],
                    ),
                  ),
                ) : Container()
              ],
            ),
          ),
        ),
      ),
    );
  }
}