Hallo,
ich möchte gerne von einer Seite an verschiedenen Stellen auf ein PopUp verweisen, dass ein Template anzeigen soll.
Je nach Click der das PopUp aufruft, sollen dabei andere Variablen übergaben werden.
Der Aufruf erfolgt über ein @click-Ereignis in einem Icon-Element.
Ist das möglich und wenn wie?
Bekomme es bisher nur direkt mit einem Template hin.
Hallo Superposchi,
poste doch mal dein Template und den dazugehörigen Aufruf.
Grüße
fz55
Ohne zu wissen, was du genau meinst: Hast du mal mit [active] experimentiert?
Damit kannst du steuern, ob ein Popup angezeigt wird.
Ich nutze das für die Detaileinstellungen meiner Heizkreise, die bei mir z.B. EG1, OG3, DG4, KG2 heißen.
<ftui-popup id="pop_heating" [active]="popup_ctrl_heating | map('`[KEOD]{1}G[1234]{1}`: true, none: false')"
...
...
Ich nutze also Steuervariablen (s. RegEx oben), um den Dialog anzeigen zu lassen.
Dann verwende ich @close beim Schließen des Popups, um Perl-Code aufzurufen:
@close="sendFhem(`{puCloseHeatingDetails()}`)"
Der Prozess wird initiiert (d.h. die Steuervariablen werden gesetzt, oder was auch immer du tun willst) durch Perl-Code bei @click auf ein Icon:
<ftui-icon
name="{{icon}}" size="-1"
@click="sendFhem(`{puOpenHeatingDetails('{{room}}')}`)">
</ftui-icon>
Vielleicht hilft dir das etwas weiter.
Moin.
alternativ sollte es mit auch mit <ftui-content> gehen
Gruß,
Matthias
Sorry, war medizinisch ausgeknockt. Poste die Sachen morgen mal wenn ich es rausgesucht habe.
So hier nun endlich die relavanten Code-Passagen.
Aufrufende Seite:
ftui-column height="5px">
<ftui-icon name="settings" @click="popup_shuttersetting.open()" class="size-0" margin="0" color="light"></ftui-icon>
</ftui-column>
Das Popup:
<ftui-popup id="popup_shuttersetting" timeout="0" width="750px" height="650px" position="page">
<header>Einstellungen {{device}}</header>
<ftui-grid-tile row="1" col="1" height="2" width="1">
<ftui-row margin="0" height="2%">
<ftui-content file="./BlackviewTab8E/template_shuttersettings.html" raum="Wohnzimmer" device="HM_74BABB"></ftui-content>
</ftui-row>
<ftui-column height="5%">
<ftui-button popup-close>Schließen</ftui-button>
</ftui-column>
</ftui-grid-tile>
</ftui-popup>
Anfang des Templates:
<ftui-column>
<header class="size-2" margin="2"> Einstellungen {{device}}: </header>
<ftui-grid-tile row="1" col="1" height="1" width="1">
<ftui-column>
<ftui-row width="100%" margin="0.5">
<ftui-label class="size-2" text="Öffnung {{device}}" color="gray"></ftui-label>
</ftui-row>
<ftui-row width="70%" margin="0.5">
<ftui-segment [value]="{{device}}:state_to_open" (value)="setreading {{device}} state_to_open $value">
<ftui-segment-button value="1">
<ftui-icon name="group1"></ftui-icon>
</ftui-segment-button>
<ftui-segment-button value="2">
<ftui-icon name="weather_sunset"></ftui-icon>
</ftui-segment-button>
<ftui-segment-button value="4">
<ftui-icon name="access_time"></ftui-icon>
</ftui-segment-button>
<ftui-segment-button value="3">
<ftui-icon name="time_manual_mode"></ftui-icon>
</ftui-segment-button>
</ftui-segment>
</ftui-row>
In der Form funktioniert auch alles.
Ich würde allerdings gerne die Variablen für Raum und Device bereits im Aufruf des Popup's absetzen und über das Popup ins Template durchschleifen.
Schließlich ist das Popup nur ein "Container" und immer gleich. Durch den unterschiedlichen Aufruf werden nur die beiden Variablen mit verschiedenem Inhalt angezeigt.
Hallo Superposchi,
ich nehme an, dass du mehrer Shutter steuern willst und das Verhältnis Shutter zu Raum eindeutig ist, z. B. Shutter 1 = Raum A, Shutter 2 = Raum A, Shutter 3 = Raum B.
Die Popupdefinition muss angepasst in eine eigene File popup_shuttersettings.html auslagert werden:
<ftui-popup id="popup_shuttersetting_{{device}}" timeout="0" width="750px" height="650px" position="page">
<header>Einstellungen {{device}}</header>
<ftui-grid-tile row="1" col="1" height="2" width="1">
<ftui-row margin="0" height="2%">
<ftui-content file="./BlackviewTab8E/template_shuttersettings.html" raum="{{raum}}" device="{{device}}"></ftui-content-->
</ftui-row>
<ftui-column height="5%">
<ftui-button popup-close>Schließen</ftui-button>
</ftui-column>
</ftui-grid-tile>
</ftui-popup>
Für jedes Device, das über dieses Popup gesteuert werden soll, wird ein ftui-content benötigt. Diese Zeilen am besten in der index.html vor dem </body>-Tag einfügen.
<ftui-content file="popup_shuttersettings.html" raum="Wohnzimmer" device="HM_74BABB"></ftui-content>
<ftui-content file="popup_shuttersettings.html" raum="Wohnzimmer" device="HM_74BACC"></ftui-content>
<ftui-content file="popup_shuttersettings.html" raum="Schlafzimmer" device="HM_74BADD"></ftui-content>
Der Aufruf des Popups muss für jeden Shutter angepasst werden, z.B.
<ftui-button @click="popup_shuttersetting_HM_74BABB.open()">HM_74BABB</ftui-button>
<ftui-button @click="popup_shuttersetting_HM_74BACC.open()">HM_74BACC</ftui-button>
<ftui-button @click="popup_shuttersetting_HM_74BADD.open()">HM_74BADD</ftui-button>
Grüße
fz55
Ok, also du verwendest das Popup direkt als Template. Nicht erst das Template im Popup aufrufen.
Muss ich mal schauen ob ich das umgesetzt bekomme.
Habe mir erstweilen damit geholfen, dass ich drei verschiedene Popup's erstellt habe die jeweils das gleiche Template beinhalten. Das andere ist natürlich eleganter.
Wenn du das Template nicht anderweitig aufrufst, sollte(kann) der Code direkt in die Popupdefinition übernommen werden.