export function wholesalePriceCalculator(form: FormTs) {
form.addRow(row => {
row.addTextPanel('header', {
computedValue: () => 'Wholesale Price Calculator',
customStyles: { 'font-size': '1.5rem', 'font-weight': '600', 'color': '#1e293b' }
});
});
form.addSpacer({ height: 20 });
// Product Cost Section
const costSection = form.addSubform('cost', { title: '📦 Product Costs' });
costSection.addRow(row => {
row.addMoney('unitCost', {
label: 'Unit Cost (COGS)',
min: 0.01,
max: 10000,
defaultValue: 15,
isRequired: true,
tooltip: 'Manufacturing or purchase cost per unit'
}, '1fr');
row.addMoney('packaging', {
label: 'Packaging Cost',
min: 0,
max: 100,
defaultValue: 1.5,
tooltip: 'Per unit packaging and labeling'
}, '1fr');
});
costSection.addRow(row => {
row.addDecimal('overhead', {
label: 'Overhead Allocation (%)',
min: 0,
max: 50,
defaultValue: 10,
tooltip: 'Warehouse, admin, and operational costs'
}, '1fr');
row.addMoney('otherCosts', {
label: 'Other Per-Unit Costs',
min: 0,
max: 100,
defaultValue: 0,
tooltip: 'Quality control, handling, etc.'
}, '1fr');
});
// Pricing Strategy Section
const pricingSection = form.addSubform('pricing', { title: '💰 Pricing Strategy' });
pricingSection.addRow(row => {
row.addDecimal('wholesaleMargin', {
label: 'Target Wholesale Margin (%)',
min: 5,
max: 80,
defaultValue: 35,
isRequired: true,
tooltip: 'Your profit margin on wholesale sales'
}, '1fr');
row.addDecimal('retailMultiplier', {
label: 'Suggested Retail Multiplier',
min: 1.5,
max: 5,
defaultValue: 2.2,
tooltip: 'Multiplier for MSRP (2.0 = keystone)'
}, '1fr');
});
pricingSection.addRow(row => {
row.addDropdown('pricingModel', {
label: 'Pricing Model',
options: [
{ id: 'fixed', name: 'Fixed Wholesale Price' },
{ id: 'tiered', name: 'Volume-Based Tiers' },
{ id: 'negotiated', name: 'Negotiated (Quote-Based)' }
],
defaultValue: 'tiered'
});
});
// Volume Discounts Section
const volumeSection = form.addSubform('volume', { title: '📊 Volume Discounts', isVisible: () => pricingSection.dropdown('pricingModel')?.value() === 'tiered' });
volumeSection.addRow(row => {
row.addInteger('tier1Qty', {
label: 'Tier 1 Min Qty',
min: 1,
max: 10000,
defaultValue: 50,
tooltip: 'Minimum for first discount tier'
}, '1fr');
row.addDecimal('tier1Discount', {
label: 'Tier 1 Discount (%)',
min: 0,
max: 30,
defaultValue: 0,
tooltip: 'Base tier - typically no discount'
}, '1fr');
});
volumeSection.addRow(row => {
row.addInteger('tier2Qty', {
label: 'Tier 2 Min Qty',
min: 1,
max: 50000,
defaultValue: 250,
tooltip: 'Minimum for second discount tier'
}, '1fr');
row.addDecimal('tier2Discount', {
label: 'Tier 2 Discount (%)',
min: 0,
max: 40,
defaultValue: 5,
tooltip: 'Discount for medium orders'
}, '1fr');
});
volumeSection.addRow(row => {
row.addInteger('tier3Qty', {
label: 'Tier 3 Min Qty',
min: 1,
max: 100000,
defaultValue: 1000,
tooltip: 'Minimum for third discount tier'
}, '1fr');
row.addDecimal('tier3Discount', {
label: 'Tier 3 Discount (%)',
min: 0,
max: 50,
defaultValue: 10,
tooltip: 'Discount for large orders'
}, '1fr');
});
volumeSection.addRow(row => {
row.addInteger('tier4Qty', {
label: 'Tier 4 Min Qty',
min: 1,
max: 500000,
defaultValue: 5000,
tooltip: 'Minimum for highest discount tier'
}, '1fr');
row.addDecimal('tier4Discount', {
label: 'Tier 4 Discount (%)',
min: 0,
max: 60,
defaultValue: 15,
tooltip: 'Maximum volume discount'
}, '1fr');
});
// Order Section
const orderSection = form.addSubform('order', { title: '🛒 Sample Order' });
orderSection.addRow(row => {
row.addInteger('orderQty', {
label: 'Order Quantity',
min: 1,
max: 1000000,
defaultValue: 500,
isRequired: true,
tooltip: 'Calculate pricing for this quantity'
}, '1fr');
row.addCheckbox('includeShipping', {
label: 'Include Shipping Estimate',
defaultValue: true
}, '1fr');
});
orderSection.addRow(row => {
row.addMoney('shippingPerUnit', {
label: 'Shipping Per Unit',
min: 0,
max: 50,
defaultValue: 2,
isVisible: () => orderSection.checkbox('includeShipping')?.value() ?? false,
tooltip: 'Estimated shipping cost per unit'
}, '1fr');
row.addDropdown('terms', {
label: 'Payment Terms',
options: [
{ id: 'prepaid', name: 'Prepaid' },
{ id: 'net30', name: 'Net 30' },
{ id: 'net60', name: 'Net 60' },
{ id: '2-10-net30', name: '2/10 Net 30' }
],
defaultValue: 'net30'
}, '1fr');
});
form.addSpacer({ height: 20, showLine: true, lineStyle: 'dashed' });
// Pricing Results Section
const resultsSection = form.addSubform('results', { title: '💵 Pricing Results', isCollapsible: false });
resultsSection.addRow(row => {
row.addPriceDisplay('totalUnitCost', {
label: 'Total Unit Cost',
computedValue: () => {
const unitCost = costSection.money('unitCost')?.value() || 15;
const packaging = costSection.money('packaging')?.value() || 1.5;
const overhead = costSection.decimal('overhead')?.value() || 10;
const otherCosts = costSection.money('otherCosts')?.value() || 0;
const baseCost = unitCost + packaging + otherCosts;
const overheadAmount = baseCost * (overhead / 100);
return Math.round((baseCost + overheadAmount) * 100) / 100;
},
variant: 'default'
}, '1fr');
row.addPriceDisplay('baseWholesale', {
label: 'Base Wholesale Price',
computedValue: () => {
const unitCost = costSection.money('unitCost')?.value() || 15;
const packaging = costSection.money('packaging')?.value() || 1.5;
const overhead = costSection.decimal('overhead')?.value() || 10;
const otherCosts = costSection.money('otherCosts')?.value() || 0;
const margin = pricingSection.decimal('wholesaleMargin')?.value() || 35;
const baseCost = unitCost + packaging + otherCosts;
const overheadAmount = baseCost * (overhead / 100);
const totalCost = baseCost + overheadAmount;
const wholesalePrice = totalCost / (1 - margin / 100);
return Math.round(wholesalePrice * 100) / 100;
},
variant: 'default'
}, '1fr');
});
resultsSection.addRow(row => {
row.addPriceDisplay('discountedPrice', {
label: 'Your Wholesale Price (with Volume Discount)',
computedValue: () => {
const unitCost = costSection.money('unitCost')?.value() || 15;
const packaging = costSection.money('packaging')?.value() || 1.5;
const overhead = costSection.decimal('overhead')?.value() || 10;
const otherCosts = costSection.money('otherCosts')?.value() || 0;
const margin = pricingSection.decimal('wholesaleMargin')?.value() || 35;
const pricingModel = pricingSection.dropdown('pricingModel')?.value() || 'tiered';
const orderQty = orderSection.integer('orderQty')?.value() || 500;
const baseCost = unitCost + packaging + otherCosts;
const overheadAmount = baseCost * (overhead / 100);
const totalCost = baseCost + overheadAmount;
const wholesalePrice = totalCost / (1 - margin / 100);
if (pricingModel !== 'tiered') return Math.round(wholesalePrice * 100) / 100;
// Determine discount tier
const tier1Qty = volumeSection.integer('tier1Qty')?.value() || 50;
const tier2Qty = volumeSection.integer('tier2Qty')?.value() || 250;
const tier3Qty = volumeSection.integer('tier3Qty')?.value() || 1000;
const tier4Qty = volumeSection.integer('tier4Qty')?.value() || 5000;
const tier1Discount = volumeSection.decimal('tier1Discount')?.value() || 0;
const tier2Discount = volumeSection.decimal('tier2Discount')?.value() || 5;
const tier3Discount = volumeSection.decimal('tier3Discount')?.value() || 10;
const tier4Discount = volumeSection.decimal('tier4Discount')?.value() || 15;
let discount = tier1Discount;
if (orderQty >= tier4Qty) discount = tier4Discount;
else if (orderQty >= tier3Qty) discount = tier3Discount;
else if (orderQty >= tier2Qty) discount = tier2Discount;
return Math.round(wholesalePrice * (1 - discount / 100) * 100) / 100;
},
variant: 'large'
});
});
resultsSection.addRow(row => {
row.addPriceDisplay('suggestedRetail', {
label: 'Suggested Retail Price (MSRP)',
computedValue: () => {
const unitCost = costSection.money('unitCost')?.value() || 15;
const packaging = costSection.money('packaging')?.value() || 1.5;
const overhead = costSection.decimal('overhead')?.value() || 10;
const otherCosts = costSection.money('otherCosts')?.value() || 0;
const margin = pricingSection.decimal('wholesaleMargin')?.value() || 35;
const retailMultiplier = pricingSection.decimal('retailMultiplier')?.value() || 2.2;
const baseCost = unitCost + packaging + otherCosts;
const overheadAmount = baseCost * (overhead / 100);
const totalCost = baseCost + overheadAmount;
const wholesalePrice = totalCost / (1 - margin / 100);
const retailPrice = wholesalePrice * retailMultiplier;
return Math.round(retailPrice * 100) / 100;
},
variant: 'success'
}, '1fr');
row.addTextPanel('retailerMargin', {
computedValue: () => {
const retailMultiplier = pricingSection.decimal('retailMultiplier')?.value() || 2.2;
const retailerMargin = ((retailMultiplier - 1) / retailMultiplier) * 100;
return `Retailer margin: ${(Number(retailerMargin) || 0).toFixed(1)}%`;
},
customStyles: { 'font-size': '0.9rem', 'color': '#64748b', 'text-align': 'center', 'padding-top': '0.5rem' }
}, '1fr');
});
// Order Total Section
const totalSection = form.addSubform('total', { title: '🧾 Order Total', isCollapsible: false });
totalSection.addRow(row => {
row.addPriceDisplay('orderSubtotal', {
label: 'Order Subtotal',
computedValue: () => {
const unitCost = costSection.money('unitCost')?.value() || 15;
const packaging = costSection.money('packaging')?.value() || 1.5;
const overhead = costSection.decimal('overhead')?.value() || 10;
const otherCosts = costSection.money('otherCosts')?.value() || 0;
const margin = pricingSection.decimal('wholesaleMargin')?.value() || 35;
const pricingModel = pricingSection.dropdown('pricingModel')?.value() || 'tiered';
const orderQty = orderSection.integer('orderQty')?.value() || 500;
const baseCost = unitCost + packaging + otherCosts;
const overheadAmount = baseCost * (overhead / 100);
const totalCost = baseCost + overheadAmount;
const wholesalePrice = totalCost / (1 - margin / 100);
let finalPrice = wholesalePrice;
if (pricingModel === 'tiered') {
const tier1Qty = volumeSection.integer('tier1Qty')?.value() || 50;
const tier2Qty = volumeSection.integer('tier2Qty')?.value() || 250;
const tier3Qty = volumeSection.integer('tier3Qty')?.value() || 1000;
const tier4Qty = volumeSection.integer('tier4Qty')?.value() || 5000;
const tier1Discount = volumeSection.decimal('tier1Discount')?.value() || 0;
const tier2Discount = volumeSection.decimal('tier2Discount')?.value() || 5;
const tier3Discount = volumeSection.decimal('tier3Discount')?.value() || 10;
const tier4Discount = volumeSection.decimal('tier4Discount')?.value() || 15;
let discount = tier1Discount;
if (orderQty >= tier4Qty) discount = tier4Discount;
else if (orderQty >= tier3Qty) discount = tier3Discount;
else if (orderQty >= tier2Qty) discount = tier2Discount;
finalPrice = wholesalePrice * (1 - discount / 100);
}
return Math.round(finalPrice * orderQty * 100) / 100;
},
variant: 'default'
}, '1fr');
row.addPriceDisplay('shipping', {
label: 'Shipping',
computedValue: () => {
if (!orderSection.checkbox('includeShipping')?.value()) return 0;
const orderQty = orderSection.integer('orderQty')?.value() || 500;
const shippingPerUnit = orderSection.money('shippingPerUnit')?.value() || 2;
return Math.round(orderQty * shippingPerUnit * 100) / 100;
},
variant: 'default'
}, '1fr');
});
totalSection.addRow(row => {
row.addPriceDisplay('orderTotal', {
label: 'Order Total',
computedValue: () => {
const unitCost = costSection.money('unitCost')?.value() || 15;
const packaging = costSection.money('packaging')?.value() || 1.5;
const overhead = costSection.decimal('overhead')?.value() || 10;
const otherCosts = costSection.money('otherCosts')?.value() || 0;
const margin = pricingSection.decimal('wholesaleMargin')?.value() || 35;
const pricingModel = pricingSection.dropdown('pricingModel')?.value() || 'tiered';
const orderQty = orderSection.integer('orderQty')?.value() || 500;
const baseCost = unitCost + packaging + otherCosts;
const overheadAmount = baseCost * (overhead / 100);
const totalCost = baseCost + overheadAmount;
const wholesalePrice = totalCost / (1 - margin / 100);
let finalPrice = wholesalePrice;
if (pricingModel === 'tiered') {
const tier4Qty = volumeSection.integer('tier4Qty')?.value() || 5000;
const tier3Qty = volumeSection.integer('tier3Qty')?.value() || 1000;
const tier2Qty = volumeSection.integer('tier2Qty')?.value() || 250;
const tier1Discount = volumeSection.decimal('tier1Discount')?.value() || 0;
const tier2Discount = volumeSection.decimal('tier2Discount')?.value() || 5;
const tier3Discount = volumeSection.decimal('tier3Discount')?.value() || 10;
const tier4Discount = volumeSection.decimal('tier4Discount')?.value() || 15;
let discount = tier1Discount;
if (orderQty >= tier4Qty) discount = tier4Discount;
else if (orderQty >= tier3Qty) discount = tier3Discount;
else if (orderQty >= tier2Qty) discount = tier2Discount;
finalPrice = wholesalePrice * (1 - discount / 100);
}
let total = finalPrice * orderQty;
if (orderSection.checkbox('includeShipping')?.value()) {
const shippingPerUnit = orderSection.money('shippingPerUnit')?.value() || 2;
total += orderQty * shippingPerUnit;
}
return Math.round(total * 100) / 100;
},
variant: 'large'
}, '1fr');
row.addPriceDisplay('yourProfit', {
label: 'Your Profit',
computedValue: () => {
const unitCost = costSection.money('unitCost')?.value() || 15;
const packaging = costSection.money('packaging')?.value() || 1.5;
const overhead = costSection.decimal('overhead')?.value() || 10;
const otherCosts = costSection.money('otherCosts')?.value() || 0;
const margin = pricingSection.decimal('wholesaleMargin')?.value() || 35;
const pricingModel = pricingSection.dropdown('pricingModel')?.value() || 'tiered';
const orderQty = orderSection.integer('orderQty')?.value() || 500;
const baseCost = unitCost + packaging + otherCosts;
const overheadAmount = baseCost * (overhead / 100);
const totalCost = baseCost + overheadAmount;
const wholesalePrice = totalCost / (1 - margin / 100);
let finalPrice = wholesalePrice;
if (pricingModel === 'tiered') {
const tier4Qty = volumeSection.integer('tier4Qty')?.value() || 5000;
const tier3Qty = volumeSection.integer('tier3Qty')?.value() || 1000;
const tier2Qty = volumeSection.integer('tier2Qty')?.value() || 250;
const tier1Discount = volumeSection.decimal('tier1Discount')?.value() || 0;
const tier2Discount = volumeSection.decimal('tier2Discount')?.value() || 5;
const tier3Discount = volumeSection.decimal('tier3Discount')?.value() || 10;
const tier4Discount = volumeSection.decimal('tier4Discount')?.value() || 15;
let discount = tier1Discount;
if (orderQty >= tier4Qty) discount = tier4Discount;
else if (orderQty >= tier3Qty) discount = tier3Discount;
else if (orderQty >= tier2Qty) discount = tier2Discount;
finalPrice = wholesalePrice * (1 - discount / 100);
}
const profit = (finalPrice - totalCost) * orderQty;
return Math.round(profit * 100) / 100;
},
variant: 'success'
}, '1fr');
});
// Summary Section
const summarySection = form.addSubform('summary', {
title: '📋 Summary',
isCollapsible: false,
sticky: 'bottom'
});
summarySection.addRow(row => {
row.addTextPanel('summaryText', {
computedValue: () => {
const orderQty = orderSection.integer('orderQty')?.value() || 500;
const margin = pricingSection.decimal('wholesaleMargin')?.value() || 35;
const pricingModel = pricingSection.dropdown('pricingModel')?.value() || 'tiered';
const modelLabels: Record<string, string> = {
'fixed': 'Fixed pricing', 'tiered': 'Tiered pricing', 'negotiated': 'Quote-based'
};
return `${orderQty.toLocaleString()} units | ${margin}% margin | ${modelLabels[pricingModel]}`;
},
customStyles: { 'font-size': '0.95rem', 'font-weight': '500', 'text-align': 'center', 'color': '#1e293b' }
});
});
summarySection.addRow(row => {
row.addTextPanel('disclaimer', {
computedValue: () => 'Prices are estimates. Actual pricing may vary based on negotiations and order specifics.',
customStyles: { 'font-size': '0.8rem', 'color': '#64748b', 'text-align': 'center' }
});
});
form.configureSubmitButton({
label: 'Generate Quote'
});
}