From 7e6f43db042b20a5740cfd0d6f04f6e6bf0cc80a Mon Sep 17 00:00:00 2001
From: Dauren777 <daurenmoldabaev99@mail.com>
Date: Fri, 19 Jun 2026 07:03:24 +0000
Subject: [PATCH] v8 - budget dashboard with plan input by month

---
 budget-dashboard.html | 185 ++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 185 insertions(+)

diff --git a/budget-dashboard.html b/budget-dashboard.html
index 1cc9ad2..6fbf54b 100644
--- a/budget-dashboard.html
+++ b/budget-dashboard.html
@@ -68,6 +68,7 @@ th,td{padding:8px}
     <button class="tab active" onclick="showTab('summary')">Сводная таблица</button>
     <button class="tab" onclick="showTab('by-branch')">По филиалам</button>
     <button class="tab" onclick="showTab('by-article')">По статьям</button>
+    <button class="tab" onclick="showTab('plan')">Ввод плана</button>
   </div>
 
   <!-- Сводная таблица -->
@@ -200,6 +201,82 @@ th,td{padding:8px}
       </table>
     </div>
   </div>
+
+  <!-- Ввод плана -->
+  <div id="tab-plan" class="hidden">
+    <div class="card">
+      <h2>Ввод плановых показателей по месяцам</h2>
+      <p style="color:var(--gray-500);margin-bottom:24px">Введите плановые показатели для каждой статьи по месяцам. Данные сохраняются автоматически.</p>
+      
+      <div class="filter-bar">
+        <select id="plan-month" onchange="renderPlanTable()">
+          <option value="Январь">Январь</option>
+          <option value="Февраль">Февраль</option>
+          <option value="Март">Март</option>
+          <option value="Апрель">Апрель</option>
+          <option value="Май">Май</option>
+          <option value="Июнь" selected>Июнь</option>
+          <option value="Июль">Июль</option>
+          <option value="Август">Август</option>
+          <option value="Сентябрь">Сентябрь</option>
+          <option value="Октябрь">Октябрь</option>
+          <option value="Ноябрь">Ноябрь</option>
+          <option value="Декабрь">Декабрь</option>
+        </select>
+        <select id="plan-branch" onchange="renderPlanTable()">
+          <option value="all">Все филиалы (сводный)</option>
+          ${branches.map(b => `<option value="${b}">${b}</option>`).join('')}
+        </select>
+        <button class="btn btn-success" onclick="savePlanData()">Сохранить</button>
+        <button class="btn btn-download" onclick="exportPlanToExcel()">Скачать план Excel</button>
+      </div>
+      
+      <table id="plan-table">
+        <thead>
+          <tr>
+            <th>Статья бюджета</th>
+            <th class="text-right">План на месяц (тенге)</th>
+            <th class="text-right">План на год (тенге)</th>
+          </tr>
+        </thead>
+        <tbody id="plan-body"></tbody>
+        <tfoot>
+          <tr class="total-row">
+            <td><strong>ИТОГО</strong></td>
+            <td class="text-right" id="plan-total-month">0</td>
+            <td class="text-right" id="plan-total-year">0</td>
+          </tr>
+        </tfoot>
+      </table>
+    </div>
+    
+    <div class="card">
+      <h2>Помесячный план (свод)</h2>
+      <div style="overflow-x:auto">
+        <table id="monthly-plan-table">
+          <thead>
+            <tr>
+              <th>Статья</th>
+              <th class="text-right">Янв</th>
+              <th class="text-right">Фев</th>
+              <th class="text-right">Мар</th>
+              <th class="text-right">Апр</th>
+              <th class="text-right">Май</th>
+              <th class="text-right">Июн</th>
+              <th class="text-right">Июл</th>
+              <th class="text-right">Авг</th>
+              <th class="text-right">Сен</th>
+              <th class="text-right">Окт</th>
+              <th class="text-right">Ноя</th>
+              <th class="text-right">Дек</th>
+              <th class="text-right">Итого</th>
+            </tr>
+          </thead>
+          <tbody id="monthly-plan-body"></tbody>
+        </table>
+      </div>
+    </div>
+  </div>
 </div>
 
 <script>
@@ -399,6 +476,11 @@ function showTab(tab) {
   document.getElementById('tab-summary').classList.toggle('hidden', tab !== 'summary');
   document.getElementById('tab-by-branch').classList.toggle('hidden', tab !== 'by-branch');
   document.getElementById('tab-by-article').classList.toggle('hidden', tab !== 'by-article');
+  document.getElementById('tab-plan').classList.toggle('hidden', tab !== 'plan');
+  if (tab === 'plan') {
+    renderPlanTable();
+    renderMonthlyPlanTable();
+  }
 }
 
 function exportToExcel() {
@@ -482,6 +564,109 @@ function downloadCSV(csv, filename) {
   link.click();
 }
 
+// Plan functions
+let planData = JSON.parse(localStorage.getItem('plan-data')) || {};
+
+function savePlanData() {
+  const month = document.getElementById('plan-month').value;
+  const branch = document.getElementById('plan-branch').value;
+  const key = `${branch}-${month}`;
+  
+  const rows = document.querySelectorAll('#plan-body tr');
+  planData[key] = {};
+  
+  rows.forEach(row => {
+    const articleCode = row.getAttribute('data-code');
+    const monthPlan = parseInt(row.querySelector('.month-plan').value) || 0;
+    const yearPlan = parseInt(row.querySelector('.year-plan').value) || 0;
+    planData[key][articleCode] = {monthPlan, yearPlan};
+  });
+  
+  localStorage.setItem('plan-data', JSON.stringify(planData));
+  alert('План сохранён!');
+  renderMonthlyPlanTable();
+}
+
+function renderPlanTable() {
+  const month = document.getElementById('plan-month').value;
+  const branch = document.getElementById('plan-branch').value;
+  const key = `${branch}-${month}`;
+  const data = planData[key] || {};
+  
+  const tbody = document.getElementById('plan-body');
+  tbody.innerHTML = '';
+  
+  let totalMonth = 0, totalYear = 0;
+  
+  articles.forEach(article => {
+    const item = data[article.code] || {monthPlan: 0, yearPlan: 0};
+    totalMonth += item.monthPlan;
+    totalYear += item.yearPlan;
+    
+    const row = document.createElement('tr');
+    row.setAttribute('data-code', article.code);
+    row.innerHTML = `
+      <td>${article.name}</td>
+      <td class="text-right"><input type="number" class="month-plan" value="${item.monthPlan}" style="width:150px;text-align:right;padding:8px;border:2px solid var(--gray-100);border-radius:6px"></td>
+      <td class="text-right"><input type="number" class="year-plan" value="${item.yearPlan}" style="width:150px;text-align:right;padding:8px;border:2px solid var(--gray-100);border-radius:6px"></td>
+    `;
+    tbody.appendChild(row);
+  });
+  
+  document.getElementById('plan-total-month').textContent = totalMonth.toLocaleString('ru-RU');
+  document.getElementById('plan-total-year').textContent = totalYear.toLocaleString('ru-RU');
+}
+
+function renderMonthlyPlanTable() {
+  const months = ['Январь','Февраль','Март','Апрель','Май','Июнь','Июль','Август','Сентябрь','Октябрь','Ноябрь','Декабрь'];
+  const branch = document.getElementById('plan-branch').value;
+  
+  const tbody = document.getElementById('monthly-plan-body');
+  tbody.innerHTML = '';
+  
+  articles.forEach(article => {
+    const row = document.createElement('tr');
+    let total = 0;
+    let cells = `<td>${article.name}</td>`;
+    
+    months.forEach(month => {
+      const key = `${branch}-${month}`;
+      const data = planData[key] || {};
+      const item = data[article.code] || {monthPlan: 0};
+      total += item.monthPlan;
+      cells += `<td class="text-right">${item.monthPlan.toLocaleString('ru-RU')}</td>`;
+    });
+    
+    cells += `<td class="text-right"><strong>${total.toLocaleString('ru-RU')}</strong></td>`;
+    row.innerHTML = cells;
+    tbody.appendChild(row);
+  });
+}
+
+function exportPlanToExcel() {
+  const months = ['Январь','Февраль','Март','Апрель','Май','Июнь','Июль','Август','Сентябрь','Октябрь','Ноябрь','Декабрь'];
+  const branch = document.getElementById('plan-branch').value;
+  
+  let csv = '\uFEFF';
+  csv += 'Статья;' + months.join(';') + ';Итого\n';
+  
+  articles.forEach(article => {
+    let row = article.name;
+    let total = 0;
+    months.forEach(month => {
+      const key = `${branch}-${month}`;
+      const data = planData[key] || {};
+      const item = data[article.code] || {monthPlan: 0};
+      total += item.monthPlan;
+      row += ';' + item.monthPlan;
+    });
+    row += ';' + total;
+    csv += row + '\n';
+  });
+  
+  downloadCSV(csv, `budget_plan_${branch}_${new Date().toISOString().slice(0,10)}.csv`);
+}
+
 renderAll();
 </script>