u
This commit is contained in:
@@ -1,28 +1,21 @@
|
||||
import { PureComponent } from 'react';
|
||||
import Box from '@mui/material/Box';
|
||||
import Button from '@mui/material/Button';
|
||||
import Chip from '@mui/material/Chip';
|
||||
import CircularProgress from '@mui/material/CircularProgress';
|
||||
import Divider from '@mui/material/Divider';
|
||||
import IconButton from '@mui/material/IconButton';
|
||||
import ListItemButton from '@mui/material/ListItemButton';
|
||||
import TextField from '@mui/material/TextField';
|
||||
import Typography from '@mui/material/Typography';
|
||||
import MenuItem from '@mui/material/MenuItem';
|
||||
import PaymentsIcon from '@mui/icons-material/Payments';
|
||||
import AccountBalanceIcon from '@mui/icons-material/AccountBalance';
|
||||
import PointOfSaleIcon from '@mui/icons-material/PointOfSale';
|
||||
import CreditCardIcon from '@mui/icons-material/CreditCard';
|
||||
import AddIcon from '@mui/icons-material/Add';
|
||||
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 SingleLineTextEdit from 'dashgui/SingleLineTextEdit';
|
||||
import FillSpace from 'dashgui/FillSpace';
|
||||
import { PanelTile, PanelTileGrid } from 'dashgui/panels';
|
||||
import BackendError from '../BackendError';
|
||||
import AppDialog from '../AppDialog';
|
||||
import orderAutomat from '../../automats/orderAutomat';
|
||||
import accountAutomat from '../../automats/accountAutomat';
|
||||
import { payment as paymentApi } from '../../api';
|
||||
@@ -31,7 +24,6 @@ import { notifyError } from '../../utils/notify';
|
||||
import { formatPrice } from '../../utils/price';
|
||||
import withNavigate from '../withNavigate';
|
||||
import {
|
||||
formatDate,
|
||||
loadParties,
|
||||
manifestConfig,
|
||||
partyDisplayName,
|
||||
@@ -39,7 +31,6 @@ import {
|
||||
import {
|
||||
YELLOW_PANEL,
|
||||
SURFACE_RAISED,
|
||||
WHITE,
|
||||
} from '../../colors';
|
||||
|
||||
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/>
|
||||
export class OrderPaymentList extends PureComponent {
|
||||
constructor(props) {
|
||||
@@ -348,7 +170,6 @@ export class OrderPaymentList extends PureComponent {
|
||||
partiesById: {},
|
||||
accountsById: {},
|
||||
busyId: null,
|
||||
recordDialogOpen: false,
|
||||
};
|
||||
this._cancelled = false;
|
||||
this.handleRetry = this.handleRetry.bind(this);
|
||||
@@ -461,7 +282,7 @@ export class OrderPaymentList extends PureComponent {
|
||||
}
|
||||
|
||||
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') {
|
||||
return (
|
||||
@@ -526,15 +347,6 @@ export class OrderPaymentList extends PureComponent {
|
||||
{allPayments.length}
|
||||
</Typography>
|
||||
</Box>
|
||||
<Box sx={{ flex: 1 }} />
|
||||
<Button
|
||||
variant="contained"
|
||||
startIcon={<AddIcon />}
|
||||
onClick={() => this.setState({ recordDialogOpen: true })}
|
||||
sx={{ height: 40 }}
|
||||
>
|
||||
Zahlungseingang erfassen
|
||||
</Button>
|
||||
</Box>
|
||||
|
||||
{/* Search Bar */}
|
||||
@@ -594,15 +406,6 @@ export class OrderPaymentList extends PureComponent {
|
||||
/>
|
||||
</PanelTile>
|
||||
</PanelTileGrid>
|
||||
|
||||
{recordDialogOpen && (
|
||||
<RecordPaymentDialog
|
||||
open={recordDialogOpen}
|
||||
orders={items}
|
||||
partiesById={partiesById}
|
||||
onClose={() => this.setState({ recordDialogOpen: false })}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -226,7 +226,7 @@ export const SUB_NAV = {
|
||||
label: 'Zahlungen',
|
||||
title: 'Zahlungen',
|
||||
icon: PaymentsIcon,
|
||||
help: 'Zahlungseingänge erfassen und Auftragszahlungen überwachen',
|
||||
help: 'Auftragszahlungen und Zahlungsjournal überwachen',
|
||||
},
|
||||
{
|
||||
segment: 'versandarten',
|
||||
|
||||
Reference in New Issue
Block a user