Weitergabe von Variablen an Popup/Template

Begonnen von Superposchi, 15 März 2024, 22:20:21

Vorheriges Thema - Nächstes Thema

Superposchi

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.

fz55

Hallo Superposchi,

poste doch mal dein Template und den dazugehörigen Aufruf.

Grüße
fz55

DocCyber

#2
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.
Behandle die Menschen so, als wären sie, was sie sein sollten. Dadurch hilfst du ihnen zu werden, was sie sein können. (Goethe)


RPi-3 mit HM-CFG-LAN und jede Menge HM Komponenten.

MDietrich

Moin.
alternativ sollte es mit auch mit <ftui-content> gehen

Gruß,
Matthias
FB 6591 Cable / Raspberry 3b+ (Bookworm) / 4xECHO DOT 4/ Homematic Thermostate, Fenster- und Fenster-Sensoren / Philips HUE / CUL-HM /  Zigbee Schalter und Lampen / Shelly 1

Superposchi

Sorry, war medizinisch ausgeknockt. Poste die Sachen morgen mal wenn ich es rausgesucht habe.

Superposchi

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">&nbsp;&nbsp;&nbsp;Einstellungen {{device}}:&nbsp;&nbsp;&nbsp;</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.

fz55

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

Superposchi

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.

fz55

Wenn du das Template nicht anderweitig aufrufst, sollte(kann) der Code direkt in die Popupdefinition übernommen werden.