Merge branch 'feature/IO-3515-ocr-bill-posting' into release/2026-02-27
This commit is contained in:
@@ -0,0 +1,203 @@
|
||||
import { Button, Tag, Modal, Typography } from "antd";
|
||||
import axios from "axios";
|
||||
import { useState } from "react";
|
||||
import { FaWandMagicSparkles } from "react-icons/fa6";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { useNotification } from "../../contexts/Notifications/notificationContext";
|
||||
import { selectBillEnterModal } from "../../redux/modals/modals.selectors";
|
||||
import { selectBodyshop } from "../../redux/user/user.selectors";
|
||||
import { useTranslation } from "react-i18next";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
billEnterModal: selectBillEnterModal,
|
||||
bodyshop: selectBodyshop
|
||||
});
|
||||
|
||||
function BillEnterAiScan({
|
||||
billEnterModal,
|
||||
bodyshop,
|
||||
pollingIntervalRef,
|
||||
setPollingIntervalRef,
|
||||
form,
|
||||
fileInputRef,
|
||||
scanLoading,
|
||||
setScanLoading,
|
||||
setIsAiScan
|
||||
}) {
|
||||
const notification = useNotification();
|
||||
const { t } = useTranslation();
|
||||
const [showBetaModal, setShowBetaModal] = useState(false);
|
||||
const BETA_ACCEPTANCE_KEY = "ai_scan_beta_acceptance";
|
||||
const handleBetaAcceptance = () => {
|
||||
localStorage.setItem(BETA_ACCEPTANCE_KEY, "true");
|
||||
setShowBetaModal(false);
|
||||
fileInputRef.current?.click();
|
||||
};
|
||||
|
||||
const checkBetaAcceptance = () => {
|
||||
const hasAccepted = localStorage.getItem(BETA_ACCEPTANCE_KEY);
|
||||
if (hasAccepted) {
|
||||
fileInputRef.current?.click();
|
||||
} else {
|
||||
setShowBetaModal(true);
|
||||
}
|
||||
};
|
||||
|
||||
// Polling function for multipage PDF status
|
||||
const pollJobStatus = async (textractJobId) => {
|
||||
try {
|
||||
const { data } = await axios.get(`/ai/bill-ocr/status/${textractJobId}`);
|
||||
|
||||
if (data.status === "COMPLETED") {
|
||||
// Stop polling
|
||||
if (pollingIntervalRef.current) {
|
||||
clearInterval(pollingIntervalRef.current);
|
||||
setPollingIntervalRef(null);
|
||||
}
|
||||
setScanLoading(false);
|
||||
|
||||
// Update form with the extracted data
|
||||
if (data?.data?.billForm) {
|
||||
form.setFieldsValue(data.data.billForm);
|
||||
await form.validateFields(["billlines"], { recursive: true });
|
||||
notification.success({
|
||||
title: t("bills.labels.ai.scancomplete")
|
||||
});
|
||||
}
|
||||
} else if (data.status === "FAILED") {
|
||||
// Stop polling on failure
|
||||
if (pollingIntervalRef.current) {
|
||||
clearInterval(pollingIntervalRef.current);
|
||||
setPollingIntervalRef(null);
|
||||
}
|
||||
setScanLoading(false);
|
||||
|
||||
notification.error({
|
||||
title: t("bills.labels.ai.scanfailed"),
|
||||
description: data.error || ""
|
||||
});
|
||||
}
|
||||
// If status is IN_PROGRESS, continue polling
|
||||
} catch (error) {
|
||||
// Stop polling on error
|
||||
if (pollingIntervalRef.current) {
|
||||
clearInterval(pollingIntervalRef.current);
|
||||
setPollingIntervalRef(null);
|
||||
}
|
||||
setScanLoading(false);
|
||||
|
||||
notification.error({
|
||||
title: t("bills.labels.ai.scanfailed"),
|
||||
description: error.response?.data?.message || error.message || "Failed to check scan status"
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<input
|
||||
ref={fileInputRef}
|
||||
type="file"
|
||||
accept="image/*,application/pdf"
|
||||
style={{ display: "none" }}
|
||||
onChange={async (e) => {
|
||||
const file = e.target.files?.[0];
|
||||
if (file) {
|
||||
setScanLoading(true);
|
||||
setIsAiScan(true);
|
||||
const formdata = new FormData();
|
||||
formdata.append("billScan", file);
|
||||
formdata.append("jobid", billEnterModal.context.job?.id);
|
||||
formdata.append("bodyshopid", bodyshop.id);
|
||||
formdata.append("partsorderid", billEnterModal.context.parts_order?.id);
|
||||
|
||||
try {
|
||||
const { data, status } = await axios.post("/ai/bill-ocr", formdata);
|
||||
|
||||
// Add the scanned file to the upload field
|
||||
const currentUploads = form.getFieldValue("upload") || [];
|
||||
form.setFieldValue("upload", [
|
||||
...currentUploads,
|
||||
{
|
||||
uid: `ai-scan-${Date.now()}`,
|
||||
name: file.name,
|
||||
originFileObj: file,
|
||||
status: "done"
|
||||
}
|
||||
]);
|
||||
if (status === 202) {
|
||||
// Multipage PDF - start polling
|
||||
notification.info({
|
||||
title: t("bills.labels.ai.scanstarted"),
|
||||
description: t("bills.labels.ai.multipage")
|
||||
});
|
||||
|
||||
//Workaround needed to bypass react-compiler error about manipulating refs in child components. Refactor may be needed in the future to clean this up.
|
||||
setPollingIntervalRef(
|
||||
setInterval(() => {
|
||||
pollJobStatus(data.textractJobId);
|
||||
}, 3000)
|
||||
);
|
||||
|
||||
// Initial poll
|
||||
pollJobStatus(data.textractJobId);
|
||||
} else if (status === 200) {
|
||||
// Single page - immediate response
|
||||
setScanLoading(false);
|
||||
|
||||
form.setFieldsValue(data.data.billForm);
|
||||
await form.validateFields(["billlines"], { recursive: true });
|
||||
|
||||
notification.success({
|
||||
title: t("bills.labels.ai.scancomplete")
|
||||
});
|
||||
}
|
||||
} catch (error) {
|
||||
setScanLoading(false);
|
||||
notification.error({
|
||||
title: t("bills.labels.ai.scanfailed"),
|
||||
description: error.response?.data?.message || error.message || t("bills.labels.ai.generic_failure")
|
||||
});
|
||||
}
|
||||
}
|
||||
// Reset the input so the same file can be selected again
|
||||
e.target.value = "";
|
||||
}}
|
||||
/>
|
||||
|
||||
<Button onClick={checkBetaAcceptance} icon={<FaWandMagicSparkles />} loading={scanLoading} disabled={scanLoading}>
|
||||
{scanLoading ? t("bills.labels.ai.processing") : t("bills.labels.ai.scan")}
|
||||
<Tag color="red">{t("general.labels.beta")}</Tag>
|
||||
</Button>
|
||||
|
||||
<Modal
|
||||
title={t("bills.labels.ai.disclaimer_title")}
|
||||
open={showBetaModal}
|
||||
onOk={handleBetaAcceptance}
|
||||
onCancel={() => setShowBetaModal(false)}
|
||||
okText={t("bills.labels.ai.accept_and_continue")}
|
||||
cancelText={t("general.actions.cancel")}
|
||||
>
|
||||
{
|
||||
//This is explicitly not translated.
|
||||
}
|
||||
<Typography.Text>
|
||||
This AI scanning feature is currently in <strong>beta</strong>. While it can accelerate data entry, you{" "}
|
||||
<strong>must carefully review all extracted results</strong> for accuracy.
|
||||
</Typography.Text>
|
||||
<Typography.Text>The AI may make mistakes or miss information. Always verify:</Typography.Text>
|
||||
<ul>
|
||||
<li>All line items and quantities</li>
|
||||
<li>Prices and totals</li>
|
||||
<li>Part numbers and descriptions</li>
|
||||
<li>Any other critical invoice details</li>
|
||||
</ul>
|
||||
<Typography.Text>
|
||||
By continuing, you acknowledge that you will review and verify all AI-generated data before posting.
|
||||
</Typography.Text>
|
||||
</Modal>
|
||||
</>
|
||||
);
|
||||
}
|
||||
export default connect(mapStateToProps, null)(BillEnterAiScan);
|
||||
@@ -2,10 +2,11 @@ import { useApolloClient, useMutation } from "@apollo/client/react";
|
||||
import { useTreatmentsWithConfig } from "@splitsoftware/splitio-react";
|
||||
import { Button, Checkbox, Form, Modal, Space } from "antd";
|
||||
import _ from "lodash";
|
||||
import { useEffect, useMemo, useState } from "react";
|
||||
import { useEffect, useMemo, useRef, useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import RbacWrapper from "../../components/rbac-wrapper/rbac-wrapper.component";
|
||||
import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
|
||||
import { INSERT_NEW_BILL } from "../../graphql/bills.queries";
|
||||
import { UPDATE_INVENTORY_LINES } from "../../graphql/inventory.queries";
|
||||
@@ -21,12 +22,12 @@ import { GenerateDocument } from "../../utils/RenderTemplate";
|
||||
import { TemplateList } from "../../utils/TemplateConstants";
|
||||
import confirmDialog from "../../utils/asyncConfirm";
|
||||
import useLocalStorage from "../../utils/useLocalStorage";
|
||||
import BillEnterAiScan from "../bill-enter-ai-scan/bill-enter-ai-scan.component.jsx";
|
||||
import BillFormContainer from "../bill-form/bill-form.container";
|
||||
import { CalculateBillTotal } from "../bill-form/bill-form.totals.utility";
|
||||
import { handleUpload as handleLocalUpload } from "../documents-local-upload/documents-local-upload.utility";
|
||||
import { handleUpload } from "../documents-upload/documents-upload.utility";
|
||||
import { handleUpload as handleUploadToImageProxy } from "../documents-upload-imgproxy/documents-upload-imgproxy.utility";
|
||||
import RbacWrapper from "../../components/rbac-wrapper/rbac-wrapper.component";
|
||||
import { handleUpload } from "../documents-upload/documents-upload.utility";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
billEnterModal: selectBillEnterModal,
|
||||
@@ -50,18 +51,22 @@ function BillEnterModalContainer({ billEnterModal, toggleModalVisible, bodyshop,
|
||||
const [updatePartsOrderLines] = useMutation(MUTATION_MARK_RETURN_RECEIVED);
|
||||
const [updateInventoryLines] = useMutation(UPDATE_INVENTORY_LINES);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [scanLoading, setScanLoading] = useState(false);
|
||||
const [isAiScan, setIsAiScan] = useState(false);
|
||||
const client = useApolloClient();
|
||||
const [generateLabel, setGenerateLabel] = useLocalStorage("enter_bill_generate_label", false);
|
||||
const notification = useNotification();
|
||||
const fileInputRef = useRef(null);
|
||||
const pollingIntervalRef = useRef(null);
|
||||
|
||||
const {
|
||||
treatments: { Enhanced_Payroll, Imgproxy }
|
||||
treatments: { Enhanced_Payroll, Imgproxy, Bill_OCR_AI }
|
||||
} = useTreatmentsWithConfig({
|
||||
attributes: {},
|
||||
names: ["Enhanced_Payroll", "Imgproxy"],
|
||||
names: ["Enhanced_Payroll", "Imgproxy", "Bill_OCR_AI"],
|
||||
splitKey: bodyshop.imexshopid
|
||||
});
|
||||
|
||||
|
||||
const formValues = useMemo(() => {
|
||||
return {
|
||||
...billEnterModal.context.bill,
|
||||
@@ -113,6 +118,8 @@ function BillEnterModalContainer({ billEnterModal, toggleModalVisible, bodyshop,
|
||||
create_ppc,
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
original_actual_price,
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
confidence,
|
||||
...restI
|
||||
} = i;
|
||||
|
||||
@@ -378,6 +385,7 @@ function BillEnterModalContainer({ billEnterModal, toggleModalVisible, bodyshop,
|
||||
vendorid: values.vendorid,
|
||||
billlines: []
|
||||
});
|
||||
setIsAiScan(false);
|
||||
// form.resetFields();
|
||||
} else {
|
||||
toggleModalVisible();
|
||||
@@ -388,10 +396,22 @@ function BillEnterModalContainer({ billEnterModal, toggleModalVisible, bodyshop,
|
||||
const handleCancel = () => {
|
||||
const r = window.confirm(t("general.labels.cancel"));
|
||||
if (r === true) {
|
||||
// Clean up polling on cancel
|
||||
if (pollingIntervalRef.current) {
|
||||
clearInterval(pollingIntervalRef.current);
|
||||
pollingIntervalRef.current = null;
|
||||
}
|
||||
setScanLoading(false);
|
||||
setIsAiScan(false);
|
||||
toggleModalVisible();
|
||||
}
|
||||
};
|
||||
|
||||
//Workaround needed to bypass react-compiler error about manipulating refs in child components. Refactor may be needed in the future to clean this up.
|
||||
const setPollingIntervalRef = (func) => {
|
||||
pollingIntervalRef.current = func;
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (enterAgain) form.submit();
|
||||
}, [enterAgain, form]);
|
||||
@@ -401,12 +421,44 @@ function BillEnterModalContainer({ billEnterModal, toggleModalVisible, bodyshop,
|
||||
form.setFieldsValue(formValues);
|
||||
} else {
|
||||
form.resetFields();
|
||||
// Clean up polling on modal close
|
||||
if (pollingIntervalRef.current) {
|
||||
clearInterval(pollingIntervalRef.current);
|
||||
pollingIntervalRef.current = null;
|
||||
}
|
||||
setScanLoading(false);
|
||||
setIsAiScan(false);
|
||||
}
|
||||
}, [billEnterModal.open, form, formValues]);
|
||||
|
||||
// Cleanup on unmount
|
||||
useEffect(() => {
|
||||
return () => {
|
||||
if (pollingIntervalRef.current) {
|
||||
clearInterval(pollingIntervalRef.current);
|
||||
pollingIntervalRef.current = null;
|
||||
}
|
||||
};
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<Modal
|
||||
title={t("bills.labels.new")}
|
||||
title={
|
||||
<Space size="large">
|
||||
{t("bills.labels.new")}
|
||||
{Bill_OCR_AI.treatment === "on" && (
|
||||
<BillEnterAiScan
|
||||
fileInputRef={fileInputRef}
|
||||
form={form}
|
||||
pollingIntervalRef={pollingIntervalRef}
|
||||
setPollingIntervalRef={setPollingIntervalRef}
|
||||
scanLoading={scanLoading}
|
||||
setScanLoading={setScanLoading}
|
||||
setIsAiScan={setIsAiScan}
|
||||
/>
|
||||
)}
|
||||
</Space>
|
||||
}
|
||||
width={"98%"}
|
||||
open={billEnterModal.open}
|
||||
okText={t("general.actions.save")}
|
||||
@@ -452,7 +504,11 @@ function BillEnterModalContainer({ billEnterModal, toggleModalVisible, bodyshop,
|
||||
}}
|
||||
>
|
||||
<RbacWrapper action="bills:enter">
|
||||
<BillFormContainer form={form} disableInvNumber={billEnterModal.context.disableInvNumber} />
|
||||
<BillFormContainer
|
||||
form={form}
|
||||
isAiScan={isAiScan}
|
||||
disableInvNumber={billEnterModal.context.disableInvNumber}
|
||||
/>
|
||||
</RbacWrapper>
|
||||
</Form>
|
||||
</Modal>
|
||||
|
||||
@@ -8,12 +8,15 @@ import { MdOpenInNew } from "react-icons/md";
|
||||
import { connect } from "react-redux";
|
||||
import { Link } from "react-router-dom";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
|
||||
import { CHECK_BILL_INVOICE_NUMBER } from "../../graphql/bills.queries";
|
||||
import { selectBodyshop } from "../../redux/user/user.selectors";
|
||||
import dayjs from "../../utils/day";
|
||||
import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
|
||||
import InstanceRenderManager from "../../utils/instanceRenderMgr";
|
||||
import AlertComponent from "../alert/alert.component";
|
||||
import BillFormLinesExtended from "../bill-form-lines-extended/bill-form-lines-extended.component";
|
||||
import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
|
||||
import FormFieldsChanged from "../form-fields-changed-alert/form-fields-changed-alert.component";
|
||||
import CurrencyInput from "../form-items-formatted/currency-form-item.component";
|
||||
import JobSearchSelect from "../job-search-select/job-search-select.component";
|
||||
@@ -21,8 +24,6 @@ import LayoutFormRow from "../layout-form-row/layout-form-row.component";
|
||||
import VendorSearchSelect from "../vendor-search-select/vendor-search-select.component";
|
||||
import BillFormLines from "./bill-form.lines.component";
|
||||
import { CalculateBillTotal } from "./bill-form.totals.utility";
|
||||
import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
|
||||
import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
bodyshop: selectBodyshop
|
||||
@@ -43,11 +44,14 @@ export function BillFormComponent({
|
||||
loadOutstandingReturns,
|
||||
loadInventory,
|
||||
preferredMake,
|
||||
disableInHouse
|
||||
disableInHouse,
|
||||
isAiScan
|
||||
}) {
|
||||
const { t } = useTranslation();
|
||||
const client = useApolloClient();
|
||||
const [discount, setDiscount] = useState(0);
|
||||
const notification = useNotification();
|
||||
const jobIdFormWatch = Form.useWatch("jobid", form);
|
||||
|
||||
const {
|
||||
treatments: { Extended_Bill_Posting, ClosingPeriod }
|
||||
@@ -123,6 +127,23 @@ export function BillFormComponent({
|
||||
bodyshop.inhousevendorid
|
||||
]);
|
||||
|
||||
useEffect(() => {
|
||||
// When the jobid is set by AI scan, we need to reload the lines. This prevents having to hoist the apollo query.
|
||||
if (jobIdFormWatch !== null) {
|
||||
if (form.getFieldValue("jobid") !== null && form.getFieldValue("jobid") !== undefined) {
|
||||
loadLines({ variables: { id: form.getFieldValue("jobid") } });
|
||||
if (form.getFieldValue("vendorid") !== null && form.getFieldValue("vendorid") !== undefined) {
|
||||
loadOutstandingReturns({
|
||||
variables: {
|
||||
jobId: form.getFieldValue("jobid"),
|
||||
vendorId: form.getFieldValue("vendorid")
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}, [jobIdFormWatch, form]);
|
||||
|
||||
return (
|
||||
<div>
|
||||
<FormFieldsChanged form={form} />
|
||||
@@ -373,7 +394,15 @@ export function BillFormComponent({
|
||||
]);
|
||||
let totals;
|
||||
if (!!values.total && !!values.billlines && values.billlines.length > 0) {
|
||||
totals = CalculateBillTotal(values);
|
||||
try {
|
||||
totals = CalculateBillTotal(values);
|
||||
} catch (error) {
|
||||
notification.error({
|
||||
title: t("bills.errors.calculating_totals"),
|
||||
message: error.message || t("bills.errors.calculating_totals_generic"),
|
||||
key: "bill_totals_calculation_error"
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
if (totals) {
|
||||
@@ -451,6 +480,7 @@ export function BillFormComponent({
|
||||
responsibilityCenters={responsibilityCenters}
|
||||
disabled={disabled}
|
||||
billEdit={billEdit}
|
||||
isAiScan={isAiScan}
|
||||
/>
|
||||
)}
|
||||
<Divider titlePlacement="left" style={{ display: billEdit ? "none" : null }}>
|
||||
|
||||
@@ -15,7 +15,7 @@ const mapStateToProps = createStructuredSelector({
|
||||
bodyshop: selectBodyshop
|
||||
});
|
||||
|
||||
export function BillFormContainer({ bodyshop, form, billEdit, disabled, disableInvNumber, disableInHouse }) {
|
||||
export function BillFormContainer({ bodyshop, form, billEdit, disabled, disableInvNumber, disableInHouse,isAiScan }) {
|
||||
const {
|
||||
treatments: { Simple_Inventory }
|
||||
} = useTreatmentsWithConfig({
|
||||
@@ -50,6 +50,7 @@ export function BillFormContainer({ bodyshop, form, billEdit, disabled, disableI
|
||||
loadOutstandingReturns={loadOutstandingReturns}
|
||||
loadInventory={loadInventory}
|
||||
preferredMake={lineData ? lineData.jobs_by_pk.v_make_desc : null}
|
||||
isAiScan={isAiScan}
|
||||
/>
|
||||
{!billEdit && <BillCmdReturnsTableComponent form={form} returnLoading={returnLoading} returnData={returnData} />}
|
||||
{Simple_Inventory.treatment === "on" && (
|
||||
|
||||
@@ -5,14 +5,15 @@ import { useRef } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { selectBodyshop } from "../../redux/user/user.selectors";
|
||||
import { selectDarkMode } from "../../redux/application/application.selectors";
|
||||
import { selectBodyshop } from "../../redux/user/user.selectors";
|
||||
import CiecaSelect from "../../utils/Ciecaselect";
|
||||
import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
|
||||
import InstanceRenderManager from "../../utils/instanceRenderMgr";
|
||||
import BillLineSearchSelect from "../bill-line-search-select/bill-line-search-select.component";
|
||||
import BilllineAddInventory from "../billline-add-inventory/billline-add-inventory.component";
|
||||
import CurrencyInput from "../form-items-formatted/currency-form-item.component";
|
||||
import { bodyshopHasDmsKey } from "../../utils/dmsUtils.js";
|
||||
import ConfidenceDisplay from "./bill-form.lines.confidence.component.jsx";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
bodyshop: selectBodyshop,
|
||||
@@ -29,7 +30,8 @@ export function BillEnterModalLinesComponent({
|
||||
discount,
|
||||
form,
|
||||
responsibilityCenters,
|
||||
billEdit
|
||||
billEdit,
|
||||
isAiScan
|
||||
}) {
|
||||
const { t } = useTranslation();
|
||||
const { setFieldsValue, getFieldsValue, getFieldValue } = form;
|
||||
@@ -139,6 +141,29 @@ export function BillEnterModalLinesComponent({
|
||||
|
||||
const columns = (remove) => {
|
||||
return [
|
||||
...(isAiScan
|
||||
? [
|
||||
{
|
||||
title: t("billlines.fields.confidence"),
|
||||
dataIndex: "confidence",
|
||||
editable: true,
|
||||
width: "5rem",
|
||||
formItemProps: (field) => ({
|
||||
key: `${field.index}confidence`,
|
||||
name: [field.name, "confidence"],
|
||||
label: t("billlines.fields.confidence")
|
||||
}),
|
||||
formInput: (record) => {
|
||||
const rowValue = getFieldValue(["billlines", record.name]);
|
||||
return (
|
||||
<div style={{ display: "flex", alignItems: "center", justifyContent: "center" }}>
|
||||
<ConfidenceDisplay rowValue={rowValue} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
]
|
||||
: []),
|
||||
{
|
||||
title: t("billlines.fields.jobline"),
|
||||
dataIndex: "joblineid",
|
||||
@@ -212,6 +237,7 @@ export function BillEnterModalLinesComponent({
|
||||
}),
|
||||
formInput: () => <Input.TextArea disabled={disabled} autoSize tabIndex={0} />
|
||||
},
|
||||
|
||||
{
|
||||
title: t("billlines.fields.quantity"),
|
||||
dataIndex: "quantity",
|
||||
@@ -250,7 +276,16 @@ export function BillEnterModalLinesComponent({
|
||||
key: `${field.name}actual_price`,
|
||||
name: [field.name, "actual_price"],
|
||||
label: t("billlines.fields.actual_price"),
|
||||
rules: [{ required: true }]
|
||||
rules: [
|
||||
{ required: true },
|
||||
{
|
||||
validator: (_, value) => {
|
||||
return Math.abs(parseFloat(value)) < 0.01 ? Promise.reject() : Promise.resolve();
|
||||
},
|
||||
warningOnly: true
|
||||
}
|
||||
],
|
||||
hasFeedback: true
|
||||
}),
|
||||
formInput: (record, index) => (
|
||||
<CurrencyInput
|
||||
|
||||
@@ -0,0 +1,87 @@
|
||||
import { Progress, Space, Tag, Tooltip } from "antd";
|
||||
import { useTranslation } from "react-i18next";
|
||||
const parseConfidence = (confidenceStr) => {
|
||||
if (!confidenceStr || typeof confidenceStr !== "string") return null;
|
||||
|
||||
const match = confidenceStr.match(/T([\d.]+)\s*-\s*O([\d.]+)\s*-\s*J([\d.]+)/);
|
||||
if (!match) return null;
|
||||
|
||||
return {
|
||||
total: parseFloat(match[1]),
|
||||
ocr: parseFloat(match[2]),
|
||||
jobMatch: parseFloat(match[3])
|
||||
};
|
||||
};
|
||||
|
||||
const getConfidenceColor = (value) => {
|
||||
if (value >= 80) return "green";
|
||||
if (value >= 60) return "orange";
|
||||
if (value >= 40) return "gold";
|
||||
return "red";
|
||||
};
|
||||
|
||||
const ConfidenceDisplay = ({ rowValue: { confidence, actual_price, actual_cost } }) => {
|
||||
const { t } = useTranslation();
|
||||
const parsed = parseConfidence(confidence);
|
||||
const parsed_actual_price = parseFloat(actual_price);
|
||||
const parsed_actual_cost = parseFloat(actual_cost);
|
||||
if (!parsed) {
|
||||
return <span style={{ color: "#959595", fontSize: "0.85em" }}>N/A</span>;
|
||||
}
|
||||
|
||||
const { total, ocr, jobMatch } = parsed;
|
||||
const color = getConfidenceColor(total);
|
||||
|
||||
return (
|
||||
<Tooltip
|
||||
title={
|
||||
<div style={{ padding: "4px 0" }}>
|
||||
<div style={{ marginBottom: 8, fontWeight: 600 }}>{t("bills.labels.ai.confidence.breakdown")}</div>
|
||||
<div style={{ marginBottom: 4 }}>
|
||||
<strong>{t("bills.labels.ai.confidence.overall")}:</strong> {total.toFixed(1)}%
|
||||
<Progress
|
||||
percent={total}
|
||||
size="small"
|
||||
strokeColor={getConfidenceColor(total)}
|
||||
showInfo={false}
|
||||
style={{ marginTop: 2 }}
|
||||
/>
|
||||
</div>
|
||||
<div style={{ marginBottom: 4 }}>
|
||||
<strong>{t("bills.labels.ai.confidence.ocr")}:</strong> {ocr.toFixed(1)}%
|
||||
<Progress
|
||||
percent={ocr}
|
||||
size="small"
|
||||
strokeColor={getConfidenceColor(ocr)}
|
||||
showInfo={false}
|
||||
style={{ marginTop: 2 }}
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<strong>{t("bills.labels.ai.confidence.match")}:</strong> {jobMatch.toFixed(1)}%
|
||||
<Progress
|
||||
percent={jobMatch}
|
||||
size="small"
|
||||
strokeColor={getConfidenceColor(jobMatch)}
|
||||
showInfo={false}
|
||||
style={{ marginTop: 2 }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
>
|
||||
<Space size="small">
|
||||
{!parsed_actual_cost || !parsed_actual_price || parsed_actual_cost === 0 || parsed_actual_price === 0 ? (
|
||||
<Tag color="red" style={{ margin: 0, cursor: "help", userSelect: "none" }}>
|
||||
{t("bills.labels.ai.confidence.missing_data")}
|
||||
</Tag>
|
||||
) : null}
|
||||
<Tag color={color} style={{ margin: 0, cursor: "help", userSelect: "none" }}>
|
||||
{total.toFixed(0)}%
|
||||
</Tag>
|
||||
</Space>
|
||||
</Tooltip>
|
||||
);
|
||||
};
|
||||
|
||||
export default ConfidenceDisplay;
|
||||
@@ -187,6 +187,7 @@ export function PartsOrderListTableDrawerComponent({
|
||||
actions: { refetch: refetch },
|
||||
context: {
|
||||
job: job,
|
||||
parts_order: { id: record.id },
|
||||
bill: {
|
||||
vendorid: record.vendor.id,
|
||||
is_credit_memo: record.return,
|
||||
|
||||
@@ -162,6 +162,7 @@ export function PartsOrderListTableComponent({
|
||||
actions: { refetch: refetch },
|
||||
context: {
|
||||
job: job,
|
||||
parts_order: { id: record.id },
|
||||
bill: {
|
||||
vendorid: record.vendor.id,
|
||||
is_credit_memo: record.return,
|
||||
|
||||
@@ -8,11 +8,19 @@ import PhoneNumberFormatter from "../../utils/PhoneFormatter";
|
||||
const VendorSearchSelect = ({ value, onChange, options, onSelect, disabled, preferredMake, showPhone, ref }) => {
|
||||
const [option, setOption] = useState(value);
|
||||
|
||||
// Sync internal state when value prop changes (e.g., from form.setFieldsValue)
|
||||
useEffect(() => {
|
||||
if (value !== option && onChange) {
|
||||
onChange(option);
|
||||
if (value !== option) {
|
||||
setOption(value);
|
||||
}
|
||||
}, [value, option, onChange]);
|
||||
}, [value, option]);
|
||||
|
||||
const handleChange = (newValue) => {
|
||||
setOption(newValue);
|
||||
if (onChange) {
|
||||
onChange(newValue);
|
||||
}
|
||||
};
|
||||
|
||||
const favorites =
|
||||
preferredMake && options
|
||||
@@ -103,7 +111,7 @@ const VendorSearchSelect = ({ value, onChange, options, onSelect, disabled, pref
|
||||
);
|
||||
}}
|
||||
popupMatchSelectWidth={false}
|
||||
onChange={setOption}
|
||||
onChange={handleChange}
|
||||
onSelect={onSelect}
|
||||
disabled={disabled || false}
|
||||
optionLabelProp="name"
|
||||
|
||||
@@ -161,6 +161,7 @@
|
||||
"fields": {
|
||||
"actual_cost": "Actual Cost",
|
||||
"actual_price": "Retail",
|
||||
"confidence": "Confidence",
|
||||
"cost_center": "Cost Center",
|
||||
"federal_tax_applicable": "Fed. Tax?",
|
||||
"jobline": "Job Line",
|
||||
@@ -191,6 +192,8 @@
|
||||
"return": "Return Items"
|
||||
},
|
||||
"errors": {
|
||||
"calculating_totals": "Error Calculating Totals",
|
||||
"calculating_totals_generic": "Please ensure all fields are properly completed. ",
|
||||
"creating": "Error adding bill. {{error}}",
|
||||
"deleting": "Error deleting bill. {{error}}",
|
||||
"existinginventoryline": "This bill cannot be deleted as it is tied to items in inventory.",
|
||||
@@ -217,6 +220,24 @@
|
||||
},
|
||||
"labels": {
|
||||
"actions": "Actions",
|
||||
"ai": {
|
||||
"accept_and_continue": "Accept and Continue",
|
||||
"confidence": {
|
||||
"breakdown": "Confidence Breakdown",
|
||||
"match": "Jobline Match",
|
||||
"missing_data": "Missing Data",
|
||||
"ocr": "Optical Character Recognition",
|
||||
"overall": "Overall"
|
||||
},
|
||||
"disclaimer_title": "AI Scan Beta Disclaimer",
|
||||
"generic_failure": "Failed to process invoice.",
|
||||
"multipage": "The is a multi-page document. Processing will take a few moments.",
|
||||
"processing": "Analyzing Bill",
|
||||
"scan": "AI Bill Scanner",
|
||||
"scancomplete": "AI Scan Complete",
|
||||
"scanfailed": "AI Scan Failed",
|
||||
"scanstarted": "AI Scan Started"
|
||||
},
|
||||
"bill_lines": "Bill Lines",
|
||||
"bill_total": "Bill Total Amount",
|
||||
"billcmtotal": "Credit Memos",
|
||||
@@ -1291,10 +1312,11 @@
|
||||
"vehicle": "Vehicle"
|
||||
},
|
||||
"labels": {
|
||||
"apply": "Apply",
|
||||
"actions": "Actions",
|
||||
"apply": "Apply",
|
||||
"areyousure": "Are you sure?",
|
||||
"barcode": "Barcode",
|
||||
"beta": "BETA",
|
||||
"cancel": "Are you sure you want to cancel? Your changes will not be saved.",
|
||||
"changelog": "Change Log",
|
||||
"clear": "Clear",
|
||||
@@ -1822,14 +1844,14 @@
|
||||
"name": "Payer Name",
|
||||
"payer_type": "Payer"
|
||||
},
|
||||
"rr_opcode": "RR OpCode",
|
||||
"rr_opcode_base": "Base",
|
||||
"rr_opcode_prefix": "Prefix",
|
||||
"rr_opcode_suffix": "Suffix",
|
||||
"sale": "Sale",
|
||||
"sale_dms_acctnumber": "Sale DMS Acct #",
|
||||
"story": "Story",
|
||||
"vinowner": "VIN Owner",
|
||||
"rr_opcode": "RR OpCode",
|
||||
"rr_opcode_prefix": "Prefix",
|
||||
"rr_opcode_suffix": "Suffix",
|
||||
"rr_opcode_base": "Base"
|
||||
"vinowner": "VIN Owner"
|
||||
},
|
||||
"dms_allocation": "DMS Allocation",
|
||||
"driveable": "Driveable",
|
||||
|
||||
@@ -161,6 +161,7 @@
|
||||
"fields": {
|
||||
"actual_cost": "",
|
||||
"actual_price": "",
|
||||
"confidence": "",
|
||||
"cost_center": "",
|
||||
"federal_tax_applicable": "",
|
||||
"jobline": "",
|
||||
@@ -191,6 +192,8 @@
|
||||
"return": ""
|
||||
},
|
||||
"errors": {
|
||||
"calculating_totals": "",
|
||||
"calculating_totals_generic": "",
|
||||
"creating": "",
|
||||
"deleting": "",
|
||||
"existinginventoryline": "",
|
||||
@@ -217,6 +220,24 @@
|
||||
},
|
||||
"labels": {
|
||||
"actions": "",
|
||||
"ai": {
|
||||
"accept_and_continue": "",
|
||||
"confidence": {
|
||||
"breakdown": "",
|
||||
"match": "",
|
||||
"missing_data": "",
|
||||
"ocr": "",
|
||||
"overall": ""
|
||||
},
|
||||
"disclaimer_title": "",
|
||||
"generic_failure": "",
|
||||
"multipage": "",
|
||||
"processing": "",
|
||||
"scan": "",
|
||||
"scancomplete": "",
|
||||
"scanfailed": "",
|
||||
"scanstarted": ""
|
||||
},
|
||||
"bill_lines": "",
|
||||
"bill_total": "",
|
||||
"billcmtotal": "",
|
||||
@@ -1291,10 +1312,11 @@
|
||||
"vehicle": ""
|
||||
},
|
||||
"labels": {
|
||||
"apply": "",
|
||||
"actions": "Comportamiento",
|
||||
"apply": "",
|
||||
"areyousure": "",
|
||||
"barcode": "código de barras",
|
||||
"beta": "",
|
||||
"cancel": "",
|
||||
"changelog": "",
|
||||
"clear": "",
|
||||
@@ -1822,14 +1844,14 @@
|
||||
"name": "",
|
||||
"payer_type": ""
|
||||
},
|
||||
"rr_opcode": "",
|
||||
"rr_opcode_base": "",
|
||||
"rr_opcode_prefix": "",
|
||||
"rr_opcode_suffix": "",
|
||||
"sale": "",
|
||||
"sale_dms_acctnumber": "",
|
||||
"story": "",
|
||||
"vinowner": "",
|
||||
"rr_opcode": "",
|
||||
"rr_opcode_prefix": "",
|
||||
"rr_opcode_suffix": "",
|
||||
"rr_opcode_base": ""
|
||||
"vinowner": ""
|
||||
},
|
||||
"dms_allocation": "",
|
||||
"driveable": "",
|
||||
|
||||
@@ -161,6 +161,7 @@
|
||||
"fields": {
|
||||
"actual_cost": "",
|
||||
"actual_price": "",
|
||||
"confidence": "",
|
||||
"cost_center": "",
|
||||
"federal_tax_applicable": "",
|
||||
"jobline": "",
|
||||
@@ -191,6 +192,8 @@
|
||||
"return": ""
|
||||
},
|
||||
"errors": {
|
||||
"calculating_totals": "",
|
||||
"calculating_totals_generic": "",
|
||||
"creating": "",
|
||||
"deleting": "",
|
||||
"existinginventoryline": "",
|
||||
@@ -217,6 +220,24 @@
|
||||
},
|
||||
"labels": {
|
||||
"actions": "",
|
||||
"ai": {
|
||||
"accept_and_continue": "",
|
||||
"confidence": {
|
||||
"breakdown": "",
|
||||
"match": "",
|
||||
"missing_data": "",
|
||||
"ocr": "",
|
||||
"overall": ""
|
||||
},
|
||||
"disclaimer_title": "",
|
||||
"generic_failure": "",
|
||||
"multipage": "",
|
||||
"processing": "",
|
||||
"scan": "",
|
||||
"scancomplete": "",
|
||||
"scanfailed": "",
|
||||
"scanstarted": ""
|
||||
},
|
||||
"bill_lines": "",
|
||||
"bill_total": "",
|
||||
"billcmtotal": "",
|
||||
@@ -1291,10 +1312,11 @@
|
||||
"vehicle": ""
|
||||
},
|
||||
"labels": {
|
||||
"apply": "",
|
||||
"actions": "actes",
|
||||
"apply": "",
|
||||
"areyousure": "",
|
||||
"barcode": "code à barre",
|
||||
"beta": "",
|
||||
"cancel": "",
|
||||
"changelog": "",
|
||||
"clear": "",
|
||||
@@ -1822,14 +1844,14 @@
|
||||
"name": "",
|
||||
"payer_type": ""
|
||||
},
|
||||
"rr_opcode": "",
|
||||
"rr_opcode_base": "",
|
||||
"rr_opcode_prefix": "",
|
||||
"rr_opcode_suffix": "",
|
||||
"sale": "",
|
||||
"sale_dms_acctnumber": "",
|
||||
"story": "",
|
||||
"vinowner": "",
|
||||
"rr_opcode": "",
|
||||
"rr_opcode_prefix": "",
|
||||
"rr_opcode_suffix": "",
|
||||
"rr_opcode_base": ""
|
||||
"vinowner": ""
|
||||
},
|
||||
"dms_allocation": "",
|
||||
"driveable": "",
|
||||
|
||||
Reference in New Issue
Block a user