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
|
<!--
* ============LICENSE_START=======================================================
* SDC
* ================================================================================
* Copyright (C) 2021 Nordix Foundation. All rights reserved.
* ================================================================================
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
* ============LICENSE_END=========================================================
-->
<div class="attributes-table">
<loader [display]="isLoading" [size]="'large'" [relative]="true" [loaderDelay]="500"></loader>
<div class="table-header">
<div class="table-cell col1" (click)="sort('name')">Attribute Name
<span *ngIf="sortBy === 'name'" class="table-header-sort-arrow" [ngClass]="{'down': reverse, 'up':!reverse}">
</span>
</div>
<div class="table-cell col2" (click)="sort('type')" *ngIf="!hideAttributeType">Type
<span *ngIf="sortBy === 'type'" class="table-header-sort-arrow" [ngClass]="{'down': reverse, 'up':!reverse}">
</span>
</div>
<div class="table-cell col3" (click)="sort('schema.property.type')" *ngIf="!hideAttributeType">EntrySchema
<span *ngIf="sortBy === 'schema.property.type'" class="table-header-sort-arrow" [ngClass]="{'down': reverse, 'up':!reverse}">
</span>
</div>
<div class="table-cell valueCol">Value</div>
</div>
<div class="table-body" [ngClass]="{'view-mode': readonly}">
<div class="no-data" *ngIf="!feAttributesMap || !(feAttributesMap | keys).length">No data to display</div>
<ng-container *ngFor="let instanceId of feAttributesMap | keys; trackBy:vspId">
<!-- Icon & Instance Name -->
<div class="table-rows-header white-sub-header" *ngIf="feInstanceNamesMap">
<span [ngClass]="['attrib-instance-icon', feInstanceNamesMap[instanceId].iconClass, 'small']"></span>
{{feInstanceNamesMap[instanceId].name}}
<div class="sprite-new archive-label" *ngIf="feInstanceNamesMap[instanceId].originArchived == true"></div>
</div>
<div class="table-row" *ngFor="let property of feAttributesMap[instanceId] | searchFilter:'name':searchTerm | propertiesOrderBy:{path: path, direction: direction}; trackBy:property?.name "
(click)="onClickAttributeRow(property, instanceId, $event)" [ngClass]="{'selected': selectedAttributeId && selectedAttributeId === property.name, 'readonly': property.isDisabled || property.isDeclared}">
<div class="table-cell col1" [ngClass]="{'filtered':property.name === attributeNameSearchText}" [class.round-checkbox]="property.isDeclared">
<!-- Attribute Name -->
<div class="attribute-name">
<checkbox *ngIf="hasDeclareOption" [(checked)]="property.isSelected" [disabled]="property.isDisabled || property.isDeclared || readonly"
(checkedChange)="attributeChecked(property)" [attr.data-tests-id]="property.name"></checkbox>
<div class="inner-cell-div-multiline" tooltip="{{property.name}}">
<multiline-ellipsis className="table-cell-multiline-ellipsis" [lines]="2">{{property.name}}</multiline-ellipsis>
</div>
</div>
<span *ngIf="property.description" class="property-description-icon sprite-new show-desc" tooltip="{{property.description}}"
tooltipDelay="0"></span>
</div>
<!-- Attribute Type -->
<div class="table-cell col2" *ngIf="!hideAttributeType">
<div class="inner-cell-div" tooltip="{{property.type | contentAfterLastDot}}">
<span>{{property.type | contentAfterLastDot}}</span>
</div>
</div>
<!-- Attribute ES (Entry Schema) -->
<div class="table-cell col3" *ngIf="!hideAttributeType">
<div *ngIf="property.schema && property.schema.property && property.schema.property.type" class="inner-cell-div" tooltip="{{property.schema.property.type | contentAfterLastDot}}">
<span>{{property.schema.property.type | contentAfterLastDot}}</span>
</div>
</div>
<!-- Attribute Value -->
<div class="table-cell valueCol">
<dynamic-property
[selectedAttributeId]="selectedAttributeId"
[hasDeclareOption]="hasDeclareOption"
[canBeDeclared]="hasDeclareOption && true"
[attribute]="property"
[expandedChildId]="property.expandedChildPropertyId"
[attributeNameSearchText]="attributeNameSearchText"
[readonly]="readonly"
(attributeChanged)="onAttributeChanged(property)"
(expandChild)="property.updateExpandedChildPropertyId($event)"
(clickOnAttributeRow)="onClickAttributeInnerRow($event, instanceId)"
(checkAttribute)="attributeChecked(property, $event)"
>
</dynamic-property>
</div>
</div>
</ng-container>
</div>
</div>
|
