Dicken/dickendock
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Dateien nach "frontend/src/tools" hochladen

Browse Source
This commit is contained in:
Dicken
2026-05-26 00:56:24 +02:00
parent 638b83d26b
commit 360deb7257
1 changed files with 46 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
frontend/src/tools/bestellungen.jsx
View File

@@ -7,6 +7,7 @@ const STATUS = {
in_arbeit: { label:'In Arbeit', color:'#4ecdc4', bg:'rgba(78,205,196,0.12)' },
fertig: { label:'Fertig', color:'#6bcb77', bg:'rgba(107,203,119,0.12)' },
};
const BEZAHLT = { color:'#c084fc', bg:'rgba(192,132,252,0.12)' };
const STATUS_KEYS = ['warteliste','in_arbeit','fertig'];
const PREISE = [
@@ -116,6 +117,19 @@ function BestellungDetail({ id, toast, onBack }) {
{id ? (editMode?'Bearbeiten':order?.name) : 'Neue Bestellung'}
</h1>
{order && !editMode && <StatusBadge status={order.status} onClick={cycleOrderStatus}/>}
{order && !editMode && (
<button
onClick={()=>api(`/tools/bestellungen/${id}`,{method:'PUT',body:{bezahlt:!order.bezahlt}}).then(u=>{setOrder(u);toast(u.bezahlt?'Als bezahlt markiert':'Bezahlung aufgehoben');})}
style={{
background: order.bezahlt ? BEZAHLT.bg : 'rgba(255,255,255,0.05)',
border:`1px solid ${order.bezahlt ? BEZAHLT.color+'55' : 'rgba(255,255,255,0.1)'}`,
borderRadius:20, padding:'4px 12px',
color: order.bezahlt ? BEZAHLT.color : 'rgba(255,255,255,0.4)',
fontFamily:'monospace', fontSize:10, cursor:'pointer', whiteSpace:'nowrap',
}}>
{order.bezahlt ? '💜 Bezahlt' : '○ Bezahlen'}
</button>
)}
{order && !editMode && (
<button onClick={()=>setEditMode(true)} style={{background:'transparent',border:'none',cursor:'pointer',padding:4}}>
<EditIcon size={18} color="rgba(255,255,255,0.5)"/>
@@ -161,9 +175,14 @@ function BestellungDetail({ id, toast, onBack }) {
{order && !editMode && (
<>
{order.bemerkung && (
{(order.bemerkung || order.bezahlt) && (
<div style={{...S.card,marginBottom:10,padding:'10px 14px'}}>
<div style={{color:'rgba(255,255,255,0.45)',fontFamily:'monospace',fontSize:12,lineHeight:1.6}}>{order.bemerkung}</div>
{order.bezahlt && (
<div style={{color:BEZAHLT.color,fontFamily:'monospace',fontSize:11,marginBottom:order.bemerkung?6:0}}>
💜 Bezahlt am {new Date(order.bezahlt_am).toLocaleDateString('de-DE',{day:'2-digit',month:'2-digit',year:'numeric'})}
</div>
)}
{order.bemerkung && <div style={{color:'rgba(255,255,255,0.45)',fontFamily:'monospace',fontSize:12,lineHeight:1.6}}>{order.bemerkung}</div>}
</div>
)}
@@ -370,7 +389,7 @@ export default function Bestellungen({ toast, mobile }) {
const [orders, setOrders] = useState([]);
const [loading, setLoading] = useState(true);
const [search, setSearch] = useState('');
const [filterStatus,setFilter] = useState('alle');
const [filterStatus,setFilter] = useState('warteliste');
const [openId, setOpenId] = useState(null);
const [delId, setDelId] = useState(null);
const [newMode, setNewMode] = useState(false);
@@ -388,7 +407,11 @@ export default function Bestellungen({ toast, mobile }) {
const filtered = orders.filter(o => {
const ms = !search.trim() || o.name.toLowerCase().includes(search.toLowerCase());
const mf = filterStatus==='alle' || o.status===filterStatus;
const mf = filterStatus==='alle'
? true
: filterStatus==='bezahlt'
? o.bezahlt
: o.status===filterStatus && !o.bezahlt;
return ms && mf;
});
@@ -423,11 +446,18 @@ export default function Bestellungen({ toast, mobile }) {
{/* Status-Filter */}
<div style={{display:'flex',gap:6,marginBottom:14,flexWrap:'wrap'}}>
{[['alle','Alle','rgba(255,255,255,0.6)','rgba(255,255,255,0.1)'],...Object.entries(STATUS).map(([k,v])=>[k,v.label,v.color,v.bg])].map(([k,l,c,bg])=>(
{[
['alle', 'Alle', 'rgba(255,255,255,0.6)', 'rgba(255,255,255,0.1)'],
['warteliste', 'Warteliste', '#ffe66d', 'rgba(255,230,109,0.12)'],
['in_arbeit', 'In Arbeit', '#4ecdc4', 'rgba(78,205,196,0.12)' ],
['fertig', 'Fertig', '#6bcb77', 'rgba(107,203,119,0.12)'],
['bezahlt', 'Bezahlt', BEZAHLT.color, BEZAHLT.bg ],
].map(([k,l,col,bg])=>(
<button key={k} onClick={()=>setFilter(k)} style={{
padding:'5px 12px',borderRadius:20,border:`1px solid ${filterStatus===k?c:'rgba(255,255,255,0.1)'}`,
padding:'5px 12px',borderRadius:20,
border:`1px solid ${filterStatus===k?col:'rgba(255,255,255,0.1)'}`,
background:filterStatus===k?bg:'transparent',
color:filterStatus===k?c:'rgba(255,255,255,0.4)',
color:filterStatus===k?col:'rgba(255,255,255,0.4)',
fontFamily:'monospace',fontSize:11,cursor:'pointer',
}}>{l}</button>
))}
@@ -459,7 +489,15 @@ export default function Bestellungen({ toast, mobile }) {
{new Date(order.created_at).toLocaleDateString('de-DE')}
</div>
</button>
<StatusBadge status={order.status} small/>
<div style={{display:'flex',gap:5,alignItems:'center'}}>
{order.bezahlt && (
<span style={{background:BEZAHLT.bg,border:`1px solid ${BEZAHLT.color}44`,
borderRadius:20,padding:'3px 10px',color:BEZAHLT.color,fontFamily:'monospace',fontSize:10}}>
💜 Bezahlt
</span>
)}
{!order.bezahlt && <StatusBadge status={order.status} small/>}
</div>
</div>
{/* Positions-Fortschritt + Festpreis-Summe */}