Files
bodyshop/client/src/components/jobs-create-vehicle-info/jobs-create-vehicle-info.component.jsx
2021-03-30 17:13:33 -07:00

67 lines
2.0 KiB
JavaScript

import { Checkbox, Col, Row } from "antd";
import React, { useContext } from "react";
import JobCreateContext from "../../pages/jobs-create/jobs-create.context";
import JobsCreateVehicleInfoNewComponent from "./jobs-create-vehicle-info.new.component";
import JobsCreateVehicleInfoSearchComponent from "./jobs-create-vehicle-info.search.component";
import { useTranslation } from "react-i18next";
const colSpan = {
sm: { span: 24 },
lg: { span: 12 },
};
export default function JobsCreateVehicleInfoComponent({ loading, vehicles }) {
const [state, setState] = useContext(JobCreateContext);
const { t } = useTranslation();
return (
<div>
<Row gutter={[16, 16]}>
<Col span={24}>
<Checkbox
defaultChecked={state.vehicle.new}
checked={state.vehicle.new}
onChange={() => {
setState({
...state,
vehicle: {
...state.vehicle,
none: false,
new: !state.vehicle.new,
selectedid: null,
},
});
}}
>
{t("jobs.labels.create.newvehicle")}
</Checkbox>
<Checkbox
defaultChecked={state.vehicle.none}
checked={state.vehicle.none}
onChange={() => {
setState({
...state,
vehicle: {
...state.vehicle,
new: false,
none: !state.vehicle.none,
selectedid: null,
},
});
}}
>
{t("jobs.labels.create.novehicle")}
</Checkbox>
</Col>
<Col {...colSpan}>
<JobsCreateVehicleInfoSearchComponent
loading={loading}
vehicles={vehicles}
/>
</Col>
<Col {...colSpan}>
<JobsCreateVehicleInfoNewComponent />
</Col>
</Row>
</div>
);
}