|
<!DOCTYPE html> |
|
<html lang="ru"> |
|
<head> |
|
<meta charset="UTF-8"> |
|
<title>Калькулятор удобрений</title> |
|
<style> |
|
body { |
|
margin: 0 auto; |
|
width: 1000px; |
|
padding: 1em; |
|
background-color: #f0f0f0; |
|
font-family: Arial, sans-serif; |
|
} |
|
|
|
fieldset { |
|
border: 2px solid #2e8b57; |
|
background-color: #eaffea; |
|
padding: 1em; |
|
margin-bottom: 20px; |
|
border-radius: 8px; |
|
} |
|
h1 { |
|
background-color: #2e8b57; |
|
color: white; |
|
text-align: center; |
|
padding: 1em; |
|
border-radius: 10px; |
|
margin-bottom: 20px; |
|
} |
|
legend { |
|
font-weight: bold; |
|
color: #2e8b57; |
|
padding: 0 10px; |
|
} |
|
input[type=number] { |
|
width: 80px; |
|
padding: 3px; |
|
border: 1px solid #ccc; |
|
border-radius: 4px; |
|
} |
|
|
|
|
|
.main-container { |
|
display: grid; |
|
grid-template-columns: 120px repeat(8, 90px); |
|
gap: 10px; |
|
padding: 10px; |
|
} |
|
|
|
|
|
.profile-container { |
|
display: contents; |
|
} |
|
|
|
.profile-element { |
|
display: flex; |
|
flex-direction: column; |
|
align-items: center; |
|
} |
|
|
|
.profile-label { |
|
font-weight: bold; |
|
margin-bottom: 5px; |
|
} |
|
|
|
|
|
.nitrogen-container { |
|
grid-column: 1 / -1; |
|
display: flex; |
|
gap: 20px; |
|
padding-left: 120px; |
|
margin-top: 10px; |
|
} |
|
|
|
.nitrogen-group { |
|
display: flex; |
|
align-items: center; |
|
gap: 5px; |
|
} |
|
|
|
|
|
.fertilisers-container { |
|
display: flex; |
|
flex-direction: column; |
|
} |
|
|
|
.fert-row { |
|
display: flex; |
|
align-items: center; |
|
margin-bottom: 10px; |
|
} |
|
|
|
.fert-header { |
|
font-weight: bold; |
|
text-align: center; |
|
min-width: 90px; |
|
padding: 5px; |
|
} |
|
|
|
.fert-name { |
|
font-weight: bold; |
|
min-width: 120px; |
|
text-align: left; |
|
padding-right: 10px; |
|
} |
|
|
|
.fert-cell { |
|
text-align: center; |
|
min-width: 90px; |
|
padding: 5px; |
|
} |
|
|
|
.fert-input { |
|
width: 80px; |
|
margin: 0 5px; |
|
} |
|
|
|
|
|
|
|
|
|
.calculation-box { |
|
border: 2px solid #2e8b57; |
|
background-color: #eaffea; |
|
padding: 1em; |
|
margin-bottom: 20px; |
|
border-radius: 8px; |
|
} |
|
|
|
.calculation-box legend { |
|
font-weight: bold; |
|
color: #2e8b57; |
|
padding: 0 10px; |
|
} |
|
|
|
.calculation-container { |
|
display: flex; |
|
align-items: center; |
|
gap: 10px; |
|
} |
|
|
|
.calculation-label { |
|
font-weight: bold; |
|
margin-right: 5px; |
|
} |
|
|
|
#liters-input { |
|
width: 80px; |
|
padding: 3px; |
|
border: 1px solid #ccc; |
|
border-radius: 4px; |
|
} |
|
|
|
#calculate-btn { |
|
background-color: #2e8b57; |
|
color: white; |
|
border: none; |
|
padding: 8px 16px; |
|
font-size: 16px; |
|
border-radius: 5px; |
|
cursor: pointer; |
|
transition: background-color 0.3s; |
|
} |
|
|
|
#calculate-btn:hover { |
|
background-color: #3cb371; |
|
} |
|
|
|
</style> |
|
</head> |
|
|
|
<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_p" 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_k" 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_ca" 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_mg" 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_s" 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_cl" 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; border: 1px solid #ccc; 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" step="0.001" id="potassium_sulfate"/> |
|
</div> |
|
</div> |
|
</fieldset> |
|
|
|
|
|
<fieldset class="calculation-box"> |
|
<legend>Расчёт удобрений</legend> |
|
<div class="calculation-container"> |
|
<div class="calculation-label">Литры:</div> |
|
<input type="number" id="liters-input" value="100" min="1" step="1"> |
|
<button id="calculate-btn">Рассчитать</button> |
|
</div> |
|
</fieldset> |
|
|
|
|
|
<script> |
|
<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" readonly/> |
|
</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; border: 1px solid #ccc; 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" readonly/> |
|
</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" readonly/> |
|
</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" readonly/> |
|
</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" readonly/> |
|
</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" readonly/> |
|
</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" step="0.001" id="potassium_sulfate" readonly/> |
|
</div> |
|
</div> |
|
</fieldset> |
|
|
|
<fieldset class="calculation-box"> |
|
<legend>Расчёт удобрений</legend> |
|
<div class="calculation-container"> |
|
<div class="calculation-label">Литры:</div> |
|
<input type="number" id="liters-input" value="100" min="1" step="1"> |
|
<button id="calculate-btn">Рассчитать</button> |
|
</div> |
|
</fieldset> |
|
|
|
<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" readonly/> |
|
</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; border: 1px solid #ccc; 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" readonly/> |
|
</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" readonly/> |
|
</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" readonly/> |
|
</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" readonly/> |
|
</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" readonly/> |
|
</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" step="0.001" id="potassium_sulfate" readonly/> |
|
</div> |
|
</div> |
|
</fieldset> |
|
|
|
<fieldset class="calculation-box"> |
|
<legend>Расчёт удобрений</legend> |
|
<div class="calculation-container"> |
|
<div class="calculation-label">Литры:</div> |
|
<input type="number" id="liters-input" value="100" min="1" step="1"> |
|
<button id="calculate-btn">Рассчитать</button> |
|
</div> |
|
</fieldset> |
|
|
|
<script> |
|
document.getElementById('calculate-btn').addEventListener('click', function() { |
|
|
|
const getValue = (id) => { |
|
const element = document.getElementById(id); |
|
if (!element) { |
|
console.error(`Element with id ${id} not found`); |
|
return 0; |
|
} |
|
const val = parseFloat(element.value); |
|
return isNaN(val) ? 0 : val; |
|
}; |
|
|
|
|
|
const requestData = { |
|
fertilizerConstants: { |
|
"CaN2O6": { |
|
"NO3": getValue('fert_ca_no3'), |
|
"Ca": getValue('fert_ca_ca') |
|
}, |
|
"KNO3": { |
|
"NO3": getValue('fert_kno3_no3'), |
|
"K": getValue('fert_kno3_k') |
|
}, |
|
"NH4NO3": { |
|
"NH4": getValue('fert_nh4no3_nh4'), |
|
"NO3": getValue('fert_nh4no3_no3') |
|
}, |
|
"MgSO4": { |
|
"Mg": getValue('fert_mgso4_mg'), |
|
"S": getValue('fert_mgso4_s') |
|
}, |
|
"KH2PO4": { |
|
"P": getValue('fert_kh2po4_p'), |
|
"K": getValue('fert_kh2po4_k') |
|
}, |
|
"K2SO4": { |
|
"K": getValue('fert_k2so4_k'), |
|
"S": getValue('fert_k2so4_s') |
|
} |
|
}, |
|
profileSettings: { |
|
'P': getValue('profile_p'), |
|
'K': getValue('profile_k'), |
|
'Mg': getValue('profile_mg'), |
|
'Ca': getValue('profile_ca'), |
|
'S': getValue('profile_s'), |
|
'NO3': getValue('profile_no3'), |
|
'NH4': getValue('profile_nh4'), |
|
'liters': parseInt(document.getElementById('liters-input').value) || 1 |
|
} |
|
}; |
|
|
|
|
|
console.log("Данные для отправки на сервер:"); |
|
console.log(JSON.stringify(requestData, null, 2)); |
|
|
|
|
|
fetch('/calculation', { |
|
method: 'POST', |
|
headers: { |
|
'Content-Type': 'application/json', |
|
}, |
|
body: JSON.stringify(requestData) |
|
}) |
|
.then(response => { |
|
if (!response.ok) { |
|
return response.json().then(err => { throw new Error(err.error || 'Server error'); }); |
|
} |
|
return response.json(); |
|
}) |
|
.then(data => { |
|
console.log("Ответ от сервера:", data); |
|
|
|
|
|
const fertilizerFields = { |
|
"Сульфат магния": "magnesium_sulfate", |
|
"Кальциевая селитра": "calcium_nitrate", |
|
"Монофосфат калия": "monopotassium_phosphate", |
|
"Аммоний азотнокислый": "ammonium_nitrate", |
|
"Калий сернокислый": "potassium_sulfate", |
|
"Калий азотнокислый": "potassium_nitrate" |
|
}; |
|
|
|
|
|
Object.values(fertilizerFields).forEach(id => { |
|
const field = document.getElementById(id); |
|
if (field) field.value = ''; |
|
}); |
|
|
|
|
|
if (data.fertilizers) { |
|
data.fertilizers.forEach(fert => { |
|
const fieldId = fertilizerFields[fert.name]; |
|
if (fieldId) { |
|
const field = document.getElementById(fieldId); |
|
if (field) { |
|
field.value = fert.grams ? fert.grams.toFixed(3) : "0"; |
|
} |
|
} |
|
}); |
|
} |
|
|
|
|
|
const ecField = document.getElementById('profile_ec'); |
|
if (ecField && data.ec !== undefined) { |
|
ecField.value = data.ec.toFixed(2); |
|
} |
|
}) |
|
.catch(error => { |
|
console.error('Ошибка:', error); |
|
alert('Ошибка при расчете: ' + error.message); |
|
}); |
|
}); |
|
</script> |
|
|
|
|
|
</body> |
|
</html> |