PowerApps – Miten yhdistän parhaat ominaisuudet SQL-kannasta ja SharePointista

Käsittelin aiemmin kevyesti, millaisia eroja eri tietovarastoilla on PowerApps-tekemisen näkökulmasta. Esimerkiksi

• SharePoint on näppärä kun tallennetaan liitetiedostoja
• SQL-kanta loistaa isoilla rivimäärillä ja vapaasanahaulla

Entä jos haluan poimia rusinat pullasta?

Haluan tehdä sovelluksen, jossa vapaasanahaku toimii vaikka rivejä on todella paljon. Mutta samalla haluan liittää riveihin helposti useita liitetiedostoja.

PowerAppsin mainio liitetiedosto-kontrolli (attachments) ei (vielä) toimi SQL-kannan tai blob-storagen kanssa. CDS for Appsin kanssa toimii, mutta ne lisenssikulut… Haluan kuitenkin ehdottomasti käyttää liitetiedosto-kontrollia. Sen avulla käyttäjä voi puhelimellaan lisätä liitteeksi joko aiemmin ottamansa kuvan tai halutessaan ottaa uuden.

Herää aiheellinen kysymys. Voiko PowerAppsin rakentaa siten, että rivitiedot tallennetaan SQL-kantaan, mutta niihin liittyvät liitetiedostot SharePointiin? Mitä ongelmia tästä mahdollisesti seuraa?

Tätä täytyy tietenkin kokeilla.

Esimerkki – Havaintosovellus

Tehdään superyksinkertainen havaintojen keräyssovellus.

SQL-tietokanta

Aloitetaan luomalla Azureen tietokanta ja siihen yksi taulu (Notes). Taululla on seuraavat sarakkeet

• Id
• havainnon kuvaus (Description)
• luontipäivä (Created)
• luoja (CreatedBy)
• muokkauspäivä (Modified)
• muokkaaja (ModifiedBy)
• havaintoluokka (Category)
• tila (Status)
• liittyykö havaintoon liitetiedosto (isAttachmentAttached)

SharePoint-lista

Liitetiedostoja varten luodaan SharePointiin lista. Sen sarakkeet ovat

• havainnon kuvaus (Title)
• havainnon id (NoteId)

Tallennuspaikat ovat valmiit. Seuraavaksi PowerAppsin kimppuun.

PowerApps – Galleria

Otetaan pohjaksi tyhjä PowerApps (puhelinasettelu) ja lisätään oletusnäytölle galleria, jonka tietolähteeksi liitetään yllä luotu SQL-taulu. Taulussa ei ole ainuttakaan riviä, joten sovellus ei näytä vielä kovin vaikuttavalta.

PowerApps – Lomake

Seuraavaksi luodaan näyttö havaintolomakkeelle. Näytöltä tallennetaan tietoa kahteen eri tietovarastoon (SQL ja SharePoint). Tämä tarkoittaa käytännössä kahta erillistä lomaketta.

Tylsää. Miten ne saisi näyttämään yhdeltä lomakkeelta?

Mikäli lomakkeilla on vain muutama kenttä (= ne mahtuvat kerralla näytölle), ne voi aivan hyvin laittaa peräkäin.

Muussa tapauksessa peräkkäin asettelu ei toimi. Pahimmillaan päädytään tuplascrolliin, eikä lopputulos ole kovin ammattimaisen näköinen.

Normaalisti tässä kohtaa piilottaisin koko liitelomakkeen ja tekisin näkyvälle lomakkeelle piilotetun lomakkeen kenttiä vastaavat custom-kentät. Lopuksi päivitäisin piilotetun lomakkeen kenttien arvot vastaamaan custom-kenttien arvoja.

Mutta ei onnistu tämäkään.

Liitetiedostot- kontrolli toimii ainoastaan, kun se on SharePoint-listaan (tai CDS for Appsiin) liitetyn lomakkeen sisällä.

Ei luovuteta, vaan luodaan vieritettävä näyttö (Scrollable screen).

Vieritettävä näyttö koostuu pohjasta (Canvas), jonka sisällä on kortteja (Card). Lisätään ensimmäiselle korttille havaintolomake ja toiselle kortille liitetiedostolomake. Lopputulos näyttää yhdeltä lomakkeelta!

Havainnon lisääminen ja muokkaaminen

Toteutetaan seuraavaksi havainnon lisääminen ja muokkaaminen. Haluamme kokonaisuuden toimivan seuraavasti:

• Uutta havaintoa tallennettaessa / vanhaa muokatessa SharePointiin tallennetaan rivi ainoastaan, mikäli käyttäjä on lisännyt havaintoon myös liitteen
• Olemassa olevaa havaintoa muokatessa
  • Mikäli havaintoon on liitetty liite, avataan liitetiedosto-lomake edit-tilassa ja ladataan ko lomakkeelle havaintoon liitetyt liitteet
  • Mikäli havaintoon ei ole liitetty liitteitä, avataan liitetiedostot-lomake new-tilassa
  • Mikäli käyttäjä on muokkaamisen yhteydessä poistanut kaikki havaintoon liitetyt liitteet, poistetaan koko liitetiedostot-rivi SharePointista

Miten tämä kaikki toteutetaan?

Havainnon lisääminen

Lisätään päänäytölle painike, josta luodaan uusi havainto. Painiketta painettaessa  molemmat lomakkeet asetetaan New-tilaan.

Ainoa havainto-lomakkeelle tehtävä muutos liittyy kenttään, jossa ylläpidetään tietoa siitä onko havaintoon liitetty liitteitä (isAttachmentAttached). Kenttä saa arvokseen true, jos käyttäjä on lisännyt liitetiedostolomakkeelle liitteitä.

Seuraavaksi viritetään liitetiedostolomake.

Lomakkeen DefaultModen avulla kerrotaan, ollaanko lisäämässä uutta vai muokkaamassa vanhaa. Asetetaan DefaultMode:ksi Edit, mikäli havaintoon on liitetty liitetiedosto(ja). Muussa tapauksessa havaintoa vastaavaa liitetiedostoriviä ei löydy SharePointista ja avaamme lomakkeen New-tilassa.

Mikäli havainnolle on tallennettu liitteitä, ne haetaan lomakkeelle oletusarvoksi.

Jotta liitetiedostorivin (SharePoint) ja havaintorivin (SQL) välille syntyy relaatio, tulee liitetiedostorivin NoteId-kenttään tallentaa havainnon id. Uutta havaintoa luotaessa se poimitaan havaintolomakkeen LastSubmit-ominaisuudesta. Vanhaa muokatessa käytetään rivin alkuperäistä arvoa (Parent.Default).

Lopuksi lisätään painike tallentamista varten. Havainto tallennetaan aina. Liitetiedostot tallennetaan ainoastaan mikäli niitä on.

Mikäli käyttäjä on poistanut aiemmin tallentamansa liitteet (liitetiedostoja on nolla, vaikka liitetiedosto-lomake on edit-tilassa), poistetaan liitetiedostorivi havainnon tallennuksen yhteydessä kokonaan.

Ei aivan vielä kelpaa…

Havainnon tallennus SQL-kantaan on nopeaa. Liitetiedostojen lisääminen voi kuitenkin kestää huomattavan pitkään. Kännykällä otettuja kuvia ei lisäämisen yhteydessä pääse skaalaamaan pienemmäksi.

Liitetiedostojen tallennuksen alkaesssa liitetiedostolomake siirtyy new-tilaan.

Näyttää siltä kuin liitetiedostot vain katoaisivat!

Lienee parempi peittää koko lomake tallennuksen ajaksi, jottei käyttäjä hämmenny.  Näytetään samalla käyttäjälle, missä vaiheessa tallennus menee.

Muokataan Tallenna-painikkeen OnSelect-toimintoa seuraavasti

• asetetaan alussa muuttujan varSavingScreenVisible arvoksi true
• päivitetään muuttujan varSpinnerText arvoa aina sen mukaan, mikä toiminto on aloitettu
• lopuksi asetetaan muuttujan varSavingScreenVisible arvoksi false

Lisätään myös uusia kontrolleja

• valkoinen laatikko, joka toimii ”näytön” taustana
• tekstikenttä, jossa näytetään tallennuksen senhetkinen tila (varSpinnerText)
• animoitu gif, joka viestii käyttäjälle jotain tapahtuvan

Kaikkien kolmen elementin visible arvona toimii varSpinnerVisible -muuttuja.

Miltä se näyttää?

Valmiilla ratkaisulla havainnon lisääminen liitteinen näyttää tältä.

 

Ratkaisu toimii tehokkaalla puhelimella hienosti. Olemassaolevaa havaintoa avatessa liitteet ilmestyvät lomakkeelle pienellä viiveellä (tekstitiedot tulevat SQL-kannasta nopeammin kuin tieto liitetiedostoista SharePointista). Tätä voisi yrittää vielä siistiä.

Tai vain hyväksyä että euron sovellus ei ole niin täydellinen kuin tonnin sovellus.