Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 | 2x 16x 16x 16x 16x 16x 8x 16x 16x 112x | import React, { useState } from 'react';
import { useTranslation } from 'react-i18next';
import { Workspace2, type Workspace2DefinitionProps } from '@openmrs/esm-framework';
import { type StockItemDTO } from '../../core/api/types/stockItem/StockItem';
import { type TabItem } from '../../core/components/tabs/types';
import BatchInformation from './batch-information/batch-information.component';
import PackagingUnits from './packaging-units/packaging-units.component';
import StockItemDetails from './stock-item-details/stock-item-details.component';
import StockItemRules from './stock-item-rules/stock-item-rules.component';
import StockOperationStepper from '../../stock-operations/stock-operations-forms/stock-operation-stepper/stock-operation-stepper.component';
import StockQuantities from './quantities/quantities.component';
import StockReferences from './stock-item-references/stock-item-references.component';
import Transactions from './transactions/transactions.component';
interface AddStockItemProps {
stockItem?: StockItemDTO;
}
const AddEditStockItem: React.FC<Workspace2DefinitionProps<AddStockItemProps>> = ({
workspaceProps,
closeWorkspace,
}) => {
const { stockItem } = workspaceProps ?? {};
const { t } = useTranslation();
const [selectedTab, setSelectedTab] = useState(0);
const isEditing = Boolean(stockItem);
const handleTabChange = (index: number) => {
setSelectedTab(index);
};
const tabs: TabItem[] = [
{
name: t('stockItemDetails', 'Stock Item Details'),
component: (
<StockItemDetails
key={stockItem?.uuid}
handleTabChange={handleTabChange}
stockItem={stockItem}
onCloseWorkspace={closeWorkspace}
/>
),
},
{
name: t('packagingUnits', 'Packaging Units'),
component: <PackagingUnits isEditing handleTabChange={handleTabChange} stockItemUuid={stockItem?.uuid} />,
disabled: !isEditing,
},
{
name: t('transactions', 'Transactions'),
component: <Transactions stockItemUuid={stockItem?.uuid} />,
disabled: !isEditing,
},
{
name: t('batchInformation', 'Batch Information'),
component: <BatchInformation stockItemUuid={stockItem?.uuid} />,
disabled: !isEditing,
},
{
name: t('quantities', 'Quantities'),
component: <StockQuantities stockItemUuid={stockItem?.uuid} />,
disabled: !isEditing,
},
{
name: t('rules', 'Rules'),
component: <StockItemRules stockItemUuid={stockItem?.uuid} />,
disabled: !isEditing,
},
{
name: t('references', 'References'),
component: <StockReferences stockItemUuid={stockItem?.uuid} isEditing={isEditing} />,
disabled: !isEditing,
},
];
return (
<Workspace2
title={
stockItem
? `Edit ${stockItem.drugName || stockItem.conceptName || ''} ${stockItem.isDrug ? '(Drug)' : '(Non Drug)'}`
: t('addItem', 'Add stock item')
}
>
<StockOperationStepper
steps={tabs.map((tab) => ({
title: tab.name,
component: tab.component,
disabled: tab.disabled,
}))}
selectedIndex={selectedTab}
onChange={handleTabChange}
/>
</Workspace2>
);
};
export default AddEditStockItem;
|