import 'package:firebase_auth/firebase_auth.dart';
import 'package:firebase_storage/firebase_storage.dart';
import 'package:flutter/material.dart';
import 'package:flutter_rating_bar/flutter_rating_bar.dart';
import 'package:intl/intl.dart';
import 'package:prosappco/src/components/photo_view.dart';
import 'package:prosappco/src/components/pop_appbar.dart';
import 'package:prosappco/src/models/event_model.dart';
import 'package:prosappco/src/models/scores_model.dart';
import 'package:prosappco/src/models/user_model.dart';

class CitaScreen extends StatefulWidget {
  final Event evento;
  const CitaScreen({super.key, required this.evento});

  @override
  State<CitaScreen> createState() => _CitaScreenState();
}

class _CitaScreenState extends State<CitaScreen> {
  UserModel? user;
  @override
  String nombre = '';
  Reference? ref_photo;
  ScoresModel? scoresModel;

  @override
  void initState() {
    super.initState();

    if (user == null) {
      UserModel.getUser(uid.toString()).then(
        (UserModel s) => setState(() => user = s),
      );
    }
    if (scoresModel == null) {
      ScoresModel.scoreFrom(uid.toString(), false).then(
        (ScoresModel s) => setState(() => scoresModel = s),
      );
    }
  }

  Widget build(BuildContext context) {
    if (nombre == '') {
      UserModel.getUser(widget.evento.userId!).then((value) {
        setState(() {
          nombre = value.name;
          ref_photo = value.photo;
        });
      });
    }

    final User? currentUser = FirebaseAuth.instance.currentUser;

    return Scaffold(
      appBar: PopAppbar(
          onPressed: () {
            Navigator.pop(context);
          },
          label: 'Servicio'),
      body: Column(
        children: [
          Expanded(
            child: Column(
              children: [
                ListTile(
                  leading: ReferencePhoto(
                    ref: ref_photo,
                    size: 50,
                    sizeCircle: 50,
                    sizeIcon: 35,
                  ),
                  title: RichText(
                    text: TextSpan(
                      children: [
                        TextSpan(
                          text: '${nombre}, ',
                          style: const TextStyle(
                            color: Colors.black,
                            fontWeight: FontWeight.bold,
                            fontSize: 16,
                          ),
                        ),
                        TextSpan(
                          text:
                              '${DateFormat('dd MMM', 'es').format(DateTime.parse(widget.evento.day!))} ${widget.evento.range1Hour1}',
                          style: TextStyle(
                            color: Colors.grey,
                            fontSize: 16,
                          ),
                        ),
                      ],
                    ),
                  ),
                  subtitle: Row(
                    children: [
                      RatingBar.builder(
                        initialRating: scoresModel?.average ?? 0,
                        minRating: 1,
                        direction: Axis.horizontal,
                        allowHalfRating: true,
                        itemCount: 5,
                        itemSize: 25,
                        maxRating: 5,
                        itemPadding: const EdgeInsets.symmetric(horizontal: 0),
                        itemBuilder: (context, _) => const Icon(
                          Icons.star,
                          color: Color(0xFF2BA4EC),
                        ),
                        onRatingUpdate: (rating) {},
                        ignoreGestures: true,
                      ),
                      const SizedBox(width: 5),
                      Text(
                          '(${scoresModel?.total.toString()})  ${scoresModel?.average.toString()}'),
                    ],
                  ),
                ),
                Text(
                  textAlign: TextAlign.center,
                  '" ${widget.evento.description} "',
                  style: TextStyle(
                      color: Colors.grey, fontStyle: FontStyle.italic),
                )
              ],
            ),
          ),
          Center(
            child: Padding(
              padding: const EdgeInsets.only(bottom: 30),
              child: ElevatedButton(
                onPressed: () {},
                style: ElevatedButton.styleFrom(
                  backgroundColor: const Color(0xFFEC2B2B),
                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(50),
                  ),
                  elevation: 0,
                  minimumSize: const Size(230, 60),
                ),
                child: const Text(
                  'Cancelar servicio',
                  style: TextStyle(
                    color: Colors.white,
                    fontWeight: FontWeight.bold,
                    fontSize: 18,
                  ),
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}