Enhance PurchaseOrder components with new invoice modal and state management

- Added a new modal for creating invoices within the PurchaseOrderInfo component.
- Introduced state management for the new invoice modal, allowing users to open and close it.
- Updated PurchaseOrder model to include additional allowed states for invoice creation.
- Added a new field for 'completedAt' in the NewPurchaseOrder component for better order tracking.
This commit is contained in:
Tom Butcher 2025-12-28 01:10:10 +00:00
parent de74fb0668
commit 4da63e6a32
3 changed files with 36 additions and 3 deletions

View File

@ -53,7 +53,8 @@ const NewPurchaseOrder = ({ onOk, reset, defaultValues }) => {
acknowledgedAt: false, acknowledgedAt: false,
shippingAmount: false, shippingAmount: false,
shippingAmountWithTax: false, shippingAmountWithTax: false,
grandTotalAmount: false grandTotalAmount: false,
completedAt: false
}} }}
isEditing={false} isEditing={false}
objectData={objectData} objectData={objectData}

View File

@ -31,6 +31,7 @@ import ShipmentIcon from '../../../Icons/ShipmentIcon.jsx'
import InvoiceIcon from '../../../Icons/InvoiceIcon.jsx' import InvoiceIcon from '../../../Icons/InvoiceIcon.jsx'
import StockEventIcon from '../../../Icons/StockEventIcon.jsx' import StockEventIcon from '../../../Icons/StockEventIcon.jsx'
import { getModelByName } from '../../../../database/ObjectModels.js' import { getModelByName } from '../../../../database/ObjectModels.js'
import NewInvoice from '../../Finance/Invoices/NewInvoice.jsx'
const log = loglevel.getLogger('PurchaseOrderInfo') const log = loglevel.getLogger('PurchaseOrderInfo')
log.setLevel(config.logLevel) log.setLevel(config.logLevel)
@ -47,6 +48,7 @@ const PurchaseOrderInfo = () => {
const [acknowledgePurchaseOrderOpen, setAcknowledgePurchaseOrderOpen] = const [acknowledgePurchaseOrderOpen, setAcknowledgePurchaseOrderOpen] =
useState(false) useState(false)
const [cancelPurchaseOrderOpen, setCancelPurchaseOrderOpen] = useState(false) const [cancelPurchaseOrderOpen, setCancelPurchaseOrderOpen] = useState(false)
const [newInvoiceOpen, setNewInvoiceOpen] = useState(false)
const purchaseOrderId = new URLSearchParams(location.search).get( const purchaseOrderId = new URLSearchParams(location.search).get(
'purchaseOrderId' 'purchaseOrderId'
) )
@ -102,6 +104,10 @@ const PurchaseOrderInfo = () => {
setNewShipmentOpen(true) setNewShipmentOpen(true)
return true return true
}, },
newInvoice: () => {
setNewInvoiceOpen(true)
return true
},
post: () => { post: () => {
setPostPurchaseOrderOpen(true) setPostPurchaseOrderOpen(true)
return true return true
@ -382,6 +388,26 @@ const PurchaseOrderInfo = () => {
}} }}
/> />
</Modal> </Modal>
<Modal
open={newInvoiceOpen}
onCancel={() => {
setNewInvoiceOpen(false)
}}
width={800}
footer={null}
destroyOnHidden={true}
>
<NewInvoice
onOk={() => {
setNewInvoiceOpen(false)
}}
reset={newInvoiceOpen}
defaultValues={{
orderType: 'purchaseOrder',
order: { ...objectFormState.objectData }
}}
/>
</Modal>
<Modal <Modal
open={postPurchaseOrderOpen} open={postPurchaseOrderOpen}
onCancel={() => { onCancel={() => {

View File

@ -103,7 +103,13 @@ export const PurchaseOrder = {
url: (_id) => url: (_id) =>
`/dashboard/inventory/purchaseorders/info?purchaseOrderId=${_id}&action=newInvoice`, `/dashboard/inventory/purchaseorders/info?purchaseOrderId=${_id}&action=newInvoice`,
disabled: (objectData) => { disabled: (objectData) => {
return objectData?.state?.type != 'received' const allowedStates = [
'received',
'shipped',
'partiallyReceived',
'partiallyShipped'
]
return !allowedStates.includes(objectData?.state?.type)
} }
}, },
{ {
@ -240,7 +246,7 @@ export const PurchaseOrder = {
columnWidth: 175 columnWidth: 175
}, },
{ {
name: 'CompletedAt', name: 'completedAt',
label: 'Completed At', label: 'Completed At',
type: 'dateTime', type: 'dateTime',
readOnly: true readOnly: true