const fmt = n => n.toLocaleString('ru-RU') + ' ₽';
fetch('data.json').then(r => r.json()).then(d => {
  document.getElementById('total').textContent = fmt(d.total);

  new Chart(document.getElementById('chNodes'), {
    type: 'pie',
    data: { labels: Object.keys(d.per_node), datasets: [{ data: Object.values(d.per_node) }] },
    options: { plugins: { title: { display: true, text: 'Бюджет по узлам' } } }
  });
  new Chart(document.getElementById('chCats'), {
    type: 'doughnut',
    data: { labels: Object.keys(d.per_cat), datasets: [{ data: Object.values(d.per_cat) }] },
    options: { plugins: { title: { display: true, text: 'Бюджет по категориям' } } }
  });

  const tb = document.querySelector('#tbl tbody');
  d.rows.forEach(r => {
    const links = r.links.map(l => `<a href="${l.url}" target="_blank">${l.title}</a>`).join(' · ');
    tb.insertAdjacentHTML('beforeend',
      `<tr><td>${r.node}</td><td>${r.cat}</td><td>${r.name}</td><td>${r.qty}</td>
       <td class="num">${r.price.toLocaleString('ru-RU')}</td>
       <td class="num">${r.sub.toLocaleString('ru-RU')}</td><td>${links}</td></tr>`);
  });
});