export function freightQuoteCalculator(form: FormTs) {
form.addRow(row => {
row.addTextPanel('header', {
computedValue: () => 'Freight Quote Calculator',
customStyles: { 'font-size': '1.5rem', 'font-weight': '600', 'color': '#1e293b' }
});
});
form.addSpacer({ height: 20 });
// Shipment Type Section
const shipmentSection = form.addSubform('shipment', { title: '🚚 Shipment Type' });
shipmentSection.addRow(row => {
row.addRadioButton('type', {
label: 'Shipment Type',
options: [
{ id: 'ltl', name: 'LTL (Less-Than-Truckload)' },
{ id: 'ftl', name: 'FTL (Full Truckload)' },
{ id: 'partial', name: 'Partial Truckload' }
],
defaultValue: 'ltl',
isRequired: true
});
});
// Cargo Details Section
const cargoSection = form.addSubform('cargo', { title: '📦 Cargo Details' });
cargoSection.addRow(row => {
row.addInteger('weight', {
label: 'Total Weight (lbs)',
min: 1,
max: 45000,
defaultValue: 1500,
isRequired: true
}, '1fr');
row.addInteger('pallets', {
label: 'Number of Pallets',
min: 1,
max: 26,
defaultValue: 2,
isVisible: () => ['ltl', 'partial'].includes(shipmentSection.radioButton('type')?.value() || ''),
tooltip: 'Standard pallets (48x40)'
}, '1fr');
});
cargoSection.addRow(row => {
row.addInteger('length', {
label: 'Length (inches)',
min: 1,
max: 636,
defaultValue: 48,
isVisible: () => shipmentSection.radioButton('type')?.value() === 'ltl'
}, '1fr');
row.addInteger('width', {
label: 'Width (inches)',
min: 1,
max: 102,
defaultValue: 40,
isVisible: () => shipmentSection.radioButton('type')?.value() === 'ltl'
}, '1fr');
row.addInteger('height', {
label: 'Height (inches)',
min: 1,
max: 108,
defaultValue: 48,
isVisible: () => shipmentSection.radioButton('type')?.value() === 'ltl'
}, '1fr');
});
cargoSection.addRow(row => {
row.addDropdown('freightClass', {
label: 'Freight Class',
options: [
{ id: 'auto', name: 'Auto-calculate from dimensions' },
{ id: '50', name: 'Class 50 (50+ lbs/cu ft)' },
{ id: '55', name: 'Class 55 (35-50 lbs/cu ft)' },
{ id: '60', name: 'Class 60 (30-35 lbs/cu ft)' },
{ id: '65', name: 'Class 65 (22.5-30 lbs/cu ft)' },
{ id: '70', name: 'Class 70 (15-22.5 lbs/cu ft)' },
{ id: '77.5', name: 'Class 77.5 (13.5-15 lbs/cu ft)' },
{ id: '85', name: 'Class 85 (12-13.5 lbs/cu ft)' },
{ id: '92.5', name: 'Class 92.5 (10.5-12 lbs/cu ft)' },
{ id: '100', name: 'Class 100 (9-10.5 lbs/cu ft)' },
{ id: '110', name: 'Class 110 (8-9 lbs/cu ft)' },
{ id: '125', name: 'Class 125 (7-8 lbs/cu ft)' },
{ id: '150', name: 'Class 150 (6-7 lbs/cu ft)' },
{ id: '175', name: 'Class 175 (5-6 lbs/cu ft)' },
{ id: '200', name: 'Class 200 (4-5 lbs/cu ft)' },
{ id: '250', name: 'Class 250 (3-4 lbs/cu ft)' },
{ id: '300', name: 'Class 300 (2-3 lbs/cu ft)' },
{ id: '400', name: 'Class 400 (1-2 lbs/cu ft)' },
{ id: '500', name: 'Class 500 (<1 lb/cu ft)' }
],
defaultValue: 'auto',
isVisible: () => shipmentSection.radioButton('type')?.value() === 'ltl'
});
});
cargoSection.addRow(row => {
row.addDropdown('commodityType', {
label: 'Commodity Type',
options: [
{ id: 'general', name: 'General Freight' },
{ id: 'machinery', name: 'Machinery / Equipment' },
{ id: 'food', name: 'Food / Beverages' },
{ id: 'electronics', name: 'Electronics' },
{ id: 'furniture', name: 'Furniture' },
{ id: 'building', name: 'Building Materials' },
{ id: 'chemicals', name: 'Chemicals (non-hazmat)' },
{ id: 'automotive', name: 'Automotive Parts' }
],
defaultValue: 'general'
});
});
// Route Section
const routeSection = form.addSubform('route', { title: '📍 Route' });
routeSection.addRow(row => {
row.addAddress('originAddress', {
label: 'Pickup Location',
placeholder: 'Enter pickup address...',
restrictToCountries: ['US'],
distanceUnit: 'miles',
isRequired: true
});
});
routeSection.addRow(row => {
row.addAddress('destAddress', {
label: 'Delivery Location',
placeholder: 'Enter delivery address...',
showMap: true,
showDistance: true,
referenceAddress: () => routeSection.address('originAddress')?.value() ?? null,
restrictToCountries: ['US'],
distanceUnit: 'miles',
isRequired: true
});
});
routeSection.addRow(row => {
row.addTextPanel('routeInfo', {
computedValue: () => {
const destField = routeSection.address('destAddress');
const miles = destField?.distance();
if (miles == null) return 'Enter both addresses to calculate route';
return `📍 Route Distance: ${Math.round(miles).toLocaleString()} miles`;
},
customStyles: { 'font-size': '0.9rem', 'color': '#0369a1', 'background': '#e0f2fe', 'padding': '10px', 'border-radius': '6px' }
});
});
// Helper to get distance from addresses
const getDistance = () => {
const destField = routeSection.address('destAddress');
return destField?.distance() ?? 800; // default 800 miles
};
// Service Level Section
const serviceSection = form.addSubform('service', { title: '⚡ Service Level' });
serviceSection.addRow(row => {
row.addDropdown('serviceLevel', {
label: 'Service Level',
options: [
{ id: 'economy', name: 'Economy (7-10 days)' },
{ id: 'standard', name: 'Standard (5-7 days)' },
{ id: 'expedited', name: 'Expedited (3-5 days)' },
{ id: 'guaranteed', name: 'Guaranteed (2-3 days)' }
],
defaultValue: 'standard',
isRequired: true
});
});
// Accessorials Section
const accessorialsSection = form.addSubform('accessorials', { title: '🔧 Accessorial Services' });
accessorialsSection.addRow(row => {
row.addCheckbox('liftgatePickup', {
label: 'Liftgate at Pickup',
defaultValue: false
}, '1fr');
row.addCheckbox('liftgateDelivery', {
label: 'Liftgate at Delivery',
defaultValue: false
}, '1fr');
});
accessorialsSection.addRow(row => {
row.addCheckbox('residentialPickup', {
label: 'Residential Pickup',
defaultValue: false
}, '1fr');
row.addCheckbox('residentialDelivery', {
label: 'Residential Delivery',
defaultValue: false
}, '1fr');
});
accessorialsSection.addRow(row => {
row.addCheckbox('insidePickup', {
label: 'Inside Pickup',
defaultValue: false
}, '1fr');
row.addCheckbox('insideDelivery', {
label: 'Inside Delivery',
defaultValue: false
}, '1fr');
});
accessorialsSection.addRow(row => {
row.addCheckbox('limitedAccess', {
label: 'Limited Access Location',
defaultValue: false,
tooltip: 'Construction site, farm, church, etc.'
}, '1fr');
row.addCheckbox('appointment', {
label: 'Appointment Scheduling',
defaultValue: false
}, '1fr');
});
accessorialsSection.addRow(row => {
row.addCheckbox('hazmat', {
label: 'Hazardous Materials',
defaultValue: false,
tooltip: 'Requires special handling certification'
}, '1fr');
row.addCheckbox('freezeProtect', {
label: 'Freeze Protection',
defaultValue: false
}, '1fr');
});
form.addSpacer({ height: 20, showLine: true, lineStyle: 'dashed' });
// Quote Section
const quoteSection = form.addSubform('quote', { title: '💰 Freight Quote', isCollapsible: false });
quoteSection.addRow(row => {
row.addTextPanel('calculatedClass', {
computedValue: () => {
if (shipmentSection.radioButton('type')?.value() !== 'ltl') return '';
const selectedClass = cargoSection.dropdown('freightClass')?.value();
if (selectedClass !== 'auto') return `Freight Class: ${selectedClass}`;
const weight = cargoSection.integer('weight')?.value() || 1500;
const length = cargoSection.integer('length')?.value() || 48;
const width = cargoSection.integer('width')?.value() || 40;
const height = cargoSection.integer('height')?.value() || 48;
const cubicFeet = (length * width * height) / 1728;
const density = weight / cubicFeet;
let freightClass = '100';
if (density >= 50) freightClass = '50';
else if (density >= 35) freightClass = '55';
else if (density >= 30) freightClass = '60';
else if (density >= 22.5) freightClass = '65';
else if (density >= 15) freightClass = '70';
else if (density >= 13.5) freightClass = '77.5';
else if (density >= 12) freightClass = '85';
else if (density >= 10.5) freightClass = '92.5';
else if (density >= 9) freightClass = '100';
else if (density >= 8) freightClass = '110';
else if (density >= 7) freightClass = '125';
else if (density >= 6) freightClass = '150';
else if (density >= 5) freightClass = '175';
else if (density >= 4) freightClass = '200';
else if (density >= 3) freightClass = '250';
else if (density >= 2) freightClass = '300';
else if (density >= 1) freightClass = '400';
else freightClass = '500';
return `Calculated Class: ${freightClass} (${(Number(density) || 0).toFixed(1)} lbs/cu ft)`;
},
customStyles: { 'font-size': '0.9rem', 'color': '#0284c7', 'font-weight': '500' },
isVisible: () => shipmentSection.radioButton('type')?.value() === 'ltl'
});
});
quoteSection.addRow(row => {
row.addPriceDisplay('baseFreight', {
label: 'Base Freight',
computedValue: () => {
const type = shipmentSection.radioButton('type')?.value() || 'ltl';
const weight = cargoSection.integer('weight')?.value() || 1500;
const distance = getDistance();
const serviceLevel = serviceSection.dropdown('serviceLevel')?.value() || 'standard';
let baseCost = 0;
if (type === 'ftl') {
// FTL pricing: per mile
const ratePerMile = 2.5;
baseCost = distance * ratePerMile;
baseCost = Math.max(baseCost, 800); // Minimum charge
} else if (type === 'partial') {
// Partial: between LTL and FTL
const ratePerMile = 1.8;
baseCost = distance * ratePerMile + (weight * 0.15);
} else {
// LTL pricing: based on weight, class, and distance
const selectedClass = cargoSection.dropdown('freightClass')?.value() || 'auto';
let freightClass = 100;
if (selectedClass !== 'auto') {
freightClass = parseFloat(selectedClass);
} else {
const length = cargoSection.integer('length')?.value() || 48;
const width = cargoSection.integer('width')?.value() || 40;
const height = cargoSection.integer('height')?.value() || 48;
const cubicFeet = (length * width * height) / 1728;
const density = weight / cubicFeet;
if (density >= 50) freightClass = 50;
else if (density >= 35) freightClass = 55;
else if (density >= 30) freightClass = 60;
else if (density >= 22.5) freightClass = 65;
else if (density >= 15) freightClass = 70;
else if (density >= 13.5) freightClass = 77.5;
else if (density >= 12) freightClass = 85;
else if (density >= 10.5) freightClass = 92.5;
else if (density >= 9) freightClass = 100;
else if (density >= 8) freightClass = 110;
else if (density >= 7) freightClass = 125;
else if (density >= 6) freightClass = 150;
else if (density >= 5) freightClass = 175;
else if (density >= 4) freightClass = 200;
else if (density >= 3) freightClass = 250;
else if (density >= 2) freightClass = 300;
else if (density >= 1) freightClass = 400;
else freightClass = 500;
}
// Base rate per CWT (hundred weight) adjusted by class
const classMultiplier = freightClass / 100;
const distanceMultiplier = 1 + (distance / 2000);
const ratePerCWT = 15 * classMultiplier * distanceMultiplier;
baseCost = (weight / 100) * ratePerCWT;
baseCost = Math.max(baseCost, 150); // Minimum charge
}
// Service level multipliers
const serviceMultipliers: Record<string, number> = {
'economy': 0.85, 'standard': 1, 'expedited': 1.35, 'guaranteed': 1.75
};
baseCost *= serviceMultipliers[serviceLevel] || 1;
return Math.round(baseCost * 100) / 100;
},
variant: 'default'
}, '1fr');
row.addPriceDisplay('fuelSurcharge', {
label: 'Fuel Surcharge (~25%)',
computedValue: () => {
const type = shipmentSection.radioButton('type')?.value() || 'ltl';
const weight = cargoSection.integer('weight')?.value() || 1500;
const distance = getDistance();
const serviceLevel = serviceSection.dropdown('serviceLevel')?.value() || 'standard';
let baseCost = 0;
if (type === 'ftl') {
baseCost = Math.max(distance * 2.5, 800);
} else if (type === 'partial') {
baseCost = distance * 1.8 + (weight * 0.15);
} else {
baseCost = Math.max((weight / 100) * 15 * (1 + distance / 2000), 150);
}
const serviceMultipliers: Record<string, number> = {
'economy': 0.85, 'standard': 1, 'expedited': 1.35, 'guaranteed': 1.75
};
baseCost *= serviceMultipliers[serviceLevel] || 1;
return Math.round(baseCost * 0.25 * 100) / 100;
},
variant: 'default'
}, '1fr');
});
quoteSection.addRow(row => {
row.addPriceDisplay('accessorialCharges', {
label: 'Accessorial Charges',
computedValue: () => {
let charges = 0;
if (accessorialsSection.checkbox('liftgatePickup')?.value()) charges += 85;
if (accessorialsSection.checkbox('liftgateDelivery')?.value()) charges += 85;
if (accessorialsSection.checkbox('residentialPickup')?.value()) charges += 75;
if (accessorialsSection.checkbox('residentialDelivery')?.value()) charges += 75;
if (accessorialsSection.checkbox('insidePickup')?.value()) charges += 125;
if (accessorialsSection.checkbox('insideDelivery')?.value()) charges += 125;
if (accessorialsSection.checkbox('limitedAccess')?.value()) charges += 75;
if (accessorialsSection.checkbox('appointment')?.value()) charges += 35;
if (accessorialsSection.checkbox('hazmat')?.value()) charges += 200;
if (accessorialsSection.checkbox('freezeProtect')?.value()) charges += 150;
return charges;
},
variant: 'default'
});
});
quoteSection.addRow(row => {
row.addPriceDisplay('totalFreight', {
label: 'Total Freight Cost',
computedValue: () => {
const type = shipmentSection.radioButton('type')?.value() || 'ltl';
const weight = cargoSection.integer('weight')?.value() || 1500;
const distance = getDistance();
const serviceLevel = serviceSection.dropdown('serviceLevel')?.value() || 'standard';
let baseCost = 0;
if (type === 'ftl') {
baseCost = Math.max(distance * 2.5, 800);
} else if (type === 'partial') {
baseCost = distance * 1.8 + (weight * 0.15);
} else {
const selectedClass = cargoSection.dropdown('freightClass')?.value() || 'auto';
let freightClass = 100;
if (selectedClass !== 'auto') {
freightClass = parseFloat(selectedClass);
} else {
const length = cargoSection.integer('length')?.value() || 48;
const width = cargoSection.integer('width')?.value() || 40;
const height = cargoSection.integer('height')?.value() || 48;
const cubicFeet = (length * width * height) / 1728;
const density = weight / cubicFeet;
if (density >= 50) freightClass = 50;
else if (density >= 15) freightClass = 70;
else if (density >= 9) freightClass = 100;
else if (density >= 5) freightClass = 175;
else freightClass = 300;
}
const classMultiplier = freightClass / 100;
const distanceMultiplier = 1 + (distance / 2000);
baseCost = Math.max((weight / 100) * 15 * classMultiplier * distanceMultiplier, 150);
}
const serviceMultipliers: Record<string, number> = {
'economy': 0.85, 'standard': 1, 'expedited': 1.35, 'guaranteed': 1.75
};
baseCost *= serviceMultipliers[serviceLevel] || 1;
// Add fuel surcharge
const fuelSurcharge = baseCost * 0.25;
// Add accessorials
let accessorials = 0;
if (accessorialsSection.checkbox('liftgatePickup')?.value()) accessorials += 85;
if (accessorialsSection.checkbox('liftgateDelivery')?.value()) accessorials += 85;
if (accessorialsSection.checkbox('residentialPickup')?.value()) accessorials += 75;
if (accessorialsSection.checkbox('residentialDelivery')?.value()) accessorials += 75;
if (accessorialsSection.checkbox('insidePickup')?.value()) accessorials += 125;
if (accessorialsSection.checkbox('insideDelivery')?.value()) accessorials += 125;
if (accessorialsSection.checkbox('limitedAccess')?.value()) accessorials += 75;
if (accessorialsSection.checkbox('appointment')?.value()) accessorials += 35;
if (accessorialsSection.checkbox('hazmat')?.value()) accessorials += 200;
if (accessorialsSection.checkbox('freezeProtect')?.value()) accessorials += 150;
return Math.round((baseCost + fuelSurcharge + accessorials) * 100) / 100;
},
variant: 'large'
});
});
// Summary Section
const summarySection = form.addSubform('summary', {
title: '📋 Summary',
isCollapsible: false,
sticky: 'bottom'
});
summarySection.addRow(row => {
row.addTextPanel('summaryText', {
computedValue: () => {
const type = shipmentSection.radioButton('type')?.value() || 'ltl';
const weight = cargoSection.integer('weight')?.value() || 1500;
const distance = getDistance();
const originAddr = routeSection.address('originAddress')?.value();
const destAddr = routeSection.address('destAddress')?.value();
const originCity = originAddr?.formattedAddress?.split(',')[0] || 'Origin';
const destCity = destAddr?.formattedAddress?.split(',')[0] || 'Destination';
const typeLabels: Record<string, string> = {
'ltl': 'LTL', 'ftl': 'FTL', 'partial': 'Partial'
};
return `${typeLabels[type]} | ${weight.toLocaleString()} lbs | ${originCity} → ${destCity} (${Math.round(distance)} mi)`;
},
customStyles: { 'font-size': '0.95rem', 'font-weight': '500', 'text-align': 'center', 'color': '#1e293b' }
});
});
summarySection.addRow(row => {
row.addTextPanel('disclaimer', {
computedValue: () => 'Estimate only. Actual rates vary by carrier, fuel prices, and shipment details. Get quotes from multiple carriers.',
customStyles: { 'font-size': '0.8rem', 'color': '#64748b', 'text-align': 'center' }
});
});
form.configureSubmitButton({
label: 'Request Carrier Quotes'
});
}