export function harvestQualityAssessment(form: FormTs) {
// Harvest Quality Assessment Form - Agricultural crop quality grading
// Demonstrates: MatrixQuestion, RatingScale, StarRating, EmojiRating, Slider, CheckboxList, Datepicker, conditional visibility, dynamic styling
// ============================================
// HEADER
// ============================================
form.addRow(row => {
row.addTextPanel('header', {
label: 'Harvest Quality Assessment',
computedValue: () => 'Document crop quality, yield, and harvest conditions',
customStyles: {
backgroundColor: '#15803d',
color: 'white',
padding: '24px',
borderRadius: '12px',
textAlign: 'center'
}
});
});
// ============================================
// SECTION 1: Harvest Details
// ============================================
const detailsSection = form.addSubform('details', {
title: 'Harvest Details',
customStyles: { padding: '16px', borderRadius: '8px', border: '1px solid #e2e8f0' }
});
detailsSection.addRow(row => {
row.addDropdown('cropType', {
label: 'Crop Type',
options: [
{ id: 'wheat', name: 'Wheat' },
{ id: 'corn', name: 'Corn/Maize' },
{ id: 'soybeans', name: 'Soybeans' },
{ id: 'rice', name: 'Rice' },
{ id: 'barley', name: 'Barley' },
{ id: 'tomatoes', name: 'Tomatoes' },
{ id: 'potatoes', name: 'Potatoes' },
{ id: 'apples', name: 'Apples' },
{ id: 'grapes', name: 'Grapes' },
{ id: 'lettuce', name: 'Lettuce/Leafy Greens' },
{ id: 'other', name: 'Other' }
],
placeholder: 'Select crop type',
isRequired: true
}, '1fr');
row.addTextbox('variety', {
label: 'Variety/Cultivar',
placeholder: 'e.g., Red Delicious, Russet'
}, '1fr');
});
detailsSection.addRow(row => {
row.addDatepicker('harvestDate', {
label: 'Harvest Date',
isRequired: true,
maxDate: () => new Date().toISOString().split('T')[0]
}, '1fr');
row.addTextbox('lotId', {
label: 'Lot/Batch ID',
placeholder: 'e.g., LOT-2024-001'
}, '1fr');
});
detailsSection.addRow(row => {
row.addTextbox('fieldLocation', {
label: 'Field/Location',
placeholder: 'e.g., North Field, Block A'
}, '1fr');
row.addTextbox('inspector', {
label: 'Inspector Name',
placeholder: 'Your name',
isRequired: true
}, '1fr');
});
// ============================================
// SECTION 2: Quality Grade
// ============================================
const gradeSection = form.addSubform('grading', {
title: 'Quality Grade',
isVisible: () => detailsSection.dropdown('cropType')?.value() !== null,
customStyles: () => {
const grade = gradeSection.radioButton('qualityGrade')?.value();
if (grade === 'A') return { backgroundColor: '#dcfce7', padding: '16px', borderRadius: '8px', border: '2px solid #22c55e' };
if (grade === 'B') return { backgroundColor: '#d1fae5', padding: '16px', borderRadius: '8px', border: '2px solid #10b981' };
if (grade === 'C') return { backgroundColor: '#fef9c3', padding: '16px', borderRadius: '8px', border: '2px solid #eab308' };
if (grade === 'D') return { backgroundColor: '#fed7aa', padding: '16px', borderRadius: '8px', border: '2px solid #f97316' };
if (grade === 'E') return { backgroundColor: '#fecaca', padding: '16px', borderRadius: '8px', border: '2px solid #ef4444' };
return { padding: '16px', borderRadius: '8px', border: '1px dashed #cbd5e1' };
}
});
gradeSection.addRow(row => {
row.addRadioButton('qualityGrade', {
label: () => {
const crop = detailsSection.dropdown('cropType')?.value();
const cropName = crop ? crop.charAt(0).toUpperCase() + crop.slice(1) : 'Crop';
return `Overall ${cropName} Quality Grade`;
},
options: [
{ id: 'A', name: 'Grade A - Premium/Export Quality' },
{ id: 'B', name: 'Grade B - Good Quality (Minor defects)' },
{ id: 'C', name: 'Grade C - Standard Quality (Some defects)' },
{ id: 'D', name: 'Grade D - Below Standard (Processing only)' },
{ id: 'E', name: 'Grade E - Reject/Unsaleable' }
],
orientation: 'vertical',
isRequired: true
});
});
gradeSection.addRow(row => {
row.addStarRating('visualQuality', {
label: 'Visual Appearance Rating',
maxStars: 5,
size: 'lg',
alignment: 'center',
showConfettiOnMax: true,
tooltip: 'Rate the overall visual appeal of the harvest'
});
});
// ============================================
// SECTION 3: Quality Attributes Matrix
// ============================================
const attributesSection = form.addSubform('attributes', {
title: 'Quality Attributes Assessment',
isVisible: () => gradeSection.radioButton('qualityGrade')?.value() !== null
});
attributesSection.addRow(row => {
row.addTextPanel('attributeInstructions', {
computedValue: () => 'Rate each quality attribute based on your inspection. Select N/A if the attribute does not apply to this crop type.',
customStyles: {
backgroundColor: '#f0fdf4',
padding: '12px 16px',
borderRadius: '8px',
borderLeft: '4px solid #22c55e',
fontSize: '14px'
}
});
});
attributesSection.addRow(row => {
row.addMatrixQuestion('qualityMatrix', {
label: 'Evaluate quality attributes:',
rows: [
{ id: 'size', label: 'Size Uniformity', description: 'Consistency of size within the lot', isRequired: true },
{ id: 'color', label: 'Color', description: 'Appropriate color for ripeness/variety', isRequired: true },
{ id: 'shape', label: 'Shape/Form', description: 'Normal shape without deformities', isRequired: false },
{ id: 'firmness', label: 'Firmness/Texture', description: 'Appropriate firmness for the crop', isRequired: false },
{ id: 'cleanliness', label: 'Cleanliness', description: 'Free from soil, debris, foreign matter', isRequired: true },
{ id: 'moisture', label: 'Moisture Content', description: 'Within acceptable moisture range', isRequired: false }
],
columns: [
{ id: 'na', label: 'N/A' },
{ id: 'poor', label: 'Poor' },
{ id: 'fair', label: 'Fair' },
{ id: 'good', label: 'Good' },
{ id: 'excellent', label: 'Excellent' }
],
striped: true,
fullWidth: true
});
});
// ============================================
// SECTION 4: Defects & Issues
// ============================================
const defectsSection = form.addSubform('defects', {
title: 'Defects & Issues Found',
isVisible: () => gradeSection.radioButton('qualityGrade')?.value() !== null,
customStyles: () => {
const defects = defectsSection.checkboxList('defectsFound')?.value() || [];
if (defects.length > 3) return { backgroundColor: '#fef2f2', padding: '16px', borderRadius: '8px' };
if (defects.length > 0) return { backgroundColor: '#fefce8', padding: '16px', borderRadius: '8px' };
return { backgroundColor: '#f0fdf4', padding: '16px', borderRadius: '8px' };
}
});
defectsSection.addRow(row => {
row.addCheckboxList('defectsFound', {
label: 'Select all defects observed (if any):',
options: [
{ id: 'pest-damage', name: 'Pest/Insect Damage' },
{ id: 'disease', name: 'Disease Symptoms' },
{ id: 'mechanical', name: 'Mechanical Damage (cuts, bruises)' },
{ id: 'sunburn', name: 'Sunburn/Weather Damage' },
{ id: 'rot', name: 'Rot or Decay' },
{ id: 'mold', name: 'Mold/Fungus' },
{ id: 'undersized', name: 'Undersized' },
{ id: 'oversized', name: 'Oversized' },
{ id: 'immature', name: 'Immature/Unripe' },
{ id: 'overripe', name: 'Overripe' },
{ id: 'foreign-matter', name: 'Foreign Matter' },
{ id: 'other', name: 'Other Defects' }
],
orientation: 'vertical'
});
});
defectsSection.addRow(row => {
row.addSlider('defectPercentage', {
label: 'Estimated defect percentage of total harvest',
min: 0,
max: 100,
step: 5,
defaultValue: 0,
unit: '%',
showValue: true,
isVisible: () => {
const defects = defectsSection.checkboxList('defectsFound')?.value() || [];
return defects.length > 0;
}
});
});
defectsSection.addSpacer({ isVisible: () => {
const defects = defectsSection.checkboxList('defectsFound')?.value() || [];
return defects.length > 0;
}});
defectsSection.addRow(row => {
row.addTextarea('defectNotes', {
label: 'Defect details and observations',
placeholder: 'Describe the defects, their severity, and affected areas...',
rows: 3,
autoExpand: true,
isVisible: () => {
const defects = defectsSection.checkboxList('defectsFound')?.value() || [];
return defects.length > 0;
}
});
});
// ============================================
// SECTION 5: Yield Information
// ============================================
const yieldSection = form.addSubform('yield', {
title: 'Yield & Quantity',
isVisible: () => gradeSection.radioButton('qualityGrade')?.value() !== null
});
yieldSection.addRow(row => {
row.addDecimal('harvestQuantity', {
label: 'Harvest Quantity',
placeholder: 'Enter amount',
min: 0
}, '1fr');
row.addDropdown('quantityUnit', {
label: 'Unit',
options: [
{ id: 'kg', name: 'Kilograms (kg)' },
{ id: 'tons', name: 'Metric Tons' },
{ id: 'lbs', name: 'Pounds (lbs)' },
{ id: 'bushels', name: 'Bushels' },
{ id: 'boxes', name: 'Boxes/Crates' },
{ id: 'bins', name: 'Bins' }
],
defaultValue: 'kg'
}, '1fr');
});
yieldSection.addRow(row => {
row.addRatingScale('yieldVsExpected', {
label: 'Yield compared to expectations',
preset: 'likert-5',
lowLabel: 'Much Below Expected',
highLabel: 'Much Above Expected',
alignment: 'center'
});
});
// ============================================
// SECTION 6: Harvest Conditions
// ============================================
const conditionsSection = form.addSubform('conditions', {
title: 'Harvest Conditions',
isVisible: () => gradeSection.radioButton('qualityGrade')?.value() !== null
});
conditionsSection.addRow(row => {
row.addEmojiRating('weatherConditions', {
label: 'Weather conditions during harvest',
preset: 'satisfaction',
size: 'lg',
showLabels: true,
alignment: 'center'
});
});
conditionsSection.addRow(row => {
row.addCheckboxList('harvestMethod', {
label: 'Harvest method used:',
options: [
{ id: 'manual', name: 'Manual/Hand Picking' },
{ id: 'mechanical', name: 'Mechanical Harvester' },
{ id: 'semi-mechanical', name: 'Semi-Mechanical' }
],
orientation: 'horizontal'
}, '1fr');
row.addDropdown('storageDestination', {
label: 'Storage/Destination',
options: [
{ id: 'cold-storage', name: 'Cold Storage' },
{ id: 'warehouse', name: 'Warehouse' },
{ id: 'direct-sale', name: 'Direct to Market' },
{ id: 'processing', name: 'Processing Facility' },
{ id: 'export', name: 'Export' }
],
placeholder: 'Select destination'
}, '1fr');
});
// ============================================
// SECTION 7: Improvement Actions (for low grades)
// ============================================
const improvementSection = form.addSubform('improvements', {
title: 'Recommended Actions',
isVisible: () => {
const grade = gradeSection.radioButton('qualityGrade')?.value();
return grade === 'C' || grade === 'D' || grade === 'E';
},
customStyles: { backgroundColor: '#fef3c7', padding: '16px', borderRadius: '8px' }
});
improvementSection.addRow(row => {
row.addTextPanel('improvementAlert', {
computedValue: () => {
const grade = gradeSection.radioButton('qualityGrade')?.value();
if (grade === 'E') return 'This harvest has been graded as Reject. Please document the issues and recommended disposal or alternative use.';
if (grade === 'D') return 'This harvest is below standard and suitable only for processing. Document actions to prevent similar issues.';
return 'This harvest has quality issues. Please suggest improvements for future harvests.';
},
customStyles: {
backgroundColor: '#fbbf24',
color: '#78350f',
padding: '12px 16px',
borderRadius: '8px',
fontWeight: '500'
}
});
});
improvementSection.addSpacer();
improvementSection.addRow(row => {
row.addTextarea('improvementSuggestions', {
label: 'Suggested improvements for future harvests',
placeholder: 'What could be done differently to improve quality?',
rows: 3,
autoExpand: true
});
});
// ============================================
// SECTION 8: Additional Notes
// ============================================
const notesSection = form.addSubform('notes', {
title: 'Additional Observations',
isVisible: () => gradeSection.radioButton('qualityGrade')?.value() !== null
});
notesSection.addRow(row => {
row.addTextarea('additionalNotes', {
label: 'General comments and observations',
placeholder: 'Any other observations about this harvest...',
rows: 3,
autoExpand: true
});
});
// ============================================
// SECTION 9: Summary
// ============================================
const summarySection = form.addSubform('summary', {
title: 'Assessment Summary',
isVisible: () => gradeSection.radioButton('qualityGrade')?.value() !== null
});
summarySection.addRow(row => {
row.addTextPanel('summaryContent', {
computedValue: () => {
const crop = detailsSection.dropdown('cropType')?.value();
const variety = detailsSection.textbox('variety')?.value();
const date = detailsSection.datepicker('harvestDate')?.value();
const grade = gradeSection.radioButton('qualityGrade')?.value();
const visual = gradeSection.starRating('visualQuality')?.value();
const defects = defectsSection.checkboxList('defectsFound')?.value() || [];
const quantity = yieldSection.decimal('harvestQuantity')?.value();
const unit = yieldSection.dropdown('quantityUnit')?.value();
if (!grade) return '';
const gradeLabels: Record<string, string> = {
'A': 'Premium/Export',
'B': 'Good Quality',
'C': 'Standard',
'D': 'Below Standard',
'E': 'Reject'
};
const gradeEmojis: Record<string, string> = {
'A': '🌟',
'B': '✅',
'C': '⚠️',
'D': '🔶',
'E': '❌'
};
let summary = `${gradeEmojis[grade]} HARVEST QUALITY REPORT\n`;
summary += `${'═'.repeat(30)}\n\n`;
if (crop) {
const cropName = crop.charAt(0).toUpperCase() + crop.slice(1);
summary += `Crop: ${cropName}${variety ? ` (${variety})` : ''}\n`;
}
if (date) summary += `Date: ${date}\n`;
summary += `\nGrade: ${grade} - ${gradeLabels[grade]}\n`;
if (visual) summary += `Visual: ${'★'.repeat(visual)}${'☆'.repeat(5 - visual)}\n`;
if (quantity && unit) {
summary += `\nQuantity: ${quantity} ${unit}\n`;
}
if (defects.length > 0) {
summary += `\nDefects: ${defects.length} issue(s) identified`;
} else {
summary += `\nNo defects found`;
}
return summary;
},
customStyles: () => {
const grade = gradeSection.radioButton('qualityGrade')?.value();
const baseStyles = {
padding: '16px',
borderRadius: '8px',
whiteSpace: 'pre-wrap',
fontFamily: 'monospace',
fontSize: '14px'
};
if (grade === 'A' || grade === 'B') {
return { ...baseStyles, backgroundColor: '#dcfce7', borderLeft: '4px solid #22c55e' };
} else if (grade === 'C') {
return { ...baseStyles, backgroundColor: '#fef9c3', borderLeft: '4px solid #eab308' };
} else if (grade === 'D' || grade === 'E') {
return { ...baseStyles, backgroundColor: '#fecaca', borderLeft: '4px solid #ef4444' };
}
return { ...baseStyles, backgroundColor: '#f8fafc', borderLeft: '4px solid #15803d' };
}
});
});
// ============================================
// FORM CONFIGURATION
// ============================================
form.configureSubmitButton({
label: 'Submit Assessment',
isVisible: () => gradeSection.radioButton('qualityGrade')?.value() !== null
});
form.configureCompletionScreen({
type: 'text',
title: 'Assessment Submitted',
message: 'Your harvest quality assessment has been recorded. This documentation helps maintain quality standards and track improvements over time.'
});
}