Add new "available" badge to stock page (#7368)

inventree · May 28, 2024 · 4cf395c · 4cf395c
1 parent f3223c6
commit 4cf395c
Showing 1 changed file with 9 additions and 0 deletions.
diff --git a/src/frontend/src/pages/stock/StockDetail.tsx b/src/frontend/src/pages/stock/StockDetail.tsx
@@ -501,6 +501,9 @@ export default function StockDetail() {
   );
 
   const stockBadges: ReactNode[] = useMemo(() => {
+    let available = (stockitem?.quantity ?? 0) - (stockitem?.allocated ?? 0);
+    available = Math.max(0, available);
+
     return instanceQuery.isLoading
       ? []
       : [
@@ -521,6 +524,12 @@ export default function StockDetail() {
             visible={!stockitem.serial}
             key="quantity"
           />,
+          <DetailsBadge
+            color="yellow"
+            label={t`Available` + `: ${available}`}
+            visible={!stockitem.serial && available != stockitem.quantity}
+            key="available"
+          />,
           <DetailsBadge
             color="blue"
             label={t`Batch Code` + `: ${stockitem.batch}`}