diff --git a/src/components/PricingView.tsx b/src/components/PricingView.tsx index 06e942a..7a1b733 100644 --- a/src/components/PricingView.tsx +++ b/src/components/PricingView.tsx @@ -599,12 +599,15 @@ export function PricingView({ data, headers, onSaveRow, onCaptureState, onEdit, }); }; - // Column order for sticky positioning - const columnOrder = ['articleNo', 'articleName', 'line', 'classification', 'productType', 'itemToLogistic', 'unitsOuter', 'outerW', 'outerL', 'outerH']; - // Calculate sticky left position for each pinned column const getStickyLeft = useMemo(() => { - const pinnedOrder = columnOrder.filter(k => pinnedColumns.has(k)); + const baseOrder = ['articleNo', 'articleName', 'line', 'classification', 'productType', 'itemToLogistic', 'unitsOuter', 'outerW', 'outerL', 'outerH']; + const dynamicOrder: string[] = []; + pricingEditableCols.forEach(col => dynamicOrder.push(`prc_${col.index}`)); + containerCols.forEach(col => dynamicOrder.push(`con_${col.index}`)); + const fullOrder = [...baseOrder, ...dynamicOrder]; + + const pinnedOrder = fullOrder.filter(k => pinnedColumns.has(k)); return (key: string): number | null => { if (!pinnedColumns.has(key)) return null; const idx = pinnedOrder.indexOf(key); @@ -612,23 +615,31 @@ export function PricingView({ data, headers, onSaveRow, onCaptureState, onEdit, let left = 0; for (let i = 0; i < idx; i++) { const k = pinnedOrder[i]; - left += columnWidths[k] || 100; + const width = k.startsWith('prc_') || k.startsWith('con_') + ? (columnWidths[k] ?? 100) + : (columnWidths[k] || 100); + left += width; } return left; }; - }, [pinnedColumns, columnOrder, columnWidths]); + }, [pinnedColumns, pricingEditableCols, containerCols, columnWidths]); // Calculate z-index for sticky columns (so they stack correctly) const getStickyRank = useMemo(() => { - const pinnedOrder = columnOrder.filter(k => pinnedColumns.has(k)); + const baseOrder = ['articleNo', 'articleName', 'line', 'classification', 'productType', 'itemToLogistic', 'unitsOuter', 'outerW', 'outerL', 'outerH']; + const dynamicOrder: string[] = []; + pricingEditableCols.forEach(col => dynamicOrder.push(`prc_${col.index}`)); + containerCols.forEach(col => dynamicOrder.push(`con_${col.index}`)); + const fullOrder = [...baseOrder, ...dynamicOrder]; + + const pinnedOrder = fullOrder.filter(k => pinnedColumns.has(k)); return (key: string): number | null => { if (!pinnedColumns.has(key)) return null; const idx = pinnedOrder.indexOf(key); if (idx === -1) return null; - // Higher rank = on top return pinnedOrder.length - idx + 10; }; - }, [pinnedColumns, columnOrder]); + }, [pinnedColumns, pricingEditableCols, containerCols]); const isPinned = (key: string) => pinnedColumns.has(key);