summaryrefslogtreecommitdiffstats
path: root/public/src/app/rule-engine/from/from.component.ts
blob: c526103ff5b7250642d34222711e7289cf63313c (plain)
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
95
96
97
98
99
100
101
102
103
104
105
106
import {
  Component,
  Input,
  Output,
  EventEmitter,
  ViewChild,
  AfterViewInit,
  ChangeDetectorRef
} from '@angular/core';
// import { From } from "../model";
import { Subject } from 'rxjs/Subject';
import {
  trigger,
  state,
  animate,
  transition,
  style,
  keyframes
} from '@angular/animations';
import { NgForm } from '@angular/forms';

@Component({
  selector: 'app-from',
  templateUrl: './from.component.html',
  styleUrls: ['./from.component.scss'],
  animations: [
    trigger('state', [
      state('open', style({ opacity: 1, height: 'auto' })),
      transition('* => open', [
        animate(200, keyframes([style({ opacity: 1, height: 'auto' })]))
      ]),
      state('closed', style({ opacity: 0, height: 0 }))
    ])
  ]
})
export class FromComponent implements AfterViewInit {
  from: any = {
    value: '',
    regex: '',
    state: 'closed',
    values: [
      {
        value: ''
      },
      {
        value: ''
      }
    ]
  };
  @Input() actionType;
  @Output() onFromChange = new EventEmitter();
  @ViewChild('fromFrm') fromFrm: NgForm;
  hoveredIndex;
  // public keyUp = new BehaviorSubject<string>(null);

  constructor(private changeDetector: ChangeDetectorRef) {}

  ngAfterViewInit(): void {
    if (
      (this.actionType === 'clear' || this.actionType === 'clear nsf') &&
      this.from.values[0].value === ''
    ) {
      this.from.values = [
        {
          value: ''
        }
      ];
    }
    this.changeDetector.detectChanges();
  }

  showRegex(item) {
    item.state = item.state === 'closed' ? 'open' : 'closed';
    if (item.state === 'closed') {
      item.regex = '';
    }
  }
  updateMode(fromData) {
    console.log(fromData);
    if (fromData) {
      if (
        (this.actionType === 'clear' || this.actionType === 'clear nsf') &&
        fromData.values[0].value === ''
      ) {
        this.from.values = [
          {
            value: ''
          }
        ];
      } else {
        this.from = fromData;
      }
    }
    this.changeDetector.detectChanges();
  }

  modelChange(event) {
    this.onFromChange.emit(event);
  }
  addFromInput() {
    this.from.values.push({ value: '' });
  }
  removeFromInput(index) {
    this.from.values.splice(index, 1);
  }
}