itsecd · Kuzhuc · Nov 9, 2025 · Nov 10, 2025 · Nov 10, 2025 · Nov 12, 2025
diff --git a/ЛР/index.html b/ЛР/index.html
@@ -0,0 +1,70 @@
+<!DOCTYPE html>
+<html lang="ru">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Простой калькулятор</title>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+    <link rel="stylesheet" href="style.css">
+</head>
+<body>
+    <div class="calculator-container">
+        <div class="header">
+            <h1><i class="fas fa-calculator"></i> Калькулятор</h1>
+        </div>
+
+        <div class="input-group">
+            <label for="num1">Первое число:</label>
+            <input type="number" id="num1" class="input-field" placeholder="Введите число" step="any" value="15">
+        </div>
+
+        <div class="input-group">
+            <label for="num2">Второе число:</label>
+            <input type="number" id="num2" class="input-field" placeholder="Введите число" step="any" value="5">
+        </div>
+
+        <div class="operation-selector">
+            <label for="operation">Операция:</label>
+            <select id="operation" class="operation-select">
+                <option value="add">Сложение (+)</option>
+                <option value="subtract">Вычитание (-)</option>
+                <option value="multiply">Умножение (×)</option>
+                <option value="divide">Деление (÷)</option>
+            </select>
+
+            <div class="operation-icons">
+                <div class="operation-icon" data-operation="add">
+                    <i class="fas fa-plus"></i>
+                    <span>Сложение</span>
+                </div>
+                <div class="operation-icon" data-operation="subtract">
+                    <i class="fas fa-minus"></i>
+                    <span>Вычитание</span>
+                </div>
+                <div class="operation-icon" data-operation="multiply">
+                    <i class="fas fa-times"></i>
+                    <span>Умножение</span>
+                </div>
+                <div class="operation-icon" data-operation="divide">
+                    <i class="fas fa-divide"></i>
+                    <span>Деление</span>
+                </div>
+                <div class="operation-icon" data-operation="clear">
+                    <i class="fas fa-broom"></i>
+                    <span>Очистить</span>
+                </div>
+            </div>
+        </div>
+
+        <button id="calculate" class="calculate-button">
+            <i class="fas fa-equals"></i> Вычислить
+        </button>
+
+        <div class="result-container">
+            <span class="result-label">Результат:</span>
+            <div id="result" class="result-value">20</div>
+        </div>
+    </div>
+    <script src="script.js"></script>
+</body>
+</html>
diff --git a/ЛР/script.js b/ЛР/script.js
@@ -0,0 +1,127 @@
+document.addEventListener('DOMContentLoaded', function() {
+    const num1Input = document.getElementById('num1');
+    const num2Input = document.getElementById('num2');
+    const operationSelect = document.getElementById('operation');
+    const calculateButton = document.getElementById('calculate');
+    const resultDiv = document.getElementById('result');
+    const operationIcons = document.querySelectorAll('.operation-icon'); 
+
+    operationIcons.forEach(icon => {
+        icon.addEventListener('click', function() {
+            const operation = this.getAttribute('data-operation');
+
+            operationIcons.forEach(icon => icon.classList.remove('active'));
+            this.classList.add('active');
+
+            if (operation === 'clear') {
+                clearCalculator();
+                this.classList.remove('active');
+                return;
+            }
+
+            operationSelect.value = operation;
+
+            if (num1Input.value && num2Input.value) {
+                calculate();
+            }
+        });
+    });
+
+    operationSelect.addEventListener('change', function() {
+        updateActiveIcon(this.value);
+
+        if (num1Input.value && num2Input.value) {
+            calculate();
+        }
+    });
+
+    num1Input.addEventListener('input', function() {
+        if (this.value && num2Input.value) {
+            calculate();
+        }
+    });
+
+    num2Input.addEventListener('input', function() {
+        if (this.value && num1Input.value) {
+            calculate();
+        }
+    });
+
+    calculateButton.addEventListener('click', calculate);
+
+    function calculate() {
+        const num1 = parseFloat(num1Input.value);
+        const num2 = parseFloat(num2Input.value);
+        const operation = operationSelect.value;
+
+        if (isNaN(num1) || isNaN(num2)) {
+            showError("Введите оба числа");
+            return;
+        }
+
+        let result;
+        let operationSymbol;
+
+        try {
+            switch(operation) {
+                case 'add':
+                    result = num1 + num2;
+                    operationSymbol = '+';
+                    break;
+                case 'subtract':
+                    result = num1 - num2;
+                    operationSymbol = '-';
+                    break;
+                case 'multiply':
+                    result = num1 * num2;
+                    operationSymbol = '×';
+                    break;
+                case 'divide':
+                    if (num2 === 0) {
+                        throw new Error("Деление на ноль");
+                    }
+                    result = num1 / num2;
+                    operationSymbol = '÷';
+                    break;
+                default:
+                    throw new Error("Неизвестная операция");
+            }
+
+            result = Math.round(result * 10000) / 10000;
+
+            resultDiv.textContent = result;
+            resultDiv.classList.remove('error');
+
+        } catch (error) {
+            showError(error.message);
+        }
+    }
+
+    function showError(message) {
+        resultDiv.textContent = "Ошибка: " + message;
+        resultDiv.classList.add('error');
+    }
+
+    function clearCalculator() {
+        num1Input.value = '';
+        num2Input.value = '';
+        operationSelect.value = 'add';
+        resultDiv.textContent = '0';
+        resultDiv.classList.remove('error');
+        updateActiveIcon('add');
+    }
+
+    function updateActiveIcon(operation) {
+        operationIcons.forEach(icon => icon.classList.remove('active'));
+
+        if (operation !== 'clear') {
+            const activeIcon = document.querySelector(`.operation-icon[data-operation="${operation}"]`);
+            if (activeIcon) {
+                activeIcon.classList.add('active');
+            }
+        }
+    }
+
+    updateActiveIcon('add');
+    calculate();
+});