Added barcode scanning to populate contract form BOD-88
This commit is contained in:
@@ -2844,6 +2844,53 @@
|
||||
<folder_node>
|
||||
<name>contracts</name>
|
||||
<children>
|
||||
<folder_node>
|
||||
<name>actions</name>
|
||||
<children>
|
||||
<concept_node>
|
||||
<name>decodelicense</name>
|
||||
<definition_loaded>false</definition_loaded>
|
||||
<description></description>
|
||||
<comment></comment>
|
||||
<default_text></default_text>
|
||||
<translations>
|
||||
<translation>
|
||||
<language>en-US</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>es-MX</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>fr-CA</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
</translations>
|
||||
</concept_node>
|
||||
<concept_node>
|
||||
<name>senddltoform</name>
|
||||
<definition_loaded>false</definition_loaded>
|
||||
<description></description>
|
||||
<comment></comment>
|
||||
<default_text></default_text>
|
||||
<translations>
|
||||
<translation>
|
||||
<language>en-US</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>es-MX</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>fr-CA</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
</translations>
|
||||
</concept_node>
|
||||
</children>
|
||||
</folder_node>
|
||||
<folder_node>
|
||||
<name>errors</name>
|
||||
<children>
|
||||
@@ -3400,6 +3447,53 @@
|
||||
</concept_node>
|
||||
</children>
|
||||
</folder_node>
|
||||
<folder_node>
|
||||
<name>labels</name>
|
||||
<children>
|
||||
<concept_node>
|
||||
<name>correctdataonform</name>
|
||||
<definition_loaded>false</definition_loaded>
|
||||
<description></description>
|
||||
<comment></comment>
|
||||
<default_text></default_text>
|
||||
<translations>
|
||||
<translation>
|
||||
<language>en-US</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>es-MX</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>fr-CA</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
</translations>
|
||||
</concept_node>
|
||||
<concept_node>
|
||||
<name>waitingforscan</name>
|
||||
<definition_loaded>false</definition_loaded>
|
||||
<description></description>
|
||||
<comment></comment>
|
||||
<default_text></default_text>
|
||||
<translations>
|
||||
<translation>
|
||||
<language>en-US</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>es-MX</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>fr-CA</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
</translations>
|
||||
</concept_node>
|
||||
</children>
|
||||
</folder_node>
|
||||
<folder_node>
|
||||
<name>status</name>
|
||||
<children>
|
||||
|
||||
@@ -7,12 +7,12 @@ export default function ContractsCarsComponent({
|
||||
loading,
|
||||
data,
|
||||
selectedCar,
|
||||
handleSelect
|
||||
handleSelect,
|
||||
}) {
|
||||
const [state, setState] = useState({
|
||||
sortedInfo: {},
|
||||
filteredInfo: { text: "" },
|
||||
search: ""
|
||||
search: "",
|
||||
});
|
||||
|
||||
const { t } = useTranslation();
|
||||
@@ -24,7 +24,7 @@ export default function ContractsCarsComponent({
|
||||
key: "fleetnumber",
|
||||
sorter: (a, b) => alphaSort(a.fleetnumber, b.fleetnumber),
|
||||
sortOrder:
|
||||
state.sortedInfo.columnKey === "fleetnumber" && state.sortedInfo.order
|
||||
state.sortedInfo.columnKey === "fleetnumber" && state.sortedInfo.order,
|
||||
},
|
||||
{
|
||||
title: t("courtesycars.fields.status"),
|
||||
@@ -32,21 +32,24 @@ export default function ContractsCarsComponent({
|
||||
key: "status",
|
||||
sorter: (a, b) => alphaSort(a.status, b.status),
|
||||
sortOrder:
|
||||
state.sortedInfo.columnKey === "status" && state.sortedInfo.order
|
||||
state.sortedInfo.columnKey === "status" && state.sortedInfo.order,
|
||||
render: (text, record) => <div>{t(record.status)}</div>,
|
||||
},
|
||||
{
|
||||
title: t("courtesycars.fields.year"),
|
||||
dataIndex: "year",
|
||||
key: "year",
|
||||
sorter: (a, b) => alphaSort(a.year, b.year),
|
||||
sortOrder: state.sortedInfo.columnKey === "year" && state.sortedInfo.order
|
||||
sortOrder:
|
||||
state.sortedInfo.columnKey === "year" && state.sortedInfo.order,
|
||||
},
|
||||
{
|
||||
title: t("courtesycars.fields.make"),
|
||||
dataIndex: "make",
|
||||
key: "make",
|
||||
sorter: (a, b) => alphaSort(a.make, b.make),
|
||||
sortOrder: state.sortedInfo.columnKey === "make" && state.sortedInfo.order
|
||||
sortOrder:
|
||||
state.sortedInfo.columnKey === "make" && state.sortedInfo.order,
|
||||
},
|
||||
{
|
||||
title: t("courtesycars.fields.model"),
|
||||
@@ -54,7 +57,7 @@ export default function ContractsCarsComponent({
|
||||
key: "model",
|
||||
sorter: (a, b) => alphaSort(a.model, b.model),
|
||||
sortOrder:
|
||||
state.sortedInfo.columnKey === "model" && state.sortedInfo.order
|
||||
state.sortedInfo.columnKey === "model" && state.sortedInfo.order,
|
||||
},
|
||||
{
|
||||
title: t("courtesycars.fields.plate"),
|
||||
@@ -62,8 +65,8 @@ export default function ContractsCarsComponent({
|
||||
key: "plate",
|
||||
sorter: (a, b) => alphaSort(a.plate, b.plate),
|
||||
sortOrder:
|
||||
state.sortedInfo.columnKey === "plate" && state.sortedInfo.order
|
||||
}
|
||||
state.sortedInfo.columnKey === "plate" && state.sortedInfo.order,
|
||||
},
|
||||
];
|
||||
|
||||
const handleTableChange = (pagination, filters, sorter) => {
|
||||
@@ -74,7 +77,7 @@ export default function ContractsCarsComponent({
|
||||
state.search === ""
|
||||
? data
|
||||
: data.filter(
|
||||
cc =>
|
||||
(cc) =>
|
||||
(cc.fleetnumber || "")
|
||||
.toLowerCase()
|
||||
.includes(state.search.toLowerCase()) ||
|
||||
@@ -100,19 +103,19 @@ export default function ContractsCarsComponent({
|
||||
<Input.Search
|
||||
placeholder={t("general.labels.search")}
|
||||
value={state.search}
|
||||
onChange={e => setState({ ...state, search: e.target.value })}
|
||||
onChange={(e) => setState({ ...state, search: e.target.value })}
|
||||
/>
|
||||
)}
|
||||
size="small"
|
||||
pagination={{ position: "top" }}
|
||||
columns={columns.map(item => ({ ...item }))}
|
||||
columns={columns.map((item) => ({ ...item }))}
|
||||
rowKey="id"
|
||||
dataSource={filteredData}
|
||||
onChange={handleTableChange}
|
||||
rowSelection={{
|
||||
onSelect: handleSelect,
|
||||
type: "radio",
|
||||
selectedRowKeys: [selectedCar]
|
||||
selectedRowKeys: [selectedCar],
|
||||
}}
|
||||
/>
|
||||
);
|
||||
|
||||
@@ -1,241 +1,255 @@
|
||||
import React, { useState } from "react";
|
||||
import { DatePicker, Form, Input, InputNumber } from "antd";
|
||||
import React from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { Form, Input, DatePicker, InputNumber, Button } from "antd";
|
||||
import aamva from "../../utils/aamva";
|
||||
import InputPhone from "../form-items-formatted/phone-form-item.component";
|
||||
import ContractStatusSelector from "../contract-status-select/contract-status-select.component";
|
||||
import InputPhone from "../form-items-formatted/phone-form-item.component";
|
||||
import LayoutFormRow from "../layout-form-row/layout-form-row.component";
|
||||
|
||||
export default function ContractFormComponent() {
|
||||
const [state, setState] = useState("");
|
||||
export default function ContractFormComponent({ form }) {
|
||||
const { t } = useTranslation();
|
||||
return (
|
||||
<div>
|
||||
<div style={{ background: "#f00" }}>
|
||||
TEST AREA
|
||||
<Input.TextArea
|
||||
//value={state}
|
||||
rows={3}
|
||||
onPressEnter={(e) => {
|
||||
console.log("e", e);
|
||||
setState(e.target.value);
|
||||
}}
|
||||
/>
|
||||
<Button
|
||||
onClick={() => {
|
||||
var res = aamva.parse(state);
|
||||
console.log("Entire object", res);
|
||||
}}>
|
||||
Decode
|
||||
</Button>
|
||||
</div>
|
||||
<LayoutFormRow>
|
||||
<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"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<DatePicker />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.scheduledreturn")}
|
||||
name="scheduledreturn"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<DatePicker />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.actualreturn")}
|
||||
name="actualreturn"
|
||||
>
|
||||
<DatePicker />
|
||||
</Form.Item>
|
||||
</LayoutFormRow>
|
||||
|
||||
<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"),
|
||||
},
|
||||
]}>
|
||||
<DatePicker />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.scheduledreturn")}
|
||||
name='scheduledreturn'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<DatePicker />
|
||||
</Form.Item>
|
||||
<Form.Item label={t("contracts.fields.actualreturn")} name='actualreturn'>
|
||||
<DatePicker />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.kmstart")}
|
||||
name='kmstart'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<InputNumber />
|
||||
</Form.Item>
|
||||
<Form.Item label={t("contracts.fields.kmend")} name='kmend'>
|
||||
<InputNumber />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_dlnumber")}
|
||||
name='driver_dlnumber'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_dlexpiry")}
|
||||
name='driver_dlexpiry'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<DatePicker />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_dlst")}
|
||||
name='driver_dlst'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<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'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_state")}
|
||||
name='driver_state'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_zip")}
|
||||
name='driver_zip'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_ph1")}
|
||||
name='driver_ph1'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<InputPhone />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_dob")}
|
||||
name='driver_dob'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<DatePicker />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.cc_num")}
|
||||
name='cc_num'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.cc_expiry")}
|
||||
name='cc_expiry'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.cc_cardholder")}
|
||||
name='cc_cardholder'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<LayoutFormRow>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.kmstart")}
|
||||
name="kmstart"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<InputNumber />
|
||||
</Form.Item>
|
||||
<Form.Item label={t("contracts.fields.kmend")} name="kmend">
|
||||
<InputNumber />
|
||||
</Form.Item>
|
||||
</LayoutFormRow>
|
||||
<LayoutFormRow>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_dlnumber")}
|
||||
name="driver_dlnumber"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_dlexpiry")}
|
||||
name="driver_dlexpiry"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<DatePicker />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_dlst")}
|
||||
name="driver_dlst"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<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"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_state")}
|
||||
name="driver_state"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_zip")}
|
||||
name="driver_zip"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_ph1")}
|
||||
name="driver_ph1"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<InputPhone />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_dob")}
|
||||
name="driver_dob"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<DatePicker />
|
||||
</Form.Item>
|
||||
</LayoutFormRow>
|
||||
|
||||
<LayoutFormRow>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.cc_num")}
|
||||
name="cc_num"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.cc_expiry")}
|
||||
name="cc_expiry"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.cc_cardholder")}
|
||||
name="cc_cardholder"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
</LayoutFormRow>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,120 @@
|
||||
import { Button, Input, Modal, Typography } from "antd";
|
||||
import moment from "moment";
|
||||
import React, { useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import aamva from "../../utils/aamva";
|
||||
import aamva_npm from "aamva";
|
||||
import DataLabel from "../data-label/data-label.component";
|
||||
import LoadingSkeleton from "../loading-skeleton/loading-skeleton.component";
|
||||
|
||||
export default function ContractLicenseDecodeButton({ form }) {
|
||||
const { t } = useTranslation();
|
||||
const [modalVisible, setModalVisible] = useState(false);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [decodedBarcode, setDecodedBarcode] = useState(null);
|
||||
console.log("form", form);
|
||||
const handleDecode = (e) => {
|
||||
setLoading(true);
|
||||
const aamvaParse = aamva.parse(e.currentTarget.value);
|
||||
console.log("AAMVA", aamvaParse);
|
||||
setDecodedBarcode(aamvaParse);
|
||||
setLoading(false);
|
||||
};
|
||||
const handleInsertForm = () => {
|
||||
const values = {
|
||||
driver_dlnumber: decodedBarcode.dl,
|
||||
driver_dlexpiry: moment(
|
||||
`20${decodedBarcode.expiration_date}${moment(
|
||||
decodedBarcode.birthday
|
||||
).format("DD")}`
|
||||
),
|
||||
driver_dlst: decodedBarcode.state,
|
||||
driver_fn: decodedBarcode.name.first,
|
||||
driver_ln: decodedBarcode.name.last,
|
||||
driver_addr1: decodedBarcode.address,
|
||||
driver_city: decodedBarcode.city,
|
||||
driver_state: decodedBarcode.state,
|
||||
driver_zip: decodedBarcode.postal_code,
|
||||
driver_dob: moment(decodedBarcode.birthday),
|
||||
};
|
||||
|
||||
form.setFieldsValue(values);
|
||||
setModalVisible(false);
|
||||
setDecodedBarcode(null);
|
||||
};
|
||||
const handleClick = () => {
|
||||
setModalVisible(true);
|
||||
};
|
||||
const handleCancel = () => {
|
||||
setModalVisible(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Modal
|
||||
visible={modalVisible}
|
||||
okText={t("contracts.actions.senddltoform")}
|
||||
onOk={handleInsertForm}
|
||||
okButtonProps={{ disabled: !!!decodedBarcode }}
|
||||
onCancel={handleCancel}
|
||||
>
|
||||
<div>
|
||||
<div>
|
||||
<Input
|
||||
autoFocus
|
||||
allowClear
|
||||
onChange={(e) => {
|
||||
if (!loading) setLoading(true);
|
||||
}}
|
||||
onPressEnter={handleDecode}
|
||||
/>
|
||||
</div>
|
||||
<LoadingSkeleton loading={loading}>
|
||||
{decodedBarcode ? (
|
||||
<div>
|
||||
<DataLabel label={t("contracts.fields.driver_dlst")}>
|
||||
{decodedBarcode.state}
|
||||
</DataLabel>
|
||||
<DataLabel label={t("contracts.fields.driver_dlnumber")}>
|
||||
{decodedBarcode.dl}
|
||||
</DataLabel>
|
||||
<DataLabel label={t("contracts.fields.driver_fn")}>
|
||||
{decodedBarcode.name.first}
|
||||
</DataLabel>
|
||||
<DataLabel label={t("contracts.fields.driver_ln")}>
|
||||
{decodedBarcode.name.last}
|
||||
</DataLabel>
|
||||
<DataLabel label={t("contracts.fields.driver_addr1")}>
|
||||
{decodedBarcode.address}
|
||||
</DataLabel>
|
||||
<DataLabel label={t("contracts.fields.driver_addr2")}>
|
||||
{decodedBarcode.address}
|
||||
</DataLabel>
|
||||
<DataLabel label={t("contracts.fields.driver_dlexpiry")}>
|
||||
{moment(
|
||||
`20${decodedBarcode.expiration_date}${moment(
|
||||
decodedBarcode.birthday
|
||||
).format("DD")}`
|
||||
).format("MM/DD/YYYY")}
|
||||
</DataLabel>
|
||||
<DataLabel label={t("contracts.fields.driver_dob")}>
|
||||
{moment(decodedBarcode.birthday).format("MM/DD/YYYY")}
|
||||
</DataLabel>
|
||||
<div>
|
||||
<Typography.Title level={4}>
|
||||
{t("contracts.labels.correctdataonform")}
|
||||
</Typography.Title>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<div>{t("contracts.labels.waitingforscan")}</div>
|
||||
)}
|
||||
</LoadingSkeleton>
|
||||
</div>
|
||||
</Modal>
|
||||
<Button onClick={handleClick}>
|
||||
{t("contracts.actions.decodelicense")}
|
||||
</Button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -1,13 +1,14 @@
|
||||
import React from "react";
|
||||
import ContractFormComponent from "../../components/contract-form/contract-form.component";
|
||||
import { Button } from "antd";
|
||||
import React from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import ContractJobsContainer from "../../components/contract-jobs/contract-jobs.container";
|
||||
import ContractCarsContainer from "../../components/contract-cars/contract-cars.container";
|
||||
|
||||
import ContractFormComponent from "../../components/contract-form/contract-form.component";
|
||||
import ContractJobsContainer from "../../components/contract-jobs/contract-jobs.container";
|
||||
import ContractLicenseDecodeButton from "../../components/contract-license-decode-button/contract-license-decode-button.component";
|
||||
export default function ContractCreatePageComponent({
|
||||
form,
|
||||
selectedJobState,
|
||||
selectedCarState
|
||||
selectedCarState,
|
||||
}) {
|
||||
const { t } = useTranslation();
|
||||
return (
|
||||
@@ -15,7 +16,8 @@ export default function ContractCreatePageComponent({
|
||||
<Button htmlType="submit">{t("general.actions.create")}</Button>
|
||||
<ContractJobsContainer selectedJobState={selectedJobState} />
|
||||
<ContractCarsContainer selectedCarState={selectedCarState} />
|
||||
<ContractFormComponent />
|
||||
<ContractLicenseDecodeButton form={form} />
|
||||
<ContractFormComponent form={form} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -29,8 +29,6 @@ export function ContractCreatePageContainer({ bodyshop, setBreadcrumbs }) {
|
||||
);
|
||||
const [insertContract] = useMutation(INSERT_NEW_CONTRACT);
|
||||
|
||||
console.log("test");
|
||||
|
||||
const handleFinish = (values) => {
|
||||
if (!!selectedCarState[0] && !!selectedJobState[0]) {
|
||||
insertContract({
|
||||
@@ -81,8 +79,14 @@ export function ContractCreatePageContainer({ bodyshop, setBreadcrumbs }) {
|
||||
}, [t, setBreadcrumbs]);
|
||||
|
||||
return (
|
||||
<Form form={form} autoComplete="no" onFinish={handleFinish}>
|
||||
<Form
|
||||
form={form}
|
||||
layout="vertical"
|
||||
autoComplete="no"
|
||||
onFinish={handleFinish}
|
||||
>
|
||||
<ContractCreatePageComponent
|
||||
form={form}
|
||||
selectedJobState={selectedJobState}
|
||||
selectedCarState={selectedCarState}
|
||||
/>
|
||||
|
||||
@@ -7,9 +7,9 @@ import ContractFormComponent from "../../components/contract-form/contract-form.
|
||||
import ContractJobBlock from "../../components/contract-job-block/contract-job-block.component";
|
||||
import { setModalContext } from "../../redux/modals/modals.actions";
|
||||
|
||||
const mapDispatchToProps = dispatch => ({
|
||||
setCourtesyCarReturnModalContext: context =>
|
||||
dispatch(setModalContext({ context: context, modal: "courtesyCarReturn" }))
|
||||
const mapDispatchToProps = (dispatch) => ({
|
||||
setCourtesyCarReturnModalContext: (context) =>
|
||||
dispatch(setModalContext({ context: context, modal: "courtesyCarReturn" })),
|
||||
});
|
||||
|
||||
export function ContractDetailPage({
|
||||
@@ -17,27 +17,30 @@ export function ContractDetailPage({
|
||||
job,
|
||||
courtesyCar,
|
||||
setCourtesyCarReturnModalContext,
|
||||
refetch
|
||||
refetch,
|
||||
}) {
|
||||
const { t } = useTranslation();
|
||||
return (
|
||||
<div>
|
||||
<Row align="middle">
|
||||
<Typography.Title>{`Agreement ${(contract &&
|
||||
contract.agreementnumber) ||
|
||||
""} - ${t((contract && contract.status) || "")}`}</Typography.Title>
|
||||
<Typography.Title>{`Agreement ${
|
||||
(contract && contract.agreementnumber) || ""
|
||||
} - ${t((contract && contract.status) || "")}`}</Typography.Title>
|
||||
<Button type="primary" htmlType="submit">
|
||||
{t("general.actions.save")}
|
||||
</Button>
|
||||
<Button
|
||||
disabled={contract && contract.status !== "contracts.status.out"}
|
||||
disabled={
|
||||
!!!contract ||
|
||||
(contract && contract.status !== "contracts.status.out")
|
||||
}
|
||||
onClick={() => {
|
||||
setCourtesyCarReturnModalContext({
|
||||
actions: { refetch },
|
||||
context: {
|
||||
contractId: contract.id,
|
||||
courtesyCarId: courtesyCar.id
|
||||
}
|
||||
courtesyCarId: courtesyCar.id,
|
||||
},
|
||||
});
|
||||
}}
|
||||
>
|
||||
|
||||
@@ -65,7 +65,7 @@ export function ContractDetailPageContainer({ setBreadcrumbs, addRecentItem }) {
|
||||
`/manage/courtesycars/contracts/${contractId}`
|
||||
)
|
||||
);
|
||||
}, [t, data, error, loading, setBreadcrumbs, addRecentItem]);
|
||||
}, [t, data, error, loading, setBreadcrumbs, addRecentItem, contractId]);
|
||||
|
||||
const handleFinish = (values) => {
|
||||
updateContract({
|
||||
@@ -92,6 +92,7 @@ export function ContractDetailPageContainer({ setBreadcrumbs, addRecentItem }) {
|
||||
<Form
|
||||
form={form}
|
||||
autoComplete="no"
|
||||
layout='vertical'
|
||||
onFinish={handleFinish}
|
||||
initialValues={
|
||||
data
|
||||
|
||||
@@ -60,7 +60,7 @@ export function CourtesyCarDetailPageContainer({
|
||||
`/manage/courtesycars/${ccId}`
|
||||
)
|
||||
);
|
||||
}, [t, data, error, loading, setBreadcrumbs, addRecentItem]);
|
||||
}, [t, data, error, loading, setBreadcrumbs, ccId, addRecentItem]);
|
||||
|
||||
const handleFinish = (values) => {
|
||||
insertCourtesyCar({
|
||||
|
||||
@@ -183,6 +183,10 @@
|
||||
}
|
||||
},
|
||||
"contracts": {
|
||||
"actions": {
|
||||
"decodelicense": "Decode License",
|
||||
"senddltoform": "Insert Driver's License Information"
|
||||
},
|
||||
"errors": {
|
||||
"returning": "Error returning courtesy car. {{error}}",
|
||||
"saving": "Error saving contract. {{error}}",
|
||||
@@ -213,6 +217,10 @@
|
||||
"start": "Contract Start",
|
||||
"status": "Status"
|
||||
},
|
||||
"labels": {
|
||||
"correctdataonform": "Please review the information above. If any of it is not correct, you can fix it later.",
|
||||
"waitingforscan": "Please scan driver's license barcode..."
|
||||
},
|
||||
"status": {
|
||||
"new": "New Contract",
|
||||
"out": "Out",
|
||||
|
||||
@@ -183,6 +183,10 @@
|
||||
}
|
||||
},
|
||||
"contracts": {
|
||||
"actions": {
|
||||
"decodelicense": "",
|
||||
"senddltoform": ""
|
||||
},
|
||||
"errors": {
|
||||
"returning": "",
|
||||
"saving": "",
|
||||
@@ -213,6 +217,10 @@
|
||||
"start": " ",
|
||||
"status": ""
|
||||
},
|
||||
"labels": {
|
||||
"correctdataonform": "",
|
||||
"waitingforscan": ""
|
||||
},
|
||||
"status": {
|
||||
"new": "",
|
||||
"out": "",
|
||||
|
||||
@@ -183,6 +183,10 @@
|
||||
}
|
||||
},
|
||||
"contracts": {
|
||||
"actions": {
|
||||
"decodelicense": "",
|
||||
"senddltoform": ""
|
||||
},
|
||||
"errors": {
|
||||
"returning": "",
|
||||
"saving": "",
|
||||
@@ -213,6 +217,10 @@
|
||||
"start": "",
|
||||
"status": ""
|
||||
},
|
||||
"labels": {
|
||||
"correctdataonform": "",
|
||||
"waitingforscan": ""
|
||||
},
|
||||
"status": {
|
||||
"new": "",
|
||||
"out": "",
|
||||
|
||||
@@ -85,15 +85,17 @@
|
||||
restrictions: res3[6],
|
||||
endorsments: res3[7],
|
||||
sex: (function () {
|
||||
switch (Number(res3[8])) {
|
||||
case 1:
|
||||
switch (res3[8]) {
|
||||
case "1":
|
||||
case "M":
|
||||
return "MALE";
|
||||
|
||||
case 2:
|
||||
case "2":
|
||||
case "F":
|
||||
return "FEMALE";
|
||||
|
||||
default:
|
||||
return "MISSING/INVALID";
|
||||
return res3[8] + ": MISSING/INVALID";
|
||||
}
|
||||
})(),
|
||||
height: res3[9],
|
||||
|
||||
Reference in New Issue
Block a user