All files / app/form/plugins/gen gen.component.ts

59.45% Statements 22/37
37.14% Branches 13/35
54.54% Functions 6/11
60.71% Lines 17/28

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94            71x               71x     1x   1x           1x   1x     1x               1x               5x       71x 1x           1x       71x 1x 1x                     1x 1x                                    
import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges, ViewChild } from '@angular/core';
import { ReactiveFormsModule, UntypedFormGroup } from '@angular/forms';
import { FormlyForm, FormlyFormOptions } from '@ngx-formly/core';
import { cloneDeep } from 'lodash-es';
import { Plugin } from '../../../model/plugin';
import { AdminService } from '../../../service/admin.service';
import { memo, MemoCache } from '../../../util/memo';
 
@Component({
  selector: 'app-form-gen',
  templateUrl: './gen.component.html',
  styleUrls: ['./gen.component.scss'],
  imports: [ReactiveFormsModule, FormlyForm]
})
export class GenFormComponentI implements OnInit, OnChanges {
 
  @Input()
  bulk = false;
  @Input()
  promoteAdvanced = false;
  @Input()
  plugins!: UntypedFormGroup;
  @Input()
  plugin!: Plugin;
  @Input()
  children: Plugin[] = [];
  @Output()
  togglePlugin = new EventEmitter<string>();
 
  model: any;
  options: FormlyFormOptions = {
    formState: {
      admin: this.admin,
      config: {},
    },
  };
 
  constructor(
    private admin: AdminService,
  ) { }
 
  ngOnChanges(changes: SimpleChanges) {
    MemoCache.clear(this);
  }
 
  get group() {
    return this.plugins.get(this.plugin.tag) as UntypedFormGroup | undefined;
  }
 
  @memo
  get form() {
    Iif (this.bulk) {
      if (this.plugin.config?.bulkForm === true) {
        return cloneDeep(this.plugin.config?.form || this.plugin.config?.advancedForm);
      }
      return cloneDeep(this.plugin.config?.bulkForm);
    }
    return cloneDeep(this.plugin.config?.form);
  }
 
  @memo
  get advancedForm() {
    Iif (this.bulk) return undefined;
    return cloneDeep(this.plugin.config?.advancedForm);
  }
 
  get childrenOn() {
    for (let i = this.children.length - 1; i >= 0; i--) {
      if (this.plugins.contains(this.children[i].tag)) return i;
    }
    return 0;
  }
 
  ngOnInit(): void {
    this.group?.patchValue(this.plugin.defaults);
    this.options.formState.config = this.plugin.defaults;
  }
 
  setValue(value: any) {
    this.model = value[this.plugin.tag];
  }
 
  cssClass(tag: string) {
    return tag.replace(/\//g, '_')
      .replace(/\./g, '-')
      .replace(/[^\w-_]/g, '');
  }
 
  toggleChild(tag: string) {
    this.togglePlugin.next(tag);
    if ('vibrate' in navigator) navigator.vibrate([2, 8, 8]);
  }
}