Hauptmenü

Darstellung dyn. Tabellenfeld in Organisation

Begonnen von mplan, 16.05.2023 12:12:56

⏪ vorheriges - nächstes ⏩

mplan

Hallo,
wir möchten in der Organisation ein zusätzliches dynamisches Feld vom Typ Tabelle anzeigen.
Das Feld wurde als Typ Tabelle definitiert
Dann wurde das "organisation-details-info-widget" angepasst und ein Abschnitt eingefügt
{
        "style": "",
        "separator": true,
        "values": [
          [
            {
              "componentId": "object-avatar-label",
              "componentData": {
                "property": "DynamicFields.Unterricht"
              }
            }
          ]
        ]
      },

ebenso  "organisation-edit-form-group-information" im Abschnitt "FormGroup":
{
      "id": "ticket-new-form-field-dynamic-field-unterricht",
      "property": "DynamicFields",
      "inputComponent": null,
      "required": false,
      "readOnly": false,
      "options": [
        {
          "option": "FIELD_NAME",
          "value": "Unterricht"
        }
      ],
      "valid": true
    }

Beim Bearbeiten der Organisation wird das Feld angezeigt und man kann die Tabelle editieren.
StundeZeit vonZeit bisBeschreibung
17:008:30

Allerdings ist die Darstellung in der Übersicht (Organisation Info Widget) eher JSON, ohne Spalten-Header:
Unterrichtszeiten
[["1","7:00","8:30",""],
["2","8:45","10:15",""]]

Wie erreicht man eine korrekte Tabellendarstellung in der Details-Ansicht (Details-Widget) der Organisation?
(bzw. dann auch im Kontakt-Widget, wo es später auch engeblendet werden soll)
Wie muss man das Tabellenfeld richtig in der Konfiguration angeben?

Viele Grüße
Michael

Benedikt Geißler

Hallo Michael,

es gibt für die GUI-Konfiguration im Wesentlichen zwei verschiedene Komponenten. Einmal object-avatar-label, das dient zur Darstellung einfacher Zahlen- und Textwerte mit Beschriftung und Icon. Und dann gibt es noch dynamic-field-value, das kann auch komplexe Informationen, wie sie z. B. in Tabellen-DFs vorkommen, darstellen. Im Folgenden ist ein Beispiel-Konfigurationsschnipsel aufgeführt:

{
  "style": "",
  "separator": true,
  "values": [
    [
      {
        "text": "Beschriftung",
        "textStyle": "font-style:italic;color:#5b5b5b;margin-bottom:0.5rem",
        "componentId": "dynamic-field-value",
        "componentData": {
          "name": "Unterricht"
        },
        "detailViewWidthFactor": "4",
        "conditions": [
          {
            "property": "DynamicFields.Untericht",
            "operator": "NE",
            "value": null
          }
        ]
      }
    ]
  ]
},

Das Attribut detailViewWidthFactor steuert dabei, über wie viele Spalten sich die Darstellung erstreckt. text und textStyle definieren die Beschriftung.

Die Darstellung sollte dann etwa so aussehen:
Bildschirmfoto vom 2023-05-19 16-23-21.png

Viele Grüße
Benedikt

mplan

Hallo Benedikt,
vielen Dank für den Hinweis! 

Das hatte ich hier völlig verdrängt, dass es ja auch noch dynamic-field-value gibt.
Damit funktioniert es wie gewünscht!
Ich war zu sehr mit der Tabelle als solches "beschäftigt", dass ich den Typ der Komponente nicht mehr beachtet habe. 😫 

Viele Grüße
Michael