@hicoder/angular-cli/templates/schema-list.component.ts

Angular UI componenets and service generator. It works with the mean-rest-express package to generate the end to end web application. The input to this generator is the Mongoose schema defined for the express application. mean-rest-express exposes the Res

import { Component, OnInit, Input } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { Injector } from '@angular/core';

import { <%-SchemaName%>ListCustComponent } from '../../../<%-moduleName%>-cust/base/<%-schemaName%>/<%-schemaName%>-list.cust.component';
import { ViewType } from '../<%-schemaName%>.component';
import { <%-SchemaName%>Service } from '../<%-schemaName%>.service';

@Component({
  template: '',
})
export class <%-SchemaName%>ListComponent extends <%-SchemaName%>ListCustComponent implements OnInit {
  <%_ if (sFeatures.hasDate) { %>
  public minDate = {year: (new Date()).getFullYear() - 100, month: 1, day: 1};<%}%><%
  let jsonData = JSON.stringify(listViewProperties);
  let unquoted = jsonData.replace(/"([^"-]+)":/g, '$1:').replace(/"([^"]+)":/g, `'$1':`);
  %>
  public override listViewProperties: any = <%-unquoted%>;

  // used by association widget for the associated schema
  public associationCompInstance: any;
  public associationCompFields: any = [];
  public associationCompObjects: any = [];

  public override clickItemAction: string = '<%-listViewObj.clickItemAction%>';
  public override cardHasLink: boolean = <%-listViewObj.cardHasLink%>;
  public override cardHasSelect: boolean = <%-listViewObj.cardHasSelect%>;
  public override includeSubDetail: boolean = <%-listViewObj.includeSubDetail%>;
  public override canUpdate: boolean = <%-listViewObj.canUpdate%>;
  public override canDelete: boolean = <%-listViewObj.canDelete%>;
  public override canArchive: boolean = <%-listViewObj.canArchive%>;
  public override canCheck: boolean = <%-listViewObj.canCheck%>;
  public override itemMultiSelect: boolean = <%-listViewObj.itemMultiSelect%>;
  public override majorUi: boolean = <%-listViewObj.majorUi%>;

  // Do query on NgInit in this base class
  public queryOnNgInit: boolean = true;
  public override view: ViewType = ViewType.LIST;

  constructor(
    public override <%-schemaName%>Service: <%-SchemaName%>Service,
    public override injector: Injector,
    public override route: ActivatedRoute,
  ) {
    super(<%-schemaName%>Service, injector, route);
<% let theView = briefView; %><%- include('schema-construct.component.ts', {theView: briefView}) %>
<% if (ownSearchStringFields.length > 0) {%>
    this.ownSearchStringFields = [<%for (let itm of ownSearchStringFields) {%>
            '<%-itm%>',<%}%>
    ];<%}%>
<% let sbo = searchBarObj; %>
<% if (sbo.stringBoxFields.length > 0) {%>
    this.stringBoxFields = [<%for (let itm of sbo.stringBoxFields) {%>
            '<%-itm.fieldName%>',<%}%>
    ];<%}%>
<% if (sbo.ownSearchFields.length > 0) {%>
    this.ownSearchFields = [<%for (let itm of sbo.ownSearchFields) {%>
            '<%-itm.fieldName%>',<%}%>
    ];<%}%>

    this.listSortFields = {<%for (let field of theView) {%>
        '<%-field.fieldName%>': '<%-field.sortField%>',<%}%>
    };<%
    if (defaultSortField) { %>
    this.setListSort('<%-defaultSortField%>', '<%-defaultSortOrder%>');<%}%>
    <%_ const listCategoriesString = JSON.stringify(listCategories);%>
    const listCategories: any[] = <%-listCategoriesString%>;
    this.listCategory1 = listCategories[0] || {};
    this.listCategory2 = listCategories[1] || {};
  }

  override ngOnInit() {
      super.ngOnInit();

      this.adjustListViewForWindowSize();

      if (!this.options) {
        this.options = {};
      }

      const properties = [
        'clickItemAction',
        'cardHasLink',
        'cardHasSelect',
        'includeSubDetail',
        'canUpdate',
        'canDelete',
        'canArchive',
        'canCheck',
        'itemMultiSelect',
        'majorUi',

        'listViewFilter',
      ];
      this.applyProperties(this.options, this, properties);
  
      if (this.options.disableCatetory) {
        this.listCategory1 = {}; // no do query based on category for home view;
        this.listCategory2 = {}; // no do query based on category for home view;
      }

      this.listViewFilter = this.options.listViewFilter || this.listViewFilter

      // this is to initialize the detail that will be used for search condition selection
      let detail: any = {};
      if (this.searchObj) {
        this.searchDetailReady = true; // search provided from "detail", not from search bar.
        detail = this.searchObj;
      }
      if (this.queryParams) {
        this.listSortField = this.queryParams.listSortField || this.listSortField;
        this.listSortOrder = this.queryParams.listSortOrder || this.listSortOrder;
        this.perPage = this.queryParams.perPage || this.perPage;
      }
      this.detail = this.formatDetail(detail);

      if (this.queryOnNgInit) {
        this.searchList();
        // get editHintFields
        this.searchHintFieldValues();
      }
  }

  public override addFieldsRefComponents() {<%if (sFeatures.hasRef) {%>
    <%for (let field of compositeEditBriefView) { 
      if (field.Ref) {%>
      if (this.field<%-field.FieldName%>) {
    this.fieldsRef['<%-field.fieldName%>'] = this.field<%-field.FieldName%>;
      }<%}
    }%>
  <%}%>
  }

  viewUIEvent(evt: any) {
    const thisObject:any = this;
    thisObject[evt.type].apply(this, evt.params);
  }
}