import { Button, Col, DatePicker, Form, Input, Row } from "antd";
import React from "react";
import { useTranslation } from "react-i18next";
export default function VehicleDetailFormComponent() {
  const { t } = useTranslation();

  return (
    <div>
      <Button type="primary" key="submit" htmlType="submit">
        {t("general.labels.save")}
      </Button>
      <Row>
        <Col span={8}>
          <Form.Item label={t("vehicles.fields.v_vin")} name="v_vin">
            <Input />
          </Form.Item>
          <Form.Item label={t("vehicles.fields.plate_no")} name="plate_no">
            <Input />
          </Form.Item>
          <Form.Item label={t("vehicles.fields.plate_st")} name="plate_st">
            <Input />
          </Form.Item>
          <Form.Item label={t("vehicles.fields.v_type")} name="v_type">
            <Input />
          </Form.Item>
          <Form.Item label={t("vehicles.fields.v_trimcode")} name="v_trimcode">
            <Input />
          </Form.Item>
          <Form.Item label={t("vehicles.fields.v_tone")} name="v_tone">
            <Input />
          </Form.Item>
          <Form.Item label={t("vehicles.fields.v_bstyle")} name="v_bstyle">
            <Input />
          </Form.Item>
        </Col>
        <Col span={8}>
          <Form.Item label={t("vehicles.fields.v_stage")} name="v_stage">
            <Input />
          </Form.Item>
          <Form.Item label={t("vehicles.fields.v_prod_dt")} name="v_prod_dt">
            <DatePicker />
          </Form.Item>
          {
            //TODO Add handling for paint code json
          }
          <Form.Item
            label={t("vehicles.fields.v_paint_codes")}
            name="v_paint_codes"
          >
            <Input />
          </Form.Item>
          <Form.Item label={t("vehicles.fields.v_options")} name="v_options">
            <Input />
          </Form.Item>
          <Form.Item label={t("vehicles.fields.v_model_yr")} name="v_model_yr">
            <Input />
          </Form.Item>
          <Form.Item
            label={t("vehicles.fields.v_model_desc")}
            name="v_model_desc"
          >
            <Input />
          </Form.Item>
          <Form.Item label={t("vehicles.fields.trim_color")} name="trim_color">
            <Input />
          </Form.Item>
        </Col>
        <Col span={8}>
          <Form.Item label={t("vehicles.fields.v_mldgcode")} name="v_mldgcode">
            <Input />
          </Form.Item>
          <Form.Item label={t("vehicles.fields.v_makecode")} name="v_makecode">
            <Input />
          </Form.Item>
          <Form.Item
            label={t("vehicles.fields.v_make_desc")}
            name="v_make_desc"
          >
            <Input />
          </Form.Item>
          <Form.Item label={t("vehicles.fields.v_engine")} name="v_engine">
            <Input />
          </Form.Item>
          <Form.Item label={t("vehicles.fields.v_cond")} name="v_cond">
            <Input />
          </Form.Item>
          <Form.Item label={t("vehicles.fields.v_color")} name="v_color">
            <Input />
          </Form.Item>
        </Col>
      </Row>
    </div>
  );
}
