import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import '../bloc/redemption_bloc.dart';
import '../bloc/redemption_state.dart';
import '../viewmodel/redemption_view_model.dart';

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

  @override
  Widget build(BuildContext context) {
    final vm = RedemptionViewModel(context.read<RedemptionBloc>());
    return BlocBuilder<RedemptionBloc, RedemptionState>(
      builder: (context, state) {
        final data = state.selectedRedemption ?? {};
        return Scaffold(
          backgroundColor: Colors.white,
          // appBar: AppBar(
          //   backgroundColor: Colors.white,
          //   elevation: 0,
          //   leading: IconButton(
          //     icon: const Icon(Icons.arrow_back, color: Colors.black),
          //     onPressed: () => Navigator.pop(context),
          //   ),
          //   title: const Text("Redemption",
          //       style: TextStyle(
          //           color: Colors.black, fontWeight: FontWeight.w600)),
          // ),
          body: SafeArea(
            child: Padding(
              padding: const EdgeInsets.symmetric(horizontal: 16),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  _buildHeaderSection(context),
                  const Text(
                    "Customer Details",
                    style: TextStyle(fontSize: 16, fontWeight: FontWeight.w600),
                  ),
                  const SizedBox(height: 8),
                  _infoRow("Name", data['name']),
                  _infoRow("Phone", data['phone']),
                  _infoRow("Email", data['email']),
                  const Divider(height: 24),
                  const Text(
                    "City Card Details",
                    style: TextStyle(fontSize: 16, fontWeight: FontWeight.w600),
                  ),
                  _infoRow("Card Type", data['cardType']),
                  _infoRow("Validity", data['validity']),
                  const Divider(height: 24),
                  const Text(
                    "Partner Details",
                    style: TextStyle(fontSize: 16, fontWeight: FontWeight.w600),
                  ),
                  _infoRow("Attraction booked", data['attraction']),
                  _infoRow("City", data['city']),
                  _infoRow("Booking Date", data['date']),
                  _infoRow("Timeslot", data['time']),
                  Spacer(),
                  ElevatedButton(
                    style: ElevatedButton.styleFrom(
                      backgroundColor: Color(0xffF95F62),
                      foregroundColor: Colors.white,
                      minimumSize: const Size.fromHeight(50),
                      shape: RoundedRectangleBorder(
                        borderRadius: BorderRadius.circular(12),
                      ),
                    ),
                    onPressed: vm.approve,
                    child: const Text(
                      "Approve",
                      style: TextStyle(fontWeight: FontWeight.w600),
                    ),
                  ),
                  const SizedBox(height: 8),
                  OutlinedButton(
                    style: OutlinedButton.styleFrom(
                      side: const BorderSide(color: Colors.redAccent),
                      minimumSize: const Size.fromHeight(50),
                      shape: RoundedRectangleBorder(
                        borderRadius: BorderRadius.circular(12),
                      ),
                    ),
                    onPressed: vm.disapprove,
                    child: const Text(
                      "Disapprove",
                      style: TextStyle(
                        color: Colors.redAccent,
                        fontWeight: FontWeight.w600,
                      ),
                    ),
                  ),
                  const SizedBox(height: 20),
                ],
              ),
            ),
          ),
        );
      },
    );
  }

  Widget _buildHeaderSection(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Padding(
          padding: const EdgeInsets.symmetric(horizontal: 2.0, vertical: 14.0),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              GestureDetector(

                child: Container(
                  width: 44,
                  height: 44,
                  decoration: const BoxDecoration(
                    color: Color(0xFFF95F62),
                    shape: BoxShape.circle,
                  ),
                  child: const Icon(Icons.arrow_back, color: Colors.white),
                ),
                onTap: () {
                  Navigator.pop(context);
                },
              ),
              Text(
                'Redemption',
                style: const TextStyle(
                  fontWeight: FontWeight.w700,
                  fontSize: 28,
                ),
              ),
              SizedBox(width: 40),
            ],
          ),
        ),
        SizedBox(height: 35),
      ],
    );
  }

  Widget _infoRow(String label, String? value) {
    return Padding(
      padding: const EdgeInsets.symmetric(vertical: 4),
      child: Row(
        children: [
          Expanded(
            child: Text(
              label,
              style: const TextStyle(color: Colors.black54, fontSize: 14),
            ),
          ),
          Expanded(
            child: Text(
              value ?? '',
              style: const TextStyle(color: Colors.black87, fontSize: 14),
            ),
          ),
        ],
      ),
    );
  }
}
