import { PureComponent } from 'react';
import Box from '@mui/material/Box';
import Button from '@mui/material/Button';
import CircularProgress from '@mui/material/CircularProgress';
import AppDialog from '../AppDialog';
import DialogActions from '@mui/material/DialogActions';
import DialogContent from '@mui/material/DialogContent';
import DialogTitle from '@mui/material/DialogTitle';
import IconButton from '@mui/material/IconButton';
import Table from '@mui/material/Table';
import TableBody from '@mui/material/TableBody';
import TableCell from '@mui/material/TableCell';
import TableContainer from '@mui/material/TableContainer';
import TableHead from '@mui/material/TableHead';
import TableRow from '@mui/material/TableRow';
import TextField from '@mui/material/TextField';
import Typography from '@mui/material/Typography';
import Chip from '@mui/material/Chip';
import Alert from '@mui/material/Alert';
import Paper from '@mui/material/Paper';
import FormControl from '@mui/material/FormControl';
import InputLabel from '@mui/material/InputLabel';
import Select from '@mui/material/Select';
import MenuItem from '@mui/material/MenuItem';
import FormHelperText from '@mui/material/FormHelperText';
import CloseIcon from '@mui/icons-material/Close';
import Inventory2OutlinedIcon from '@mui/icons-material/Inventory2Outlined';
import CheckCircleOutlineOutlinedIcon from '@mui/icons-material/CheckCircleOutlineOutlined';
import WarehouseIcon from '@mui/icons-material/Warehouse';
import AddIcon from '@mui/icons-material/Add';
import { enqueueSnackbar } from 'notistack';
import { notifyError } from '../../utils/notify';
import { formatDate, resolveLineSkus } from './manifestConfig';
import {
  fetchDeliveryLedgerSummary,
  bookDeliveryLines,
} from '../../utils/deliveryLedger';
import { formatStock } from '../article/searchFormat';
import artikelAutomat, { getArticle } from '../../automats/artikelAutomat';
import warehouseAutomat from '../../automats/warehouseAutomat';
import { supplier as supplierApi } from '../../api';
import deliveryEditorAutomat, { buildSupplierArticlesMap } from '../../automats/deliveryEditorAutomat';
import {
  SURFACE_BASE,
  SURFACE_RAISED,
} from '../../colors';

export default class BookDeliveryDialog extends PureComponent {
  constructor(props) {
    super(props);

    let initialAmounts = {};
    if (Array.isArray(props.summary?.lines)) {
      for (const line of props.summary.lines) {
        if (props.prefillLineId != null) {
          initialAmounts[line.id] =
            line.id === props.prefillLineId
              ? line.remainingAmount > 0
                ? line.remainingAmount
                : 0
              : 0;
        } else {
          initialAmounts[line.id] = line.remainingAmount > 0 ? line.remainingAmount : 0;
        }
      }
    }

    const initialWarehouses = warehouseAutomat.state.warehouses || [];
    const initialSupplierMap =
      props.supplierArticlesMap ||
      (deliveryEditorAutomat?.state?.supplierArticlesMap ?? {});

    this.state = {
      summary: props.summary ?? null,
      loading: !props.summary,
      error: null,
      amountsToBook: initialAmounts,
      transactionText: props.delivery?.externalNumber || (props.delivery?.number
        ? `Lieferung ${props.delivery.number}`
        : 'Lieferung Wareneingang'),
      isBooking: false,
      warehouses: initialWarehouses,
      selectedWarehouseId: initialWarehouses.length === 1 ? initialWarehouses[0].id : '',
      warehouseError: null,
      supplierArticlesMap: initialSupplierMap,
      enablingTrackStockBySku: {},
    };

    this.handleAmountChange = this.handleAmountChange.bind(this);
    this.handleWarehouseChange = this.handleWarehouseChange.bind(this);
    this.handleTransactionTextChange = this.handleTransactionTextChange.bind(this);
    this.handleBookAll = this.handleBookAll.bind(this);
    this.handleResetAmounts = this.handleResetAmounts.bind(this);
    this.handleConfirmBook = this.handleConfirmBook.bind(this);
    this.handleEnableTrackStock = this.handleEnableTrackStock.bind(this);
  }

  loadSupplierArticlesIfNeeded() {
    const supplierId = this.props.delivery?.supplierId ?? this.props.delivery?.partyId;
    if (supplierId && Object.keys(this.state.supplierArticlesMap).length === 0) {
      void supplierApi.get(supplierId).then((res) => {
        const articles = res?.supplier?.articles || res?.articles || [];
        const map = buildSupplierArticlesMap(articles);
        this.setState({ supplierArticlesMap: map });
      }).catch(() => {});
    }
  }

  componentDidMount() {
    this.unsubWarehouse = warehouseAutomat.subscribe((state) => {
      const warehouses = state.warehouses || [];
      this.setState((prev) => {
        const selectedId =
          prev.selectedWarehouseId ||
          (warehouses.length === 1 ? warehouses[0].id : '');
        return {
          warehouses,
          selectedWarehouseId: selectedId,
        };
      });
    });
    this.unsubArticle = artikelAutomat.subscribe(() => {
      this.forceUpdate();
    });
    void warehouseAutomat.actions.load().catch(() => {});
    this.loadSupplierArticlesIfNeeded();

    if (this.props.open) {
      void this.loadSummary();
    }
  }

  componentWillUnmount() {
    this.unsubWarehouse?.();
    this.unsubArticle?.();
  }

  async handleEnableTrackStock(line, targetSku) {
    if (!targetSku) return;
    this.setState((prev) => ({
      enablingTrackStockBySku: {
        ...prev.enablingTrackStockBySku,
        [targetSku]: true,
      },
    }));

    try {
      await artikelAutomat.actions.setTrackStock(targetSku, true);
      this.setState((prev) => {
        if (!prev.summary?.lines) {
          return {
            enablingTrackStockBySku: {
              ...prev.enablingTrackStockBySku,
              [targetSku]: false,
            },
          };
        }
        const updatedLines = prev.summary.lines.map((l) => {
          const rawSku = l.sku ? String(l.sku).trim() : '';
          const lineOwnSku = l.articleSku || l.article?.sku || '';
          if (
            l.id === line.id ||
            rawSku === targetSku ||
            lineOwnSku === targetSku ||
            (l.article && String(l.article.sku) === targetSku)
          ) {
            return {
              ...l,
              trackStock: true,
              article: l.article
                ? { ...l.article, track_stock: true }
                : { sku: targetSku, track_stock: true },
            };
          }
          return l;
        });

        return {
          summary: {
            ...prev.summary,
            hasTrackStock: true,
            lines: updatedLines,
          },
          enablingTrackStockBySku: {
            ...prev.enablingTrackStockBySku,
            [targetSku]: false,
          },
        };
      });
      enqueueSnackbar(`Lagerbestand für „${targetSku}“ aktiviert.`, { variant: 'success' });
    } catch (err) {
      console.error('[BookDeliveryDialog] Failed to enable track_stock:', err);
      enqueueSnackbar(
        err?.message || `Fehler beim Aktivieren des Lagerbestands für „${targetSku}“.`,
        { variant: 'error' }
      );
      this.setState((prev) => ({
        enablingTrackStockBySku: {
          ...prev.enablingTrackStockBySku,
          [targetSku]: false,
        },
      }));
    }
  }

  componentDidUpdate(prevProps) {
    if (this.props.open && !prevProps.open) {
      const currentWarehouses = this.state.warehouses || warehouseAutomat.state.warehouses || [];
      const currentSupplierMap =
        this.props.supplierArticlesMap ||
        (deliveryEditorAutomat?.state?.supplierArticlesMap ?? this.state.supplierArticlesMap ?? {});
      this.setState(
        {
          summary: this.props.summary ?? null,
          loading: !this.props.summary,
          error: null,
          warehouseError: null,
          selectedWarehouseId:
            this.state.selectedWarehouseId ||
            (currentWarehouses.length === 1 ? currentWarehouses[0].id : ''),
          transactionText: this.props.delivery?.externalNumber || (this.props.delivery?.number
            ? `Lieferung ${this.props.delivery.number}`
            : 'Lieferung Wareneingang'),
          isBooking: false,
          supplierArticlesMap: currentSupplierMap,
        },
        () => {
          void warehouseAutomat.actions.load().catch(() => {});
          this.loadSupplierArticlesIfNeeded();
          if (this.props.summary) {
            this.initAmountsFromSummary(this.props.summary, this.props.prefillLineId);
          } else {
            void this.loadSummary();
          }
        }
      );
    } else if (
      this.props.open &&
      (this.props.prefillLineId !== prevProps.prefillLineId ||
        (this.props.summary && this.props.summary !== prevProps.summary)) &&
      !this.state.isBooking
    ) {
      const activeSummary = this.state.summary || this.props.summary;
      if (activeSummary) {
        this.initAmountsFromSummary(activeSummary, this.props.prefillLineId);
      }
    }
  }

  handleWarehouseChange(event) {
    const value = event.target.value;
    this.setState({
      selectedWarehouseId: value ? Number(value) : '',
      warehouseError: null,
    });
  }

  async loadSummary() {
    const { delivery, prefillLineId } = this.props;
    if (!delivery?.id) return;

    this.setState({ loading: true, error: null });
    try {
      const summary = await fetchDeliveryLedgerSummary(delivery.id);
      this.initAmountsFromSummary(summary, prefillLineId);
      this.setState({ summary, loading: false });
    } catch (err) {
      console.error('[BookDeliveryDialog] Failed to load ledger summary:', err);
      this.setState({ error: err.message || 'Laden fehlgeschlagen', loading: false });
    }
  }

  initAmountsFromSummary(summary, prefillLineId = this.props.prefillLineId) {
    const amounts = {};
    if (Array.isArray(summary?.lines)) {
      for (const line of summary.lines) {
        if (prefillLineId != null) {
          amounts[line.id] =
            line.id === prefillLineId
              ? line.remainingAmount > 0
                ? line.remainingAmount
                : 0
              : 0;
        } else {
          amounts[line.id] = line.remainingAmount > 0 ? line.remainingAmount : 0;
        }
      }
    }
    this.setState({ amountsToBook: amounts });
  }

  handleAmountChange(lineId, value) {
    const num = Math.max(0, Number(value) || 0);
    this.setState((prev) => ({
      amountsToBook: {
        ...prev.amountsToBook,
        [lineId]: num,
      },
    }));
  }

  handleTransactionTextChange(e) {
    this.setState({ transactionText: e.target.value });
  }

  handleBookAll() {
    const { summary } = this.state;
    if (!summary?.lines) return;
    const amounts = {};
    for (const line of summary.lines) {
      amounts[line.id] = line.remainingAmount > 0 ? line.remainingAmount : 0;
    }
    this.setState({ amountsToBook: amounts });
  }

  handleResetAmounts() {
    const { summary } = this.state;
    if (!summary?.lines) return;
    const amounts = {};
    for (const line of summary.lines) {
      amounts[line.id] = 0;
    }
    this.setState({ amountsToBook: amounts });
  }

  async handleConfirmBook() {
    const { delivery, onBookSuccess, onClose } = this.props;
    const { summary, amountsToBook, transactionText, selectedWarehouseId } = this.state;
    if (!summary?.lines) return;

    const linesToBook = summary.lines
      .map((line) => ({
        manifestarticleId: line.id,
        sku: line.sku,
        name: line.name,
        amount: Number(amountsToBook[line.id] || 0),
        trackStock: Boolean(line.trackStock),
      }))
      .filter((l) => l.amount > 0);

    if (linesToBook.length === 0) {
      enqueueSnackbar('Keine Mengen zum Buchen angegeben.', { variant: 'info' });
      return;
    }

    const hasTracked = linesToBook.some((l) => l.trackStock);
    if (hasTracked && !selectedWarehouseId) {
      this.setState({ warehouseError: 'Bitte wählen Sie ein Ziellager aus.' });
      enqueueSnackbar('Bitte wählen Sie ein Ziellager aus.', { variant: 'warning' });
      return;
    }

    this.setState({ isBooking: true, error: null, warehouseError: null });
    try {
      await bookDeliveryLines({
        delivery: summary.delivery || delivery,
        linesToBook,
        warehouseId: selectedWarehouseId,
        transactionText,
      });

      const totalBookedQty = linesToBook.reduce((sum, l) => sum + l.amount, 0);
      enqueueSnackbar(
        `${linesToBook.length} Position${linesToBook.length === 1 ? '' : 'en'} (${totalBookedQty} Stk.) erfolgreich gebucht.`,
        { variant: 'success' }
      );

      // Refresh summary
      const updatedSummary = await fetchDeliveryLedgerSummary(delivery.id);

      if (onBookSuccess) {
        onBookSuccess(updatedSummary);
      }
      if (onClose) {
        onClose();
      }
    } catch (err) {
      console.error('[BookDeliveryDialog] Booking failed:', err);
      notifyError(err);
      this.setState({
        error: err.message || 'Buchung fehlgeschlagen',
        isBooking: false,
      });
    }
  }

  renderHeaderInfo({ hasTrackedLinesToBook, isWarehouseMissing } = {}) {
    const { delivery, partyName } = this.props;
    const {
      transactionText,
      isBooking,
      summary,
      warehouses,
      selectedWarehouseId,
      warehouseError,
    } = this.state;
    const isFullyBooked = (summary?.lines?.length ?? 0) > 0 && summary?.status === 'booked';

    return (
      <Box sx={{ mb: 2 }}>
        <Box
          sx={{
            display: 'flex',
            flexWrap: 'wrap',
            gap: 1.5,
            mb: 1.5,
          }}
        >
          <TextField
            size="small"
            label="Datum"
            value={formatDate(delivery?.date) || '–'}
            disabled
            sx={{ flex: { xs: '1 1 100%', sm: '1 1 110px' }, minWidth: { sm: 100 } }}
          />
          <TextField
            size="small"
            label="Lieferant"
            value={partyName || '–'}
            disabled
            sx={{ flex: { xs: '1 1 100%', sm: '2 1 180px' }, minWidth: { sm: 140 } }}
          />
          <TextField
            size="small"
            label="Nummer"
            value={delivery?.number || '–'}
            disabled
            sx={{ flex: { xs: '1 1 100%', sm: '1 1 110px' }, minWidth: { sm: 100 } }}
          />
        </Box>

        <Box
          sx={{
            display: 'flex',
            flexWrap: 'wrap',
            gap: 1.5,
          }}
        >
          <TextField
            size="small"
            label="Referenz"
            value={transactionText}
            onChange={this.handleTransactionTextChange}
            disabled={isBooking || isFullyBooked}
            sx={{ flex: { xs: '1 1 100%', sm: '1 1 200px' } }}
          />
          <FormControl
            size="small"
            required={hasTrackedLinesToBook}
            error={Boolean(warehouseError) || isWarehouseMissing}
            disabled={isBooking || isFullyBooked}
            sx={{ flex: { xs: '1 1 100%', sm: '1 1 200px' } }}
          >
            <InputLabel id="warehouse-select-label">
              Ziellager{hasTrackedLinesToBook ? ' *' : ''}
            </InputLabel>
            <Select
              labelId="warehouse-select-label"
              id="warehouse-select"
              value={selectedWarehouseId ?? ''}
              label={`Ziellager${hasTrackedLinesToBook ? ' *' : ''}`}
              onChange={this.handleWarehouseChange}
              startAdornment={
                <WarehouseIcon
                  sx={{ mr: 1, color: 'text.secondary', fontSize: 20 }}
                />
              }
            >
              {warehouses.length === 0 ? (
                <MenuItem value="" disabled>
                  Keine Lager vorhanden
                </MenuItem>
              ) : (
                warehouses.map((wh) => (
                  <MenuItem key={wh.id} value={wh.id}>
                    {wh.name}
                  </MenuItem>
                ))
              )}
            </Select>
            {warehouseError && (
              <FormHelperText>{warehouseError}</FormHelperText>
            )}
          </FormControl>
        </Box>
      </Box>
    );
  }

  renderLinesTable() {
    const { summary, amountsToBook, isBooking, supplierArticlesMap, enablingTrackStockBySku } = this.state;
    const lines = summary?.lines || [];

    if (lines.length === 0) {
      return (
        <Alert severity="info" sx={{ my: 2 }}>
          Diese Lieferung enthält keine Positionen zum Verbuchen.
        </Alert>
      );
    }

    return (
      <TableContainer component={Paper} variant="outlined" sx={{ mb: 2 }}>
        <Table size="small">
          <TableHead sx={{ backgroundColor: SURFACE_RAISED }}>
            <TableRow>
              <TableCell sx={{ fontWeight: 600, width: 44 }} align="center">Pos.</TableCell>
              <TableCell sx={{ fontWeight: 600 }}>Lieferanten-SKU</TableCell>
              <TableCell sx={{ fontWeight: 600 }}>Eigene SKU</TableCell>
              <TableCell sx={{ fontWeight: 600 }}>EAN</TableCell>
              <TableCell sx={{ fontWeight: 600 }}>Artikel</TableCell>
              <TableCell align="right" sx={{ fontWeight: 600 }}>Bestand</TableCell>
              <TableCell align="right" sx={{ fontWeight: 600 }}>Liefermenge</TableCell>
              <TableCell align="right" sx={{ fontWeight: 600 }}>Bereits gebucht</TableCell>
              <TableCell align="right" sx={{ fontWeight: 600, width: 140 }}>Jetzt verbuchen</TableCell>
            </TableRow>
          </TableHead>
          <TableBody>
            {lines.map((line, index) => {
              const toBook = amountsToBook[line.id] ?? 0;
              const isAlreadyFullyBooked = line.isBooked && line.remainingAmount <= 0;
              const posNumber = line.pos ?? line.position ?? (index + 1);
              const { supplierSku, ownSku } = resolveLineSkus(
                line,
                this.props.delivery,
                supplierArticlesMap
              );
              const cachedArticle =
                line.article ||
                (ownSku && ownSku !== '–' ? getArticle(ownSku) : null) ||
                (line.sku ? getArticle(line.sku) : null);
              const targetSku =
                cachedArticle?.sku ||
                (ownSku && ownSku !== '–' ? ownSku : null) ||
                (line.sku ? String(line.sku).trim() : null);

              if (targetSku && !cachedArticle) {
                void artikelAutomat.actions.loadArticle(targetSku).catch(() => {});
              }

              const isTracked =
                Boolean(line.trackStock) ||
                (cachedArticle?.track_stock !== undefined
                  ? cachedArticle.track_stock !== false &&
                    cachedArticle.track_stock !== 0 &&
                    cachedArticle.track_stock !== '0'
                  : false);

              const isEnablingThis = targetSku ? Boolean(enablingTrackStockBySku?.[targetSku]) : false;

              let currentStock = null;
              if (cachedArticle) {
                if (Array.isArray(cachedArticle.warehouses) && cachedArticle.warehouses.length > 0) {
                  currentStock = cachedArticle.warehouses.reduce(
                    (sum, wh) => sum + (Number(wh.stock) || 0),
                    0
                  );
                } else if (cachedArticle.stock != null) {
                  currentStock = Number(cachedArticle.stock);
                }
              } else if (line.stock != null) {
                currentStock = Number(line.stock);
              }

              const warehouseBreakdown =
                Array.isArray(cachedArticle?.warehouses) && cachedArticle.warehouses.length > 0
                  ? cachedArticle.warehouses
                      .map((w) => `${w.name || 'Lager'}: ${formatStock(w.stock ?? 0)}`)
                      .join(' • ')
                  : null;

              const eans = line.ean
                ? [line.ean]
                : line.eans || cachedArticle?.eans || cachedArticle?.articleean || [];
              const primaryEan = Array.isArray(eans) ? (eans[0] ?? '') : (eans ?? '');

              return (
                <TableRow key={line.id} hover>
                  <TableCell align="center" sx={{ color: 'text.secondary', fontSize: '0.85rem' }}>
                    {posNumber}
                  </TableCell>
                  <TableCell sx={{ fontFamily: 'monospace', fontSize: '0.85rem' }}>
                    {supplierSku}
                  </TableCell>
                  <TableCell sx={{ fontFamily: 'monospace', fontSize: '0.85rem' }}>
                    {ownSku}
                  </TableCell>
                  <TableCell
                    sx={{ fontFamily: 'monospace', fontSize: '0.85rem' }}
                    title={Array.isArray(eans) && eans.length > 1 ? eans.join(', ') : undefined}
                  >
                    {primaryEan || '–'}
                  </TableCell>
                  <TableCell sx={{ maxWidth: 260 }}>
                    <Typography variant="body2" sx={{ fontWeight: 500 }} noWrap>
                      {line.name || '–'}
                    </Typography>
                  </TableCell>
                  <TableCell align="right" title={warehouseBreakdown || undefined}>
                    {isTracked ? (
                      <Typography
                        variant="body2"
                        sx={{
                          fontFamily: 'monospace',
                          fontSize: '0.85rem',
                          color: 'text.primary',
                        }}
                      >
                        {currentStock != null ? formatStock(currentStock) : '0'}
                      </Typography>
                    ) : targetSku ? (
                      <Button
                        size="small"
                        variant="outlined"
                        color="primary"
                        disabled={isBooking || isEnablingThis}
                        onClick={() => this.handleEnableTrackStock(line, targetSku)}
                        startIcon={
                          isEnablingThis ? (
                            <CircularProgress size={12} color="inherit" />
                          ) : (
                            <AddIcon sx={{ fontSize: 13 }} />
                          )
                        }
                        sx={{
                          height: 22,
                          fontSize: '0.68rem',
                          textTransform: 'none',
                          py: 0,
                          px: 0.75,
                          minWidth: 'auto',
                          fontWeight: 600,
                        }}
                      >
                        Aktivieren
                      </Button>
                    ) : (
                      <Typography
                        variant="body2"
                        sx={{
                          fontFamily: 'monospace',
                          fontSize: '0.85rem',
                          color: 'text.disabled',
                        }}
                      >
                        —
                      </Typography>
                    )}
                  </TableCell>
                  <TableCell align="right">
                    <Typography variant="body2" sx={{ fontWeight: 600 }}>
                      {line.targetAmount}
                    </Typography>
                  </TableCell>
                  <TableCell align="right">
                    <Box sx={{ display: 'inline-flex', alignItems: 'center', gap: 0.5, justifyContent: 'flex-end' }}>
                      <Typography
                        variant="body2"
                        color={line.bookedAmount > 0 ? 'success.main' : 'text.secondary'}
                        sx={{ fontWeight: line.bookedAmount > 0 ? 600 : 400 }}
                      >
                        {line.bookedAmount}
                      </Typography>
                      {isAlreadyFullyBooked && (
                        <CheckCircleOutlineOutlinedIcon color="success" sx={{ fontSize: 16 }} />
                      )}
                    </Box>
                  </TableCell>
                  <TableCell align="right">
                    {isAlreadyFullyBooked ? (
                      <Chip
                        size="small"
                        label="Gebucht"
                        color="success"
                        variant="outlined"
                        sx={{ fontSize: '0.75rem', height: 24 }}
                      />
                    ) : (
                      <TextField
                        size="small"
                        type="number"
                        value={toBook}
                        onChange={(e) => this.handleAmountChange(line.id, e.target.value)}
                        disabled={isBooking}
                        slotProps={{
                          htmlInput: {
                            min: 0,
                            step: 1,
                            style: { textAlign: 'right', padding: '4px 8px' },
                          },
                        }}
                        sx={{ width: 90 }}
                      />
                    )}
                  </TableCell>
                </TableRow>
              );
            })}
          </TableBody>
        </Table>
      </TableContainer>
    );
  }

  render() {
    const { open, onClose, delivery } = this.props;
    const {
      summary,
      loading,
      error,
      amountsToBook,
      transactionText,
      isBooking,
      warehouses,
      selectedWarehouseId,
      warehouseError,
    } = this.state;

    const lines = summary?.lines || [];
    const hasLines = lines.length > 0;
    const hasTrackStock = lines.some((l) => l.trackStock);
    const linesWithAmountsToBook = lines.filter(
      (l) => Number(amountsToBook[l.id]) > 0
    );
    const hasTrackedLinesToBook = linesWithAmountsToBook.some((l) => l.trackStock);

    const prefillLine =
      this.props.prefillLineId != null
        ? lines.find((l) => l.id === this.props.prefillLineId)
        : null;
    const totalToBook = lines.reduce(
      (sum, l) => sum + (Number(amountsToBook[l.id]) || 0),
      0
    );
    const countLinesToBook = linesWithAmountsToBook.length;
    const isFullyBooked = hasLines && summary?.status === 'booked';
    const selectedWarehouse = warehouses.find((w) => w.id === selectedWarehouseId);
    const isWarehouseMissing = hasTrackedLinesToBook && !selectedWarehouseId;

    return (
      <AppDialog
        open={Boolean(open)}
        onClose={isBooking ? undefined : onClose}
        maxWidth="lg"
        fullWidth
      >
        <DialogTitle
          sx={{
            display: 'flex',
            alignItems: 'center',
            justifyContent: 'space-between',
            pb: 1,
          }}
        >
          <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>
            <Inventory2OutlinedIcon color="primary" />
            <Typography variant="h6" component="span" sx={{ fontWeight: 600 }}>
              Lieferung verbuchen
            </Typography>
          </Box>
          <IconButton size="small" onClick={onClose} disabled={isBooking}>
            <CloseIcon />
          </IconButton>
        </DialogTitle>

        <DialogContent dividers sx={{ pt: 2, borderBottom: 'none' }}>
          {this.renderHeaderInfo({ hasTrackedLinesToBook, isWarehouseMissing })}

          {loading ? (
            <Box sx={{ display: 'flex', justifyContent: 'center', py: 6, gap: 2, alignItems: 'center' }}>
              <CircularProgress size={24} />
              <Typography color="text.secondary">Lade Positionen und Ledger-Status...</Typography>
            </Box>
          ) : error ? (
            <Alert severity="error" sx={{ my: 2 }}>
              {error}
            </Alert>
          ) : (
            <>
              {prefillLine && (
                <Alert severity="info" sx={{ mb: 2 }}>
                  Vorausgewählt zum Verbuchen: Position{' '}
                  <strong>{prefillLine.sku ? `SKU ${prefillLine.sku}` : prefillLine.name}</strong> ({amountsToBook[prefillLine.id] || 0} Stk.). Andere Positionen stehen auf 0.
                </Alert>
              )}
              {this.renderLinesTable()}

              {hasTrackedLinesToBook && warehouses.length === 0 && !isFullyBooked && (
                <Alert severity="error" sx={{ mb: 2 }}>
                  Es ist noch kein Lager eingerichtet. Für lagergeführte Artikel legen Sie bitte unter „Artikel → Lager“ zuerst ein Lager an.
                </Alert>
              )}

              {isFullyBooked ? (
                <Alert severity="success" icon={<CheckCircleOutlineOutlinedIcon />}>
                  Alle Positionen dieser Lieferung sind bereits vollständig im Ledger verbucht.
                </Alert>
              ) : isWarehouseMissing ? (
                <Alert severity="warning">
                  Bitte wählen Sie ein <strong>Ziellager</strong> aus, um die lagergeführten Artikel zu buchen.
                </Alert>
              ) : countLinesToBook === 0 && hasLines ? (
                <Alert severity="warning">
                  Wählen Sie mindestens eine Menge größer als 0 aus, um Positionen zu verbuchen.
                </Alert>
              ) : null}
            </>
          )}
        </DialogContent>

        <DialogActions sx={{ px: 3, py: 2 }}>
          <Button onClick={onClose} disabled={isBooking} color="inherit">
            {isFullyBooked ? 'Schließen' : 'Abbrechen'}
          </Button>

          {!isFullyBooked && hasLines && (
            <Button
              variant="contained"
              color="primary"
              onClick={this.handleConfirmBook}
              disabled={isBooking || totalToBook <= 0 || loading || isWarehouseMissing}
              startIcon={
                isBooking ? (
                  <CircularProgress size={16} color="inherit" />
                ) : (
                  <Inventory2OutlinedIcon />
                )
              }
              sx={{ minWidth: 160, fontWeight: 600 }}
            >
              {isBooking ? 'Wird gebucht...' : 'Jetzt verbuchen'}
            </Button>
          )}
        </DialogActions>
      </AppDialog>
    );
  }
}