u

src/devtools/ChunkCacheMonitor.jsx

@@ -37,10 +37,23 @@ import orderAutomat, {
   MAX_LRU_CHUNKS,
   isOrderPaid,
   isOrderDelivered,
-  subscribeChunkStats,
 } from '../automats/orderAutomat';
+import quoteAutomat from '../automats/quoteAutomat';
 import { formatPrice } from '../utils/price';
 
+function getAutomatFor(target) {
+  return target === 'quote' ? quoteAutomat : orderAutomat;
+}
+
+function getInitialTarget() {
+  if (typeof window !== 'undefined') {
+    const p = window.location.pathname;
+    if (p.startsWith('/auftrag/bestellung')) return 'order';
+    if (p.startsWith('/auftrag')) return 'quote';
+  }
+  return 'order';
+}
+
 const PANEL_WIDTH = 680;
 const PANEL_HEIGHT = 520;
 
@@ -72,7 +85,9 @@ function orderGrossTotal(lines) {
 class ChunkCacheMonitor extends PureComponent {
   constructor(props) {
     super(props);
-    const initialStats = orderAutomat.getChunkStats?.() || {
+    const target = getInitialTarget();
+    const automat = getAutomatFor(target);
+    const initialStats = automat.getChunkStats?.() || {
       chunkSize: CHUNK_SIZE,
       maxLruChunks: MAX_LRU_CHUNKS,
       lruChunksCount: 0,
@@ -100,6 +115,7 @@ class ChunkCacheMonitor extends PureComponent {
       open: false,
       position: null,
       tab: 'grid', // 'grid' | 'lru' | 'log'
+      target, // 'quote' | 'order'
       inspectFilterKey: null, // null means follow activeFilterKey
       selectedChunk: null,
       pulseCounter: 0,
@@ -121,10 +137,12 @@ class ChunkCacheMonitor extends PureComponent {
     this.handleApplyFilter = this.handleApplyFilter.bind(this);
     this.handlePrefetchAll = this.handlePrefetchAll.bind(this);
     this.handleReload = this.handleReload.bind(this);
+    this.switchTarget = this.switchTarget.bind(this);
   }
 
   componentDidMount() {
-    this.unsubscribeStats = subscribeChunkStats((stats) => {
+    const automat = getAutomatFor(this.state.target);
+    this.unsubscribeStats = automat.subscribeChunkStats?.((stats) => {
       this.setState((prev) => ({
         stats,
         pulseCounter: prev.pulseCounter + 1,
@@ -132,10 +150,39 @@ class ChunkCacheMonitor extends PureComponent {
     });
 
     window.addEventListener('keydown', this.handleKeyDown);
-    this.customEventListener = () => this.handleToggle();
+    this.customEventListener = (event) => {
+      const reqTarget = event?.detail?.target;
+      if (reqTarget === 'quote' || reqTarget === 'order') {
+        this.switchTarget(reqTarget);
+      } else {
+        const detected = getInitialTarget();
+        if (detected !== this.state.target) {
+          this.switchTarget(detected);
+        }
+      }
+      this.handleToggle();
+    };
     window.addEventListener('dash:toggle-chunk-monitor', this.customEventListener);
   }
 
+  switchTarget(newTarget) {
+    if (newTarget === this.state.target) return;
+    this.unsubscribeStats?.();
+    const automat = getAutomatFor(newTarget);
+    this.unsubscribeStats = automat.subscribeChunkStats?.((stats) => {
+      this.setState((prev) => ({
+        stats,
+        pulseCounter: prev.pulseCounter + 1,
+      }));
+    });
+    this.setState({
+      target: newTarget,
+      stats: automat.getChunkStats?.() || this.state.stats,
+      selectedChunk: null,
+      inspectFilterKey: null,
+    });
+  }
+
   componentWillUnmount() {
     this.unsubscribeStats?.();
     window.removeEventListener('keydown', this.handleKeyDown);
@@ -204,51 +251,60 @@ class ChunkCacheMonitor extends PureComponent {
 
   handleLoadChunk(chunkIndex, filterKey, e) {
     e?.stopPropagation();
+    const automat = getAutomatFor(this.state.target);
     const targetFilter = filterKey || this.getInspectedFilterKey();
-    void orderAutomat.actions.loadChunk(chunkIndex, orderAutomat.state.queryEpoch, targetFilter);
+    void automat.actions.loadChunk(chunkIndex, automat.state.queryEpoch, targetFilter);
   }
 
   handleEvictChunk(chunkIndex, filterKey, e) {
     e?.stopPropagation();
+    const automat = getAutomatFor(this.state.target);
     const targetFilter = filterKey || this.getInspectedFilterKey();
-    orderAutomat.evictChunk?.(chunkIndex, targetFilter);
+    automat.evictChunk?.(chunkIndex, targetFilter);
     if (this.state.selectedChunk === chunkIndex) {
       this.setState({ selectedChunk: null });
     }
   }
 
   handleClearCache() {
-    orderAutomat.clearCache?.();
+    const automat = getAutomatFor(this.state.target);
+    automat.clearCache?.();
     this.setState({ selectedChunk: null });
   }
 
   handleClearFilter(filterKey, e) {
     e?.stopPropagation();
-    orderAutomat.clearFilterCache?.(filterKey);
+    const automat = getAutomatFor(this.state.target);
+    automat.clearFilterCache?.(filterKey);
     if (this.state.inspectFilterKey === filterKey) {
       this.setState({ inspectFilterKey: null, selectedChunk: null });
     }
   }
 
   handleApplyFilter(filterKey) {
+    const automat = getAutomatFor(this.state.target);
     const entry = this.state.stats.filterCaches?.find((f) => f.key === filterKey);
     if (!entry) return;
     const p = entry.params || {};
-    orderAutomat.actions.resetFilters();
-    if (p.filter) orderAutomat.actions.filter(p.filter);
-    if (p.onlyUnpaid) orderAutomat.actions.setOnlyUnpaid(true);
-    if (p.onlyUndelivered) orderAutomat.actions.setOnlyUndelivered(true);
-    if (p.negativeSeekMonths) orderAutomat.actions.addNegativeSeek(p.negativeSeekMonths);
+    automat.actions.resetFilters();
+    if (p.filter) automat.actions.filter(p.filter);
+    if (this.state.target === 'order') {
+      if (p.onlyUnpaid) automat.actions.setOnlyUnpaid(true);
+      if (p.onlyUndelivered) automat.actions.setOnlyUndelivered(true);
+    }
+    if (p.negativeSeekMonths) automat.actions.addNegativeSeek(p.negativeSeekMonths);
     this.setState({ inspectFilterKey: null, selectedChunk: null });
   }
 
   handlePrefetchAll(filterKey) {
+    const automat = getAutomatFor(this.state.target);
     const targetFilter = filterKey || this.getInspectedFilterKey();
-    orderAutomat.prefetchAllChunks?.(targetFilter);
+    automat.prefetchAllChunks?.(targetFilter);
   }
 
   handleReload() {
-    void orderAutomat.actions.reload(false);
+    const automat = getAutomatFor(this.state.target);
+    void automat.actions.reload(false);
     this.setState({ selectedChunk: null });
   }
 
@@ -658,9 +714,12 @@ class ChunkCacheMonitor extends PureComponent {
           ) : (
             <Stack spacing={0.5}>
               {chunkOrders.map(({ item: order, index }) => {
-                const paid = isOrderPaid(order);
-                const delivered = isOrderDelivered(order);
-                const gross = orderGrossTotal(order.lines);
+                const isOrd = this.state.target === 'order';
+                const paid = isOrd ? isOrderPaid(order) : false;
+                const delivered = isOrd ? isOrderDelivered(order) : false;
+                const gross = order.grossTotal != null ? Number(order.grossTotal) : orderGrossTotal(order.lines);
+                const customer = order.customerName || (order.entityId ? `Kunde #${order.entityId}` : '–');
+                const posCount = order.positions != null ? order.positions : (order.lines?.length ?? 0);
 
                 return (
                   <Box
@@ -690,20 +749,29 @@ class ChunkCacheMonitor extends PureComponent {
                       {order.date ? new Date(order.date).toLocaleDateString() : '–'}
                     </Typography>
                     <Typography variant="caption" sx={{ flex: 1, overflow: 'hidden', textOverflow: 'ellipsis' }}>
-                      Kunde #{order.entityId || '–'}
+                      {customer}
                     </Typography>
                     <Chip
                       size="small"
-                      label={paid ? 'Bezahlt' : 'Unbezahlt'}
-                      color={paid ? 'success' : 'default'}
-                      sx={{ height: 20, fontSize: '0.7rem' }}
-                    />
-                    <Chip
-                      size="small"
-                      label={delivered ? 'Geliefert' : 'Offen'}
-                      color={delivered ? 'primary' : 'default'}
+                      label={`${posCount} Pos.`}
                       sx={{ height: 20, fontSize: '0.7rem' }}
                     />
+                    {isOrd && (
+                      <>
+                        <Chip
+                          size="small"
+                          label={paid ? 'Bezahlt' : 'Unbezahlt'}
+                          color={paid ? 'success' : 'default'}
+                          sx={{ height: 20, fontSize: '0.7rem' }}
+                        />
+                        <Chip
+                          size="small"
+                          label={delivered ? 'Geliefert' : 'Offen'}
+                          color={delivered ? 'primary' : 'default'}
+                          sx={{ height: 20, fontSize: '0.7rem' }}
+                        />
+                      </>
+                    )}
                     <Typography
                       variant="caption"
                       sx={{ fontWeight: 600, width: 75, textAlign: 'right', fontVariantNumeric: 'tabular-nums' }}
@@ -961,7 +1029,24 @@ class ChunkCacheMonitor extends PureComponent {
                 Chunk-Cache-Monitor
               </Typography>
 
-              <Chip size="small" color="primary" variant="outlined" label="orderAutomat" />
+              <Stack direction="row" spacing={0.5}>
+                <Chip
+                  size="small"
+                  color={this.state.target === 'quote' ? 'primary' : 'default'}
+                  variant={this.state.target === 'quote' ? 'filled' : 'outlined'}
+                  label="Angebote (quoteAutomat)"
+                  onClick={() => this.switchTarget('quote')}
+                  sx={{ cursor: 'pointer', height: 24, fontSize: '0.72rem', fontWeight: this.state.target === 'quote' ? 700 : 500 }}
+                />
+                <Chip
+                  size="small"
+                  color={this.state.target === 'order' ? 'primary' : 'default'}
+                  variant={this.state.target === 'order' ? 'filled' : 'outlined'}
+                  label="Bestellungen (orderAutomat)"
+                  onClick={() => this.switchTarget('order')}
+                  sx={{ cursor: 'pointer', height: 24, fontSize: '0.72rem', fontWeight: this.state.target === 'order' ? 700 : 500 }}
+                />
+              </Stack>
               <Chip
                 size="small"
                 color={lruCount >= maxLru ? 'warning' : 'success'}