u

2026-10-14 23:58:37 +02:00
parent e2a2d02cb4
commit ed7bb80006
5 changed files with 200 additions and 48 deletions
--- a/src/components/AppShell.jsx
+++ b/src/components/AppShell.jsx
@@ -87,8 +87,8 @@ class AppSidebar extends PureComponent {
          disablePadding
          sx={{
            flexGrow: 1,
-            display: 'flex',
-            flexDirection: { xs: 'row', lg: 'column' },
+            display: { xs: 'flex', lg: 'block' },
+            flexDirection: 'row',
            alignItems: 'center',
            height: { xs: '100%', lg: 'auto' },
            overflowX: { xs: 'auto', lg: 'visible' },
@@ -104,6 +104,8 @@ class AppSidebar extends PureComponent {
              <ListItemButton
                key={path}
                type="button"
+                aria-label={label}
+                title={label}
                selected={active}
                onMouseDown={(e) => e.preventDefault()}
                onClick={() => {
@@ -131,7 +133,7 @@ class AppSidebar extends PureComponent {
                  borderRadius: { xs: 1, lg: 0 },
                  width: { xs: 'auto', lg: '100%' },
                  height: { xs: '100%', lg: 'auto' },
-                  px: { xs: 1.25, sm: 1.5 },
+                  px: { xs: active ? 1.25 : 1, sm: active ? 1.5 : 1.25, md: 1.5 },
                  py: { xs: 0.75, sm: 1, lg: 1.25 },
                  borderLeft: { xs: 'none', lg: '3px solid transparent' },
                  borderBottom: { xs: '3px solid transparent', lg: 'none' },
@@ -141,7 +143,8 @@ class AppSidebar extends PureComponent {
                  '& .MuiListItemIcon-root': {
                    color: 'inherit',
                    minWidth: { xs: 'auto', lg: 36 },
-                    mr: { xs: 0.75, lg: 0 },
+                    mr: active ? { xs: 0.75, lg: 0 } : { xs: 0, md: 0.75, lg: 0 },
+                    justifyContent: 'center',
                  },
                  '&:hover': {
                    bgcolor: theme.nav.itemHover,
@@ -172,7 +175,10 @@ class AppSidebar extends PureComponent {
                    fontWeight: active ? 600 : 500,
                    noWrap: true,
                  }}
-                  sx={{ m: 0 }}
+                  sx={{
+                    m: { xs: 0, lg: 'initial' },
+                    display: active ? 'block' : { xs: 'none', md: 'block' },
+                  }}
                />
              </ListItemButton>
            );
@@ -239,25 +245,34 @@ class AppSubNav extends PureComponent {
      <Box
        component="nav"
        aria-label="Unternavigation"
-        sx={{
-          width: { xs: 60, sm: 72, md: SUB_NAV_WIDTH },
+        sx={(theme) => ({
+          width: { xs: '100%', sm: 72, md: SUB_NAV_WIDTH },
          flexShrink: 0,
          display: 'flex',
-          flexDirection: 'column',
+          flexDirection: { xs: 'row', sm: 'column' },
          alignItems: 'center',
-          gap: 1.5,
+          gap: { xs: 1, sm: 1.5 },
          position: 'sticky',
          top: { xs: 52, sm: 56, lg: 0 },
+          zIndex: { xs: 1090, sm: 'auto' },
          alignSelf: 'flex-start',
          height: {
-            xs: 'calc(var(--df-vh, 100vh) - 52px)',
+            xs: 'auto',
            sm: 'calc(var(--df-vh, 100vh) - 56px)',
            lg: 'var(--df-vh, 100vh)',
          },
-          py: { xs: 2, lg: 4 },
-          ml: { xs: 1, sm: 2, lg: 3 },
-          mr: { xs: 1, sm: 1.5, lg: 2 },
-        }}
+          py: { xs: 0.75, sm: 2, lg: 4 },
+          px: { xs: 1.5, sm: 0 },
+          ml: { xs: 0, sm: 2, lg: 3 },
+          mr: { xs: 0, sm: 1.5, lg: 2 },
+          overflowX: { xs: 'auto', sm: 'visible' },
+          scrollbarWidth: 'none',
+          '&::-webkit-scrollbar': { display: 'none' },
+          bgcolor: { xs: theme.nav?.mainBackground || 'background.default', sm: 'transparent' },
+          borderBottom: { xs: '1px solid', sm: 'none' },
+          borderColor: { xs: 'divider', sm: 'transparent' },
+          boxSizing: 'border-box',
+        })}
      >
        {subNav.map(({ segment, label, title, help, icon: Icon }) => {
          const active = segment === activeSub;
@@ -266,6 +281,7 @@ class AppSubNav extends PureComponent {
            <ButtonBase
              key={segment || 'index'}
              type="button"
+              title={label}
              aria-label={label}
              aria-current={active ? 'page' : undefined}
              disableRipple
@@ -290,15 +306,17 @@ class AppSubNav extends PureComponent {
                navigate(segment ? `${activeNav}/${segment}` : activeNav);
              }}
              sx={(theme) => ({
-                width: { xs: 60, sm: 72, md: SUB_NAV_WIDTH },
-                py: 1,
-                px: 0.5,
+                width: { xs: 'auto', sm: 72, md: SUB_NAV_WIDTH },
+                py: { xs: 0.5, sm: 1 },
+                px: { xs: active ? 1.25 : 0.75, sm: 0.5 },
                borderRadius: 2,
                display: 'flex',
-                flexDirection: 'column',
+                flexDirection: { xs: 'row', sm: 'column' },
                alignItems: 'center',
                justifyContent: 'center',
-                gap: 0.5,
+                gap: { xs: active ? 0.75 : 0, sm: 0.5 },
+                flexShrink: 0,
+                whiteSpace: 'nowrap',
                color: active
                  ? theme.nav?.itemActiveAccent || NAV_ITEM_ACTIVE_ACCENT
                  : theme.palette.text.secondary,
@@ -314,18 +332,19 @@ class AppSubNav extends PureComponent {
              })}
            >
              <HelpBadge title={title || label} help={help} placement="right">
-                <Icon sx={{ fontSize: { xs: 24, sm: 28, md: 32 } }} />
+                <Icon sx={{ fontSize: { xs: 20, sm: 28, md: 32 } }} />
              </HelpBadge>
              {label ? (
                <Typography
                  variant="caption"
                  noWrap
                  sx={{
-                    fontSize: { xs: '0.62rem', sm: '0.68rem' },
+                    fontSize: { xs: '0.75rem', sm: '0.68rem' },
                    fontWeight: 500,
                    lineHeight: 1.2,
                    textAlign: 'center',
                    maxWidth: '100%',
+                    display: active ? 'block' : { xs: 'none', sm: 'block' },
                  }}
                >
                  {label}
@@ -358,7 +377,7 @@ export default function AppShell() {
      <Box
        sx={{
          display: 'flex',
-          flexDirection: 'row',
+          flexDirection: { xs: 'column', sm: 'row' },
          flexGrow: 1,
          minWidth: 0,
        }}
--- a/src/components/manifest/ManifestForm.jsx
+++ b/src/components/manifest/ManifestForm.jsx
@@ -17,7 +17,7 @@ import artikelAutomat, { getArticle } from '../../automats/artikelAutomat';
 import entityAutomat from '../../automats/entityAutomat';
 import supplierAutomat from '../../automats/supplierAutomat';
 import companyAutomat, { selectCompanyTaxrate } from '../../automats/companyAutomat';
-import { netFromGross, getArticleGross } from '../../utils/price';
+import { netFromGross, grossFromNet, getArticleGross } from '../../utils/price';
 import {
  buildManifestBody,
  restoreAttachmentsFromApi,
@@ -421,10 +421,11 @@ class ManifestForm extends PureComponent {

        if (field === 'gross') {
          const taxVal = parseNum(line.tax ?? line.taxrate) ?? 0;
+          const rebateVal = parseNum(line.rebate) ?? 0;
          const grossNum = parseNum(value);
          let updatedNet = line.net;
          if (grossNum != null) {
-            const netNum = netFromGross(grossNum, taxVal);
+            const netNum = netFromGross(grossNum, taxVal, rebateVal);
            if (netNum != null) {
              updatedNet = String(netNum);
            }
@@ -441,11 +442,12 @@ class ManifestForm extends PureComponent {

        if (field === 'net' || field === 'netprice') {
          const taxVal = parseNum(line.tax ?? line.taxrate) ?? 0;
+          const rebateVal = parseNum(line.rebate) ?? 0;
          const netNum = parseNum(value);
          let updatedGross = line.gross;
          if (netNum != null) {
-            const grossNum = Math.round((netNum * (1 + taxVal / 100) + Number.EPSILON) * 100) / 100;
-            updatedGross = String(grossNum);
+            const grossNum = grossFromNet(netNum, taxVal, rebateVal);
+            updatedGross = grossNum != null ? String(grossNum) : '';
          } else if (value === '') {
            updatedGross = '';
          }
@@ -460,11 +462,12 @@ class ManifestForm extends PureComponent {

        if (field === 'tax' || field === 'taxrate') {
          const taxNum = parseNum(value) ?? 0;
+          const rebateVal = parseNum(line.rebate) ?? 0;
          const netNum = parseNum(line.net ?? line.netprice);
          let updatedGross = line.gross;
          if (netNum != null) {
-            const grossNum = Math.round((netNum * (1 + taxNum / 100) + Number.EPSILON) * 100) / 100;
-            updatedGross = String(grossNum);
+            const grossNum = grossFromNet(netNum, taxNum, rebateVal);
+            updatedGross = grossNum != null ? String(grossNum) : '';
          }
          return {
            ...line,
@@ -475,6 +478,22 @@ class ManifestForm extends PureComponent {
          };
        }

+        if (field === 'rebate') {
+          const rebateNum = parseNum(value) ?? 0;
+          const taxVal = parseNum(line.tax ?? line.taxrate) ?? 0;
+          const netNum = parseNum(line.net ?? line.netprice);
+          let updatedGross = line.gross;
+          if (netNum != null) {
+            const grossNum = grossFromNet(netNum, taxVal, rebateNum);
+            updatedGross = grossNum != null ? String(grossNum) : '';
+          }
+          return {
+            ...line,
+            rebate: value,
+            gross: updatedGross,
+          };
+        }
+
        return {
          ...line,
          [field]: value,
@@ -508,13 +527,15 @@ class ManifestForm extends PureComponent {
                  : '';
            const netNum = parseNum(netVal);
            const taxNum = parseNum(taxVal);
+            const rebateNum = parseNum(l.rebate) ?? 0;
            const artGross = getArticleGross(art, taxNum ?? 0);
            let grossVal = '';
-            if (artGross != null) {
+            if (artGross != null && rebateNum === 0) {
              grossVal = String(artGross);
            } else if (netNum != null) {
-              const g = Math.round((netNum * (1 + (taxNum ?? 0) / 100) + Number.EPSILON) * 100) / 100;
-              grossVal = String(g);
+              grossVal = String(grossFromNet(netNum, taxNum ?? 0, rebateNum));
+            } else if (artGross != null) {
+              grossVal = String(Math.round((artGross * (1 - rebateNum / 100) + Number.EPSILON) * 100) / 100);
            }
            const normTax = selectCompanyTaxrate() != null ? String(selectCompanyTaxrate()) : '19';
            const finalTax =
@@ -640,13 +661,15 @@ class ManifestForm extends PureComponent {
          : normTax;
    const netNum = parseNum(netVal);
    const taxNum = parseNum(taxVal);
+    const rebateNum = parseNum(targetLine.rebate) ?? 0;
    const artGross = getArticleGross(article, taxNum ?? 0);
    let grossVal = '';
-    if (artGross != null) {
+    if (artGross != null && rebateNum === 0) {
      grossVal = String(artGross);
    } else if (netNum != null) {
-      const g = Math.round((netNum * (1 + (taxNum ?? 0) / 100) + Number.EPSILON) * 100) / 100;
-      grossVal = String(g);
+      grossVal = String(grossFromNet(netNum, taxNum ?? 0, rebateNum));
+    } else if (artGross != null) {
+      grossVal = String(Math.round((artGross * (1 - rebateNum / 100) + Number.EPSILON) * 100) / 100);
    }

    this.setState((prev) => ({
--- a/src/components/manifest/ManifestFormLine.jsx
+++ b/src/components/manifest/ManifestFormLine.jsx
@@ -19,11 +19,13 @@ import SearchIcon from '@mui/icons-material/Search';
 import LinkOffOutlinedIcon from '@mui/icons-material/LinkOffOutlined';
 import { getFirstVal, parseNum, LINE_COLUMNS } from './manifestConfig';
 import ArticlePhoto from '../article/ArticlePhoto';
-import { formatPrice } from '../../utils/price';
+import { formatPrice, grossFromNet } from '../../utils/price';
 import { primaryPrice, priceBrutto } from '../../utils/articleDetail';
 import artikelAutomat, { createArticleSelector, getArticle } from '../../automats/artikelAutomat';
 import { artikelDetailPath } from '../article/articleRoute';
 import { BrandLabel } from '../brand';
+import { articleSupplierAutomat } from '../../automats/articleDetailAutomat';
+import { selectCompanyTaxrate } from '../../automats/companyAutomat';
 import {
  BORDER,
 } from '../../colors';
@@ -35,6 +37,7 @@ class ManifestFormLine extends PureComponent {
    this.state = {
      cachedArticle: sku ? getArticle(sku) : null,
      loadingArticle: false,
+      fallbackSuppliers: [],
    };
    this.handleRemove = this.handleRemove.bind(this);
    this.handleBlur = this.handleBlur.bind(this);
@@ -64,14 +67,18 @@ class ManifestFormLine extends PureComponent {

  componentWillUnmount() {
    this.unsubArticle?.();
+    this.unsubSupplier?.();
  }

  subscribeArticle(sku) {
    this.unsubArticle?.();
    this.unsubArticle = null;
+    this.unsubSupplier?.();
+    this.unsubSupplier = null;
+
    if (!sku) {
-      if (this.state.cachedArticle || this.state.loadingArticle) {
-        this.setState({ cachedArticle: null, loadingArticle: false });
+      if (this.state.cachedArticle || this.state.loadingArticle || this.state.fallbackSuppliers?.length) {
+        this.setState({ cachedArticle: null, loadingArticle: false, fallbackSuppliers: [] });
      }
      return;
    }
@@ -99,6 +106,15 @@ class ManifestFormLine extends PureComponent {
        ...(art ? { loadingArticle: false } : {}),
      };
    });
+
+    // Fallback: subscribe to articleSupplierAutomat if cachedArticle doesn't have suppliers
+    if (!current?.suppliers?.length) {
+      const supKey = articleSupplierAutomat.key(sku);
+      this.unsubSupplier = supKey.subscribe(this, (item) => ({
+        fallbackSuppliers: Array.isArray(item?.data) ? item.data : [],
+      }));
+      void articleSupplierAutomat.load(sku).catch(() => {});
+    }
  }

  handleRemove() {
@@ -235,8 +251,9 @@ class ManifestFormLine extends PureComponent {
      } else if (id === 'gross') {
        const netNum = parseNum(line.netprice ?? line.net);
        const taxNum = parseNum(line.taxrate ?? line.tax) ?? 0;
+        const rebateNum = parseNum(line.rebate) ?? 0;
        if (netNum != null) {
-          val = String(Math.round((netNum * (1 + taxNum / 100) + Number.EPSILON) * 100) / 100);
+          val = String(grossFromNet(netNum, taxNum, rebateNum));
        }
      }
    }
@@ -375,6 +392,41 @@ class ManifestFormLine extends PureComponent {
          : null)
        : null;

+      const suppliers =
+        Array.isArray(cachedArticle.suppliers) && cachedArticle.suppliers.length > 0
+          ? cachedArticle.suppliers
+          : (this.state.fallbackSuppliers ?? []);
+
+      const topSupplier =
+        suppliers.find((s) => s.sort === 0) ??
+        (suppliers.length > 0
+          ? [...suppliers].sort((a, b) => (Number(a.sort) || 0) - (Number(b.sort) || 0))[0]
+          : null);
+
+      const ekNetto =
+        topSupplier?.price?.net != null
+          ? Number(topSupplier.price.net)
+          : topSupplier?.netPrice != null
+            ? Number(topSupplier.netPrice)
+            : topSupplier?.net != null
+              ? Number(topSupplier.net)
+              : null;
+
+      const ekTaxRate =
+        topSupplier?.price?.taxRate != null
+          ? Number(topSupplier.price.taxRate)
+          : topSupplier?.taxRate != null
+            ? Number(topSupplier.taxRate)
+            : parseNum(this.props.line?.taxrate ?? this.props.line?.tax) ?? selectCompanyTaxrate() ?? 19;
+
+      const ekBrutto =
+        ekNetto != null
+          ? Math.round((ekNetto * (1 + Number(ekTaxRate) / 100) + Number.EPSILON) * 100) / 100
+          : null;
+
+      const hasPriceInfo =
+        vkNetto != null || vkBrutto != null || ekNetto != null || ekBrutto != null || kind === 'quote';
+
      return (
        <Box
          sx={{
@@ -480,8 +532,8 @@ class ManifestFormLine extends PureComponent {
            </Typography>
          )}

-          {/* VK Netto & VK Brutto: omit end on 2nd line for order */}
-          {!isOrder && (vkNetto != null || vkBrutto != null) && (
+          {/* EK Netto, EK Brutto, VK Netto, VK Brutto */}
+          {!isOrder && hasPriceInfo && (
            <Box
              sx={{
                display: 'flex',
@@ -491,6 +543,47 @@ class ManifestFormLine extends PureComponent {
                whiteSpace: 'nowrap',
              }}
            >
+              {/* EK Netto */}
+              <Tooltip
+                title={
+                  topSupplier?.supplierName
+                    ? `Lieferant: ${topSupplier.supplierName}${topSupplier.sku ? ` (Lief.-Art.-Nr.: ${topSupplier.sku})` : ''} (Sort: ${topSupplier.sort ?? 0})`
+                    : 'Kein Lieferant mit EK-Preis hinterlegt'
+                }
+              >
+                <Typography
+                  variant="caption"
+                  fontWeight={600}
+                  sx={{
+                    color: ekNetto != null ? 'text.secondary' : 'text.disabled',
+                    fontSize: '0.72rem',
+                  }}
+                >
+                  EK Netto: {ekNetto != null ? formatPrice(ekNetto) : '—'}
+                </Typography>
+              </Tooltip>
+
+              {/* EK Brutto */}
+              <Tooltip
+                title={
+                  topSupplier?.supplierName
+                    ? `Lieferant: ${topSupplier.supplierName} (inkl. ${ekTaxRate}% MwSt.)`
+                    : 'Kein Lieferant mit EK-Preis hinterlegt'
+                }
+              >
+                <Typography
+                  variant="caption"
+                  fontWeight={600}
+                  sx={{
+                    color: ekBrutto != null ? 'text.secondary' : 'text.disabled',
+                    fontSize: '0.72rem',
+                  }}
+                >
+                  EK Brutto: {ekBrutto != null ? formatPrice(ekBrutto) : '—'}
+                </Typography>
+              </Tooltip>
+
+              {/* VK Netto */}
              {vkNetto != null && (
                <Typography
                  variant="caption"
@@ -500,6 +593,8 @@ class ManifestFormLine extends PureComponent {
                  VK Netto: {formatPrice(vkNetto)}
                </Typography>
              )}
+
+              {/* VK Brutto */}
              {vkBrutto != null && (
                <Typography
                  variant="caption"
--- a/src/components/manifest/manifestConfig.js
+++ b/src/components/manifest/manifestConfig.js
@@ -107,12 +107,13 @@ export function lineFromApi(row) {
  const taxVal = row.taxrate != null ? String(row.taxrate) : row.tax != null ? String(row.tax) : '';
  const netNum = parseNum(netVal);
  const taxNum = parseNum(taxVal);
+  const rebateNum = parseNum(row.rebate) ?? 0;
  let grossVal = '';
  if (row.gross != null && row.gross !== '') {
    grossVal = String(row.gross);
  } else if (netNum != null) {
    const rate = taxNum ?? 0;
-    const g = Math.round((netNum * (1 + rate / 100) + Number.EPSILON) * 100) / 100;
+    const g = Math.round((netNum * (1 + rate / 100) * (1 - rebateNum / 100) + Number.EPSILON) * 100) / 100;
    grossVal = String(g);
  }
  return {
@@ -175,10 +176,10 @@ export function buildLines(lines, { requireAtLeastOne }) {
    const tax = parseNum(rawTax);
    const rawGross = getFirstVal(line.gross);
    const gross = parseNum(rawGross);
-    if (net == null && gross != null && tax != null) {
-      net = netFromGross(gross, tax);
-    }
    const rebate = parseNum(getFirstVal(line.rebate));
+    if (net == null && gross != null && tax != null) {
+      net = netFromGross(gross, tax, rebate ?? 0);
+    }
    const rawPu = getFirstVal(line.pu, line.vpe);
    const pu = parseNum(rawPu);
    const blank = !sku && !name && net == null && gross == null;