import 'package:doctor_app_flutter/config/size_config.dart';
import 'package:doctor_app_flutter/core/model/patient/lab_result/lab_result.dart';
import 'package:doctor_app_flutter/utils/translations_delegate_base_utils.dart';
import 'package:doctor_app_flutter/widgets/shared/app_texts_widget.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:hexcolor/hexcolor.dart';

class LabResultWidget extends StatefulWidget {
  final List<LabResult> labResult;

  LabResultWidget({Key? key, required this.labResult});

  @override
  _LabResultWidgetState createState() => _LabResultWidgetState();
}

class _LabResultWidgetState extends State<LabResultWidget> {
  bool _showDetails = true;

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              AppText(
                TranslationBase.of(context).generalResult,
                fontSize: 2.5 * SizeConfig.textMultiplier!,
                fontWeight: FontWeight.bold,
              ),
              InkWell(
                  onTap: () {
                    setState(() {
                      _showDetails = !_showDetails;
                    });
                  },
                  child: Icon(_showDetails
                      ? Icons.keyboard_arrow_up
                      : Icons.keyboard_arrow_down)),
            ],
          ),
          Divider(
            color: Colors.grey,
            height: 0.5,
          ),
          !_showDetails
              ? Container()
              : AnimatedContainer(
                  duration: Duration(microseconds: 200),
                  child: Container(
                    margin: EdgeInsets.only(top: 10),
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.all(Radius.circular(10)),
                    ),
                    child: Column(children: [
                      Container(
                        child: Row(
                          children: <Widget>[
                            Expanded(
                              child: Container(
                                decoration: BoxDecoration(
                                  color: HexColor('#515B5D'),
                                  borderRadius: BorderRadius.only(
                                    topLeft: Radius.circular(10.0),
                                  ),
                                ),
                                child: Center(
                                  child: AppText(
                                    TranslationBase.of(context).description,
                                    color: Colors.white,
                                  ),
                                ),
                                height: 60,
                              ),
                            ),
                            Expanded(
                              child: Container(
                                  color: HexColor('#515B5D'),
                                  child: Center(
                                    child: AppText(
                                        TranslationBase.of(context).value,
                                        color: Colors.white),
                                  ),
                                  height: 60),
                            ),
                            Expanded(
                              child: Container(
                                  decoration: BoxDecoration(
                                    color: HexColor('#515B5D'),
                                    borderRadius: BorderRadius.only(
                                      topRight: Radius.circular(10.0),
                                    ),
                                  ),
                                  child: Center(
                                    child: AppText(
                                        TranslationBase.of(context).range,
                                        color: Colors.white),
                                  ),
                                  height: 60),
                            ),
                          ],
                        ),
                      ),
                      ...widget.labResult.map((result) {
                        return Container(
                          padding: EdgeInsets.symmetric(horizontal: 4),
                          decoration: BoxDecoration(
                            borderRadius: BorderRadius.all(Radius.circular(10)),
                            border: Border(
                              bottom:
                                  BorderSide(color: Colors.grey, width: 0.5),
                              top: BorderSide(color: Colors.grey, width: 0.5),
                              left: BorderSide(color: Colors.grey, width: 0.5),
                              right: BorderSide(color: Colors.grey, width: 0.5),
                            ),
                          ),
                          margin: EdgeInsets.only(top: 10),
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: <Widget>[
                              Row(
                                children: <Widget>[
                                  Expanded(
                                    child: Container(
                                      decoration: BoxDecoration(
                                        borderRadius: BorderRadius.only(
                                          bottomLeft: Radius.circular(10.0),
                                        ),
                                      ),
                                      child: Center(
                                        child: AppText(
                                          '${result.description}',
                                          color: Colors.grey[800]!,
                                        ),
                                      ),
                                      height: 60,
                                    ),
                                  ),
                                  Expanded(
                                    child: Container(
                                        child: Center(
                                          child: AppText(
                                              '${result.resultValue}',
                                              color: Colors.grey[800]!),
                                        ),
                                        height: 60),
                                  ),
                                  Expanded(
                                    child: Container(
                                        child: Center(
                                          child: AppText(
                                              '${result.referenceRange}',
                                              color: Colors.grey[800]!),
                                        ),
                                        height: 60),
                                  ),
                                ],
                              )
                            ],
                          ),
                        );
                      }).toList(),
                    ]),
                  ),
                )
        ],
      ),
    );
  }
}