Nuoremman poikamme luokka on viime jouluina myynyt joulukuusia. Olen ollut mukana organisoimassa tilauksia, sekä toimittamassa kuusia asiakkaille. Tilaukset olemme keränneet jaettuun Google Sheet:iin ja toimitukset on vedetty läpi kännykän kartta-sovelluksella, kynällä ja paperilla.

Viritetään toimintaa hieman ja tehdään seuraava sesonkia varten seuraavanlainen ratkaisu.

  • Tilaukset kerätään Google Sheet:iin (valmis toimintamalli olemassa, ei järkeä muuttaa)
  • Toimituksia varten tehdään Power Apps, jossa
    • näytetään kartalla osoitteet, joihin ei ole kuusta vieälä toimitettu
    • mikäli toimitukseen liittyy kommentti (esim. ollaan kotona ainoastaan tiettyyn aikaan), näkyy se ko toimitus korostettuna
    • voi katsoa tilaajan tiedot (nimi, tarkka osoite, puhelinnumero)
    • tilaaja kuittaa kuusen toimitetuksi (allekirjoitetaan kynällä kännykän näytölle)
  • Asiakkaalle toimitetaan samantien toimituksesta kuitti hänen ilmoittamaansa sähköpostiosoitteeseen

Tekemistä vaille valmis!

Tietojen tallennuspaikka – Google Sheet

Aiemmista esimerkeistä poiketen tietojen (eli kuusitilausten) tallennuspaikkana toimii Googlen palvelu. Kustakin tilauksesta tallennetaan

  • Id
  • Myyjä
  • Tilaaja
  • Tilaajan sähköposti
  • Tilaajan puhelinnumero
  • Kuusen toimitusosoite
  • Toimitukseen liittyvät lisätiedot
  • Onko kuusi toimitettu
  • Onko kuusi maksettu

Power Appsia varten tulee taulukkoon lisätä oma sarake (__PowerAppsId__).

joulukuusitilaukset google sheet

Kukin myyjä täydentää tilauslistaa sitä mukaa kun myy kuusia.

Power Apps – Toimituslista

Seuraavaksi se varsinainen pihvi. Mobiilisovellus kuusien jakelijalle.

Luodaan tyhjä Power Apps ja lisätään siihen galleria-kontrolli. Lisätään gallerian tietolähteeksi Google Sheets.

joulukuusi galleria

Luodaan yhteys Google Sheets:in (Google-tunnuksella) ja valitaan haluttu tietojoukko (dataset, eli se Google Sheet -tiedosto).

joulukuusi galleria 2

Tuttuun tapaan valitaan lopuksi oikea taulukko (table, eli Google Sheet:in välilehti).

joulukuusi galleria 3

Gallerian kentiksi lisätään

  • Tilauksen ID
  • Tilaajan puhelinnumero ja nimi
  • Toimitusosoite
  • Ikoni, joka kertoo onko rivillä toimitukseen liittyviä lisätietoja
  • Ikonit puhelinnumerolle ja kotiosoitteelle

Siistitään galleriaa hieman ja lisätään näytölle otsikko.

joulukuusi galleria 4

Näin meillä on toimituslista valmiina. Seuraavaksi toimitukset pitäisi esittää kartalla.

Power Apps – Osoitteet kartalla

Lisätään näytölle kartta-kontrolli (map, private preview).

joulukuusi kartta 1

Haluamme näytettää kartalla ainoastaan toimittamattomat tilaukset. Esitettävät pisteet määritellään kartan ItemsItems-ominaisuudella, joka saa arvokseen tilaukset joiden toimitettu-kentän arvo = Ei.

ItemsItems: Filter(Sheet1, Toimitettu = "Ei")

joulukuusi kartta 2

Pisteet eivät näy kartalla, sillä emme ole määritelleet, mikä taulukon sarake sisältää varsinaisen sijaintitiedon.

Pisteiden sijainnit voivat olla

  • koordinaatteina (ItemsLatitudes ja ItemsLongitudes) tai
  • osoitteina (ItemsAddress)

Taulukkomme sisältää toimitusosoitteet eli käytämme kartan ItemsAddress-ominaisuutta. Se saa arvokseen taulukon Address-kentän.

Ja näin pisteet ilmestyvät kartalle!

joulukuusi kartta 3

Määritellään lopuksi karttapisteiden kohdalla esitettävä otsikko (ItemsLabels). Käytetään tilaajan nimeä.

ItemsLabels = Sheet1.Tilaaja

joulukuusi kartta 4

Lisätään näytön yläreunaan vielä on/off valinta, jolla voi vaihtaa kartta- ja sateliittinäkymien välillä.

Vaihdetaan kartan SatelliteView-ominaisuuden arvoksi näytön yläreunaan lisätyn Toggle-kontrollin arvo.

joulukuusi kartta 5

Power Apps – Toimituksen kuittaus

Luodaan seuraavaksi uusi näyttö, jolla voi tarkastella valitun toimituksen tietoja. Näytöllä on

  • Lomake
    • jonka tietolähteenä on Sheet1 (käyttämämme taulukko Google Sheet:ssä)
    • jossa esitetään pääsivun galleriasta valittu rivi
  • Otsikko
  • Paluulinkki
  • Kuittaa vastaanotetuksi-painike

Painiketta painettaessa päivitetään muuttujan varGetSignature arvoksi true.

joulukuusi lisätiedot 2

Lisätään näytölle vielä

  • kontrolli, johon tilaaja voi kuitata kuusen vastaanotetuksi kynää käyttäen (Pen input)
  • uusi painike (OK), jolla tehty kuittaus tallennetaan

Uudet kontrollit näkyvät ainoastaan kun varGetSignature-muuttujan arvo on true. Eli ne ilmestyvät näkyviin käyttäjän klikatessa ”Kuittaa vastaanotetuksi” -painiketta.

Visible: varGetSignature

joulukuusi lisätiedot 4

”OK” -painiketta painettaessa

  • Tallennetaan Patch-komennolla Google Sheet:iin tieto, että tilaus on toimitettu
  • Päivitetään varGetSignature-muuttujan arvoksi false
  • Palataan päänäytölle

joulukuusi lisätiedot 5

Allekirjoitus tulee siivota kontrollista pois käytön jälkeen. Tämä hoituu asettamalla Pen Input -kontrollin Reset-ominaisuuden arvoksi varGetSignature-muuttuja.

Power Automate – Kuitin toimittaminen asiakkaalle

Vastaanottajan allekirjoitus tulee tietenkin tallentaa jonnekin. Google Sheet:iin sitä ei kätevästi saa, joten tallennetaan se käyttäjän OneDrive:en sekä lähetetään kuittaus lopuksi vielä tilaajalle.

Toteutus on seuraavanlainen

  • Muodostetaan yksinkertainen html-muotoinen kuittausdokumentti (johon kuva on upotettu)
  • Tallennetaan dokumentti OneDrive:en
  • Muunnetaan tallennettu dokumentti PDF-muotoon
  • Lähetetään PDF-dokumentti asiakkaalle

Miksi tämä pitää tehdä näin monimutkaisesti?

Kuvien käsittely on Power Appsissa (kuten Power Automatessakin) edelleen hieman hankalaa.

Voisimme lähettää suoraan Power Appsista asiakkaalle html-muotoisen viestin, jossa allekirjoitus on upotettuna kuvana. Kaikissa tapauksissa kuva (allekirjoitus) ei kuitenkaan välity perille. Mikä tietenkin vesittää koko idean.

Tämän takia html-dokumentti pyöräytetään Power Automatella PDF-tiedostoksi, joka taas voidaan liittää sähköpostin liitteeksi ja se toimii aina.

Ja näin se tehdään.

Muodostetaan (Power Appsissa) kuittauksen tallennuksen yhteydessä html-muotoinen dokumentti, johon upotetaan kynällä tehty allekirjoitus.

Set(varHtmlEmail,
  "<!DOCTYPE html>
   <html>
    <head><title>Kuittaus - Joulukuusi 2020</title></head>
    <body>
     <h3>Kuittaus</h3>
     <p>Olen vastaanottanut tilaamani joulukuusen.</p><br />
     <img width=150px src=" & JSON(PenInput2.Image,
     JSONFormat.IncludeBinaryData) & "><br />
     Espoossa, " & 
     Text(Now(),DateTimeFormat.ShortDate,"fi-FI") & 
     "<br /> " & Gallery3.Selected.Tilaaja & "
    </body>
   </html>"
  );

joulukuusi kuitin lähetys 1

Siirrytään Power Automaten puolelle ja tehdään yksinkertainen Flow, joka tallentaa Power Appsista saamansa html-tiedoston OneDrive:en, muuntaa sen PDF:ksi ja lähettää sähköpostilla asiakkaalle.

joulukuusi kuitin lähetys 2

Yllä tekemämme Flow käynnistetään PowerAppsista käsin viimeisenä toimituksen kuittauksen vaiheena.

joulukuusi kuitin lähetys 3

Asiakkaan sähköpostissa kuitti näyttää tältä.

joulukuusi kuitti

Ja kaikki kuitit löytyvät OneDrivesta.

joulukuusi kuitti 2

Yhteenveto

Tämä oli (jälleen) hauska harjoitus. Vaikka aihe oli leikkimielinen voi Power Appsin kartta ja kynä -kontrollien avulla toteuttaa myös yritysmaailmassa mielenkiintoisia ratkaisuja.

Kartta-kontrolli oli tätä tehtäessä vielä private preview -vaiheessa (= kesken).

Oikeasti olisin halunnut toteuttaa sovelluksen näin.

Eli täysikokoinen kartta josta toimituspaikkaa klikkaamalla saa näkyviin kyseisen tilauksen tiedot. Tämä ei kuitenkaan ollut (vielä) mahdollista. Kartasta ei voinut valita kohteita. Tämä on kuitenkin tulossa.

Toinen puute liittyi kartalla näkyvien kohteiden visualisointiin. Olisin halunnut näyttää karttalla eri värillä toimitusosoitteet, joihin on liitetty toimitukseen liittyvä lisätieto. Tämäkään ei ollut tekohetkellä mahdollista.