498 lines
25 KiB
HTML
498 lines
25 KiB
HTML
|
<!doctype html>
|
||
|
|
<html>
|
||
|
|
<head>
|
||
|
|
<meta charset="utf-8"/>
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||
|
|
<title>Kostenerstattungsantrag Wikimedia Deutschland e.V.</title>
|
||
|
|
<link rel="stylesheet" href="kostenerstattung.css">
|
||
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
|
||
|
|
<script src="polyfiller.js"></script>
|
||
|
|
<script src="iban.js/iban.js"></script>
|
||
|
|
<script>
|
||
|
|
var eintraege = 0;
|
||
|
|
|
||
|
|
function neuerIndex()
|
||
|
|
{
|
||
|
|
var aufstellung = document.getElementById('Aufstellung'),
|
||
|
|
eintraege = document.querySelectorAll('#Aufstellung tbody tr');
|
||
|
|
for(var n = 0; n < eintraege.length; n++)
|
||
|
|
{
|
||
|
|
eintraege[n].querySelector('legend').textContent = n+1+'. Position';
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
function checkIban()
|
||
|
|
{
|
||
|
|
iban = document.getElementById('iban');
|
||
|
|
if( document.getElementById('eu').checked ) {
|
||
|
|
|
||
|
|
if(IBAN.isValid(iban.value))
|
||
|
|
{
|
||
|
|
if(iban.classList.contains('invalid')) iban.classList.remove('invalid');
|
||
|
|
iban.classList.add('valid');
|
||
|
|
}
|
||
|
|
else
|
||
|
|
{
|
||
|
|
if(iban.classList.contains('valid')) iban.classList.remove('valid');
|
||
|
|
iban.classList.add('invalid');
|
||
|
|
}
|
||
|
|
} else {
|
||
|
|
if(iban.classList.contains('invalid')) iban.classList.remove('invalid');
|
||
|
|
if(iban.classList.contains('valid')) iban.classList.remove('valid');
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
function neueZeileGebraucht()
|
||
|
|
{
|
||
|
|
var eintraege = document.querySelectorAll('#Aufstellung tbody tr');
|
||
|
|
if(2 === eintraege.length)
|
||
|
|
{
|
||
|
|
addLine();
|
||
|
|
return true;
|
||
|
|
}
|
||
|
|
|
||
|
|
var datum = document.getElementById('Datum['+(eintraege.length-1)+']'),
|
||
|
|
betrag = document.getElementById('Betrag['+(eintraege.length-1)+']');
|
||
|
|
|
||
|
|
if("" !== datum.value || "0.00" !== betrag.value) addLine();
|
||
|
|
}
|
||
|
|
|
||
|
|
function aktualisiereSumme()
|
||
|
|
{
|
||
|
|
var aufstellung = document.getElementById('Aufstellung'),
|
||
|
|
eintraege = document.querySelectorAll('#Aufstellung tbody tr'),
|
||
|
|
summe = 0-parseFloat(document.getElementById('vorschuss').value);
|
||
|
|
for(var e = 1; e < eintraege.length-1; e++)
|
||
|
|
{
|
||
|
|
// console.log('aktualisiereSumme/Summe: '+summe);
|
||
|
|
// console.log('aktualisiereSumme/eintraege[e].id: '+eintraege[e].id);
|
||
|
|
var id = parseInt(eintraege[e].id.match(/(\d+)/)[0]);
|
||
|
|
summe += parseFloat(document.getElementById('Betrag['+id+']').querySelector('input').value);
|
||
|
|
}
|
||
|
|
document.getElementById('Summe').textContent = summe.toLocaleString(false, { minimumFractionDigits: 2, useGrouping: true } );
|
||
|
|
// document.getElementById('Summe').textContent = summe.toFixed(2).toLocaleString();
|
||
|
|
}
|
||
|
|
|
||
|
|
function checkForUpdates()
|
||
|
|
{
|
||
|
|
// neueZeileGebraucht();
|
||
|
|
aktualisiereSumme();
|
||
|
|
}
|
||
|
|
|
||
|
|
function erstellePosition(p)
|
||
|
|
{
|
||
|
|
var vorlage = document.getElementById('neuerEintrag'),
|
||
|
|
neuerEintrag, inputs, labels, spans, textareas, tds;
|
||
|
|
|
||
|
|
neuerEintrag = document.importNode(vorlage.content, true);
|
||
|
|
neuerEintrag.querySelector('tr').id='Reihe['+p+']';
|
||
|
|
tds = neuerEintrag.querySelectorAll('td');
|
||
|
|
tds[0].id = 'Position['+p+']';
|
||
|
|
tds[1].id = 'Beschreibung['+p+']';
|
||
|
|
tds[2].id = 'Belegdatum['+p+']';
|
||
|
|
tds[3].id = 'Betrag['+p+']';
|
||
|
|
tds[4].id = 'Delete['+p+']';
|
||
|
|
tds[0].textContent = p;
|
||
|
|
tds[4].querySelector('button').onclick = delLine;
|
||
|
|
tds[4].querySelector('button').ontouch = delLine;
|
||
|
|
tds[3].querySelector('input').onchange = checkForUpdates;
|
||
|
|
spans = neuerEintrag.querySelectorAll('span');
|
||
|
|
return neuerEintrag;
|
||
|
|
}
|
||
|
|
|
||
|
|
function fadeIn(element)
|
||
|
|
{
|
||
|
|
console.log('Fading in');
|
||
|
|
var op = 0.1; // initial opacity
|
||
|
|
element.style.opacity = 0;
|
||
|
|
element.style.filter = 'alpha(opacity=0)';
|
||
|
|
element.style.display = 'table-row';
|
||
|
|
var timer = setInterval(function ()
|
||
|
|
{
|
||
|
|
element.style.opacity = op;
|
||
|
|
element.style.filter = 'alpha(opacity=' + op * 100 + ")";
|
||
|
|
op += op * 0.1;
|
||
|
|
if (op >= 1)
|
||
|
|
{
|
||
|
|
clearInterval(timer);
|
||
|
|
element.style.opacity = 1;
|
||
|
|
element.style.filter = 'alpha(opacity=100)';
|
||
|
|
}
|
||
|
|
}, 10);
|
||
|
|
}
|
||
|
|
function fadeOut(element)
|
||
|
|
{
|
||
|
|
console.log('Fading out');
|
||
|
|
var op = 1; // initial opacity
|
||
|
|
var timer = setInterval(function ()
|
||
|
|
{
|
||
|
|
if (op <= 0.1)
|
||
|
|
{
|
||
|
|
clearInterval(timer);
|
||
|
|
element.style.display = 'none';
|
||
|
|
}
|
||
|
|
element.style.opacity = op;
|
||
|
|
element.style.filter = 'alpha(opacity=' + op * 100 + ")";
|
||
|
|
op -= 0.05;
|
||
|
|
}, 25);
|
||
|
|
}
|
||
|
|
|
||
|
|
function removeAfterTimeout(element)
|
||
|
|
{
|
||
|
|
console.log('Removing '+element.id);
|
||
|
|
var eintraege = document.querySelectorAll('#Aufstellung tbody tr'),
|
||
|
|
aufstellung = document.getElementById('Aufstellung'),
|
||
|
|
currentId = parseInt(element.id.match(/(\d+)/)[0]);
|
||
|
|
element.parentNode.removeChild(document.getElementById('Reihe['+currentId+']'));
|
||
|
|
// console.log('removeAfterTimeout/currentId: '+currentId);
|
||
|
|
// console.log('removeAfterTimeout/eintraege.length: '+eintraege.length);
|
||
|
|
if((currentId+1) < (eintraege.length))
|
||
|
|
{
|
||
|
|
// if there are more entries after the one supposed to be deleted, change their index values to match their new position
|
||
|
|
for(var i = currentId+1; i < eintraege.length-1; i++)
|
||
|
|
{
|
||
|
|
// console.log('removeAfterTimeout/i: '+i);
|
||
|
|
var regex = new RegExp(/\d+/),
|
||
|
|
newIdx = i-1,
|
||
|
|
pos = document.getElementById('Reihe['+i+']');
|
||
|
|
// console.log('removeAfterTimeout/newIdx: '+newIdx);
|
||
|
|
// console.log('removeAfterTimeout/pos.id before: '+pos.id);
|
||
|
|
pos.id=pos.id.replace(regex,newIdx);
|
||
|
|
// console.log('removeAfterTimeout/pos.id after: '+pos.id);
|
||
|
|
for(var n = 0; n < pos.childNodes.length; n++)
|
||
|
|
{
|
||
|
|
if(1 == pos.childNodes[n].nodeType)
|
||
|
|
{
|
||
|
|
pos.childNodes[n].id=pos.childNodes[n].id.replace(/\d/,newIdx);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
document.getElementById('Position['+newIdx+']').textContent = newIdx;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
checkForUpdates();
|
||
|
|
}
|
||
|
|
|
||
|
|
function delLine()
|
||
|
|
{
|
||
|
|
var eintraege = document.querySelectorAll('#Aufstellung tbody tr'),
|
||
|
|
aufstellung = document.getElementById('Aufstellung');
|
||
|
|
var current = this.parentNode.parentNode;
|
||
|
|
console.log(current);
|
||
|
|
fadeOut(current);
|
||
|
|
setTimeout(removeAfterTimeout, 1100, current);
|
||
|
|
}
|
||
|
|
|
||
|
|
function addLine()
|
||
|
|
{
|
||
|
|
var eintraege = document.querySelectorAll('#Aufstellung tbody tr'),
|
||
|
|
aufstellung = document.getElementById('Aufstellung').querySelector('tbody');
|
||
|
|
|
||
|
|
var neu = erstellePosition(eintraege.length-1);
|
||
|
|
aufstellung.insertBefore(neu,document.getElementById('more'));
|
||
|
|
// var eingefuegt = aufstellung.querySelector('fieldset:last-of-type');
|
||
|
|
var eingefuegt = aufstellung.querySelector('tr:nth-last-of-type(2)');
|
||
|
|
// neuerIndex();
|
||
|
|
console.log('Adding '+eingefuegt.id);
|
||
|
|
fadeIn(eingefuegt);
|
||
|
|
}
|
||
|
|
|
||
|
|
function splitDateString(date) { return date.match(/(\d{4})-(\d{2})-(\d{2})/); }
|
||
|
|
function splitTimeString(time) { return time.match(/(\d{2}):(\d{2})/); }
|
||
|
|
|
||
|
|
function restoreFromCookie()
|
||
|
|
{
|
||
|
|
var c = document.cookie.match(new RegExp('Kostenerstattung' + '=([^;]+)'));
|
||
|
|
console.log(c);
|
||
|
|
if(c) {
|
||
|
|
c && (c = JSON.parse(c[1]));
|
||
|
|
document.getElementById('projekt').value = c.projekt;
|
||
|
|
document.getElementById('ansprech').value = c.ansprech;
|
||
|
|
document.getElementById('real').value = c.real;
|
||
|
|
document.getElementById('email').value = c.email;
|
||
|
|
document.getElementById('phone').value = c.phone;
|
||
|
|
document.getElementById('iban').value = c.iban;
|
||
|
|
document.getElementById('bic').value = c.bic;
|
||
|
|
document.getElementById('bank').value = c.bank;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
function storeToCookie()
|
||
|
|
{
|
||
|
|
var c =
|
||
|
|
{
|
||
|
|
'projekt': document.getElementById('projekt').value,
|
||
|
|
'ansprech': document.getElementById('ansprech').value,
|
||
|
|
'real': document.getElementById('real').value,
|
||
|
|
'email': document.getElementById('email').value,
|
||
|
|
'phone': document.getElementById('phone').value,
|
||
|
|
'iban': document.getElementById('iban').value,
|
||
|
|
'bic': document.getElementById('bic').value,
|
||
|
|
'bank': document.getElementById('bank').value,
|
||
|
|
};
|
||
|
|
document.cookie = 'Kostenerstattung='+JSON.stringify(c)+'; domain='+window.location.host.toString()+'; path=/extern; expires='+(new Date().getTime()+1000*60*60*24*365);
|
||
|
|
}
|
||
|
|
|
||
|
|
function init() {
|
||
|
|
document.getElementById("printDE_top").addEventListener('click', function() { window.print(); }, true);
|
||
|
|
document.getElementById("printEN_top").addEventListener('click', function() { window.print(); }, true);
|
||
|
|
document.getElementById("printDE_top").addEventListener('touch', function() { window.print(); }, true);
|
||
|
|
document.getElementById("printEN_top").addEventListener('touch', function() { window.print(); }, true);
|
||
|
|
document.getElementById("printDE_bottom").addEventListener('click', function() { window.print(); }, true);
|
||
|
|
document.getElementById("printEN_bottom").addEventListener('click', function() { window.print(); }, true);
|
||
|
|
document.getElementById("printDE_bottom").addEventListener('touch', function() { window.print(); }, true);
|
||
|
|
document.getElementById("printEN_bottom").addEventListener('touch', function() { window.print(); }, true);
|
||
|
|
document.getElementById('vorschuss').addEventListener('change', aktualisiereSumme);
|
||
|
|
document.getElementById('iban').addEventListener('change', checkIban);
|
||
|
|
/* document.getElementById('save').addEventListener('click', storeToCookie);
|
||
|
|
document.getElementById('save').addEventListener('touch', storeToCookie);*/
|
||
|
|
document.getElementById('addbutton_de').addEventListener('click', addLine);
|
||
|
|
document.getElementById('addbutton_de').addEventListener('touch', addLine);
|
||
|
|
document.getElementById('addbutton_en').addEventListener('click', addLine);
|
||
|
|
document.getElementById('addbutton_en').addEventListener('touch', addLine);
|
||
|
|
// if(document.cookie) restoreFromCookie();
|
||
|
|
}
|
||
|
|
|
||
|
|
function init2()
|
||
|
|
{
|
||
|
|
webshims.setOptions('forms-ext', {types: 'date'});
|
||
|
|
webshims.polyfill('forms forms-ext');
|
||
|
|
addLine();
|
||
|
|
aktualisiereSumme();
|
||
|
|
}
|
||
|
|
|
||
|
|
window.addEventListener('DOMContentLoaded',init);
|
||
|
|
window.addEventListener('load',init2);
|
||
|
|
|
||
|
|
</script>
|
||
|
|
</head>
|
||
|
|
|
||
|
|
<body>
|
||
|
|
<input class="screen radiobutton" type="radio" id="en" name="lang" value="en" checked><label class="screen" for="en">English</label>
|
||
|
|
<input class="screen radiobutton" type="radio" id="de" name="lang" value="de"><label class="screen" for="de">Deutsch</label>
|
||
|
|
<header>
|
||
|
|
<img style="float: right;" src="logo_web.png" alt="logo">
|
||
|
|
<h1 lang="de">Antrag auf Kostenerstattung</h1>
|
||
|
|
<h1 lang="en">Reimbursement Claims</h1>
|
||
|
|
<p lang="de">Bitte beachte beim Ausfüllen die <a href="https://www.wikimedia.de/wiki/Gesch%C3%A4ftsordnung#Reisekostenordnung">Reisekostenordnung</a>.</p>
|
||
|
|
</header>
|
||
|
|
<div id="printcontainerDE_top" lang="de"><input type="button" value="🖶 Antrag drucken" id="printDE_top" disabled></div>
|
||
|
|
<div id="printcontainerEN_top" lang="en"><input type="button" value="🖶 Print" id="printEN_top" disabled></div>
|
||
|
|
<main>
|
||
|
|
<fieldset>
|
||
|
|
<legend lang="de">Bitte fülle die allgemeinen Daten für die Erstattung aus.</legend>
|
||
|
|
<legend lang="en">Please fill in the general data for reimbursement.</legend>
|
||
|
|
<fieldset class="iblock">
|
||
|
|
<legend lang="de">Dein Projekt / Zweck der Reise</legend>
|
||
|
|
<legend lang="en">Your project / purpose of travel</legend>
|
||
|
|
<input required type="input" size="32" id="projekt" name="Projekt" placeholder="Projekt xy" />
|
||
|
|
</fieldset>
|
||
|
|
<fieldset class="iblock">
|
||
|
|
<legend lang="de">Deine Ansprechperson bei Wikimedia</legend>
|
||
|
|
<legend lang="en">Your contact person at Wikimedia</legend>
|
||
|
|
<input required type="input" size="32" id="ansprech" name="Ansprechperson" placeholder="John Doe" />
|
||
|
|
</fieldset>
|
||
|
|
<hr />
|
||
|
|
<fieldset class="iblock">
|
||
|
|
<legend lang="de">Deine Kontaktdaten</legend>
|
||
|
|
<legend lang="en">Contact details</legend>
|
||
|
|
<!-- <p>Eine Angabe reicht bereits</p>-->
|
||
|
|
<label for="real" lang="de">Dein Realname</label>
|
||
|
|
<label for="real" lang="en">Full legal name</label>
|
||
|
|
<input required type="input" size="32" id="real" name="Realname" placeholder="Corinna Commonsuser" />
|
||
|
|
<label for="email" lang="de">E-Mail-Adresse</label>
|
||
|
|
<label for="email" lang="en">Email address</label>
|
||
|
|
<input required type="email" size="32" id="email" name="Emailadresse" placeholder="name@example.org" />
|
||
|
|
<label for="phone" lang="de">Telefonnummer</label>
|
||
|
|
<label for="phone" lang="en">Phone number</label>
|
||
|
|
<input required type="tel" size="32" id="phone" name="Telefonnummer" placeholder="0123-456789" />
|
||
|
|
</fieldset>
|
||
|
|
<fieldset class="iblock" id="bankdetails">
|
||
|
|
<legend lang="de">Auszahlungsweg</legend>
|
||
|
|
<legend lang="en">Payout method</legend>
|
||
|
|
<!-- <span style="white-space: pre;"><input class="screen" type="radio" id="eu" name="bank" value="EU" checked><label class="screen" for="eu" lang="de">EU-Banküberweisung</label><label class="screen" for="eu" lang="en">EU bank transfer</label></span>
|
||
|
|
<span style="white-space: pre;"><input class="screen" type="radio" id="noneu" name="bank" value="Non-EU"><label class="screen" for="noneu" lang="en">Non EU bank transfer</label><label class="screen" for="noneu" lang="de">Non-EU-Banküberweisung</label></span>
|
||
|
|
<span style="white-space: pre;"><input class="screen" type="radio" id="paypal" name="bank" value="PayPal"><label class="screen" for="paypal">PayPal</label></span>
|
||
|
|
<span style="white-space: pre;"><input class="screen" type="radio" id="bar" name="bank" value="Bar"><label class="screen" for="bar" lang="de">Bargeld</label><label class="screen" for="bar" lang="en">Cash</label></span>-->
|
||
|
|
<input class="screen" type="radio" id="eu" name="bank" value="EU" checked><label class="screen radio" for="eu" lang="de">EU-Banküberweisung</label><label class="screen radio" for="eu" lang="en">EU bank transfer</label>
|
||
|
|
<input class="screen" type="radio" id="noneu" name="bank" value="Non-EU"><label class="screen radio" for="noneu" lang="de">Non-EU-Banküberweisung</label><label class="screen radio" for="noneu" lang="en">Non EU bank transfer</label>
|
||
|
|
<input class="screen" type="radio" id="paypal" name="bank" value="PayPal"><label class="screen radio" for="paypal">PayPal</label>
|
||
|
|
<input class="screen" type="radio" id="bar" name="bank" value="Bar"><label class="screen radio" for="bar" lang="de">Bargeld</label><label class="screen radio" for="bar" lang="en">Cash</label>
|
||
|
|
<label class="EU nonEU" for="owner" lang="de">Kontoinhaber</label><label class="EU nonEU" for="owner" lang="en">Bank account owner</label><input class="EU nonEU" type="input" size="32" id="ownerDe" name="Owner" placeholder="wenn abweichend vom Realnamen" lang="de" /><input class="EU nonEU" type="input" size="32" id="ownerEn" name="Owner" placeholder="if different from full legal name" lang="en" />
|
||
|
|
<label class="EU nonEU" for="iban" lang="de">IBAN</label><label class="EU nonEU" for="iban" lang="en">Bank account number</label><input class="EU nonEU" type="input" size="32" id="iban" name="IBAN" placeholder="DE0123…" />
|
||
|
|
<label class="EU nonEU" for="bic">BIC / SWIFT</label><input class="EU nonEU" type="input" size="32" id="bic" name="BIC" placeholder="LBMU…" />
|
||
|
|
<label class="EU nonEU" for="bank" lang="de">Name der Bank</label><label class="EU nonEU" for="bank" lang="en">Name of bank</label><input class="EU nonEU" type="input" size="32" id="bank" name="Bankname" placeholder="Banky McBankface" />
|
||
|
|
<label class="nonEU" for="bankaddress" lang="en">Bank address</label><textarea lang="en" class="nonEU" id="bankaddress" style="resize:both;" cols="32" rows="4" placeholder="Street and house number
|
||
|
|
Postal code and city
|
||
|
|
Country"></textarea>
|
||
|
|
<label class="nonEU" for="address" lang="en">Your address</label><textarea lang="en" class="nonEU" id="address" style="resize:both;" cols="32" rows="4" placeholder="Street and house number
|
||
|
|
Postal code and city
|
||
|
|
Country"></textarea>
|
||
|
|
<label class="EU nonEU" for="comments" lang="en">Further comments</label><textarea lang="en" class="EU nonEU" id="comments" style="resize:both;" cols="32" rows="4" placeholder="e.g. intermediary bank,
|
||
|
|
reasons for differing account owner"></textarea>
|
||
|
|
|
||
|
|
<label class="nonEU" for="bankaddress" lang="de">Bankanschrift</label><textarea lang="de" class="nonEU" id="bankaddress" style="resize:both;" cols="32" rows="4" placeholder="Straße und Hausnummer
|
||
|
|
Postleitzahl und Ort
|
||
|
|
Land"></textarea>
|
||
|
|
<label class="nonEU" for="address" lang="de">Deine Anschrift</label><textarea lang="de" class="nonEU" id="address" style="resize:both;" cols="32" rows="4" placeholder="Straße und Hausnummer
|
||
|
|
Postleitzahl und Ort
|
||
|
|
Land"></textarea>
|
||
|
|
<label class="EU nonEU" for="comments" lang="de">Weitere Anmerkungen</label><textarea lang="de" class="EU nonEU" id="comments" style="resize:both;" cols="32" rows="4" placeholder="z.B. intermdiäre Bank,
|
||
|
|
Grund für abweichende Kontoinhaberin"></textarea>
|
||
|
|
|
||
|
|
<label class="paypal" for="accountnumber">PayPal account</label><input class="paypal" type="input" size="32" id="paypal" placeholder="paypal@example.com" />
|
||
|
|
</fieldset>
|
||
|
|
<!-- <div id="datacontainer"><input type="button" value="💾 Diese Angaben für eine spätere Verwendung auf diesem Rechner sichern (Cookie). / Save these specifications for later use on this computer (cookie)." id="save"></div>-->
|
||
|
|
|
||
|
|
</fieldset>
|
||
|
|
<fieldset id="Aufstellung_alt">
|
||
|
|
<legend class="screen" lang="de">Bitte trage deine einzelnen Kostenpositionen ein.</legend>
|
||
|
|
<legend class="screen" lang="en">Please enter your cost items.</legend>
|
||
|
|
<p class="screen" lang="de">Bitte trage nur eine Ausgabe pro Zeile ein, lege den Originalbeleg dem Antrag bei und kennzeichne den Beleg mit der entsprechenden Zeilennummer.
|
||
|
|
Aus der Beschreibung soll zu ersehen sein, ob es sich um Transport, Dienstleistung, Materialien, Verpflegung oder ähnliches handelt.
|
||
|
|
|
||
|
|
<p class="screen" lang="en">Please enter only one expense per line, provide original receipt with your claim and tag the receipt with the appropriate line number.
|
||
|
|
The description of the expense should refer to the kind of expense, e.g. travel, service, materials, food or similar.</p>
|
||
|
|
<table id="Aufstellung">
|
||
|
|
<thead><tr id="aufstellungheader" style="font-size:80%;">
|
||
|
|
<th id="spalte0">Pos.</th>
|
||
|
|
<th id="spalte1"><span lang="de">Beschreibung</span><span lang="en">Description</span></th>
|
||
|
|
<th id="spalte2"><span lang="de">Belegdatum</span><span lang="en">Date</span></th>
|
||
|
|
<th id="spalte3"><span lang="de">Betrag</span><span lang="en">Sum</span>
|
||
|
|
<input list="waehrungen" name="waehrung" id="waehrung" placeholder="EUR, or enter currency code">
|
||
|
|
<datalist id="waehrungen">
|
||
|
|
<option value="USD">United States Dollars</option>
|
||
|
|
<option value="EUR" selected="selected">Euro</option>
|
||
|
|
<option value="GBP">United Kingdom Pounds</option>
|
||
|
|
<option value="DZD">Algeria Dinars</option>
|
||
|
|
<option value="ARP">Argentina Pesos</option>
|
||
|
|
<option value="AUD">Australia Dollars</option>
|
||
|
|
<option value="BSD">Bahamas Dollars</option>
|
||
|
|
<option value="BBD">Barbados Dollars</option>
|
||
|
|
<option value="BMD">Bermuda Dollars</option>
|
||
|
|
<option value="BRR">Brazil Real</option>
|
||
|
|
<option value="BGL">Bulgaria Lev</option>
|
||
|
|
<option value="CAD">Canada Dollars</option>
|
||
|
|
<option value="CLP">Chile Pesos</option>
|
||
|
|
<option value="CNY">China Yuan Renmimbi</option>
|
||
|
|
<option value="CSK">Czech Republic Koruna</option>
|
||
|
|
<option value="DKK">Denmark Kroner</option>
|
||
|
|
<option value="XCD">Eastern Caribbean Dollars</option>
|
||
|
|
<option value="EGP">Egypt Pounds</option>
|
||
|
|
<option value="FJD">Fiji Dollars</option>
|
||
|
|
<option value="HKD">Hong Kong Dollars</option>
|
||
|
|
<option value="HUF">Hungary Forint</option>
|
||
|
|
<option value="ISK">Iceland Krona</option>
|
||
|
|
<option value="INR">India Rupees</option>
|
||
|
|
<option value="IDR">Indonesia Rupiah</option>
|
||
|
|
<option value="ILS">Israel New Shekels</option>
|
||
|
|
<option value="JMD">Jamaica Dollars</option>
|
||
|
|
<option value="JPY">Japan Yen</option>
|
||
|
|
<option value="JOD">Jordan Dinar</option>
|
||
|
|
<option value="KRW">Korea (South) Won</option>
|
||
|
|
<option value="LBP">Lebanon Pounds</option>
|
||
|
|
<option value="MYR">Malaysia Ringgit</option>
|
||
|
|
<option value="MXP">Mexico Pesos</option>
|
||
|
|
<option value="NZD">New Zealand Dollars</option>
|
||
|
|
<option value="NOK">Norway Kroner</option>
|
||
|
|
<option value="PKR">Pakistan Rupees</option>
|
||
|
|
<option value="PHP">Philippines Pesos</option>
|
||
|
|
<option value="PLZ">Poland Zloty</option>
|
||
|
|
<option value="ROL">Romania Leu</option>
|
||
|
|
<option value="RUR">Russia Rubles</option>
|
||
|
|
<option value="SAR">Saudi Arabia Riyal</option>
|
||
|
|
<option value="SGD">Singapore Dollars</option>
|
||
|
|
<option value="ZAR">South Africa Rand</option>
|
||
|
|
<option value="KRW">South Korea Won</option>
|
||
|
|
<option value="SDD">Sudan Dinar</option>
|
||
|
|
<option value="SEK">Sweden Krona</option>
|
||
|
|
<option value="CHF">Switzerland Francs</option>
|
||
|
|
<option value="TWD">Taiwan Dollars</option>
|
||
|
|
<option value="THB">Thailand Baht</option>
|
||
|
|
<option value="TTD">Trinidad and Tobago Dollars</option>
|
||
|
|
<option value="TRL">Turkey Lira</option>
|
||
|
|
<option value="VEB">Venezuela Bolivar</option>
|
||
|
|
<option value="ZMK">Zambia Kwacha</option>
|
||
|
|
</datalist>
|
||
|
|
</th>
|
||
|
|
<th id="spalte4" class="delete"></th>
|
||
|
|
</tr></thead>
|
||
|
|
<tbody>
|
||
|
|
<tr id="Reihe[0]">
|
||
|
|
<td id="Position[0]" style="text-align: right;">0</td>
|
||
|
|
<td id="Beschreibung[0]"><textarea style="resize:none;" cols="45" rows="1" readonly lang="de">Vorschuss (falls zutreffend)</textarea><textarea style="resize:none;" cols="45" rows="1" readonly lang="en">Advance payment (if applicable)</textarea></td>
|
||
|
|
<td id="Belegdatum[0]"><input type="date" style="visibility:hidden;"></td>
|
||
|
|
<td id="Betrag[0]" style="text-align:right;"><input required type="number" step="0.01" value="0.00" min="0.00" max="10000.00" id="vorschuss" name="Vorschuss" style="font-size:120%; text-align: right;" /></td>
|
||
|
|
<td class="delete" id="delete[0]"></td>
|
||
|
|
</tr>
|
||
|
|
<tr class="screen" id="more"><td colspan="4"><input type="button" id="addbutton_de" style="width:100%;" value="Ausgabe hinzufügen +" lang="de" /><input type="button" id="addbutton_en" style="width:100%;" value="Add expense +" lang="en" /></td></tr>
|
||
|
|
</tbody>
|
||
|
|
<tfoot>
|
||
|
|
<tr id="Reihe[Summe]">
|
||
|
|
<td colspan="3" style="text-align: right;"><span lang="de">Summe</span><span lang="en">Total</span></td>
|
||
|
|
<td style="text-align: right;"><span class="geld" id="Summe" style="margin-left: 2em; font-weight:bold; color:black; width:8em;"></span></td>
|
||
|
|
</tr>
|
||
|
|
</tfoot>
|
||
|
|
</table>
|
||
|
|
</fieldset>
|
||
|
|
<fieldset>
|
||
|
|
<legend lang="de">Datum der Antragstellung</legend>
|
||
|
|
<legend lang="en">Date of claim</legend>
|
||
|
|
<input type="date">
|
||
|
|
</fieldset>
|
||
|
|
<fieldset>
|
||
|
|
<legend lang="de">Pflichtangabe: Hiermit bestätige ich die Vollständig- und Richtigkeit meiner Angaben.</legend>
|
||
|
|
<legend lang="en">Mandatory declaration: Herewith I confirm the completeness and correctness of my data.</legend>
|
||
|
|
<input type="checkbox" id="check" name="checkbox" onchange="document.getElementById('printDE_bottom').disabled = !this.checked;
|
||
|
|
document.getElementById('printEN_bottom').disabled = !this.checked;
|
||
|
|
document.getElementById('printDE_top').disabled = !this.checked;
|
||
|
|
document.getElementById('printEN_top').disabled = !this.checked;">
|
||
|
|
|
||
|
|
</fieldset>
|
||
|
|
<h2 id="faq" class="screen">Frequently asked questions (FAQ)</h2>
|
||
|
|
<!--<input class="screen" type="radio" id="en" name="lang" value="en" checked><label class="screen" for="en">English</label>
|
||
|
|
<input class="screen" type="radio" id="de" name="lang" value="de"><label class="screen" for="de">Deutsch</label>-->
|
||
|
|
<dl lang="en" class="screen">
|
||
|
|
<dt>My claims are not in Euro. What now?</dt>
|
||
|
|
<dd>When claiming expenses please select in which currency you want your expense reimbursed. Use the
|
||
|
|
<a href="https://sdw.ecb.europa.eu/curConverter.do?node=9693519">converter of the European Central Bank</a>.
|
||
|
|
Convert per line (not the sum!) using the exchange rate valid at the date of expense. If you don't provide a
|
||
|
|
currency, we'll assume you want to get reimbursed using Euro.</dd>
|
||
|
|
</dl>
|
||
|
|
<dl lang="de" class="screen">
|
||
|
|
<dt>Meine Ausgabe sind nicht in Euro. Was soll ich machen?</dt>
|
||
|
|
<dd>Wenn du Ausgaben erstattet haben willst, rechne die Ausgaben zeilenweise (nicht nur den Gesamtbetrag!) mit dem
|
||
|
|
<a href="https://sdw.ecb.europa.eu/curConverter.do?node=9693519">Währungsumrechner der Europäischen Zentralbank</a>
|
||
|
|
in die Währung um, in der du deine Kosten erstattet haben willst. Gibst du keine Währung an, nehmen wir an, dass
|
||
|
|
die Erstattung in Euro erfolgen soll.</dd>
|
||
|
|
</dl>
|
||
|
|
<div style="width: 100%; text-align:right; padding-right: 50px; font-weight:bold; font-size:90%;"></div>
|
||
|
|
</main>
|
||
|
|
<div id="printcontainerDE_bottom" lang="de"><input type="button" value="🖶 Antrag drucken" id="printDE_bottom" disabled></div>
|
||
|
|
<div id="printcontainerEN_bottom" lang="en"><input type="button" value="🖶 Print" id="printEN_bottom" disabled></div>
|
||
|
|
<template id="neuerEintrag">
|
||
|
|
<tr style="display: none">
|
||
|
|
<td style="text-align: right;"></td>
|
||
|
|
<td><textarea style="resize:both;" cols="45" rows="2" placeholder="Please enter a description of this expense here."></textarea></td>
|
||
|
|
<td><input type="date"></td>
|
||
|
|
<td style="text-align:right;"><input type="number" min="0.00" max="10000.00" step="0.01" value="0.00" style="text-align: right;"></td>
|
||
|
|
<td class="delete"><button class="delbutton">-</button></td>
|
||
|
|
</tr>
|
||
|
|
</template>
|
||
|
|
<footer>
|
||
|
|
<a href="mailto:info@wikimedia.de">Kontakt / contact</a>
|
||
|
|
<p>© 2016 by Wikimedia Deutschland e.V.</p>
|
||
|
|
<address>Wikimedia Deutschland<br>
|
||
|
|
Gesellschaft zur Förderung Freien Wissens e.V.<br>
|
||
|
|
Postfach 61 03 49<br>
|
||
|
|
10925 Berlin<br><br>
|
||
|
|
|
||
|
|
http://wikimedia.de<br>
|
||
|
|
Tel: +49 30/21 91 58 26-0<br>
|
||
|
|
Fax: +49 30/21 91 58 26-9<br>
|
||
|
|
E-Mail: info@wikimedia.de<br><br>
|
||
|
|
|
||
|
|
</address>
|
||
|
|
</footer>
|
||
|
|
</body>
|
||
|
|
</html>
|