agorum.composite.form.element.splitGrid

Dieses Element stellt Positionen (Zeilen) in Listenform dar und erlaubt das Aufsplitten der Postionen, etwa für die Zuweisung von verschiedenen Kostenstelle bei der Kontierung.

Sie legen beim Erstellen einer splitGrid-Oberfläche fest, welche Spalten (Felder) in der Oberfläche angezeigt werden und welche dieser Felder aufgesplittet werden. Dabei gibt es zwei Möglichkeiten, abhängig vom Typ des aufgesplitteten Felds:

• Zahlenbeträge können so aufgesplittet werden, dass sich die Gesamtsumme aus den aufgesplitteten Beträgen ergibt
• Textfelder können so aufgesplittet werden, dass die Beschreibung für jede aufgesplittete Zeile durch den Benutzer angepasst werden kann, etwa zum Eintragen unterschiedlicher Kostenstellen. Dabei kann der Wert der Ursprungsposition optional übernommen werden, wenn häufig keine Anpassung erforderlich ist.

agorum.composite.form.element.splitGrid erbt alle grundlegenden Eigenschaften von element.

Unterschiede zwischen splitList und splitGrid

Die beiden Möglichkeiten zur Oberflächengestaltung, agorum.composite.form.element.splitGrid und agorum.composite.form.element.splitList, unterscheiden sich darin, wie Benutzer die Informationen anzeigen lassen und bearbeiten können. 

Beispiel einer Oberfläche

Beispiel einer Oberfläche

Skript zur Oberfläche

let aguila = require('common/aguila');

let form = aguila.create({
  type: 'agorum.composite.form.basic',
  name: 'form',
  labelPosition: 'top',
  elements: [
    {
      type: 'agorum.composite.form.element.splitGrid',
      name: 'splitGrid',
      disableSplit: false,
      showRowDelete: true,
      showAppend: true,
      copyDiffValues: false,
      template: [
        // Es muss mindestens ein festes Feld geben, das pro Position eindeutig ist, etwa eine Positionsnummer.
        {
          type: 'agorum.composite.form.element.text',
          label: 'Nummer',
          name: 'number',
          readOnly: true,
        },
        {
          type: 'agorum.composite.form.element.text',
          label: 'Beschreibung',
          name: 'description',
          readOnly: true,
        },
        {
          type: 'agorum.composite.form.element.number',
          label: 'Menge',
          name: 'quantity',
          // Der Wert dieser Spalte ergibt sich aus allen Summen der aufgesplitteten Werte dieser Spalte.
          split: 'sum',
        },
        {
          type: 'agorum.composite.form.element.number',
          label: 'Einzelpreis',
          name: 'net_price',
          readOnly: true,
        },
        {
          type: 'agorum.composite.form.element.number',
          label: 'Gesamtpreis',
          name: 'net_amount',
          readOnly: true,
          // Der Wert dieser Spalte ergibt sich aus allen Summen der aufgesplitteten Werte dieser Spalte.
          split: 'sum',
        },
        {
          type: 'agorum.composite.form.element.text',
          label: 'Kostenstelle',
          name: 'cost_center',
          // Der Wert dieser Spalte soll pro aufgesplitteter Position unterschiedlich sein.
          split: 'diff',
          validation: [
            {
              required: true,
            },
          ],
        },
      ],
    },
  ],
});

// Konsole vom Browser aufrufen, um Werte zu sehen
form.on('valueChanged', value => {
  console.log('values', value);
});

// Manuelle Erstellung von Testdaten
// Wichtig ist, dass die Bezeichnungen wie number / description dem name der splitGrid-Elementen entspricht.
// Dadurch können die Werte den entsprechenden Spalten zugeordnet werden.
// Die Namensgebung ist frei und kann beliebig angepasst werden.
setImmediate(() => {
  form.set('splitGrid.value', [
    {
      number: '01',
      description: 'Position 1',
      quantity: 10,
      net_price: 100,
      net_amount: 1000,
    },
    {
      number: '02',
      description: 'Position 2',
      quantity: 20,
      net_price: 50,
      net_amount: 1000,
    },
  ]);
});

form;

splitGrid Parameter

Zusätzlich zu den Parametern von element können Sie folgende Parameter verwenden:

Parameter	Beschreibung	Mögliche Werte
copyDiffValues	Steuert das Verhalten beim Aufsplitten von Positionen für Spalten, für die der split Parameter mit dem Wert diff gesetzt ist. Dient dazu, den Wert der Spalte, für die diff gesetzt ist, beim Aufsplitten in alle aufgeteilten Zeilen zu übernehmen.	Boolescher Wert, Standardwert: false
disableSplit	Blendet die Schaltfläche zum Splitten aus.	Boolescher Wert, Standardwert: false
label	Angezeigter Name (Label) der Grid-Liste. Optional.	Zeichenkette
readOnly	Dient zur Anzeige der Split-Liste im Lesemodus, wodurch das Aufsplitten der Positionen verhindert wird.	Boolescher Wert, Standardwert: false
showAppend	Blendet das Symbol + zum Hinzufügen von Zeilen in der Listenansicht und im Header der jeweiligen Position ein.	Boolescher Wert, Standardwert: false
showRowDelete	Blendet das Symbol Zeile löschen in der Detailansicht ein, wodurch Benutzer komplette Positionen oder Aufteilungen löschen können.	Boolescher Wert, Standardwert: false
template	Definiert die Spalten einer Zeile. Darin enthalten sind form-Elemente oder aguila-Widgets.	Siehe template Parameter

Parameter von form-Elementen in template

validation: [
  {
    required: true
  }
]

splitGrid Events

Alle Events in element gelten.