Microsoft investiert aktuell stark in die Power Plattform, welche die Tools PowerApps, Flow und Power BI umfasst. Eines der Ziele der Power Plattform ist, dass auch nicht IT Spezialisten – also Business User – schnell und einfach Applikationen bzw. Apps erstellen können. Microsoft formuliert dies so:
Give everyone the ability to build business solutions
Because Power BI, PowerApps, and Microsoft Flow are designed to work together, everyone across your business can quickly and easily build custom apps, automate workflows to improve business productivity, and analyze data for insights—no matter their technical expertise
In diesem Blog Beitrag möchte ich meine eigenen Erfahrungen teilen, die ich beim Erstellen einer realen Spesenerfassungs-App gemacht habe, welche über das übliche «HelloWorld» Beispiel herausgeht.
Anwendungsfall Spesenerfassung mit PowerApps, Flow und AI
Die App soll mir helfen, meine gesammelten Spesenquittungen schnell und einfach zu digitalisieren und abzulegen. Zusätzlich möchte ich APIs verwenden, die mir helfen, Informationen von den Spesenquittungen (Betrag etc.) direkt in strukturierte Daten umzuwandeln, um mein Aufwand bei der Erfassung von Spesen zu minimieren.
Weiter soll für die monatliche Abrechnung für die Buchhaltung ein Excel Report mit den Quittungen erstellt werden können. Pro Spesenreport soll dann jeweils ein Freigabeprozess gestartet werden, bei dem eine verantwortliche Person die Spesenabrechnung prüfen und freigeben kann. Das Ganze soll natürlich auch unterwegs auf einem Mobiltelefon funktionieren.
Umsetzung mit SharePoint, PowerApps, Flow und AI
Speichern möchte ich jede Spesenausgabe mit den dazugehörigen Daten in einer SharePoint Online Liste, das Bild der Quittung soll dabei als Anhang des Listenelements abgelegt werden.
Periodisch sollen die einzelnen Quittungen zu einem Excel Report zusammengefasst werden, und dieser wiederum in einer SharePoint Bibliothek abgelegt werden. Zusätzlich zum Excel Report sollen alle Quittungen eines Reports in Form von Bildern in einer HTML Datei zusammengefasst abgelegt werden.
SharePoint Online Liste
Zuerst wird die SharePoint Liste für die Quittungen erstellt. Folgende Felder werden erstellt:
PowerApps
Mit dieser SharePoint Liste als Ausgangslage lasse ich mir eine PowerApps App direkt aus der SharePoint Listenansicht erstellen:
PowerApps wird gestartet und anhand meiner Liste wird eine App mit einer Übersichtsseite, einer Detailseite und einer Bearbeitungsseite erstellt. Ohne gross etwas zu tun habe ich nun eine App, die mir erlaubt Elemente in der SharePoint Liste anzuzeigen, zu suchen, zu erstellen und zu bearbeiten.
Die automatisch erstellten Ansichten beinhalten einfach alle Felder meiner Liste. Ich kann hier einzelne Felder aus dem Formular löschen, neu anordnen oder z.B. Textfelder mehrzeilig konfigurieren, so wie es für meine Anwendung passt. Ich entferne das Status Feld und mache das Kommentar Textfeld mehrzeilig auf dem Edit Screen:
Als nächstes soll es möglich sein, mit der Smartphone Kamera einen Spesenbeleg zu fotografieren und als Anhang an das List Item anzuhängen. Diese Funktion wird standardmässig angeboten mit dem Attachment Control. Beim Hinzufügen eines Attachements werde ich vom Smartphone gefragt, ob ich ein Bild aufnehmen will, oder mein Dateisystem durchsuchen will.
Um das gemachte Bild gleich anzuzeigen füge ich dem Formular eine weitere DataCard hinzu und darin ein Bild Control. Um nun das erste Attachement als Bild anzuzeigen ist folgendes nötig:
Das Image Control hat eine Eigenschaft «Image», diese wird auf den ersten Wert meines Attachment Controls gesetzt, mit folgender Formel:
Da das Attachment Control mehrere Elemente besitzen kann verwende ich den „First“ Operator, welcher das erste Element eines Arrays zurückgibt und davon die Eigenschaft „Value“ gibt den Inhalt des Attachements zurück. Nun gut, das ist sehr optimistisch, da Attachments nicht nur Bilder sein können, sondern beliebige Dateien, aber gehen wir mal davon aus, dass wir ein Bild angehängt haben.
Die Bezeichner der Controls werden sequenziell vergeben, wenn man sich die Mühe nicht machen will alle umzubenennen, kann man die Namen leicht in der Strukturansicht links herauslesen:
TAGGUN API – Machine Learning (image-to-text OCR)
Als nächstes möchte ich das gemachte Bild nicht nur als Attachment speichern, sondern daraus die relevanten Speseninformationen (Betrag etc.) extrahieren. Dazu soll das Bild an ein API gesendet werden, welches mit Hilfe von Machine Learning (image-to-text OCR) die relevanten Informationen erkennt und strukturiert zurückgibt.
Nach etwas Internet Suche habe ich den Service TAGGUN gefunden https://www.taggun.io/
TAGGUN verspricht via API relevante Informationen in Spesenquittungen zu finden und als JSON zurückzugeben. Ich habe zunächst die online Demo Version getestet und ja, es funktioniert in den meisten Fällen ganz gut. Danach habe ich einen Demo Account erstellt und versucht die Funktion in die PowerApp zu integrieren.
Da PowerApps keinen eigenen Connector zum API von TAGGUN bietet, muss ein eigener Connector erstellen werden. Dazu wird eine API Definition, wie z.B. Swagger oder Postman Collection benötigt. Ich habe dazu bei TAGGUN eine Postman Collection erhalten, um das API zu testen. Daraus kann dann eine Swagger Definition abgeleitet werden.
Das API bietet zwei Möglichkeiten, das Bild zu übermitteln und zu analysieren:
POST Request mit den Bilddaten als Base64 codierten String.
POST Request mit multipart/form-data und binären Bilddaten im Body.
Da wir aus dem Image Control in PowerApps das fotografierte Bild nicht als Base64 erhalten, bleibt nur die zweite Variante der API für die Verwendung übrig. Wichtig hier war im API Swagger File den Datentypen der Datei korrekt auf den Wert „file“ zu setzen, damit dann auch ein binary stream verwendet wird. Zur Sicherheit verwendet das API einen API Key, welcher auch für die Abrechnung verwendet wird. Dieser Key wird nicht in die benutzerdefinierte Connection hinterlegt, sondern muss eingegeben werden, wenn der Connector in einem Flow oder einer PowerApp verwendet wird. Zusätzlich kann in der Connection auch bereits angegeben werden, wie das JSON der Antwort aussieht, dadurch kann später bei der Verwendung in PowerApps direkt auf die Werte der Antwort zugergriffen werden.
Ein kurzer Test des API in Postman zeigt die JSON Struktur der Antwort:
Mit dem Wert „totalAmount.data“ erhalten wir also den Betrag der Quittung und mit „merchantName.data“ auch noch den Aussteller der Quittung. Diese beiden Werte wollen wir für „Amount“ und „Comments“ in unserer SharePoint Liste verwenden.
Dazu muss zuerst die neu erstelle Connection in die App eingefügt werden:
Um die Connection zu verwenden wird ein Button auf das Formular neben dem Bild Control platziert:
Der OnSelect Eigenschaft des Button wird folgende Formel hinterlegt:
Damit wird beim Klicken der Buttons der Variabel „analyzeResult“ den Rückgabewert des API Aufrufs zugewiesen. Der Aufruf selbst verwendet den Connection Name „taggun.io“ und die API Methode „ReceiptV1SimpleFilePost“ aus der API Definition. Als Parameter wird das erste Element aus der Attachment Collection übergeben.
Um das Resultat nun noch anzuzeigen, wird in der Textbox für das Total der Eigenschaft „Default“ folgende Formel eingetragen, was bewirkt, dass der Wert des Feldes „totalAmount“ aus der JSON Antwort zugewiesen wird.
Analog dazu können nun weitere Werte aus der Antwort weiteren Feldern zugewiesen werden. Wenn das Item in der App nun gespeichert wird, werden diese Werte in der SharePoint Liste gespeichert. Somit ist der Erste Teil der Umsetzung erledigt und wir haben bereits eine halbautomatische Spesenerfassung.
Fortsetzung folgt…
Im nächsten Blogbeitrag „Spesenerfassung mit PowerApps, Flow und AI – Teil 2“ wollen wir uns damit beschäftigen, wie die einzeln erfassten Spesen nun in einem Excel Report zusammengefasst werden können. Dazu wird ein Flow erstellt, welcher aus der PowerApp angestossen wird, und anhand eines Excel Templates einen Spesenreport für die Buchhaltung erstellt. Mehr dazu demnächst in diesem Blog.
Wollen auch Sie mit den Möglichkeiten der Microsoft Power Plattform auf dem Laufenden bleiben? Haben Sie konkrete Fragestellungen oder Projekte? Kontaktieren Sie uns. Unsere Experten helfen Ihnen gerne weiter.