simplekolecalc/kole.html
2023-05-29 13:53:36 +02:00

181 lines
5.3 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html>
<head>
<title>Rechner zwischen Brutto-Netto-KoLe</title>
<link rel="stylesheet" href="https://wtf-eg.de/css/style.css?h=56fa462e"/>
<style>
<!--
@media only screen {
}
-->
@media only screen and (max-width: 600px){
body #wrap { font-size: 2.1em; }
input[type='number'],input+label { display: block;}
}
@media only screen and (min-width: 768px){
label {
display:inline-block;
width: 12ex;
}
body #wrap {
font-size: 1.2em;
}
}
<!--
body { font-family: sans-serif; }
-->
#wrap {
display: inline-block;
}
div fieldset{
margin: 0 auto;
max-width: 50ex;
padding: 2ex;
}
legend{
margin-bottom: 0px;
}
.radiogroup > legend{
min-width: 20ex;
display: inline-block;
float: left;
}
.radiogroup > label{
display: inline;
}
label{ min-width: 20ex; }
input[type='number']{text-align:right;}
input[readonly='readonly']{background-color:#eee;}
h1{
font-size: 2em;
text-align: center;
margin: 1ex auto 2ex auto;
}
</style>
</head>
<body>
<div id="#wrap">
<h1>Rechner zwischen Brutto-Netto-KoLe</h1>
<noscript>
Dieser Rechner ist auf JavaScript angewiesen!
</noscript>
<fieldset>
<legend></legend>
<section class="radiogroup">
<legend>Eingangsgröße</legend><!--
--><input accesskey="b" type="radio" name="b" value="e" id="bb" class="bb" checked="checked"/>&nbsp;<label for="bb"><u>B</u>rutto</label><!--
--><input accesskey="n" type="radio" name="b" value="b" id="bn" class="bb"/>&nbsp;<label for="bn"><u>N</u>etto</label><!--
--><input accesskey="k" type="radio" name="b" value="k" id="bk" class="bb"/>&nbsp;<label for="bk"><u>K</u>oLe</label>
</section>
<section>
<div>
<label for="e">Br<u>u</u>tto</label>
<input accesskey="u" type="number" step="0.01" id="e" value="100.00"/>&thinsp;
</div>
<div>
<label for="u">Umsatzsteuersatz</label>
<input type="number" step="0.01" id="u" value="19.00"/>&thinsp;%
</div>
<div>
<label for="us">Umsatzsteuer</label>
<input readonly="readonly" type="number" step="0.01" id="us" value="0.00"/>&thinsp;
</div>
<div>
<label for="n">N<u>e</u>tto</label>
<input accesskey="e" type="number" step="0.01" id="n" value="0.00"/>&thinsp;
</div>
<div>
<label for="ec">Entropie-Tarif</label><!-- ggf. künftig Grundlage wie Handbuch/Dokumentation verlinken -->
<select id="ec">
<option value="l" accesskey="l" name="low">Umsatz &leq;1.000&nbsp;</option><!-- low: <=1 TEUR -->
<option value="h" accesskey="h" name="high">Umsatz &gt;1.000&nbsp;</option><!-- high: >1 TEUR -->
<option value="c" accesskey="c" name="custom">nach&nbsp;Vereinbarung</option><!-- custom: separate agreement -->
</select>
</div>
<div>
<label for="z">Entropieumlagesatz</label>
<input type="number" step="0.01" id="z" value="23.00"/>&thinsp;%
</div>
<div>
<label for="eu">Entropieumlage</label>
<input readonly="readonly" type="number" step="0.01" id="eu" value="23.00"/>&thinsp;
</div>
<div>
<label for="k">K<u>o</u>Le</label>
<input accesskey="o" type="number" step="0.01" id="k" value="0.00"/>&thinsp;
</div>
</section>
<section>
<button accesskey="r" id="b" type="button">Be<u>r</u>echnen</button>
</section>
</fieldset>
<script>
var e=document.getElementById('e');
var u=document.getElementById('u');
var us=document.getElementById('us');
var n=document.getElementById('n');
var z=document.getElementById('z');
var eu=document.getElementById('eu');
var k=document.getElementById('k');
var bb=document.getElementById('bb');
var bn=document.getElementById('bn');
var bk=document.getElementById('bk');
var s = document.getElementById('b');
var c = document.getElementById('ec');
function getFormFloat(f){
return parseFloat(f.value);
}
function roundCents(f){
return f.toFixed(2);
}
s.addEventListener('click', function(){
if(bk.checked){
e.value = roundCents( getFormFloat(k) * ( 1 + getFormFloat(u) / 100 ) / ( 1 - getFormFloat(z) / 100 ) );
n.value = roundCents( getFormFloat(k) / ( 1 - getFormFloat(z) / 100 ) );
}else if(bb.checked){
k.value = roundCents( getFormFloat(e) / ( 1 + getFormFloat(u) / 100 ) * ( 1 - getFormFloat(z) / 100 ) );
n.value = roundCents( getFormFloat(e) / ( 1 + getFormFloat(u) / 100 ) );
}else if(bn.checked){
e.value = roundCents( getFormFloat(n) * ( 1 + getFormFloat(u) / 100 ) );
k.value = roundCents( getFormFloat(n) * ( 1 - getFormFloat(z) / 100 ) );
}
us.value = roundCents(e.value * getFormFloat(u) / 100 );
eu.value = roundCents(n.value * getFormFloat(z) / 100 );
});
e.addEventListener('change', function(){bb.checked = true;});
n.addEventListener('change', function(){bn.checked = true;});
c.addEventListener('change', function(){
var selInd=this.selectedIndex;
console.log('Entropie-Tarif: '+selInd+'('+z.disabled+': '+z.value+')');
switch(selInd){
case 0: //low: <1.000 EUR revenue
//23.0 %
z.value='23.00';
z.disabled=true;
break;;
case 1: //high: >1.000 EUR revenue
//11.5 %
z.disabled=true;
z.value='11.50';
break;;
case 2: //custom: according toseparate agreement
z.disabled=false;
//~ z.focus();
break;;
}
});
// set entropy tax to standard value
c.selectedIndex=0;
z.value='23.00';
z.disabled=true;
// calc
s.click();
</script>
</div>
</body>
</html>