Problem mit oh-icon

GUI Relevanten, PaperUI, BasicUI, HabPanel ...

Moderatoren: seppy, udo1toni

Antworten
ollyins
Beiträge: 43
Registriert: 17. Jul 2022 23:34
Answers: 0

Problem mit oh-icon

Beitrag von ollyins »

Hallo,

ich probiere schon seit einige Tagen den Fehler bei dem folgenden widget zu finden:

Code: Alles auswählen

uid: Pool_widget
tags: []
props:
  parameters:
    - description: Small title on top of the card
      label: Title
      name: title
      required: false
      type: TEXT
    - description: HEX or rgba
      label: Background Color
      name: bgcolor
      required: false
      type: TEXT
    - context: item
      description: Item Pooltemp
      label: Item
      name: itemtemp
      required: false
      type: TEXT
    - context: item
      description: Item PH-Wert
      label: Item
      name: itempHWert
      required: false
      type: TEXT
    - context: item
      description: Item Poolpump
      label: Item
      name: itempump
      required: false
      type: TEXT
    - context: icon
      description: Icon Poolpump
      label: Icon
      name: iconpump
      required: false
      type: TEXT
    - context: Title
      description: Message for status on
      label: messageon
      name: message_on
      required: false
      type: TEXT
    - context: Title
      description: Message for status off
      label: messageoff
      name: message_off
      required: false
      type: TEXT
  parameterGroups: []
timestamp: Mar 9, 2023, 9:42:38 PM
component: f7-card
config:
  style:
    background-color: "=props.bgcolor ? props.bgcolor : ''"
    border-radius: var(--f7-card-expandable-border-radius)
    box-shadow: 5px 5px 10px 1px rgba(0,0,0,0.1)
    class:
      - padding: 0px
    height: 150px
    margin-left: 5px
    margin-right: 5px
    noShadow: true
slots:
  content:
    - component: f7-block
      config:
        style:
          display: flex
          flex-direction: row
          left: 16px
          position: absolute
          top: -8px
      slots:
        default:
          - component: oh-icon
            config:
              icon: pool
              style:
                filter: "='invert(' + (themeOptions.dark === 'dark' ? '1' : '0') + ')'"
                height: 32px
                margin-right: 2px
          - component: Label
            config:
              style:
                font-size: 12px
                margin-top: 0px
              text: "=props.title ? props.title : ''"
    - component: f7-block
      config:
        class:
          - text-align-center
        style:
          top: 75px
          left: px
          position: absolut
          width: 100%
      slots:
        default:
          - component: oh-icon
            config:
              icon: '=(items[props.itempump].state === "0") ?  props.iconpump + "-off" :  props.iconpump + "-on"'
              action: toggle
              actionItem: =props.itempump
              actionCommand: ON
              actionCommandAlt: OFF
              height: 48px
              style:
                left: 40px
                margin-right: 5px
                cursor: pointer
    - component: f7-block
      config:
        class:
          - text-align-center
        style:
          top: 20px
          flex-direction: row
          left: 40px
          position: absolute
          width: 100%
      slots:
        default:
          - component: Label
            config:
              style:
                font-size: 18px
                font-weight: 400
                margin-left: 0px
                margin-top: 0px
              text: =items[props.itemtemp].state + '°'
    - component: f7-block
      config:
        class:
          - text-align-center
        style:
          top: 50px
          left: 40px
          position: absolute
          width: 100%
      slots:
        default:
          - component: f7-icon
            config:
              f7: thermometer
              size: 30px
    - component: f7-block
      config:
        class:
          - text-align-center
        style:
          top: 20px
          flex-direction: row
          left: 80px
          position: absolute
          width: 100%
      slots:
        default:
          - component: Label
            config:
              style:
                font-size: 18px
                font-weight: 400
                margin-left: 0px
                margin-top: 0px
              text: =items[props.itempHWert].state
    - component: f7-block
      config:
        class:
          - text-align-center
        style:
          top: 46px
          left: 80px
          position: absolute
          width: 100%
      slots:
        default:
          - component: oh-icon
            config:
              height: 36px
              icon: phwert
              margin-right: 5px
In der Basic UI funktioniert das Umschalten mit dem folgenden item und rules:

Code: Alles auswählen

String NeoPoolMode 		"Mode [%s]"  						(gPool)	 { channel="mqtt:topic:neopool_D7CDB8:NPMode"}
String NeoPoolFilter		"Filtration [%s]"  					(gPool)	 { channel="mqtt:topic:neopool_D7CDB8:NPFilter"}

Number PoolPumpe 		"PoolPumpe [MAP(3states.map):%s]"				{ autoupdate="true" }
mapping:

Code: Alles auswählen

0=AUSF
1=EIN
Null=AUS
rule:

Code: Alles auswählen

rule "Poolpumpe Ein/Aus/Off-Auto"
when
    Item PoolPumpe changed
then
	logInfo("Neopool-RULE", "--> PoolPumpe wechselt Status ist " + PoolPumpe)
    switch ((PoolPumpe.state as Number).intValue) {
		case 0 : {NeoPoolFilter.sendCommand(0)
				NeoPoolMode.sendCommand(1)}
		case 1 : {NeoPoolFilter.sendCommand(1)
				  NeoPoolMode.sendCommand(0)}
    }
end
Sidemap:

Code: Alles auswählen

Switch item=PoolPumpe label="Poolpumpe [%s]" icon="pump" mappings=[0="AUS",1="EIN"]		
Switch item=NeoPoolMode label="Filtermodus" icon="flow" mappings=[0="MANUAL", 1="AUTO"]

Sinn des ganzen ist es die Poolfilterung manuell ein zu schalten und dabei muss zuerst der Mode von auto auf manuel gewechselt werden und dann die pumpe eingeschaltet werden, bei aus entsprechend umgekehrt.
Das funktioniert mit der Basic Ui, aber das icon passt sich nciht an, obwohl es die 3 files "pump.png" , "pump-off.png" und "pump-on.png" im icons/classic ordner gibt.
Im Widget ändert sich das icon sogar gemäß Zustand, nur dort kann ich es mit dem oben zuerst aufgeführten Code nicht anklicken..
Der Widget-Code funktioniert an anderer Stelle auch als oh-icon anklickbar für eine Gartentür problemlos.. aber hier eben nicht..
Wieder irgend ein blöder Fehler den ich nicht finde.
Das widget sieht so aus:
poolwidget.jpg
Hilfe ist willkommen...

saludos,

Oliver


Nachtrag: das Image ist von einer vorherigen Version mit oh-label, von daher der Schatten... nun ist es mit oh-icon angesetzt.. siehe Code oben aber tut es eben nicht.
Keiner hier der eine Idee hat ?
Du hast keine ausreichende Berechtigung, um die Dateianhänge dieses Beitrags anzusehen.

Antworten