Всем привет! В одной из прошлых статей я рассказывал, как мы автоматизировали один процесс адаптации сотрудников в компании с использованием платформы Microsoft 365, возможностей Microsoft Power Platform и технологии чат ботов. Сегодня я расскажу о реализации приложения — личного кабинета для системы адаптации персонала на базе Microsoft Power Apps и Power Automate. Посмотрим как можно организовать подобное приложение и какие возможности получится в него заложить в рамках общей системы адаптации персонала.
Итак, как мы помним из прошлой статьи, у нас с Вами есть сайт SharePoint Online со списками и библиотеками, для системы адаптации, форма на PowerApps, поток обработки данных на Power Automate и отчеты Power BI. Самое время добавить личный кабинет, в котором сотрудник и/или руководитель видели бы свои задачи на период адаптации и могли их выполнить, осуществив определенные действия.
![](https://habrastorage.org/webt/ct/g6/77/ctg677arzywfrhdg1jtwdsufaqu.jpeg)
Начинаем работу и в первую очередь переходим на страницу редактора Microsoft PowerApps и создаем новое приложение.
![](https://habrastorage.org/webt/h4/jf/if/h4jfifqbcw5io3hguly24buaimw.png)
Далее, внутри редактора создаем первый экран. Изначально планируем что в приложении будет возможность отображения разных вариантов личных кабинетов в зависимости от принадлежности пользователя к той или иной роли. Чуть позже мы адаптируем данный механизм и сделаем автоматическое определение роли пользователя при открытии приложения, но начнем с экрана авторизации.
![](https://habrastorage.org/webt/pe/2o/ud/pe2oudzoymia6qyipdq62ljehj0.png)
На данном экране располагаем две кнопки входа в личный кабинет. Одна ведет на личный кабинет сотрудника, вторая на личный кабинет руководителя. В зависимости от принадлежности пользователя к той или иной группе, кнопка «Войти как руководитель» может отображаться заблокированной, в случае если текущий пользователь не является руководителем. Далее делаем следующий экран. Это будет экран сотрудника, где будут отображаться основные данные о собственном профиле, а также перечень мероприятий, который необходимо пройти в период испытательного срока.
![](https://habrastorage.org/webt/lw/4k/2d/lw4k2dhz6_vfyyb0qyoyry-fsby.png)
Как можно заметить, визуально данный экран разбит на две основные области: верхняя область с основными сведениями о себе и нижняя область с запланированными мероприятиями. Мероприятия отображаются с помощью визуального компонента «Галерея», все остальные объекты — это кнопки и текстовые области. Также на экране отображается кнопка «Help» для перехода на страницу справочных сведений и кнопки перехода к файлам чек-листа и задач на испытательный срок, о которых расскажу немного позже.
Для новичка экран готов, здесь у него есть максимум необходимой информации на испытательный срок. Теперь перейдем к созданию экрана руководителя, с ним будет немного сложнее, потому что руководитель должен иметь возможность выполнять свои задачи в рамках личного кабинета.
Итак, делаем первый экран личного кабинета руководителя. На нем руководитель должен видеть перечень своих «новичков» и иметь возможность посмотреть основные сведения по ним.
![](https://habrastorage.org/webt/nt/m9/j4/ntm9j4tau7qexx-iycfkw0vfzly.png)
На данном экране руководитель может посмотреть основные сведения по своим сотрудникам, а также перейти к справочной информации с помощью кнопки «Help». Помимо этого, есть возможность поиска информации и плюс ко всему можно попасть на дополнительный экран с задачами по выбранному сотруднику, нажав кнопку «Задачи».
![](https://habrastorage.org/webt/b7/le/ft/b7left35r5otm_dgogo20bvet7a.png)
На этом экране руководитель может увидеть свои задачи на период испытательного срока по выбранному сотруднику, а также выполнить различные операции. В рамках данной системы заложено два действия – «Загрузить файл» (для чек-листа и задач на испытательный срок соответственно) и «Отметить мероприятие выполненным». Каждое из действий вызывает свой вариант диалогового окна, например кнопка «Загрузить файл» вызывает вот такое окно:
![](https://habrastorage.org/webt/5l/xo/-3/5lxo-3x9bwei6pbpwlp5jxdlcds.png)
При этом все остальные кнопки блокируются и нет возможности осуществить какую-либо еще операцию до тех пор, пока либо не будет приложен файл, либо не закроем данное окно. Кнопка «Подтвердить» изначально заблокирована, но становится активной, как только указан добавляемый файл.
![](https://habrastorage.org/webt/ie/5z/cw/ie5zcwzglt4ycmixqjd3eauduvw.png)
Второй вариант операции — это «Отметить выполненным» и диалог выглядит следующим образом:
![](https://habrastorage.org/webt/g0/bj/kx/g0bjkx-d_wanfskc8sa8dro1wf8.png)
Что происходит при нажатии на кнопку «Подтвердить»? Всё очень просто – осуществляется запуск Power Automate потока с пробросом ключевых параметров.
![](https://habrastorage.org/webt/4o/lz/6v/4olz6vcfsk80-lz29jlx3_cic-e.png)
В зависимости от этих параметров в Power Automate потоке мы понимаем, что именно нам нужно сделать и какую информацию сохранить. То есть для загрузки файла и для отметки о выполнении используется один и тот же поток, но с разными входными параметрами.
![](https://habrastorage.org/webt/pw/lk/_z/pwlk_zu1uj9tlxznudki8ofdura.png)
Причем, после того как файл чек-листа или задач на испытательный срок добавлен и загружен, кнопка моментально трансформируется из кнопки загрузки в кнопку просмотра загруженного файла.
![](https://habrastorage.org/webt/ry/28/mv/ry28mvpegbc-ipugjjhkbvgb22q.png)
Личный кабинет руководителя готов. И остался еще один вариант личного кабинета, так называемая «суперпозиция», когда новичок является руководителем и у него могут быть такие же новички на испытательном сроке. Объединяем два экрана и делаем небольшое меню навигации.
![](https://habrastorage.org/webt/jr/qr/ls/jrqrlsmuxtrz91pib8zjh4gvz8k.png)
С помощью меню навигации можно моментально переключаться между экраном новичка и экраном руководителя.
![](https://habrastorage.org/webt/w3/kn/7t/w3kn7tassfqfy2zxbrfmj2m5b0g.png)
Кстати, почтовый адрес тоже кликабельный и позволяет сразу же вызвать создание нового письма новичку.
![](https://habrastorage.org/webt/u2/e4/br/u2e4brkizrlangn8rdds3nuwbtm.png)
Помните, в самом начале я говорил, что чуть позже мы займемся первым экраном авторизации и, может быть полностью откажемся от него? Настало это время. Этот экран и правда не очень нужен, если мы можем автоматически проверять текущего пользователя и вычислять к какой роли он относится. Идем в событие OnStart нашего приложения и пишем проверки.
![](https://habrastorage.org/webt/3c/ed/8f/3ced8fqoqz3i5nujqzohzinnf0i.png)
В зависимости от того является наш пользователь сотрудником, руководителем или «два-в-одном» мы сразу же при запуске приложения перенаправляем пользователя на нужный экран минуя экран авторизации внутри приложения. Приложение готово. Осталось встроить его в Microsoft Teams.
![](https://habrastorage.org/webt/gx/yn/fn/gxynfnxvkqqso9euudsfe6owusm.png)
В заключение хочу сказать, что Microsoft Power Platform обладает обширным набором возможностей, которые помогают создать приложения для ваших целей не только с точки зрения функциональности, но и дает возможности для применения определенных дизайнерских элементов, позволяющих сделать интерфейс приятным и красивым. В следующих статьях разберем еще больше различных решений на базе Microsoft Power Platform. Всем хорошего дня и спасибо за внимание!
Итак, как мы помним из прошлой статьи, у нас с Вами есть сайт SharePoint Online со списками и библиотеками, для системы адаптации, форма на PowerApps, поток обработки данных на Power Automate и отчеты Power BI. Самое время добавить личный кабинет, в котором сотрудник и/или руководитель видели бы свои задачи на период адаптации и могли их выполнить, осуществив определенные действия.
![](https://habrastorage.org/webt/ct/g6/77/ctg677arzywfrhdg1jtwdsufaqu.jpeg)
Создание PowerApps приложения личного кабинета адаптации
Начинаем работу и в первую очередь переходим на страницу редактора Microsoft PowerApps и создаем новое приложение.
![](https://habrastorage.org/webt/h4/jf/if/h4jfifqbcw5io3hguly24buaimw.png)
Далее, внутри редактора создаем первый экран. Изначально планируем что в приложении будет возможность отображения разных вариантов личных кабинетов в зависимости от принадлежности пользователя к той или иной роли. Чуть позже мы адаптируем данный механизм и сделаем автоматическое определение роли пользователя при открытии приложения, но начнем с экрана авторизации.
![](https://habrastorage.org/webt/pe/2o/ud/pe2oudzoymia6qyipdq62ljehj0.png)
На данном экране располагаем две кнопки входа в личный кабинет. Одна ведет на личный кабинет сотрудника, вторая на личный кабинет руководителя. В зависимости от принадлежности пользователя к той или иной группе, кнопка «Войти как руководитель» может отображаться заблокированной, в случае если текущий пользователь не является руководителем. Далее делаем следующий экран. Это будет экран сотрудника, где будут отображаться основные данные о собственном профиле, а также перечень мероприятий, который необходимо пройти в период испытательного срока.
![](https://habrastorage.org/webt/lw/4k/2d/lw4k2dhz6_vfyyb0qyoyry-fsby.png)
Как можно заметить, визуально данный экран разбит на две основные области: верхняя область с основными сведениями о себе и нижняя область с запланированными мероприятиями. Мероприятия отображаются с помощью визуального компонента «Галерея», все остальные объекты — это кнопки и текстовые области. Также на экране отображается кнопка «Help» для перехода на страницу справочных сведений и кнопки перехода к файлам чек-листа и задач на испытательный срок, о которых расскажу немного позже.
Для новичка экран готов, здесь у него есть максимум необходимой информации на испытательный срок. Теперь перейдем к созданию экрана руководителя, с ним будет немного сложнее, потому что руководитель должен иметь возможность выполнять свои задачи в рамках личного кабинета.
Итак, делаем первый экран личного кабинета руководителя. На нем руководитель должен видеть перечень своих «новичков» и иметь возможность посмотреть основные сведения по ним.
![](https://habrastorage.org/webt/nt/m9/j4/ntm9j4tau7qexx-iycfkw0vfzly.png)
На данном экране руководитель может посмотреть основные сведения по своим сотрудникам, а также перейти к справочной информации с помощью кнопки «Help». Помимо этого, есть возможность поиска информации и плюс ко всему можно попасть на дополнительный экран с задачами по выбранному сотруднику, нажав кнопку «Задачи».
![](https://habrastorage.org/webt/b7/le/ft/b7left35r5otm_dgogo20bvet7a.png)
На этом экране руководитель может увидеть свои задачи на период испытательного срока по выбранному сотруднику, а также выполнить различные операции. В рамках данной системы заложено два действия – «Загрузить файл» (для чек-листа и задач на испытательный срок соответственно) и «Отметить мероприятие выполненным». Каждое из действий вызывает свой вариант диалогового окна, например кнопка «Загрузить файл» вызывает вот такое окно:
![](https://habrastorage.org/webt/5l/xo/-3/5lxo-3x9bwei6pbpwlp5jxdlcds.png)
При этом все остальные кнопки блокируются и нет возможности осуществить какую-либо еще операцию до тех пор, пока либо не будет приложен файл, либо не закроем данное окно. Кнопка «Подтвердить» изначально заблокирована, но становится активной, как только указан добавляемый файл.
![](https://habrastorage.org/webt/ie/5z/cw/ie5zcwzglt4ycmixqjd3eauduvw.png)
Второй вариант операции — это «Отметить выполненным» и диалог выглядит следующим образом:
![](https://habrastorage.org/webt/g0/bj/kx/g0bjkx-d_wanfskc8sa8dro1wf8.png)
Что происходит при нажатии на кнопку «Подтвердить»? Всё очень просто – осуществляется запуск Power Automate потока с пробросом ключевых параметров.
![](https://habrastorage.org/webt/4o/lz/6v/4olz6vcfsk80-lz29jlx3_cic-e.png)
В зависимости от этих параметров в Power Automate потоке мы понимаем, что именно нам нужно сделать и какую информацию сохранить. То есть для загрузки файла и для отметки о выполнении используется один и тот же поток, но с разными входными параметрами.
![](https://habrastorage.org/webt/pw/lk/_z/pwlk_zu1uj9tlxznudki8ofdura.png)
Причем, после того как файл чек-листа или задач на испытательный срок добавлен и загружен, кнопка моментально трансформируется из кнопки загрузки в кнопку просмотра загруженного файла.
![](https://habrastorage.org/webt/ry/28/mv/ry28mvpegbc-ipugjjhkbvgb22q.png)
Личный кабинет руководителя готов. И остался еще один вариант личного кабинета, так называемая «суперпозиция», когда новичок является руководителем и у него могут быть такие же новички на испытательном сроке. Объединяем два экрана и делаем небольшое меню навигации.
![](https://habrastorage.org/webt/jr/qr/ls/jrqrlsmuxtrz91pib8zjh4gvz8k.png)
С помощью меню навигации можно моментально переключаться между экраном новичка и экраном руководителя.
![](https://habrastorage.org/webt/w3/kn/7t/w3kn7tassfqfy2zxbrfmj2m5b0g.png)
Кстати, почтовый адрес тоже кликабельный и позволяет сразу же вызвать создание нового письма новичку.
![](https://habrastorage.org/webt/u2/e4/br/u2e4brkizrlangn8rdds3nuwbtm.png)
Помните, в самом начале я говорил, что чуть позже мы займемся первым экраном авторизации и, может быть полностью откажемся от него? Настало это время. Этот экран и правда не очень нужен, если мы можем автоматически проверять текущего пользователя и вычислять к какой роли он относится. Идем в событие OnStart нашего приложения и пишем проверки.
![](https://habrastorage.org/webt/3c/ed/8f/3ced8fqoqz3i5nujqzohzinnf0i.png)
В зависимости от того является наш пользователь сотрудником, руководителем или «два-в-одном» мы сразу же при запуске приложения перенаправляем пользователя на нужный экран минуя экран авторизации внутри приложения. Приложение готово. Осталось встроить его в Microsoft Teams.
![](https://habrastorage.org/webt/gx/yn/fn/gxynfnxvkqqso9euudsfe6owusm.png)
В заключение хочу сказать, что Microsoft Power Platform обладает обширным набором возможностей, которые помогают создать приложения для ваших целей не только с точки зрения функциональности, но и дает возможности для применения определенных дизайнерских элементов, позволяющих сделать интерфейс приятным и красивым. В следующих статьях разберем еще больше различных решений на базе Microsoft Power Platform. Всем хорошего дня и спасибо за внимание!
zhaparoff
Это все, конечно, здорово, задорно, молодежно. Но меня всегда в этих лоу код решениях мучали несколько вопросов:
Если этого нет, то это всего лишь игрушка, применимая, максимум, для small business, но уж никак не для enterprise решений.
Поправьте, пожалуйста, если я заблуждаюсь.
Andrew_Braun Автор
Добрый день! Хорошие вопросы, постараюсь на них ответить:
Командную работу организовать можно, но важным моментом является то, что пока один разработчик настраивает приложение в редакторе, для других оно будет заблокировано. Поэтому распараллеливаются обычно так: один человек делает приложение, второй настраивает поток, третий делает отчёт, четвёртый настраивает структуру хранения данных. И так далее.
Контроль версий есть и доступ к нему существует через веб-интерфейс и программно.
С автоматизированным тестированием все обстоит очень хорошо, так как в самом PowerApps есть встроенный компонент создания автотестов. То есть можно делать автотесты параллельно с разработкой приложения, это очень удобно.
Для CI/CD используется Azure DevOps, который отлично работает с PowerApps приложениями.
zhaparoff
Т.е. если в продукте планируется одно приложение, без всей обвязки, использующее только стандартные источники данных, то разрабатывать сможет только 1 человек? И сюда же #3 — тесты тоже ему придется самому писать, так как никто в параллели это сделать не сможет?
Под source control я имел в виду именно его, а не контроль версий. Как сохранить исходный код приложения в репозиторий, например в гит? Как отследить изменения от версии к версии, что где поменяли, что где сломали?
Можно ли тесты написанные таким образом запускать в CI пайплайне?
Просто интересно, Вы это все руками уже щупали, на боевом проекте?
Andrew_Braun Автор
Работу с исходным кодом на боевом проекте не проверяли, не возникало такой потребности. Все остальные пункты активно используются в разработке приложений для клиентов.