DOIF uiTable und stateFormat zusammen führen (fhemweb.js)

[ch.eick]

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

Code Auswählen Erweitern


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")\



[Damian]

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

[ch.eick]

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

[Damian]

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

[Damian]

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)

Code Auswählen Erweitern

  $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;;'";;\


[ch.eick]

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)

Code Auswählen Erweitern

  $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

[Damian]

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:

Code Auswählen Erweitern

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

Code Auswählen Erweitern


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

[ch.eick]

EDIT: css ist wohl das Zauberwort, aber da kenne ich mich noch nicht so aus
Hier ist $TABLE und width:nn% dazu gekommen.

Code Auswählen Erweitern


{
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.

Code Auswählen Erweitern


"<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.

Code Auswählen Erweitern


{
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

[Damian]

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.

Code Auswählen Erweitern

$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.

[ch.eick]

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.

Code Auswählen Erweitern

$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

[Damian]

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.

[ch.eick]

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

Code Auswählen Erweitern


{
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.

Code Auswählen Erweitern


{ 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

[Damian]

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:

Code Auswählen Erweitern

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

Code Auswählen Erweitern

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

[ch.eick]

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