';
}
var el = $("cityTop");
if (el) el.innerHTML = html || '
Нет данных
';
}
function renderBars() {
var list = visibleCities().slice().sort(function (a, b) { return cityRevenue(b) - cityRevenue(a); });
var max = 0;
for (var i = 0; i < list.length; i++) {
var v = cityRevenue(list[i]);
if (v > max) max = v;
}
var html = "";
for (var j = 0; j < list.length; j++) {
var c = list[j];
var rev = cityRevenue(c);
var d = deltaPct(rev, cityJan(c));
var pct = max ? Math.max(2, Math.round((rev / max) * 100)) : 0;
var color = d >= 0 ? "var(--kt-ai-chart-blue)" : "var(--kt-ai-chart-salmon)";
html += '';
}
var el = $("cityBars");
if (el) el.innerHTML = html || '
Нет данных
';
}
function renderTable() {
var list = visibleCities().slice().sort(function (a, b) { return cityRevenue(b) - cityRevenue(a); });
var html = "";
for (var i = 0; i < list.length; i++) {
var c = list[i];
var rev = cityRevenue(c);
var d = deltaPct(rev, cityJan(c));
var tr = '
' +
'
' + c.name + '
' +
'
' + (state.dir ? state.dir : "Все") + '
' +
'
' + c.stores + '
' +
'
' + fmtInt(Math.round(c.traffic * 1000)) + '
' +
'
' + fmtNum(rev, 1) + '
' +
'
' + fmtInt(c.avgCheck) + ' ₸
' +
'
' + deltaCell(d) + '
' +
'
' + statusPill(c.status, c.statusText) + '
' +
'
';
html += tr;
}
var tbody = $("cityTbody");
if (tbody) tbody.innerHTML = html;
var empty = $("cityEmpty");
if (empty) empty.hidden = list.length > 0;
var count = $("tableCount");
if (count) count.textContent = list.length + " из " + CITIES.length + " городов";
var sub = $("mainSub");
if (sub) sub.textContent = "Февраль 2026 · " + (state.dir || "все направления");
}
function renderMain() {
renderKpis();
renderTop();
renderBars();
renderTable();
}
function $$(sel, root) { return Array.prototype.slice.call((root || document).querySelectorAll(sel)); }
function $(id) { return document.getElementById(id); }
// ---------- Рендер: экран города ----------
function renderCity() {
var c = state.city;
if (!c) return;
var dir = null;
for (var k = 0; k < c.directions.length; k++) {
if (c.directions[k].id === state.dir) { dir = c.directions[k]; break; }
}
$("cityTitle").textContent = c.name;
var meta = c.stores + " магазинов";
if (dir) meta = "направление: " + dir.name;
$("cityMeta").textContent = meta + " · февраль 2026";
// KPI города
var rev = dir ? dir.revenue : c.revenue;
var jan = dir ? dir.jan : c.jan;
var d = deltaPct(rev, jan);
var kpi = "";
kpi += kpiCard("Выручка за февраль", fmtNum(rev, 1) + " млн ₸", "к январю: " + (d >= 0 ? "+" : "") + fmtNum(d, 1) + " %");
if (dir) {
kpi += kpiCard("Доля в выручке города", dir.shareOfCity + " %", dir.name);
} else {
kpi += kpiCard("Средний чек", fmtInt(c.avgCheck) + " ₸", "все направления");
}
kpi += kpiCard("Трафик", fmtInt(Math.round(c.traffic * 1000)) + " визитов", "в рознице за месяц");
kpi += kpiCard("Дол. розницы выручки", c.share + " %", "февраль 2026");
$("kpiCity").innerHTML = kpi;
// График по месяцам
var series = dir ? dir.trend : c.directions[0].trend.map(function (x, i) {
var s = 0;
for (var j = 0; j < c.directions.length; j++) s += c.directions[j].trend[i];
return Math.round(s * 10) / 10;
});
$("trendTitle").textContent = dir ? dir.name : "Динамика выручки";
var max = 0;
for (var m = 0; m < series.length; m++) { if (series[m] > max) max = series[m]; }
var bars = "";
for (var b = 0; b < series.length; b++) {
var h = max ? Math.max(3, Math.round((series[b] / max) * 100)) : 3;
var last = b === series.length - 1;
bars += '
' +
'' +
'
';
}
$("cityTrend").innerHTML = '
' + bars + '
' +
'
' + MONTHS_SHORT.map(function (s) { return '' + s + ''; }).join("") + '
';
// Каналы продаж
var chans = dir ? dir.channels : c.channels;
var cmax = chans[0] || 1;
var chhtml = "";
for (var ch = 0; ch < CHANNEL_NAMES.length; ch++) {
var cpct = Math.max(3, Math.round((chans[ch] / cmax) * 100));
var cshare = chans[0] + chans[1] + chans[2] > 0 ? Math.round((chans[ch] / (chans[0] + chans[1] + chans[2])) * 100) : 0;
chhtml += '
';
}
$("cityChannels").innerHTML = chhtml;
$("cityShare").textContent = (dir ? dir.shareOfCity : c.share) + " %";
// Итог
var sum;
if (dir) {
sum = c.name + ": направление «" + dir.name + "» " + (d >= 0 ? "выросло" : "снижилось") + " на " + fmtNum(Math.abs(d), 1) +
" % к январю — " + fmtNum(rev, 1) + " млн ₸ за февраль. " +
(d >= 0 ? "Динамика сохраняется третий месяц подряд." : "Снижение идёт второй месяц подряд — стоит проверить ассортимент и загрузку магазинов.");
} else {
sum = c.name + ": розничная выручка за февраль — " + fmtNum(c.revenue, 1) + " млн ₸, " +
(d >= 0 ? "выше" : "ниже") + " января на " + fmtNum(Math.abs(d), 1) + " %. " +
c.stores + " магазинов дали " + fmtInt(Math.round(c.traffic * 1000)) + " визитов при среднем чеке " + fmtInt(c.avgCheck) + " ₸. " +
"Доля розницы в выручке города — " + c.share + " %.";
var up = 0, dn = 0;
for (var u = 0; u < c.directions.length; u++) {
var dd = deltaPct(c.directions[u].revenue, c.directions[u].jan);
if (dd >= 0) up++; else dn++;
}
sum += " Рост по " + up + " направлениям, снижение по " + dn + ".";
}
$("citySummary").textContent = sum;
}
// ---------- События и переходы ----------
function openCity(id) {
for (var i = 0; i < CITIES.length; i++) {
if (CITIES[i].id === id) {
state.city = CITIES[i];
break;
}
}
if (!state.city) return;
renderCity();
var main = $("screen-main");
var city = $("screen-city");
if (main) main.classList.remove("is-active");
if (city) city.classList.add("is-active");
window.scrollTo(0, 0);
}
function showMain() {
var city = $("screen-city");
var main = $("screen-main");
if (city) city.classList.remove("is-active");
if (main) main.classList.add("is-active");
window.scrollTo(0, 0);
}
function initDirSelect() {
var sel = $("dirSelect");
if (!sel) return;
var ids = ["inet", "tv", "mobile", "smart", "b2b"];
for (var i = 0; i < ids.length; i++) {
var opt = document.createElement("option");
opt.value = ids[i];
opt.textContent = DIR_LABELS[ids[i]];
sel.appendChild(opt);
}
}
function bindEvents() {
var search = $("citySearch");
if (search) {
search.addEventListener("input", function () {
state.search = this.value;
renderMain();
});
}
var dir = $("dirSelect");
if (dir) {
dir.addEventListener("change", function () {
state.dir = this.value;
renderMain();
});
}
var back = $("backBtn");
if (back) back.addEventListener("click", showMain);
document.addEventListener("click", function (e) {
var t = e.target;
while (t && t !== document && !(t.dataset && t.dataset.openCity)) {
t = t.parentNode;
}
if (t && t.dataset && t.dataset.openCity) {
openCity(t.dataset.openCity);
}
});
}
function init() {
initDirSelect();
bindEvents();
renderMain();
}
document.addEventListener("DOMContentLoaded", init);