import 'package:flutter/material.dart';
import 'package:enaklo_pos/core/constants/colors.dart';
import 'package:enaklo_pos/core/extensions/string_ext.dart';
import 'package:enaklo_pos/data/models/response/payment_method_response_model.dart';

import '../../../core/components/spaces.dart';

class PaymentMethodReportWidget extends StatelessWidget {
  final PaymentMethodData paymentMethodData;
  final String title;
  final String searchDateFormatted;
  final List<Widget> headerWidgets;

  const PaymentMethodReportWidget({
    super.key,
    required this.paymentMethodData,
    required this.title,
    required this.searchDateFormatted,
    required this.headerWidgets,
  });

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: AppColors.white,
      body: Column(
        children: [
          // HEADER
          Container(
            padding: const EdgeInsets.all(24.0),
            decoration: const BoxDecoration(
              color: AppColors.white,
              border: Border(
                bottom: BorderSide(
                  color: AppColors.stroke,
                  width: 1,
                ),
              ),
            ),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      title,
                      style: const TextStyle(
                        fontSize: 24,
                        fontWeight: FontWeight.w600,
                      ),
                    ),
                    const SpaceHeight(8.0),
                    Text(
                      searchDateFormatted,
                      style: const TextStyle(
                        fontSize: 16,
                        color: AppColors.grey,
                      ),
                    ),
                  ],
                ),
                Row(
                  children: [
                    Container(
                      padding: const EdgeInsets.symmetric(
                        horizontal: 16.0,
                        vertical: 8.0,
                      ),
                      decoration: BoxDecoration(
                        color: AppColors.primary,
                        borderRadius: BorderRadius.circular(8.0),
                      ),
                      child: Text(
                        'Total: ${paymentMethodData.total?.currencyFormatRpV2 ?? 'Rp 0'}',
                        style: const TextStyle(
                          color: AppColors.white,
                          fontWeight: FontWeight.w600,
                        ),
                      ),
                    ),
                  ],
                ),
              ],
            ),
          ),

          // CONTENT
          Expanded(
            child: SingleChildScrollView(
              child: Column(
                children: [
                  // TABLE HEADER
                  Row(
                    children: headerWidgets,
                  ),

                  // TABLE BODY
                  ...paymentMethodData.paymentMethods?.map((item) {
                        return Container(
                          decoration: const BoxDecoration(
                            border: Border(
                              bottom: BorderSide(
                                color: AppColors.stroke,
                                width: 1,
                              ),
                            ),
                          ),
                          child: Row(
                            children: [
                              _getBodyItemWidget(
                                item.paymentMethod ?? '-',
                                180,
                              ),
                              _getBodyItemWidget(
                                item.totalAmount?.currencyFormatRpV2 ?? 'Rp 0',
                                180,
                              ),
                              _getBodyItemWidget(
                                item.transactionCount?.toString() ?? '0',
                                180,
                              ),
                            ],
                          ),
                        );
                      }).toList() ??
                      [],
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }

  Widget _getBodyItemWidget(String label, double width) {
    return Container(
      width: width,
      height: 56,
      alignment: Alignment.centerLeft,
      padding: const EdgeInsets.symmetric(horizontal: 16.0),
      child: Text(
        label,
        style: const TextStyle(
          fontSize: 14,
        ),
      ),
    );
  }
}
