blob: df2c110c633e46ea08f05d173010f0459c9edf05 (
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
|
<form #fromFrm="ngForm" novalidate>
<!-- Copy template -->
<div class="from" *ngIf="actionType === 'copy' || actionType === 'replace text' || actionType === 'log text'" data-tests-id="fromComponent">
<div class="from-conatiner">
<div style="display: flex; align-items: center; width: 100%;" class="label">
<span class="label" style="padding: 0 5px; width: 50px;">From</span>
<input class="input-text" name="copyFrom" required style="min-width: 190px;" (ngModelChange)="modelChange(from)" #copyFrom="ngModel"
[(ngModel)]="from.value" type="text" data-tests-id="valueInput">
<span class="label" (click)="showRegex(from)" [ngStyle]="from.state === 'open' ? { 'color': '#009FDB'} : {'color':'gray'}"
style="padding: 0 5px; width: 50px; cursor: pointer; border: none" data-tests-id="btnFromRegex">Re/g</span>
</div>
<div [@state]="from.state" *ngIf="from.state === 'open'" style="display: flex; align-items: center; width: 80%;" class="label">
<span class="label" style="padding: 0 3px; width: 54px; border-top: none; border-bottom: none;">regex</span>
<input class="input-text" style="min-width: 192px;" (ngModelChange)="modelChange(from)" [(ngModel)]="from.regex" type="text"
ngModel required name="RegexInput" data-tests-id="inputFromRegex">
</div>
</div>
</div>
<!-- Map template -->
<div class="from" *ngIf="actionType === 'map'" data-tests-id="fromComponent">
<div class="from-conatiner">
<div style="display: flex; align-items: center; width: 100%;" class="label">
<span class="label" style="padding: 0 5px; width: 50px;">From</span>
<input class="input-text" ngModel required name="mapFromInput" (ngModelChange)="modelChange(from)" [(ngModel)]="from.value"
type="text" data-tests-id="valueInput">
</div>
</div>
</div>
<!-- dateFormatter template -->
<div class="from" *ngIf="actionType === 'date formatter'" data-tests-id="fromComponent">
<div class="from-conatiner">
<div style="display: flex; align-items: center; width: 100%;" class="label">
<span class="label" style="padding: 0 5px; width: 50px;">From</span>
<input class="input-text" ngModel required name="dateFormatterFromInput" (ngModelChange)="modelChange(from)" [(ngModel)]="from.value"
type="text" data-tests-id="valueInput">
</div>
</div>
</div>
<!-- clear template -->
<div class="from" *ngIf="actionType === 'clear'" ngModelGroup="clear" #clearFrom="ngModelGroup">
<div *ngFor="let input of from.values; let index = index;" data-tests-id="clearInputArrayFrom" (mouseleave)="hoveredIndex=-1"
(mouseover)="hoveredIndex=index" class="from-conatiner" style="margin-bottom:1rem; display: flex; flex-direction: column; align-items: flex-start;"
data-tests-id="fromComponent">
<div style="display: flex; align-items: center; width: 100%;">
<div style="display: flex; align-items: center; width: 100%;" class="label">
<span class="label" style="padding: 0 5px; width: 50px;">From</span>
<input class="input-text" (ngModelChange)="modelChange(from)" [(ngModel)]="input.value" type="text" data-tests-id="valueInput"
ngModel required name="clear[{{index}}]">
</div>
<button mat-icon-button class="button-remove" [ngStyle]="hoveredIndex === index ? {'opacity':'1'} : {'opacity':'0'}" (click)="removeFromInput(index)"
*ngIf="from.values.length > 1" style="box-shadow: none; height: 24px; width: 24px; display:flex" data-tests-id="btnDelete">
<mat-icon class="md-24">delete</mat-icon>
</button>
</div>
</div>
<div style="display:flex; justify-content: space-between;">
<div style="display: flex; align-items: center;">
<button mat-mini-fab color="primary" (click)="addFromInput()" style="box-shadow: none; height: 16px; width: 16px; display:flex"
data-tests-id="btnAddInput">
<span style="padding-left: 2px; display: flex; justify-content: center; align-items: center" [innerHTML]="'plus' | feather:12"></span>
<!--
<mat-icon>add</mat-icon> -->
</button>
<span style="color: #009FDB; display: flex; justify-content: center; padding-left: 6px">Add input</span>
</div>
</div>
</div>
<!-- Concat template -->
<div class="from" *ngIf="actionType === 'concat'" ngModelGroup="concat" #concatFrom="ngModelGroup">
<div *ngFor="let input of from.values; let index = index;" data-tests-id="concatInputArrayFrom" (mouseleave)="hoveredIndex=-1"
(mouseover)="hoveredIndex=index" class="from-conatiner" style="margin-bottom:1rem; display: flex; flex-direction: column; align-items: flex-start;"
data-tests-id="fromComponent">
<div style="display: flex; align-items: center; width: 100%;">
<div style="display: flex; align-items: center; width: 100%;" class="label">
<span class="label" style="padding: 0 5px; width: 50px;">From</span>
<input class="input-text" (ngModelChange)="modelChange(from)" [(ngModel)]="input.value" type="text" data-tests-id="valueInput"
ngModel required name="concat[{{index}}]">
</div>
<button mat-icon-button class="button-remove" [ngStyle]="hoveredIndex === index ? {'opacity':'1'} : {'opacity':'0'}" (click)="removeFromInput(index)"
*ngIf="from.values.length > 2" style="box-shadow: none; height: 24px; width: 24px; display:flex" data-tests-id="btnDelete">
<mat-icon class="md-24">delete</mat-icon>
</button>
</div>
</div>
<div style="display:flex; justify-content: space-between;">
<div style="display: flex; align-items: center;">
<button mat-mini-fab color="primary" (click)="addFromInput()" style="box-shadow: none; height: 16px; width: 16px; display:flex"
data-tests-id="btnAddInput">
<span style="padding-left: 2px; display: flex; justify-content: center; align-items: center" [innerHTML]="'plus' | feather:12"></span>
<!-- <mat-icon>add</mat-icon> -->
</button>
<span style="color: #009FDB; display: flex; justify-content: center; padding-top: 1px; padding-left: 6px;">Add input</span>
</div>
</div>
</div>
</form>
|
