From 5aef65409e3b2b4494d3b128f960bb2285d22405 Mon Sep 17 00:00:00 2001
From: Florian Dagner <99618839+fdagner@users.noreply.github.com>
Date: Tue, 23 Jan 2024 20:07:26 +0100
Subject: [PATCH] Bilanz 7

---
 buchen.html         | 139 ++++++++++++++++++++++++++++++++++++++++----
 js/bilanz7.js       | 125 +++++++++++++++++++++++++++++++++++++++
 js/buchungssatz.js  |   3 +-
 js/t-konto.js       |   2 +-
 js/vorkontierung.js |  25 +++++++-
 5 files changed, 279 insertions(+), 15 deletions(-)
 create mode 100644 js/bilanz7.js

diff --git a/buchen.html b/buchen.html
index 1fa767d..f9b7ee4 100644
--- a/buchen.html
+++ b/buchen.html
@@ -467,16 +467,134 @@ <h2>Inventar</h2>
 
 
     <section id="bilanz" class="tabcontent">
-      <h2>Bilanz</h2>
-      <details>
-        <summary>Anleitung</summary>
-        <div style="padding-left:6px;border: 1px solid #ddd;padding: 4px;">
-          <video style="width:100%;margin: 0 auto;" poster="media/pic/screenshot1.png" controls>
-            <source src="media/video/t-konto.mp4" type="video/mp4">
-            Your bser does not support the video tag.
-          </video>
-        </div>
-      </details><br>🚧
+      <h2>Bilanz 7</h2>
+
+      <div class="box">
+        <p>Sie können hier ein Inventar mit Zufallszahlen erstellen.</p>
+        <button onclick="generateRandomBilanz()"><svg xmlns="http://www.w3.org/2000/svg" fill="white" height="16"
+            width="16"
+            viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
+            <path
+              d="M105.1 202.6c7.7-21.8 20.2-42.3 37.8-59.8c62.5-62.5 163.8-62.5 226.3 0L386.3 160H352c-17.7 0-32 14.3-32 32s14.3 32 32 32H463.5c0 0 0 0 0 0h.4c17.7 0 32-14.3 32-32V80c0-17.7-14.3-32-32-32s-32 14.3-32 32v35.2L414.4 97.6c-87.5-87.5-229.3-87.5-316.8 0C73.2 122 55.6 150.7 44.8 181.4c-5.9 16.7 2.9 34.9 19.5 40.8s34.9-2.9 40.8-19.5zM39 289.3c-5 1.5-9.8 4.2-13.7 8.2c-4 4-6.7 8.8-8.1 14c-.3 1.2-.6 2.5-.8 3.8c-.3 1.7-.4 3.4-.4 5.1V432c0 17.7 14.3 32 32 32s32-14.3 32-32V396.9l17.6 17.5 0 0c87.5 87.4 229.3 87.4 316.7 0c24.4-24.4 42.1-53.1 52.9-83.7c5.9-16.7-2.9-34.9-19.5-40.8s-34.9 2.9-40.8 19.5c-7.7 21.8-20.2 42.3-37.8 59.8c-62.5 62.5-163.8 62.5-226.3 0l-.1-.1L125.6 352H160c17.7 0 32-14.3 32-32s-14.3-32-32-32H48.4c-1.6 0-3.2 .1-4.8 .3s-3.1 .5-4.6 1z" />
+          </svg> Bilanz erstellen</button>
+      </div><br>
+      <div id="bilanzContainer" style="width:750px;margin: 0 auto" contenteditable="true">
+
+        <table style="border-collapse: collapse;font-family:courier;background-color:#fff;min-width:650px;">
+          <caption>Bilanz</caption>
+          <tbody>
+            <tr>
+              <th style="width:25%;">Aktiva</th>
+              <th colspan="2" style="width:25%;text-align:center;">Eröffnungsbilanz&nbsp;1. Januar</th>
+              <th style="width:25%;text-align:right;">Passiva</th>
+            </tr>
+
+            <tr style="border-top: 1px solid #AAAAAA;">
+              <td style="width:25%;">Grundstücke</td>
+              <td style="width:25%;text-align:right;padding-right: 4px;" id="value-GR">200.000,00 €</td>
+              <td style="width:25%;border-left: 1px solid #AAAAAA;padding-left: 2px;">Eigenkapital</td>
+              <td style="width:25%;text-align:right;padding-right: 4px;" id="value-EK">91.000,00 €</td>
+            </tr>
+            <tr style="border-top: 1px solid #AAAAAA;">
+              <td style="width:25%;">Betriebs- und Verwaltungsgebäude</td>
+              <td style="width:25%;text-align:right;padding-right: 4px;" id="value-BVG">200.000,00 €</td>
+              <td style="width:25%;border-left: 1px solid #AAAAAA;padding-left: 2px;">Langfristige Bankverbindlichkeiten</td>
+              <td style="width:25%;text-align:right;padding-right: 4px;" id="value-LBKV">91.000,00 €</td>
+            </tr>
+
+            <tr style="border-top: 1px solid #AAAAAA;">
+              <td style="width:25%;">Maschinen und Anlagen</td>
+              <td style="width:25%;text-align:right;padding-right: 4px;" id="value-MA">20.000,00 €</td>
+              <td style="width:25%;border-left: 1px solid #AAAAAA;padding-left: 2px;">Kurzfristige Bankverbindlichkeiten</td>
+              <td style="width:25%;text-align:right;padding-right: 4px;" id="value-KBKV">150.000,00 €</td>
+            </tr>
+            
+            <tr style="border-top: 1px solid #AAAAAA;">
+              <td style="width:25%;">Fuhrpark</td>
+              <td style="width:25%;text-align:right;padding-right: 4px;" id="value-FP">50.000,00 €</td>
+              <td style="width:25%;border-left: 1px solid #AAAAAA;padding-left: 2px;">Verbindlichkeiten bei Lieferern</td>
+              <td style="width:25%;text-align:right;padding-right: 4px;" id="value-VE">150.000,00 €</td>
+            </tr>
+
+            <tr style="border-top: 1px solid #AAAAAA;">
+              <td style="width:25%;">Büromaschinen</td>
+              <td style="width:25%;text-align:right;padding-right: 4px;" id="value-BM">50.000,00 €</td>
+              <td style="width:25%;border-left: 1px solid #AAAAAA;padding-left: 2px;"></td>
+              <td style="width:25%;text-align:right;padding-right: 4px;"></td>
+            </tr>
+            
+            <tr style="border-top: 1px solid #AAAAAA;">
+              <td style="width:25%;">Büromöbel- und Geschäftsausstattung</td>
+              <td style="width:25%;text-align:right;padding-right: 4px;" id="value-BM">60.000,00 €</td>
+              <td style="width:25%;border-left: 1px solid #AAAAAA;padding-left: 2px;"></td>
+              <td style="width:25%;text-align:right;padding-right: 4px;"></td>
+            </tr>
+
+            
+            <tr style="border-top: 1px solid #AAAAAA;">
+              <td style="width:25%;">Vorräte</td>
+              <td style="width:25%;text-align:right;padding-right: 4px;" id="value-VORR">30.000,00 €</td>
+              <td style="width:25%;border-left: 1px solid #AAAAAA;padding-left: 2px;"></td>
+              <td style="width:25%;text-align:right;padding-right: 4px;"></td>
+            </tr>
+
+            <tr style="border-top: 1px solid #AAAAAA;">
+              <td style="width:25%;">Forderungen an Kunden</td>
+              <td style="width:25%;text-align:right;padding-right: 4px;" id="value-FO">30.000,00 €</td>
+              <td style="width:25%;border-left: 1px solid #AAAAAA;padding-left: 2px;"></td>
+              <td style="width:25%;text-align:right;padding-right: 4px;"></td>
+            </tr>
+
+            <tr style="border-top: 1px solid #AAAAAA;">
+              <td style="width:25%;">Bank</td>
+              <td style="width:25%;text-align:right;padding-right: 4px;" id="value-BK">10.000,00 €</td>
+              <td style="width:25%;border-left: 1px solid #AAAAAA;padding-left: 2px;"></td>
+              <td style="width:25%;text-align:right;"></td>
+            </tr>
+
+            <tr style="border-top: 1px solid #AAAAAA;">
+              <td style="width:25%;">Kasse</td>
+              <td style="width:25%;text-align:right;padding-right: 2px;" id="value-Kasse">1.000,00 €</td>
+              <td style="width:25%;border-left: 1px solid #AAAAAA;padding-left: 2px;"></td>
+              <td style="width:25%;text-align:right;padding-right: 4px;"></td>
+            </tr>
+
+            <tr style="border-bottom: 6px double #AAAAAA;border-top: 2px solid #AAAAAA;">
+              <td style="width:25%;"></td>
+              <td style="width:25%;text-align:right;padding-right: 2px;">291.000,00 €</td>
+              <td style="width:25%;border-left: 1px solid #AAAAAA;padding-left: 2px;padding-right: 4px;"></td>
+              <td style="width:25%;text-align:right;padding-right: 4px;">291.000,00 €</td>
+            </tr>
+          </tbody>
+        </table><br><br>
+
+      </div>
+      <div class="exportButtons">
+        <button class="icon" type="button" onclick="bilanzHerunterladenAlsPNG()"><svg xmlns="http://www.w3.org/2000/svg"
+            height="16" width="16"
+            viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
+            <path
+              d="M448 80c8.8 0 16 7.2 16 16V415.8l-5-6.5-136-176c-4.5-5.9-11.6-9.3-19-9.3s-14.4 3.4-19 9.3L202 340.7l-30.5-42.7C167 291.7 159.8 288 152 288s-15 3.7-19.5 10.1l-80 112L48 416.3l0-.3V96c0-8.8 7.2-16 16-16H448zM64 32C28.7 32 0 60.7 0 96V416c0 35.3 28.7 64 64 64H448c35.3 0 64-28.7 64-64V96c0-35.3-28.7-64-64-64H64zm80 192a48 48 0 1 0 0-96 48 48 0 1 0 0 96z" />
+          </svg></button>
+        <button class="icon" type="button" id="officeButtonbilanz" data-clipboard-target="#bilanzContainer"><svg
+            xmlns="http://www.w3.org/2000/svg" height="16" width="12"
+            viewBox="0 0 384 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
+            <path
+              d="M48 448V64c0-8.8 7.2-16 16-16H224v80c0 17.7 14.3 32 32 32h80V448c0 8.8-7.2 16-16 16H64c-8.8 0-16-7.2-16-16zM64 0C28.7 0 0 28.7 0 64V448c0 35.3 28.7 64 64 64H320c35.3 0 64-28.7 64-64V154.5c0-17-6.7-33.3-18.7-45.3L274.7 18.7C262.7 6.7 246.5 0 229.5 0H64zm55 241.1c-3.8-12.7-17.2-19.9-29.9-16.1s-19.9 17.2-16.1 29.9l48 160c3 10.2 12.4 17.1 23 17.1s19.9-7 23-17.1l25-83.4 25 83.4c3 10.2 12.4 17.1 23 17.1s19.9-7 23-17.1l48-160c3.8-12.7-3.4-26.1-16.1-29.9s-26.1 3.4-29.9 16.1l-25 83.4-25-83.4c-3-10.2-12.4-17.1-23-17.1s-19.9 7-23 17.1l-25 83.4-25-83.4z" />
+          </svg></button>
+        <button class="icon" type="button" onclick="bilanzHerunterladen()"><svg xmlns="http://www.w3.org/2000/svg"
+            height="16" width="12"
+            viewBox="0 0 384 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
+            <path
+              d="M64 464c-8.8 0-16-7.2-16-16V64c0-8.8 7.2-16 16-16H224v80c0 17.7 14.3 32 32 32h80V448c0 8.8-7.2 16-16 16H64zM64 0C28.7 0 0 28.7 0 64V448c0 35.3 28.7 64 64 64H320c35.3 0 64-28.7 64-64V154.5c0-17-6.7-33.3-18.7-45.3L274.7 18.7C262.7 6.7 246.5 0 229.5 0H64zm97 289c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0L79 303c-9.4 9.4-9.4 24.6 0 33.9l48 48c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-31-31 31-31zM257 255c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9l31 31-31 31c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l48-48c9.4-9.4 9.4-24.6 0-33.9l-48-48z" />
+          </svg></button>
+        <button class="icon" type="button" onclick="bilanzKopiereInZwischenablage()"><svg
+            xmlns="http://www.w3.org/2000/svg" height="16" width="20"
+            viewBox="0 0 640 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
+            <path
+              d="M392.8 1.2c-17-4.9-34.7 5-39.6 22l-128 448c-4.9 17 5 34.7 22 39.6s34.7-5 39.6-22l128-448c4.9-17-5-34.7-22-39.6zm80.6 120.1c-12.5 12.5-12.5 32.8 0 45.3L562.7 256l-89.4 89.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l112-112c12.5-12.5 12.5-32.8 0-45.3l-112-112c-12.5-12.5-32.8-12.5-45.3 0zm-306.7 0c-12.5-12.5-32.8-12.5-45.3 0l-112 112c-12.5 12.5-12.5 32.8 0 45.3l112 112c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256l89.4-89.4c12.5-12.5 12.5-32.8 0-45.3z" />
+          </svg></button>
+      </div>
     </section>
 
     <aside>
@@ -509,6 +627,7 @@ <h2>Tools</h2>
         <script src="js/vorkontierung.js"></script>
         <script src="js/geschaeftsfaelle.js"></script>
         <script src="js/inventar.js"></script>
+        <script src="js/bilanz.js"></script>
         <script src="js/moodle.js"></script>
         <script>
 
diff --git a/js/bilanz7.js b/js/bilanz7.js
new file mode 100644
index 0000000..5fe6653
--- /dev/null
+++ b/js/bilanz7.js
@@ -0,0 +1,125 @@
+function generateRandomInventar() {
+    const valueRanges = {
+        "GR-value": { min: 1500000, max: 1000000 },
+        "BVG-value": { min: 2500000, max: 5000000 },
+        "MA-value": { min: 10000, max: 200000 },
+        "FP1-value": { min: 10000, max: 80000 },
+        "FP2-value": { min: 50000, max: 150000 },
+        "BM-value": { min: 5000, max: 20000 },
+        "BGA-value": { min: 20000, max: 200000 },
+        "VORR-value": { min: 20000, max: 100000 },
+        "FO-value": { min: 2000, max: 500000 },
+        "BK1-value": { min: 20000, max: 200000 },
+        "BK2-value": { min: 20000, max: 200000 },
+        "KA-value": { min: 500, max: 5000 },
+        "LBKV-value": { min: 50000, max: 4500000 },
+        "KBKV-value": { min: 5000, max: 50000 },
+        "VE-value": { min: 5000, max: 50000 },
+    };
+
+
+    function getRandomValueInRange(min, max) {
+        return Math.floor(Math.random() * (max - min + 1)) + min;
+    }
+
+    function formatCurrency(value) {
+        return value.toLocaleString('de-DE', { style: 'currency', currency: 'EUR' });
+    }
+
+    function updateCellValueById(id, value) {
+        const cell = document.getElementById(id);
+        if (cell) {
+            cell.textContent = formatCurrency(value);
+        }
+    }
+
+    function calculateAndSetSum(cellIds, resultCellId) {
+        const resultCell = document.getElementById(resultCellId);
+        if (!resultCell) return;
+
+        const sum = cellIds.reduce((acc, id) => {
+            const value = parseFloat(document.getElementById(id)?.textContent.replace(/[^0-9,-]+/g, '')) || 0;
+            return acc + value;
+        }, 0);
+
+        resultCell.textContent = formatCurrency(sum);
+    }
+
+    for (const id in valueRanges) {
+        const randomValue = getRandomValueInRange(valueRanges[id].min, valueRanges[id].max);
+        updateCellValueById(id, randomValue);
+    }
+
+    calculateAndSetSum(["FP1-value", "FP2-value"], "FP-value");
+    calculateAndSetSum(["BK1-value", "BK2-value"], "BK-value");
+
+    const avCellIds = ["GR-value", "BVG-value", "MA-value", "FP-value", "BM-value", "BGA-value"];
+    const uvCellIds = ["VORR-value", "FO-value", "BK-value", "KA-value"];
+    const fkCellIds = ["LBKV-value", "KBKV-value", "VE-value"]
+
+    calculateAndSetSum(avCellIds, "AV-value");
+    calculateAndSetSum(uvCellIds, "UV-value");
+    calculateAndSetSum(fkCellIds, "FK-value");
+
+    const avuvCellIds = ["AV-value", "UV-value"];
+    const fkCellId = "FK-value";
+    const ekCellId = "EK-value";
+
+    calculateAndSetSum(avuvCellIds, "AVUV-value");
+    calculateAndSetSum(["LBKV-value", "KBKV-value", "VE-value"], "FK-value");
+    calculateAndSetSum(["AVUV-value", "FK-value"], ekCellId);
+
+    const fkSumValue = parseFloat(document.getElementById("FK-value").textContent.replace(/[^0-9,-]+/g, '')) || 0;
+    updateCellValueById("FKSum-value", fkSumValue);
+
+    // Berechne und setze EK-Value gleich AVUV-Value - FK-Value
+    const avuvValue = parseFloat(document.getElementById("AVUV-value").textContent.replace(/[^0-9,-]+/g, '')) || 0;
+    const fkValue = parseFloat(document.getElementById("FK-value").textContent.replace(/[^0-9,-]+/g, '')) || 0;
+    const ekValue = avuvValue - fkValue;
+    updateCellValueById("EK-Value", ekValue);
+}
+
+
+function inventarHerunterladen() {
+    const inventarHTML = document.getElementById('inventarContainer').innerHTML;
+    const blob = new Blob([inventarHTML], { type: 'text/html' });
+    const a = document.createElement('a');
+    a.href = URL.createObjectURL(blob);
+    a.download = 'inventar.html';
+    document.body.appendChild(a);
+    a.click();
+    document.body.removeChild(a);
+}
+
+function inventarKopiereInZwischenablage() {
+    const inventarHTML = document.getElementById('inventarContainer').innerHTML;
+    navigator.clipboard.writeText(inventarHTML)
+        .then(() => alert('Code wurde in die Zwischenablage kopiert'))
+        .catch(err => console.error('Fehler beim Kopieren in die Zwischenablage:', err));
+}
+
+function inventarHerunterladenAlsPNG() {
+    const inventarContainer = document.getElementById('inventarContainer');
+
+    html2canvas(inventarContainer).then(canvas => {
+        const dataURL = canvas.toDataURL('image/png');
+        const a = document.createElement('a');
+        a.href = dataURL;
+        a.download = 'inventar.png';
+        document.body.appendChild(a);
+        a.click();
+        document.body.removeChild(a);
+    });
+}
+
+let clipboardinventar = new ClipboardJS('#officeButtoninventar');
+
+clipboardinventar.on('success', function (e) {
+    console.log("Die Tabelle wurde in die Zwischenablage kopiert.");
+    alert("Die Tabelle wurde in die Zwischenablage kopiert.");
+});
+
+clipboardinventar.on('error', function (e) {
+    console.error("Fehler beim Kopieren der Tabelle: ", e.action);
+    alert("Fehler beim Kopieren der Tabelle.");
+});
diff --git a/js/buchungssatz.js b/js/buchungssatz.js
index 227adc2..e9141d0 100644
--- a/js/buchungssatz.js
+++ b/js/buchungssatz.js
@@ -3,7 +3,7 @@ function generiereBuchungssatz() {
   const buchungssatzContainer = document.getElementById('buchungssatzContainer');
   const buchungssatzButtonContainer = document.getElementById('buchungssatzButtonContainer');
 
-  let buchungssatzHTML = '<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p><table style="white-space:nowrap;background-color:#fff;font-family:courier;min-width:750px;"><tbody>';
+  let buchungssatzHTML = '<table style="white-space:nowrap;background-color:#fff;font-family:courier;min-width:750px;"><tbody>';
 
   for (let i = 0; i < anzahlZeilenBuchungssatz; i++) {
     buchungssatzHTML += '<tr>';
@@ -79,4 +79,5 @@ window.onload = function () {
   generiereBuchungssatz();
   generiereVorkontierung();
   generateRandomInventar()
+  generateRandomBilanz7()
 };
diff --git a/js/t-konto.js b/js/t-konto.js
index 425d729..50cef27 100644
--- a/js/t-konto.js
+++ b/js/t-konto.js
@@ -20,7 +20,7 @@ function generiereTKonto() {
   const buttonContainer = document.getElementById('buttonContainer');
 
 
-  let tkontoHTML = '<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p><table style="border-collapse: collapse;width:650px;background-color:#fff"><tbody><tr><th style="width:25%;text-align:left" tabindex="1">Soll</th><th style="text-align:center;" colspan="2" tabindex="1">' + kontoAuswahl + '</th><th style="width:25%;text-align:right;" tabindex="1">Haben</th></tr>';
+  let tkontoHTML = '<table style="border-collapse: collapse;width:650px;background-color:#fff"><tbody><tr><th style="width:25%;text-align:left" tabindex="1">Soll</th><th style="text-align:center;" colspan="2" tabindex="1">' + kontoAuswahl + '</th><th style="width:25%;text-align:right;" tabindex="1">Haben</th></tr>';
 
   for (let i = 0; i < anzahlZeilen; i++) {
     tkontoHTML += '<tr style="border-top: 1px solid #AAAAAA;">' +
diff --git a/js/vorkontierung.js b/js/vorkontierung.js
index cc74e6f..0329d10 100644
--- a/js/vorkontierung.js
+++ b/js/vorkontierung.js
@@ -3,11 +3,30 @@ function generiereVorkontierung() {
   const vorkontierungContainer = document.getElementById('vorkontierungContainer');
   const vorkontierungButtonContainer = document.getElementById('vorkontierungButtonContainer');
 
-  let vorkontierungHTML = '<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p><table style="font-family:courier;width:650px;border-collapse:collapse"><caption>Vorkontierung</caption><tbody><tr style="background-color:#ededed;font-weight: bold;white-space:nowrap;"><th>BA</th><th>Datum</th><th>Soll</th><th>Haben</th><th>BNR</th><th>Text</th><th>B/N</th><th>Betrag in €</th><th>UCo</th></tr>';
+  let vorkontierungHTML = '<table style="font-family:courier;min-width:750px;border-collapse:collapse"><caption>Vorkontierung</caption><tbody>'
+                        + '<tr style="background-color:#ededed;font-weight: bold;white-space:nowrap;">'
+                        + '<th>BA</th>'
+                        + '<th>Datum</th>'
+                        + '<th>Soll</th>'
+                        + '<th>Haben</th>'
+                        + '<th>BNR</th>'
+                        + '<th>Text</th>'
+                        + '<th>B/N</th>'
+                        + '<th>Betrag in €</th>'
+                        + '<th>UCo</th>'
+                        + '</tr>';
 
   for (let i = 0; i < anzahlZeilenVorkontierung; i++) {
-    vorkontierungHTML += '<tr style="background-color:#fff;">';
-    vorkontierungHTML += '<td style="border: 1px solid #ccc;padding: .75rem">B</td><td style="border: 1px solid #ccc;padding: .75rem"></td><td style="border: 1px solid #ccc;padding: .75rem;min-width:90px;"></td><td style="border: 1px solid #ccc;padding: .75rem;min-width:90px;">Test</td><td style="border: 1px solid #ccc;padding: .75rem"></td><td style="border: 1px solid #ccc;padding: .75rem"></td><td style="border: 1px solid #ccc;padding: .75rem"></td><td style="border: 1px solid #ccc;padding: .75rem;width:120px;"></td><td style="border: 1px solid #ccc;padding: .75rem"></td>';
+    vorkontierungHTML += '<tr style="background-color:#fff;">'
+    vorkontierungHTML += '<td style="width:15px;max-width:15px;border: 1px solid #ccc;padding: .75rem;white-space: nowrap; overflow: hidden; text-overflow:ellipsis;">B</td>'
+                      + '<td style="width:50px;max-width:50px;border: 1px solid #ccc;padding: .75rem;white-space: nowrap; overflow: hidden; text-overflow:ellipsis;"></td>'
+                      + '<td style="width:100px;max-width:100px;border: 1px solid #ccc;padding: .75rem;white-space: nowrap; overflow: hidden; text-overflow:ellipsis;"></td>'
+                      + '<td style="width:100px;max-width:100px;border: 1px solid #ccc;padding: .75rem;white-space: nowrap; overflow: hidden; text-overflow:ellipsis;"></td>'
+                      + '<td style="width:25px;max-width:25px;border: 1px solid #ccc;padding: .75rem;white-space: nowrap; overflow: hidden; text-overflow:ellipsis;"></td>'
+                      + '<td style="width:200px;max-width:200px;border: 1px solid #ccc;padding: .75rem;white-space: nowrap; overflow: hidden; text-overflow:ellipsis;"></td>'
+                      + '<td style="width:50px;max-width:50px;border: 1px solid #ccc;padding: .75rem;white-space: nowrap; overflow: hidden; text-overflow:ellipsis;"></td>'
+                      + '<td style="width:150px;max-width:150px;border: 1px solid #ccc;padding: .75rem;white-space: nowrap; overflow: hidden; text-overflow:ellipsis;"></td>'
+                      + '<td style="width:25px;max-width:50px;border: 1px solid #ccc;padding: .75rem;white-space: nowrap; overflow: hidden; text-overflow:ellipsis;"></td>'
     vorkontierungHTML += '</tr>';
   }