api_g

Sleeping

File size: 21,784 Bytes

<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<title>Калькулятор удобрений</title>
<style>
/* Общие стили для всех рамок */
fieldset, .calculation-box {
    border: 2px solid #2e8b57;
    background-color: #eaffea;
    padding: 1em;
    margin-bottom: 20px;
    border-radius: 8px;
    width: 1000px;
    box-sizing: border-box;
}

/* Стили для заголовка */
h1 {
    background-color: #2e8b57;
    color: white;
    text-align: center;
    padding: 1em;
    border-radius: 10px;
    margin: 0 auto 20px;
    width: 1200px;
    box-sizing: border-box;
}

legend {
    font-weight: bold;
    color: #2e8b57;
    padding: 0 10px;
}

/* Стили для основного контейнера профиля */
.main-container {
    display: grid;
    grid-template-columns: 120px repeat(8, 110px);
    gap: 30px; /* Увеличено с 15px до 30px */
    padding: 10px;
}

.profile-element {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px; /* Небольшое увеличение для вертикального разделения */
}

.profile-element input {
    width: 100%; /* Можно задать, например, 90px, если слишком плотно */
    max-width: 100px; /* Ограничение ширины для контроля */
}

.profile-label {
    font-weight: bold;
}

.profile-element input {
    width: 100%;
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
    text-align: center;
}

/* Стили для азотных элементов */
.nitrogen-container {
    grid-column: 1 / -1;
    display: flex;
    gap: 30px;
    padding-left: 120px;
    margin-top: 15px;
}

.nitrogen-group {
    display: flex;
    align-items: center;
    gap: 10px;
}

.nitrogen-group label {
    font-weight: bold;
}

.nitrogen-group input {
    width: 80px;
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

/* Стили для таблицы удобрений */
.fertilisers-container {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.fert-row {
    display: flex;
    align-items: center;
    gap: 10px;
}

.fert-header {
    font-weight: bold;
    text-align: center;
    width: 110px;
    padding: 5px;
}

.fert-name {
    font-weight: bold;
    width: 120px;
    text-align: left;
}

.fert-cell {
    text-align: center;
    width: 110px;
    padding: 5px;
}

.fert-input {
    width: 100px;
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
    text-align: center;
}

/* Стили для блока расчета */
.calculation-container {
    display: flex;
    gap: 50px;
    align-items: flex-start;
}

.compensation-section {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.enhancement-title {
    font-weight: bold;
    color: #2e8b57;
    font-size: 1.1em;
}

.compensation-weights {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.weight-input-group {
    display: flex;
    align-items: center;
    gap: 15px;
}

.weight-input-group label {
    width: 100px;
    text-align: right;
    font-weight: bold;
}

.weight-input-group input {
    width: 100px;
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.input-column {
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-top: 10px;
}

#calculate-btn {
    background-color: #2e8b57;
    color: white;
    border: none;
    padding: 10px 20px;
    font-size: 16px;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s;
    font-weight: bold;
}

#calculate-btn:hover {
    background-color: #3cb371;
}

.input-group {
    display: flex;
    align-items: center;
    gap: 15px;
}

.input-group label {
    width: 100px;
    text-align: right;
    font-weight: bold;
}

.input-group input {
    width: 100px;
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

/* Общие стили страницы */
body {
    margin: 0 auto;
    width: 1000px;
    padding: 1em;
    background-color: #f0f0f0;
    font-family: Arial, sans-serif;
    display: flex;
    flex-direction: column;
    align-items: center;
}
</style>

<body>
    <h1>Калькулятор удобрений</h1>

    <fieldset>
        <legend>Макропрофиль в мг/л (ppm)</legend>
        <div class="main-container">
            <!-- Основные элементы -->
            <div class="profile-container">
                <div class="profile-element" style="grid-column: 2">
                    <span class="profile-label">N</span>
                    <input id="profile_n" type="number" value="125.000" step="0.001"/>
                </div>
                <div class="profile-element" style="grid-column: 3">
                    <span class="profile-label">P</span>
                    <input id="profile_p" type="number" value="31.000" step="0.001"/>
                </div>
                <div class="profile-element" style="grid-column: 4">
                    <span class="profile-label">K</span>
                    <input id="profile_k" type="number" value="210.000" step="0.001"/>
                </div>
                <div class="profile-element" style="grid-column: 5">
                    <span class="profile-label">Ca</span>
                    <input id="profile_ca" type="number" value="84.000" step="0.001"/>
                </div>
                <div class="profile-element" style="grid-column: 6">
                    <span class="profile-label">Mg</span>
                    <input id="profile_mg" type="number" value="24.000" step="0.001"/>
                </div>
                <div class="profile-element" style="grid-column: 7">
                    <span class="profile-label">S</span>
                    <input id="profile_s" type="number" value="56.439" step="0.001"/>
                </div>
                <div class="profile-element" style="grid-column: 8">
                    <span class="profile-label">EC</span>
                    <input id="profile_ec" type="number" value="0.0" step="0.001"/>
                </div>
            </div>
            
            <!-- Азотные элементы -->
            <div class="nitrogen-container">
                <div class="nitrogen-group">
                    <label for="profile_nh4">NH4:</label>
                    <input id="profile_nh4" type="number" value="1.0" step="1.0" readonly style="background-color: #f0f0f0; color: #666;">
                </div>
                <div class="nitrogen-group">
                    <label for="profile_no3">NO3:</label>
                    <input id="profile_no3" type="number" value="10.0" step="0.01" min="5" max="10.001"/>
                </div>
            </div>
        </div>
    </fieldset>

    <fieldset>
        <legend>Составы солей</legend>
        <div class="fertilisers-container">
            <!-- Заголовки -->
            <div class="fert-row">
                <span class="fert-name">Удобрение</span>
                <span class="fert-header">NH4</span>
                <span class="fert-header">NO3</span>
                <span class="fert-header">P</span>
                <span class="fert-header">K</span>
                <span class="fert-header">Ca</span>
                <span class="fert-header">Mg</span>
                <span class="fert-header">S</span>
                <span class="fert-header">Грамм</span>
            </div>
            
            <!-- Строки с удобрениями -->
            <div class="fert-row">
                <span class="fert-name">CaN2O6</span>
                <span class="fert-cell">-</span>
                <input class="fert-input" type="number" value="11.863" step="0.001" id="fert_ca_no3"/>
                <span class="fert-cell">-</span>
                <span class="fert-cell">-</span>
                <input class="fert-input" type="number" value="16.972" step="0.001" id="fert_ca_ca"/>
                <span class="fert-cell">-</span>
                <span class="fert-cell">-</span>
                <input class="fert-input" type="number" step="0.001" id="calcium_nitrate"/>
            </div>
            
            <div class="fert-row">
                <span class="fert-name">KNO3</span>
                <span class="fert-cell">-</span>
                <input class="fert-input" type="number" value="13.854" step="0.001" id="fert_kno3_no3"/>
                <span class="fert-cell">-</span>
                <input class="fert-input" type="number" value="36.672" step="0.001" id="fert_kno3_k"/>
                <span class="fert-cell">-</span>
                <span class="fert-cell">-</span>
                <span class="fert-cell">-</span>
                <input class="fert-input" type="number" step="0.001" id="potassium_nitrate"/>
            </div>
            
            <div class="fert-row">
                <span class="fert-name">NH4NO3</span>
                <input class="fert-input" type="number" value="17.499" step="0.001" id="fert_nh4no3_nh4"/>
                <input class="fert-input" type="number" value="17.499" step="0.001" id="fert_nh4no3_no3"/>
                <span class="fert-cell">-</span>
                <span class="fert-cell">-</span>
                <span class="fert-cell">-</span>
                <span class="fert-cell">-</span>
                <span class="fert-cell">-</span>
                <input class="fert-input" type="number" step="0.001" id="ammonium_nitrate"/>
            </div>
            
            <div class="fert-row">
                <span class="fert-name">MgSO4</span>
                <span class="fert-cell">-</span>
                <span class="fert-cell">-</span>
                <span class="fert-cell">-</span>
                <span class="fert-cell">-</span>
                <span class="fert-cell">-</span>
                <input class="fert-input" type="number" value="10.22" step="0.001" id="fert_mgso4_mg"/>
                <input class="fert-input" type="number" value="13.483" step="0.001" id="fert_mgso4_s"/>
                <input class="fert-input" type="number" step="0.001" id="magnesium_sulfate"/>
            </div>
            
            <div class="fert-row">
                <span class="fert-name">KH2PO4</span>
                <span class="fert-cell">-</span>
                <span class="fert-cell">-</span>
                <input class="fert-input" type="number" value="22.761" step="0.001" id="fert_kh2po4_p"/>
                <input class="fert-input" type="number" value="28.731" step="0.001" id="fert_kh2po4_k"/>
                <span class="fert-cell">-</span>
                <span class="fert-cell">-</span>
                <span class="fert-cell">-</span>
                <input class="fert-input" type="number" step="0.001" id="monopotassium_phosphate"/>
            </div>
            
            <div class="fert-row">
                <span class="fert-name">K2SO4</span>
                <span class="fert-cell">-</span>
                <span class="fert-cell">-</span>
                <span class="fert-cell">-</span>
                <input class="fert-input" type="number" value="44.874" step="0.001" id="fert_k2so4_k"/>
                <span class="fert-cell">-</span>
                <span class="fert-cell">-</span>
                <input class="fert-input" type="number" value="18.401" step="0.001" id="fert_k2so4_s"/>
                <input class="fert-input" type="number"" value="0.0000000" step="0.001" id="potassium_sulfate"/>
            </div>
        </div>
    </fieldset>

    <fieldset class="calculation-box">
        <legend>Расчёт удобрений</legend>
        <div class="calculation-container">
            <!-- Блок с заголовком "Усиление" -->
            <div class="compensation-section">
                <div class="enhancement-title">Усиление:</div>
                
                <!-- Веса компенсации -->
                <div class="compensation-weights">
                    <div class="weight-input-group">
                        <label for="weight-k2so4">K₂SO₄:</label>
                        <input type="number" id="weight-k2so4" value="0.23" step="0.01" min="-1" max="1">
                    </div>
                    <div class="weight-input-group">
                        <label for="weight-mgso4">MgSO₄:</label>
                        <input type="number" id="weight-mgso4" value="-0.10" step="0.01" min="-1" max="1">
                    </div>
                    <div class="weight-input-group">
                        <label for="weight-kh2po4">KH₂PO₄:</label>
                        <input type="number" id="weight-kh2po4" value="0.14" step="0.01" min="-1" max="1">
                    </div>
                </div>
            </div>
            
            <div class="input-column">
                <button id="calculate-btn">Рассчитать</button>
                <div class="input-group">
                    <label for="liters-input">Литры:</label>
                    <input type="number" id="liters-input" value="100" min="1" step="1">
                </div>
                <div class="input-group">
                    <label for="rounding-precision">Точность:</label>
                    <input type="number" id="rounding-precision" value="3" min="0" max="3" step="1">
                </div>
            </div>
        </div>
    </fieldset>



<script>
let call_data;
  
document.getElementById('calculate-btn').addEventListener('click', function() {
    console.log("=== НАЧАЛО ОБРАБОТКИ ===");
    
    // 1. Получаем значение точности округления с подробным логированием
    const roundingInput = document.getElementById('rounding-precision');
    console.log("Значение поля rounding-precision (raw):", roundingInput.value);
    
    const initialRounding = parseInt(roundingInput.value);
    console.log("Парсинг значения rounding (после parseInt):", initialRounding);
    
    const roundingPrecision = Math.min(Math.max(initialRounding || 3, 0), 6);
    console.log("Финальное значение точности (0-6):", roundingPrecision);
    
    // 2. Улучшенная функция для безопасного получения числового значения с логированием
    const getValue = (id) => {
        const element = document.getElementById(id);
        if (!element) {
            console.error(`Элемент с ID ${id} не найден!`);
            return 0;
        }
        console.log(`Значение поля ${id}:`, element.value);
        
        const value = parseFloat(element.value);
        const result = isNaN(value) ? 0 : value;
        
        console.log(`Парсинг значения ${id}:`, result);
        return result;
    };
    // 3. Формируем данные для сервера с пошаговым логированием
    console.log("=== ФОРМИРОВАНИЕ ДАННЫХ ДЛЯ СЕРВЕРА ===");
    
    const fertilizerConstants = {
        "Кальциевая селитра": {
            "N (NO3-)": getValue('fert_ca_no3') / 100,
            "Ca": getValue('fert_ca_ca') / 100
        },
        "Калий азотнокислый": {
            "N (NO3-)": getValue('fert_kno3_no3') / 100,
            "K": getValue('fert_kno3_k') / 100
        },
        "Аммоний азотнокислый": {
            "N (NO3-)": getValue('fert_nh4no3_no3') / 100,
            "N (NH4+)": getValue('fert_nh4no3_nh4') / 100
        },
        "Сульфат магния": {
            "Mg": getValue('fert_mgso4_mg') / 100,
            "S": getValue('fert_mgso4_s') / 100
        },
        "Монофосфат калия": {
            "P": getValue('fert_kh2po4_p') / 100,
            "K": getValue('fert_kh2po4_k') / 100
        },
        "Калий сернокислый": {
            "K": getValue('fert_k2so4_k') / 100,
            "S": getValue('fert_k2so4_s') / 100
        }
    };
    
    const profileSettings = {
        'P': getValue('profile_p'),
        'K': getValue('profile_k'),
        'Mg': getValue('profile_mg'),
        'Ca': getValue('profile_ca'),
        'S': getValue('profile_s'),
        'NO3_RAT': getValue('profile_no3'),
        'TOTAL_NITROG': getValue('profile_n'),
        'liters': parseInt(document.getElementById('liters-input').value) || 1,
        'rounding_precision': roundingPrecision
    };
    
    const requestData = {
        fertilizerConstants: fertilizerConstants,
        profileSettings: profileSettings
    };
    
    console.log("=== ПОЛНЫЙ ОБЪЕКТ ДЛЯ ОТПРАВКИ ===", JSON.stringify(requestData, null, 2));
    
    // 4. Проверка данных с подробным выводом
    console.log("=== ПРОВЕРКА ДАННЫХ ===");
    
    const requiredFertilizers = ["Кальциевая селитра", "Калий азотнокислый", "Аммоний азотнокислый", 
                               "Сульфат магния", "Монофосфат калия", "Калий сернокислый"];
    
    let hasErrors = false;
    for (const fert of requiredFertilizers) {
        if (!requestData.fertilizerConstants[fert]) {
            console.error(`ОШИБКА: Отсутствует удобрение: ${fert}`);
            hasErrors = true;
        } else {
            console.log(`Удобрение ${fert} присутствует`);
        }
    }
    
    const requiredProfileFields = ['P', 'K', 'Mg', 'Ca', 'S', 'NO3_RAT', 'TOTAL_NITROG'];
    for (const field of requiredProfileFields) {
        if (isNaN(requestData.profileSettings[field])) {
            console.error(`ОШИБКА: Некорректное значение для параметра ${field}`);
            hasErrors = true;
        } else {
            console.log(`Параметр ${field} в порядке:`, requestData.profileSettings[field]);
        }
    }
    
    console.log("Параметр rounding_precision:", requestData.profileSettings.rounding_precision);
    
    if (hasErrors) {
        const errorMsg = "Пожалуйста, проверьте введенные данные. Обнаружены ошибки в форме. Смотрите консоль для деталей.";
        console.error(errorMsg);
        alert(errorMsg);
        return;
    }
    // 5. Отправка данных на сервер с полным логированием
    console.log("=== ОТПРАВКА ДАННЫХ НА СЕРВЕР ===");
    
    fetch('/calculation', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
        },
        body: JSON.stringify(requestData)
    })
    .then(response => {
        console.log("Получен ответ от сервера. Статус:", response.status);
        
        if (!response.ok) {
            console.error("ОШИБКА СЕРВЕРА. Полный ответ:", response);
            throw new Error(`HTTP error! status: ${response.status}`);
        }
        return response.json();
    })
    .then(data => {
        call_data = data;
        console.log("=== УСПЕШНЫЙ ОТВЕТ ОТ СЕРВЕРА ===", call_data);
            // Выводим данные в форму
             data_out(call_data);
        // Проверяем, применилась ли точность округления
        console.log("Проверка округления в ответе:");
        if (data.fertilizers) {
            Object.entries(data.fertilizers).forEach(([name, values]) => {
                console.log(`Удобрение ${name}:`, values);
            });
        }
        
        // Здесь можно добавить обработку ответа
    })
    .catch(error => {
        console.error("=== ОШИБКА ПРИ ОБРАБОТКЕ ===", error);
        alert("Ошибка при расчете: " + error.message);
    })
    .finally(() => {
        console.log("=== ЗАВЕРШЕНИЕ ОБРАБОТКИ ===");
    });
});




function data_out(response) {
 

    // Заполняем граммы для каждого удобрения
    const fertilizerGrams = {
        "Кальциевая селитра": "calcium_nitrate",
        "Калий азотнокислый": "potassium_nitrate",
        "Аммоний азотнокислый": "ammonium_nitrate",
        "Сульфат магния": "magnesium_sulfate",
        "Монофосфат калия": "monopotassium_phosphate",
        "Калий сернокислый": "potassium_sulfate"
    };

    for (const [fertName, gramsFieldId] of Object.entries(fertilizerGrams)) {
        const fertData = response.fertilizers[fertName];
        if (fertData) {
            const gramsInput = document.getElementById(gramsFieldId);
            if (gramsInput) {
                gramsInput.value = fertData.граммы.toFixed(3);
            } else {
                console.error(`Не найден элемент для ввода граммов: ${gramsFieldId}`);
            }
        }
    }

    // Выводим общую EC
    const ecInput = document.getElementById('profile_ec');
    if (ecInput && response.total_ec) {
        ecInput.value = response.total_ec.toFixed(2);
    }

    console.log("Данные успешно выведены в форму");
}


  
</script>



  
</body>
</html>