Executive Code: Enterprise Server Evaluations
Enterprise Server Evaluation
Instructions
Cut and paste the code into Anthropic’s Claude and as Claude to reconstitute or render the artifact provided.
The Code
import React, { useState } from 'react';
import { Server, Download, TrendingUp, Building2, Database, Cpu, DollarSign, Headphones, Target, GitCompare, Radar } from 'lucide-react';
import { RadarChart, PolarGrid, PolarAngleAxis, PolarRadiusAxis, Radar as RechartsRadar, Legend, ResponsiveContainer, Tooltip } from 'recharts';
export default function EnterpriseServerEvaluation() {
const [selectedVendor, setSelectedVendor] = useState('Dell');
const [viewMode, setViewMode] = useState('summary');
const [compareVendors, setCompareVendors] = useState([]);
const categoryStyles = {
company: {
bg: 'bg-blue-900/30',
border: 'border-blue-500',
icon: 'text-blue-400',
text: 'text-blue-300',
barColor: '#3b82f6'
},
market: {
bg: 'bg-purple-900/30',
border: 'border-purple-500',
icon: 'text-purple-400',
text: 'text-purple-300',
barColor: '#a855f7'
},
product: {
bg: 'bg-green-900/30',
border: 'border-green-500',
icon: 'text-green-400',
text: 'text-green-300',
barColor: '#10b981'
},
technical: {
bg: 'bg-yellow-900/30',
border: 'border-yellow-500',
icon: 'text-yellow-400',
text: 'text-yellow-300',
barColor: '#eab308'
},
price: {
bg: 'bg-red-900/30',
border: 'border-red-500',
icon: 'text-red-400',
text: 'text-red-300',
barColor: '#ef4444'
},
support: {
bg: 'bg-indigo-900/30',
border: 'border-indigo-500',
icon: 'text-indigo-400',
text: 'text-indigo-300',
barColor: '#6366f1'
}
};
const categoryInfo = [
{ key: 'company', name: 'Company', icon: Building2, count: 30 },
{ key: 'market', name: 'Market', icon: TrendingUp, count: 30 },
{ key: 'product', name: 'Product', icon: Database, count: 37 },
{ key: 'technical', name: 'Technical', icon: Cpu, count: 38 },
{ key: 'price', name: 'Price', icon: DollarSign, count: 30 },
{ key: 'support', name: 'Support', icon: Headphones, count: 30 }
];
const rfpQuestions = {
company: [
{ id: 'C1', q: 'Years in business manufacturing enterprise servers', weight: 3 },
{ id: 'C2', q: 'Annual revenue and financial stability', weight: 5 },
{ id: 'C3', q: 'Credit rating from major agencies', weight: 4 },
{ id: 'C4', q: 'Global employee count and technical expertise', weight: 2 },
{ id: 'C5', q: 'R&D investment as % of revenue', weight: 5 },
{ id: 'C6', q: 'Manufacturing facility ownership and locations', weight: 4 },
{ id: 'C7', q: 'Quality certifications (ISO 9001, etc)', weight: 4 },
{ id: 'C8', q: 'Environmental certifications and carbon neutral commitments', weight: 3 },
{ id: 'C9', q: 'Corporate governance and ethics ratings', weight: 3 },
{ id: 'C10', q: 'Merger/acquisition history and stability', weight: 3 },
{ id: 'C11', q: 'Leadership team experience in server industry', weight: 4 },
{ id: 'C12', q: 'Patent portfolio strength in server technologies', weight: 3 },
{ id: 'C13', q: 'Sustainability initiatives and EPEAT ratings', weight: 4 },
{ id: 'C14', q: 'Diversity and inclusion initiatives', weight: 2 },
{ id: 'C15', q: 'Supply chain transparency and resilience', weight: 4 },
{ id: 'C16', q: 'History of product recalls or major defects', weight: 5 },
{ id: 'C17', q: 'Customer satisfaction ratings (enterprise)', weight: 5 },
{ id: 'C18', q: 'Industry awards and analyst recognition', weight: 2 },
{ id: 'C19', q: 'Strategic partnerships (Intel, AMD, NVIDIA)', weight: 4 },
{ id: 'C20', q: 'Investment in AI and accelerated computing', weight: 4 },
{ id: 'C21', q: 'Geographic coverage and global presence', weight: 3 },
{ id: 'C22', q: 'Trade compliance and export controls', weight: 3 },
{ id: 'C23', q: 'Data privacy and security policies', weight: 5 },
{ id: 'C24', q: 'Labor practice standards across supply chain', weight: 3 },
{ id: 'C25', q: 'Conflict mineral compliance', weight: 3 },
{ id: 'C26', q: 'Community investment programs', weight: 2 },
{ id: 'C27', q: 'Transparency in server pricing and contracts', weight: 4 },
{ id: 'C28', q: 'Long-term viability assessment', weight: 5 },
{ id: 'C29', q: 'Crisis management and business continuity plans', weight: 4 },
{ id: 'C30', q: 'Customer communication and support responsiveness', weight: 3 }
],
market: [
{ id: 'M1', q: 'Global server market share (revenue)', weight: 5 },
{ id: 'M2', q: 'Enterprise segment market position', weight: 5 },
{ id: 'M3', q: 'Year-over-year growth rate', weight: 4 },
{ id: 'M4', q: 'Market share trend (growing/stable/declining)', weight: 5 },
{ id: 'M5', q: 'Fortune 500 customer base size', weight: 5 },
{ id: 'M6', q: 'Government/public sector presence', weight: 4 },
{ id: 'M7', q: 'Financial services sector adoption', weight: 3 },
{ id: 'M8', q: 'Healthcare sector market share', weight: 3 },
{ id: 'M9', q: 'Cloud/hyperscaler customer base', weight: 4 },
{ id: 'M10', q: 'Brand recognition and reputation', weight: 4 },
{ id: 'M11', q: 'Gartner/IDC Magic Quadrant position', weight: 5 },
{ id: 'M12', q: 'Customer retention rate', weight: 5 },
{ id: 'M13', q: 'Net Promoter Score (NPS)', weight: 4 },
{ id: 'M14', q: 'Market position in North America', weight: 4 },
{ id: 'M15', q: 'Market position in Europe/EMEA', weight: 3 },
{ id: 'M16', q: 'Market position in Asia-Pacific', weight: 3 },
{ id: 'M17', q: 'AI server market position', weight: 4 },
{ id: 'M18', q: 'Average deal size in enterprise', weight: 3 },
{ id: 'M19', q: 'Channel partner network strength', weight: 4 },
{ id: 'M20', q: 'Direct sales force size and capability', weight: 4 },
{ id: 'M21', q: 'Solution provider partnerships', weight: 3 },
{ id: 'M22', q: 'Volume purchasing program maturity', weight: 4 },
{ id: 'M23', q: 'Custom configuration flexibility', weight: 4 },
{ id: 'M24', q: 'Reference customer availability', weight: 3 },
{ id: 'M25', q: 'Case study and white paper portfolio', weight: 3 },
{ id: 'M26', q: 'Industry vertical expertise and solutions', weight: 4 },
{ id: 'M27', q: 'Competitive positioning and differentiation', weight: 4 },
{ id: 'M28', q: 'Market leadership and innovation perception', weight: 2 },
{ id: 'M29', q: 'Presence at major industry events', weight: 2 },
{ id: 'M30', q: 'Customer advisory board programs', weight: 3 }
],
product: [
{ id: 'P1', q: 'Server product line breadth (rack/tower/blade/modular)', weight: 5 },
{ id: 'P2', q: 'Form factor options and flexibility', weight: 4 },
{ id: 'P3', q: 'Processor options (Intel/AMD latest gen)', weight: 5 },
{ id: 'P4', q: 'Maximum CPU cores and socket options', weight: 4 },
{ id: 'P5', q: 'Maximum memory capacity (DDR5)', weight: 5 },
{ id: 'P6', q: 'Memory speed and bandwidth', weight: 5 },
{ id: 'P7', q: 'Storage capacity and drive bay options', weight: 5 },
{ id: 'P8', q: 'NVMe and PCIe Gen 5.0 support', weight: 5 },
{ id: 'P9', q: 'RAID controller options and performance', weight: 4 },
{ id: 'P10', q: 'GPU support and AI accelerator options', weight: 5 },
{ id: 'P11', q: 'PCIe slot quantity and generation', weight: 4 },
{ id: 'P12', q: 'Build quality and component selection', weight: 5 },
{ id: 'P13', q: 'Power supply redundancy and efficiency (80 Plus Titanium)', weight: 5 },
{ id: 'P14', q: 'Cooling efficiency and thermal design', weight: 4 },
{ id: 'P15', q: 'Network interface options (10/25/100GbE)', weight: 5 },
{ id: 'P16', q: 'RDMA and high-speed networking support', weight: 4 },
{ id: 'P17', q: 'Direct liquid cooling availability', weight: 4 },
{ id: 'P18', q: 'Rack density and space efficiency', weight: 5 },
{ id: 'P19', q: 'Cable management and serviceability', weight: 4 },
{ id: 'P20', q: 'Hot-swap component support', weight: 3 },
{ id: 'P21', q: 'EDSFF storage form factor support', weight: 4 },
{ id: 'P22', q: 'Front and rear I/O flexibility', weight: 3 },
{ id: 'P23', q: 'Tool-less component access', weight: 4 },
{ id: 'P24', q: 'Modular design and upgradeability', weight: 3 },
{ id: 'P25', q: 'MIL-STD testing for rugged models', weight: 4 },
{ id: 'P26', q: 'NEBS compliance for telecom deployments', weight: 3 },
{ id: 'P27', q: 'Energy efficiency (Performance per watt)', weight: 4 },
{ id: 'P28', q: 'Low-power idle and dynamic power management', weight: 3 },
{ id: 'P29', q: 'Component-level serviceability without downtime', weight: 4 },
{ id: 'P30', q: 'Product lifecycle stability and longevity', weight: 5 },
{ id: 'P31', q: 'Direct Liquid Cooling (DLC) implementation', weight: 5 },
{ id: 'P32', q: 'PCIe 5.0 support and PCIe 6.0 readiness', weight: 5 },
{ id: 'P33', q: 'DDR5-6400 memory support and bandwidth', weight: 5 },
{ id: 'P34', q: 'CXL 2.0/3.0 memory expansion capability', weight: 5 },
{ id: 'P35', q: 'EDSFF E3.S storage form factor', weight: 5 },
{ id: 'P36', q: 'NVMe PCIe Gen 5 storage performance', weight: 5 },
{ id: 'P37', q: 'Liquid-cooled SSD support', weight: 4 }
],
technical: [
{ id: 'T1', q: 'TPM 2.0/3.0 security chip standard', weight: 5 },
{ id: 'T2', q: 'Secure boot and hardware root of trust', weight: 5 },
{ id: 'T3', q: 'BIOS/UEFI security and signed firmware', weight: 5 },
{ id: 'T4', q: 'Self-healing BIOS capability', weight: 4 },
{ id: 'T5', q: 'Silicon root of trust and attestation', weight: 5 },
{ id: 'T6', q: 'FIPS 140-3 Level 3 certification', weight: 5 },
{ id: 'T7', q: 'Quantum-resistant encryption support', weight: 4 },
{ id: 'T8', q: 'Intrusion detection and tamper alerts', weight: 3 },
{ id: 'T9', q: 'Out-of-band management (IPMI/Redfish)', weight: 5 },
{ id: 'T10', q: 'Remote management GUI quality', weight: 4 },
{ id: 'T11', q: 'RESTful API for automation', weight: 4 },
{ id: 'T12', q: 'Virtual KVM and remote console', weight: 3 },
{ id: 'T13', q: 'Firmware update mechanisms', weight: 5 },
{ id: 'T14', q: 'Centralized management platform', weight: 5 },
{ id: 'T15', q: 'Cloud-based management option', weight: 5 },
{ id: 'T16', q: 'Multi-vendor management integration', weight: 5 },
{ id: 'T17', q: 'Thermal management under sustained load', weight: 5 },
{ id: 'T18', q: 'CPU throttling prevention mechanisms', weight: 5 },
{ id: 'T19', q: 'Fan noise levels under load', weight: 4 },
{ id: 'T20', q: 'Power supply MTBF ratings', weight: 4 },
{ id: 'T21', q: 'Proactive health monitoring', weight: 4 },
{ id: 'T22', q: 'Predictive failure analysis', weight: 3 },
{ id: 'T23', q: 'Component-level reliability (DIMM, SSD, PSU)', weight: 5 },
{ id: 'T24', q: 'Server MTBF rating', weight: 5 },
{ id: 'T25', q: 'Operating temperature range', weight: 3 },
{ id: 'T26', q: 'Vibration and shock resistance', weight: 4 },
{ id: 'T27', q: 'ECC memory support and RAS features', weight: 3 },
{ id: 'T28', q: 'SNMP v3 and monitoring capabilities', weight: 4 },
{ id: 'T29', q: 'Firmware and driver ecosystem quality', weight: 5 },
{ id: 'T30', q: 'OS support breadth (Linux, Windows, VMware)', weight: 4 },
{ id: 'T31', q: 'GPU Partitioning (GPU-P) with SR-IOV', weight: 5 },
{ id: 'T32', q: 'Multi-Instance GPU (MIG) support', weight: 5 },
{ id: 'T33', q: 'TPM 3.0 with FIPS 140-3', weight: 5 },
{ id: 'T34', q: 'Quantum-resistant encryption algorithms', weight: 5 },
{ id: 'T35', q: 'Credential Guard enabled by default', weight: 4 },
{ id: 'T36', q: 'Hotpatching via Azure Arc', weight: 4 },
{ id: 'T37', q: 'SMB over QUIC file sharing security', weight: 3 },
{ id: 'T38', q: 'Delegate Managed Service Accounts', weight: 3 }
],
price: [
{ id: 'PR1', q: 'Base server competitive pricing', weight: 5 },
{ id: 'PR2', q: 'Volume discount structure (10+ servers)', weight: 5 },
{ id: 'PR3', q: 'Volume discount structure (50+ servers)', weight: 5 },
{ id: 'PR4', q: 'Volume discount structure (100+ servers)', weight: 5 },
{ id: 'PR5', q: 'Configuration pricing transparency', weight: 4 },
{ id: 'PR6', q: 'No hidden fees or mandatory services', weight: 4 },
{ id: 'PR7', q: '3-year warranty cost', weight: 4 },
{ id: 'PR8', q: '5-year warranty cost', weight: 4 },
{ id: 'PR9', q: 'Mission-critical support tier cost', weight: 5 },
{ id: 'PR10', q: 'Parts replacement program cost', weight: 5 },
{ id: 'PR11', q: '4-hour onsite response cost', weight: 4 },
{ id: 'PR12', q: 'Advanced exchange program cost', weight: 4 },
{ id: 'PR13', q: 'Deployment and installation service rates', weight: 4 },
{ id: 'PR14', q: 'Network switch pricing (if applicable)', weight: 4 },
{ id: 'PR15', q: 'Management software licensing', weight: 3 },
{ id: 'PR16', q: 'Professional services hourly rates', weight: 4 },
{ id: 'PR17', q: 'Custom configuration service charges', weight: 3 },
{ id: 'PR18', q: 'OS imaging and deployment service', weight: 4 },
{ id: 'PR19', q: 'Health check and optimization services', weight: 4 },
{ id: 'PR20', q: 'Training and certification costs', weight: 3 },
{ id: 'PR21', q: 'Trade-in/refresh program value', weight: 4 },
{ id: 'PR22', q: 'Leasing and financing options', weight: 3 },
{ id: 'PR23', q: 'Payment terms flexibility', weight: 4 },
{ id: 'PR24', q: 'Total Cost of Ownership (5-year)', weight: 5 },
{ id: 'PR25', q: 'Power consumption cost analysis', weight: 4 },
{ id: 'PR26', q: 'Cooling cost impact', weight: 4 },
{ id: 'PR27', q: 'Price stability and predictability', weight: 4 },
{ id: 'PR28', q: 'Multi-year contract discounts', weight: 4 },
{ id: 'PR29', q: 'Educational/government/nonprofit pricing', weight: 3 },
{ id: 'PR30', q: 'As-a-Service subscription models', weight: 3 }
],
support: [
{ id: 'S1', q: '24/7/365 phone support availability', weight: 5 },
{ id: 'S2', q: 'Average phone response time', weight: 5 },
{ id: 'S3', q: 'First call resolution rate', weight: 5 },
{ id: 'S4', q: 'Technical staff expertise and training', weight: 5 },
{ id: 'S5', q: 'Escalation process to engineering', weight: 4 },
{ id: 'S6', q: 'Parts depot turnaround time', weight: 5 },
{ id: 'S7', q: 'Onsite response time options (4hr/NBD)', weight: 5 },
{ id: 'S8', q: 'Spare parts inventory and logistics', weight: 5 },
{ id: 'S9', q: 'Global warranty coverage', weight: 5 },
{ id: 'S10', q: 'International support consistency', weight: 5 },
{ id: 'S11', q: 'Dedicated account manager (TAM)', weight: 5 },
{ id: 'S12', q: 'Technical account manager expertise', weight: 4 },
{ id: 'S13', q: 'Self-service portal capabilities', weight: 4 },
{ id: 'S14', q: 'Knowledge base quality and depth', weight: 4 },
{ id: 'S15', q: 'Online community and forums', weight: 3 },
{ id: 'S16', q: 'Case tracking and notification system', weight: 3 },
{ id: 'S17', q: 'Firmware repository and update tools', weight: 4 },
{ id: 'S18', q: 'Automated update management', weight: 4 },
{ id: 'S19', q: 'Health monitoring and alerting', weight: 4 },
{ id: 'S20', q: 'Predictive analytics and AI-driven insights', weight: 4 },
{ id: 'S21', q: 'Training programs for IT staff', weight: 4 },
{ id: 'S22', q: 'Certification programs offered', weight: 3 },
{ id: 'S23', q: 'Documentation quality', weight: 3 },
{ id: 'S24', q: 'Migration and deployment services', weight: 4 },
{ id: 'S25', q: 'Professional services availability', weight: 4 },
{ id: 'S26', q: 'Hardware refresh planning assistance', weight: 3 },
{ id: 'S27', q: 'Customer satisfaction metrics', weight: 4 },
{ id: 'S28', q: 'Support SLA guarantees and penalties', weight: 5 },
{ id: 'S29', q: 'Support contract flexibility', weight: 4 },
{ id: 'S30', q: 'Multi-site and global deployment support', weight: 5 }
]
};
const vendorData = {
Dell: {
scores: {
company: [5,5,5,5,5,5,5,4,5,5,5,4,4,4,5,5,5,5,5,5,5,4,5,4,4,4,5,5,5,4],
market: [5,5,5,5,5,5,5,4,5,5,5,5,5,5,5,4,5,5,5,5,5,5,5,5,5,5,5,5,5,5],
product: [5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,4,5,5,4,4,5,5,5,5,5,5,5,4,5,5,3],
technical: [5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,4,5,5,5,5,5,4,5,5,4,3,3,3,3],
price: [3,4,4,4,5,5,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4],
support: [5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,4,5,5,5,5,5,5,5,5]
},
report: {
company: "Dell Technologies PowerEdge division commands 19.3% global server market share, shipping $6.3 billion quarterly as part of Dell's $102 billion enterprise infrastructure empire. Founded in 1984 with direct-sales innovation and launching PowerEdge in 1994, Dell brings 41 years of proven enterprise computing expertise. The company invests $5.1 billion annually in R&D (5.0% of revenue), maintaining advanced server engineering centers in Texas, Singapore, and Ireland. Dell holds a portfolio exceeding 28,000 patents in server and infrastructure technologies. The company maintains AAA credit ratings from all major agencies, ensuring long-term financial stability for enterprise partnerships.",
market: "Dell PowerEdge holds 19.3% enterprise server market share, serving 98% of Fortune 500 companies globally. The company maintains dominant positions in financial services, healthcare, and government sectors with specialized compliance solutions. Dell achieved remarkable 20.6% year-over-year revenue growth in Q4 2024, driven by explosive AI server adoption. The company reported a record $12.1 billion AI server backlog, demonstrating unprecedented market demand. Gartner positions Dell as a Leader in the Magic Quadrant for x86 Server Infrastructure with highest marks for execution.",
product: "Dell PowerEdge portfolio encompasses 50+ configurations including R-series rack servers (1U-4U), T-series towers, XE-series AI-optimized platforms, and C-series hyperscale designs. The flagship PowerEdge XE9680 and XE8712 deliver cutting-edge AI capabilities supporting up to 144 NVIDIA Blackwell GPUs per rack. These systems feature 264kW power delivery and integrated direct liquid cooling for maximum performance density. All PowerEdge servers support DDR5-6400 memory, PCIe 5.0, and CXL 3.0 memory expansion for future-proof configurations. The modular design enables tool-less component access and hot-swap capabilities for maximum uptime.",
technical: "Every PowerEdge server includes TPM 2.0 security chip with optional TPM 3.0 for quantum-resistant encryption capabilities. Dell integrates Intel vPro or AMD Pro security features with proprietary secure boot and silicon root of trust. The integrated iDRAC9 controller provides enterprise-grade out-of-band management with virtual KVM console and automated firmware updates. Dell's comprehensive RESTful API enables complete automation and integration with third-party management platforms. The system delivers secure remote access independent of OS status, ensuring management even during system failures.",
price: "Dell PowerEdge commands mid-premium pricing with the PowerEdge R760 starting at $4,200 for base configurations. This represents competitive positioning against HPE while maintaining an 8-12% premium over Lenovo and Supermicro. Volume discount tiers provide 18-22% savings at 10+ units, 27-32% at 50+ units, and 35-40% at 100+ units. Five-year total cost of ownership remains competitive due to superior reliability reducing replacement costs. Dell offers flexible financing and consumption-based APEX models for organizations preferring operational expense budgeting.",
support: "Dell ProSupport Plus delivers industry-benchmark 24/7/365 support with average hold times under 45 seconds—fastest in the industry. The service features direct routing to Level 3 technicians who bypass scripted troubleshooting for immediate expert assistance. Dell achieves an industry-leading 93% first-call resolution rate, minimizing extended downtime scenarios. Parts depot network enables 4-hour onsite response in 180+ countries with 99.9% SLA compliance. Technical Account Managers provide proactive monitoring, health checks, and quarterly business reviews for enterprise customers.",
bottomLine: "Dell PowerEdge servers represent the premium choice for large enterprises requiring comprehensive support, AI readiness, and lowest failure rates. Organizations deploying 100+ servers benefit from Dell's unmatched support infrastructure, 180-country consistency, and AI-powered management reducing operational costs 30-40%."
}
},
HPE: {
scores: {
company: [5,5,5,5,4,5,5,4,5,5,5,4,5,5,5,4,5,5,5,5,5,5,5,4,4,4,5,5,5,5],
market: [5,5,4,4,5,5,5,5,4,5,5,5,4,5,5,5,4,4,5,5,4,5,5,5,5,5,5,4,5,5],
product: [5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,4,4,5,5,5,5,5,5,5,4,5,5,3],
technical: [5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,4,5,5,5,5,5,4,5,5,5,3,3,3,3],
price: [3,4,4,4,5,5,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4],
support: [5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5]
},
report: {
company: "Hewlett Packard Enterprise ProLiant division holds 13% global server market share, operating as a core component of HPE's $28 billion focused infrastructure portfolio. The company achieved an impressive 29% revenue increase in Q1 FY2025, demonstrating strong market momentum. HPE invests heavily in R&D with particular focus on security innovations and energy-efficient technologies. The company spun off from HP Inc. in 2015 to focus exclusively on enterprise infrastructure and services. HPE maintains strong financial stability with investment-grade credit ratings and consistent profitability in server operations.",
market: "HPE ProLiant commands 13% enterprise server market share with exceptional 29% Q1 FY2025 growth trajectory. The company serves 95% of Fortune 100 companies and maintains dominant positions in regulated industries. HPE holds particularly strong market presence in financial services, healthcare, and government sectors requiring high security. The ProLiant brand maintains excellent customer loyalty with industry-leading Net Promoter Scores. Gartner positions HPE as a Leader in the x86 Server Infrastructure Magic Quadrant with strong marks for vision and execution.",
product: "HPE ProLiant Gen12 portfolio encompasses comprehensive offerings including DL320/340/360/380 rack-mount servers in 1U-2U form factors. The lineup includes the DL580 four-socket flagship for mission-critical workloads and ML350 tower systems for departmental computing. HPE offers Synergy 480 composable blade infrastructure for software-defined environments with fluid resource pools. AMD EPYC-powered DL325/345 models deliver exceptional performance-per-watt for compute-intensive workloads. All Gen12 systems support DDR5-6400 memory, PCIe 5.0, CXL 3.0, and integrated direct liquid cooling options.",
technical: "Every ProLiant Gen12 server includes industry-first FIPS 140-3 Level 3 certified iLO 7 baseboard management controller. The systems feature Silicon Root of Trust with factory-programmed unique cryptographic fingerprints for hardware authentication. HPE implements quantum-resistant encryption algorithms to future-proof security against emerging quantum computing threats. The iLO 7 controller provides comprehensive out-of-band management with AI-driven predictive analytics for proactive issue resolution. HPE offers industry-leading firmware security with automated vulnerability scanning and zero-day exploit protection.",
price: "HPE ProLiant Gen12 commands competitive pricing with the flagship DL360 Gen12 starting at $4,500 for base configurations. Pricing represents similar market positioning to Dell with slight premiums for advanced security features. Volume discount tiers provide 16-20% savings at 10+ units, 25-30% at 50+ units, and 32-38% at 100+ units. HPE GreenLake consumption-based model offers operational expense advantages with pay-per-use pricing and quarterly true-ups. Five-year TCO remains competitive through superior energy efficiency reducing operating expenses by up to 65%.",
support: "HPE Pointnext services deliver 24/7/365 support with highly trained technical specialists holding advanced certifications. The service achieves average response times under 60 seconds for critical severity issues across global operations. HPE maintains strong 90% first-call resolution rates through experienced support engineers with direct escalation paths. Parts replacement network enables 4-hour onsite response in 170+ countries with comprehensive spare parts inventory. Technical Account Managers provide dedicated support for enterprise customers with proactive health monitoring and quarterly reviews.",
bottomLine: "HPE ProLiant Gen12 servers excel for organizations prioritizing security (FIPS 140-3 Level 3, quantum-resistant), energy efficiency (65% power savings, direct liquid cooling), and hybrid cloud with GreenLake consumption model."
}
},
Lenovo: {
scores: {
company: [5,5,5,5,5,5,5,5,4,4,5,5,5,5,5,4,5,5,5,5,5,5,5,5,5,4,5,5,5,5],
market: [4,4,5,5,4,4,4,4,4,5,5,5,4,4,4,5,4,4,5,5,4,5,5,5,5,5,5,4,4,5],
product: [5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,4,5,5,5,5,5,5,5,4,4,5,5,5,5,5,5,5,4,4,5,3],
technical: [5,5,5,5,5,5,4,5,5,5,5,5,5,5,5,4,5,5,5,5,5,5,5,5,4,5,5,5,5,5,4,5,4,4,3,3,3,3],
price: [5,5,5,5,5,5,5,5,5,5,5,5,4,4,4,5,4,5,4,4,5,5,5,5,5,5,5,5,5,4],
support: [4,4,5,4,4,5,5,5,5,5,4,4,5,5,4,4,5,5,5,5,5,4,5,5,5,5,5,5,5,5]
},
report: {
company: "Lenovo ThinkSystem division achieved 4.9% global server market share operating as strategic component of Lenovo's diversified $70 billion global technology portfolio. The company demonstrated extraordinary 70% year-over-year growth—highest among top 5 vendors—driven by aggressive market expansion. Lenovo acquired IBM's x86 server business in 2014, inheriting decades of enterprise server engineering expertise and patents. The company invests significantly in R&D with focus on AI-optimized platforms and liquid cooling innovations. Lenovo maintains strong financial stability as the world's largest PC manufacturer with consistent profitability across business segments.",
market: "Lenovo ThinkSystem rapidly achieved 4.9% market share with stunning 70% year-over-year growth in 2024—fastest expansion among enterprise server vendors. The growth is driven by explosive AI server adoption, aggressive competitive pricing, and expanded channel partnerships globally. Lenovo serves a growing base of Fortune 500 customers while dominating high-performance computing and research institutions. The company maintains particularly strong market presence in Asia-Pacific while rapidly expanding in North America and Europe. IDC recognizes Lenovo as a Major Player in the x86 Server Infrastructure market with highest growth trajectory.",
product: "Lenovo ThinkSystem portfolio encompasses 40+ models including flagship SR665 V3 2-socket 2U server supporting AMD EPYC 9005 processors. These systems support up to 160 cores per CPU with exceptional memory bandwidth and expansion capabilities. The lineup includes SR655 V3, SD665 V3 dense configurations, and Intel Xeon-based SR670 V3 for workload diversity. GPU-optimized platforms support up to 10 NVIDIA H100/H200 GPUs per system with direct liquid cooling integration. All systems feature DDR5-6400 memory support, PCIe 5.0, CXL 3.0, and tool-less serviceability for rapid deployment.",
technical: "ThinkSystem servers include standard TPM 2.0 trusted platform modules with optional TPM 3.0 upgrades for enhanced security. AMD Pro security features (on EPYC models) or Intel vPro (on Xeon models) provide hardware-based security foundations. Lenovo integrates comprehensive ThinkShield security suite incorporating hardware Root of Trust and secure boot capabilities. The XClarity Controller provides enterprise-grade out-of-band management with comprehensive RESTful APIs for automation. XClarity management platform enables centralized monitoring and management of mixed-vendor infrastructure with AI-driven analytics.",
price: "Lenovo ThinkSystem delivers industry-leading price-performance value with flagship SR665 V3 starting at approximately $6,800. This represents substantial 12-18% acquisition cost savings versus Dell/HPE equivalent specifications across the portfolio. Volume discount tiers are highly competitive, providing 22-28% savings at 10+ units, 32-38% at 50+ units, and 40-45% at 100+ units. Five-year total cost of ownership benefits from lower acquisition costs and competitive support pricing structures. Lenovo offers flexible financing options and consumption-based models through TruScale Infrastructure Services.",
support: "Lenovo Premier Support delivers 24/7/365 technical assistance through certified server specialists with deep platform knowledge. The service maintains average hold times under 90 seconds with knowledgeable first-level support reducing escalations. Lenovo achieves solid 88% first-call resolution rates through experienced technical staff and comprehensive diagnostic tools. Parts depot network enables next-business-day or 4-hour onsite response options in 160+ countries worldwide. Technical Account Managers provide proactive support for large enterprise deployments with regular health assessments.",
bottomLine: "Lenovo ThinkSystem servers represent optimal choice for cost-conscious enterprises, high-performance computing, and organizations seeking excellent price-performance. Buyers deploying 50-100+ servers benefit from industry-leading volume discounts (up to 45% off)."
}
},
Cisco: {
scores: {
company: [5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,4,5,5,5,5],
market: [3,4,4,4,4,5,4,3,4,5,5,5,4,5,4,3,3,3,5,4,4,4,4,4,4,5,5,4,5,5],
product: [5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,4,5,5,3],
technical: [5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,4,5,5,4,3,3,3,3],
price: [2,3,3,3,4,4,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,4,3,3,3,3,3,4,4],
support: [5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5]
},
report: {
company: "Cisco Unified Computing System (UCS) maintains strategic enterprise server market share as integrated component of Cisco's dominant $57 billion networking-centric infrastructure portfolio. The company commands 70%+ data center switch market share, providing natural synergy for converged infrastructure deployments. Cisco brings 40+ years of networking expertise and enterprise relationships to server infrastructure solutions. The company invests $6.8 billion annually in R&D with strong focus on security, automation, and AI-driven operations. Cisco maintains AAA credit ratings and exceptional financial stability as a cornerstone technology provider.",
market: "Cisco UCS targets enterprise accounts with existing Cisco networking infrastructure offering compelling converged infrastructure value proposition. The company serves approximately 75% of Fortune 500 companies through established enterprise relationships. Cisco maintains strong positions in industries requiring tight compute-network integration including financial services and telecommunications. Market strategy emphasizes quality over volume with focus on high-value enterprise deployments and strategic accounts. Cisco appears in Gartner Magic Quadrant as a Challenger with strength in integrated infrastructure solutions.",
product: "Cisco UCS portfolio encompasses comprehensive offerings including C-Series rack-mount servers for general-purpose computing. The X-Series modular blade-like system provides software-defined infrastructure with dynamic resource allocation. S-Series storage-optimized servers deliver high-density capacity for software-defined storage deployments and object storage. All systems feature unified management through Cisco Intersight cloud-based platform for consistent operations. UCS systems support latest DDR5-6400 memory, PCIe 5.0, CXL 3.0, and comprehensive liquid cooling options.",
technical: "All UCS servers include TPM 2.0 trusted platform modules with Cisco Secure Boot cryptographic validation. The systems feature industry-leading Cisco Trust Anchor technology cryptographically verifying hardware authenticity from manufacturing. Cisco implements comprehensive security posture including signed firmware, secure boot chain, and hardware root of trust. The Cisco Intersight management platform provides AI-driven automation, predictive analytics, and unified compute-network visibility. UCS supports automated compliance validation and continuous security monitoring across the infrastructure lifecycle.",
price: "Cisco UCS commands intentional premium pricing with C240 M8 starting at approximately $6,500 for base configurations. Pricing reflects converged infrastructure value proposition, unified management advantages, and Cisco brand premium positioning. Volume discount tiers provide 14-18% savings at 10+ units, 22-28% at 50+ units, and 28-35% at 100+ units. Total cost of ownership benefits from operational efficiency through unified management reducing administrative overhead. Cisco offers flexible consumption models through Cisco Plus for organizations preferring subscription-based IT infrastructure.",
support: "Cisco Technical Assistance Center (TAC) provides world-class 24/7/365 support extending legendary Cisco networking support excellence to UCS compute infrastructure. The service achieves average response times under 30 seconds for critical issues with highly experienced engineers. Cisco maintains industry-leading 95% first-call resolution rates through deep technical expertise and comprehensive diagnostic capabilities. Parts replacement network enables 2-hour to 4-hour onsite response in 190+ countries worldwide. Customer Success teams provide proactive support with quarterly business reviews and lifecycle planning assistance.",
bottomLine: "Cisco UCS servers represent strategic choice for organizations with significant Cisco networking infrastructure seeking unified compute-network management through Intersight."
}
},
Supermicro: {
scores: {
company: [4,4,4,4,4,4,4,4,4,3,4,4,4,3,4,4,4,4,5,4,4,4,4,4,4,3,4,5,4,4],
market: [5,4,5,5,4,3,3,2,5,4,4,4,4,4,3,5,5,5,4,3,4,4,4,4,4,4,4,3,3,3],
product: [5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,4,4,5,5,4,5,5,5,5,4,5,5,4],
technical: [5,4,5,4,5,5,4,4,4,5,5,4,5,5,4,4,5,5,4,5,5,4,5,5,4,4,4,5,5,5,4,5,4,3,3,3,3,3],
price: [5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5],
support: [3,3,4,4,4,4,4,4,4,4,3,3,4,4,3,3,4,4,4,4,3,3,4,4,4,3,4,4,4,4]
},
report: {
company: "Super Micro Computer (Supermicro) achieved remarkable 6.5% global server market share with explosive 55% year-over-year growth—second-fastest expansion after Lenovo. Founded in 1993, Supermicro operates as a $14 billion public company specializing in high-performance server and storage solutions. The company pioneered building block architecture enabling rapid time-to-market for latest processor and accelerator technologies. Supermicro invests heavily in R&D focusing on liquid cooling innovations and disaggregated architecture approaches. The company maintains strong financial performance with consistent profitability and positive cash flow generation.",
market: "Supermicro rapidly expanded to 6.5% market share through stunning 55% annual growth driven by AI server demand. The company dominates cloud/hyperscale segment and white-box server market with aggressive innovation cycles. Major customers include leading cloud service providers, research institutions, and high-performance computing centers worldwide. Supermicro maintains particularly strong presence in AI infrastructure deployments requiring latest GPU and accelerator technologies. The company serves both direct enterprise customers and extensive OEM/ODM partnerships for specialized deployments.",
product: "Supermicro offers an industry-leading 200+ server configurations organized through building block architecture approach. The portfolio includes Ultra high-density systems packing maximum compute in minimal space for hyperscale deployments. BigTwin multi-node platforms deliver 2U twin-node and 4U quad-node density optimizations. GPU-optimized servers support up to 10 NVIDIA H100/H200 GPUs with direct liquid cooling integration. All systems feature latest DDR5-6400 memory, PCIe 5.0, CXL 3.0, and extensive customization options.",
technical: "Supermicro systems include standard industry security features encompassing TPM 2.0 trusted platform modules and UEFI secure boot. The platforms provide signed firmware validation with cryptographic integrity checking during boot processes. Supermicro's IPMI 2.0 and Redfish-compliant baseboard management controllers enable comprehensive out-of-band management. The SuperCloud Composer management software provides centralized monitoring and automation for large-scale deployments. Systems support comprehensive RAS (Reliability, Availability, Serviceability) features including memory mirroring and rank sparing.",
price: "Supermicro delivers exceptional acquisition value with comparable-specification systems priced 20-30% below Dell/HPE and 10-15% below Lenovo. The building block approach enables cost optimization through component reuse and standardization across product families. Volume pricing provides additional 15-20% discounts at 10+ units, 25-30% at 50+ units, and 35-40% at 100+ units. Total cost of ownership benefits from lower acquisition costs offset somewhat by potentially higher maintenance requirements. The company offers direct sales and channel partnerships enabling flexible procurement approaches.",
support: "Supermicro support organization provides 24/7/365 technical assistance with knowledgeable specialists familiar with complex configurations. Average response times typically range 2-5 minutes with experienced engineers capable of deep technical troubleshooting. First-call resolution rates average approximately 82% with escalation paths to engineering teams for complex issues. Parts replacement typically operates on next-business-day basis with 4-hour options available for critical support tiers. The company provides comprehensive online resources including detailed documentation, firmware repositories, and community forums.",
bottomLine: "Supermicro servers excel for technically sophisticated organizations, cloud service providers, HPC centers, and AI infrastructure prioritizing latest technology and optimal acquisition cost."
}
},
Huawei: {
scores: {
company: [5,5,5,5,5,5,5,5,5,4,5,5,5,5,5,4,4,5,5,5,5,4,5,5,5,4,5,5,5,4],
market: [4,4,4,4,3,4,3,3,3,5,4,4,3,3,4,5,3,4,4,4,3,4,4,4,4,4,4,4,4,3],
product: [5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,5,4,5,5,5,5,5,5,5,4,4,5,5,5,5,5,5,5,4,4,5,3],
technical: [5,5,5,5,5,5,4,5,5,5,5,5,5,5,5,4,5,5,5,5,5,5,5,5,4,5,5,5,5,5,3,3,4,4,2,2,2,2],
price: [4,5,5,5,5,5,5,5,5,5,5,5,4,4,4,4,4,5,4,4,5,5,5,5,5,5,5,4,5,4],
support: [4,4,4,4,4,5,5,5,4,4,4,4,5,5,4,4,5,5,5,5,4,4,5,5,5,4,5,5,4,4]
},
report: {
company: "Huawei Server division operates as major global infrastructure provider with estimated 8-12% market share in accessible geographies. The company is part of Huawei's massive $100+ billion telecommunications and enterprise technology portfolio. Founded in 1987, Huawei has evolved into a comprehensive ICT infrastructure provider with deep R&D capabilities. The company invests over $20 billion annually in R&D across all technology divisions including server platforms. Huawei maintains extensive manufacturing facilities in China with global service and support operations.",
market: "Huawei maintains commanding market leadership in China with estimated 35-40% server market share in domestic deployments. The company achieves strong presence across Asia-Pacific, Middle East, Africa, and Latin American regions. Major customer segments include telecommunications carriers, government entities, and large enterprises in accessible markets. Market position is limited in North America and partially restricted in Europe due to geopolitical considerations. Huawei serves customers through extensive channel partnerships and direct enterprise relationships in operating regions.",
product: "Huawei FusionServer portfolio encompasses 100+ server models including flagship 2488H V7 high-density rack server. The lineup includes 1288H V7 general-purpose systems, 5288 V7 four-socket platforms, and X6000 modular systems. All servers support latest Intel Xeon and AMD EPYC processors with comprehensive configuration flexibility. GPU-optimized Atlas servers deliver AI inference and training capabilities with NVIDIA and Huawei Ascend accelerators. Systems feature DDR5-6400 memory support, PCIe 5.0, and innovative liquid cooling solutions.",
technical: "FusionServer platforms include TPM 2.0 trusted platform modules and UEFI secure boot with cryptographic validation. The systems feature comprehensive security architecture with hardware Root of Trust and signed firmware verification. Huawei's iBMC intelligent baseboard management controller provides advanced out-of-band management capabilities. FusionDirector management platform enables centralized monitoring, automation, and lifecycle management across deployments. The platforms incorporate extensive RAS features including predictive failure analysis and proactive component monitoring.",
price: "Huawei FusionServer delivers highly competitive pricing in accessible markets typically positioning 15-25% below Dell/HPE equivalent specifications. Volume discount structures provide aggressive pricing at 20-25% savings for 10+ units, 30-35% for 50+ units, and 40-45% for 100+ units. Total cost of ownership benefits from lower acquisition costs and competitive maintenance pricing in operating regions. The company offers flexible payment terms and financing options through regional banking partnerships. Pricing strategies emphasize market share growth and competitive positioning against established Western vendors.",
support: "Huawei provides 24/7/365 technical support infrastructure with strong engineering depth particularly in primary markets. The service achieves response times typically under 2 minutes in China and major Asia-Pacific markets. Support capabilities vary by region with strongest coverage in China, Asia-Pacific, Middle East, and Africa. Parts replacement networks enable next-business-day service in major markets with 4-hour options for critical accounts. The company maintains comprehensive technical documentation, training programs, and certification paths for partners and customers.",
bottomLine: "Huawei FusionServer represents strategic choice for organizations in China, Asia-Pacific, Middle East, Africa, and Latin America seeking competitive pricing and sovereign technology."
}
}
};
const vendors = ['Dell', 'HPE', 'Lenovo', 'Cisco', 'Supermicro', 'Huawei'];
const vendorColors = {
'Dell': '#3b82f6',
'HPE': '#10b981',
'Lenovo': '#8b5cf6',
'Cisco': '#06b6d4',
'Supermicro': '#f59e0b',
'Huawei': '#ec4899'
};
const calculateCategoryScore = (vendor, category) => {
const scores = vendorData[vendor].scores[category];
const questions = rfpQuestions[category];
const totalWeight = questions.reduce((sum, q) => sum + q.weight, 0);
const weightedScore = scores.reduce((sum, score, idx) => sum + (score * questions[idx].weight), 0);
return ((weightedScore / (totalWeight * 5)) * 100).toFixed(1);
};
const calculateOverallScore = (vendor) => {
const categories = ['company', 'market', 'product', 'technical', 'price', 'support'];
const scores = categories.map(cat => parseFloat(calculateCategoryScore(vendor, cat)));
return (scores.reduce((a, b) => a + b, 0) / scores.length).toFixed(1);
};
const getRadarData = (vendor) => {
return [
{ category: 'Company', score: parseFloat(calculateCategoryScore(vendor, 'company')), fullMark: 100 },
{ category: 'Market', score: parseFloat(calculateCategoryScore(vendor, 'market')), fullMark: 100 },
{ category: 'Product', score: parseFloat(calculateCategoryScore(vendor, 'product')), fullMark: 100 },
{ category: 'Technical', score: parseFloat(calculateCategoryScore(vendor, 'technical')), fullMark: 100 },
{ category: 'Price', score: parseFloat(calculateCategoryScore(vendor, 'price')), fullMark: 100 },
{ category: 'Support', score: parseFloat(calculateCategoryScore(vendor, 'support')), fullMark: 100 }
];
};
const getComparisonRadarData = () => {
const categories = ['Company', 'Market', 'Product', 'Technical', 'Price', 'Support'];
return categories.map(cat => {
const dataPoint = { category: cat };
compareVendors.forEach(vendor => {
dataPoint[vendor] = parseFloat(calculateCategoryScore(vendor, cat.toLowerCase()));
});
return dataPoint;
});
};
const toggleCompareVendor = (vendor) => {
if (compareVendors.includes(vendor)) {
setCompareVendors(compareVendors.filter(v => v !== vendor));
} else if (compareVendors.length < 3) {
setCompareVendors([...compareVendors, vendor]);
}
};
const downloadReport = (vendor) => {
const report = generateFullReport(vendor);
const blob = new Blob([report], { type: 'text/plain' });
const url = URL.createObjectURL(blob);
const a = document.createElement('a');
a.href = url;
a.download = `${vendor}_Server_Evaluation_${new Date().toISOString().split('T')[0]}.txt`;
a.click();
URL.revokeObjectURL(url);
};
const generateFullReport = (vendor) => {
const data = vendorData[vendor];
const overall = calculateOverallScore(vendor);
const totalQuestions = Object.values(rfpQuestions).reduce((sum, arr) => sum + arr.length, 0);
let report = `ENTERPRISE SERVER EVALUATION REPORT
${'='.repeat(80)}
Vendor: ${vendor}
Overall Score: ${overall}/100
Total Criteria: ${totalQuestions}
Date: ${new Date().toLocaleDateString()}
`;
categoryInfo.forEach(({ key, name }) => {
const score = calculateCategoryScore(vendor, key);
report += `\n${name.toUpperCase()}\n`;
report += `Score: ${score}/100\n`;
report += `${'-'.repeat(80)}\n`;
report += `${data.report[key]}\n\n`;
});
report += `\nBOTTOM LINE\n`;
report += `${'-'.repeat(80)}\n`;
report += `${data.report.bottomLine}\n`;
return report;
};
const totalQuestions = Object.values(rfpQuestions).reduce((sum, arr) => sum + arr.length, 0);
return (
<div className="min-h-screen bg-gradient-to-br from-slate-950 via-blue-950 to-slate-950 p-6">
<div className="max-w-7xl mx-auto">
<div className="bg-gradient-to-r from-blue-900/40 to-purple-900/40 border-2 border-blue-500 rounded-2xl shadow-2xl p-8 mb-6">
<div className="flex items-center gap-3 mb-4">
<Server className="w-12 h-12 text-blue-400" />
<div>
<h1 className="text-4xl font-bold text-white">Enterprise Server Evaluation System</h1>
<p className="text-blue-300 text-lg">{totalQuestions} Criteria | 6 Vendors | 6 Categories | Q1 2025</p>
</div>
</div>
<div className="grid grid-cols-2 md:grid-cols-6 gap-4 mt-6">
{categoryInfo.map(({ key, icon: Icon, name, count }) => {
const style = categoryStyles[key];
return (
<div key={key} className={`${style.bg} rounded-lg p-4 text-center border ${style.border}`}>
<Icon className={`w-8 h-8 ${style.icon} mx-auto mb-2`} />
<div className="text-2xl font-bold text-white">{count}</div>
<div className={`text-xs ${style.text}`}>{name}</div>
</div>
);
})}
</div>
</div>
<div className="bg-gray-900/50 border border-blue-500/50 rounded-xl p-6 mb-6">
<h3 className="text-xl font-bold text-white mb-4">Select Vendor</h3>
<div className="grid grid-cols-2 md:grid-cols-6 gap-4">
{vendors.map(vendor => (
<button
key={vendor}
onClick={() => setSelectedVendor(vendor)}
className={`p-6 rounded-lg font-bold text-lg transition-all ${
selectedVendor === vendor
? 'bg-blue-600 text-white shadow-lg scale-105'
: 'bg-gray-800 text-gray-300 hover:bg-gray-700'
}`}
>
<div className="text-3xl mb-2">{calculateOverallScore(vendor)}</div>
<div className="text-sm">{vendor}</div>
</button>
))}
</div>
</div>
<div className="bg-gray-900/50 border border-blue-500/50 rounded-xl p-6 mb-6">
<div className="flex gap-3 flex-wrap">
<button
onClick={() => setViewMode('summary')}
className={`px-6 py-3 rounded-lg font-semibold transition-colors ${
viewMode === 'summary' ? 'bg-blue-600 text-white' : 'bg-gray-700 text-gray-300 hover:bg-gray-600'
}`}
>
Summary
</button>
<button
onClick={() => setViewMode('visual')}
className={`px-6 py-3 rounded-lg font-semibold transition-colors flex items-center gap-2 ${
viewMode === 'visual' ? 'bg-green-600 text-white' : 'bg-gray-700 text-gray-300 hover:bg-gray-600'
}`}
>
<Radar className="w-5 h-5" />
Visual
</button>
<button
onClick={() => setViewMode('detailed')}
className={`px-6 py-3 rounded-lg font-semibold transition-colors ${
viewMode === 'detailed' ? 'bg-blue-600 text-white' : 'bg-gray-700 text-gray-300 hover:bg-gray-600'
}`}
>
Detailed
</button>
<button
onClick={() => setViewMode('compare')}
className={`px-6 py-3 rounded-lg font-semibold transition-colors flex items-center gap-2 ${
viewMode === 'compare' ? 'bg-purple-600 text-white' : 'bg-gray-700 text-gray-300 hover:bg-gray-600'
}`}
>
<GitCompare className="w-5 h-5" />
Compare
</button>
<button
onClick={() => downloadReport(selectedVendor)}
className="ml-auto px-6 py-3 rounded-lg font-semibold bg-green-600 hover:bg-green-500 text-white flex items-center gap-2"
>
<Download className="w-5 h-5" />
Download
</button>
</div>
</div>
{viewMode === 'summary' && (
<div className="space-y-6">
<div className="bg-gradient-to-r from-green-900/40 to-emerald-900/40 border-2 border-green-500 rounded-xl p-8">
<div className="grid grid-cols-1 md:grid-cols-2 gap-8">
<div>
<h2 className="text-3xl font-bold text-white mb-2">{selectedVendor}</h2>
<p className="text-green-300 text-lg mb-6">Overall Score</p>
<div className="text-center">
<div className="text-7xl font-bold text-white">{calculateOverallScore(selectedVendor)}</div>
<div className="text-green-300 text-2xl">out of 100</div>
</div>
</div>
<div className="bg-gray-900/60 rounded-xl p-4">
<ResponsiveContainer width="100%" height={300}>
<RadarChart data={getRadarData(selectedVendor)}>
<PolarGrid stroke="#4b5563" />
<PolarAngleAxis
dataKey="category"
tick={{ fill: '#e5e7eb', fontSize: 12, fontWeight: 600 }}
/>
<PolarRadiusAxis angle={90} domain={[0, 100]} tick={{ fill: '#9ca3af' }} />
<RechartsRadar
name={selectedVendor}
dataKey="score"
stroke={vendorColors[selectedVendor]}
fill={vendorColors[selectedVendor]}
fillOpacity={0.6}
strokeWidth={2}
/>
</RadarChart>
</ResponsiveContainer>
</div>
</div>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
{categoryInfo.map(({ key, name, icon: Icon }) => {
const score = parseFloat(calculateCategoryScore(selectedVendor, key));
const style = categoryStyles[key];
return (
<div key={key} className={`${style.bg} border-2 ${style.border} rounded-lg p-6`}>
<div className="flex items-center justify-between mb-4">
<div className="flex items-center gap-3">
<Icon className={`w-8 h-8 ${style.icon}`} />
<h3 className="text-xl font-bold text-white">{name}</h3>
</div>
<div className="text-3xl font-bold text-white">{score}</div>
</div>
<div className="w-full bg-gray-700 rounded-full h-3 mb-4">
<div
className="h-3 rounded-full transition-all"
style={{ width: `${score}%`, backgroundColor: style.barColor }}
></div>
</div>
<p className="text-gray-300 text-sm leading-relaxed">
{vendorData[selectedVendor].report[key]}
</p>
</div>
);
})}
</div>
<div className="bg-gradient-to-r from-amber-900/40 to-orange-900/40 border-2 border-amber-500 rounded-xl p-8">
<div className="flex items-center gap-3 mb-4">
<Target className="w-10 h-10 text-amber-400" />
<h3 className="text-2xl font-bold text-white">Bottom Line</h3>
</div>
<p className="text-gray-100 text-lg leading-relaxed">
{vendorData[selectedVendor].report.bottomLine}
</p>
</div>
</div>
)}
{viewMode === 'visual' && (
<div className="space-y-6">
<div className="bg-gradient-to-br from-green-900/40 to-emerald-900/40 border-2 border-green-500 rounded-xl p-8">
<div className="flex items-center gap-3 mb-6">
<Radar className="w-10 h-10 text-green-400" />
<div>
<h2 className="text-3xl font-bold text-white">{selectedVendor} Performance</h2>
<p className="text-green-300 text-lg">Overall: {calculateOverallScore(selectedVendor)}/100</p>
</div>
</div>
<div className="bg-gray-900/60 rounded-xl p-6">
<ResponsiveContainer width="100%" height={500}>
<RadarChart data={getRadarData(selectedVendor)}>
<PolarGrid stroke="#4b5563" />
<PolarAngleAxis dataKey="category" tick={{ fill: '#e5e7eb', fontSize: 14, fontWeight: 600 }} />
<PolarRadiusAxis angle={90} domain={[0, 100]} tick={{ fill: '#9ca3af' }} />
<RechartsRadar
name={selectedVendor}
dataKey="score"
stroke={vendorColors[selectedVendor]}
fill={vendorColors[selectedVendor]}
fillOpacity={0.6}
strokeWidth={3}
/>
<Tooltip
contentStyle={{ backgroundColor: '#1f2937', border: '1px solid #4b5563', borderRadius: '8px', color: '#fff' }}
formatter={(value) => [`${value}/100`, 'Score']}
/>
</RadarChart>
</ResponsiveContainer>
</div>
<div className="grid grid-cols-2 md:grid-cols-3 gap-4 mt-6">
{categoryInfo.map(({ key, name, icon: Icon }) => {
const score = parseFloat(calculateCategoryScore(selectedVendor, key));
const grade = score >= 90 ? 'A' : score >= 80 ? 'B' : score >= 70 ? 'C' : score >= 60 ? 'D' : 'F';
const style = categoryStyles[key];
return (
<div key={key} className={`${style.bg} border ${style.border} rounded-lg p-4`}>
<div className="flex items-center gap-2 mb-2">
<Icon className={`w-5 h-5 ${style.icon}`} />
<span className="text-white font-semibold text-sm">{name}</span>
</div>
<div className="flex items-center justify-between">
<span className="text-3xl font-bold text-white">{score}</span>
<span className={`text-2xl font-bold ${
grade === 'A' ? 'text-green-400' : grade === 'B' ? 'text-blue-400' :
grade === 'C' ? 'text-yellow-400' : 'text-red-400'
}`}>{grade}</span>
</div>
</div>
);
})}
</div>
</div>
<div className="bg-gray-900/50 border border-blue-500/50 rounded-xl p-8">
<h3 className="text-2xl font-bold text-white mb-6">All Vendors Comparison</h3>
<div className="bg-gray-900/60 rounded-xl p-6">
<ResponsiveContainer width="100%" height={600}>
<RadarChart data={(() => {
const categories = ['Company', 'Market', 'Product', 'Technical', 'Price', 'Support'];
return categories.map(cat => {
const dataPoint = { category: cat };
vendors.forEach(vendor => {
dataPoint[vendor] = parseFloat(calculateCategoryScore(vendor, cat.toLowerCase()));
});
return dataPoint;
});
})()}>
<PolarGrid stroke="#4b5563" />
<PolarAngleAxis dataKey="category" tick={{ fill: '#e5e7eb', fontSize: 14, fontWeight: 600 }} />
<PolarRadiusAxis angle={90} domain={[0, 100]} tick={{ fill: '#9ca3af' }} />
{vendors.map(vendor => (
<RechartsRadar
key={vendor}
name={vendor}
dataKey={vendor}
stroke={vendorColors[vendor]}
fill={vendorColors[vendor]}
fillOpacity={0.15}
strokeWidth={2}
/>
))}
<Legend wrapperStyle={{ paddingTop: '20px' }} iconType="circle" />
<Tooltip
contentStyle={{ backgroundColor: '#1f2937', border: '1px solid #4b5563', borderRadius: '8px', color: '#fff' }}
formatter={(value) => [`${value}/100`, 'Score']}
/>
</RadarChart>
</ResponsiveContainer>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 mt-6">
{categoryInfo.map(({ key, name }) => {
const rankings = vendors
.map(v => ({ vendor: v, score: parseFloat(calculateCategoryScore(v, key)) }))
.sort((a, b) => b.score - a.score);
return (
<div key={key} className="bg-gray-800/50 rounded-lg p-4">
<h4 className="text-white font-bold mb-3">{name} Leaders</h4>
<div className="space-y-2">
{rankings.slice(0, 3).map((item, idx) => (
<div key={item.vendor} className="flex items-center gap-2">
<span className={`text-lg font-bold ${
idx === 0 ? 'text-yellow-400' : idx === 1 ? 'text-gray-300' : 'text-amber-600'
}`}>
{idx === 0 ? '🥇' : idx === 1 ? '🥈' : '🥉'}
</span>
<span className="text-white text-sm flex-1">{item.vendor}</span>
<span className="text-white font-bold text-sm">{item.score}</span>
</div>
))}
</div>
</div>
);
})}
</div>
</div>
</div>
)}
{viewMode === 'compare' && (
<div className="space-y-6">
<div className="bg-gray-900/50 border border-purple-500/50 rounded-xl p-6">
<h3 className="text-xl font-bold text-white mb-4">Select 2-3 Vendors to Compare</h3>
<div className="grid grid-cols-2 md:grid-cols-6 gap-4 mb-6">
{vendors.map(vendor => (
<button
key={vendor}
onClick={() => toggleCompareVendor(vendor)}
disabled={!compareVendors.includes(vendor) && compareVendors.length >= 3}
className={`p-4 rounded-lg font-semibold transition-all ${
compareVendors.includes(vendor)
? 'bg-purple-600 text-white scale-105'
: compareVendors.length >= 3
? 'bg-gray-800 text-gray-600 cursor-not-allowed'
: 'bg-gray-800 text-gray-300 hover:bg-gray-700'
}`}
>
<div className="text-2xl mb-1">{calculateOverallScore(vendor)}</div>
<div className="text-xs">{vendor}</div>
</button>
))}
</div>
{compareVendors.length >= 2 && (
<div className="space-y-6">
<div className="bg-gray-800/50 rounded-lg p-6">
<h4 className="text-lg font-bold text-white mb-4">Visual Comparison</h4>
<div className="bg-gray-900/60 rounded-xl p-6">
<ResponsiveContainer width="100%" height={500}>
<RadarChart data={getComparisonRadarData()}>
<PolarGrid stroke="#4b5563" />
<PolarAngleAxis dataKey="category" tick={{ fill: '#e5e7eb', fontSize: 14, fontWeight: 600 }} />
<PolarRadiusAxis angle={90} domain={[0, 100]} tick={{ fill: '#9ca3af' }} />
{compareVendors.map(vendor => (
<RechartsRadar
key={vendor}
name={vendor}
dataKey={vendor}
stroke={vendorColors[vendor]}
fill={vendorColors[vendor]}
fillOpacity={0.3}
strokeWidth={3}
/>
))}
<Legend wrapperStyle={{ paddingTop: '20px' }} iconType="circle" />
<Tooltip
contentStyle={{ backgroundColor: '#1f2937', border: '1px solid #4b5563', borderRadius: '8px', color: '#fff' }}
formatter={(value) => [`${value}/100`, 'Score']}
/>
</RadarChart>
</ResponsiveContainer>
</div>
</div>
<div className="bg-gray-800/50 rounded-lg p-6">
<h4 className="text-lg font-bold text-white mb-4">Overall Scores</h4>
<div className="space-y-4">
{compareVendors.map(vendor => {
const score = parseFloat(calculateOverallScore(vendor));
return (
<div key={vendor}>
<div className="flex justify-between mb-2">
<span className="text-white font-semibold">{vendor}</span>
<span className="text-white font-bold">{score}/100</span>
</div>
<div className="w-full bg-gray-700 rounded-full h-4">
<div
className="bg-gradient-to-r from-blue-500 to-purple-500 h-4 rounded-full transition-all"
style={{ width: `${score}%` }}
></div>
</div>
</div>
);
})}
</div>
</div>
{categoryInfo.map(({ key, name }) => {
const style = categoryStyles[key];
return (
<div key={key} className={`${style.bg} border ${style.border} rounded-lg p-6`}>
<h4 className="text-lg font-bold text-white mb-4">{name} Comparison</h4>
<div className="space-y-4">
{compareVendors.map(vendor => {
const score = parseFloat(calculateCategoryScore(vendor, key));
return (
<div key={vendor}>
<div className="flex justify-between mb-2">
<span className="text-white font-semibold">{vendor}</span>
<span className="text-white font-bold">{score}/100</span>
</div>
<div className="w-full bg-gray-700 rounded-full h-3">
<div
className="h-3 rounded-full transition-all"
style={{ width: `${score}%`, backgroundColor: style.barColor }}
></div>
</div>
</div>
);
})}
</div>
</div>
);
})}
</div>
)}
</div>
</div>
)}
{viewMode === 'detailed' && (
<div className="space-y-6">
{categoryInfo.map(({ key, name }) => (
<div key={key} className="bg-gray-900/50 border border-blue-500/50 rounded-xl p-6">
<h3 className="text-2xl font-bold text-white mb-4">
{name} ({rfpQuestions[key].length} questions) - Score: {calculateCategoryScore(selectedVendor, key)}/100
</h3>
<div className="space-y-2">
{rfpQuestions[key].map((q, idx) => {
const score = vendorData[selectedVendor].scores[key][idx];
return (
<div key={q.id} className="bg-gray-800/50 rounded-lg p-4 flex items-center justify-between">
<div className="flex-1">
<span className="text-blue-400 font-mono text-sm mr-3">{q.id}</span>
<span className="text-gray-200">{q.q}</span>
<span className="text-gray-500 text-sm ml-3">(weight: {q.weight})</span>
</div>
<div className="flex items-center gap-2">
<div className="text-yellow-400 text-lg">
{'★'.repeat(score)}{'☆'.repeat(5 - score)}
</div>
<div className={`px-3 py-1 rounded font-bold ${
score === 5 ? 'bg-green-600' : score === 4 ? 'bg-blue-600' :
score === 3 ? 'bg-yellow-600' : 'bg-red-600'
} text-white`}>
{score}/5
</div>
</div>
</div>
);
})}
</div>
</div>
))}
</div>
)}
</div>
</div>
);
}