Пользовательские задания
Web-компонент task-drawer

Web-компонент task-drawer

Используется для встраивания карточки задачи (EditCardComponent) через q-web-component.

Подключение

<q-web-component
  [endpoint]="endpoint"
  (events)="webComponentEvents($event)"
></q-web-component>
endpoint = {
  service: 'humantaskui',
  component: 'q-bpm-human-task-list',
  route: 'web-component/task-drawer/196149707763488', // или без id для создания задачи
  caption: ''
};

Маршрутизация

  • web-component — пустая оболочка (DrawerShellComponent), рендерит <router-outlet>.
  • task-drawer — открывает EditCardComponent в режиме создания задачи.
  • task-drawer/:id — открывает EditCardComponent с загрузкой задачи по id.

События

q-web-component эмитит события. Пример обработки:

public webComponentEvents(evt: QEventsContract<any>) {
  if (evt.name === 'qbpm.ht-web-component.task-drawer') {
    this.testDrawer.set(evt.payload.visible);
  }
}
Закрытие drawer

При закрытии drawer (visible становится false) внутри компонент TaskDrawerComponent отправляет событие:

this.eventsService.customEvent({
  name: 'qbpm.ht-web-component.task-drawer',
  payload: { visible: false }
});

Родительское приложение принимает его и скрывает q-web-component.

Для теста

Замените route в endpoint на нужный путь:

  • web-component/task-drawer — пустая форма создания задачи.
  • web-component/task-drawer/<id-задачи> — редактирование существующей задачи.