Вверх

Адрес
Пирогова 131, офисс 11 Винница, Украина 21037,
info@4go.space
Тел: +380738466121

Полный календарь в OutSystems – Настройка сложного календаря

[19459000]

[19459001] [19459002] Мы использовали инфраструктуру JavaScript Full Calendar во многих наших проектах, так как это очень полное решение для разработки календарей на веб-сайтах. Однако интеграция полного календаря в некоторые из наших проектов была действительно сложной задачей из-за проектов, требующих пользовательских представлений, и дополнительной сложности интеграции его с платформой OutSystems. [19459003] [19459004] [19459001] [19459002] Одним из этих проектов был [19459003] [19459005] [19459002] WayneCore [19459003] [19459006] [19459002], интрасеть, для которой требовалось полностью настраиваемое представление ресурсов и некоторые внешние функции. Этот календарь был создан для использования менеджерами проектов, что позволяет им лучше организовывать рабочую нагрузку и проекты своих команд, а также управлять распределением средств и просматривать отчетное время сотрудников. [19459003] [19459004] [19459001] [19459002] Проект имеет страницу плана ресурсов, состоящую из представления календаря с разделом фильтра, где пользователь может выполнять фильтрацию по проектам, пользователям, отделам или подразделениям. [19459003] [19459004] [19459001] [19459007] [19459004] [19459001] [19459008] [19459009] [19459002] Полное представление календаря плана ресурсов [19459003] [19459010] [19459011] [19459004] [19459001] [19459002] Для этого представления календаря нам нужно было иметь возможность переключать видимость выходных, и этот переключатель также должен был обновлять данные календаря в зависимости от выбранной опции. Мы также удалили кнопку по умолчанию, чтобы переключаться между ежедневным и еженедельным просмотром календаря, чтобы повысить удобство работы с платформой. [19459003] [19459004] [19459001] [19459012] [19459004] [19459001] [19459008] [19459009] [19459002] Ежедневный просмотр плана ресурсов [19459003] [19459010] [19459011] [19459004] [19459001] [19459002] Этот календарь также потребовал некоторых изменений в ячейках таблицы, поэтому мы расширили функции ячейки таблицы и добавили: [19459003] [19459004] [19459013] [19459014] [19459002] аватар; [19459003] [19459015] [19459014] [19459002] новый значок корзины с действием для удаления ресурса из текущего представления; [19459003] [19459015] [19459014] [19459002] настраиваемая разделенная ячейка для двух строк событий: одна для расписания планирования, а другая для отчетного времени сотрудника. [19459003] [19459015] [19459016] [19459001] [19459002] Каждая строка сотрудника разделена на две строки, первая из которых является строкой запланированного события, а вторая – строкой отчета о времени. В первом ряду – строке событий – пользователи могут добавлять, редактировать и перемещать события. Этого можно достичь, щелкнув в слоте даты / времени или щелкнув в течение двух (или более) дней / часов, чтобы создать новое событие расписания или переместить существующие события. [19459003] [19459004] [19459001] [19459002] Во второй строке – зоне отчетности – нет событий, поэтому мы отключили это функционально в этих строках. [19459003] [19459004] [19459001] [19459002] Для создания и редактирования событий календаря мы использовали модалы OutSystems, где пользователи могли отправлять информацию о событии, такую ​​как идентификация ресурса и время. Эта задача была немного сложной, и для достижения этой цели нам пришлось провести рефакторинг исходного кода календаря, интегрированного в OutSystems, чтобы мы могли получить информацию об идентификации ресурса в событии. [19459003] [19459004] [19459001] [19459017] [19459004] [19459001] [19459008] [19459002] Отображаемые события могут иметь некоторую информацию о событиях, такую ​​как время, название проекта, а также могут различаться по цвету. Синий цвет фона указывает пользователю, что он не может редактировать событие, а серые события доступны для редактирования. [19459003] [19459011] [19459004] [19459001] [19459008] [19459018] [19459011] [19459004] [19459001] [19459002] Ключевым требованием было мобильное использование, и это также было проблемой, потому что, хотя этот календарь был создан для работы на мобильных устройствах, нам все еще нужно было адаптировать его для использования в особых условиях, например, когда работники находятся на поле. Чтобы добиться этого, мы создали некоторые задержки и добавили специальные сенсорные события, чтобы пользователи не могли случайно открыть модальности редактирования, например, при прокрутке или навигации по странице. В мобильной версии пользователю нужно будет нажать на ячейку даты в течение полсекунды, чтобы показать модальный режим создания, вместо того, чтобы быть мгновенным щелчком, как в веб-версии. [19459003] [19459008] [19459011] [19459004] [19459001] [19459002] Это некоторые примеры пользовательских функций, которые мы разработали для полного календаря на платформе OutSystems. Совсем недавно мы также создали компонент [19459003] [19459019] [19459002] Full Calendar Reactive [19459003] [19459006] [19459002], который теперь доступен в OutSystems Forge, где мы интегрировали JavaScript-плагин Fullcalendar в OutSystems Reactive Web Apps , [19459003] [19459004] [19459001] [19459020] [19459002] Основное изображение поста [19459021] Zan [19459006] на [19459022] Unsplash [19459006] [19459003] [19459023] [19459004]

[19459024]

[19459025]

Author avatar
admin

Оставить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *