Add Part Stock and Product Stock Events sections to Inventory components

- Introduced new 'Part Stock Events' and 'Product Stock Events' sections in PartStockInfo and ProductStockInfo components, respectively.
- Updated state management to include events and modified the UI to display event-related information.
- Added icons and collapsible sections for better organization and user experience.
This commit is contained in:
Tom Butcher 2026-07-31 22:54:28 +01:00
parent f85b176709
commit db249d9dc9
2 changed files with 45 additions and 2 deletions

View File

@ -24,6 +24,7 @@ import DocumentPrintButton from '../../common/DocumentPrintButton.jsx'
import UserNotifierToggle from '../../common/UserNotifierToggle.jsx'
import ScrollBox from '../../common/ScrollBox.jsx'
import HistoryDisplay from '../../common/HistoryDisplay.jsx'
import PartStockIcon from '../../../Icons/PartStockIcon.jsx'
const log = loglevel.getLogger('PartStockInfo')
log.setLevel(config.logLevel)
@ -37,7 +38,7 @@ const PartStockInfo = () => {
'PartStockInfo',
{
info: true,
stocks: true,
events: true,
history: true,
notes: true,
auditLogs: false
@ -91,6 +92,7 @@ const PartStockInfo = () => {
disabled={objectFormState.loading}
items={[
{ key: 'info', label: 'Part Stock Information' },
{ key: 'events', label: 'Part Stock Events' },
{ key: 'history', label: 'Part Stock History' },
{ key: 'notes', label: 'Notes' },
{ key: 'auditLogs', label: 'Audit Logs' }
@ -128,7 +130,9 @@ const PartStockInfo = () => {
}}
editLoading={objectFormState.editLoading}
formValid={objectFormState.formValid}
disabled={objectFormState.beingEditedByOther || objectFormState.loading}
disabled={
objectFormState.beingEditedByOther || objectFormState.loading
}
loading={objectFormState.editLoading}
/>
</Space>
@ -177,6 +181,24 @@ const PartStockInfo = () => {
</InfoCollapse>
</ActionHandler>
<InfoCollapse
title='Part Stock Events'
icon={<PartStockIcon />}
active={collapseState.events}
onToggle={(expanded) => updateCollapseState('events', expanded)}
collapseKey='events'
>
{objectFormState.loading ? (
<InfoCollapsePlaceholder />
) : (
<ObjectTable
type='stockEvent'
masterFilter={{ 'parent._id': partStockId }}
visibleColumns={{ parent: false }}
/>
)}
</InfoCollapse>
<InfoCollapse
title='Part Stock History'
icon={<GraphIcon />}

View File

@ -19,6 +19,7 @@ import InfoCircleIcon from '../../../Icons/InfoCircleIcon.jsx'
import NoteIcon from '../../../Icons/NoteIcon.jsx'
import AuditLogIcon from '../../../Icons/AuditLogIcon.jsx'
import PartStockIcon from '../../../Icons/PartStockIcon.jsx'
import ProductStockIcon from '../../../Icons/ProductStockIcon.jsx'
import GraphIcon from '../../../Icons/GraphIcon.jsx'
import ObjectForm from '../../common/ObjectForm.jsx'
import EditButtons from '../../common/EditButtons.jsx'
@ -48,6 +49,7 @@ const ProductStockInfo = () => {
{
info: true,
partStocks: true,
events: true,
history: true,
notes: true,
auditLogs: false
@ -115,6 +117,7 @@ const ProductStockInfo = () => {
items={[
{ key: 'info', label: 'Product Stock Information' },
{ key: 'partStocks', label: 'Part Stocks' },
{ key: 'events', label: 'Product Stock Events' },
{ key: 'history', label: 'Product Stock History' },
{ key: 'notes', label: 'Notes' },
{ key: 'auditLogs', label: 'Audit Logs' }
@ -221,6 +224,24 @@ const ProductStockInfo = () => {
</ObjectForm>
</ActionHandler>
<InfoCollapse
title='Product Stock Events'
icon={<ProductStockIcon />}
active={collapseState.events}
onToggle={(expanded) => updateCollapseState('events', expanded)}
collapseKey='events'
>
{objectFormState.loading ? (
<InfoCollapsePlaceholder />
) : (
<ObjectTable
type='stockEvent'
masterFilter={{ 'parent._id': productStockId }}
visibleColumns={{ parent: false }}
/>
)}
</InfoCollapse>
<InfoCollapse
title='Product Stock History'
icon={<GraphIcon />}