seb/dashfront
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: seb:9b40d1db87031e14acaaa0281fdbab5b146d4a63
Branches Tags
seb:main
...
compare: seb:c647068067a3f9278faec4a43335bd4e5836659b
Branches Tags
seb:main

5 Commits
9b40d1db87 ... c647068067

Author SHA1 Message Date
seb
c647068067 u 2026-10-19 01:36:35 +02:00
seb
c77f367216 u 2026-10-19 01:32:39 +02:00
seb
578387adca u 2026-10-19 01:19:34 +02:00
seb
037a2b0ae4 u 2026-10-19 01:04:02 +02:00
seb
eb15bcb83b u 2026-10-19 01:02:08 +02:00
5 changed files with 302 additions and 356 deletions
Expand all files Collapse all files

12
src/api/shipment.js
View File

@@ -54,4 +54,16 @@ export const shipment = {
return http(`/api/shipment/${id}/file/${fileId}`, { method: 'DELETE' }); return http(`/api/shipment/${id}/file/${fileId}`, { method: 'DELETE' });
}, },
// #endregion // #endregion
// #region POST /api/shipment/:id/pdf — createPdf
createPdf(id) {
return http(`/api/shipment/${id}/pdf`, { method: 'POST' });
},
// #endregion
// #region GET /api/shipment/:id/file/:fileId — getFileUrl
getFileUrl(id, fileId) {
return `/api/shipment/${encodeURIComponent(id)}/file/${encodeURIComponent(fileId)}`;
},
// #endregion
}; };

69
src/components/carrier/CarrierItem.jsx
View File

@@ -4,7 +4,6 @@ import IconButton from '@mui/material/IconButton';
import ListItem from '@mui/material/ListItem'; import ListItem from '@mui/material/ListItem';
import Switch from '@mui/material/Switch'; import Switch from '@mui/material/Switch';
import FormControlLabel from '@mui/material/FormControlLabel'; import FormControlLabel from '@mui/material/FormControlLabel';
import Tooltip from '@mui/material/Tooltip';
import Typography from '@mui/material/Typography'; import Typography from '@mui/material/Typography';
import DeleteOutlinedIcon from '@mui/icons-material/DeleteOutlined'; import DeleteOutlinedIcon from '@mui/icons-material/DeleteOutlined';
import DragIndicatorIcon from '@mui/icons-material/DragIndicator'; import DragIndicatorIcon from '@mui/icons-material/DragIndicator';
@@ -158,43 +157,39 @@ class CarrierItem extends PureComponent {
/> />
<Box sx={{ display: 'flex', alignItems: 'center', gap: 1.5, flexShrink: 0 }}> <Box sx={{ display: 'flex', alignItems: 'center', gap: 1.5, flexShrink: 0 }}>
<Tooltip title="Paketverfolgung / Tracking für Sendungen aktivieren"> <FormControlLabel
<FormControlLabel control={
control={ <Switch
<Switch size="small"
size="small" checked={hasPackages}
checked={hasPackages} disabled={disabled || !item}
disabled={disabled || !item} onChange={this.handleToggleHasPackages}
onChange={this.handleToggleHasPackages} />
/> }
} label={
label={ <Typography variant="caption" sx={{ userSelect: 'none', fontWeight: 500 }}>
<Typography variant="caption" sx={{ userSelect: 'none', fontWeight: 500 }}> Pakete
Pakete </Typography>
</Typography> }
} sx={{ m: 0, gap: 0.5 }}
sx={{ m: 0, gap: 0.5 }} />
/>
</Tooltip>
<Tooltip title="Für Retouren / Rücksendungen verwenden"> <FormControlLabel
<FormControlLabel control={
control={ <Switch
<Switch size="small"
size="small" checked={isReverse}
checked={isReverse} disabled={disabled || !item}
disabled={disabled || !item} onChange={this.handleToggleIsReverse}
onChange={this.handleToggleIsReverse} />
/> }
} label={
label={ <Typography variant="caption" sx={{ userSelect: 'none', fontWeight: 500 }}>
<Typography variant="caption" sx={{ userSelect: 'none', fontWeight: 500 }}> Retoure
Retoure </Typography>
</Typography> }
} sx={{ m: 0, gap: 0.5 }}
sx={{ m: 0, gap: 0.5 }} />
/>
</Tooltip>
</Box> </Box>
<IconButton <IconButton

199
src/components/manifest/OrderPaymentList.jsx
View File

@@ -1,28 +1,21 @@
import { PureComponent } from 'react'; import { PureComponent } from 'react';
import Box from '@mui/material/Box'; import Box from '@mui/material/Box';
import Button from '@mui/material/Button';
import Chip from '@mui/material/Chip'; import Chip from '@mui/material/Chip';
import CircularProgress from '@mui/material/CircularProgress'; import CircularProgress from '@mui/material/CircularProgress';
import Divider from '@mui/material/Divider'; import Divider from '@mui/material/Divider';
import IconButton from '@mui/material/IconButton'; import IconButton from '@mui/material/IconButton';
import ListItemButton from '@mui/material/ListItemButton'; import ListItemButton from '@mui/material/ListItemButton';
import TextField from '@mui/material/TextField';
import Typography from '@mui/material/Typography'; import Typography from '@mui/material/Typography';
import MenuItem from '@mui/material/MenuItem';
import PaymentsIcon from '@mui/icons-material/Payments'; import PaymentsIcon from '@mui/icons-material/Payments';
import AccountBalanceIcon from '@mui/icons-material/AccountBalance'; import AccountBalanceIcon from '@mui/icons-material/AccountBalance';
import PointOfSaleIcon from '@mui/icons-material/PointOfSale'; import PointOfSaleIcon from '@mui/icons-material/PointOfSale';
import CreditCardIcon from '@mui/icons-material/CreditCard'; import CreditCardIcon from '@mui/icons-material/CreditCard';
import AddIcon from '@mui/icons-material/Add';
import DeleteOutlinedIcon from '@mui/icons-material/DeleteOutlined'; import DeleteOutlinedIcon from '@mui/icons-material/DeleteOutlined';
import CloseIcon from '@mui/icons-material/Close';
import ArrowForwardIcon from '@mui/icons-material/ArrowForward';
import { enqueueSnackbar } from 'notistack'; import { enqueueSnackbar } from 'notistack';
import SingleLineTextEdit from 'dashgui/SingleLineTextEdit'; import SingleLineTextEdit from 'dashgui/SingleLineTextEdit';
import FillSpace from 'dashgui/FillSpace'; import FillSpace from 'dashgui/FillSpace';
import { PanelTile, PanelTileGrid } from 'dashgui/panels'; import { PanelTile, PanelTileGrid } from 'dashgui/panels';
import BackendError from '../BackendError'; import BackendError from '../BackendError';
import AppDialog from '../AppDialog';
import orderAutomat from '../../automats/orderAutomat'; import orderAutomat from '../../automats/orderAutomat';
import accountAutomat from '../../automats/accountAutomat'; import accountAutomat from '../../automats/accountAutomat';
import { payment as paymentApi } from '../../api'; import { payment as paymentApi } from '../../api';
@@ -31,7 +24,6 @@ import { notifyError } from '../../utils/notify';
import { formatPrice } from '../../utils/price'; import { formatPrice } from '../../utils/price';
import withNavigate from '../withNavigate'; import withNavigate from '../withNavigate';
import { import {
formatDate,
loadParties, loadParties,
manifestConfig, manifestConfig,
partyDisplayName, partyDisplayName,
@@ -39,7 +31,6 @@ import {
import { import {
YELLOW_PANEL, YELLOW_PANEL,
SURFACE_RAISED, SURFACE_RAISED,
WHITE,
} from '../../colors'; } from '../../colors';
const cfg = manifestConfig('order'); const cfg = manifestConfig('order');
@@ -166,175 +157,6 @@ class PaymentTableRow extends PureComponent {
} }
} }
// MARK: <RecordPaymentDialog/>
class RecordPaymentDialog extends PureComponent {
constructor(props) {
super(props);
const orders = props.orders || [];
// Prefer unpaid orders
const unpaidOrders = orders.filter((o) => {
const tot = Number(o.orderTotal) || 0;
const pd = Number(o.paidTotal) || 0;
return tot === 0 || pd < tot;
});
const selectedOrder = unpaidOrders[0] || orders[0] || null;
const remaining = selectedOrder ? Math.max(0, Math.round(((Number(selectedOrder.orderTotal) || 0) - (Number(selectedOrder.paidTotal) || 0)) * 100) / 100) : 0;
const accounts = accountAutomat.state.items || [];
const defaultAccountId = accounts[0]?.id || 1;
this.state = {
orderId: selectedOrder?.id || '',
accountId: defaultAccountId,
type: 'transfer',
amount: remaining > 0 ? String(remaining) : '',
saving: false,
};
this.handleOrderChange = this.handleOrderChange.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);
}
handleOrderChange(newOrderId) {
const order = this.props.orders.find((o) => o.id === Number(newOrderId));
const remaining = order ? Math.max(0, Math.round(((Number(order.orderTotal) || 0) - (Number(order.paidTotal) || 0)) * 100) / 100) : 0;
this.setState({
orderId: newOrderId,
amount: remaining > 0 ? String(remaining) : '',
});
}
async handleSubmit() {
const { onClose, onSuccess } = this.props;
const { orderId, accountId, type, amount } = this.state;
const numAmount = Number(String(amount).replace(',', '.'));
if (!orderId) {
enqueueSnackbar('Bitte einen Auftrag auswählen.', { variant: 'warning' });
return;
}
if (!Number.isFinite(numAmount) || numAmount <= 0) {
enqueueSnackbar('Bitte einen gültigen Betrag größer 0 eingeben.', { variant: 'warning' });
return;
}
this.setState({ saving: true });
try {
await paymentApi.create(orderId, {
accountId: Number(accountId),
type,
amount: numAmount,
});
enqueueSnackbar('Zahlungseingang erfolgreich verbucht!', { variant: 'success' });
await orderAutomat.actions.reload();
onSuccess?.();
onClose();
} catch (err) {
notifyError(err);
this.setState({ saving: false });
}
}
render() {
const { open, onClose, orders, partiesById } = this.props;
const { orderId, accountId, type, amount, saving } = this.state;
const accounts = accountAutomat.state.items || [];
return (
<AppDialog open={open} onClose={onClose} maxWidth="xs" fullWidth>
<Box sx={{ p: 2.5 }}>
<Box sx={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', pb: 2 }}>
<Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>
<PaymentsIcon color="primary" />
<Typography variant="h6" sx={{ fontWeight: 600 }}>
Zahlungseingang erfassen
</Typography>
</Box>
<IconButton onClick={onClose} size="small">
<CloseIcon />
</IconButton>
</Box>
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 2, mb: 3 }}>
<TextField
select
label="Auftrag (Manifest)"
size="small"
value={orderId}
onChange={(e) => this.handleOrderChange(e.target.value)}
fullWidth
>
{orders.map((o) => {
const party = partiesById[o.entityId];
const partyName = partyDisplayName('order', party) || `Kunde #${o.entityId}`;
const tot = Number(o.orderTotal) || 0;
const pd = Number(o.paidTotal) || 0;
const rem = Math.max(0, tot - pd);
return (
<MenuItem key={o.id} value={o.id}>
{o.number} — {partyName} (Offen: {formatPrice(rem)})
</MenuItem>
);
})}
</TextField>
<TextField
select
label="Konto / Kasse (account)"
size="small"
value={accountId}
onChange={(e) => this.setState({ accountId: e.target.value })}
>
{accounts.length > 0 ? (
accounts.map((acc) => (
<MenuItem key={acc.id} value={acc.id}>
{acc.name} ({acc.type})
</MenuItem>
))
) : (
<MenuItem value={1}>Standardkonto</MenuItem>
)}
</TextField>
<TextField
select
label="Zahlungsart (type)"
size="small"
value={type}
onChange={(e) => this.setState({ type: e.target.value })}
>
{PAYMENT_TYPES.map((pt) => (
<MenuItem key={pt.value} value={pt.value}>
{pt.label}
</MenuItem>
))}
</TextField>
<TextField
label="Zahlungsbetrag (€)"
size="small"
type="number"
value={amount}
onChange={(e) => this.setState({ amount: e.target.value })}
slotProps={{ htmlInput: { min: 0.01, step: 'any' } }}
/>
</Box>
<Box sx={{ display: 'flex', justifyContent: 'flex-end', gap: 1.5 }}>
<Button variant="outlined" onClick={onClose} disabled={saving}>
Abbrechen
</Button>
<Button variant="contained" onClick={this.handleSubmit} disabled={saving} startIcon={<PaymentsIcon />}>
{saving ? 'Wird verbucht…' : 'Zahlung buchen'}
</Button>
</Box>
</Box>
</AppDialog>
);
}
}
// MARK: <OrderPaymentList/> // MARK: <OrderPaymentList/>
export class OrderPaymentList extends PureComponent { export class OrderPaymentList extends PureComponent {
constructor(props) { constructor(props) {
@@ -348,7 +170,6 @@ export class OrderPaymentList extends PureComponent {
partiesById: {}, partiesById: {},
accountsById: {}, accountsById: {},
busyId: null, busyId: null,
recordDialogOpen: false,
}; };
this._cancelled = false; this._cancelled = false;
this.handleRetry = this.handleRetry.bind(this); this.handleRetry = this.handleRetry.bind(this);
@@ -461,7 +282,7 @@ export class OrderPaymentList extends PureComponent {
} }
render() { render() {
const { status, error, filter, partiesById, accountsById, busyId, recordDialogOpen, items } = this.state; const { status, error, filter, partiesById, accountsById, busyId } = this.state;
if (status === 'loading' || status === 'idle') { if (status === 'loading' || status === 'idle') {
return ( return (
@@ -526,15 +347,6 @@ export class OrderPaymentList extends PureComponent {
{allPayments.length} {allPayments.length}
</Typography> </Typography>
</Box> </Box>
<Box sx={{ flex: 1 }} />
<Button
variant="contained"
startIcon={<AddIcon />}
onClick={() => this.setState({ recordDialogOpen: true })}
sx={{ height: 40 }}
>
Zahlungseingang erfassen
</Button>
</Box> </Box>
{/* Search Bar */} {/* Search Bar */}
@@ -594,15 +406,6 @@ export class OrderPaymentList extends PureComponent {
/> />
</PanelTile> </PanelTile>
</PanelTileGrid> </PanelTileGrid>
{recordDialogOpen && (
<RecordPaymentDialog
open={recordDialogOpen}
orders={items}
partiesById={partiesById}
onClose={() => this.setState({ recordDialogOpen: false })}
/>
)}
</> </>
); );
} }

376
src/components/manifest/ShipmentDetailDialog.jsx
View File

@@ -24,9 +24,10 @@ import AddIcon from '@mui/icons-material/Add';
import DeleteOutlinedIcon from '@mui/icons-material/DeleteOutlined'; import DeleteOutlinedIcon from '@mui/icons-material/DeleteOutlined';
import CheckCircleOutlineOutlinedIcon from '@mui/icons-material/CheckCircleOutlineOutlined'; import CheckCircleOutlineOutlinedIcon from '@mui/icons-material/CheckCircleOutlineOutlined';
import ContentCopyIcon from '@mui/icons-material/ContentCopy'; import ContentCopyIcon from '@mui/icons-material/ContentCopy';
import PictureAsPdfIcon from '@mui/icons-material/PictureAsPdf';
import { enqueueSnackbar } from 'notistack'; import { enqueueSnackbar } from 'notistack';
import AppDialog from '../AppDialog'; import AppDialog from '../AppDialog';
import { shipment as shipmentApi, shipping as shippingApi } from '../../api'; import { shipment as shipmentApi, shipping as shippingApi, stock as stockApi } from '../../api';
import { notifyError } from '../../utils/notify'; import { notifyError } from '../../utils/notify';
import { formatDate } from './manifestConfig'; import { formatDate } from './manifestConfig';
import orderAutomat from '../../automats/orderAutomat'; import orderAutomat from '../../automats/orderAutomat';
@@ -38,13 +39,11 @@ import { SURFACE_RAISED, WHITE } from '../../colors';
class AddPackageDialog extends PureComponent { class AddPackageDialog extends PureComponent {
constructor(props) { constructor(props) {
super(props); super(props);
const carriers = carrierAutomat.state.carriers || []; const carriers = (carrierAutomat.state.carriers || []).filter((c) => !c.isReverse);
this.state = { this.state = {
carriers, carriers,
carrierId: carriers[0]?.id ?? '', carrierId: carriers[0]?.id ?? '',
trackingCode: '', trackingCode: '',
type: 'parcel',
state: 'draft',
saving: false, saving: false,
}; };
this.handleSubmit = this.handleSubmit.bind(this); this.handleSubmit = this.handleSubmit.bind(this);
@@ -52,7 +51,7 @@ class AddPackageDialog extends PureComponent {
componentDidMount() { componentDidMount() {
this.unsub = carrierAutomat.subscribe(this, (state) => { this.unsub = carrierAutomat.subscribe(this, (state) => {
const carriers = state.carriers || []; const carriers = (state.carriers || []).filter((c) => !c.isReverse);
const currentId = this.state.carrierId; const currentId = this.state.carrierId;
const valid = carriers.some((c) => c.id === currentId); const valid = carriers.some((c) => c.id === currentId);
return { return {
@@ -61,7 +60,7 @@ class AddPackageDialog extends PureComponent {
}; };
}); });
if (carrierAutomat.state.status !== 'ready') { if (carrierAutomat.state.status !== 'ready') {
void carrierAutomat.actions.load().catch(() => {}); void carrierAutomat.actions.load().catch(() => { });
} }
} }
@@ -71,18 +70,39 @@ class AddPackageDialog extends PureComponent {
async handleSubmit() { async handleSubmit() {
const { shipment, onClose, onSuccess } = this.props; const { shipment, onClose, onSuccess } = this.props;
const { carrierId, trackingCode, type, state } = this.state; const { carriers, carrierId, trackingCode } = this.state;
if (!shipment?.id || !carrierId) return; const isShipmentShipped = Boolean(
shipment?.state === 'delivered' ||
shipment?.state === 'shipped' ||
shipment?.state === 'returned' ||
shipment?.shippedAt ||
(shipment?.state && shipment?.state !== 'new')
);
if (!shipment?.id || !carrierId || isShipmentShipped) return;
const selectedCarrier = carriers.find((c) => String(c.id) === String(carrierId));
const hasPackages = Boolean(selectedCarrier?.hasPackages);
const trimmedTracking = hasPackages && trackingCode ? trackingCode.trim() : undefined;
this.setState({ saving: true }); this.setState({ saving: true });
try { try {
await shippingApi.create(shipment.id, { await shippingApi.create(shipment.id, {
carrierId: Number(carrierId), carrierId: Number(carrierId),
trackingCode: trackingCode.trim() || undefined, trackingCode: trimmedTracking || undefined,
type, type: 'parcel',
state, state: 'draft',
}); });
enqueueSnackbar('Paket angelegt.', { variant: 'success' }); const oldPdf = (shipment.files || []).find(
(f) => f.mimetype === 'application/pdf' || f.name?.toLowerCase().endsWith('.pdf')
);
if (oldPdf?.id) {
try {
await shipmentApi.deleteFile(shipment.id, oldPdf.id);
} catch {
// ignore
}
}
enqueueSnackbar('Versandart angelegt.', { variant: 'success' });
await Promise.all([ await Promise.all([
orderAutomat.actions.reload(), orderAutomat.actions.reload(),
shipmentAutomat.actions.reload(), shipmentAutomat.actions.reload(),
@@ -97,15 +117,24 @@ class AddPackageDialog extends PureComponent {
render() { render() {
const { open, onClose, shipment } = this.props; const { open, onClose, shipment } = this.props;
const { carriers, carrierId, trackingCode, type, state, saving } = this.state; const { carriers, carrierId, trackingCode, saving } = this.state;
const canSubmit = Boolean(carrierId) && !saving; const isShipmentShipped = Boolean(
shipment?.state === 'delivered' ||
shipment?.state === 'shipped' ||
shipment?.state === 'returned' ||
shipment?.shippedAt ||
(shipment?.state && shipment?.state !== 'new')
);
const canSubmit = Boolean(carrierId) && !saving && !isShipmentShipped;
const selectedCarrier = carriers.find((c) => String(c.id) === String(carrierId));
const hasPackages = Boolean(selectedCarrier?.hasPackages);
return ( return (
<AppDialog open={open} onClose={onClose} maxWidth="xs" fullWidth> <AppDialog open={open} onClose={onClose} maxWidth="xs" fullWidth>
<Box sx={{ p: 2.5 }}> <Box sx={{ p: 2.5 }}>
<Box sx={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', pb: 2 }}> <Box sx={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', pb: 2 }}>
<Typography variant="h6" sx={{ fontWeight: 600 }}> <Typography variant="h6" sx={{ fontWeight: 600 }}>
Paket zu Lieferschein hinzufügen Versand hinzufügen
</Typography> </Typography>
<IconButton onClick={onClose} size="small"> <IconButton onClick={onClose} size="small">
<CloseIcon /> <CloseIcon />
@@ -118,14 +147,14 @@ class AddPackageDialog extends PureComponent {
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 2, mb: 3 }}> <Box sx={{ display: 'flex', flexDirection: 'column', gap: 2, mb: 3 }}>
<TextField <TextField
select select
label="Versandart (Carrier)" label="Versandart"
size="small" size="small"
value={carrierId} value={carrierId}
onChange={(e) => this.setState({ carrierId: e.target.value })} onChange={(e) => this.setState({ carrierId: e.target.value })}
error={carriers.length === 0} error={carriers.length === 0}
helperText={ helperText={
carriers.length === 0 carriers.length === 0
? 'Keine Versandarten eingerichtet (unter Auftrag → Versandarten anlegen)' ? 'Keine Versandarten eingerichtet'
: undefined : undefined
} }
> >
@@ -136,38 +165,15 @@ class AddPackageDialog extends PureComponent {
))} ))}
</TextField> </TextField>
<TextField {hasPackages && (
label="Tracking-Code / Sendungsnummer" <TextField
size="small" label="Referenz"
value={trackingCode} size="small"
onChange={(e) => this.setState({ trackingCode: e.target.value })} value={trackingCode}
placeholder="z.B. 00340434234234234" onChange={(e) => this.setState({ trackingCode: e.target.value })}
/> placeholder="z.B. Sendungsnummer, Paket-ID oder Referenz"
/>
<TextField )}
select
label="Paketart"
size="small"
value={type}
onChange={(e) => this.setState({ type: e.target.value })}
>
<MenuItem value="parcel">Paket (Parcel)</MenuItem>
<MenuItem value="pallet">Palette (Pallet)</MenuItem>
<MenuItem value="letter">Brief / Dokument</MenuItem>
</TextField>
<TextField
select
label="Status"
size="small"
value={state}
onChange={(e) => this.setState({ state: e.target.value })}
helperText={state === 'shipped' ? 'Bucht bei Auswahl direkt das Lager ab.' : undefined}
>
<MenuItem value="draft">Entwurf (draft)</MenuItem>
<MenuItem value="packed">Gepackt (packed)</MenuItem>
<MenuItem value="shipped">Versendet (shipped — Lagerabbuchung)</MenuItem>
</TextField>
</Box> </Box>
<Box sx={{ display: 'flex', justifyContent: 'flex-end', gap: 1.5 }}> <Box sx={{ display: 'flex', justifyContent: 'flex-end', gap: 1.5 }}>
@@ -175,7 +181,7 @@ class AddPackageDialog extends PureComponent {
Abbrechen Abbrechen
</Button> </Button>
<Button variant="contained" onClick={this.handleSubmit} disabled={!canSubmit}> <Button variant="contained" onClick={this.handleSubmit} disabled={!canSubmit}>
{saving ? 'Wird gespeichert…' : 'Paket anlegen'} {saving ? 'Wird gespeichert…' : 'Hinzufügen'}
</Button> </Button>
</Box> </Box>
</Box> </Box>
@@ -196,11 +202,14 @@ export default class ShipmentDetailDialog extends PureComponent {
error: null, error: null,
addPackageDialogOpen: false, addPackageDialogOpen: false,
busyAction: false, busyAction: false,
pdfLoading: false,
}; };
this.handleRefresh = this.handleRefresh.bind(this); this.handleRefresh = this.handleRefresh.bind(this);
this.handleDeletePackage = this.handleDeletePackage.bind(this); this.handleDeletePackage = this.handleDeletePackage.bind(this);
this.handleMarkPackageShipped = this.handleMarkPackageShipped.bind(this); this.handleMarkPackageShipped = this.handleMarkPackageShipped.bind(this);
this.handleStateChange = this.handleStateChange.bind(this); this.handleStateChange = this.handleStateChange.bind(this);
this.handleDeleteShipment = this.handleDeleteShipment.bind(this);
this.handleOpenPdf = this.handleOpenPdf.bind(this);
} }
componentDidMount() { componentDidMount() {
@@ -240,11 +249,21 @@ export default class ShipmentDetailDialog extends PureComponent {
// #endregion // #endregion
async handleDeletePackage(pkg) { async handleDeletePackage(pkg) {
if (!window.confirm(`Paket „#${pkg.number || pkg.id}“ wirklich löschen?`)) return; if (!window.confirm(`Versandart „#${pkg.number || pkg.id}“ wirklich löschen?`)) return;
this.setState({ busyAction: true }); this.setState({ busyAction: true });
try { try {
await shippingApi.delete(pkg.id); await shippingApi.delete(pkg.id);
enqueueSnackbar('Paket gelöscht.', { variant: 'success' }); const oldPdf = (this.state.shipment?.files || []).find(
(f) => f.mimetype === 'application/pdf' || f.name?.toLowerCase().endsWith('.pdf')
);
if (oldPdf?.id) {
try {
await shipmentApi.deleteFile(this.state.shipment.id, oldPdf.id);
} catch {
// ignore
}
}
enqueueSnackbar('Versandart gelöscht.', { variant: 'success' });
await Promise.all([ await Promise.all([
orderAutomat.actions.reload(), orderAutomat.actions.reload(),
shipmentAutomat.actions.reload(), shipmentAutomat.actions.reload(),
@@ -282,6 +301,29 @@ export default class ShipmentDetailDialog extends PureComponent {
this.setState({ busyAction: true }); this.setState({ busyAction: true });
try { try {
if (newState === 'delivered') {
// 1. Mark any unshipped packages as shipped (triggers backend stock deduction for linked shippings)
const unshippedPackages = (this.state.shipment?.shippings || []).filter(
(p) => p.state !== 'shipped'
);
for (const pkg of unshippedPackages) {
try {
await shippingApi.update(pkg.id, { state: 'shipped' });
} catch (err) {
console.warn('Could not mark shipping as shipped:', err);
}
}
// 2. Ensure stock deduction is executed via stock.ship for the shipment lines
try {
await stockApi.ship({ shipmentId });
} catch (err) {
if (!err?.message?.toLowerCase().includes('already shipped')) {
console.warn('Stock ship warning:', err);
}
}
}
await shipmentApi.update(shipmentId, { state: newState }); await shipmentApi.update(shipmentId, { state: newState });
this.setState((prev) => ({ this.setState((prev) => ({
shipment: { ...prev.shipment, state: newState }, shipment: { ...prev.shipment, state: newState },
@@ -293,6 +335,7 @@ export default class ShipmentDetailDialog extends PureComponent {
shipmentAutomat.actions.reload(), shipmentAutomat.actions.reload(),
]); ]);
this.props.onChanged?.(); this.props.onChanged?.();
await this.handleRefresh();
} catch (err) { } catch (err) {
notifyError(err); notifyError(err);
} finally { } finally {
@@ -300,14 +343,85 @@ export default class ShipmentDetailDialog extends PureComponent {
} }
} }
// MARK: calls shipmentApi.delete
// #region DELETE /api/shipment/:id — delete shipment
async handleDeleteShipment() {
const { shipment } = this.state;
if (!shipment?.id) return;
const label = shipment.number || `Lieferschein #${shipment.id}`;
if (!window.confirm(`Möchten Sie den ${label} wirklich löschen?`)) {
return;
}
this.setState({ busyAction: true });
try {
await shipmentApi.delete(shipment.id);
enqueueSnackbar(`${label} gelöscht.`, { variant: 'success' });
await Promise.all([
orderAutomat.actions.reload(),
shipmentAutomat.actions.reload(),
]);
this.props.onChanged?.();
this.props.onClose();
} catch (err) {
notifyError(err);
this.setState({ busyAction: false });
}
}
// #endregion
// MARK: calls shipmentApi.createPdf and shipmentApi.getFileUrl
// #region POST /api/shipment/:id/pdf & GET file — open PDF
async handleOpenPdf() {
const { shipment } = this.state;
if (!shipment?.id) return;
this.setState({ pdfLoading: true });
try {
const existingPdf = (shipment.files || []).find(
(f) => f.mimetype === 'application/pdf' || f.name?.toLowerCase().endsWith('.pdf')
);
let targetUrl = null;
if (existingPdf) {
targetUrl = shipmentApi.getFileUrl(shipment.id, existingPdf.fileId || existingPdf.id);
} else {
const res = await shipmentApi.createPdf(shipment.id);
const rawUrl = res?.fileUrl || (res?.attachment ? shipmentApi.getFileUrl(shipment.id, res.attachment.fileId || res.attachment.id) : null);
targetUrl = rawUrl ? (rawUrl.startsWith('/api') ? rawUrl : `/api${rawUrl}`) : null;
await this.handleRefresh();
}
if (targetUrl) {
window.open(targetUrl, '_blank');
} else {
enqueueSnackbar('PDF-URL konnte nicht geladen werden.', { variant: 'error' });
}
} catch (err) {
notifyError(err);
} finally {
this.setState({ pdfLoading: false });
}
}
// #endregion
render() { render() {
const { open, onClose } = this.props; const { open, onClose } = this.props;
const { shipment, loading, error, addPackageDialogOpen, busyAction } = this.state; const { shipment, loading, error, addPackageDialogOpen, busyAction, pdfLoading } = this.state;
if (!shipment) return null; if (!shipment) return null;
const shLines = Array.isArray(shipment.lines) ? shipment.lines : []; const shLines = Array.isArray(shipment.lines) ? shipment.lines : [];
const shPackages = Array.isArray(shipment.shippings) ? shipment.shippings : []; const shPackages = Array.isArray(shipment.shippings) ? shipment.shippings : [];
const carriers = carrierAutomat.state.carriers || [];
const isShipmentShipped = Boolean(
shipment.state === 'delivered' ||
shipment.state === 'shipped' ||
shipment.state === 'returned' ||
shipment.shippedAt ||
(shipment.state && shipment.state !== 'new')
);
return ( return (
<AppDialog open={open} onClose={onClose} maxWidth="md" fullWidth> <AppDialog open={open} onClose={onClose} maxWidth="md" fullWidth>
@@ -383,10 +497,11 @@ export default class ShipmentDetailDialog extends PureComponent {
variant="outlined" variant="outlined"
startIcon={<AddIcon />} startIcon={<AddIcon />}
onClick={() => this.setState({ addPackageDialogOpen: true })} onClick={() => this.setState({ addPackageDialogOpen: true })}
disabled={busyAction} disabled={busyAction || isShipmentShipped}
title={isShipmentShipped ? 'Lieferschein ist bereits versendet' : undefined}
sx={{ textTransform: 'none', fontWeight: 600, height: 28, fontSize: '0.75rem' }} sx={{ textTransform: 'none', fontWeight: 600, height: 28, fontSize: '0.75rem' }}
> >
Paket hinzufügen Versand hinzufügen
</Button> </Button>
</Box> </Box>
@@ -394,6 +509,8 @@ export default class ShipmentDetailDialog extends PureComponent {
<Stack spacing={1}> <Stack spacing={1}>
{shPackages.map((pkg) => { {shPackages.map((pkg) => {
const isShipped = pkg.state === 'shipped'; const isShipped = pkg.state === 'shipped';
const carrierObj = carriers.find((c) => Number(c.id) === Number(pkg.carrierId));
const carrierHasPackages = carrierObj ? Boolean(carrierObj.hasPackages) : false;
return ( return (
<Box <Box
key={pkg.id} key={pkg.id}
@@ -412,7 +529,7 @@ export default class ShipmentDetailDialog extends PureComponent {
<Chip size="small" label={`#${pkg.number || pkg.id}`} sx={{ fontWeight: 700 }} /> <Chip size="small" label={`#${pkg.number || pkg.id}`} sx={{ fontWeight: 700 }} />
<Box> <Box>
<Typography variant="subtitle2" sx={{ fontWeight: 700 }}> <Typography variant="subtitle2" sx={{ fontWeight: 700 }}>
{pkg.carrier || 'DHL'} ({pkg.type === 'pallet' ? 'Palette' : 'Paket'}) {pkg.carrier || 'Versand'}
</Typography> </Typography>
{pkg.trackingCode ? ( {pkg.trackingCode ? (
<Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5, mt: 0.25 }}> <Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5, mt: 0.25 }}>
@@ -423,42 +540,34 @@ export default class ShipmentDetailDialog extends PureComponent {
size="small" size="small"
onClick={() => { onClick={() => {
navigator.clipboard.writeText(pkg.trackingCode); navigator.clipboard.writeText(pkg.trackingCode);
enqueueSnackbar('Tracking-Code kopiert!', { variant: 'info' }); enqueueSnackbar('Referenz kopiert!', { variant: 'info' });
}} }}
sx={{ p: 0.25 }} sx={{ p: 0.25 }}
> >
<ContentCopyIcon sx={{ fontSize: 13 }} /> <ContentCopyIcon sx={{ fontSize: 13 }} />
</IconButton> </IconButton>
</Box> </Box>
) : ( ) : null}
<Typography variant="caption" color="text.secondary">
Ohne Tracking
</Typography>
)}
</Box> </Box>
</Box> </Box>
<Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}> <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>
{isShipped ? ( {isShipped ? (
<Chip null
size="small"
color="success"
icon={<CheckCircleOutlineOutlinedIcon />}
label="Versendet (Lager abgebucht)"
sx={{ fontWeight: 600 }}
/>
) : ( ) : (
<> <>
<Button {carrierHasPackages && (
size="small" <Button
variant="contained" size="small"
color="success" variant="contained"
disabled={busyAction} color="success"
onClick={() => this.handleMarkPackageShipped(pkg)} disabled={busyAction}
sx={{ textTransform: 'none', py: 0.25, px: 1, height: 26, fontSize: '0.75rem' }} onClick={() => this.handleMarkPackageShipped(pkg)}
> sx={{ textTransform: 'none', py: 0.25, px: 1, height: 26, fontSize: '0.75rem' }}
Als versendet buchen >
</Button> Als versendet buchen
</Button>
)}
<IconButton <IconButton
size="small" size="small"
color="error" color="error"
@@ -478,51 +587,78 @@ export default class ShipmentDetailDialog extends PureComponent {
</Box> </Box>
</DialogContent> </DialogContent>
<DialogActions sx={{ p: 2, justifyContent: 'flex-end' }}> <DialogActions sx={{ p: 2, display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
{(!shipment.state || shipment.state === 'new') && ( <Button
variant="outlined"
color="error"
startIcon={<DeleteOutlinedIcon />}
disabled={busyAction || shipment.state === 'delivered'}
onClick={this.handleDeleteShipment}
title={shipment.state === 'delivered' ? 'Bereits versendete Lieferscheine können nicht gelöscht werden' : 'Lieferschein löschen'}
sx={{ textTransform: 'none', fontWeight: 600 }}
>
Lieferschein löschen
</Button>
<Stack direction="row" spacing={1.5} sx={{ alignItems: 'center' }}>
<Button <Button
variant="contained"
color="primary"
disabled={busyAction}
onClick={() => this.handleStateChange('delivered')}
sx={{ textTransform: 'none', fontWeight: 700 }}
>
{busyAction ? 'Wird versendet…' : 'Versenden'}
</Button>
)}
{shipment.state === 'delivered' && (
<Button
variant="contained"
color="warning"
disabled={busyAction}
onClick={() => this.handleStateChange('returned')}
sx={{ textTransform: 'none', fontWeight: 700 }}
>
{busyAction ? 'Wird gebucht…' : 'Retoure'}
</Button>
)}
{shipment.state === 'returned' && (
<Chip
label="Retoure"
color="error"
variant="outlined" variant="outlined"
sx={{ fontWeight: 700, height: 28, fontSize: '0.8rem' }} color="inherit"
/> startIcon={pdfLoading ? <CircularProgress size={16} color="inherit" /> : <PictureAsPdfIcon sx={{ color: 'error.main' }} />}
)} disabled={busyAction || pdfLoading}
onClick={this.handleOpenPdf}
sx={{ textTransform: 'none', fontWeight: 600 }}
>
{pdfLoading ? 'PDF wird geladen…' : 'PDF'}
</Button>
{(!shipment.state || shipment.state === 'new') && (
<Button
variant="contained"
color="primary"
disabled={busyAction}
onClick={() => this.handleStateChange('delivered')}
sx={{ textTransform: 'none', fontWeight: 700 }}
>
{busyAction ? 'Wird versendet…' : 'Versenden'}
</Button>
)}
{shipment.state === 'delivered' && (
<Button
variant="contained"
color="warning"
disabled={busyAction}
onClick={() => this.handleStateChange('returned')}
sx={{ textTransform: 'none', fontWeight: 700 }}
>
{busyAction ? 'Wird gebucht…' : 'Retoure'}
</Button>
)}
{shipment.state === 'returned' && (
<Chip
label="Retoure"
color="error"
variant="outlined"
sx={{ fontWeight: 700, height: 28, fontSize: '0.8rem' }}
/>
)}
</Stack>
</DialogActions> </DialogActions>
{addPackageDialogOpen && ( {
<AddPackageDialog addPackageDialogOpen && (
open={addPackageDialogOpen} <AddPackageDialog
shipment={shipment} open={addPackageDialogOpen}
onClose={() => this.setState({ addPackageDialogOpen: false })} shipment={shipment}
onSuccess={async () => { onClose={() => this.setState({ addPackageDialogOpen: false })}
this.props.onChanged?.(); onSuccess={async () => {
await this.handleRefresh(); this.props.onChanged?.();
}} await this.handleRefresh();
/> }}
)} />
</AppDialog> )
}
</AppDialog >
); );
} }
} }

2
src/nav.js
View File

@@ -226,7 +226,7 @@ export const SUB_NAV = {
label: 'Zahlungen', label: 'Zahlungen',
title: 'Zahlungen', title: 'Zahlungen',
icon: PaymentsIcon, icon: PaymentsIcon,
help: 'Zahlungseingänge erfassen und Auftragszahlungen überwachen', help: 'Auftragszahlungen und Zahlungsjournal überwachen',
}, },
{ {
segment: 'versandarten', segment: 'versandarten',