import { Form, Input, InputNumber, Select, Space, Switch, Tooltip } 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 CABCpvrtCalculator from "../ca-bc-pvrt-calculator/ca-bc-pvrt-calculator.component";
import CurrencyInput from "../form-items-formatted/currency-form-item.component";
import JobsDetailRatesChangeButton from "../jobs-detail-rates-change-button/jobs-detail-rates-change-button.component";
import FormRow from "../layout-form-row/layout-form-row.component";
import JobsDetailRatesParts from "./jobs-detail-rates.parts.component";

const mapStateToProps = createStructuredSelector({
  jobRO: selectJobReadOnly,
});

export function JobsDetailRates({ jobRO, form, job }) {
  const { t } = useTranslation();
  return (
    <div>
      <FormRow>
        <Form.Item label={t("jobs.fields.class")} name="class">
          <Select disabled={true} />
        </Form.Item>
        <Form.Item
          label={t("jobs.fields.depreciation_taxes")}
          name="depreciation_taxes"
        >
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        <Tooltip title={t("jobs.labels.ca_gst_all_if_null")}>
          <Form.Item
            label={t("jobs.fields.ca_customer_gst")}
            name="ca_customer_gst"
          >
            <CurrencyInput
              disabled={jobRO}
              max={
                Math.round(
                  (job.job_totals &&
                    job.job_totals.totals.federal_tax.amount) ||
                    0
                ) / 100
              }
            />
          </Form.Item>
        </Tooltip>
        <Form.Item
          label={t("jobs.fields.other_amount_payable")}
          name="other_amount_payable"
        >
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        <Form.Item
          label={t("jobs.fields.towing_payable")}
          name="towing_payable"
        >
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        <Form.Item
          label={t("jobs.fields.storage_payable")}
          name="storage_payable"
        >
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        <Form.Item
          label={t("jobs.fields.adjustment_bottom_line")}
          name="adjustment_bottom_line"
        >
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        <Space align="end">
          <Form.Item label={t("jobs.fields.ca_bc_pvrt")} name="ca_bc_pvrt">
            <CurrencyInput disabled={jobRO} />
          </Form.Item>
          <CABCpvrtCalculator form={form} disabled={jobRO} />
        </Space>
      </FormRow>
      <FormRow>
        <Form.Item
          label={t("jobs.fields.federal_tax_rate")}
          name="federal_tax_rate"
        >
          <InputNumber min={0} max={1} precision={2} disabled={jobRO} />
        </Form.Item>
        <Form.Item
          label={t("jobs.fields.state_tax_rate")}
          name="state_tax_rate"
        >
          <InputNumber min={0} max={1} precision={2} disabled={jobRO} />
        </Form.Item>
        <Form.Item
          label={t("jobs.fields.local_tax_rate")}
          name="local_tax_rate"
        >
          <InputNumber min={0} max={1} precision={2} disabled={jobRO} />
        </Form.Item>
        <Form.Item
          label={t("jobs.fields.ca_gst_registrant")}
          name="ca_gst_registrant"
          valuePropName="checked"
        >
          <Switch disabled={jobRO} />
        </Form.Item>
      </FormRow>
      <JobsDetailRatesChangeButton form={form} disabled={jobRO} />
      <FormRow header={t("jobs.forms.laborrates")}>
        <Form.Item
          label={t("jobs.fields.labor_rate_desc")}
          name="labor_rate_desc"
        >
          <Input disabled={jobRO} />
        </Form.Item>
        <Form.Item label={t("jobs.fields.rate_laa")} name="rate_laa">
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        <Form.Item label={t("jobs.fields.rate_lab")} name="rate_lab">
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        <Form.Item label={t("jobs.fields.rate_lad")} name="rate_lad">
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        <Form.Item label={t("jobs.fields.rate_lae")} name="rate_lae">
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        <Form.Item label={t("jobs.fields.rate_lar")} name="rate_lar">
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        <Form.Item label={t("jobs.fields.rate_las")} name="rate_las">
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        <Form.Item label={t("jobs.fields.rate_laf")} name="rate_laf">
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        <Form.Item label={t("jobs.fields.rate_lam")} name="rate_lam">
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        <Form.Item label={t("jobs.fields.rate_lag")} name="rate_lag">
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        <Form.Item label={t("jobs.fields.rate_la1")} name="rate_la1">
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        <Form.Item label={t("jobs.fields.rate_la2")} name="rate_la2">
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        <Form.Item label={t("jobs.fields.rate_la3")} name="rate_la3">
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        <Form.Item label={t("jobs.fields.rate_la4")} name="rate_la4">
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        <Form.Item label={t("jobs.fields.rate_lau")} name="rate_lau">
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        <Form.Item label={t("jobs.fields.rate_mapa")} name="rate_mapa">
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        <Form.Item label={t("jobs.fields.rate_mash")} name="rate_mash">
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        <Form.Item label={t("jobs.fields.rate_mahw")} name="rate_mahw">
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        <Form.Item label={t("jobs.fields.rate_ma2s")} name="rate_ma2s">
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        <Form.Item label={t("jobs.fields.rate_ma3s")} name="rate_ma3s">
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
        {
          // <Form.Item label={t("jobs.fields.rate_mabl")} name="rate_mabl">
          //   <CurrencyInput disabled={jobRO} />
          // </Form.Item>
          // <Form.Item label={t("jobs.fields.rate_macs")} name="rate_macs">
          //   <CurrencyInput disabled={jobRO} />
          // </Form.Item>
        }
        <Form.Item label={t("jobs.fields.rate_matd")} name="rate_matd">
          <CurrencyInput disabled={jobRO} />
        </Form.Item>
      </FormRow>

      <JobsDetailRatesParts form={form} />
    </div>
  );
}
export default connect(mapStateToProps, null)(JobsDetailRates);