import 'package:flutter/material.dart';
import 'package:test_sa/controllers/localization/localization.dart';
import 'package:test_sa/models/lookup.dart';
import 'package:test_sa/models/pantry/pm_kit.dart';
import 'package:test_sa/views/app_style/sizing.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/parts/auto_complete_parts_field.dart';
import 'package:test_sa/views/widgets/titles/app_sub_title.dart';
class PentryPMKitForm extends StatefulWidget {
  final List<PMKit> models;
  final bool enableValidate;
  const PentryPMKitForm({
    Key key, this.models, this.enableValidate,
  }) : super(key: key);

  @override
  State<PentryPMKitForm> createState() => _PentryPMKitFormState();
}

class _PentryPMKitFormState extends State<PentryPMKitForm> {

  @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(PMKit());
              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("Item Code"),
            const SizedBox(height: 4,),
            AutoCompletePartsField(
              clearAfterPick: false,
              initialValue: (model.itemCode?.name ?? "").toString(),
              onPick: (part){
                model.itemCode = Lookup(id: part.id,name: part.code);
              },
            ),
            const SizedBox(height: 8,),
            // const ASubTitle("Item Name"),
            // const SizedBox(height: 4,),
            // ATextFormField(
            //   initialValue: (model.itemName ?? "").toString(),
            //   textAlign: TextAlign.center,
            //   style: Theme.of(context).textTheme.subtitle1,
            //   textInputType: TextInputType.text,
            //   onChange: (value){
            //     model.itemName = value;
            //   },
            // ),
            // const SizedBox(height: 8,),
            // const ASubTitle("Preparation Time Frame"),
            // const SizedBox(height: 4,),
            // ATextFormField(
            //   initialValue: (model.preparationTimeFrame ?? "").toString(),
            //   textAlign: TextAlign.center,
            //   style: Theme.of(context).textTheme.subtitle1,
            //   textInputType: TextInputType.text,
            //   onChange: (value){
            //     model.preparationTimeFrame = value;
            //   },
            // ),
            // const SizedBox(height: 8,),
            // const ASubTitle("kit Frequency Demand"),
            // const SizedBox(height: 4,),
            // ATextFormField(
            //   initialValue: (model.kitFrequencyDemand ?? "").toString(),
            //   textAlign: TextAlign.center,
            //   style: Theme.of(context).textTheme.subtitle1,
            //   textInputType: TextInputType.text,
            //   onChange: (value){
            //     model.kitFrequencyDemand = value;
            //   },
            // ),
            // const SizedBox(height: 8,),
            // const ASubTitle("Availability"),
            // const SizedBox(height: 4,),
            // ATextFormField(
            //   initialValue: (model.availability ?? "").toString(),
            //   textAlign: TextAlign.center,
            //   style: Theme.of(context).textTheme.subtitle1,
            //   textInputType: TextInputType.text,
            //   onChange: (value){
            //     model.availability = value;
            //   },
            // ),
            // const SizedBox(height: 8,),
            // const ASubTitle("Quantity Needed"),
            // const SizedBox(height: 4,),
            // ATextFormField(
            //   initialValue: (model.quantityNeeded ?? "").toString(),
            //   textAlign: TextAlign.center,
            //   style: Theme.of(context).textTheme.subtitle1,
            //   textInputType: TextInputType.number,
            //   onChange: (value){
            //     model.quantityNeeded = value;
            //   },
            // ),
            // const SizedBox(height: 8,),
            // const ASubTitle("Quantity Reserved"),
            // const SizedBox(height: 4,),
            // ATextFormField(
            //   initialValue: (model.quantityReserved ?? "").toString(),
            //   textAlign: TextAlign.center,
            //   style: Theme.of(context).textTheme.subtitle1,
            //   textInputType: TextInputType.number,
            //   onChange: (value){
            //     model.quantityReserved = value;
            //   },
            // ),
            // const SizedBox(height: 8,),
            Divider(color: Theme.of(context).textTheme.titleMedium.color,),
          ],
        );
      }
    );
  }
}
