import { Form, Input, InputNumber, Modal, Select, Switch } from "antd";
import React, { useEffect } from "react";
import { useTranslation } from "react-i18next";
import InputCurrency from "../form-items-formatted/currency-form-item.component";
import LayoutFormRow from "../layout-form-row/layout-form-row.component";
import JoblinesPreset from "../job-lines-preset-button/job-lines-preset-button.component";
import { useTreatments } from "@splitsoftware/splitio-react";

import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { selectBodyshop } from "../../redux/user/user.selectors";
const mapStateToProps = createStructuredSelector({
  bodyshop: selectBodyshop,
});
const mapDispatchToProps = (dispatch) => ({
  //setUserLanguage: language => dispatch(setUserLanguage(language))
});
export default connect(
  mapStateToProps,
  mapDispatchToProps
)(JobLinesUpsertModalComponent);

export function JobLinesUpsertModalComponent({
  bodyshop,
  visible,
  jobLine,
  handleCancel,
  handleFinish,
  loading,
}) {
  const { t } = useTranslation();
  const [form] = Form.useForm();

  useEffect(() => {
    form.resetFields();
  }, [visible, form]);

  const { Allow_Negative_Jobline_Price } = useTreatments(
    ["Allow_Negative_Jobline_Price"],
    {},
    bodyshop.imexshopid
  );

  return (
    <Modal
      title={
        jobLine && jobLine.id
          ? t("joblines.labels.edit")
          : t("joblines.labels.new")
      }
      forceRender
      visible={visible}
      width="60%"
      okText={t("general.actions.save")}
      onOk={() => form.submit()}
      okButtonProps={{ loading: loading }}
      onCancel={handleCancel}
      e
    >
      <Form
        onFinish={handleFinish}
        initialValues={jobLine}
        layout="vertical"
        autoComplete="off"
        form={form}
      >
        <LayoutFormRow grow>
          <Form.Item label={t("joblines.fields.line_no")} name="line_no">
            <InputNumber />
          </Form.Item>
          <Form.Item
            label={t("joblines.fields.line_desc")}
            rules={[
              {
                required: true,
                //message: t("general.validation.required"),
              },
            ]}
            name="line_desc"
          >
            <Input />
          </Form.Item>
          <JoblinesPreset form={form} />
        </LayoutFormRow>
        <LayoutFormRow grow>
          <Form.Item label={t("joblines.fields.mod_lbr_ty")} name="mod_lbr_ty">
            <Select allowClear>
              <Select.Option value="LAA">
                {t("joblines.fields.lbr_types.LAA")}
              </Select.Option>
              <Select.Option value="LAB">
                {t("joblines.fields.lbr_types.LAB")}
              </Select.Option>
              <Select.Option value="LAD">
                {t("joblines.fields.lbr_types.LAD")}
              </Select.Option>
              <Select.Option value="LAE">
                {t("joblines.fields.lbr_types.LAE")}
              </Select.Option>
              <Select.Option value="LAF">
                {t("joblines.fields.lbr_types.LAF")}
              </Select.Option>
              <Select.Option value="LAG">
                {t("joblines.fields.lbr_types.LAG")}
              </Select.Option>
              <Select.Option value="LAM">
                {t("joblines.fields.lbr_types.LAM")}
              </Select.Option>
              <Select.Option value="LAR">
                {t("joblines.fields.lbr_types.LAR")}
              </Select.Option>
              <Select.Option value="LAS">
                {t("joblines.fields.lbr_types.LAS")}
              </Select.Option>
              <Select.Option value="LAU">
                {t("joblines.fields.lbr_types.LAU")}
              </Select.Option>
              <Select.Option value="LA1">
                {t("joblines.fields.lbr_types.LA1")}
              </Select.Option>
              <Select.Option value="LA2">
                {t("joblines.fields.lbr_types.LA2")}
              </Select.Option>
              <Select.Option value="LA3">
                {t("joblines.fields.lbr_types.LA3")}
              </Select.Option>
              <Select.Option value="LA4">
                {t("joblines.fields.lbr_types.LA4")}
              </Select.Option>
            </Select>
          </Form.Item>
          <Form.Item
            label={t("joblines.fields.op_code_desc")}
            name="op_code_desc"
          >
            <Input />
          </Form.Item>
          <Form.Item
            label={t("joblines.fields.mod_lb_hrs")}
            name="mod_lb_hrs"
            rules={[
              ({ getFieldValue }) => ({
                validator(rule, value) {
                  if (
                    !!getFieldValue("mod_lbr_ty") === (!!value || value === 0)
                  ) {
                    return Promise.resolve();
                  }
                  return Promise.reject(
                    t("joblines.validations.hrsrequirediflbrtyp")
                  );
                },
              }),
            ]}
          >
            <InputNumber precision={1} />
          </Form.Item>
        </LayoutFormRow>
        <LayoutFormRow>
          <Form.Item label={t("joblines.fields.part_type")} name="part_type">
            <Select allowClear>
              <Select.Option value="PAA">
                {t("joblines.fields.part_types.PAA")}
              </Select.Option>
              <Select.Option value="PAC">
                {t("joblines.fields.part_types.PAC")}
              </Select.Option>
              <Select.Option value="PAE">
                {t("joblines.fields.part_types.PAE")}
              </Select.Option>
              <Select.Option value="PAL">
                {t("joblines.fields.part_types.PAL")}
              </Select.Option>
              <Select.Option value="PAM">
                {t("joblines.fields.part_types.PAM")}
              </Select.Option>
              <Select.Option value="PAN">
                {t("joblines.fields.part_types.PAN")}
              </Select.Option>
              <Select.Option value="PAO">
                {t("joblines.fields.part_types.PAO")}
              </Select.Option>
              <Select.Option value="PAR">
                {t("joblines.fields.part_types.PAR")}
              </Select.Option>
              <Select.Option value="PAS">
                {t("joblines.fields.part_types.PAS")}
              </Select.Option>
            </Select>
          </Form.Item>
          <Form.Item label={t("joblines.fields.oem_partno")} name="oem_partno">
            <Input />
          </Form.Item>
          <Form.Item
            label={t("joblines.fields.part_qty")}
            name="part_qty"
            rules={[
              ({ getFieldValue }) => ({
                validator(rule, value) {
                  if (!!getFieldValue("part_type") === !!value) {
                    return Promise.resolve();
                  }
                  return Promise.reject(
                    t("joblines.validations.requiredifparttype")
                  );
                },
              }),
            ]}
          >
            <InputNumber precision={0} min={0} />
          </Form.Item>
          {/* <Form.Item label={t("joblines.fields.db_price")} name="db_price">
            <InputCurrency precision={2} min={0} />
          </Form.Item> */}
          <Form.Item
            label={t("joblines.fields.act_price")}
            name="act_price"
            rules={[
              ({ getFieldValue }) => ({
                validator(rule, value) {
                  console.log(value);
                  if (!value || getFieldValue("part_type") !== "PAE") {
                    return Promise.resolve();
                  }
                  return Promise.reject(
                    t("joblines.validations.zeropriceexistingpart")
                  );
                },
              }),
              ({ getFieldValue }) => ({
                validator(rule, value) {
                  console.log(value, !!value);
                  if (
                    !!getFieldValue("part_type") === (!!value || value === 0)
                  ) {
                    return Promise.resolve();
                  }
                  return Promise.reject(
                    t("joblines.validations.requiredifparttype")
                  );
                },
              }),
            ]}
          >
            <InputCurrency
              precision={2}
              min={Allow_Negative_Jobline_Price.treatment === "on" ? null : 0}
            />
          </Form.Item>
          <Form.Item
            label={t("joblines.fields.prt_dsmk_p")}
            name="prt_dsmk_p"
            initialValue={0}
          >
            <InputNumber precision={0} min={0} max={100} />
          </Form.Item>
          <Form.Item
            label={t("joblines.fields.tax_part")}
            name="tax_part"
            valuePropName="checked"
            initialValue={true}
          >
            <Switch />
          </Form.Item>
        </LayoutFormRow>
      </Form>
    </Modal>
  );
}
