From 81957ab2055d4a503c4a6dbdf3bd097574183824 Mon Sep 17 00:00:00 2001
From: Jens Cornelsen <79703163+IB-Cornelsen@users.noreply.github.com>
Date: Sun, 8 Dec 2024 01:27:37 +0100
Subject: [PATCH] Widget

---
 src/components/Widget2.svelte | 33 ++++++++++++++++++++++++++++++---
 1 file changed, 30 insertions(+), 3 deletions(-)

diff --git a/src/components/Widget2.svelte b/src/components/Widget2.svelte
index 54ce0b37..11f57ebd 100644
--- a/src/components/Widget2.svelte
+++ b/src/components/Widget2.svelte
@@ -1,5 +1,29 @@
 
-<script lang="ts">import BannerPrice from "#content/banner-saeule.svelte";</script>
+<script lang="ts">
+
+import BannerPrice from "#content/banner-saeule.svelte";
+
+
+  let selectedType: string = "";
+  let selectedReason: string = "";
+  let showResult: boolean = false;
+
+  function handleTypeChange(event: Event) {
+    selectedType = (event.target as HTMLSelectElement).value;
+    updateResultVisibility();
+  }
+
+  function handleReasonChange(event: Event) {
+    selectedReason = (event.target as HTMLSelectElement).value;
+    updateResultVisibility();
+  }
+
+  function updateResultVisibility() {
+    // Die Bedingung, um das Ergebnis anzuzeigen
+    showResult = selectedType === "Einfamilienhaus" && selectedReason === "Vermietung/Verkauf";
+  }
+
+</script>
 
      <div id="OEA_widget">
       <input id="recode" type="hidden" value="widgetvorlage">
@@ -9,7 +33,7 @@
      <div class="OEA_zeile1">
         <div class="OEA_item1">
         <div class="OEA_title1">Gebäudetyp</div>
-          <select class="OEA_auswahl1" id="OEA_changeTyp">
+        <select class="OEA_auswahl1" id="OEA_changeTyp" on:change={handleTypeChange}>
             <option value="" selected disabled>bitte auswählen</option>
             <option value="Einfamilienhaus">Einfamilienhaus</option>
             <option value="Zweifamilienhaus">Zweifamilienhaus</option>
@@ -21,7 +45,7 @@
     
         <div class="OEA_item2">
           <div class="OEA_title1">Anlass</div>
-          <select class="OEA_auswahl1" id="OEA_changeAnlass">
+          <select class="OEA_auswahl1" id="OEA_changeAnlass" on:change={handleReasonChange}>
             <option value="" selected disabled>bitte auswählen</option>
             <option value="Vermietung/Verkauf">Vermietung/Verkauf</option>
             <option value="Modernisierung">Modernisierung</option>
@@ -61,11 +85,14 @@
         </div>
        </div> 
     
+        {#if showResult}
         <div class="OEA_item6 result">
           <div id="OEA_result">
             <BannerPrice client:load />
           </div>
         </div>
+      {/if}
+
       
     </div>
     </div>