import 'dart:developer';

import 'package:flutter/material.dart';
import 'package:gap/gap.dart';
import 'package:ocbo_esign_mobile/blocs/qr/functions/bloc_getqr.dart';
import 'package:ocbo_esign_mobile/functions/get_api.dart';
import 'package:ocbo_esign_mobile/widgets/box_widget.dart';
import 'package:ocbo_esign_mobile/widgets/image_widget.dart';
import 'package:ocbo_esign_mobile/widgets/input_widget.dart';
import 'package:ocbo_esign_mobile/widgets/text_widget.dart';
import 'package:intl/intl.dart';

class ValidateDetailPage extends StatefulWidget {
  const ValidateDetailPage({super.key});

  @override
  State<ValidateDetailPage> createState() => _ValidateDetailPageState();
}

class _ValidateDetailPageState extends State<ValidateDetailPage> {
  final _searchController = TextEditingController();
  final NumberFormat formatter = NumberFormat('#,###.##');
  final dateFormatter = DateFormat('yyyy-MM-dd');
  // final Color greenColor = const Color(0xFF4CCE51);
  late int _total = 0;
  late List _applicationList = [];
  late List _dateList = [];

  void _getTotalSigned() async {
    final name = await blocGetQr(context);
    final responseCount = await getApi('get-transactions-count', name, null);
    final total = responseCount['result'];

    final response = await getApi('get-transactions', name, null);
    final applicationNoList = response['result'];
    final dateList = response['result2'];

    setState(() {
      _total = double.parse(total).toInt();
      _applicationList = applicationNoList;
      _dateList = dateList;
    });
  }

  @override
  void initState() {
    _getTotalSigned();

    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      resizeToAvoidBottomInset: false,
      body: Container(
        alignment: Alignment.center,
        height: MediaQuery.of(context).size.height,
        decoration: const BoxDecoration(
          gradient: LinearGradient(
            begin: Alignment.topCenter,
            end: Alignment.bottomCenter,
            colors: [
              Color.fromRGBO(37, 25, 44, 1),
              Color.fromRGBO(22, 33, 44, 1),
              Color.fromRGBO(22, 33, 44, 1),
              Color.fromRGBO(22, 33, 44, 1),
              Color.fromRGBO(25, 46, 41, 1),
            ],
          ),
        ),
        child: SizedBox(
          width: MediaQuery.of(context).size.width - 112,
          child: Column(
            children: [
              const Gap(88),
              BoxWidget(
                circular: 16,
                content: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Column(
                      children: [
                        TextWidget(text: formatter.format(_total), size: 50, bold: true),
                        const TextWidget(text: 'Total Signed Applications', size: 16),
                      ],
                    ),
                  ],
                ),
              ),
              const Gap(16),
              ClipRRect(
                // borderRadius: BorderRadius.circular(36),
                child: InputWidget(
                  controller: _searchController,
                  password: false,
                  placeholder: 'Search Application Number',
                ),
              ),
              const Gap(24),

              // ListView(
              //   scrollDirection: Axis.horizontal,
              //   padding: EdgeInsets.symmetric(horizontal: 16),
              //   children: [
              //     // BoxWidget(
              //     //   alignment: CrossAxisAlignment.center,
              //     //   circular: 16,
              //     //   content: Row(
              //     //     children: [
              //     //       const ImageWidget(imagePath: 'assets/esign.webp', size: 48, measureByHeight: true),
              //     //       const Gap(16),
              //     //       Column(
              //     //         crossAxisAlignment: CrossAxisAlignment.start,
              //     //         children: [
              //     //           TextWidget(text: '23-000123', size: 18, bold: true),
              //     //           const Gap(4),
              //     //           TextWidget(text: 'Total Signed Applications', size: 12),
              //     //         ],
              //     //       ),
              //     //     ],
              //     //   ),
              //     // ),
              //   ],
              // ),
              Expanded(
                child: ListView.builder(
                  itemCount: _total,
                  itemBuilder: (BuildContext context, int index) {
                    return Column(
                      crossAxisAlignment: CrossAxisAlignment.stretch,
                      mainAxisAlignment: MainAxisAlignment.start,
                      children: [
                        BoxWidget(
                          alignment: CrossAxisAlignment.center,
                          circular: 16,
                          content: Row(
                            children: [
                              const ImageWidget(imagePath: 'assets/esign-check.webp', size: 40, measureByHeight: true),
                              const Gap(16),
                              Column(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [
                                  TextWidget(text: _applicationList[index], size: 18, bold: true),
                                  const Gap(4),
                                  SizedBox(
                                    width: 190,
                                    child: TextWidget(text: '8990 Housing Development Corporation', size: 10),
                                  ),
                                  const Gap(4),
                                  TextWidget(text: _dateList[index], size: 10, opacity: 0.8),
                                ],
                              ),
                            ],
                          ),
                        ),
                        const Gap(8),
                      ],
                    );
                  },
                ),
              ),

              // Column(
              //   crossAxisAlignment: CrossAxisAlignment.center,
              //   children: [
              //     BoxWidget(
              //       alignment: CrossAxisAlignment.center,
              //       circular: 16,
              //       content: Row(
              //         children: [
              //           const ImageWidget(imagePath: 'assets/esign.webp', size: 48, measureByHeight: true),
              //           const Gap(16),
              //           Column(
              //             crossAxisAlignment: CrossAxisAlignment.start,
              //             children: [
              //               TextWidget(text: '23-000123', size: 18, bold: true),
              //               const Gap(4),
              //               TextWidget(text: 'Total Signed Applications', size: 12),
              //             ],
              //           ),
              //         ],
              //       ),
              //     ),
              //     // const Gap(8),
              //     // BoxWidget(
              //     //   alignment: CrossAxisAlignment.center,
              //     //   circular: 16,
              //     //   content: Row(
              //     //     children: [
              //     //       const ImageWidget(imagePath: 'assets/esign.webp', size: 48, measureByHeight: true),
              //     //       const Gap(16),
              //     //       Column(
              //     //         crossAxisAlignment: CrossAxisAlignment.start,
              //     //         children: [
              //     //           TextWidget(text: '23-000123', size: 18, bold: true),
              //     //           const Gap(4),
              //     //           TextWidget(text: 'Total Signed Applications', size: 12),
              //     //           const Gap(4),
              //     //           Expanded(
              //     //             child: Row(
              //     //               mainAxisAlignment: MainAxisAlignment.end,
              //     //               children: [TextWidget(text: 'Dates', size: 8)],
              //     //             ),
              //     //           ),
              //     //         ],
              //     //       ),
              //     //     ],
              //     //   ),
              //     // ),
              //     // const Gap(8),
              //     // BoxWidget(
              //     //   alignment: CrossAxisAlignment.center,
              //     //   circular: 16,
              //     //   content: Row(
              //     //     children: [
              //     //       const ImageWidget(imagePath: 'assets/esign.webp', size: 48, measureByHeight: true),
              //     //       const Gap(16),
              //     //       Column(
              //     //         crossAxisAlignment: CrossAxisAlignment.start,
              //     //         children: [
              //     //           TextWidget(text: '23-000123', size: 18, bold: true),
              //     //           const Gap(4),
              //     //           TextWidget(text: 'Total Signed Applications', size: 12),
              //     //         ],
              //     //       ),
              //     //     ],
              //     //   ),
              //     // ),
              //   ],
              // ),
            ],
          ),
        ),
      ),
    );
  }
}