Toyota Sales Master - Spécifications
T
TOYOTA QUÉBEC
Outil Vente • Créé par Vinh
Specs Intégrées
CATALOGUE COMPLET
28 Modèles avec comparatifs techniques détaillés.
Avis de non-responsabilité
Usage interne seulement. Les spécifications sont basées sur les données disponibles au moment de la création.
${m.name}
${m.type.toUpperCase()}
${m.desc}
${m.specs.hp}
COMPARER
`;
grid.appendChild(el);
});
},
loadDetail(m) {
this.currentModel = m;
document.getElementById('model-grid').classList.add('hidden');
document.getElementById('filter-container').classList.add('hidden');
document.getElementById('detail-view').classList.remove('hidden');
window.scrollTo(0,0);
document.getElementById('detail-name').innerText = m.name;
document.getElementById('detail-desc').innerText = m.desc;
document.getElementById('detail-hp').innerText = m.specs.hp;
document.getElementById('detail-mpg').innerText = m.specs.mpg;
document.getElementById('detail-badge').innerText = m.badge;
const sel = document.getElementById('comp-select');
sel.innerHTML = m.comps.map((c, i) => `
`).join('');
sel.onchange = () => this.updateChart(sel.value);
this.updateChart(0);
},
updateChart(idx) {
const m = this.currentModel;
const c = m.comps[idx];
if(!c) return;
// Duel
const duelContainer = document.getElementById('tech-duel');
duelContainer.innerHTML = `
PUISSANCE
${m.specs.hp.replace(/\D/g,'')}
vs
${c.spec.hp.replace(/\D/g,'')}
CONSO
${m.specs.mpg.replace(/[^\d.]/g,'')}
vs
${c.spec.mpg.replace(/[^\d.]/g,'')}
`;
// List
const list = document.getElementById('comp-details-list');
list.innerHTML = '';
c.details.forEach(d => {
const li = document.createElement('li');
li.innerHTML = d;
list.appendChild(li);
});
document.getElementById('comp-note').innerText = `"${c.note}"`;
// Radar
const ctx = document.getElementById('radarChart').getContext('2d');
if(this.chart) this.chart.destroy();
this.chart = new Chart(ctx, {
type: 'radar',
data: {
labels: ['Valeur', 'Fiabilité', 'Techno', 'Efficacité', 'Sécurité'],
datasets: [
{ label: 'TOYOTA', data: [m.radar.val, m.radar.rel, m.radar.tech, m.radar.eff, m.radar.sec], borderColor: '#EB0A1E', backgroundColor: 'rgba(235,10,30,0.2)', borderWidth: 2 },
{ label: 'CONCURRENT', data: [c.radar.val, c.radar.rel, c.radar.tech, c.radar.eff, c.radar.sec], borderColor: '#9CA3AF', backgroundColor: 'rgba(156,163,175,0.2)', borderWidth: 2, borderDash: [5,5] }
]
},
options: { responsive: true, maintainAspectRatio: false, scales: { r: { min: 0, max: 10, ticks: { display: false } } }, plugins: { legend: { display: false } } }
});
},
resetView() {
document.getElementById('detail-view').classList.add('hidden');
document.getElementById('model-grid').classList.remove('hidden');
document.getElementById('filter-container').classList.remove('hidden');
}
};
app.init();
