u

src/components/article/boxes/ArticleViewPrice.jsx

@@ -8,7 +8,7 @@ import ArticlePriceTiersDialog from '../ArticlePriceTiersDialog';
 import ArticleUnitEditorDialog from '../ArticleUnitEditorDialog';
 import unitAutomat from '../../../automats/unitAutomat';
 import companyAutomat from '../../../automats/companyAutomat';
-import artikelAutomat from '../../../automats/artikelAutomat';
+import artikelAutomat, { getArticle } from '../../../automats/artikelAutomat';
 import { requireDefined, requireObject } from '../../../utils/apiShape';
 import {
   buildPosPricesPutBody,
@@ -19,6 +19,7 @@ import {
 } from '../../../utils/articleDetail';
 import {
   formatPriceAmount,
+  getArticleGross,
   netFromGross,
   parsePriceInput,
 } from '../../../utils/price';
@@ -33,7 +34,6 @@ import TierPricePills from './TierPricePills';
 import { PriceUnitRow, PriceUnitCorner } from './PriceUnitRow';
 import {
   BLUE_PANEL,
-  BORDER,
 } from '../../../colors';
 
 const SECOND_ROW_MIN_HEIGHT = 220;
@@ -387,6 +387,20 @@ export default class ArticleViewPrice extends PureComponent {
     this.unsubCompany = companyAutomat.subscribe(this, (state) => ({
       company: state.current ?? null,
     }));
+    this.unsubArtikel = artikelAutomat.subscribe(this, () => ({}));
+    if (this.props.article?.isParent) {
+      this.ensureChildren(this.props.article.children);
+    }
+  }
+
+  componentDidUpdate(prevProps) {
+    if (
+      this.props.article?.isParent &&
+      (prevProps.article?.sku !== this.props.article?.sku ||
+        prevProps.article?.children !== this.props.article?.children)
+    ) {
+      this.ensureChildren(this.props.article.children);
+    }
   }
 
   componentWillUnmount() {
@@ -395,6 +409,17 @@ export default class ArticleViewPrice extends PureComponent {
     this.unsubUnits = null;
     this.unsubCompany?.();
     this.unsubCompany = null;
+    this.unsubArtikel?.();
+    this.unsubArtikel = null;
+  }
+
+  ensureChildren(children) {
+    if (!Array.isArray(children)) return;
+    for (const child of children) {
+      if (child?.sku && !getArticle(child.sku)) {
+        void artikelAutomat.actions.loadArticle(child.sku).catch(() => {});
+      }
+    }
   }
 
   handleSave = async (draft) => {
@@ -481,11 +506,33 @@ export default class ArticleViewPrice extends PureComponent {
     const { article: articleData } = this.props;
 
     if (articleData?.isParent) {
+      const { company } = this.state;
+      const defaultTaxRate = company?.taxrate ?? 19;
+      const children = Array.isArray(articleData.children) ? articleData.children : [];
+      const prices = [];
+      for (const child of children) {
+        const fullChild = getArticle(child.sku) || child;
+        const gross = getArticleGross(fullChild, defaultTaxRate);
+        if (gross != null && Number.isFinite(gross)) {
+          prices.push(gross);
+        }
+      }
+
+      let priceText = 'Kein Preis';
+      if (prices.length > 0) {
+        const min = Math.min(...prices);
+        const max = Math.max(...prices);
+        priceText =
+          min === max
+            ? `€ ${formatPriceAmount(min)}`
+            : `€ ${formatPriceAmount(min)} bis € ${formatPriceAmount(max)}`;
+      }
+
       return (
         <PanelTile
           wide={1}
           minHeight={SECOND_ROW_MIN_HEIGHT}
-          color={BORDER}
+          color={BLUE_PANEL}
           contentAlignItems="flex-start"
         >
           <Box sx={{ display: 'flex', flexDirection: 'column', height: '100%', width: '100%' }}>
@@ -493,32 +540,25 @@ export default class ArticleViewPrice extends PureComponent {
               variant="caption"
               color="text.secondary"
               sx={{
-                textTransform: 'uppercase',
                 letterSpacing: 0.6,
                 fontWeight: 600,
                 display: 'block',
               }}
             >
-              Preis
+              Preis auf Variantenebene pflegen
             </Typography>
             <Box sx={{ my: 0.75 }}>
               <Typography
                 component="div"
                 sx={{
-                  fontSize: '1.25rem',
+                  fontSize: '1.5rem',
                   fontWeight: 700,
                   lineHeight: 1.2,
-                  color: 'text.secondary',
+                  letterSpacing: '-0.02em',
+                  color: 'text.primary',
                 }}
               >
-                Kein Preis
-              </Typography>
-              <Typography
-                variant="caption"
-                color="text.secondary"
-                sx={{ display: 'block', mt: 0.25 }}
-              >
-                Preise werden auf Variantenebene gepflegt
+                {priceText}
               </Typography>
             </Box>
           </Box>