简柏林 / thingskit · Commits

Commit c0d9f1da7fbcdcc988f86c9d3c9727d587873ac4

Authored by Vladyslav
Committed by GitHub
1 parent 67d9b094

[3.0] New samples for custom action with html (#2549) 

* Update example custom action to new Angular

* Save settings to change type custom action

* Revert change
Inline Side-by-side
Showing 4 changed files with 607 additions and 644 deletions
1 -/*================================================================================*/  
2 -/*======================= New TB 3.0 / Angular 8 Example =======================*/  
3 -/*================================================================================*/  
4 -/*  
5 -.edit-entity-form mat-form-field {  
6 - padding-right: 10px;  
7 -}  
8 -*/  
9 /*=======================================================================*/ 1 /*=======================================================================*/
10 /*========== There are two examples: for edit and add entity ==========*/ 2 /*========== There are two examples: for edit and add entity ==========*/
11 /*=======================================================================*/ 3 /*=======================================================================*/
12 /*======================== Edit entity example ========================*/ 4 /*======================== Edit entity example ========================*/
13 /*=======================================================================*/ 5 /*=======================================================================*/
14 /* 6 /*
15 -.edit-entity-form md-input-container {  
16 - padding-right: 10px;  
17 -}  
18 -  
19 .edit-entity-form .boolean-value-input { 7 .edit-entity-form .boolean-value-input {
20 padding-left: 5px; 8 padding-left: 5px;
21 } 9 }
@@ -41,6 +29,10 @@ @@ -41,6 +29,10 @@
41 white-space: nowrap; 29 white-space: nowrap;
42 } 30 }
43 31
  32 +.relations-list .mat-form-field-infix {
  33 + width: auto !important;
  34 +}
  35 +
44 .relations-list .body { 36 .relations-list .body {
45 padding-right: 5px; 37 padding-right: 5px;
46 padding-bottom: 15px; 38 padding-bottom: 15px;
@@ -56,26 +48,14 @@ @@ -56,26 +48,14 @@
56 padding-left: 5px; 48 padding-left: 5px;
57 } 49 }
58 50
59 -.relations-list .body md-autocomplete-wrap md-input-container {  
60 - height: 30px;  
61 -}  
62 -  
63 .relations-list .body .md-button { 51 .relations-list .body .md-button {
64 margin: 0; 52 margin: 0;
65 } 53 }
66 -  
67 -.relations-list.old-relations tb-entity-select tb-entity-autocomplete button {  
68 - display: none;  
69 -}  
70 */ 54 */
71 /*========================================================================*/ 55 /*========================================================================*/
72 /*========================= Add entity example =========================*/ 56 /*========================= Add entity example =========================*/
73 /*========================================================================*/ 57 /*========================================================================*/
74 /* 58 /*
75 -.add-entity-form md-input-container {  
76 - padding-right: 10px;  
77 -}  
78 -  
79 .add-entity-form .boolean-value-input { 59 .add-entity-form .boolean-value-input {
80 padding-left: 5px; 60 padding-left: 5px;
81 } 61 }
@@ -101,6 +81,10 @@ @@ -101,6 +81,10 @@
101 white-space: nowrap; 81 white-space: nowrap;
102 } 82 }
103 83
  84 +.relations-list .mat-form-field-infix {
  85 + width: auto !important;
  86 +}
  87 +
104 .relations-list .body { 88 .relations-list .body {
105 padding-right: 5px; 89 padding-right: 5px;
106 padding-bottom: 15px; 90 padding-bottom: 15px;
@@ -116,10 +100,6 @@ @@ -116,10 +100,6 @@
116 padding-left: 5px; 100 padding-left: 5px;
117 } 101 }
118 102
119 -.relations-list .body md-autocomplete-wrap md-input-container {  
120 - height: 30px;  
121 -}  
122 -  
123 .relations-list .body .md-button { 103 .relations-list .body .md-button {
124 margin: 0; 104 margin: 0;
125 } 105 }
1 <!--=======================================================================--> 1 <!--=======================================================================-->
2 -<!--=================== New TB 3.0 / Angular 8 Example =================-->  
3 -<!--=======================================================================-->  
4 -<!--<form #editEntityForm="ngForm" [formGroup]="editEntityFormGroup"-->  
5 -<!-- class="edit-entity-form"-->  
6 -<!-- (ngSubmit)="save()" style="width: 600px;">-->  
7 -<!-- <mat-toolbar fxLayout="row" color="primary">-->  
8 -<!-- <h2>Edit {{entityType.toLowerCase()}} {{entityName}}</h2>-->  
9 -<!-- <span fxFlex></span>-->  
10 -<!-- <button mat-button mat-icon-button-->  
11 -<!-- (click)="cancel()"-->  
12 -<!-- type="button">-->  
13 -<!-- <mat-icon class="material-icons">close</mat-icon>-->  
14 -<!-- </button>-->  
15 -<!-- </mat-toolbar>-->  
16 -<!-- <mat-progress-bar color="warn" mode="indeterminate" *ngIf="isLoading$ | async">-->  
17 -<!-- </mat-progress-bar>-->  
18 -<!-- <div style="height: 4px;" *ngIf="!(isLoading$ | async)"></div>-->  
19 -<!-- <div mat-dialog-content>-->  
20 -<!-- <div class="mat-padding" fxLayout="column">-->  
21 -<!-- <mat-form-field class="mat-block">-->  
22 -<!-- <mat-label>Entity name</mat-label>-->  
23 -<!-- <input matInput formControlName="entityName" required>-->  
24 -<!-- <mat-error *ngIf="editEntityFormGroup.get('entityName').hasError('required')">-->  
25 -<!-- Entity name required-->  
26 -<!-- </mat-error>-->  
27 -<!-- </mat-form-field>-->  
28 -<!-- </div> -->  
29 -<!-- </div>-->  
30 -<!-- <div mat-dialog-actions fxLayout="row">-->  
31 -<!-- <span fxFlex></span>-->  
32 -<!-- <button mat-button mat-raised-button color="primary"-->  
33 -<!-- type="submit"-->  
34 -<!-- [disabled]="(isLoading$ | async) || editEntityForm.invalid || !editEntityForm.dirty">-->  
35 -<!-- {{ 'action.save' | translate }}-->  
36 -<!-- </button>-->  
37 -<!-- <button mat-button color="primary"-->  
38 -<!-- style="margin-right: 20px;"-->  
39 -<!-- type="button"-->  
40 -<!-- [disabled]="(isLoading$ | async)"-->  
41 -<!-- (click)="cancel()" cdkFocusInitial>-->  
42 -<!-- {{ 'action.cancel' | translate }}-->  
43 -<!-- </button>-->  
44 -<!-- </div>-->  
45 -<!--</form>-->  
46 -<!--=======================================================================-->  
47 <!--===== There are two example templates: for edit and add entity =====--> 2 <!--===== There are two example templates: for edit and add entity =====-->
48 <!--=======================================================================--> 3 <!--=======================================================================-->
49 <!--======================== Edit entity example ========================--> 4 <!--======================== Edit entity example ========================-->
50 <!--=======================================================================--> 5 <!--=======================================================================-->
51 <!-- --> 6 <!-- -->
52 -<!--<md-dialog aria-label="Edit entity">-->  
53 -<!-- <form name="editEntityForm" class="edit-entity-form" ng-submit="vm.save()">-->  
54 -<!-- <md-toolbar>-->  
55 -<!-- <div class="md-toolbar-tools">-->  
56 -<!-- <h2>Edit {{vm.entityType.toLowerCase()}} {{vm.entityName}}</h2>-->  
57 -<!-- <span flex></span>-->  
58 -<!-- <md-button class="md-icon-button" ng-click="vm.cancel()">-->  
59 -<!-- <ng-md-icon icon="close" aria-label="Close"></ng-md-icon>-->  
60 -<!-- </md-button>--> 7 +<!--<form #editEntityForm="ngForm" [formGroup]="editEntityFormGroup"-->
  8 +<!-- (ngSubmit)="save()" class="edit-entity-form">-->
  9 +<!-- <mat-toolbar fxLayout="row" color="primary">-->
  10 +<!-- <h2>Edit {{entityType.toLowerCase()}} {{entityName}}</h2>-->
  11 +<!-- <span fxFlex></span>-->
  12 +<!-- <button mat-icon-button (click)="cancel()" type="button">-->
  13 +<!-- <mat-icon class="material-icons">close</mat-icon>-->
  14 +<!-- </button>-->
  15 +<!-- </mat-toolbar>-->
  16 +<!-- <mat-progress-bar color="warn" mode="indeterminate" *ngIf="isLoading$ | async">-->
  17 +<!-- </mat-progress-bar>-->
  18 +<!-- <div style="height: 4px;" *ngIf="!(isLoading$ | async)"></div>-->
  19 +<!-- <div mat-dialog-content fxLayout="column">-->
  20 +<!-- <div fxLayout="row" fxLayoutGap="8px" fxLayout.xs="column" fxLayoutGap.xs="0">-->
  21 +<!-- <mat-form-field fxFlex class="mat-block">-->
  22 +<!-- <mat-label>Entity Name</mat-label>-->
  23 +<!-- <input matInput formControlName="entityName" required readonly="">-->
  24 +<!-- </mat-form-field>-->
  25 +<!-- <mat-form-field fxFlex class="mat-block">-->
  26 +<!-- <mat-label>Entity Label</mat-label>-->
  27 +<!-- <input matInput formControlName="entityLabel">-->
  28 +<!-- </mat-form-field>-->
  29 +<!-- </div>-->
  30 +<!-- <div fxLayout="row" fxLayoutGap="8px" fxLayout.xs="column" fxLayoutGap.xs="0">-->
  31 +<!-- <mat-form-field fxFlex class="mat-block">-->
  32 +<!-- <mat-label>Entity Type</mat-label>-->
  33 +<!-- <input matInput formControlName="entityType" readonly>-->
  34 +<!-- </mat-form-field>-->
  35 +<!-- <mat-form-field fxFlex class="mat-block">-->
  36 +<!-- <mat-label>Type</mat-label>-->
  37 +<!-- <input matInput formControlName="type" readonly>-->
  38 +<!-- </mat-form-field>-->
  39 +<!-- </div>-->
  40 +<!-- <div formGroupName="attributes" fxLayout="column">-->
  41 +<!-- <div fxLayout="row" fxLayoutGap="8px" fxLayout.xs="column" fxLayoutGap.xs="0">-->
  42 +<!-- <mat-form-field fxFlex class="mat-block">-->
  43 +<!-- <mat-label>Latitude</mat-label>-->
  44 +<!-- <input type="number" step="any" matInput formControlName="latitude">-->
  45 +<!-- </mat-form-field>-->
  46 +<!-- <mat-form-field fxFlex class="mat-block">-->
  47 +<!-- <mat-label>Longitude</mat-label>-->
  48 +<!-- <input type="number" step="any" matInput formControlName="longitude">-->
  49 +<!-- </mat-form-field>-->
61 <!-- </div>--> 50 <!-- </div>-->
62 -<!-- </md-toolbar>-->  
63 -<!-- <md-dialog-content>-->  
64 -<!-- <div class="md-dialog-content">-->  
65 -<!-- <div layout="row">-->  
66 -<!-- <md-input-container flex class="md-block">-->  
67 -<!-- <label>Entity Name</label>-->  
68 -<!-- <input ng-model="vm.entityName" readonly>-->  
69 -<!-- </md-input-container>-->  
70 -<!-- <md-input-container flex class="md-block">-->  
71 -<!-- <label>Entity Type</label>-->  
72 -<!-- <input ng-model="vm.entityType" readonly>-->  
73 -<!-- </md-input-container>-->  
74 -<!-- <md-input-container flex class="md-block">-->  
75 -<!-- <label>Type</label>-->  
76 -<!-- <input ng-model="vm.type" readonly>-->  
77 -<!-- </md-input-container>-->  
78 -<!-- </div>-->  
79 -<!-- <div layout="row">-->  
80 -<!-- <md-input-container flex class="md-block">-->  
81 -<!-- <label>Latitude</label>-->  
82 -<!-- <input name="latitude" type="number" step="any" ng-model="vm.attributes.latitude">-->  
83 -<!-- </md-input-container>-->  
84 -<!-- <md-input-container flex class="md-block">-->  
85 -<!-- <label>Longitude</label>-->  
86 -<!-- <input name="longitude" type="number" step="any" ng-model="vm.attributes.longitude">-->  
87 -<!-- </md-input-container>-->  
88 -<!-- </div>-->  
89 -<!-- <div layout="row">-->  
90 -<!-- <md-input-container flex class="md-block">-->  
91 -<!-- <label>Address</label>-->  
92 -<!-- <input ng-model="vm.attributes.address">-->  
93 -<!-- </md-input-container>-->  
94 -<!-- <md-input-container flex class="md-block">-->  
95 -<!-- <label>Owner</label>-->  
96 -<!-- <input ng-model="vm.attributes.owner">-->  
97 -<!-- </md-input-container>-->  
98 -<!-- </div>-->  
99 -<!-- <div layout="row">-->  
100 -<!-- <md-input-container flex class="md-block">-->  
101 -<!-- <label>Integer Value</label>-->  
102 -<!-- <input name="integerNumber" type="number" step="1" ng-pattern="/^-?[0-9]+$/" ng-model="vm.attributes.number">-->  
103 -<!-- <div ng-messages="editEntityForm.integerNumber.$error">-->  
104 -<!-- <div ng-message="pattern">Invalid integer value.</div>-->  
105 -<!-- </div>-->  
106 -<!-- </md-input-container>-->  
107 -<!-- <div class="boolean-value-input" layout="column" layout-align="center start" flex>-->  
108 -<!-- <label class="checkbox-label">Boolean Value</label>-->  
109 -<!-- <md-checkbox ng-model="vm.attributes.booleanValue" style="margin-bottom: 40px;">-->  
110 -<!-- {{ (vm.attributes.booleanValue ? "value.true" : "value.false") | translate }}-->  
111 -<!-- </md-checkbox>-->  
112 -<!-- </div>--> 51 +<!-- <div fxLayout="row" fxLayoutGap="8px" fxLayout.xs="column" fxLayoutGap.xs="0">-->
  52 +<!-- <mat-form-field fxFlex class="mat-block">-->
  53 +<!-- <mat-label>Address</mat-label>-->
  54 +<!-- <input matInput formControlName="address">-->
  55 +<!-- </mat-form-field>-->
  56 +<!-- <mat-form-field fxFlex class="mat-block">-->
  57 +<!-- <mat-label>Owner</mat-label>-->
  58 +<!-- <input matInput formControlName="owner">-->
  59 +<!-- </mat-form-field>-->
  60 +<!-- </div>-->
  61 +<!-- <div fxLayout="row" fxLayoutGap="8px" fxLayout.xs="column" fxLayoutGap.xs="0">-->
  62 +<!-- <mat-form-field fxFlex class="mat-block">-->
  63 +<!-- <mat-label>Integer Value</mat-label>-->
  64 +<!-- <input type="number" step="1" matInput formControlName="number">-->
  65 +<!-- <mat-error *ngIf="editEntityFormGroup.get('attributes').get('number').hasError('pattern')">-->
  66 +<!-- Invalid integer value.-->
  67 +<!-- </mat-error>-->
  68 +<!-- </mat-form-field>-->
  69 +<!-- <div class="boolean-value-input" fxLayout="column" fxLayoutAlign="center start" fxFlex>-->
  70 +<!-- <label class="checkbox-label">Boolean Value</label>-->
  71 +<!-- <mat-checkbox formControlName="booleanValue" style="margin-bottom: 40px;">-->
  72 +<!-- {{ (editEntityFormGroup.get('attributes').get('booleanValue').value ? "value.true" : "value.false") | translate }}-->
  73 +<!-- </mat-checkbox>-->
113 <!-- </div>--> 74 <!-- </div>-->
114 -<!-- <div class="relations-list old-relations">-->  
115 -<!-- <div class="md-body-1" style="padding-bottom: 10px; color: rgba(0,0,0,0.57);">Relations</div>-->  
116 -<!-- <div class="body" ng-show="vm.relations.length">-->  
117 -<!-- <div class="row" layout="row" layout-align="start center" ng-repeat="relation in vm.relations track by $index">-->  
118 -<!-- <div class="md-whiteframe-1dp" flex layout="row" style="padding-left: 5px; margin-bottom: 3px;">-->  
119 -<!-- <div flex layout="column">-->  
120 -<!-- <div layout="row">-->  
121 -<!-- <md-input-container class="md-block" style="min-width: 100px;">-->  
122 -<!-- <label>Direction</label>-->  
123 -<!-- <md-select ng-disabled="true" required ng-model="relation.direction">-->  
124 -<!-- <md-option ng-repeat="direction in vm.entitySearchDirection" ng-value="direction">-->  
125 -<!-- {{ ("relation.search-direction." + direction) | translate}}-->  
126 -<!-- </md-option>-->  
127 -<!-- </md-select>-->  
128 -<!-- </md-input-container>-->  
129 -<!-- <tb-relation-type-autocomplete ng-disabled="true" flex class="md-block"-->  
130 -<!-- the-form="editEntityForm"-->  
131 -<!-- ng-model="relation.relationType"-->  
132 -<!-- tb-required="true">-->  
133 -<!-- </tb-relation-type-autocomplete>-->  
134 -<!-- </div>-->  
135 -<!-- <div layout="row">-->  
136 -<!-- <tb-entity-select flex class="md-block"-->  
137 -<!-- the-form="editEntityForm"-->  
138 -<!-- ng-disabled="true"-->  
139 -<!-- tb-required="true"-->  
140 -<!-- ng-model="relation.relatedEntity">-->  
141 -<!-- </tb-entity-select>-->  
142 -<!-- </div>-->  
143 -<!-- </div>-->  
144 -<!-- <div layout="column" layout-align="center center">-->  
145 -<!-- <md-button class="md-icon-button md-primary" style="width: 40px; min-width: 40px;"-->  
146 -<!-- ng-click="vm.removeOldRelation($index,relation)" aria-label="Remove">-->  
147 -<!-- <md-tooltip md-direction="top">Remove relation</md-tooltip>-->  
148 -<!-- <md-icon aria-label="Remove" class="material-icons">-->  
149 -<!-- close-->  
150 -<!-- </md-icon>-->  
151 -<!-- </md-button>-->  
152 -<!-- </div>--> 75 +<!-- </div>-->
  76 +<!-- </div>-->
  77 +<!-- <div class="relations-list old-relations">-->
  78 +<!-- <div class="mat-body-1" style="padding-bottom: 10px; color: rgba(0,0,0,0.57);">Relations</div>-->
  79 +<!-- <div class="body" [fxShow]="oldRelations().length">-->
  80 +<!-- <div class="row" fxLayout="row" fxLayoutAlign="start center" formArrayName="oldRelations" -->
  81 +<!-- *ngFor="let relation of oldRelations().controls; let i = index;">-->
  82 +<!-- <div [formGroupName]="i" class="mat-elevation-z2" fxFlex fxLayout="row" style="padding: 5px 0 5px 5px;">-->
  83 +<!-- <div fxFlex fxLayout="column">-->
  84 +<!-- <div fxLayout="row" fxLayoutGap="8px" fxLayout.xs="column" fxLayoutGap.xs="0">-->
  85 +<!-- <mat-form-field class="mat-block" style="min-width: 100px;">-->
  86 +<!-- <mat-label>Direction</mat-label>-->
  87 +<!-- <mat-select formControlName="direction" name="direction">-->
  88 +<!-- <mat-option *ngFor="let direction of entitySearchDirection | keyvalue" [value]="direction.value">-->
  89 +<!-- {{ ("relation.search-direction." + direction.value) | translate}}-->
  90 +<!-- </mat-option>-->
  91 +<!-- </mat-select>-->
  92 +<!-- <mat-error *ngIf="relation.get('direction').hasError('required')">-->
  93 +<!-- Relation direction is required.-->
  94 +<!-- </mat-error>-->
  95 +<!-- </mat-form-field>-->
  96 +<!-- <tb-relation-type-autocomplete-->
  97 +<!-- fxFlex class="mat-block"-->
  98 +<!-- formControlName="relationType"-->
  99 +<!-- required="true">-->
  100 +<!-- </tb-relation-type-autocomplete>-->
153 <!-- </div>--> 101 <!-- </div>-->
  102 +<!-- <div fxLayout="row" fxLayout.xs="column">-->
  103 +<!-- <tb-entity-select-->
  104 +<!-- fxFlex class="mat-block"-->
  105 +<!-- required="true"-->
  106 +<!-- formControlName="relatedEntity">-->
  107 +<!-- </tb-entity-select>-->
  108 +<!-- </div>-->
  109 +<!-- </div>-->
  110 +<!-- <div fxLayout="column" fxLayoutAlign="center center">-->
  111 +<!-- <button mat-icon-button color="primary"-->
  112 +<!-- aria-label="Remove"-->
  113 +<!-- type="button"-->
  114 +<!-- (click)="removeOldRelation(i)"-->
  115 +<!-- matTooltip="Remove relation"-->
  116 +<!-- matTooltipPosition="above">-->
  117 +<!-- <mat-icon>close</mat-icon>-->
  118 +<!-- </button>-->
154 <!-- </div>--> 119 <!-- </div>-->
155 <!-- </div>--> 120 <!-- </div>-->
156 <!-- </div>--> 121 <!-- </div>-->
157 -<!-- <div class="relations-list">-->  
158 -<!-- <div class="md-body-1" style="padding-bottom: 10px; color: rgba(0,0,0,0.57);">New Relations</div>-->  
159 -<!-- <div class="body" ng-show="vm.newRelations.length">-->  
160 -<!-- <div class="row" layout="row" layout-align="start center" ng-repeat="relation in vm.newRelations track by $index">-->  
161 -<!-- <div class="md-whiteframe-1dp" flex layout="row" style="padding-left: 5px; margin-bottom: 3px;">-->  
162 -<!-- <div flex layout="column">-->  
163 -<!-- <div layout="row">-->  
164 -<!-- <md-input-container class="md-block" style="min-width: 100px;">-->  
165 -<!-- <label>Direction</label>-->  
166 -<!-- <md-select name="direction" required ng-model="relation.direction">-->  
167 -<!-- <md-option ng-repeat="direction in vm.entitySearchDirection" ng-value="direction">-->  
168 -<!-- {{ ("relation.search-direction." + direction) | translate}}-->  
169 -<!-- </md-option>-->  
170 -<!-- </md-select>-->  
171 -<!-- <div ng-messages="editEntityForm.direction.$error">-->  
172 -<!-- <div ng-message="required">Relation direction is required.</div>-->  
173 -<!-- </div>-->  
174 -<!-- </md-input-container>-->  
175 -<!-- <tb-relation-type-autocomplete flex class="md-block"-->  
176 -<!-- the-form="editEntityForm"-->  
177 -<!-- ng-model="relation.relationType"-->  
178 -<!-- tb-required="true">-->  
179 -<!-- </tb-relation-type-autocomplete>-->  
180 -<!-- </div>-->  
181 -<!-- <div layout="row">-->  
182 -<!-- <tb-entity-select flex class="md-block"-->  
183 -<!-- the-form="editEntityForm"-->  
184 -<!-- tb-required="true"-->  
185 -<!-- ng-model="relation.relatedEntity">-->  
186 -<!-- </tb-entity-select>-->  
187 -<!-- </div>-->  
188 -<!-- </div>-->  
189 -<!-- <div layout="column" layout-align="center center">-->  
190 -<!-- <md-button class="md-icon-button md-primary" style="width: 40px; min-width: 40px;"-->  
191 -<!-- ng-click="vm.removeRelation($index)" aria-label="Remove">-->  
192 -<!-- <md-tooltip md-direction="top">Remove relation</md-tooltip>-->  
193 -<!-- <md-icon aria-label="Remove" class="material-icons">-->  
194 -<!-- close-->  
195 -<!-- </md-icon>-->  
196 -<!-- </md-button>-->  
197 -<!-- </div>--> 122 +<!-- </div>-->
  123 +<!-- </div>-->
  124 +<!-- <div class="relations-list">-->
  125 +<!-- <div class="mat-body-1" style="padding-bottom: 10px; color: rgba(0,0,0,0.57);">New Relations</div>-->
  126 +<!-- <div class="body" [fxShow]="relations().length">-->
  127 +<!-- <div class="row" fxLayout="row" fxLayoutAlign="start center" formArrayName="relations" *ngFor="let relation of relations().controls; let i = index;">-->
  128 +<!-- <div [formGroupName]="i" class="mat-elevation-z2" fxFlex fxLayout="row" style="padding: 5px 0 5px 5px;">-->
  129 +<!-- <div fxFlex fxLayout="column">-->
  130 +<!-- <div fxLayout="row" fxLayoutGap="8px" fxLayout.xs="column" fxLayoutGap.xs="0">-->
  131 +<!-- <mat-form-field class="mat-block" style="min-width: 100px;">-->
  132 +<!-- <mat-label>Direction</mat-label>-->
  133 +<!-- <mat-select formControlName="direction" name="direction">-->
  134 +<!-- <mat-option *ngFor="let direction of entitySearchDirection | keyvalue" [value]="direction.value">-->
  135 +<!-- {{ ("relation.search-direction." + direction.value) | translate}}-->
  136 +<!-- </mat-option>-->
  137 +<!-- </mat-select>-->
  138 +<!-- <mat-error *ngIf="relation.get('direction').hasError('required')">-->
  139 +<!-- Relation direction is required.-->
  140 +<!-- </mat-error>-->
  141 +<!-- </mat-form-field>-->
  142 +<!-- <tb-relation-type-autocomplete-->
  143 +<!-- fxFlex class="mat-block"-->
  144 +<!-- formControlName="relationType"-->
  145 +<!-- [required]="true">-->
  146 +<!-- </tb-relation-type-autocomplete>-->
  147 +<!-- </div>-->
  148 +<!-- <div fxLayout="row" fxLayout.xs="column">-->
  149 +<!-- <tb-entity-select-->
  150 +<!-- fxFlex class="mat-block"-->
  151 +<!-- [required]="true"-->
  152 +<!-- formControlName="relatedEntity">-->
  153 +<!-- </tb-entity-select>-->
198 <!-- </div>--> 154 <!-- </div>-->
199 <!-- </div>--> 155 <!-- </div>-->
  156 +<!-- <div fxLayout="column" fxLayoutAlign="center center">-->
  157 +<!-- <button mat-icon-button color="primary"-->
  158 +<!-- aria-label="Remove"-->
  159 +<!-- type="button"-->
  160 +<!-- (click)="removeRelation(i)"-->
  161 +<!-- matTooltip="Remove relation"-->
  162 +<!-- matTooltipPosition="above">-->
  163 +<!-- <mat-icon>close</mat-icon>-->
  164 +<!-- </button>-->
  165 +<!-- </div>-->
200 <!-- </div>--> 166 <!-- </div>-->
201 -<!-- <div>-->  
202 -<!-- <md-button class="md-primary md-raised" ng-click="vm.addRelation()" aria-label="Add">-->  
203 -<!-- <md-tooltip md-direction="top">Add Relation</md-tooltip>-->  
204 -<!-- Add-->  
205 -<!-- </md-button>-->  
206 -<!-- </div> -->  
207 <!-- </div>--> 167 <!-- </div>-->
208 <!-- </div>--> 168 <!-- </div>-->
209 -<!-- </md-dialog-content>-->  
210 -<!-- <md-dialog-actions>-->  
211 -<!-- <md-button type="submit" ng-disabled="editEntityForm.$invalid || !editEntityForm.$dirty" class="md-raised md-primary">Save</md-button>-->  
212 -<!-- <md-button ng-click="vm.cancel()" class="md-primary">Cancel</md-button>-->  
213 -<!-- </md-dialog-actions>-->  
214 -<!-- </form>-->  
215 -<!--</md-dialog>--> 169 +<!-- <div>-->
  170 +<!-- <button mat-raised-button color="primary"-->
  171 +<!-- type="button"-->
  172 +<!-- (click)="addRelation()"-->
  173 +<!-- matTooltip="Add Relation"-->
  174 +<!-- matTooltipPosition="above">-->
  175 +<!-- Add-->
  176 +<!-- </button>-->
  177 +<!-- </div>-->
  178 +<!-- </div>-->
  179 +<!-- </div>-->
  180 +<!-- <div mat-dialog-actions fxLayout="row" fxLayoutAlign="end center">-->
  181 +<!-- <button mat-button mat-raised-button color="primary"-->
  182 +<!-- type="submit"-->
  183 +<!-- [disabled]="(isLoading$ | async) || editEntityForm.invalid || !editEntityForm.dirty">-->
  184 +<!-- Save-->
  185 +<!-- </button>-->
  186 +<!-- <button mat-button color="primary"-->
  187 +<!-- style="margin-right: 20px;"-->
  188 +<!-- type="button"-->
  189 +<!-- [disabled]="(isLoading$ | async)"-->
  190 +<!-- (click)="cancel()" cdkFocusInitial>-->
  191 +<!-- Cancel-->
  192 +<!-- </button>-->
  193 +<!-- </div>-->
  194 +<!--</form>-->
216 <!----> 195 <!---->
217 <!--========================================================================--> 196 <!--========================================================================-->
218 <!--========================= Add entity example =========================--> 197 <!--========================= Add entity example =========================-->
219 <!--========================================================================--> 198 <!--========================================================================-->
220 <!----> 199 <!---->
221 -<!--<md-dialog aria-label="Add entity">-->  
222 -<!-- <form name="addEntityForm" class="add-entity-form" ng-submit="vm.save()">-->  
223 -<!-- <md-toolbar>-->  
224 -<!-- <div class="md-toolbar-tools">-->  
225 -<!-- <h2>Add entity</h2>-->  
226 -<!-- <span flex></span>-->  
227 -<!-- <md-button class="md-icon-button" ng-click="vm.cancel()">-->  
228 -<!-- <ng-md-icon icon="close" aria-label="Close"></ng-md-icon>-->  
229 -<!-- </md-button>--> 200 +<!--<form #addEntityForm="ngForm" [formGroup]="addEntityFormGroup"-->
  201 +<!-- (ngSubmit)="save()" class="add-entity-form">-->
  202 +<!-- <mat-toolbar fxLayout="row" color="primary">-->
  203 +<!-- <h2>Add entity</h2>-->
  204 +<!-- <span fxFlex></span>-->
  205 +<!-- <button mat-icon-button (click)="cancel()" type="button">-->
  206 +<!-- <mat-icon class="material-icons">close</mat-icon>-->
  207 +<!-- </button>-->
  208 +<!-- </mat-toolbar>-->
  209 +<!-- <mat-progress-bar color="warn" mode="indeterminate" *ngIf="isLoading$ | async">-->
  210 +<!-- </mat-progress-bar>-->
  211 +<!-- <div style="height: 4px;" *ngIf="!(isLoading$ | async)"></div>-->
  212 +<!-- <div mat-dialog-content fxLayout="column">-->
  213 +<!-- <div fxLayout="row" fxLayoutGap="8px" fxLayout.xs="column" fxLayoutGap.xs="0">-->
  214 +<!-- <mat-form-field fxFlex class="mat-block">-->
  215 +<!-- <mat-label>Entity Name</mat-label>-->
  216 +<!-- <input matInput formControlName="entityName" required>-->
  217 +<!-- <mat-error *ngIf="addEntityFormGroup.get('entityName').hasError('required')">-->
  218 +<!-- Entity name is required.-->
  219 +<!-- </mat-error>-->
  220 +<!-- </mat-form-field>-->
  221 +<!-- <mat-form-field fxFlex class="mat-block">-->
  222 +<!-- <mat-label>Entity Label</mat-label>-->
  223 +<!-- <input matInput formControlName="entityLabel" >-->
  224 +<!-- </mat-form-field>-->
  225 +<!-- </div>-->
  226 +<!-- <div fxLayout="row" fxLayoutGap="8px" fxLayout.xs="column" fxLayoutGap.xs="0">-->
  227 +<!-- <tb-entity-type-select-->
  228 +<!-- class="mat-block"-->
  229 +<!-- formControlName="entityType"-->
  230 +<!-- [showLabel]="true"-->
  231 +<!-- [allowedEntityTypes]="allowedEntityTypes"-->
  232 +<!-- ></tb-entity-type-select>-->
  233 +<!-- <tb-entity-subtype-autocomplete-->
  234 +<!-- fxFlex *ngIf="addEntityFormGroup.get('entityType').value == 'ASSET'"-->
  235 +<!-- class="mat-block"-->
  236 +<!-- formControlName="type"-->
  237 +<!-- [required]="true"-->
  238 +<!-- [entityType]="'ASSET'"-->
  239 +<!-- ></tb-entity-subtype-autocomplete>-->
  240 +<!-- <tb-entity-subtype-autocomplete-->
  241 +<!-- fxFlex *ngIf="addEntityFormGroup.get('entityType').value != 'ASSET'"-->
  242 +<!-- class="mat-block"-->
  243 +<!-- formControlName="type"-->
  244 +<!-- [required]="true"-->
  245 +<!-- [entityType]="'DEVICE'"-->
  246 +<!-- ></tb-entity-subtype-autocomplete>-->
  247 +<!-- </div>-->
  248 +<!-- <div formGroupName="attributes" fxLayout="column">-->
  249 +<!-- <div fxLayout="row" fxLayoutGap="8px" fxLayout.xs="column" fxLayoutGap.xs="0">-->
  250 +<!-- <mat-form-field fxFlex class="mat-block">-->
  251 +<!-- <mat-label>Latitude</mat-label>-->
  252 +<!-- <input type="number" step="any" matInput formControlName="latitude">-->
  253 +<!-- </mat-form-field>-->
  254 +<!-- <mat-form-field fxFlex class="mat-block">-->
  255 +<!-- <mat-label>Longitude</mat-label>-->
  256 +<!-- <input type="number" step="any" matInput formControlName="longitude">-->
  257 +<!-- </mat-form-field>-->
230 <!-- </div>--> 258 <!-- </div>-->
231 -<!-- </md-toolbar>-->  
232 -<!-- <md-dialog-content>-->  
233 -<!-- <div class="md-dialog-content">-->  
234 -<!-- <div layout="row">-->  
235 -<!-- <md-input-container flex class="md-block">-->  
236 -<!-- <label>Entity Name</label>-->  
237 -<!-- <input ng-model="vm.entityName" name=entityName required>-->  
238 -<!-- <div ng-messages="addEntityForm.entityName.$error">-->  
239 -<!-- <div ng-message="required">Entity name is required.</div>-->  
240 -<!-- </div>-->  
241 -<!-- </md-input-container>-->  
242 -<!-- <tb-entity-type-select class="md-block" style="min-width: 100px; width: 100px;"-->  
243 -<!-- the-form="addEntityForm"-->  
244 -<!-- tb-required="true"-->  
245 -<!-- allowed-entity-types="vm.allowedEntityTypes"-->  
246 -<!-- ng-model="vm.entityType">-->  
247 -<!-- </tb-entity-type-select>-->  
248 -<!-- <md-input-container flex class="md-block">-->  
249 -<!-- <label>Entity Subtype</label>-->  
250 -<!-- <input ng-model="vm.type" name=type required>-->  
251 -<!-- <div ng-messages="addEntityForm.type.$error">-->  
252 -<!-- <div ng-message="required">Entity subtype is required.</div>-->  
253 -<!-- </div>-->  
254 -<!-- </md-input-container>-->  
255 -<!-- </div>-->  
256 -<!-- <div layout="row">-->  
257 -<!-- <md-input-container flex class="md-block">-->  
258 -<!-- <label>Latitude</label>-->  
259 -<!-- <input name="latitude" type="number" step="any" ng-model="vm.attributes.latitude">-->  
260 -<!-- </md-input-container>-->  
261 -<!-- <md-input-container flex class="md-block">-->  
262 -<!-- <label>Longitude</label>-->  
263 -<!-- <input name="longitude" type="number" step="any" ng-model="vm.attributes.longitude">-->  
264 -<!-- </md-input-container>-->  
265 -<!-- </div>-->  
266 -<!-- <div layout="row">-->  
267 -<!-- <md-input-container flex class="md-block">-->  
268 -<!-- <label>Address</label>-->  
269 -<!-- <input ng-model="vm.attributes.address">-->  
270 -<!-- </md-input-container>-->  
271 -<!-- <md-input-container flex class="md-block">-->  
272 -<!-- <label>Owner</label>-->  
273 -<!-- <input ng-model="vm.attributes.owner">-->  
274 -<!-- </md-input-container>-->  
275 -<!-- </div>-->  
276 -<!-- <div layout="row">-->  
277 -<!-- <md-input-container flex class="md-block">-->  
278 -<!-- <label>Integer Value</label>-->  
279 -<!-- <input name="integerNumber" type="number" step="1" ng-pattern="/^-?[0-9]+$/" ng-model="vm.attributes.number">-->  
280 -<!-- <div ng-messages="addEntityForm.integerNumber.$error">-->  
281 -<!-- <div ng-message="pattern">Invalid integer value.</div>-->  
282 -<!-- </div>-->  
283 -<!-- </md-input-container>-->  
284 -<!-- <div class="boolean-value-input" layout="column" layout-align="center start" flex>-->  
285 -<!-- <label class="checkbox-label">Boolean Value</label>-->  
286 -<!-- <md-checkbox ng-model="vm.attributes.booleanValue" style="margin-bottom: 40px;">-->  
287 -<!-- {{ (vm.attributes.booleanValue ? "value.true" : "value.false") | translate }}-->  
288 -<!-- </md-checkbox>-->  
289 -<!-- </div>--> 259 +<!-- <div fxLayout="row" fxLayoutGap="8px" fxLayout.xs="column" fxLayoutGap.xs="0">-->
  260 +<!-- <mat-form-field fxFlex class="mat-block">-->
  261 +<!-- <mat-label>Address</mat-label>-->
  262 +<!-- <input matInput formControlName="address">-->
  263 +<!-- </mat-form-field>-->
  264 +<!-- <mat-form-field fxFlex class="mat-block">-->
  265 +<!-- <mat-label>Owner</mat-label>-->
  266 +<!-- <input matInput formControlName="owner">-->
  267 +<!-- </mat-form-field>-->
  268 +<!-- </div>-->
  269 +<!-- <div fxLayout="row" fxLayoutGap="8px" fxLayout.xs="column" fxLayoutGap.xs="0">-->
  270 +<!-- <mat-form-field fxFlex class="mat-block">-->
  271 +<!-- <mat-label>Integer Value</mat-label>-->
  272 +<!-- <input type="number" step="1" matInput formControlName="number">-->
  273 +<!-- <mat-error *ngIf="addEntityFormGroup.get('attributes').get('number').hasError('pattern')">-->
  274 +<!-- Invalid integer value.-->
  275 +<!-- </mat-error>-->
  276 +<!-- </mat-form-field>-->
  277 +<!-- <div class="boolean-value-input" fxLayout="column" fxLayoutAlign="center start" fxFlex>-->
  278 +<!-- <label class="checkbox-label">Boolean Value</label>-->
  279 +<!-- <mat-checkbox formControlName="booleanValue" style="margin-bottom: 40px;">-->
  280 +<!-- {{ (addEntityFormGroup.get('attributes').get('booleanValue').value ? "value.true" : "value.false") | translate }}-->
  281 +<!-- </mat-checkbox>-->
290 <!-- </div>--> 282 <!-- </div>-->
291 -<!-- <div class="relations-list">-->  
292 -<!-- <div class="md-body-1" style="padding-bottom: 10px; color: rgba(0,0,0,0.57);">Relations</div>-->  
293 -<!-- <div class="body" ng-show="vm.relations.length">-->  
294 -<!-- <div class="row" layout="row" layout-align="start center" ng-repeat="relation in vm.relations track by $index">-->  
295 -<!-- <div class="md-whiteframe-1dp" flex layout="row" style="padding-left: 5px;">-->  
296 -<!-- <div flex layout="column">-->  
297 -<!-- <div layout="row">-->  
298 -<!-- <md-input-container class="md-block" style="min-width: 100px;">-->  
299 -<!-- <label>Direction</label>-->  
300 -<!-- <md-select name="direction" required ng-model="relation.direction">-->  
301 -<!-- <md-option ng-repeat="direction in vm.entitySearchDirection" ng-value="direction">-->  
302 -<!-- {{ ("relation.search-direction." + direction) | translate}}-->  
303 -<!-- </md-option>-->  
304 -<!-- </md-select>-->  
305 -<!-- <div ng-messages="addEntityForm.direction.$error">-->  
306 -<!-- <div ng-message="required">Relation direction is required.</div>-->  
307 -<!-- </div>-->  
308 -<!-- </md-input-container>-->  
309 -<!-- <tb-relation-type-autocomplete flex class="md-block"-->  
310 -<!-- the-form="addEntityForm"-->  
311 -<!-- ng-model="relation.relationType"-->  
312 -<!-- tb-required="true">-->  
313 -<!-- </tb-relation-type-autocomplete>-->  
314 -<!-- </div>-->  
315 -<!-- <div layout="row">-->  
316 -<!-- <tb-entity-select flex class="md-block"-->  
317 -<!-- the-form="addEntityForm"-->  
318 -<!-- tb-required="true"-->  
319 -<!-- ng-model="relation.relatedEntity">-->  
320 -<!-- </tb-entity-select>-->  
321 -<!-- </div>-->  
322 -<!-- </div>-->  
323 -<!-- <div layout="column" layout-align="center center">-->  
324 -<!-- <md-button class="md-icon-button md-primary" style="width: 40px; min-width: 40px;"-->  
325 -<!-- ng-click="vm.removeRelation($index)" aria-label="Remove">-->  
326 -<!-- <md-tooltip md-direction="top">Remove relation</md-tooltip>-->  
327 -<!-- <md-icon aria-label="Remove" class="material-icons">-->  
328 -<!-- close-->  
329 -<!-- </md-icon>-->  
330 -<!-- </md-button>-->  
331 -<!-- </div>--> 283 +<!-- </div>-->
  284 +<!-- </div>-->
  285 +<!-- <div class="relations-list">-->
  286 +<!-- <div class="mat-body-1" style="padding-bottom: 10px; color: rgba(0,0,0,0.57);">Relations</div>-->
  287 +<!-- <div class="body" [fxShow]="relations().length">-->
  288 +<!-- <div class="row" fxLayout="row" fxLayoutAlign="start center" formArrayName="relations" *ngFor="let relation of relations().controls; let i = index;">-->
  289 +<!-- <div [formGroupName]="i" class="mat-elevation-z2" fxFlex fxLayout="row" style="padding: 5px 0 5px 5px;">-->
  290 +<!-- <div fxFlex fxLayout="column">-->
  291 +<!-- <div fxLayout="row" fxLayoutGap="8px" fxLayout.xs="column" fxLayoutGap.xs="0">-->
  292 +<!-- <mat-form-field class="mat-block" style="min-width: 100px;">-->
  293 +<!-- <mat-label>Direction</mat-label>-->
  294 +<!-- <mat-select formControlName="direction" name="direction">-->
  295 +<!-- <mat-option *ngFor="let direction of entitySearchDirection | keyvalue" [value]="direction.value">-->
  296 +<!-- {{ ("relation.search-direction." + direction.value) | translate}}-->
  297 +<!-- </mat-option>-->
  298 +<!-- </mat-select>-->
  299 +<!-- <mat-error *ngIf="relation.get('direction').hasError('required')">-->
  300 +<!-- Relation direction is required.-->
  301 +<!-- </mat-error>-->
  302 +<!-- </mat-form-field>-->
  303 +<!-- <tb-relation-type-autocomplete-->
  304 +<!-- fxFlex class="mat-block"-->
  305 +<!-- formControlName="relationType"-->
  306 +<!-- [required]="true">-->
  307 +<!-- </tb-relation-type-autocomplete>-->
332 <!-- </div>--> 308 <!-- </div>-->
  309 +<!-- <div fxLayout="row" fxLayout.xs="column">-->
  310 +<!-- <tb-entity-select-->
  311 +<!-- fxFlex class="mat-block"-->
  312 +<!-- [required]="true"-->
  313 +<!-- formControlName="relatedEntity">-->
  314 +<!-- </tb-entity-select>-->
  315 +<!-- </div>-->
  316 +<!-- </div>-->
  317 +<!-- <div fxLayout="column" fxLayoutAlign="center center">-->
  318 +<!-- <button mat-icon-button color="primary"-->
  319 +<!-- aria-label="Remove"-->
  320 +<!-- type="button"-->
  321 +<!-- (click)="removeRelation(i)"-->
  322 +<!-- matTooltip="Remove relation"-->
  323 +<!-- matTooltipPosition="above">-->
  324 +<!-- <mat-icon>close</mat-icon>-->
  325 +<!-- </button>-->
333 <!-- </div>--> 326 <!-- </div>-->
334 <!-- </div>--> 327 <!-- </div>-->
335 -<!-- <div>-->  
336 -<!-- <md-button class="md-primary md-raised" ng-click="vm.addRelation()" aria-label="Add">-->  
337 -<!-- <md-tooltip md-direction="top">Add Relation</md-tooltip>-->  
338 -<!-- Add-->  
339 -<!-- </md-button>-->  
340 -<!-- </div> -->  
341 <!-- </div>--> 328 <!-- </div>-->
342 <!-- </div>--> 329 <!-- </div>-->
343 -<!-- </md-dialog-content>-->  
344 -<!-- <md-dialog-actions>-->  
345 -<!-- <md-button type="submit" ng-disabled="addEntityForm.$invalid || !addEntityForm.$dirty" class="md-raised md-primary">Create</md-button>-->  
346 -<!-- <md-button ng-click="vm.cancel()" class="md-primary">Cancel</md-button>-->  
347 -<!-- </md-dialog-actions>-->  
348 -<!-- </form>-->  
349 -<!--</md-dialog>--> 330 +<!-- <div>-->
  331 +<!-- <button mat-raised-button color="primary"-->
  332 +<!-- type="button"-->
  333 +<!-- (click)="addRelation()"-->
  334 +<!-- matTooltip="Add Relation"-->
  335 +<!-- matTooltipPosition="above">-->
  336 +<!-- Add-->
  337 +<!-- </button>-->
  338 +<!-- </div>-->
  339 +<!-- </div>-->
  340 +<!-- </div>-->
  341 +<!-- <div mat-dialog-actions fxLayout="row" fxLayoutAlign="end center">-->
  342 +<!-- <button mat-button mat-raised-button color="primary"-->
  343 +<!-- type="submit"-->
  344 +<!-- [disabled]="(isLoading$ | async) || addEntityForm.invalid || !addEntityForm.dirty">-->
  345 +<!-- Create-->
  346 +<!-- </button>-->
  347 +<!-- <button mat-button color="primary"-->
  348 +<!-- style="margin-right: 20px;"-->
  349 +<!-- type="button"-->
  350 +<!-- [disabled]="(isLoading$ | async)"-->
  351 +<!-- (click)="cancel()" cdkFocusInitial>-->
  352 +<!-- Cancel-->
  353 +<!-- </button>-->
  354 +<!-- </div>-->
  355 +<!--</form>-->
1 -/*================================================================================*/  
2 -/*======================= New TB 3.0 / Angular 8 Example =======================*/  
3 -/*================================================================================*/  
4 -//  
5 -//let $injector = widgetContext.$scope.$injector;  
6 -//let deviceService = $injector.get(widgetContext.servicesMap.get('deviceService'));  
7 -//  
8 -//deviceService.getDevice(entityId.id).subscribe(function(device) {  
9 -// console.log(device);  
10 -//});  
11 -//  
12 -//  
13 -//let customDialog = $injector.get(widgetContext.servicesMap.get('customDialog'));  
14 -//  
15 -//customDialog.customDialog(htmlTemplate, EditEntityDialogController).subscribe(  
16 -// function(res) {  
17 -// console.log(res);  
18 -// }  
19 -//);  
20 -//  
21 -//function EditEntityDialogController(instance) {  
22 -// let vm = instance;  
23 -// vm.entityId = entityId;  
24 -// vm.entityName = entityName;  
25 -// vm.entityType = entityId.entityType;  
26 -//  
27 -// vm.editEntityFormGroup = vm.fb.group({  
28 -// entityName: [vm.entityName, [vm.validators.required]]  
29 -// });  
30 -//  
31 -// vm.cancel = function() {  
32 -// vm.dialogRef.close(null);  
33 -// };  
34 -//  
35 -// vm.save = function() {  
36 -// const newVal = vm.editEntityFormGroup.value;  
37 -// vm.dialogRef.close(newVal);  
38 -// };  
39 -//}  
40 -//  
41 /*=======================================================================*/ 1 /*=======================================================================*/
42 /*===== There are three examples: for delete, edit and add entity =====*/ 2 /*===== There are three examples: for delete, edit and add entity =====*/
43 /*=======================================================================*/ 3 /*=======================================================================*/
44 /*======================= Delete entity example =======================*/ 4 /*======================= Delete entity example =======================*/
45 /*=======================================================================*/ 5 /*=======================================================================*/
46 // 6 //
47 -//var $injector = widgetContext.$scope.$injector;  
48 -//var $mdDialog = $injector.get('$mdDialog'),  
49 -// $document = $injector.get('$document'),  
50 -// types = $injector.get('types'),  
51 -// assetService = $injector.get('assetService'),  
52 -// deviceService = $injector.get('deviceService')  
53 -// $rootScope = $injector.get('$rootScope'),  
54 -// $q = $injector.get('$q'); 7 +//let $injector = widgetContext.$scope.$injector;
  8 +//let dialogs = $injector.get(widgetContext.servicesMap.get('dialogs'));
  9 +//let assetService = $injector.get(widgetContext.servicesMap.get('assetService'));
  10 +//let deviceService = $injector.get(widgetContext.servicesMap.get('deviceService'));
55 // 11 //
56 //openDeleteEntityDialog(); 12 //openDeleteEntityDialog();
57 // 13 //
58 //function openDeleteEntityDialog() { 14 //function openDeleteEntityDialog() {
59 -// var title = 'Delete ' + entityId.entityType  
60 -// .toLowerCase() + ' ' +  
61 -// entityName;  
62 -// var content = 'Are you sure you want to delete the ' +  
63 -// entityId.entityType.toLowerCase() + ' ' +  
64 -// entityName + '?';  
65 -// var confirm = $mdDialog.confirm()  
66 -// .targetEvent($event)  
67 -// .title(title)  
68 -// .htmlContent(content)  
69 -// .ariaLabel(title)  
70 -// .cancel('Cancel')  
71 -// .ok('Delete');  
72 -// $mdDialog.show(confirm).then(function() {  
73 -// deleteEntity();  
74 -// }) 15 +// let title = 'Delete ' + entityId.entityType.toLowerCase() + ' ' +
  16 +// entityName;
  17 +// let content = 'Are you sure you want to delete the ' +
  18 +// entityId.entityType.toLowerCase() + ' ' + entityName + '?';
  19 +// dialogs.confirm(title, content, 'Cancel', 'Delete').subscribe(
  20 +// function(result) {
  21 +// if (result) {
  22 +// deleteEntity();
  23 +// }
  24 +// }
  25 +// );
75 //} 26 //}
76 // 27 //
77 //function deleteEntity() { 28 //function deleteEntity() {
78 -// deleteEntityPromise(entityId).then( 29 +// deleteEntityObservable(entityId).subscribe(
79 // function success() { 30 // function success() {
80 -// updateAliasData(); 31 +// widgetContext.updateAliases();
81 // }, 32 // },
82 // function fail() { 33 // function fail() {
83 // showErrorDialog(); 34 // showErrorDialog();
@@ -85,228 +36,243 @@ @@ -85,228 +36,243 @@
85 // ); 36 // );
86 //} 37 //}
87 // 38 //
88 -//function deleteEntityPromise(entityId) {  
89 -// if (entityId.entityType == types.entityType.asset) { 39 +//function deleteEntityObservable(entityId) {
  40 +// if (entityId.entityType == "ASSET") {
90 // return assetService.deleteAsset(entityId.id); 41 // return assetService.deleteAsset(entityId.id);
91 -// } else if (entityId.entityType == types.entityType.device) { 42 +// } else if (entityId.entityType == "DEVICE") {
92 // return deviceService.deleteDevice(entityId.id); 43 // return deviceService.deleteDevice(entityId.id);
93 // } 44 // }
94 //} 45 //}
95 // 46 //
96 -//function updateAliasData() {  
97 -// var aliasIds = [];  
98 -// for (var id in widgetContext.aliasController.resolvedAliases) {  
99 -// aliasIds.push(id);  
100 -// }  
101 -// var tasks = [];  
102 -// aliasIds.forEach(function(aliasId) {  
103 -// widgetContext.aliasController.setAliasUnresolved(aliasId);  
104 -// tasks.push(widgetContext.aliasController.getAliasInfo(aliasId));  
105 -// });  
106 -// $q.all(tasks).then(function() {  
107 -// $rootScope.$broadcast('entityAliasesChanged', aliasIds);  
108 -// });  
109 -//}  
110 -//  
111 //function showErrorDialog() { 47 //function showErrorDialog() {
112 -// var title = 'Error';  
113 -// var content = 'An error occurred while deleting the entity. Please try again.';  
114 -// var alert = $mdDialog.alert()  
115 -// .title(title)  
116 -// .htmlContent(content)  
117 -// .ariaLabel(title)  
118 -// .parent(angular.element($document[0].body))  
119 -// .targetEvent($event)  
120 -// .multiple(true)  
121 -// .clickOutsideToClose(true)  
122 -// .ok('CLOSE');  
123 -// $mdDialog.show(alert); 48 +// let title = 'Error';
  49 +// let content = 'An error occurred while deleting the entity. Please try again.';
  50 +// dialogs.alert(title, content, 'CLOSE').subscribe(
  51 +// function(result) {}
  52 +// );
124 //} 53 //}
125 // 54 //
126 /*=======================================================================*/ 55 /*=======================================================================*/
127 /*======================== Edit entity example ========================*/ 56 /*======================== Edit entity example ========================*/
128 /*=======================================================================*/ 57 /*=======================================================================*/
129 // 58 //
130 -//var $injector = widgetContext.$scope.$injector;  
131 -//var $mdDialog = $injector.get('$mdDialog'),  
132 -// $document = $injector.get('$document'),  
133 -// $q = $injector.get('$q'),  
134 -// types = $injector.get('types'),  
135 -// $rootScope = $injector.get('$rootScope'),  
136 -// entityService = $injector.get('entityService'),  
137 -// attributeService = $injector.get('attributeService'),  
138 -// entityRelationService = $injector.get('entityRelationService'); 59 +//let $injector = widgetContext.$scope.$injector;
  60 +//let customDialog = $injector.get(widgetContext.servicesMap.get('customDialog'));
  61 +//let entityService = $injector.get(widgetContext.servicesMap.get('entityService'));
  62 +//let assetService = $injector.get(widgetContext.servicesMap.get('assetService'));
  63 +//let deviceService = $injector.get(widgetContext.servicesMap.get('deviceService'));
  64 +//let attributeService = $injector.get(widgetContext.servicesMap.get('attributeService'));
  65 +//let entityRelationService = $injector.get(widgetContext.servicesMap.get('entityRelationService'));
139 // 66 //
140 //openEditEntityDialog(); 67 //openEditEntityDialog();
141 // 68 //
142 //function openEditEntityDialog() { 69 //function openEditEntityDialog() {
143 -// $mdDialog.show({  
144 -// controller: ['$scope','$mdDialog', EditEntityDialogController],  
145 -// controllerAs: 'vm',  
146 -// template: htmlTemplate,  
147 -// locals: {  
148 -// entityId: entityId  
149 -// },  
150 -// parent: angular.element($document[0].body),  
151 -// targetEvent: $event,  
152 -// multiple: true,  
153 -// clickOutsideToClose: false  
154 -// }); 70 +// customDialog.customDialog(htmlTemplate, EditEntityDialogController).subscribe();
155 //} 71 //}
156 // 72 //
157 -//function EditEntityDialogController($scope,$mdDialog) {  
158 -// var vm = this;  
159 -// vm.entityId = entityId; 73 +//function EditEntityDialogController(instance) {
  74 +// let vm = instance;
  75 +//
160 // vm.entityName = entityName; 76 // vm.entityName = entityName;
161 // vm.entityType = entityId.entityType; 77 // vm.entityType = entityId.entityType;
162 -// vm.allowedEntityTypes = [types.entityType.asset, types.entityType.device];  
163 -// vm.allowedRelatedEntityTypes = [];  
164 -// vm.entitySearchDirection = types.entitySearchDirection; 78 +// vm.entitySearchDirection = {
  79 +// from: "FROM",
  80 +// to: "TO"
  81 +// };
165 // vm.attributes = {}; 82 // vm.attributes = {};
166 -// vm.serverAttributes = {};  
167 -// vm.relations = [];  
168 -// vm.newRelations = []; 83 +// vm.oldRelationsData = [];
169 // vm.relationsToDelete = []; 84 // vm.relationsToDelete = [];
  85 +// vm.entity = {};
  86 +//
  87 +// vm.editEntityFormGroup = vm.fb.group({
  88 +// entityName: ['', [vm.validators.required]],
  89 +// entityType: [null],
  90 +// entityLabel: [null],
  91 +// type: ['', [vm.validators.required]],
  92 +// attributes: vm.fb.group({
  93 +// latitude: [null],
  94 +// longitude: [null],
  95 +// address: [null],
  96 +// owner: [null],
  97 +// number: [null, [vm.validators.pattern(/^-?[0-9]+$/)]],
  98 +// booleanValue: [false]
  99 +// }),
  100 +// oldRelations: vm.fb.array([]),
  101 +// relations: vm.fb.array([])
  102 +// });
  103 +//
170 // getEntityInfo(); 104 // getEntityInfo();
171 // 105 //
  106 +// vm.cancel = function() {
  107 +// vm.dialogRef.close(null);
  108 +// };
  109 +//
  110 +// vm.relations = function() {
  111 +// return vm.editEntityFormGroup.get('relations');
  112 +// };
  113 +//
  114 +// vm.oldRelations = function() {
  115 +// return vm.editEntityFormGroup.get('oldRelations');
  116 +// };
  117 +//
172 // vm.addRelation = function() { 118 // vm.addRelation = function() {
173 -// var relation = {  
174 -// direction: null,  
175 -// relationType: null,  
176 -// relatedEntity: null  
177 -// };  
178 -// vm.newRelations.push(relation);  
179 -// $scope.editEntityForm.$setDirty(); 119 +// vm.relations().push(vm.fb.group({
  120 +// relatedEntity: [null, [vm.validators.required]],
  121 +// relationType: [null, [vm.validators.required]],
  122 +// direction: [null, [vm.validators.required]]
  123 +// }));
180 // }; 124 // };
  125 +//
  126 +// function addOldRelation() {
  127 +// vm.oldRelations().push(vm.fb.group({
  128 +// relatedEntity: [{value: null, disabled: true}, [vm.validators.required]],
  129 +// relationType: [{value: null, disabled: true}, [vm.validators.required]],
  130 +// direction: [{value: null, disabled: true}, [vm.validators.required]]
  131 +// }));
  132 +// }
  133 +//
181 // vm.removeRelation = function(index) { 134 // vm.removeRelation = function(index) {
182 -// if (index > -1) {  
183 -// vm.newRelations.splice(index, 1);  
184 -// $scope.editEntityForm.$setDirty();  
185 -// } 135 +// vm.relations().removeAt(index);
  136 +// vm.relations().markAsDirty();
186 // }; 137 // };
187 -// vm.removeOldRelation = function(index, relation) {  
188 -// if (index > -1) {  
189 -// vm.relations.splice(index, 1);  
190 -// vm.relationsToDelete.push(relation);  
191 -// $scope.editEntityForm.$setDirty();  
192 -// } 138 +//
  139 +// vm.removeOldRelation = function(index) {
  140 +// vm.oldRelations().removeAt(index);
  141 +// vm.relationsToDelete.push(vm.oldRelationsData[index]);
  142 +// vm.oldRelations().markAsDirty();
193 // }; 143 // };
  144 +//
194 // vm.save = function() { 145 // vm.save = function() {
195 -// saveAttributes();  
196 -// saveRelations();  
197 -// $scope.editEntityForm.$setPristine();  
198 -// };  
199 -// vm.cancel = function() {  
200 -// $mdDialog.hide(); 146 +// vm.editEntityFormGroup.markAsPristine();
  147 +// widgetContext.rxjs.forkJoin([
  148 +// saveAttributes(entityId),
  149 +// saveRelations(entityId),
  150 +// saveEntity()
  151 +// ]).subscribe(
  152 +// function () {
  153 +// widgetContext.updateAliases();
  154 +// vm.dialogRef.close(null);
  155 +// }
  156 +// );
201 // }; 157 // };
202 // 158 //
203 // function getEntityAttributes(attributes) { 159 // function getEntityAttributes(attributes) {
204 // for (var i = 0; i < attributes.length; i++) { 160 // for (var i = 0; i < attributes.length; i++) {
205 -// vm.attributes[attributes[i].key] = attributes[i].value; 161 +// vm.attributes[attributes[i].key] = attributes[i].value;
206 // } 162 // }
207 -// vm.serverAttributes = angular.copy(vm.attributes);  
208 // } 163 // }
209 // 164 //
210 // function getEntityRelations(relations) { 165 // function getEntityRelations(relations) {
211 -// var relationsFrom = relations[0];  
212 -// var relationsTo = relations[1];  
213 -// for (var i=0; i < relationsFrom.length; i++) {  
214 -// var relation = {  
215 -// direction: types.entitySearchDirection.from, 166 +// let relationsFrom = relations[0];
  167 +// let relationsTo = relations[1];
  168 +// for (let i=0; i < relationsFrom.length; i++) {
  169 +// let relation = {
  170 +// direction: 'FROM',
216 // relationType: relationsFrom[i].type, 171 // relationType: relationsFrom[i].type,
217 // relatedEntity: relationsFrom[i].to 172 // relatedEntity: relationsFrom[i].to
218 // }; 173 // };
219 -// vm.relations.push(relation); 174 +// vm.oldRelationsData.push(relation);
  175 +// addOldRelation();
220 // } 176 // }
221 -// for (var i=0; i < relationsTo.length; i++) {  
222 -// var relation = {  
223 -// direction: types.entitySearchDirection.to, 177 +// for (let i=0; i < relationsTo.length; i++) {
  178 +// let relation = {
  179 +// direction: 'TO',
224 // relationType: relationsTo[i].type, 180 // relationType: relationsTo[i].type,
225 // relatedEntity: relationsTo[i].from 181 // relatedEntity: relationsTo[i].from
226 // }; 182 // };
227 -// vm.relations.push(relation); 183 +// vm.oldRelationsData.push(relation);
  184 +// addOldRelation();
228 // } 185 // }
229 // } 186 // }
230 // 187 //
231 // function getEntityInfo() { 188 // function getEntityInfo() {
232 -// entityService.getEntity(entityId.entityType, entityId.id).then(  
233 -// function(entity) {  
234 -// vm.entity = entity;  
235 -// vm.type = vm.entity.type;  
236 -// });  
237 -// attributeService.getEntityAttributesValues(entityId.entityType, entityId.id, 'SERVER_SCOPE').then(  
238 -// function(data){  
239 -// if (data.length) {  
240 -// getEntityAttributes(data); 189 +// entityService.getEntity(entityId.entityType, entityId.id).subscribe(function (entity) {
  190 +// vm.entity = entity;
  191 +// widgetContext.rxjs.forkJoin([
  192 +// entityRelationService.findInfoByFrom(entityId),
  193 +// entityRelationService.findInfoByTo(entityId),
  194 +// attributeService.getEntityAttributes(entityId, 'SERVER_SCOPE')
  195 +// ]).subscribe(
  196 +// function (data) {
  197 +// getEntityRelations(data.slice(0,2));
  198 +// getEntityAttributes(data[2]);
  199 +// vm.editEntityFormGroup.patchValue({
  200 +// entityName: vm.entity.name,
  201 +// entityType: vm.entityType,
  202 +// entityLabel: vm.entity.label,
  203 +// type: vm.entity.type,
  204 +// attributes: vm.attributes,
  205 +// oldRelations: vm.oldRelationsData
  206 +// }, {emitEvent: false});
241 // } 207 // }
242 -// });  
243 -// $q.all([entityRelationService.findInfoByFrom(entityId.id, entityId.entityType), entityRelationService.findInfoByTo(entityId.id, entityId.entityType)]).then(  
244 -// function(relations){  
245 -// getEntityRelations(relations);  
246 -// }); 208 +// );
  209 +// });
247 // } 210 // }
248 // 211 //
249 -// function saveAttributes() {  
250 -// var attributesArray = [];  
251 -// for (var key in vm.attributes) {  
252 -// if (vm.attributes[key] !== vm.serverAttributes[key]) {  
253 -// attributesArray.push({key: key, value: vm.attributes[key]}); 212 +// function saveEntity() {
  213 +// const formValues = vm.editEntityFormGroup.value;
  214 +// if (vm.entity.label !== formValues.entityLabel){
  215 +// vm.entity.label = formValues.entityLabel;
  216 +// if (formValues.entityType == 'ASSET') {
  217 +// return assetService.saveAsset(vm.entity);
  218 +// } else if (formValues.entityType == 'DEVICE') {
  219 +// return deviceService.saveDevice(vm.entity);
  220 +// }
  221 +// } else {
  222 +// return widgetContext.rxjs.of([]);
  223 +// }
  224 +// }
  225 +//
  226 +// function saveAttributes(entityId) {
  227 +// let attributes = vm.editEntityFormGroup.get('attributes').value;
  228 +// let attributesArray = [];
  229 +// for (let key in attributes) {
  230 +// if (attributes[key] !== vm.attributes[key]) {
  231 +// attributesArray.push({key: key, value: attributes[key]});
254 // } 232 // }
255 // } 233 // }
256 // if (attributesArray.length > 0) { 234 // if (attributesArray.length > 0) {
257 -// attributeService.saveEntityAttributes(entityId.entityType, entityId.id, \"SERVER_SCOPE\", attributesArray); 235 +// return attributeService.saveEntityAttributes(entityId, "SERVER_SCOPE", attributesArray);
  236 +// } else {
  237 +// return widgetContext.rxjs.of([]);
258 // } 238 // }
259 // } 239 // }
260 // 240 //
261 -// function saveRelations() {  
262 -// var tasks = [];  
263 -// for (var i=0; i < vm.newRelations.length; i++) {  
264 -// var relation = {  
265 -// type: vm.newRelations[i].relationType 241 +// function saveRelations(entityId) {
  242 +// let relations = vm.editEntityFormGroup.get('relations').value;
  243 +// let tasks = [];
  244 +// for(let i=0; i < relations.length; i++) {
  245 +// let relation = {
  246 +// type: relations[i].relationType,
  247 +// typeGroup: 'COMMON'
266 // }; 248 // };
267 -// if (vm.newRelations[i].direction == types.entitySearchDirection.from) {  
268 -// relation.to = vm.newRelations[i].relatedEntity; 249 +// if (relations[i].direction == 'FROM') {
  250 +// relation.to = relations[i].relatedEntity;
269 // relation.from = entityId; 251 // relation.from = entityId;
270 // } else { 252 // } else {
271 // relation.to = entityId; 253 // relation.to = entityId;
272 -// relation.from = vm.newRelations[i].relatedEntity; 254 +// relation.from = relations[i].relatedEntity;
273 // } 255 // }
274 // tasks.push(entityRelationService.saveRelation(relation)); 256 // tasks.push(entityRelationService.saveRelation(relation));
275 // } 257 // }
276 -// for (var i=0; i < vm.relationsToDelete.length; i++) {  
277 -// var relation = { 258 +// for (let i=0; i < vm.relationsToDelete.length; i++) {
  259 +// let relation = {
278 // type: vm.relationsToDelete[i].relationType 260 // type: vm.relationsToDelete[i].relationType
279 // }; 261 // };
280 -// if (vm.relationsToDelete[i].direction == types.entitySearchDirection.from) { 262 +// if (vm.relationsToDelete[i].direction == 'FROM') {
281 // relation.to = vm.relationsToDelete[i].relatedEntity; 263 // relation.to = vm.relationsToDelete[i].relatedEntity;
282 // relation.from = entityId; 264 // relation.from = entityId;
283 // } else { 265 // } else {
284 // relation.to = entityId; 266 // relation.to = entityId;
285 // relation.from = vm.relationsToDelete[i].relatedEntity; 267 // relation.from = vm.relationsToDelete[i].relatedEntity;
286 // } 268 // }
287 -// tasks.push(entityRelationService.deleteRelation(relation.from.id, relation.from.entityType, relation.type, relation.to.id, relation.to.entityType)); 269 +// tasks.push(entityRelationService.deleteRelation(relation.from, relation.type, relation.to));
288 // } 270 // }
289 -// $q.all(tasks).then(function(){  
290 -// vm.relations = vm.relations.concat(vm.newRelations);  
291 -// vm.newRelations = [];  
292 -// vm.relationsToDelete = [];  
293 -// updateAliasData();  
294 -// });  
295 -// }  
296 -//  
297 -// function updateAliasData() {  
298 -// var aliasIds = [];  
299 -// for (var id in widgetContext.aliasController.resolvedAliases) {  
300 -// aliasIds.push(id); 271 +// if (tasks.length > 0) {
  272 +// return widgetContext.rxjs.forkJoin(tasks);
  273 +// } else {
  274 +// return widgetContext.rxjs.of([]);
301 // } 275 // }
302 -// var tasks = [];  
303 -// aliasIds.forEach(function(aliasId) {  
304 -// widgetContext.aliasController.setAliasUnresolved(aliasId);  
305 -// tasks.push(widgetContext.aliasController.getAliasInfo(aliasId));  
306 -// });  
307 -// $q.all(tasks).then(function() {  
308 -// $rootScope.$broadcast('entityAliasesChanged', aliasIds);  
309 -// });  
310 // } 276 // }
311 //} 277 //}
312 // 278 //
@@ -314,124 +280,132 @@ @@ -314,124 +280,132 @@
314 /*========================= Add entity example =========================*/ 280 /*========================= Add entity example =========================*/
315 /*========================================================================*/ 281 /*========================================================================*/
316 // 282 //
317 -//var $injector = widgetContext.$scope.$injector;  
318 -//var $mdDialog = $injector.get('$mdDialog'),  
319 -// $document = $injector.get('$document'),  
320 -// $q = $injector.get('$q'),  
321 -// $rootScope = $injector.get('$rootScope'),  
322 -// types = $injector.get('types'),  
323 -// assetService = $injector.get('assetService'),  
324 -// deviceService = $injector.get('deviceService'),  
325 -// attributeService = $injector.get('attributeService'),  
326 -// entityRelationService = $injector.get('entityRelationService'); 283 +//let $injector = widgetContext.$scope.$injector;
  284 +//let customDialog = $injector.get(widgetContext.servicesMap.get('customDialog'));
  285 +//let assetService = $injector.get(widgetContext.servicesMap.get('assetService'));
  286 +//let deviceService = $injector.get(widgetContext.servicesMap.get('deviceService'));
  287 +//let attributeService = $injector.get(widgetContext.servicesMap.get('attributeService'));
  288 +//let entityRelationService = $injector.get(widgetContext.servicesMap.get('entityRelationService'));
327 // 289 //
328 //openAddEntityDialog(); 290 //openAddEntityDialog();
329 // 291 //
330 //function openAddEntityDialog() { 292 //function openAddEntityDialog() {
331 -// $mdDialog.show({  
332 -// controller: ['$scope','$mdDialog', AddEntityDialogController],  
333 -// controllerAs: 'vm',  
334 -// template: htmlTemplate,  
335 -// locals: {  
336 -// entityId: entityId  
337 -// },  
338 -// parent: angular.element($document[0].body),  
339 -// targetEvent: $event,  
340 -// multiple: true,  
341 -// clickOutsideToClose: false  
342 -// }); 293 +// customDialog.customDialog(htmlTemplate, AddEntityDialogController).subscribe();
343 //} 294 //}
344 // 295 //
345 -//function AddEntityDialogController($scope, $mdDialog) {  
346 -// var vm = this;  
347 -// vm.allowedEntityTypes = [types.entityType.asset, types.entityType.device];  
348 -// vm.allowedRelatedEntityTypes = [];  
349 -// vm.entitySearchDirection = types.entitySearchDirection;  
350 -// vm.attributes = {};  
351 -// vm.relations = []; 296 +//function AddEntityDialogController(instance) {
  297 +// let vm = instance;
  298 +//
  299 +// vm.allowedEntityTypes = ['ASSET', 'DEVICE'];
  300 +// vm.entitySearchDirection = {
  301 +// from: "FROM",
  302 +// to: "TO"
  303 +// }
  304 +//
  305 +// vm.addEntityFormGroup = vm.fb.group({
  306 +// entityName: ['', [vm.validators.required]],
  307 +// entityType: ['DEVICE'],
  308 +// entityLabel: [null],
  309 +// type: ['', [vm.validators.required]],
  310 +// attributes: vm.fb.group({
  311 +// latitude: [null],
  312 +// longitude: [null],
  313 +// address: [null],
  314 +// owner: [null],
  315 +// number: [null, [vm.validators.pattern(/^-?[0-9]+$/)]],
  316 +// booleanValue: [null]
  317 +// }),
  318 +// relations: vm.fb.array([])
  319 +// });
  320 +//
  321 +// vm.cancel = function() {
  322 +// vm.dialogRef.close(null);
  323 +// };
  324 +//
  325 +// vm.relations = function() {
  326 +// return vm.addEntityFormGroup.get('relations');
  327 +// };
352 // 328 //
353 // vm.addRelation = function() { 329 // vm.addRelation = function() {
354 -// var relation = {  
355 -// direction: null,  
356 -// relationType: null,  
357 -// relatedEntity: null  
358 -// };  
359 -// vm.relations.push(relation); 330 +// vm.relations().push(vm.fb.group({
  331 +// relatedEntity: [null, [vm.validators.required]],
  332 +// relationType: [null, [vm.validators.required]],
  333 +// direction: [null, [vm.validators.required]]
  334 +// }));
360 // }; 335 // };
  336 +//
361 // vm.removeRelation = function(index) { 337 // vm.removeRelation = function(index) {
362 -// if (index > -1) {  
363 -// vm.relations.splice(index, 1);  
364 -// } 338 +// vm.relations().removeAt(index);
  339 +// vm.relations().markAsDirty();
365 // }; 340 // };
  341 +//
366 // vm.save = function() { 342 // vm.save = function() {
367 -// $scope.addEntityForm.$setPristine();  
368 -// saveEntityPromise().then( 343 +// vm.addEntityFormGroup.markAsPristine();
  344 +// saveEntityObservable().subscribe(
369 // function (entity) { 345 // function (entity) {
370 -// saveAttributes(entity.id);  
371 -// saveRelations(entity.id);  
372 -// $mdDialog.hide(); 346 +// widgetContext.rxjs.forkJoin([
  347 +// saveAttributes(entity.id),
  348 +// saveRelations(entity.id)
  349 +// ]).subscribe(
  350 +// function () {
  351 +// widgetContext.updateAliases();
  352 +// vm.dialogRef.close(null);
  353 +// }
  354 +// );
373 // } 355 // }
374 // ); 356 // );
375 // }; 357 // };
376 -// vm.cancel = function() {  
377 -// $mdDialog.hide();  
378 -// };  
379 // 358 //
380 -//  
381 -// function saveEntityPromise() {  
382 -// var entity = {  
383 -// name: vm.entityName,  
384 -// type: vm.type 359 +// function saveEntityObservable() {
  360 +// const formValues = vm.addEntityFormGroup.value;
  361 +// let entity = {
  362 +// name: formValues.entityName,
  363 +// type: formValues.type,
  364 +// label: formValues.entityLabel
385 // }; 365 // };
386 -// if (vm.entityType == types.entityType.asset) { 366 +// if (formValues.entityType == 'ASSET') {
387 // return assetService.saveAsset(entity); 367 // return assetService.saveAsset(entity);
388 -// } else if (vm.entityType == types.entityType.device) { 368 +// } else if (formValues.entityType == 'DEVICE') {
389 // return deviceService.saveDevice(entity); 369 // return deviceService.saveDevice(entity);
390 // } 370 // }
391 // } 371 // }
392 // 372 //
393 // function saveAttributes(entityId) { 373 // function saveAttributes(entityId) {
394 -// var attributesArray = [];  
395 -// for (var key in vm.attributes) {  
396 -// attributesArray.push({key: key, value: vm.attributes[key]}); 374 +// let attributes = vm.addEntityFormGroup.get('attributes').value;
  375 +// let attributesArray = [];
  376 +// for (let key in attributes) {
  377 +// if(attributes[key] !== null) {
  378 +// attributesArray.push({key: key, value: attributes[key]});
  379 +// }
397 // } 380 // }
398 // if (attributesArray.length > 0) { 381 // if (attributesArray.length > 0) {
399 -// attributeService.saveEntityAttributes(entityId.entityType, entityId.id, \"SERVER_SCOPE\", attributesArray); 382 +// return attributeService.saveEntityAttributes(entityId, "SERVER_SCOPE", attributesArray);
  383 +// } else {
  384 +// return widgetContext.rxjs.of([]);
400 // } 385 // }
401 // } 386 // }
402 // 387 //
403 // function saveRelations(entityId) { 388 // function saveRelations(entityId) {
404 -// var tasks = [];  
405 -// for (var i=0; i < vm.relations.length; i++) {  
406 -// var relation = {  
407 -// type: vm.relations[i].relationType 389 +// let relations = vm.addEntityFormGroup.get('relations').value;
  390 +// let tasks = [];
  391 +// for(let i=0; i < relations.length; i++) {
  392 +// let relation = {
  393 +// type: relations[i].relationType,
  394 +// typeGroup: 'COMMON'
408 // }; 395 // };
409 -// if (vm.relations[i].direction == types.entitySearchDirection.from) {  
410 -// relation.to = vm.relations[i].relatedEntity; 396 +// if (relations[i].direction == 'FROM') {
  397 +// relation.to = relations[i].relatedEntity;
411 // relation.from = entityId; 398 // relation.from = entityId;
412 // } else { 399 // } else {
413 // relation.to = entityId; 400 // relation.to = entityId;
414 -// relation.from = vm.relations[i].relatedEntity; 401 +// relation.from = relations[i].relatedEntity;
415 // } 402 // }
416 // tasks.push(entityRelationService.saveRelation(relation)); 403 // tasks.push(entityRelationService.saveRelation(relation));
417 // } 404 // }
418 -// $q.all(tasks).then(function(){  
419 -// updateAliasData();  
420 -// });  
421 -// }  
422 -//  
423 -// function updateAliasData() {  
424 -// var aliasIds = [];  
425 -// for (var id in widgetContext.aliasController.resolvedAliases) {  
426 -// aliasIds.push(id); 405 +// if (tasks.length > 0) {
  406 +// return widgetContext.rxjs.forkJoin(tasks);
  407 +// } else {
  408 +// return widgetContext.rxjs.of([]);
427 // } 409 // }
428 -// var tasks = [];  
429 -// aliasIds.forEach(function(aliasId) {  
430 -// widgetContext.aliasController.setAliasUnresolved(aliasId);  
431 -// tasks.push(widgetContext.aliasController.getAliasInfo(aliasId));  
432 -// });  
433 -// $q.all(tasks).then(function() {  
434 -// $rootScope.$broadcast('entityAliasesChanged', aliasIds);  
435 -// });  
436 // } 410 // }
437 //} 411 //}
@@ -97,11 +97,14 @@ import { DatePipe } from '@angular/common'; @@ -97,11 +97,14 @@ import { DatePipe } from '@angular/common';
97 import { AttributeService } from '@core/http/attribute.service'; 97 import { AttributeService } from '@core/http/attribute.service';
98 import { TranslateService } from '@ngx-translate/core'; 98 import { TranslateService } from '@ngx-translate/core';
99 import { HttpClient } from '@angular/common/http'; 99 import { HttpClient } from '@angular/common/http';
  100 +import { EntityRelationService } from '@app/core/http/entity-relation.service';
100 101
101 const ServicesMap = new Map<string, Type<any>>(); 102 const ServicesMap = new Map<string, Type<any>>();
102 ServicesMap.set('deviceService', DeviceService); 103 ServicesMap.set('deviceService', DeviceService);
103 ServicesMap.set('assetService', AssetService); 104 ServicesMap.set('assetService', AssetService);
104 ServicesMap.set('attributeService', AttributeService); 105 ServicesMap.set('attributeService', AttributeService);
  106 +ServicesMap.set('entityRelationService', EntityRelationService);
  107 +ServicesMap.set('entityService', EntityService);
105 ServicesMap.set('dialogs', DialogService); 108 ServicesMap.set('dialogs', DialogService);
106 ServicesMap.set('customDialog', CustomDialogService); 109 ServicesMap.set('customDialog', CustomDialogService);
107 ServicesMap.set('date', DatePipe); 110 ServicesMap.set('date', DatePipe);
@@ -1011,7 +1014,7 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI @@ -1011,7 +1014,7 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI
1011 'entityName', 'additionalParams', 'entityLabel', customFunction); 1014 'entityName', 'additionalParams', 'entityLabel', customFunction);
1012 customActionFunction($event, this.widgetContext, entityId, entityName, additionalParams, entityLabel); 1015 customActionFunction($event, this.widgetContext, entityId, entityName, additionalParams, entityLabel);
1013 } catch (e) { 1016 } catch (e) {
1014 - // 1017 + console.error(e);
1015 } 1018 }
1016 } 1019 }
1017 break; 1020 break;
@@ -1036,7 +1039,7 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI @@ -1036,7 +1039,7 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI
1036 'entityName', 'htmlTemplate', 'additionalParams', 'entityLabel', customPrettyFunction); 1039 'entityName', 'htmlTemplate', 'additionalParams', 'entityLabel', customPrettyFunction);
1037 customActionPrettyFunction($event, this.widgetContext, entityId, entityName, htmlTemplate, additionalParams, entityLabel); 1040 customActionPrettyFunction($event, this.widgetContext, entityId, entityName, htmlTemplate, additionalParams, entityLabel);
1038 } catch (e) { 1041 } catch (e) {
1039 - // 1042 + console.error(e);
1040 } 1043 }
1041 } 1044 }
1042 }, 1045 },