import { DatePicker, Divider, Form, Input } from "antd";
import React from "react";
import { useTranslation } from "react-i18next";
import FormItemEmail from "../form-items-formatted/email-form-item.component";
import FormItemPhone from "../form-items-formatted/phone-form-item.component";

export default function JobsDetailInsurance({ job, form }) {
  const { getFieldValue } = form;
  const { t } = useTranslation();
  //initialValue: job.loss_date ? moment(job.loss_date) : null
  console.log("job", job);
  return (
    <div>
      <Form.Item label={t("jobs.fields.ins_co_id")} name="ins_co_id">
        <Input />
      </Form.Item>
      <Form.Item label={t("jobs.fields.policy_no")} name="policy_no">
        <Input />
      </Form.Item>
      <Form.Item label={t("jobs.fields.clm_no")} name="clm_no">
        <Input />
      </Form.Item>
      <Form.Item label={t("jobs.fields.regie_number")} name="regie_number">
        <Input />
      </Form.Item>
      TODO: missing KOL field???
      <Form.Item label={t("jobs.fields.loss_date")} name="loss_date">
        <DatePicker />
      </Form.Item>
      DAMAGE {JSON.stringify(job.area_of_damage)}
      CAA # seems not correct based on field mapping Class seems not correct
      based on field mapping
      <Form.Item label={t("jobs.fields.ins_co_nm")} name="ins_co_nm">
        <Input />
      </Form.Item>
      <Form.Item label={t("jobs.fields.ins_addr1")} name="ins_addr1">
        <Input />
      </Form.Item>
      <Form.Item label={t("jobs.fields.ins_city")} name="ins_city">
        <Input />
      </Form.Item>
      <Form.Item label={t("jobs.fields.ins_ct_ln")} name="ins_ct_ln">
        <Input />
      </Form.Item>
      <Form.Item label={t("jobs.fields.ins_ct_fn")} name="ins_ct_fn">
        <Input />
      </Form.Item>
      <Form.Item label={t("jobs.fields.ins_ph1")} name="ins_ph1">
        <FormItemPhone customInput={Input} />
      </Form.Item>
      <Form.Item
        label={t("jobs.fields.ins_ea")}
        name="ins_ea"
        rules={[
          {
            type: "email",
            message: "This is not a valid email address."
          }
        ]}
      >
        <FormItemEmail email={getFieldValue("ins_ea")} />
      </Form.Item>
      <Divider />
      Appraiser Info
      <Form.Item label={t("jobs.fields.est_co_nm")} name="est_co_nm">
        <Input />
      </Form.Item>
      <Form.Item label={t("jobs.fields.est_ct_fn")} name="est_ct_fn">
        <Input />
      </Form.Item>
      <Form.Item label={t("jobs.fields.est_ct_ln")} name="est_ct_ln">
        <Input />
      </Form.Item>
      TODO: Field is pay date but title is inspection date. Likely incorrect?
      <Form.Item label={t("jobs.fields.pay_date")} name="pay_date">
        <Input />
      </Form.Item>
      <Form.Item label={t("jobs.fields.est_ph1")} name="est_ph1">
        <Input />
      </Form.Item>
      <Form.Item
        label={t("jobs.fields.est_ea")}
        name="est_ea"
        rules={[
          {
            type: "email",
            message: "This is not a valid email address."
          }
        ]}
      >
        <FormItemEmail email={getFieldValue("est_ea")} />
      </Form.Item>
      <Form.Item label={t("jobs.fields.selling_dealer")} name="selling_dealer">
        <Input />
      </Form.Item>
      <Form.Item
        label={t("jobs.fields.servicing_dealer")}
        name="servicing_dealer"
      >
        <Input />
      </Form.Item>
      <Form.Item
        label={t("jobs.fields.selling_dealer_contact")}
        name="selling_dealer_contact"
      >
        <Input />
      </Form.Item>
      <Form.Item
        label={t("jobs.fields.servicing_dealer_contact")}
        name="servicing_dealer_contact"
      >
        <Input />
      </Form.Item>
      TODO: Adding servicing/selling dealer contact info?
    </div>
  );
}
