export function tireServiceCalculator(form: FormTs) {
form.addRow(row => {
row.addTextPanel('header', {
computedValue: () => 'Tire Service Calculator',
customStyles: { 'font-size': '1.5rem', 'font-weight': '600', 'color': '#1e293b' }
});
});
form.addSpacer({ height: 20 });
// Vehicle Information Section
const vehicleSection = form.addSubform('vehicle', { title: '🚗 Vehicle Information' });
vehicleSection.addRow(row => {
row.addDropdown('vehicleType', {
label: 'Vehicle Type',
options: [
{ id: 'sedan', name: 'Sedan/Compact' },
{ id: 'suv', name: 'SUV/Crossover' },
{ id: 'truck', name: 'Pickup Truck' },
{ id: 'van', name: 'Minivan/Van' },
{ id: 'sports', name: 'Sports Car' },
{ id: 'luxury', name: 'Luxury Vehicle' },
{ id: 'commercial', name: 'Commercial Vehicle' }
],
defaultValue: 'sedan',
isRequired: true
}, '1fr');
row.addDropdown('tireSize', {
label: 'Tire Size Category',
options: [
{ id: 'small', name: 'Small (15" and under)' },
{ id: 'medium', name: 'Medium (16"-17")' },
{ id: 'large', name: 'Large (18"-19")' },
{ id: 'xlarge', name: 'Extra Large (20"+)' }
],
defaultValue: 'medium',
isRequired: true
}, '1fr');
});
vehicleSection.addRow(row => {
row.addDropdown('driveType', {
label: 'Drive Type',
options: [
{ id: 'fwd', name: 'Front-Wheel Drive' },
{ id: 'rwd', name: 'Rear-Wheel Drive' },
{ id: 'awd', name: 'All-Wheel Drive' },
{ id: '4wd', name: '4-Wheel Drive' }
],
defaultValue: 'fwd'
}, '1fr');
row.addCheckbox('tpms', {
label: 'Has TPMS (Tire Pressure Monitoring)',
defaultValue: true,
tooltip: 'Most vehicles 2008+ have TPMS'
}, '1fr');
});
// Service Type Section
const serviceSection = form.addSubform('service', { title: '🔧 Service Type' });
serviceSection.addRow(row => {
row.addRadioButton('serviceType', {
label: 'Primary Service',
options: [
{ id: 'new-tires', name: 'New Tires' },
{ id: 'rotation', name: 'Tire Rotation' },
{ id: 'balance', name: 'Balance Only' },
{ id: 'flat-repair', name: 'Flat Repair' },
{ id: 'alignment', name: 'Alignment Only' }
],
defaultValue: 'new-tires',
isRequired: true
});
});
serviceSection.addRow(row => {
row.addDropdown('tireCount', {
label: 'Number of Tires',
options: [
{ id: '1', name: '1 Tire' },
{ id: '2', name: '2 Tires (Axle)' },
{ id: '4', name: '4 Tires (Full Set)' }
],
defaultValue: '4',
isVisible: () => ['new-tires', 'balance', 'flat-repair'].includes(serviceSection.radioButton('serviceType')?.value() || '')
});
});
// Tire Selection Section (for new tires)
const tireSection = form.addSubform('tires', {
title: '🛞 Tire Selection',
isVisible: () => serviceSection.radioButton('serviceType')?.value() === 'new-tires'
});
tireSection.addRow(row => {
row.addDropdown('tireType', {
label: 'Tire Type',
options: [
{ id: 'all-season', name: 'All-Season' },
{ id: 'summer', name: 'Summer Performance' },
{ id: 'winter', name: 'Winter/Snow' },
{ id: 'all-terrain', name: 'All-Terrain' },
{ id: 'mud-terrain', name: 'Mud-Terrain' },
{ id: 'touring', name: 'Touring/Comfort' }
],
defaultValue: 'all-season',
isRequired: true
}, '1fr');
row.addDropdown('tireBrand', {
label: 'Brand Tier',
options: [
{ id: 'economy', name: 'Economy Brand' },
{ id: 'mid-range', name: 'Mid-Range Brand' },
{ id: 'premium', name: 'Premium Brand' },
{ id: 'ultra-premium', name: 'Ultra-Premium/Performance' }
],
defaultValue: 'mid-range',
isRequired: true
}, '1fr');
});
tireSection.addRow(row => {
row.addDropdown('warranty', {
label: 'Mileage Warranty',
options: [
{ id: 'none', name: 'No Warranty' },
{ id: '40k', name: '40,000 Miles' },
{ id: '60k', name: '60,000 Miles' },
{ id: '80k', name: '80,000 Miles' }
],
defaultValue: '60k'
}, '1fr');
row.addCheckbox('runFlat', {
label: 'Run-Flat Tires',
defaultValue: false,
tooltip: 'Run-flat tires cost 30-50% more'
}, '1fr');
});
// Installation Services Section
const installSection = form.addSubform('installation', {
title: '⚙️ Installation Services',
isVisible: () => serviceSection.radioButton('serviceType')?.value() === 'new-tires'
});
installSection.addRow(row => {
row.addCheckbox('mounting', {
label: 'Mount & Balance',
defaultValue: true,
tooltip: 'Required for new tire installation'
}, '1fr');
row.addCheckbox('valveStems', {
label: 'New Valve Stems',
defaultValue: true,
tooltip: 'Recommended with new tires'
}, '1fr');
});
installSection.addRow(row => {
row.addCheckbox('disposal', {
label: 'Old Tire Disposal',
defaultValue: true,
tooltip: 'Environmentally responsible disposal'
}, '1fr');
row.addCheckbox('roadHazard', {
label: 'Road Hazard Protection',
defaultValue: false,
tooltip: 'Covers tire damage from road debris'
}, '1fr');
});
// Additional Services Section
const additionalSection = form.addSubform('additional', { title: '➕ Additional Services' });
additionalSection.addRow(row => {
row.addCheckbox('alignment', {
label: 'Wheel Alignment',
defaultValue: false,
tooltip: 'Recommended with new tires'
}, '1fr');
row.addDropdown('alignmentType', {
label: 'Alignment Type',
options: [
{ id: '2-wheel', name: '2-Wheel (Front)' },
{ id: '4-wheel', name: '4-Wheel Alignment' }
],
defaultValue: '4-wheel',
isVisible: () => additionalSection.checkbox('alignment')?.value() === true ||
serviceSection.radioButton('serviceType')?.value() === 'alignment'
}, '1fr');
});
additionalSection.addRow(row => {
row.addCheckbox('rotation', {
label: 'Tire Rotation',
defaultValue: false,
isVisible: () => serviceSection.radioButton('serviceType')?.value() !== 'rotation' &&
serviceSection.radioButton('serviceType')?.value() !== 'new-tires'
}, '1fr');
row.addCheckbox('tpmsService', {
label: 'TPMS Sensor Service',
defaultValue: false,
tooltip: 'Reset or replace TPMS sensors',
isVisible: () => vehicleSection.checkbox('tpms')?.value() === true
}, '1fr');
});
additionalSection.addRow(row => {
row.addCheckbox('nitrogenFill', {
label: 'Nitrogen Fill',
defaultValue: false,
tooltip: 'Better pressure retention vs air'
}, '1fr');
row.addCheckbox('brakeInspection', {
label: 'Free Brake Inspection',
defaultValue: true,
tooltip: 'Complimentary with tire service'
}, '1fr');
});
form.addSpacer({ height: 20, showLine: true, lineStyle: 'dashed' });
// Results Section
const resultsSection = form.addSubform('results', { title: '📊 Price Breakdown', isCollapsible: false });
const calculatePricing = () => {
const vehicleType = vehicleSection.dropdown('vehicleType')?.value() || 'sedan';
const tireSize = vehicleSection.dropdown('tireSize')?.value() || 'medium';
const hasTpms = vehicleSection.checkbox('tpms')?.value() || false;
const serviceType = serviceSection.radioButton('serviceType')?.value() || 'new-tires';
const tireCount = parseInt(serviceSection.dropdown('tireCount')?.value() || '4');
let tireCost = 0;
let installationCost = 0;
let additionalCost = 0;
// New tire pricing
if (serviceType === 'new-tires') {
const tireType = tireSection.dropdown('tireType')?.value() || 'all-season';
const tireBrand = tireSection.dropdown('tireBrand')?.value() || 'mid-range';
const runFlat = tireSection.checkbox('runFlat')?.value() || false;
// Base tire prices by size
const sizePrices = {
'small': 60,
'medium': 90,
'large': 130,
'xlarge': 180
};
let baseTirePrice = sizePrices[tireSize];
// Brand multiplier
const brandMultipliers = {
'economy': 0.7,
'mid-range': 1.0,
'premium': 1.5,
'ultra-premium': 2.2
};
baseTirePrice *= brandMultipliers[tireBrand];
// Tire type premium
const typePremiums = {
'all-season': 0,
'summer': 20,
'winter': 30,
'all-terrain': 40,
'mud-terrain': 60,
'touring': 15
};
baseTirePrice += typePremiums[tireType];
// Run-flat premium
if (runFlat) baseTirePrice *= 1.4;
// Vehicle type adjustment
const vehiclePremiums = {
'sedan': 1.0,
'suv': 1.15,
'truck': 1.2,
'van': 1.1,
'sports': 1.3,
'luxury': 1.4,
'commercial': 1.25
};
baseTirePrice *= vehiclePremiums[vehicleType];
tireCost = Math.round(baseTirePrice) * tireCount;
// Installation services
if (installSection.checkbox('mounting')?.value()) {
installationCost += 20 * tireCount; // Mount & balance per tire
}
if (installSection.checkbox('valveStems')?.value()) {
installationCost += 3 * tireCount;
}
if (installSection.checkbox('disposal')?.value()) {
installationCost += 4 * tireCount;
}
if (installSection.checkbox('roadHazard')?.value()) {
installationCost += 15 * tireCount;
}
}
// Service-only pricing
if (serviceType === 'rotation') {
installationCost = 30;
} else if (serviceType === 'balance') {
installationCost = 15 * tireCount;
} else if (serviceType === 'flat-repair') {
installationCost = 25 * tireCount;
} else if (serviceType === 'alignment') {
const alignType = additionalSection.dropdown('alignmentType')?.value() || '4-wheel';
installationCost = alignType === '2-wheel' ? 70 : 100;
}
// Additional services
if (additionalSection.checkbox('alignment')?.value() && serviceType !== 'alignment') {
const alignType = additionalSection.dropdown('alignmentType')?.value() || '4-wheel';
additionalCost += alignType === '2-wheel' ? 70 : 100;
}
if (additionalSection.checkbox('rotation')?.value() && serviceType !== 'rotation') {
additionalCost += 30;
}
if (additionalSection.checkbox('tpmsService')?.value() && hasTpms) {
additionalCost += 10 * tireCount;
}
if (additionalSection.checkbox('nitrogenFill')?.value()) {
additionalCost += 8 * (serviceType === 'new-tires' ? tireCount : 4);
}
const subtotal = tireCost + installationCost + additionalCost;
const tax = Math.round(tireCost * 0.07); // Tax on tires only
const total = subtotal + tax;
return {
tireCost,
installationCost,
additionalCost,
subtotal,
tax,
total,
perTire: tireCount > 0 ? Math.round(tireCost / tireCount) : 0
};
};
resultsSection.addRow(row => {
row.addPriceDisplay('tireCost', {
label: 'Tires',
computedValue: () => calculatePricing().tireCost,
variant: 'default',
isVisible: () => serviceSection.radioButton('serviceType')?.value() === 'new-tires'
}, '1fr');
row.addTextPanel('perTire', {
label: 'Per Tire',
computedValue: () => `$${calculatePricing().perTire} each`,
customStyles: { 'font-size': '1rem', 'color': '#64748b' },
isVisible: () => serviceSection.radioButton('serviceType')?.value() === 'new-tires'
}, '1fr');
});
resultsSection.addRow(row => {
row.addPriceDisplay('installationCost', {
label: () => serviceSection.radioButton('serviceType')?.value() === 'new-tires' ? 'Installation Services' : 'Service Cost',
computedValue: () => calculatePricing().installationCost,
variant: 'default'
}, '1fr');
row.addPriceDisplay('additionalCost', {
label: 'Additional Services',
computedValue: () => calculatePricing().additionalCost,
variant: 'default',
isVisible: () => calculatePricing().additionalCost > 0
}, '1fr');
});
resultsSection.addRow(row => {
row.addPriceDisplay('tax', {
label: 'Estimated Tax',
computedValue: () => calculatePricing().tax,
variant: 'default',
isVisible: () => calculatePricing().tax > 0
});
});
// Summary Section
const summarySection = form.addSubform('summary', {
title: '💰 Total Estimate',
isCollapsible: false,
sticky: 'bottom'
});
summarySection.addRow(row => {
row.addPriceDisplay('total', {
label: 'Total Estimate',
computedValue: () => calculatePricing().total,
variant: 'large'
});
});
summarySection.addRow(row => {
row.addTextPanel('note', {
computedValue: () => 'Prices may vary based on exact tire size and current inventory. Call for exact pricing.',
customStyles: { 'font-size': '0.8rem', 'color': '#64748b', 'text-align': 'center' }
});
});
form.configureSubmitButton({
label: 'Schedule Service'
});
}