import 'package:flutter/material.dart';
import 'package:test_sa/controllers/localization/localization.dart';
import 'package:test_sa/extensions/context_extension.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;
  final num assetId;
  const PentryPMKitForm({
    Key key,
    this.models,
    this.assetId,
    this.enableValidate,
  }) : super(key: key);

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

class _PentryPMKitFormState extends State<PentryPMKitForm> {
  @override
  Widget build(BuildContext context) {
    
    return ListView.builder(
      padding: EdgeInsets.only(
        top: 12 * AppStyle.getScaleFactor(context),
        left: 12 * AppStyle.getScaleFactor(context),
        right: 12 * AppStyle.getScaleFactor(context),
        bottom: 100 * AppStyle.getScaleFactor(context) + MediaQuery.of(context).padding.bottom,
      ),
      itemCount: widget.models.length + 1,
      shrinkWrap: true,
      itemBuilder: (context, index) {
        if (index == widget.models.length) {
          return AButton(
            text: context.translation.add,
            onPressed: () {
              widget.models.add(PMKit());
              setState(() {});
            },
          );
        }
        final model = widget.models[index];
        return Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                ASubTitle("#${index + 1}"),
                if (index != 0)
                  ASmallButton(
                    color: Theme.of(context).colorScheme.error,
                    text: context.translation.delete,
                    onPressed: () {
                      widget.models.remove(model);
                      setState(() {});
                    },
                  ),
              ],
            ),
            const SizedBox(
              height: 8,
            ),
            const ASubTitle("Item Code"),
            const SizedBox(
              height: 4,
            ),
            AutoCompletePartsField(
              assetId: widget.assetId,
              clearAfterPick: false,
              initialValue: (model.itemCode?.name ?? "").toString(),
              onPick: (part) {
                model.itemCode = Lookup(id: part.id, name: part.partNo);
              },
            ),
            const SizedBox(
              height: 8,
            ),
            Divider(
              color: Theme.of(context).textTheme.titleMedium.color,
            ),
          ],
        );
      },
    );
  }
}