[#206]Kalkulation: Überarbeitung Rabattrechner / UI

Ausgangslage

Bei der Rabatteingabe von nicht öffentlichen Rabatttypen ist die Ansicht nicht optimal nutzbar.

Je nach iPad Größe werden nur die ersten drei Rabatte angezeigt und können eingetragen werden. Die Tastatur nimmt hier fast die Hälfte der Ansicht ein. Somit sind auch nicht alle Rabatte direkt sichtbar (erst nachdem der Benutzer runter scrollt).

Ein schneller Löschvorgang von prozentualen Werten oder Beträgen ist nicht gegeben, da man erst das Textfeld auswählen muss und dann das X-Icon zum löschen anklicken muss. Zwischen den Rabatten kann nicht "schnell gewechselt" werden.

Abbildung 1: Rabatteingabe vorher


Anforderungen

Die Ansicht der Rabatteingabe soll überarbeitet werden, sodass die Eingabe schneller und schöner erfolgen kann.


Lösungsansatz

Die komplette Ansicht des Rabattrechners (Eintragung von öffentlichen und nicht öffentlichen Rabatten, Zusatzkosten) wird überarbeitet.

Das betrifft die Übersichtlichkeit & auch die Eingabe von prozentualen Werten oder Beträgen, sodass eine "smarte" Eingabe ermöglicht ist.

Dabei werden die Rabatte in einem großen modalen Fenster nebeneinander und somit viel kompakter angezeigt.

Ebenso kommen Funktionen zur schnellen Eingabe hinzu.

Abbildung 2: Mockup Rabatteingabe


Umsetzung

Der komplette Rabattrechner wurde in der Ansicht überarbeitet.

  • Die Rabatte und Zusatzkosten erscheinen in einem großen modalen Fenster. Die Rabattliste erscheint nun nebeneinander (Titel | Prozentwert | Absolutwert).
  • Ein Switch für Prozentwert oder Absolutwert wurde implementiert. Dieser wechselt, je nachdem welchen Wert der Benutzer einträgt.
  • "Smarte Funktionen" kamen hinzu:
    • Tastatureingaben:
      • Durch "Enter" wird die Eingabe übernommen,
      • Wechsel zwischen den verschiedenen Eingabefeldern mittels Tabulator Taste,
    • Beim Klick auf ein Inputfeld:
      • Wird die aktuelle Eingabe durch einen anderen Hintergrund hervorgehoben,
      • Springt die Eingabe direkt vor das Komma,
      • Wird der Tausendertrenner während der Bearbeitung entfernt und bei Abschluss der Bearbeitung in das Inputfeld wieder hinzugefügt. Damit kann während der Eingabe der Wert korrekt geparsed werden kann,
  • Beim Klick auf "X" werden die Werte direkt gelöscht.
  • Ein Kalender-Icon kennzeichnet eine erforderliche Datumseingabe.
  • Bei Nutzung der iPad Tastatur werden nun auch mehrere Rabatte angezeigt.

Abbildung 3: Rabatteingabe Screenshot

Abbildung 4: Rabatteingabe Screenshot

Abbildung 5: Rabatteingabe Screenshot


Die Eintragung von Zusatzkosten erfolgt ebenfalls in einem großen modalen Fenster.

  • Die hinterlegten Zusatzkosten erscheinen untereinander und können ausgewählt werden,
  • Bei freier Eintragung eines Betrages stehen dem Benutzer ebenfalls die "Smarten Funktionen" zur Verfügung.

Abbildung 6: Rabatteingabe Screenshot


Details zum Ticket

Erstellt am:20. Februar 2020
Veröffentlicht am:05. März 2020
Festgestellt in Version:6.4.792
Behoben in Version:6.4.795
Bereiche:SalesApp
Umgesetzt bei:Grimme, Lemken, Strautmann, Amazone, Krone, Schaeffer, Bergmann, Eisele

Zum Handbuch