u

src/components/tiles/ArticleTile.jsx

@@ -5,6 +5,7 @@ import ButtonBase from '@mui/material/ButtonBase';
 import Typography from '@mui/material/Typography';
 import { TILE_SIZE, Tile, tileBaseSx } from 'dashgui/tiles';
 import { formatPrice, getArticleGross } from '../../utils/price';
+import { formatStock } from '../article/searchFormat';
 import {
   getCachedImage,
   getThumbHashDataUrl,
@@ -357,6 +358,19 @@ export class ArticleTile extends Tile {
     const sku = articleSku(article);
     const grossPrice = getArticleGross(article, companyAutomat.state.current?.taxrate);
 
+    const warehouses = Array.isArray(article?.warehouses) ? article.warehouses : [];
+    const isTracked = article?.track_stock ?? article?.trackStock ?? (warehouses.length > 0);
+    const stockVal = isTracked === false
+      ? null
+      : (article?.stock != null && !Number.isNaN(Number(article.stock))
+        ? Number(article.stock)
+        : (warehouses.length > 0 || isTracked
+          ? warehouses.reduce((sum, wh) => sum + (Number(wh.stock) || 0), 0)
+          : null));
+    const warehouseTooltip = warehouses.length > 0
+      ? warehouses.map((w) => `${w.name || 'Lager'}: ${formatStock(w.stock)}`).join(' · ')
+      : undefined;
+
     return (
       <ButtonBase
         component="button"
@@ -488,25 +502,52 @@ export class ArticleTile extends Tile {
             {sku || '\u00A0'}
           </Typography>
 
-          {/* Row 5: Price */}
-          <Typography
-            variant="caption"
-            component="div"
+          {/* Row 5: Price & Stock */}
+          <Box
             sx={{
-              color: GREEN_BRIGHT,
-              fontWeight: 700,
-              fontSize: '0.8rem',
-              lineHeight: 1.2,
-              height: '1.2em',
+              display: 'flex',
+              alignItems: 'center',
+              justifyContent: 'space-between',
+              gap: 0.5,
               mt: 0.25,
-              textShadow: TEXT_GLOW_DARK,
-              overflow: 'hidden',
-              textOverflow: 'ellipsis',
-              whiteSpace: 'nowrap',
+              height: '1.2em',
             }}
           >
-            {grossPrice != null ? formatPrice(grossPrice) : '\u00A0'}
-          </Typography>
+            <Typography
+              variant="caption"
+              component="div"
+              sx={{
+                color: GREEN_BRIGHT,
+                fontWeight: 700,
+                fontSize: '0.8rem',
+                lineHeight: 1.2,
+                textShadow: TEXT_GLOW_DARK,
+                overflow: 'hidden',
+                textOverflow: 'ellipsis',
+                whiteSpace: 'nowrap',
+              }}
+            >
+              {grossPrice != null ? formatPrice(grossPrice) : '\u00A0'}
+            </Typography>
+            {stockVal != null && (
+              <Typography
+                variant="caption"
+                component="div"
+                title={warehouseTooltip}
+                sx={{
+                  color: ICE,
+                  fontWeight: 600,
+                  fontSize: '0.75rem',
+                  lineHeight: 1.2,
+                  textShadow: TEXT_GLOW_DARK,
+                  whiteSpace: 'nowrap',
+                  flexShrink: 0,
+                }}
+              >
+                {formatStock(stockVal)}
+              </Typography>
+            )}
+          </Box>
         </Box>
       </ButtonBase>
     );