Tuntikirjaustyökalun toteuttaminen PowerAppsilla

Alallamme tuntien kirjaaminen on itsestään selvää. Tuntikirjaukset ovat keskeinen osa laskutusta ja kaikissa työpaikoissani tähän on käytetty tarkoitukseen suunniteltua työkalua. Yleensä ulkoa / palveluna hankittua.

Kaikkialla tilanne ei ole tämä vaan tunteja kirjaa organisaatiossa vain pieni osa työntekijöistä. Saankin usein kyselyjä kevyen tuntikirjaustyökalun toteuttamisesta.

Tällä kertaa rakennetaan sellainen. PowerAppsilla tietenkin.

Tietojen tallennus – CDS for Apps

Halaumme kohdistaa tuntikirjaukset projekteihin liittyviin tehtäviin. Tarvitsemme tällöin seuraavat tiedot.

• Työkohteet (Projects)
  • Työkohteen nimi
  • Projektipäällikkö
• Työkohteiden tehtävät (ProjectTask)
  • Tehtävän nimi
  • Tehtävän tuntihinta
  • Työkohde, johon tehtävä liittyy
• Tuntikirjaukset (ProjectHour)
  • Päivä
  • Tuntimäärä
  • Kirjauksen selite
  • Työkohde, johon kirjaus liittyy
  • Työkohteen tehtävä, johon kirjaus liittyy

Mihin tiedot tallennetaan? Common Data Service for Apps on edelleen monille täysin tuntematon vaihtoehto. Mutta se on aivan huippu! Kaiken lisäksi Microsoft kehittää sitä hirveää vauhtia. Tallennetaan tiedot sinne.

CDS for Appsiin tehty tietomalli koostuu entiteeteistä. Voit ajatella entiteettejä vaikka SharePoint-listoina. Oikeasti ne ovat lähempänä tietokantatauluja. Todella yksinkertaisella hallintakäyttöliittymällä varustettuna.

Siirrytään osoitteeseen https://make.powerapps.com ja aletaan töihin.

Uusien entiteettien ja niiden sisältämien kenttien luominen on nopeaa. Kenttätyypeistä löytyy kaikki tarvittava. Pian onkin valmista.

Projektit

Projektien tehtävät

Projekti-kenttä viittaa (LookUp) projektiin.

Projektien tuntikirjaukset

Projekti-kenttä viittaa jälleen projektiin. Task-kenttä taas viittaa projektin tehtävään.

Yksi CDS:n mainio ominaisuus ovat entiteettien väliset suhteet (relaatiot). Kuvasta näet miten projektin tunnit -entiteetti liittyy sekä projekteihin, että projektin tehtäviin.

Tuntikirjaus PowerApp

Tuntikirjaussovelluksesta tulee suurin piirtein seuraavanlainen.

• Näytön yläosassa näytetään kuluvan viikon viikonpäivät
• Kunkin päivän kohdalla näytetään kyseiselle päivälle kirjattujen tuntien summa
• Valitun päivän kirjaukset näkyvät listana
• Viikkoja voi selailla eteen ja taakse

Luodaan tyhjä PowerApps puhelin-layoutilla.

Viikkokalenteri

Tehdään viikonpäivistä kokoelma (colWeek), joka sisältää

• Viikonpäivän numeron (maanantai = 0, tiistai = 1 jne) (weekDayId)
• Viikonpäivän lyhenteen (day)

Lisätään näytölle vaakasuuntainen galleria.

Galleriassa esitetään kokoelman (colWeek) sisältö. Lisätään galleriaan kentäksi viikonpäivän lyhenne.

Seuraavaksi päivämääräjumppaa. Selvitetään sovelluksen käynnistyessä kuluvan viikon viikkonumero. Tallennetaan se omaan muuttujaan (varCurrentWeekNumber).

Tallennetaan toiseen muuttujaan (varFirstDayOfWeek) kuluvan viikon ensimmäinen päivä.

Set(varFirstDayOfWeek;
    Today() - Weekday(Today();StartOfWeek.Monday) + 1
   )

Nyt voimme laskea kunkin viikonpäivän päivämäärän aina kaavalla

varFirstDayOfWeek + ThisItem.weekDayId

Viikkojen välillä navigoiminen

Lisätään näytölle otsikkopalkki, johon lisätään seuraavat elementit

• Viikkonumeron kertova otsikko
• Ikonit, joilla siirrytään edelliselle / seuraavalle viikolle

Seuraavalle viikolle siirryttäessä (= ikonia painettaessa)

• kasvatetaan viikkonumeroa yhdellä
• kasvatetaan viikon ensimmäistä päivää seitsemällä (päivällä)

Edelliselle viikolle siirtyminen tapahtuu luonollisesti päinvastoin.

Voimme liikkua viikolta toiselle, valita vapaasti kalenterista viikonpäivän. Ja aina laskea kyseisen päivän päivämäärän.

Valitun ja kuluvan päivän korostaminen

Mikäli joku viikonpäivistä on kuluva päivä, korostetaan se vihreällä värillä.

Valittu päivä taas korostetaan vihreällä ympyrällä. Lisätään galleriaan sellainen.

Ympyrä on näkyvillä ainoastaan, mikäli päivä on valittuna.

Visible : ThisItem.IsSelected

Asetetaan ympyrä sopivalle kohtaa, sekä vaihdetaan viikonpäivän lyhenne valkoiseksi, mikäli päivä on valittu.

Lopputulos näyttää tältä.

Tuntien syöttölomake

Luodaan toinen näyttö, jolle lisätään lomake.

Lomakkeen tietolähteeksi (data source) valitaan Common Data Service.

Poimitaan käytettäväksi entiteetiksi projektin tuntikirjaukset (ProjectHours).

Lisätään halutut kentät lomakkeelle ja poistetaan kaikki turhat.

Projekti-kenttä on samantien virheessä. Ei lupaa hyvää.

Pieniä lastentauteja vielä… Projektit-alasvetovalikon sisältö (Items) on

Items: Choices(ProjectHours.crd01_Project)

Vaihdetaan sen tilalle

Items: Choices(ProjectHours.Project)

Ja taas mennään. Nyt lomakkeella voi valita projektin, johon kirjaukset liittyvät.

Mutta miten saisimme valitun projektin tehtävät (tasks) näkymään omassa alasvetovalikossaan?

SharePoint-listalla tai SQL-kannalla se tehtäisiin näin.

Mutta CDS on fiksumpi. Laitetaan seuraava (preview) ominaisuus päälle.

Tämän jälkeen tehtävät sisältävän alasvetovalikon sisältö voidaan määritellä seuraavasti.

Eli näytämme valittuun projektiin liittyvät tehtävät.  Siistiä!

Lomakkeen viimeistely

Tehdään lopuille kentille seuraavat toimenpiteet.

Otsikoksi (name) tallennetaan aina käyttäjän sähköposti ja kuluva hetki.

User().Email & " " & Now()

Päivän (workDay) oletusarvona on

• olemassa olevaa muokatessa aiemmin tallennettu arvo
• uutta lisätessä aloitusnäytön kalenterista valittua päivää vastaava päivämäärä

Default: If(Form1.Mode = FormMode.Edit; 
            Parent.Default;
            varFirstDayOfWeek + galWeekDays.Selected.weekDayId)

Kirjauspäivästä tallennetaan ainoastaan päiväys (oletuksena tallennetaan myös valittu kellonaika).

Lopuksi käyttäjältä piilotetaan seuraavat kentät

• otsikko
• päivään liittyvät tunti- ja minuuttikentät

Siistitään kenttien ulkoasua ja lisätään sivulle otsikko, sekä peru- ja tallenna-painikkeet.

Aloitusnäytön tuntilista

Valitun päivän kirjaukset halutaan näyttää aloitussivulla. Lisätään toinen galleria, jonka tietolähteenä on kirjatut tunnit (projectHours). Riveillä näytetään

• Projekti
• Projektin tehtävä
• Kirjauskommentti
• Tuntimäärä

Galleriassa näytetään käyttäjän tunnit valitulta päivältä. Delegoitavuuden vuoksi  käyttäjän sähköposti tulee tallentaa muuttujaan sovelluksen käynnistyessä (App OnStart).

Set(varCurrentUserEmail;User().Email)

Nyt voimme tehdä halutun rajauksen.

Items = Filter(ProjectHours;WorkDay = 
              (varFirstDayOfWeek + galWeekDays.Selected.weekDayId)
              And 
              'Created By'.'Primary Email' = varCurrentUserEmail)

Riviä painamalla siirrytään muokkaamaan kyseistä kirjausta.

Jotta muokkaus toimii, tulee lomakkeella määritellä mitä riviä muokkaustilassa muokataan.

Eli galleriasta valittua riviä.

Päivän kirjausten summa

Lisätään viikkokalenteriin kenttä, jossa esitetään viikonpäivän tuntikirjausten kokonaissumma.

Vielä kun piilotetaan otsikot, joissa ei ole ollenkaan tunteja (Visible: lblDayHours.Text = ”h”), näyttää lopputulos tältä.

Uuden kirjauksen tekemiseksi tarvitaan painike. Muotoillaan se ympyräksi.

Loppusilauksena lisätään näytölle kannustava kuva ja teksti, jotka näkyvät ainoastaan mikäli päivälle ei ole tehty yhtään kirjausta.

Valmista!

Ongelmia…

Kaikki on mennyt tähän asti kuin tanssi (melkein, ihan kaikkea en ole kertonut). Mutta kun avaan sovelluksen puhelimella, ilmestyy näyttöön virhe.

Sovellus yrittää hakea CDS for Appsista tietoja, ennen kuin App OnStart:ssa alustetut muuttujat (varFirstDayOfWeek ja varCurrentUserEmail) ovat saaneet arvot.

Olen törmännyt tähän ongelmaan ennenkin. Jostain syystä aina CDS:n kanssa.

Onneksi PowerAppsin asetuksista löytyy lisäasetus (”Käytä OnStart sääntöä, joka ei estä”). Ongelma katoaa kytkemällä tämän asetuksen pois päältä.

Tai niin sitä luulisi.

Päädyin lopulta vähemmän tyylikkääseen ratkaisuun, jossa gallerioiden sisältöjä ei täytetä ollenkaan, mikäli tarvittavissa muuttujissa ei ole (vielä) arvoja.

Kaikesta huolimatta sovellus toimii mukavasti ja sen tekeminen oli mukavaa, nopeaa ja helppoa.

Kuten PowerAppsit aina.