import { Collapse, Form, Input, InputNumber, Switch } from "antd";
import React from "react";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { selectJobReadOnly } from "../../redux/application/application.selectors";
import LayoutFormRow from "../layout-form-row/layout-form-row.component";
const mapStateToProps = createStructuredSelector({
  jobRO: selectJobReadOnly,
});

export function JobsDetailRatesMaterials({
  jobRO,
  expanded,
  required = true,
  form,
}) {
  const { t } = useTranslation();

  return (
    <Collapse defaultActiveKey={expanded && "rates"}>
      <Collapse.Panel
        forceRender
        header={t("jobs.fields.materials.materials")}
        key="materials"
      >
        <LayoutFormRow header={t("jobs.fields.materials.MAPA")}>
          <Form.Item
            label={t("jobs.fields.materials.cal_maxdlr")}
            name={["materials", "MAPA", "cal_maxdlr"]}
          >
            <InputNumber min={0} precision={2} disabled={jobRO} />
          </Form.Item>
          <Form.Item
            label={t("jobs.fields.materials.cal_opcode")}
            name={["materials", "MAPA", "cal_opcode"]}
          >
            <Input disabled={jobRO} />
          </Form.Item>

          <Form.Item
            label={t("jobs.fields.materials.tax_ind")}
            name={["materials", "MAPA", "tax_ind"]}
            valuePropName="checked"
          >
            <Switch />
          </Form.Item>
          <Form.Item
            label={t("jobs.fields.materials.mat_tx_in1")}
            name={["materials", "MAPA", "mat_tx_in1"]}
            valuePropName="checked"
          >
            <Switch />
          </Form.Item>
          <Form.Item
            label={t("jobs.fields.materials.mat_tx_in2")}
            name={["materials", "MAPA", "mat_tx_in2"]}
            valuePropName="checked"
          >
            <Switch />
          </Form.Item>
          <Form.Item
            label={t("jobs.fields.materials.mat_tx_in3")}
            name={["materials", "MAPA", "mat_tx_in3"]}
            valuePropName="checked"
          >
            <Switch />
          </Form.Item>
          <Form.Item
            label={t("jobs.fields.materials.mat_tx_in4")}
            name={["materials", "MAPA", "mat_tx_in4"]}
            valuePropName="checked"
          >
            <Switch />
          </Form.Item>
          <Form.Item
            label={t("jobs.fields.materials.mat_tx_in5")}
            name={["materials", "MAPA", "mat_tx_in5"]}
            valuePropName="checked"
          >
            <Switch />
          </Form.Item>
        </LayoutFormRow>
        <LayoutFormRow header={t("jobs.fields.materials.MASH")}>
          <Form.Item
            label={t("jobs.fields.materials.cal_maxdlr")}
            name={["materials", "MASH", "cal_maxdlr"]}
          >
            <InputNumber min={0} precision={2} disabled={jobRO} />
          </Form.Item>
          <Form.Item
            label={t("jobs.fields.materials.cal_opcode")}
            name={["materials", "MASH", "cal_opcode"]}
          >
            <Input disabled={jobRO} />
          </Form.Item>

          <Form.Item
            label={t("jobs.fields.materials.tax_ind")}
            name={["materials", "MASH", "tax_ind"]}
            valuePropName="checked"
          >
            <Switch />
          </Form.Item>
          <Form.Item
            label={t("jobs.fields.materials.mat_tx_in1")}
            name={["materials", "MASH", "mat_tx_in1"]}
            valuePropName="checked"
          >
            <Switch />
          </Form.Item>
          <Form.Item
            label={t("jobs.fields.materials.mat_tx_in2")}
            name={["materials", "MASH", "mat_tx_in2"]}
            valuePropName="checked"
          >
            <Switch />
          </Form.Item>
          <Form.Item
            label={t("jobs.fields.materials.mat_tx_in3")}
            name={["materials", "MASH", "mat_tx_in3"]}
            valuePropName="checked"
          >
            <Switch />
          </Form.Item>
          <Form.Item
            label={t("jobs.fields.materials.mat_tx_in4")}
            name={["materials", "MASH", "mat_tx_in4"]}
            valuePropName="checked"
          >
            <Switch />
          </Form.Item>
          <Form.Item
            label={t("jobs.fields.materials.mat_tx_in5")}
            name={["materials", "MASH", "mat_tx_in5"]}
            valuePropName="checked"
          >
            <Switch />
          </Form.Item>
        </LayoutFormRow>
      </Collapse.Panel>
    </Collapse>
  );
}
export default connect(mapStateToProps, null)(JobsDetailRatesMaterials);
