import { WarningFilled } from "@ant-design/icons";
import { Form, Input, InputNumber, Space } from "antd";
import { useTranslation } from "react-i18next";
import { DateFormatter } from "../../utils/DateFormatter";
import dayjs from "../../utils/day";
//import ContractLicenseDecodeButton from "../contract-license-decode-button/contract-license-decode-button.component";
import ContractStatusSelector from "../contract-status-select/contract-status-select.component";
import ContractsRatesChangeButton from "../contracts-rates-change-button/contracts-rates-change-button.component";
import CourtesyCarFuelSlider from "../courtesy-car-fuel-select/courtesy-car-fuel-select.component";
import {
  default as DateTimePicker,
  default as FormDateTimePicker
} from "../form-date-time-picker/form-date-time-picker.component";
import FormFieldsChanged from "../form-fields-changed-alert/form-fields-changed-alert.component";
import InputPhone, { PhoneItemFormatterValidation } from "../form-items-formatted/phone-form-item.component";
import LayoutFormRow from "../layout-form-row/layout-form-row.component";
import ContractFormJobPrefill from "./contract-form-job-prefill.component";

export default function ContractFormComponent({ form, create = false, selectedJobState, selectedCar }) {
  const { t } = useTranslation();
  return (
    <>
      {!create && <FormFieldsChanged form={form} />}
      <LayoutFormRow>
        {!create && (
          <Form.Item
            label={t("contracts.fields.status")}
            name="status"
            rules={[
              {
                required: true
                //message: t("general.validation.required"),
              }
            ]}
          >
            <ContractStatusSelector />
          </Form.Item>
        )}
        <Form.Item
          label={t("contracts.fields.start")}
          name="start"
          rules={[
            {
              required: true
              //message: t("general.validation.required"),
            }
          ]}
        >
          <FormDateTimePicker />
        </Form.Item>
        <Form.Item label={t("contracts.fields.scheduledreturn")} name="scheduledreturn">
          <FormDateTimePicker />
        </Form.Item>
        {!create && (
          <Form.Item label={t("contracts.fields.actualreturn")} name="actualreturn">
            <FormDateTimePicker />
          </Form.Item>
        )}
        {create && (
          <Form.Item shouldUpdate={(p, c) => p.scheduledreturn !== c.scheduledreturn}>
            {() => {
              const insuranceOver =
                selectedCar &&
                selectedCar.insuranceexpires &&
                dayjs(selectedCar.insuranceexpires)
                  .endOf("day")
                  .isBefore(dayjs(form.getFieldValue("scheduledreturn")));
              if (insuranceOver)
                return (
                  <Space direction="vertical" style={{ color: "tomato" }}>
                    <span>
                      <WarningFilled style={{ marginRight: ".3rem" }} />
                      {t("contracts.labels.insuranceexpired")}
                    </span>
                  </Space>
                );
              return <></>;
            }}
          </Form.Item>
        )}
      </LayoutFormRow>
      <LayoutFormRow grow>
        <Form.Item
          label={t("contracts.fields.kmstart")}
          name="kmstart"
          rules={[
            {
              required: true
              //message: t("general.validation.required"),
            }
          ]}
        >
          <InputNumber />
        </Form.Item>
        {create && (
          <Form.Item shouldUpdate={(p, c) => p.kmstart !== c.kmstart || p.scheduledreturn !== c.scheduledreturn}>
            {() => {
              const mileageOver =
                selectedCar && selectedCar.nextservicekm
                  ? selectedCar.nextservicekm <= form.getFieldValue("kmstart")
                  : false;
              const dueForService =
                selectedCar &&
                selectedCar.nextservicedate &&
                dayjs(selectedCar.nextservicedate)
                  .endOf("day")
                  .isSameOrBefore(dayjs(form.getFieldValue("scheduledreturn")));
              if (mileageOver || dueForService)
                return (
                  <Space direction="vertical" style={{ color: "tomato" }}>
                    <span>
                      <WarningFilled style={{ marginRight: ".3rem" }} />
                      {t("contracts.labels.cardueforservice")}
                    </span>
                    <span>{`${selectedCar && selectedCar.nextservicekm} km`}</span>
                    <span>
                      <DateFormatter>{selectedCar && selectedCar.nextservicedate}</DateFormatter>
                    </span>
                  </Space>
                );

              return <></>;
            }}
          </Form.Item>
        )}
        {!create && (
          <Form.Item label={t("contracts.fields.kmend")} name="kmend">
            <InputNumber />
          </Form.Item>
        )}
        <Form.Item label={t("contracts.fields.damage")} name="damage">
          <Input.TextArea />
        </Form.Item>
      </LayoutFormRow>
      <LayoutFormRow grow>
        <Form.Item
          label={t("contracts.fields.fuelout")}
          name="fuelout"
          span={8}
          rules={[
            {
              required: true
              //message: t("general.validation.required"),
            }
          ]}
        >
          <CourtesyCarFuelSlider />
        </Form.Item>
        {!create && (
          <Form.Item label={t("contracts.fields.fuelin")} name="fuelin" span={8}>
            <CourtesyCarFuelSlider />
          </Form.Item>
        )}
      </LayoutFormRow>
      <LayoutFormRow header={t("contracts.labels.driverinformation")}>
        <Space wrap>
          {create && selectedJobState && (
            <ContractFormJobPrefill jobId={selectedJobState && selectedJobState[0]} form={form} />
          )}
          {/* {<ContractLicenseDecodeButton form={form} />} */}
        </Space>
      </LayoutFormRow>
      <LayoutFormRow noDivider={true}>
        <Form.Item
          label={t("contracts.fields.driver_dlnumber")}
          name="driver_dlnumber"
          rules={[
            {
              required: true
              //message: t("general.validation.required"),
            }
          ]}
        >
          <Input />
        </Form.Item>
        <Form.Item
          shouldUpdate={(p, c) => p.driver_dlexpiry !== c.driver_dlexpiry || p.scheduledreturn !== c.scheduledreturn}
        >
          {() => {
            const dlExpiresBeforeReturn = dayjs(form.getFieldValue("driver_dlexpiry")).isBefore(
              dayjs(form.getFieldValue("scheduledreturn"))
            );
            return (
              <>
                <Form.Item
                  label={t("contracts.fields.driver_dlexpiry")}
                  name="driver_dlexpiry"
                  rules={[
                    {
                      required: true
                      //message: t("general.validation.required"),
                    }
                  ]}
                >
                  <DateTimePicker isDateOnly />
                </Form.Item>
                {dlExpiresBeforeReturn && (
                  <Space style={{ color: "tomato" }}>
                    <WarningFilled />
                    <span>{t("contracts.labels.dlexpirebeforereturn")}</span>
                  </Space>
                )}
              </>
            );
          }}
        </Form.Item>
        <Form.Item label={t("contracts.fields.driver_dlst")} name="driver_dlst">
          <Input />
        </Form.Item>
        <Form.Item
          label={t("contracts.fields.driver_fn")}
          name="driver_fn"
          rules={[
            {
              required: true
              //message: t("general.validation.required"),
            }
          ]}
        >
          <Input />
        </Form.Item>
        <Form.Item
          label={t("contracts.fields.driver_ln")}
          name="driver_ln"
          rules={[
            {
              required: true
              //message: t("general.validation.required"),
            }
          ]}
        >
          <Input />
        </Form.Item>
        <Form.Item
          label={t("contracts.fields.driver_addr1")}
          name="driver_addr1"
          rules={[
            {
              required: true
              //message: t("general.validation.required"),
            }
          ]}
        >
          <Input />
        </Form.Item>
        <Form.Item label={t("contracts.fields.driver_addr2")} name="driver_addr2">
          <Input />
        </Form.Item>
        <Form.Item label={t("contracts.fields.driver_city")} name="driver_city">
          <Input />
        </Form.Item>
        <Form.Item label={t("contracts.fields.driver_state")} name="driver_state">
          <Input />
        </Form.Item>
        <Form.Item label={t("contracts.fields.driver_zip")} name="driver_zip">
          <Input />
        </Form.Item>
        <Form.Item
          label={t("contracts.fields.driver_ph1")}
          name="driver_ph1"
          rules={[
            {
              required: true
              //message: t("general.validation.required"),
            },
            ({ getFieldValue }) => PhoneItemFormatterValidation(getFieldValue, "driver_ph1")
          ]}
        >
          <InputPhone />
        </Form.Item>
        <Form.Item label={t("contracts.fields.driver_dob")} name="driver_dob">
          <DateTimePicker isDateOnly />
        </Form.Item>
      </LayoutFormRow>
      <ContractsRatesChangeButton form={form} />
      <LayoutFormRow header={t("contracts.labels.rates")}>
        <Form.Item label={t("contracts.fields.dailyrate")} name="dailyrate">
          <InputNumber precision={2} />
        </Form.Item>
        <Form.Item label={t("contracts.fields.actax")} name="actax">
          <InputNumber precision={2} />
        </Form.Item>
        <Form.Item label={t("contracts.fields.dailyfreekm")} name="dailyfreekm">
          <InputNumber precision={2} />
        </Form.Item>
        <Form.Item label={t("contracts.fields.refuelcharge")} name="refuelcharge">
          <InputNumber precision={2} />
        </Form.Item>
        <Form.Item label={t("contracts.fields.excesskmrate")} name="excesskmrate">
          <InputNumber precision={2} />
        </Form.Item>
        <Form.Item label={t("contracts.fields.cleanupcharge")} name="cleanupcharge">
          <InputNumber precision={2} />
        </Form.Item>
      </LayoutFormRow>
      <LayoutFormRow>
        <Form.Item label={t("contracts.fields.damagewaiver")} name="damagewaiver">
          <InputNumber precision={2} />
        </Form.Item>
        <Form.Item label={t("contracts.fields.federaltax")} name="federaltax">
          <InputNumber precision={2} />
        </Form.Item>
        <Form.Item label={t("contracts.fields.statetax")} name="statetax">
          <InputNumber precision={2} />
        </Form.Item>
        <Form.Item label={t("contracts.fields.localtax")} name="localtax">
          <InputNumber precision={2} />
        </Form.Item>
        <Form.Item label={t("contracts.fields.coverage")} name="coverage">
          <InputNumber precision={2} />
        </Form.Item>
      </LayoutFormRow>
    </>
  );
}