import 'package:flutter/material.dart';
import 'package:test_sa/controllers/localization/localization.dart';
import 'package:test_sa/models/pantry/ppm_check_list.dart';
import 'package:test_sa/views/app_style/sizing.dart';
import 'package:test_sa/views/widgets/app_text_form_field.dart';
import 'package:test_sa/views/widgets/buttons/app_button.dart';
import 'package:test_sa/views/widgets/buttons/app_small_button.dart';
import 'package:test_sa/views/widgets/status/pentry/pentry_task_status_mune.dart';
import 'package:test_sa/views/widgets/titles/app_sub_title.dart';
class PentryPPMCheckListForm extends StatefulWidget {
  final List<PPMCheckList> models;
  final bool enableValidate;
  const PentryPPMCheckListForm({
    Key key, this.models, this.enableValidate,
  }) : super(key: key);

  @override
  State<PentryPPMCheckListForm> createState() => _PentryPPMCheckListFormState();
}

class _PentryPPMCheckListFormState extends State<PentryPPMCheckListForm> {


  @override
  Widget build(BuildContext context) {
    final subtitle = AppLocalization.of(context).subtitle;
    return ListView.builder(
      padding: EdgeInsets.only(
        top: 12 * AppStyle.getScaleFactor(context),
        left: 12 * AppStyle.getScaleFactor(context),
        right: 12 * AppStyle.getScaleFactor(context),
        bottom: 80 * AppStyle.getScaleFactor(context)
      ),
      itemCount:  widget.models.length + 1,
      itemBuilder: (context,index){
        if(index == widget.models.length){
          return AButton(
            text: subtitle.add,
            onPressed: (){
              widget.models.add(PPMCheckList());
              setState(() {});
            },
          );
        }
        final model = widget.models[index];
        return ListView(
          shrinkWrap: true,
          physics: const ClampingScrollPhysics(),
          children: [
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                ASubTitle("#${index+1}"),
                if(index != 0)
                ASmallButton(
                  color: Theme.of(context).colorScheme.error,
                  text: subtitle.delete,
                  onPressed: (){
                    widget.models.remove(model);
                    setState(() {});
                  },
                ),
              ],
            ),
            const SizedBox(height: 8,),
            const ASubTitle("Task"),
            const SizedBox(height: 4,),
            ATextFormField(
              initialValue: (model.title ?? "").toString(),
              textAlign: TextAlign.center,
              style: Theme.of(context).textTheme.subtitle1,
              textInputType: TextInputType.text,
              onChange: (value){
                model.title = value;
              },
            ),
            const SizedBox(height: 8,),
            ASubTitle(subtitle.status),
            const SizedBox(height: 4,),
            PentryTaskStatusMenu(
              initialValue: model.status,
              onSelect: (status){
                model.status = status;
              },
            ),
            const SizedBox(height: 8,),
            const ASubTitle("Comment"),
            const SizedBox(height: 4,),
            ATextFormField(
              initialValue: (model.comment ?? "").toString(),
              textAlign: TextAlign.center,
              style: Theme.of(context).textTheme.subtitle1,
              textInputType: TextInputType.text,
              onChange: (value){
                model.comment = value;
              },
            ),
            const SizedBox(height: 8,),
            const ASubTitle("Measured Value"),
            const SizedBox(height: 4,),
            ATextFormField(
              initialValue: (model.measuredValue ?? "").toString(),
              textAlign: TextAlign.center,
              style: Theme.of(context).textTheme.subtitle1,
              textInputType: TextInputType.text,
              onChange: (value){
                model.measuredValue = value;
              },
            ),
            const SizedBox(height: 8,),
            Divider(color: Theme.of(context).textTheme.titleMedium.color,),
          ],
        );
      }
    );
  }
}
