KPI Bonus App

KPI Bonus App — это веб-приложение для бизнес-расчетов с системой авторизации и разделением ролей. Позволяет рассчитывать ROI, доход от продаж и KPI сотрудников, управлять списком сотрудников и просматривать историю расчетов.

---

Возможности по ролям

Администратор

• Управление сотрудниками (добавление, удаление)
• Просмотр истории всех расчетов
• Удаление истории расчетов
• Скачивание истории в CSV
• Переключение темы (светлая/темная)

Пользователь

• Расчет ROI (окупаемость инвестиций)
• Расчет дохода от продаж
• Расчет KPI сотрудника
• Выбор сотрудника из списка
• Переключение темы (светлая/темная)

---

Авторизация

Страница входа

Регистрация нового пользователя:

• Заполните имя пользователя, email, пароль
• Подтвердите пароль
• Нажмите "Зарегистрироваться"

Вход в систему:

• Введите логин и пароль
• Нажмите "Войти"

Данные администратора (предустановлены):

• Логин: admin
• Пароль: admin123

Как это работает

• Данные пользователей хранятся в localStorage
• При успешной авторизации пользователь перенаправляется на dashboard.html
• Роль пользователя определяет, какие вкладки и функции ему доступны

---

Режимы калькулятора

1. ROI (Окупаемость инвестиций)

Формула: ((Доход - Вложения) / Вложения) × 100%

Что показывает:

• Процент окупаемости
• Чистую прибыль
• Коэффициент ROI

---

2. Доход (Выручка от продаж)

Формула: Количество продаж × Средняя стоимость

Что показывает:

• Общую выручку
• Количество продаж
• Средний чек

---

3. KPI сотрудника

Формула: (Факт / План) × 100% × (Вес / 100)

Что показывает:

• Итоговый KPI (%)
• Выполнение плана (%)
• Взвешенный результат
• Оценку эффективности

---

Описание файлов

HTML файлы

Файл	Назначение
index.html	Страница входа и регистрации. Содержит формы для логина и создания нового аккаунта.
dashboard.html	Главная страница с калькулятором. Содержит все режимы расчета, управление сотрудниками и историю.

CSS файлы

Файл	Назначение
main.css	Основные стили: фон, кнопки, карточки, поля ввода, прогресс-бары, адаптивность.
auth.css	Стили только для страницы авторизации: форма входа, табы, сообщения об ошибках.
dark.css	Темная тема: переопределяет цвета для всех элементов при включенном темном режиме.

JavaScript файлы

Файл	Назначение	Основные функции
app.js	Главный контроллер	switchMode() - переключение режимов calculate() - расчет результатов loadHistory() - загрузка истории exportHistoryToCSV() - скачивание CSV
auth.js	Авторизация на dashboard	checkAuth() - проверка входа hasPermission() - проверка прав logout() - выход из системы
auth-page.js	Авторизация на странице входа	registerUser() - регистрация loginUser() - вход guestLogin() - гость (отключен)
storage.js	Работа с хранилищем	getUsers() / saveUsers() getCalculations() / saveCalculation() getEmployees() / saveEmployees()
employees.js	Управление сотрудниками	addEmployee() - добавление deleteEmployee() - удаление loadEmployees() - загрузка списка
kpiCalculator.js	Расчет KPI	calculateKPI() - формула KPI getKPIGrade() - оценка (A/B/C/D/F)
roiCalculator.js	Расчет ROI	calculateROI() - формула ROI getROIGrade() - оценка доходности
revenueCalculator.js	Расчет дохода	calculateRevenue() - формула дохода getRevenueGrade() - оценка выручки

---

Хранение данных (localStorage)

Ключ	Что хранит	Когда используется
kpi_users	Список пользователей	При регистрации и входе
kpi_current_user	Текущий пользователь	При авторизации
kpi_calculations	История расчетов	При каждом расчете
kpi_employees	Список сотрудников	При добавлении/удалении
kpi_settings	Настройки (тема)	При переключении темы

---

Запуск проекта

1. Скачайте все файлы проекта
2. Откройте index.html в браузере
3. Зарегистрируйтесь или войдите как администратор (admin / admin123)