STILL BROKEN: Refactored some forms to have bare functionality. Appears that v4 antd has extensive issues.
This commit is contained in:
@@ -1,16 +1,14 @@
|
||||
import { Form, notification } from "antd";
|
||||
import React, { useState } from "react";
|
||||
import { useQuery, useLazyQuery } from "react-apollo";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { useLazyQuery, useQuery } from "react-apollo";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { GET_JOB_LINES_TO_ENTER_INVOICE } from "../../graphql/jobs-lines.queries";
|
||||
import { SEARCH_RO_AUTOCOMPLETE } from "../../graphql/jobs.queries";
|
||||
import { SEARCH_VENDOR_AUTOCOMPLETE } from "../../graphql/vendors.queries";
|
||||
import { toggleModalVisible } from "../../redux/modals/modals.actions";
|
||||
import { selectInvoiceEnterModal } from "../../redux/modals/modals.selectors";
|
||||
import InvoiceEnterModalComponent from "./invoice-enter-modal.component";
|
||||
import { selectBodyshop } from "../../redux/user/user.selectors";
|
||||
import { GET_JOB_LINES_TO_ENTER_INVOICE } from "../../graphql/jobs-lines.queries";
|
||||
import InvoiceEnterModalComponent from "./invoice-enter-modal.component";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
invoiceEnterModal: selectInvoiceEnterModal,
|
||||
@@ -23,10 +21,9 @@ const mapDispatchToProps = dispatch => ({
|
||||
function InvoiceEnterModalContainer({
|
||||
invoiceEnterModal,
|
||||
toggleModalVisible,
|
||||
form,
|
||||
bodyshop
|
||||
}) {
|
||||
const { t } = useTranslation();
|
||||
// const { t } = useTranslation();
|
||||
const linesState = useState([]);
|
||||
const roSearchState = useState({ text: "", selectedId: null });
|
||||
const [roSearch, setRoSearch] = roSearchState;
|
||||
@@ -67,100 +64,81 @@ function InvoiceEnterModalContainer({
|
||||
if (roSearch.selectedId) {
|
||||
if (!called) loadLines();
|
||||
}
|
||||
const handleRoSelect = v => {
|
||||
setRoSearch({ ...roSearch, selectedId: v });
|
||||
const handleRoSelect = (value, obj) => {
|
||||
setRoSearch({ ...roSearch, selectedId: obj.id });
|
||||
};
|
||||
|
||||
const handleVendorSelect = v => {
|
||||
setVendorSearch({ ...vendorSearch, selectedId: v });
|
||||
const handleVendorSelect = (value, obj) => {
|
||||
setVendorSearch({ ...vendorSearch, selectedId: obj.id });
|
||||
};
|
||||
|
||||
const handleSubmit = e => {
|
||||
e.preventDefault();
|
||||
form.validateFieldsAndScroll((err, values) => {
|
||||
if (err) {
|
||||
notification["error"]({
|
||||
message: t("invoices.errors.validation"),
|
||||
description: err.message
|
||||
});
|
||||
}
|
||||
if (!err) {
|
||||
console.log("values", values);
|
||||
alert("Closing this modal.");
|
||||
toggleModalVisible();
|
||||
// if (!jobLineEditModal.context.id) {
|
||||
// insertJobLine({
|
||||
// variables: {
|
||||
// lineInput: [{ jobid: jobLineEditModal.context.jobid, ...values }]
|
||||
// }
|
||||
// })
|
||||
// .then(r => {
|
||||
// if (jobLineEditModal.actions.refetch)
|
||||
// jobLineEditModal.actions.refetch();
|
||||
// toggleModalVisible();
|
||||
// notification["success"]({
|
||||
// message: t("joblines.successes.created")
|
||||
// });
|
||||
// })
|
||||
// .catch(error => {
|
||||
// notification["error"]({
|
||||
// message: t("joblines.errors.creating", {
|
||||
// message: error.message
|
||||
// })
|
||||
// });
|
||||
// });
|
||||
// } else {
|
||||
// updateJobLine({
|
||||
// variables: {
|
||||
// lineId: jobLineEditModal.context.id,
|
||||
// line: values
|
||||
// }
|
||||
// })
|
||||
// .then(r => {
|
||||
// notification["success"]({
|
||||
// message: t("joblines.successes.updated")
|
||||
// });
|
||||
// })
|
||||
// .catch(error => {
|
||||
// notification["success"]({
|
||||
// message: t("joblines.errors.updating", {
|
||||
// message: error.message
|
||||
// })
|
||||
// });
|
||||
// });
|
||||
// if (jobLineEditModal.actions.refetch)
|
||||
// jobLineEditModal.actions.refetch();
|
||||
// toggleModalVisible();
|
||||
// }
|
||||
}
|
||||
});
|
||||
const handleFinish = values => {
|
||||
alert("Closing this modal.");
|
||||
toggleModalVisible();
|
||||
// if (!jobLineEditModal.context.id) {
|
||||
// insertJobLine({
|
||||
// variables: {
|
||||
// lineInput: [{ jobid: jobLineEditModal.context.jobid, ...values }]
|
||||
// }
|
||||
// })
|
||||
// .then(r => {
|
||||
// if (jobLineEditModal.actions.refetch)
|
||||
// jobLineEditModal.actions.refetch();
|
||||
// toggleModalVisible();
|
||||
// notification["success"]({
|
||||
// message: t("joblines.successes.created")
|
||||
// });
|
||||
// })
|
||||
// .catch(error => {
|
||||
// notification["error"]({
|
||||
// message: t("joblines.errors.creating", {
|
||||
// message: error.message
|
||||
// })
|
||||
// });
|
||||
// });
|
||||
// } else {
|
||||
// updateJobLine({
|
||||
// variables: {
|
||||
// lineId: jobLineEditModal.context.id,
|
||||
// line: values
|
||||
// }
|
||||
// })
|
||||
// .then(r => {
|
||||
// notification["success"]({
|
||||
// message: t("joblines.successes.updated")
|
||||
// });
|
||||
// })
|
||||
// .catch(error => {
|
||||
// notification["success"]({
|
||||
// message: t("joblines.errors.updating", {
|
||||
// message: error.message
|
||||
// })
|
||||
// });
|
||||
// });
|
||||
// if (jobLineEditModal.actions.refetch)
|
||||
// jobLineEditModal.actions.refetch();
|
||||
// toggleModalVisible();
|
||||
// }
|
||||
};
|
||||
|
||||
const handleCancel = () => {
|
||||
toggleModalVisible();
|
||||
};
|
||||
|
||||
console.log(
|
||||
"c",
|
||||
VendorAutoCompleteData?.vendors.filter(
|
||||
v => v.id === vendorSearch.selectedId
|
||||
)
|
||||
);
|
||||
return (
|
||||
<InvoiceEnterModalComponent
|
||||
visible={invoiceEnterModal.visible}
|
||||
invoice={invoiceEnterModal.context}
|
||||
handleSubmit={handleSubmit}
|
||||
handleFinish={handleFinish}
|
||||
handleCancel={handleCancel}
|
||||
form={form}
|
||||
handleRoAutoComplete={handleRoAutoComplete}
|
||||
handleRoSelect={handleRoSelect}
|
||||
roAutoCompleteOptions={
|
||||
RoAutoCompleteData
|
||||
? RoAutoCompleteData.jobs.reduce((acc, value) => {
|
||||
acc.push({
|
||||
value: value.id,
|
||||
text: `${value.ro_number || ""} | ${value.ownr_ln ||
|
||||
id: value.id,
|
||||
value: `${value.ro_number || ""} | ${value.ownr_ln ||
|
||||
""} ${value.ownr_fn || ""} | ${value.vehicle.v_model_yr ||
|
||||
""} ${value.vehicle.v_make_desc || ""} ${value.vehicle
|
||||
.v_model_desc || ""}`
|
||||
@@ -175,8 +153,8 @@ function InvoiceEnterModalContainer({
|
||||
VendorAutoCompleteData
|
||||
? VendorAutoCompleteData.vendors.reduce((acc, value) => {
|
||||
acc.push({
|
||||
value: value.id,
|
||||
text: `${value.name || ""}`
|
||||
id: value.id,
|
||||
value: `${value.name || ""}`
|
||||
});
|
||||
return acc;
|
||||
}, [])
|
||||
@@ -198,8 +176,4 @@ function InvoiceEnterModalContainer({
|
||||
export default connect(
|
||||
mapStateToProps,
|
||||
mapDispatchToProps
|
||||
)(
|
||||
Form.create({ name: "InvoiceEnterModalContainer" })(
|
||||
InvoiceEnterModalContainer
|
||||
)
|
||||
);
|
||||
)(InvoiceEnterModalContainer);
|
||||
|
||||
Reference in New Issue
Block a user