From 67efb867bbedb851a4e9afbe92e46b131d1aff3f Mon Sep 17 00:00:00 2001
From: Philipp Lang <zoomyboy@intern.zoomyboy.de>
Date: Sun, 24 Jan 2021 12:38:51 +0100
Subject: [PATCH] Add back button

---
 assets/css/app.css      | 6 ++++++
 assets/js/app.js        | 7 +++++++
 views/daten.twig.htm    | 5 ++++-
 views/stepper.twig.htm  | 5 ++++-
 views/vorhaben.twig.htm | 5 ++++-
 5 files changed, 25 insertions(+), 3 deletions(-)

diff --git a/assets/css/app.css b/assets/css/app.css
index d90e324..f002055 100644
--- a/assets/css/app.css
+++ b/assets/css/app.css
@@ -23,6 +23,12 @@ body {
         }
     }
 
+    .button-row {
+        display: grid;
+        grid-template-columns: max-content 1fr;
+        grid-gap: 0.5rem;
+    }
+
     form {
         font-family: sans-serif;
         background: var(--bg-color);
diff --git a/assets/js/app.js b/assets/js/app.js
index 817cc6b..afaeacc 100644
--- a/assets/js/app.js
+++ b/assets/js/app.js
@@ -107,6 +107,13 @@ window.stepper = {
 
         var _self = this;
         this.step = index;
+
+        if (index === 0) {
+            window.setTimeout(function() {
+                _self.value.kind = null;
+            }, 500);
+        }
+
         this.$nextTick(function() {
             _self.$refs.slider.scrollLeft = _self.$refs.slider.scrollWidth / 4 * index;
         });
diff --git a/views/daten.twig.htm b/views/daten.twig.htm
index 9d6c887..7254190 100644
--- a/views/daten.twig.htm
+++ b/views/daten.twig.htm
@@ -71,7 +71,10 @@
                 <input type="text" x-model="value.einnahme" id="einnahme">
             </label>
 
-            <button type="submit">Absenden</button>
+            <div class="button-row">
+                <button @click="slideTo($event, step-1)" type="button">Zurück</button>
+                <button type="submit">Absenden</button>
+            </div>
 
         </div>
     </div>
diff --git a/views/stepper.twig.htm b/views/stepper.twig.htm
index 8b681c7..57ca9eb 100644
--- a/views/stepper.twig.htm
+++ b/views/stepper.twig.htm
@@ -62,7 +62,10 @@
                         <div x-text="units.currency.to(Math.round(parseInt(value.anschluss.umschuldung) / 1000 + parseInt(value.anschluss.zuskap) / 1000) * 1000)"></div>
                     </div>
                     <div class="separator gray"></div>
-                    <button @click="slideTo($event, step+1)" type="button">Werte übernehmen und weiter zum letzten Schritt</button>
+                    <div class="button-row">
+                        <button @click="slideTo($event, step-1)" type="button">Zurück</button>
+                        <button @click="slideTo($event, step+1)" type="button">Werte übernehmen und weiter zum letzten Schritt</button>
+                    </div>
                 </div>
             </div>
 
diff --git a/views/vorhaben.twig.htm b/views/vorhaben.twig.htm
index e29ac9c..79ac85f 100644
--- a/views/vorhaben.twig.htm
+++ b/views/vorhaben.twig.htm
@@ -66,6 +66,9 @@
             <div x-text="units.currency.to(  Math.round((value.{{kind}}.{{main.value}} * (1+parts.notar+parts.grundsteuer+parts.makler) + value.{{kind}}.{{second.value}} - value.{{kind}}.eigenkapital) / 1000)*1000  )"></div>
         </div>
         <div class="separator gray"></div>
-        <button @click="slideTo($event, step+1)" type="button">Werte übernehmen und weiter zum letzten Schritt</button>
+        <div class="button-row">
+            <button @click="slideTo($event, step-1)" type="button">Zurück</button>
+            <button @click="slideTo($event, step+1)" type="button">Werte übernehmen und weiter zum letzten Schritt</button>
+        </div>
     </div>
 </div>