summaryrefslogtreecommitdiffstats
path: root/ecomp-sdk/epsdk-app-overlay/src/main/webapp/ngapp/src/app/pages/analytics/Report_List/Report/columns/columns-edit-component/column-advanced-display/column-advanced-display.component.html
blob: 63d024b148deb63eaec0ed44b7304333e0b7bbb3 (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
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
<div class="field-group">
    <h3>Advanced Display Configuration</h3>
    <br/>
    <label class="defaultFontSize1">Display Name: </label>
    <input  [(ngModel)]="semaphore.semaphoreName" class="defaultFontSize" id="semaphoreName" name="displayName"
            style="width: 60%" type="text" >
</div>
<div class="field-group">
    <mat-form-field>
        <mat-label class="b2b-dro">Apply To:</mat-label>
        <mat-select data-select-color="blue" [(ngModel)]="semaphore.semaphoreType" aria-label="reportType" placeholder="Select chart Type">
            <mat-option value="CELL">Current Value Only</mat-option>
            <mat-option value="CELL">Entire Row</mat-option>
        </mat-select>
    </mat-form-field>
</div>
<div id="RangeTable">
    <table >
        <thead>
        <tr>
            <th>Expression</th>
            <th>ColumnValue</th>
            <th>Bold?</th>
            <th>Italic?</th>
            <th>Under line?</th>
            <th>Background Color</th>
            <th>Font Color</th>
            <th>Font Face</th>
            <th>Font Size</th>
            <th>Preview</th>
            <th>Delete</th>
        </tr>
        </thead>
        <tbody *ngFor="let format of semaphore.formatList.format; let i = index">
        <td *ngIf="i === 0">Any</td>
        <td *ngIf="i === 0">Value</td>
        <td *ngIf="i !== 0">
            <select name="choice" [(ngModel)]="format.expression" >
                <option value="=">=</option>
                <option value="&lt;&gt;">&lt;&gt;</option>
                <option value="&gt;"> &gt;</option>
                <option value="&gt;=">&gt;=</option>
                <option value="&lt;">&lt;</option>
                <option value="&lt;=">&lt;=</option>
            </select>
        </td>
        <td *ngIf="i !== 0">
            <input align="center" [(ngModel)]="format.lessThanValue" class="defaultFontSize" id="lessThanValue" name="displayName"
                   style="width: 100px;" type="text" >
        </td>
        <td>
            <label class="checkbox">
                <input [(ngModel)]="format.bold" class="defaultFontSize" type="checkbox">
                <i class="skin"></i>
            </label>
        </td>
        <td>
            <label class="checkbox">
                <input [(ngModel)]="format.italic" class="defaultFontSize" type="checkbox">
                <i class="skin"></i>
            </label>
        </td>
        <td>
            <label class="checkbox">
                <input [(ngModel)]="format.underline" class="defaultFontSize" type="checkbox">
                <i class="skin"></i>
            </label>
        </td>
        <td>
            <select name="choice" [(ngModel)]="format.bgColor" >
                <option *ngFor="let color of rangeColors" [value]="color.value">
                    {{color.title}}
                </option>
            </select>
        </td>
        <td>
            <select name="choice" [(ngModel)]="format.fontColor" >
                <option *ngFor="let color of rangeColors" [value]="color.value">
                    {{color.title}}
                </option>
            </select>
        </td>
        <td>
            <select name="choice" [(ngModel)]="format.fontFace" >
                <option *ngFor="let face of fontFamily" [value]="face.value">
                    {{face.title}}
                </option>
            </select>
        </td>
        <td>
            <select name="choice" [(ngModel)]="format.fontSize" >
                <option value="6">6</option>
                <option value="8">8</option>
                <option value="9">9</option>
                <option value="10">10</option>
                <option value="11">11</option>
                <option value="12">12</option>
                <option value="14">14</option>
                <option value="16">16</option>
                <option value="18">18</option>
                <option value="24">24</option>
                <option value="36">36</option>
                <option value="48">48</option>
                <option value="72">72</option>
            </select>
        </td>
        <td>
            <span #sample [ngStyle]=setStyle(format)> sample</span>
        </td>
        <td *ngIf="i !=0"><mat-icon aria-hidden="false" aria-label="delete" (click)="deleteFormat(format)">delete</mat-icon>&nbsp;
        </td>
        <td *ngIf="i === 0">
        </td>
        </tbody>
    </table>
    <br/>
    <div style="width: 1000px; padding-left: 770px;">
        <button  (click)="addNewFormat();" class="btn btn-alt btn-small">Add Format</button>&nbsp;
    </div>
    <br/>
    <button (click)="saveDisplayData();" class="btn btn-alt btn-small">Save & Close</button>&nbsp;&nbsp;
</div>