Autor Thema: DOIF uiTable und stateFormat zusammen führen (fhemweb.js)  (Gelesen 768 mal)

Offline ch.eick

  • Hero Member
  • *****
  • Beiträge: 2006
DOIF uiTable und stateFormat zusammen führen (fhemweb.js)
« am: 09 September 2021, 15:31:08 »
Hallo zusammen, ich habe da mal wieder meine Grenze erreicht :-)

Bisher hatte ich ein stateFormat als Status Tabelle erstellt und dann nun auch noch DOIF uiTable entdeckt. Wie bekomme ich dann jetzt beides zusammen geführt, ohne aus der staeFormat Tabelle an Informationen zu verlieren? Je nach Zustand verändert sich dort die Farbe der Werte, um den Zusammenhang darzustellen.

Im uiTable habe ich wie im Bild zu erkennen bereits die Werte selektierbar bekommen und ich kann sogar aus dem Kommando Pull Down einzelne DOIF Zweige ausführen lassen.
Die Handhabung der uiTable ist mir noch nicht so ganz klar und ich bekomme die z.B. die Rahmen und die gleiche Position im FHEMWeb nicht hin.

Über Hilfe wäre ich sehr Dankbar
     Christian

attr WR_1_Speicher_1_ExternControl stateFormat {\
 my $WR     = "WR_1";;\
 my $DUMMY  = "";;\
 \
 my $Entladung                        = ReadingsVal($name,"SpeicherEntladung","n/a");;\
\
 my $Power                            = ReadingsVal($WR,"Actual_Battery_charge_-minus_or_discharge_-plus_P","0");;\
 my $Status                           = ($Power < -10) ? "<span style='color:#00FF00'>Laden</span>" : ($Power > 15) ?  "<span style='color:#FF0000'>Entladen</span>" : "<span style='color:orange'>Standby</span>";;\
    $Power                            = $Power." W";;\
\
 my $Solar_Calculation_fc0_day        = ReadingsVal($WR,"Solar_Calculation_fc0_day","0");;\
        \
 my $Trigger                          = ReadingsVal($name,"SpeicherTrigger","none");;\
 my $ExternTrigger                    = ReadingsVal($name,"SpeicherExternTrigger","none");;\
 my $ZeitStart                        = ReadingsVal($name,"SpeicherZeitStart","n/a");;\
 my $ZeitEnde                         = ReadingsVal($name,"SpeicherZeitEnde","n/a");;\
                                                                                                             \
 my $CmdRepeatActive                  = ReadingsVal($name,"SpeicherCmdRepeatActive","0");;\
 my $CmdRepeatRunning                 = ReadingsVal($name,"SpeicherCmdRepeatRunning","0");;\
        \
 my $MaxSOCControlActive              = ReadingsVal($name,"SpeicherMaxSOCControlActive","0");;\
 my $MaxSOCControlRunning             = ReadingsVal($name,"SpeicherMaxSOCControlRunning","0");; \
        \
 my $MiddayControlActive              = ReadingsVal($name,"SpeicherMiddayControlActive","0");;\
 my $MiddayControlRunning             = ReadingsVal($name,"SpeicherMiddayControlRunning","0");;\
        \
 my $Solar_middayhigh_fc0_start       = ReadingsVal($WR,"Solar_middayhigh_fc0_start","00:00");;\
    $Solar_middayhigh_fc0_start       = ($MaxSOCControlRunning == 1 and $MiddayControlRunning == 1) ? "12:00" : $Solar_middayhigh_fc0_start ;;\
\
 my $Solar_middayhigh_fc0_stop        = ReadingsVal($WR,"Solar_middayhigh_fc0_stop","00:00");;\
 my $MaxSOC_Actual                    = ReadingsVal($name,"SpeicherMaxSOC_Actual","0");;\
 my $Act_state_of_charge              = sprintf("%d",ReadingsVal($WR,"Act_state_of_charge","0"));;\
 my $MaxSOC_DayBefore                 = sprintf("%d %%",ReadingsVal($name,"SpeicherMaxSOC_DayBefore","0"));;\
 my $MaxSOC_fc1_Limit                 = ReadingsVal($name,"SpeicherMaxSOC_fc1_Limit","0");;\
 my $MaxSOC_MinSOC_Time               = POSIX::strftime("%H:%M",localtime(time_str2num(ReadingsTimestamp($name, "SpeicherMaxSOC_MinSOC_MinSOC",0))));;\
 my $MaxSOC_MinSOC_MinSOC             = sprintf("%d %%",ReadingsVal($name,"SpeicherMaxSOC_MinSOC_MinSOC","0"));;\
 \
 my $Midday_NotBefore                 = ReadingsVal($name,"SpeicherMidday_NotBefore","0");;\
 my $Midday_MaxSOC                    = ReadingsVal($name,"SpeicherMidday_MaxSOC","0");;\
\
 my $Midday_MaxChargePowerAbs_morning = sprintf("%d W"   ,ReadingsVal($name,"SpeicherMidday_MaxChargePowerAbs_morning","0"));;\
\
    $Midday_MaxChargePowerAbs_morning = ( $MiddayControlRunning == 1 and\
                                              time > time_str2num(POSIX::strftime("%Y-%m-%d",localtime(time))." $Midday_NotBefore") and\
                                          time < time_str2num(POSIX::strftime("%Y-%m-%d",localtime(time))." $Solar_middayhigh_fc0_start") and\
                                          $Midday_MaxSOC > $Act_state_of_charge ) ? "<span style='color:#00FF00'>$Midday_MaxChargePowerAbs_morning</span>" : $Midday_MaxChargePowerAbs_morning ;;\
\
 my $Midday_MaxChargePowerAbs_midday  = sprintf("%d"   ,ReadingsVal($name,"SpeicherMidday_MaxChargePowerAbs_midday","0"));;\
    $Midday_MaxChargePowerAbs_midday  = ( $Midday_MaxChargePowerAbs_midday == 0) ? "dynamisch" : $Midday_MaxChargePowerAbs_midday." W" ;; \
    $Midday_MaxChargePowerAbs_midday  = ( $MiddayControlRunning == 1 and\
                                              time > time_str2num(POSIX::strftime("%Y-%m-%d",localtime(time))." $Solar_middayhigh_fc0_start") and\
                                          time < time_str2num(POSIX::strftime("%Y-%m-%d",localtime(time))." $Solar_middayhigh_fc0_stop" ) ) ? "<span style='color:#00FF00'>$Midday_MaxChargePowerAbs_midday</span>" : $Midday_MaxChargePowerAbs_midday ;;\
\
    $Midday_NotBefore                 = ( $MiddayControlRunning == 1 and\
                                              time < time_str2num(POSIX::strftime("%Y-%m-%d",localtime(time))." $Midday_NotBefore") and\
                                              time > time_str2num(POSIX::strftime("%Y-%m-%d",localtime(time))." $MaxSOC_MinSOC_Time")) ? "< <span style='color:#FF0000'>$Midday_NotBefore</span>" :\
                                        ( $MiddayControlRunning == 1 and\
                                              time < time_str2num(POSIX::strftime("%Y-%m-%d",localtime(time))." $Solar_middayhigh_fc0_start") ) ? "> <span style='color:#00FF00'>$Midday_NotBefore</span>" : $Midday_NotBefore ;;\
\
    $Midday_MaxSOC                    = ( time < time_str2num(POSIX::strftime("%Y-%m-%d",localtime(time))." $Midday_NotBefore")) ? $Midday_MaxSOC." %" :\
                                            ( $MiddayControlRunning == 1 and\
                                              time < time_str2num(POSIX::strftime("%Y-%m-%d",localtime(time))." $Solar_middayhigh_fc0_start") and\
                                          $Midday_MaxSOC > $Act_state_of_charge ) ? "<span style='color:#00FF00'>$Midday_MaxSOC %</span>" : \
                                                                                ( time > time_str2num(POSIX::strftime("%Y-%m-%d",localtime(time))." $Solar_middayhigh_fc0_start")) ? $Midday_MaxSOC." %" : "<span style='color:#FF0000'>$Midday_MaxSOC %</span>" ;;\
\
    $Solar_middayhigh_fc0_start       = ( $MiddayControlRunning == 1 and\
                                              time >= time_str2num(POSIX::strftime("%Y-%m-%d",localtime(time))." $Solar_middayhigh_fc0_start") and\
                                          time <= time_str2num(POSIX::strftime("%Y-%m-%d",localtime(time))." $Solar_middayhigh_fc0_stop" ) ) ? "<span style='color:#00FF00'>$Solar_middayhigh_fc0_start</span>" : $Solar_middayhigh_fc0_start ;;\
    $Solar_middayhigh_fc0_stop        = ( $MiddayControlRunning == 1 and\
                                              time >= time_str2num(POSIX::strftime("%Y-%m-%d",localtime(time))." $Solar_middayhigh_fc0_start") and\
                                          time <= time_str2num(POSIX::strftime("%Y-%m-%d",localtime(time))." $Solar_middayhigh_fc0_stop" ) ) ? "<span style='color:#00FF00'>$Solar_middayhigh_fc0_stop</span>" : $Solar_middayhigh_fc0_stop ;;\
\
\
 my $Midday_Inverter_Max_Power        = sprintf("%d W"   ,ReadingsVal($name,"SpeicherMidday_Inverter_Max_Power","0"));;\
    $Midday_Inverter_Max_Power        = ($MiddayControlRunning      == 1                ) ? ">= <span style='color:#00FF00'> $Midday_Inverter_Max_Power</span>" : $Midday_Inverter_Max_Power ;;\
\
 my $MinSOC_fc1_Limit                 = ReadingsVal($name,"SpeicherMinSOC_fc1_Limit","0");;\
 my $MinSOC_Sommer                    = sprintf("%d %%"  ,ReadingsVal($name,"SpeicherMinSOC_Sommer","0"));;\
    $MinSOC_Sommer                    = ($Solar_Calculation_fc0_day >= $MinSOC_fc1_Limit) ? "<span style='color:#00FF00'>$MinSOC_Sommer</span>"             : $MinSOC_Sommer ;;\
\
 my $MinSOC_Winter                    = sprintf("%d %%"  ,ReadingsVal($name,"SpeicherMinSOC_Winter","0"));;\
    $MinSOC_Winter                    = ($Solar_Calculation_fc0_day <  $MinSOC_fc1_Limit) ? "<span style='color:#00FF00'>$MinSOC_Winter</span>"             : $MinSOC_Winter ;;\
\
    $MinSOC_fc1_Limit                 = ($Solar_Calculation_fc0_day >= $MinSOC_fc1_Limit) ? ">= <span style='color:#00FF00'>$MinSOC_fc1_Limit Wh</span>"    : $MinSOC_fc1_Limit." Wh" ;;\
    $MaxSOC_fc1_Limit                 = ($Solar_Calculation_fc0_day >= $MaxSOC_fc1_Limit) ? ">= <span style='color:#00FF00'>$MaxSOC_fc1_Limit Wh</span>" : $MaxSOC_fc1_Limit." Wh" ;;\
\
    $MaxSOC_Actual                    = ($MaxSOCControlRunning == 1) ? "<span style='color:#00FF00'>$MaxSOC_Actual %</span>"      : $MaxSOC_Actual." %" ;;\
    $Act_state_of_charge              = $Act_state_of_charge." %";;\
    $CmdRepeatRunning                 = ($CmdRepeatRunning     == 1) ? "<span style='color:#00FF00'>$CmdRepeatRunning</span>"     : $CmdRepeatRunning ;;\
    $MaxSOCControlRunning             = ($MaxSOCControlRunning == 1) ? "<span style='color:#00FF00'>$MaxSOCControlRunning</span>" : $MaxSOCControlRunning ;;\
    $MiddayControlRunning             = ($MiddayControlRunning == 1) ? "<span style='color:#00FF00'>$MiddayControlRunning</span>" : $MiddayControlRunning ;;\
\
    $ZeitStart                        = ($Entladung eq "Zeit") ? "<span style='color:#00FF00'>$ZeitStart</span>" : $ZeitStart ;;\
    $ZeitEnde                         = ($Entladung eq "Zeit") ? "<span style='color:#00FF00'>$ZeitEnde</span>"  : $ZeitEnde  ;;\
\
"<html><table border=2 bordercolor='darkgreen' cellspacing=0 style='width: 100%'>\
 <colgroup>\
   <col span='1' style='width: 52%;;'>\
   <col span='1' style='width: 12%;;'>\
   <col span='1' style='width: 12%;;'>\
   <col span='1' style='width: 12%;;'>\
   <col span='1' style='width: 12%;;'>\
 </colgroup> <tr><td style='padding-right:5px;;padding-left:5px;;font-weight:bold'> </td><td style='padding-right:5px;;padding-left:5px;;font-weight:bold'></td><td style='padding-right:5px;;padding-left:5px;;font-weight:bold'></td><td style='padding-right:5px;;padding-left:5px;;text-align:center;;font-weight:bold'></td><td style='padding-right:5px;;padding-left:5px;;text-align:center;;font-weight:bold'></td></tr>\
 <tr><td style='padding-right:5px;;padding-left:5px;;text-align:left;;font-weight:bold'>Speicher<dd>Steuerung / Status / Leistung / aktueller SOC</dd></td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$Entladung."</td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$DUMMY."</td><td style='padding-right:5px;;padding-left:5px;;text-align:center'>".$Status."<br></td><td style='padding-right:5px;;padding-left:5px;;text-align:center'>".$Power."<br>".$Act_state_of_charge."</td></tr>\
 <tr><td style='padding-right:5px;;padding-left:5px;;text-align:left;;font-weight:bold'>Trigger<dd>Status / ExternTrigger / Start / Ende</dd></td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$Trigger."</td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$ExternTrigger."</td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$ZeitStart."</td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$ZeitEnde."</td></tr>\
 <tr><td style='padding-right:5px;;padding-left:5px;;text-align:left;;font-weight:bold'>Kommando Wiederholung<dd>aktiviert / läuft</dd></td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$CmdRepeatActive."</td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$CmdRepeatRunning."</td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$DUMMY."</td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$DUMMY."</td></tr>\
 <tr><td style='padding-right:5px;;padding-left:5px;;text-align:left;;font-weight:bold'>MaxSOC Kontrolle<dd>aktiviert / läuft</dd></td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$MaxSOCControlActive."</td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$MaxSOCControlRunning."</td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$DUMMY."</td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$DUMMY."</td></tr>\
 <tr><td style='padding-right:5px;;padding-left:5px;;text-align:left;;font-weight:bold'>MaxSOC Limit<dd>fc1_Limit / Minimum SOC Zeit / gestern / Ziel</dd></td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$MaxSOC_fc1_Limit."</td><td style='padding-right:5px;;padding-left:5px;;text-align:center'>".$MaxSOC_MinSOC_Time."<br>".$MaxSOC_MinSOC_MinSOC."</td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$MaxSOC_DayBefore."</td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$MaxSOC_Actual."</td></tr>\
 <tr><td style='padding-right:5px;;padding-left:5px;;text-align:left;;font-weight:bold'>Mittags Kontrolle<dd>aktiviert / läuft</dd></td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$MiddayControlActive."</td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$MiddayControlRunning."</td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$DUMMY."</td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$DUMMY."</td></tr>\
 <tr><td style='padding-right:5px;;padding-left:5px;;text-align:left;;font-weight:bold'>Mittags Limits<dd>Inverter_Max_Power / Laden nicht vor / Start /Stop<br><br>MaxSOC morgens / Power morgens / Power mittags</dd></td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$Midday_Inverter_Max_Power."<br><br>".$Midday_MaxSOC."</td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$Midday_NotBefore."<br><br>".$Midday_MaxChargePowerAbs_morning."</td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$Solar_middayhigh_fc0_start."<br><br>".$Midday_MaxChargePowerAbs_midday."</td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$Solar_middayhigh_fc0_stop."<br><br><br>".$DUMMY."</td></tr>\
 <tr><td style='padding-right:5px;;padding-left:5px;;text-align:left;;font-weight:bold'>MinSOC Steuerung<dd>fc1_Limit / Winter / Sommer</dd></td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$MinSOC_fc1_Limit."</td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$DUMMY."</td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$MinSOC_Winter."</td><td style='padding-right:5px;;padding-left:5px;;text-align:center'><br>".$MinSOC_Sommer."</td></tr>\
 </table>\
</html>"\
}\

attr WR_1_Speicher_1_ExternControl uiTable {\
package ui_Table;;\
$TC{1..5}="align='center'";;         ## Spalten 1 bis 5 werden zentriert\
}\
\
"Kommando<dd>Auswahl</dd>" | widget([$SELF:ui_command],"uzsuDropDown,---,smart_Laden start,smart_Laden beenden,3 Minuten Wiederholung")\
\
"Speicher<dd>Steuerung</dd>" | widget([$SELF:SpeicherEntladung],"uzsuDropDown,Automatik,Trigger,Zeit")\
\
"Trigger<dd>Status / ExternTrigger / Start / Ende</dd>" | widget([$SELF:SpeicherTrigger],"uzsuDropDown,entladen,gesperrt,none") | | widget([$SELF:SpeicherExternTrigger],"uzsuDropDown,frei,none") | widget([$SELF:SpeicherZeitStart],"time") | widget([$SELF:SpeicherZeitEnde],"time")\
\
"Kommando Wiederholung<dd>aktiviert / läuft</dd>" | widget([$SELF:SpeicherCmdRepeatActive],"uzsuToggle,0,1") | widget([$SELF:SpeicherCmdRepeatRunning],"uzsuToggle,0,1")\
\
"MaxSOC Kontrolle<dd>aktiviert / läuft</dd>" | widget([$SELF:SpeicherMaxSOCControlActive],"uzsuToggle,0,1") | widget([$SELF:SpeicherMaxSOCControlRunning],"uzsuToggle,0,1")\
\
"MaxSOC Limit<dd>fc1_Limit / Minimum SOC Zeit / gestern / Ziel</dd>" | widget([$SELF:SpeicherMaxSOC_fc1_Limit],"selectnumbers,2000,1000,40000,0,lin") | widget([$SELF:SpeicherMaxSOC_MinSOC_Time],"time")."<br>". widget([$SELF:SpeicherMaxSOC_MinSOC_MinSOC],"selectnumbers,5,1,100,0,lin") | "<br><br>".widget([$SELF:SpeicherMaxSOC_DayBefore],"selectnumbers,5,1,100,0,lin") | "<br><br>".widget([$SELF:SpeicherMaxSOC_Actual],"selectnumbers,5,1,100,0,lin")\
\
"Mittags Kontrolle<dd>aktiviert / läuft</dd>" |widget([$SELF:SpeicherMiddayControlActive],"uzsuToggle,0,1") | widget([$SELF:SpeicherMiddayControlRunning],"uzsuToggle,0,1")\
\
"Mittags Limits<dd>Inverter_Max_Power / Laden nicht vor / Start /Stop<br><br>MaxSOC morgens / Power morgens / Power mittags</dd>" |\
widget([$SELF:SpeicherMidday_Inverter_Max_Power],"selectnumbers,1000,250,15000,0,lin")."<br><br>".widget([$SELF:SpeicherMidday_MaxSOC],"selectnumbers,5,1,100,0,lin") | widget([$SELF:SpeicherMidday_NotBefore],"time")."<br><br>".widget([$SELF:SpeicherMidday_MaxChargePowerAbs_morning],"selectnumbers,0,50,2000,0,lin") | widget([WR_1:Solar_middayhigh_fc0_start],"time")."<br><br>".widget([$SELF:SpeicherMidday_MaxChargePowerAbs_midday],"selectnumbers,0,1,5000,0,lin") | widget([WR_1:Solar_middayhigh_fc0_stop],"time")."<br><br><br>"\
\
"MinSOC Steuerung<dd>fc1_Limit / Winter / Sommer</dd>" | widget([$SELF:SpeicherMinSOC_fc1_Limit],"selectnumbers,2000,1000,40000,0,lin") | |widget([$SELF:SpeicherMinSOC_Winter],"selectnumbers,10,1,30,0,lin") | widget([$SELF:SpeicherMinSOC_Sommer],"selectnumbers,5,1,10,0,lin")\

« Letzte Änderung: 20 September 2021, 11:36:43 von ch.eick »
RPI4; Docker; CUNX; Eltako FSB61NP; 230V zentral verschaltet; SamsungTV H-Serie; DLNARenderer; TV.pl;  Sonos; Vallox; Luxtronik; 2x FB7490; Stromzähler mit DvLIR; wunderground; clever-tanken; Plenticore 10 mit BYD; EM410; SMAEM; Modbus TCP

Offline Damian

  • Developer
  • Hero Member
  • ****
  • Beiträge: 8812
Antw:DOIF uiTable und stateFormat zusammen führen
« Antwort #1 am: 09 September 2021, 17:46:11 »
Hier hat jemand recht aufwändig mit uiTable ganzes Fernsehenprogramm in einer Tabelle teils mit Rahmen programmiert, vielleicht kannst du dir da paar Ideen abgucken: https://forum.fhem.de/index.php/topic,112081.msg1063809.html#msg1063809
« Letzte Änderung: 09 September 2021, 17:47:44 von Damian »
Programmierte FHEM-Module: DOIF-FHEM, DOIF-Perl, DOIF-uiTable, THRESHOLD, FHEM-Befehl: IF

Offline ch.eick

  • Hero Member
  • *****
  • Beiträge: 2006
Antw:DOIF uiTable und stateFormat zusammen führen
« Antwort #2 am: 09 September 2021, 18:22:45 »
Hier hat jemand recht aufwändig mit uiTable ganzes Fernsehenprogramm in einer Tabelle teils mit Rahmen programmiert, vielleicht kannst du dir da paar Ideen abgucken.
Das schau ich mir mal an, die Tabelle geht ja schon in meine Richtung.

Kann man da in ein Tabellen Feld auch die widgets platzieren?

Gruß
     Christian
RPI4; Docker; CUNX; Eltako FSB61NP; 230V zentral verschaltet; SamsungTV H-Serie; DLNARenderer; TV.pl;  Sonos; Vallox; Luxtronik; 2x FB7490; Stromzähler mit DvLIR; wunderground; clever-tanken; Plenticore 10 mit BYD; EM410; SMAEM; Modbus TCP

Offline Damian

  • Developer
  • Hero Member
  • ****
  • Beiträge: 8812
Antw:DOIF uiTable und stateFormat zusammen führen
« Antwort #3 am: 09 September 2021, 18:46:33 »
Das schau ich mir mal an, die Tabelle geht ja schon in meine Richtung.

Kann man da in ein Tabellen Feld auch die widgets platzieren?

Gruß
     Christian

Klar, es ist doch mit uiTable realisiert, wie bei dir auch. Er hat sich das Leben etwas einfacher gemacht und nutzt für die Zeilendarstellung  jeweils ein selbst definiertes Template: TPL_TV
Programmierte FHEM-Module: DOIF-FHEM, DOIF-Perl, DOIF-uiTable, THRESHOLD, FHEM-Befehl: IF

Offline Damian

  • Developer
  • Hero Member
  • ****
  • Beiträge: 8812
Antw:DOIF uiTable und stateFormat zusammen führen
« Antwort #4 am: 10 September 2021, 07:56:15 »
Die Eigenschaften der einzelnen Zellen der TV-Tabelle wurden über die $TR-, $TD-Variablen definiert (siehe https://wiki.fhem.de/wiki/DOIF/uiTable_Schnelleinstieg#CSS-Variablen_und_Steuerungsattribute)

  $TR{0,31} = "style='color:yellow;;text-align:center;;font-weight:bold;;font-size:18px'";;\
  $TD{0..29,31..60}{2,4} = "style='font-size:16px;;border-right-style:solid;;border-color:#CCCCCC;;border-right-width:1px;;'";;\
  $TD{0..29,31..60}{0} = "align='center' style='border-right-style:solid;;border-color:#CCCCCC;;border-right-width:1px;;'";;\
  $TD{0..60}{1,3,5,6} = "style='font-size:16px;;'";;\
  $TD{30}{0..6} = "style='border-top-style:solid;;border-bottom-style:solid;;border-color:#CCCCCC;;border-top-width:1px;;border-bottom-width:1px;;'";;\
Programmierte FHEM-Module: DOIF-FHEM, DOIF-Perl, DOIF-uiTable, THRESHOLD, FHEM-Befehl: IF

Offline ch.eick

  • Hero Member
  • *****
  • Beiträge: 2006
Antw:DOIF uiTable und stateFormat zusammen führen
« Antwort #5 am: 10 September 2021, 09:17:20 »
Die Eigenschaften der einzelnen Zellen der TV-Tabelle wurden über die $TR-, $TD-Variablen definiert (siehe https://wiki.fhem.de/wiki/DOIF/uiTable_Schnelleinstieg#CSS-Variablen_und_Steuerungsattribute)

  $TR{0,31} = "style='color:yellow;;text-align:center;;font-weight:bold;;font-size:18px'";;\
  $TD{0..29,31..60}{2,4} = "style='font-size:16px;;border-right-style:solid;;border-color:#CCCCCC;;border-right-width:1px;;'";;\
  $TD{0..29,31..60}{0} = "align='center' style='border-right-style:solid;;border-color:#CCCCCC;;border-right-width:1px;;'";;\
  $TD{0..60}{1,3,5,6} = "style='font-size:16px;;'";;\
  $TD{30}{0..6} = "style='border-top-style:solid;;border-bottom-style:solid;;border-color:#CCCCCC;;border-top-width:1px;;border-bottom-width:1px;;'";;\
Okay, ich glaube das habe ich verstanden.
Was mir fehlt wäre ein Beispiel für eine Zelle, in der z.B. widget([$SELF:SpeicherMinSOC_Winter],"selectnumbers,10,1,30,0,lin") aufgerufen wird. as bekomme ich einfach trotz des tollen Wikis nicht hin. Ein Beispiel habe ich dazu auch nicht gefunden :-(

Danke für Deine Geduld
   Christian
RPI4; Docker; CUNX; Eltako FSB61NP; 230V zentral verschaltet; SamsungTV H-Serie; DLNARenderer; TV.pl;  Sonos; Vallox; Luxtronik; 2x FB7490; Stromzähler mit DvLIR; wunderground; clever-tanken; Plenticore 10 mit BYD; EM410; SMAEM; Modbus TCP

Offline Damian

  • Developer
  • Hero Member
  • ****
  • Beiträge: 8812
Antw:DOIF uiTable und stateFormat zusammen führen
« Antwort #6 am: 10 September 2021, 10:19:10 »
Okay, ich glaube das habe ich verstanden.
Was mir fehlt wäre ein Beispiel für eine Zelle, in der z.B. widget([$SELF:SpeicherMinSOC_Winter],"selectnumbers,10,1,30,0,lin") aufgerufen wird. as bekomme ich einfach trotz des tollen Wikis nicht hin. Ein Beispiel habe ich dazu auch nicht gefunden :-(

Danke für Deine Geduld
   Christian

Du schreibst die widget-Funktion einfach in die Zelle:

attr di_widget uTable {package ui_Table}\
widget([$SELF:SpeicherMinSOC_Winter],"selectnumbers,10,1,30,0,lin") ## widget in der ersten Zelle, die Tabelle besteht hier nur aus einer Zelle

oder

attr di_widget uTable {package ui_Table}\
"erste Zelle"|widget([$SELF:SpeicherMinSOC_Winter],"selectnumbers,10,1,30,0,lin")|"dritte Zelle"  ## widget in der zweiten Zelle, die Tabelle hat hier drei Zellen
Programmierte FHEM-Module: DOIF-FHEM, DOIF-Perl, DOIF-uiTable, THRESHOLD, FHEM-Befehl: IF

Offline ch.eick

  • Hero Member
  • *****
  • Beiträge: 2006
Antw:DOIF uiTable und stateFormat zusammen führen
« Antwort #7 am: 17 September 2021, 22:45:37 »
EDIT: css ist wohl das Zauberwort, aber da kenne ich mich noch nicht so aus :-)
Hier ist $TABLE und width:nn% dazu gekommen.
{
package ui_Table;
  $TABLE = "style='width:100%;'";

  $TD{0..9}{0}     = "align='center' style='font-size:16px;border-right-style:solid;border-color:darkgreen;border-right-width:2px;width:32%'";

  $TD{0..9}{1} = "style='border-top-style:solid;border-bottom-style:solid;border-right-style:solid;border-color:darkgreen;border-top-width:2px;border-bottom-width:2px;border-right-width:1px;width:36%;' ";
  $TD{0..9}{2..4} = "style='border-top-style:solid;border-bottom-style:solid;border-right-style:solid;border-color:darkgreen;border-top-width:2px;border-bottom-width:2px;border-right-width:1px;width:8%;' ";
  $TD{0..9}{5} = "style='border-top-style:solid;border-bottom-style:solid;border-right-style:solid;border-color:darkgreen;border-top-width:2px;border-bottom-width:2px;border-right-width:2px;width:8%;' ";
}



Hallo,
hier ist mein derzeitiger Stand der Transformation für die Zusammenführung von stateFormat und uiTable.

Meine Frage dazu ist nun, wie ich die Breite der Spalten besser beeinflussen kann.

Im stateFormat habe ich es so gelöst, wobei die Basis mit dem Modulnamen ja noch vom FHEMWEB beeinflusst wird.
"<html><table border=2 bordercolor='darkgreen' cellspacing=0 style='width: 100%'>
 <colgroup>
   <col span='1' style='width: 52%;'>
   <col span='1' style='width: 12%;'>
   <col span='1' style='width: 12%;'>
   <col span='1' style='width: 12%;'>
   <col span='1' style='width: 12%;'>
 </colgroup>

<...>

Im uiTable  gibt es bisher nur diese Definition, die dem stateFormat schon recht nah kommt.
{
package ui_Table;
  $TD{0..9}{0}     = "align='center' style='font-size:16px;border-right-style:solid;border-color:darkgreen;border-right-width:2px;'";

  $TD{0..9}{1..4} = "style='border-top-style:solid;border-bottom-style:solid;border-right-style:solid;border-color:darkgreen;border-top-width:2px;border-bottom-width:2px;border-right-width:1px;' ";
  $TD{0..9}{5} = "style='border-top-style:solid;border-bottom-style:solid;border-right-style:solid;border-color:darkgreen;border-top-width:2px;border-bottom-width:2px;border-right-width:2px;' ";
}

"$SELF"|"Kommando<dd>Auswahl / DcPowerAbs</dd>" | widget([$SELF:ui_command],"uzsuDropDown,---,smart_Laden start,smart_Laden beenden,3 Minuten Wiederholung,Reset,DC_Power_Abs,Sommer,Winter") | widget([$SELF:SpeicherDcPowerAbs],"selectnumbers,0,250,4500,0,lin") |""|""

|"Speicher<dd>Steuerung</dd>" | widget([$SELF:SpeicherEntladung],"uzsuDropDown,Automatik,Trigger,Zeit") |""|""|""

|"Trigger<dd>Status / ExternTrigger / Start / Ende</dd>" | widget([$SELF:SpeicherTrigger],"uzsuDropDown,entladen,gesperrt,none") | widget([$SELF:SpeicherExternTrigger],"uzsuDropDown,frei,none") | widget([$SELF:SpeicherZeitStart],"time") | widget([$SELF:SpeicherZeitEnde],"time")

|"Kommando Wiederholung<dd>aktiviert / läuft</dd>" | widget([$SELF:SpeicherCmdRepeatActive],"uzsuToggle,0,1") | widget([$SELF:SpeicherCmdRepeatRunning],"uzsuToggle,0,1") |""|""

<...>

Bisher konnte ich auch noch keine Dokumentation zu uiTable im FHEM finden, wenn man von den Beispielen absieht.

VG
   Christian
« Letzte Änderung: 17 September 2021, 23:50:05 von ch.eick »
RPI4; Docker; CUNX; Eltako FSB61NP; 230V zentral verschaltet; SamsungTV H-Serie; DLNARenderer; TV.pl;  Sonos; Vallox; Luxtronik; 2x FB7490; Stromzähler mit DvLIR; wunderground; clever-tanken; Plenticore 10 mit BYD; EM410; SMAEM; Modbus TCP

Offline Damian

  • Developer
  • Hero Member
  • ****
  • Beiträge: 8812
Antw:DOIF uiTable und stateFormat zusammen führen
« Antwort #8 am: 18 September 2021, 10:38:58 »
Die Breiten der jeweiligen Spalten einer Tabelle werden automatisch in HTML angepasst. Hier orientiert man sich jeweils an der Zelle mit der größten Breite der jeweiligen Spalte. Das hat ja nichts mit uiTable zu tun.

Man kann über die Eigenschaften der Zellen natürlich zusätzlich die Breiten anpassen:

z. B.

$TC{0..1}  = "style='width:50%'";
bedeutet: Zellen der Spalte 1 und 2 werden auf 50% gesetzt.

Ich habe mich immer auf die HTML-Automatiken verlassen. Für ein einheitliches Aussehen ist meistens die Ausrichtung der Zellen (links, rechts, zentriert) wichtiger.





Programmierte FHEM-Module: DOIF-FHEM, DOIF-Perl, DOIF-uiTable, THRESHOLD, FHEM-Befehl: IF

Offline ch.eick

  • Hero Member
  • *****
  • Beiträge: 2006
Antw:DOIF uiTable und stateFormat zusammen führen
« Antwort #9 am: 18 September 2021, 10:58:47 »
Die Breiten der jeweiligen Spalten einer Tabelle werden automatisch in HTML angepasst. Hier orientiert man sich jeweils an der Zelle mit der größten Breite der jeweiligen Spalte. Das hat ja nichts mit uiTable zu tun.

Man kann über die Eigenschaften der Zellen natürlich zusätzlich die Breiten anpassen:

z. B.

$TC{0..1}  = "style='width:50%'";
bedeutet: Zellen der Spalte 1 und 2 werden auf 50% gesetzt.

Ich habe mich immer auf die HTML-Automatiken verlassen. Für ein einheitliches Aussehen ist meistens die Ausrichtung der Zellen (links, rechts, zentriert) wichtiger.
Okay, das deckt sich mit dem was ich gefunden habe, es ist halt nur etwas unschön, wenn die zusammen gehörenden Devices unterschiedlich aussehen, und das möchte ich anpassen.
Und nochmals Danke für die Zusatzinformation mit der Position in der Zelle.

Ich glaube bei dem Thema sind wir jeweils eine one man show :-)

    Christian
RPI4; Docker; CUNX; Eltako FSB61NP; 230V zentral verschaltet; SamsungTV H-Serie; DLNARenderer; TV.pl;  Sonos; Vallox; Luxtronik; 2x FB7490; Stromzähler mit DvLIR; wunderground; clever-tanken; Plenticore 10 mit BYD; EM410; SMAEM; Modbus TCP

Offline Damian

  • Developer
  • Hero Member
  • ****
  • Beiträge: 8812
Antw:DOIF uiTable und stateFormat zusammen führen
« Antwort #10 am: 18 September 2021, 19:40:38 »
Okay, das deckt sich mit dem was ich gefunden habe, es ist halt nur etwas unschön, wenn die zusammen gehörenden Devices unterschiedlich aussehen, und das möchte ich anpassen.
Und nochmals Danke für die Zusatzinformation mit der Position in der Zelle.

Ich glaube bei dem Thema sind wir jeweils eine one man show :-)

    Christian

Ich denke, die meisten verwenden uiTable um die SVG-Funktionen, wie ring oder card, für die Visualisierung zu nutzen.
Programmierte FHEM-Module: DOIF-FHEM, DOIF-Perl, DOIF-uiTable, THRESHOLD, FHEM-Befehl: IF

Offline ch.eick

  • Hero Member
  • *****
  • Beiträge: 2006
Antw:DOIF uiTable und stateFormat zusammen führen
« Antwort #11 am: 20 September 2021, 11:36:01 »
Moin
und schon habe ich wieder ein Problem gemacht :-)

das uiTable sieht so aus, aber es kommt immer wieder zyklich eine Fehlermeldung in einem popup Fenster:

EDIT: Die Meldung kommt übrigens genau zwei mal kurz hintereinander und dann mit einer Pause zyklisch immer wieder.
    fhemweb.js line 1: SyntaxError: missing ) after argument list
{
package ui_Table;
  $TABLE = "style='width:100%;'";

  $TD{0..9}{0}     = "align='center' style='font-size:16px;border-right-style:solid;border-color:darkgreen;border-right-width:2px;width:32%'";

  $TD{0..9}{1} = "style='border-top-style:solid;border-bottom-style:solid;border-right-style:solid;border-color:darkgreen;border-top-width:2px;border-bottom-width:2px;border-right-width:1px;width:36%;'";
  $TD{0..9}{2..4} = "style='border-top-style:solid;border-bottom-style:solid;border-right-style:solid;border-color:darkgreen;border-top-width:2px;border-bottom-width:2px;border-right-width:1px;width:8%;text-align:center;'";
  $TD{0..9}{5} = "style='border-top-style:solid;border-bottom-style:solid;border-right-style:solid;border-color:darkgreen;border-top-width:2px;border-bottom-width:2px;border-right-width:2px;width:8%;text-align:center;'";

sub FUNC_Status {
    my($value, $min, $colorMin,  $statusMin,  $colorMiddel, $statusMiddle, $max, $colorMax, $statusMax)=@_;
    my $ret = ($value < $min)? "<span style='color:".$colorMin."'>".$statusMin."</span>" : ($value > $max)? "<span style='color:".$colorMax."'>".$statusMax."</span>" : "<span style='color:".$colorMiddel."'>".$statusMiddle."</span>";
    return $ret;
  }
}

|"Speicher<dd>Steuerung</dd>" | widget([$SELF:SpeicherEntladung],"uzsuDropDown,Automatik,Trigger,Zeit") |""|
FUNC_Status([WR_1:Actual_Battery_charge_-minus_or_discharge_-plus_P],-10,"#00FF00","Laden","orange","Standby",15,"#FF0000","Entladen")|
 [WR_1:Actual_Battery_charge_-minus_or_discharge_-plus_P]." W<br>".sprintf("%d %%",[WR_1:Act_state_of_charge])


Ich habe es nun schon bis auf diesen einen Funktionsaufruf herunter gebrochen.
Zum Test habe ich es dann auf die Komandozeile umgeschrieben und bekomme von der Funktion korrekte Rückgaben.
{ sub FUNC_Status {     my($value, $min, $colorMin,  $statusMin,  $colorMiddel, $statusMiddle, $max, $colorMax, $statusMax)=@_;;     my $ret = ($value < $min)? "<span style='color:".$colorMin."'>".$statusMin."</span>" : ($value > $max)? "<span style='color:".$colorMax."'>".$statusMax."</span>" : "<span style='color:".$colorMiddel."'>".$statusMiddle."</span>";;     return $ret;;   };; FUNC_Status(0,-10,"#00FF00","Laden","orange","Standby",15,"#FF0000","Entladen");; }

Ausgabe:
<span style='color:orange'>Standby</span>
Auch das Ergebnis in der Tabelle wird korrekt dargestellt, also der Text "Standy" in orange.

Was kann ich noch weiter unternehmen, um dem Problem auf die Spur zu kommen?

VG
   Christian
« Letzte Änderung: 20 September 2021, 13:20:18 von ch.eick »
RPI4; Docker; CUNX; Eltako FSB61NP; 230V zentral verschaltet; SamsungTV H-Serie; DLNARenderer; TV.pl;  Sonos; Vallox; Luxtronik; 2x FB7490; Stromzähler mit DvLIR; wunderground; clever-tanken; Plenticore 10 mit BYD; EM410; SMAEM; Modbus TCP

Offline Damian

  • Developer
  • Hero Member
  • ****
  • Beiträge: 8812
Antw:DOIF uiTable und stateFormat zusammen führen (fhemweb.js)
« Antwort #12 am: 20 September 2021, 16:08:46 »
ich kann mich dunkel erinnern, das die Schnittstelle zwischen DOIF und FHEMWEB bei Funktionen nicht mit Hochkomma klar kommt. Probiere mal stattdessen mit Anführungszeichen.

statt:

<span style='color:orange'>Standby</span>
<span style="color:orange">Standby</span>

Programmierte FHEM-Module: DOIF-FHEM, DOIF-Perl, DOIF-uiTable, THRESHOLD, FHEM-Befehl: IF

Offline ch.eick

  • Hero Member
  • *****
  • Beiträge: 2006
Antw:DOIF uiTable und stateFormat zusammen führen (fhemweb.js)
« Antwort #13 am: 20 September 2021, 17:25:06 »
ich kann mich dunkel erinnern, das die Schnittstelle zwischen DOIF und FHEMWEB bei Funktionen nicht mit Hochkomma klar kommt. Probiere mal stattdessen mit Anführungszeichen.
Ich teste es mal und melde mich dann wieder
RPI4; Docker; CUNX; Eltako FSB61NP; 230V zentral verschaltet; SamsungTV H-Serie; DLNARenderer; TV.pl;  Sonos; Vallox; Luxtronik; 2x FB7490; Stromzähler mit DvLIR; wunderground; clever-tanken; Plenticore 10 mit BYD; EM410; SMAEM; Modbus TCP