122 lines
3.4 KiB
JavaScript
122 lines
3.4 KiB
JavaScript
import { Button, Table, Col , Checkbox} from "antd";
|
|
import React, { useState } from "react";
|
|
import { useTranslation } from "react-i18next";
|
|
import { connect } from "react-redux";
|
|
import { createStructuredSelector } from "reselect";
|
|
import { socket } from "../../pages/dms/dms.container";
|
|
import { selectBodyshop } from "../../redux/user/user.selectors";
|
|
import { alphaSort } from "../../utils/sorters";
|
|
|
|
const mapStateToProps = createStructuredSelector({
|
|
bodyshop: selectBodyshop,
|
|
});
|
|
const mapDispatchToProps = (dispatch) => ({
|
|
//setUserLanguage: language => dispatch(setUserLanguage(language))
|
|
});
|
|
export default connect(
|
|
mapStateToProps,
|
|
mapDispatchToProps
|
|
)(DmsCustomerSelector);
|
|
|
|
export function DmsCustomerSelector({ bodyshop }) {
|
|
const { t } = useTranslation();
|
|
const [customerList, setcustomerList] = useState([]);
|
|
const [visible, setVisible] = useState(false);
|
|
const [selectedCustomer, setSelectedCustomer] = useState(null);
|
|
|
|
socket.on("cdk-select-customer", (customerList, callback) => {
|
|
setVisible(true);
|
|
setcustomerList(customerList);
|
|
});
|
|
|
|
const onUseSelected = () => {
|
|
setVisible(false);
|
|
socket.emit("cdk-selected-customer", selectedCustomer);
|
|
setSelectedCustomer(null);
|
|
};
|
|
|
|
const onUseGeneric = () => {
|
|
setVisible(false);
|
|
socket.emit(
|
|
"cdk-selected-customer",
|
|
bodyshop.cdk_configuration.generic_customer_number
|
|
);
|
|
setSelectedCustomer(null);
|
|
};
|
|
|
|
const onCreateNew = () => {
|
|
setVisible(false);
|
|
socket.emit("cdk-selected-customer", null);
|
|
setSelectedCustomer(null);
|
|
};
|
|
|
|
const columns = [
|
|
{
|
|
title: t("jobs.fields.dms.id"),
|
|
dataIndex: ["id", "value"],
|
|
key: "id",
|
|
},
|
|
{
|
|
title: t("jobs.fields.dms.vinowner"),
|
|
dataIndex: "vinOwner",
|
|
key: "vinOwner",
|
|
render: (text, record) => <Checkbox disabled checked={record.vinOwner}/>
|
|
},
|
|
{
|
|
title: t("jobs.fields.dms.name1"),
|
|
dataIndex: ["name1", "fullName"],
|
|
key: "name1",
|
|
sorter: (a, b) => alphaSort(a.name1?.fullName, b.name1?.fullName),
|
|
},
|
|
|
|
{
|
|
title: t("jobs.fields.dms.address"),
|
|
//dataIndex: ["name2", "fullName"],
|
|
key: "address",
|
|
render: (record, value) =>
|
|
`${record?.address?.addressLine[0]}, ${record.address?.city} ${record.address?.stateOrProvince} ${record.address?.postalCode}`,
|
|
},
|
|
];
|
|
|
|
if (!visible) return <></>;
|
|
return (
|
|
<Col span={24}>
|
|
<Table
|
|
title={() => (
|
|
<div>
|
|
<Button onClick={onUseSelected} disabled={!selectedCustomer}>
|
|
{t("jobs.actions.dms.useselected")}
|
|
</Button>
|
|
<Button
|
|
onClick={onUseGeneric}
|
|
disabled={
|
|
!(
|
|
bodyshop.cdk_configuration &&
|
|
bodyshop.cdk_configuration.generic_customer_number
|
|
)
|
|
}
|
|
>
|
|
{t("jobs.actions.dms.usegeneric")}
|
|
</Button>
|
|
<Button onClick={onCreateNew}>
|
|
{t("jobs.actions.dms.createnewcustomer")}
|
|
</Button>
|
|
</div>
|
|
)}
|
|
pagination={{ position: "top" }}
|
|
columns={columns}
|
|
rowKey={(record) => record.id.value}
|
|
dataSource={customerList}
|
|
//onChange={handleTableChange}
|
|
rowSelection={{
|
|
onSelect: (props) => {
|
|
setSelectedCustomer(props.id.value);
|
|
},
|
|
type: "radio",
|
|
selectedRowKeys: [selectedCustomer],
|
|
}}
|
|
/>
|
|
</Col>
|
|
);
|
|
}
|