import { DeleteFilled } from "@ant-design/icons";
import { Button, Form, Input } from "antd";
import React from "react";
import { useTranslation } from "react-i18next";
import CurrencyInput from "../form-items-formatted/currency-form-item.component";
import FormListMoveArrows from "../form-list-move-arrows/form-list-move-arrows.component";
import LayoutFormRow from "../layout-form-row/layout-form-row.component";

export default function ShopInfoLaborRates({ form }) {
  const { t } = useTranslation();

  return (
    <div>
      <Form.List name={["md_labor_rates"]}>
        {(fields, { add, remove, move }) => {
          return (
            <div>
              {fields.map((field, index) => (
                <Form.Item key={field.key}>
                  <LayoutFormRow>
                    <Form.Item
                      label={t("jobs.fields.labor_rate_desc")}
                      key={`${index}rate_label`}
                      name={[field.name, "rate_label"]}
                      rules={[
                        {
                          required: true
                          //message: t("general.validation.required"),
                        }
                      ]}
                    >
                      <Input />
                    </Form.Item>
                    <Form.Item
                      label={t("jobs.fields.rate_laa")}
                      key={`${index}rate_laa`}
                      name={[field.name, "rate_laa"]}
                      rules={[
                        {
                          required: true
                          //message: t("general.validation.required"),
                        }
                      ]}
                    >
                      <CurrencyInput min={0} />
                    </Form.Item>
                    <Form.Item
                      label={t("jobs.fields.rate_lab")}
                      key={`${index}rate_lab`}
                      name={[field.name, "rate_lab"]}
                      rules={[
                        {
                          required: true
                          //message: t("general.validation.required"),
                        }
                      ]}
                    >
                      <CurrencyInput min={0} />
                    </Form.Item>
                    <Form.Item
                      label={t("jobs.fields.rate_lad")}
                      key={`${index}rate_lad`}
                      name={[field.name, "rate_lad"]}
                      rules={[
                        {
                          required: true
                          //message: t("general.validation.required"),
                        }
                      ]}
                    >
                      <CurrencyInput min={0} />
                    </Form.Item>
                    <Form.Item
                      label={t("jobs.fields.rate_lae")}
                      key={`${index}rate_lae`}
                      name={[field.name, "rate_lae"]}
                      rules={[
                        {
                          required: true
                          //message: t("general.validation.required"),
                        }
                      ]}
                    >
                      <CurrencyInput min={0} />
                    </Form.Item>
                    <Form.Item
                      label={t("jobs.fields.rate_laf")}
                      key={`${index}rate_laf`}
                      name={[field.name, "rate_laf"]}
                      rules={[
                        {
                          required: true
                          //message: t("general.validation.required"),
                        }
                      ]}
                    >
                      <CurrencyInput min={0} />
                    </Form.Item>
                    <Form.Item
                      label={t("jobs.fields.rate_lag")}
                      key={`${index}rate_lag`}
                      name={[field.name, "rate_lag"]}
                      rules={[
                        {
                          required: true
                          //message: t("general.validation.required"),
                        }
                      ]}
                    >
                      <CurrencyInput min={0} />
                    </Form.Item>
                    <Form.Item
                      label={t("jobs.fields.rate_lam")}
                      key={`${index}rate_lam`}
                      name={[field.name, "rate_lam"]}
                      rules={[
                        {
                          required: true
                          //message: t("general.validation.required"),
                        }
                      ]}
                    >
                      <CurrencyInput min={0} />
                    </Form.Item>
                    <Form.Item
                      label={t("jobs.fields.rate_lar")}
                      key={`${index}rate_lar`}
                      name={[field.name, "rate_lar"]}
                      rules={[
                        {
                          required: true
                          //message: t("general.validation.required"),
                        }
                      ]}
                    >
                      <CurrencyInput min={0} />
                    </Form.Item>
                    <Form.Item
                      label={t("jobs.fields.rate_las")}
                      key={`${index}rate_las`}
                      name={[field.name, "rate_las"]}
                      rules={[
                        {
                          required: true
                          //message: t("general.validation.required"),
                        }
                      ]}
                    >
                      <CurrencyInput min={0} />
                    </Form.Item>
                    <Form.Item
                      label={t("jobs.fields.rate_la1")}
                      key={`${index}rate_la1`}
                      name={[field.name, "rate_la1"]}
                      rules={[
                        {
                          required: true
                          //message: t("general.validation.required"),
                        }
                      ]}
                    >
                      <CurrencyInput min={0} />
                    </Form.Item>
                    <Form.Item
                      label={t("jobs.fields.rate_la2")}
                      key={`${index}rate_la2`}
                      name={[field.name, "rate_la2"]}
                      rules={[
                        {
                          required: true
                          //message: t("general.validation.required"),
                        }
                      ]}
                    >
                      <CurrencyInput min={0} />
                    </Form.Item>
                    <Form.Item
                      label={t("jobs.fields.rate_la3")}
                      key={`${index}rate_la3`}
                      name={[field.name, "rate_la3"]}
                      rules={[
                        {
                          required: true
                          //message: t("general.validation.required"),
                        }
                      ]}
                    >
                      <CurrencyInput min={0} />
                    </Form.Item>
                    <Form.Item
                      label={t("jobs.fields.rate_la4")}
                      key={`${index}rate_la4`}
                      name={[field.name, "rate_la4"]}
                      rules={[
                        {
                          required: true
                          //message: t("general.validation.required"),
                        }
                      ]}
                    >
                      <CurrencyInput min={0} />
                    </Form.Item>
                    <Form.Item
                      label={t("jobs.fields.rate_mash")}
                      key={`${index}rate_mash`}
                      name={[field.name, "rate_mash"]}
                      rules={[
                        {
                          required: true
                          //message: t("general.validation.required"),
                        }
                      ]}
                    >
                      <CurrencyInput min={0} />
                    </Form.Item>
                    <Form.Item
                      label={t("jobs.fields.rate_mapa")}
                      key={`${index}rate_mapa`}
                      name={[field.name, "rate_mapa"]}
                      rules={[
                        {
                          required: true
                          //message: t("general.validation.required"),
                        }
                      ]}
                    >
                      <CurrencyInput min={0} />
                    </Form.Item>
                    <Form.Item
                      label={t("jobs.fields.rate_ma2s")}
                      key={`${index}rate_ma2s`}
                      name={[field.name, "rate_ma2s"]}
                      rules={[
                        {
                          required: true
                          //message: t("general.validation.required"),
                        }
                      ]}
                    >
                      <CurrencyInput min={0} />
                    </Form.Item>
                    <Form.Item
                      label={t("jobs.fields.rate_ma3s")}
                      key={`${index}rate_ma3s`}
                      name={[field.name, "rate_ma3s"]}
                      rules={[
                        {
                          required: true
                          //message: t("general.validation.required"),
                        }
                      ]}
                    >
                      <CurrencyInput min={0} />
                    </Form.Item>
                    {
                      // <Form.Item
                      //   label={t("jobs.fields.rate_mabl")}
                      //   key={`${index}rate_mabl`}
                      //   name={[field.name, "rate_mabl"]}
                      //   rules={[
                      //     {
                      //       required: true,
                      //       //message: t("general.validation.required"),
                      //     },
                      //   ]}
                      // >
                      //   <CurrencyInput min={0} />
                      // </Form.Item>
                      // <Form.Item
                      //   label={t("jobs.fields.rate_macs")}
                      //   key={`${index}rate_macs`}
                      //   name={[field.name, "rate_macs"]}
                      //   rules={[
                      //     {
                      //       required: true,
                      //       //message: t("general.validation.required"),
                      //     },
                      //   ]}
                      // >
                      //   <CurrencyInput min={0} />
                      // </Form.Item>
                    }
                    <Form.Item
                      label={t("jobs.fields.rate_matd")}
                      key={`${index}rate_matd`}
                      name={[field.name, "rate_matd"]}
                      rules={[
                        {
                          required: true
                          //message: t("general.validation.required"),
                        }
                      ]}
                    >
                      <CurrencyInput min={0} />
                    </Form.Item>
                    <Form.Item
                      label={t("jobs.fields.rate_mahw")}
                      key={`${index}rate_mahw`}
                      name={[field.name, "rate_mahw"]}
                      rules={[
                        {
                          required: true
                          //message: t("general.validation.required"),
                        }
                      ]}
                    >
                      <CurrencyInput min={0} />
                    </Form.Item>
                    <DeleteFilled
                      onClick={() => {
                        remove(field.name);
                      }}
                    />
                    <FormListMoveArrows move={move} index={index} total={fields.rate_length} />
                  </LayoutFormRow>
                </Form.Item>
              ))}
              <Form.Item>
                <Button
                  type="dashed"
                  onClick={() => {
                    add();
                  }}
                  style={{ width: "100%" }}
                >
                  {t("bodyshop.actions.newlaborrate")}
                </Button>
              </Form.Item>
            </div>
          );
        }}
      </Form.List>
    </div>
  );
}
