Советы и рекомендации
Сёрчбокс сёрчбоксов

Универсальный Searchbox

Для решения кейса выбора объекта в одном поле и динамического получения Searchbox в соседнем поле, вам понадобится универсальный Searchbox который может подключить в себя динамически любой другой серч-бокс(если он есть в общем реестре). Чтобы реализовать такой механизм вам необходимо использовать сразу два компонента Searchbox. Первый из них будет содержать список всех деклараций, а второй уже сам подключаемый серч-бокс.

Подключаем Searchbox

Подключите последовательно серч-боксы следующим образом:

<!-- Сёрч-бокс деклараций. Некоторые из них содержат другие сёрч-боксы -->
<q-search-box
    field="declarationRussianName"
    [qSearchBoxEndpoint]="PBCLinkedObjectDeclarations"
    [formControl]="declarationsControl"
></q-search-box>
<!-- Искомый сёрч-бокс -->
<q-search-box
    *ngIf="searchboxFromDeclaration"
    [field]="searchboxFromDeclarationField"
    [qSearchBoxEndpoint]="searchboxFromDeclaration"
    [formControl]="searchboxFromDeclarationControl"
></q-search-box>
export class TestComponent {
 
  /**
   * Список деклараций всех существующих страниц, включая сёрч-боксы
   */
  public PBCLinkedObjectDeclarations: ConfigurationEndpoint = {
    service: 'qdpbcui',
    component: 'qdpbcui',
    businessObject: 'dq-pbc-declaration'
  };
  /**
   * Искомый сёрч-бокс
   */
  public searchboxFromDeclaration?: ConfigurationEndpoint;
 
  /**
   * Декларация, содержащая мета-информацию о подключении сёрч-бокса
   */
  public declarationsControl = new FormControl();
 
  /**
   * Искомый бизнес-объект
   */
  public searchboxFromDeclarationControl = new FormControl();
 
  /**
  * Поле, значение которого будет отображено в искомом сёрч-боксе
  */
  public searchboxFromDeclarationField = 'id';
 
  constructor() {
    this.declarationsControl.valueChanges
      .pipe(takeUntil(this.destroyed$))
      .subscribe(declaration => {
        // Обнуляем сёрч-бокс
        this.searchboxFromDeclaration = undefined;
 
        if (declaration.declarationMetadata?.type === 'seachBox') {
          // Если мета-информация декларации содержит сёрч-бокс, подключаем его
          this.searchboxFromDeclaration = declaration.declarationMetadata.properties;
          this.searchboxFromDeclarationField = declaration.declarationMetadata.properties.field;
        }
      });
  }
 
}
Q.Palette IconsПереключение языков