Commit 415959686f42a6362d3ed9f2551e2f285a7440dc
1 parent
6e564de9
Added sync button. Added copy edge key and secret buttons
Showing
6 changed files
with
102 additions
and
65 deletions
... | ... | @@ -23,6 +23,7 @@ import { PageData } from '@shared/models/page/page-data'; |
23 | 23 | import { EntitySubtype } from '@app/shared/models/entity-type.models'; |
24 | 24 | import { Edge, EdgeEvent, EdgeInfo, EdgeSearchQuery } from "@shared/models/edge.models"; |
25 | 25 | import { EntityId } from "@shared/models/id/entity-id"; |
26 | +import { EdgeId } from "@shared/models/id/edge-id"; | |
26 | 27 | @Injectable({ |
27 | 28 | providedIn: 'root' |
28 | 29 | }) |
... | ... | @@ -95,4 +96,8 @@ export class EdgeService { |
95 | 96 | return this.http.get<PageData<EdgeEvent>>(`/api/edge/${entityId.id}/events` + `${pageLink.toQuery()}`, |
96 | 97 | defaultHttpOptionsFromConfig(config)); |
97 | 98 | } |
99 | + | |
100 | + public syncEdge(edgeId: EdgeId, config?: RequestConfig) { | |
101 | + return this.http.post(`/api/edge/sync`, edgeId, defaultHttpOptionsFromConfig(config)); | |
102 | + } | |
98 | 103 | } | ... | ... |
... | ... | @@ -83,7 +83,7 @@ |
83 | 83 | </button> |
84 | 84 | <button mat-raised-button |
85 | 85 | ngxClipboard |
86 | - (cbOnSuccess)="onEdgeKeyCopied($event)" | |
86 | + (cbOnSuccess)="onEdgeInfoCopied('key')" | |
87 | 87 | [cbContent]="entity?.routingKey" |
88 | 88 | [fxShow]="!isEdit"> |
89 | 89 | <mat-icon svgIcon="mdi:clipboard-arrow-left"></mat-icon> |
... | ... | @@ -91,12 +91,20 @@ |
91 | 91 | </button> |
92 | 92 | <button mat-raised-button |
93 | 93 | ngxClipboard |
94 | - (cbOnSuccess)="onEdgeSecretCopied($event)" | |
94 | + (cbOnSuccess)="onEdgeInfoCopied('secret')" | |
95 | 95 | [cbContent]="entity?.secret" |
96 | 96 | [fxShow]="!isEdit"> |
97 | 97 | <mat-icon svgIcon="mdi:clipboard-arrow-left"></mat-icon> |
98 | 98 | <span translate>edge.copy-edge-secret</span> |
99 | 99 | </button> |
100 | + <button mat-raised-button | |
101 | + ngxClipboard | |
102 | + [disabled]="(isLoading$ | async)" | |
103 | + (click)="onEntityAction($event, 'syncEdge')" | |
104 | + [fxShow]="!isEdit"> | |
105 | + <mat-icon svgIcon="mdi:sync"></mat-icon> | |
106 | + <span translate>edge.sync</span> | |
107 | + </button> | |
100 | 108 | </div> |
101 | 109 | </div> |
102 | 110 | <div class="mat-padding" fxLayout="column"> |
... | ... | @@ -148,19 +156,29 @@ |
148 | 156 | </div> |
149 | 157 | <div fxLayout="row"> |
150 | 158 | <fieldset fxFlex disabled> |
151 | - <mat-form-field class="mat-block"> | |
159 | + <mat-form-field class="mat-block" fxFlex> | |
152 | 160 | <mat-label translate>edge.edge-key</mat-label> |
153 | 161 | <input matInput formControlName="routingKey"> |
154 | 162 | </mat-form-field> |
155 | 163 | </fieldset> |
164 | + <button mat-button mat-icon-button type="button" ngxClipboard (cbOnSuccess)="onEdgeInfoCopied('key')" | |
165 | + [cbContent]="entityForm?.get('routingKey').value" | |
166 | + matTooltip="{{'edge.copy-edge-key' | translate}}"> | |
167 | + <mat-icon svgIcon="mdi:clipboard-arrow-left"></mat-icon> | |
168 | + </button> | |
156 | 169 | </div> |
157 | 170 | <div fxLayout="row"> |
158 | 171 | <fieldset fxFlex disabled> |
159 | - <mat-form-field class="mat-block"> | |
172 | + <mat-form-field class="mat-block" fxFlex> | |
160 | 173 | <mat-label translate>edge.edge-secret</mat-label> |
161 | 174 | <input matInput formControlName="secret"> |
162 | 175 | </mat-form-field> |
163 | 176 | </fieldset> |
177 | + <button mat-button mat-icon-button type="button" ngxClipboard (cbOnSuccess)="onEdgeInfoCopied('secret')" | |
178 | + [cbContent]="entityForm?.get('secret').value" | |
179 | + matTooltip="{{'edge.copy-edge-secret' | translate}}"> | |
180 | + <mat-icon svgIcon="mdi:clipboard-arrow-left"></mat-icon> | |
181 | + </button> | |
164 | 182 | </div> |
165 | 183 | <mat-form-field class="mat-block"> |
166 | 184 | <mat-label translate>edge.label</mat-label> | ... | ... |
... | ... | @@ -93,8 +93,11 @@ export class EdgeComponent extends EntityComponent<EdgeInfo> { |
93 | 93 | this.entityForm.patchValue({edgeLicenseKey: entity.edgeLicenseKey}); |
94 | 94 | this.entityForm.patchValue({routingKey: entity.routingKey}); |
95 | 95 | this.entityForm.patchValue({secret: entity.secret}); |
96 | - this.entityForm.patchValue({additionalInfo: { | |
97 | - description: entity.additionalInfo ? entity.additionalInfo.description : ''}}); | |
96 | + this.entityForm.patchValue({ | |
97 | + additionalInfo: { | |
98 | + description: entity.additionalInfo ? entity.additionalInfo.description : '' | |
99 | + } | |
100 | + }); | |
98 | 101 | } |
99 | 102 | |
100 | 103 | onEdgeIdCopied($event) { |
... | ... | @@ -104,29 +107,7 @@ export class EdgeComponent extends EntityComponent<EdgeInfo> { |
104 | 107 | type: 'success', |
105 | 108 | duration: 750, |
106 | 109 | verticalPosition: 'bottom', |
107 | - horizontalPosition: 'left' | |
108 | - })); | |
109 | - } | |
110 | - | |
111 | - onEdgeKeyCopied($event) { | |
112 | - this.store.dispatch(new ActionNotificationShow( | |
113 | - { | |
114 | - message: this.translate.instant('edge.edge-key-copied-message'), | |
115 | - type: 'success', | |
116 | - duration: 750, | |
117 | - verticalPosition: 'bottom', | |
118 | - horizontalPosition: 'left' | |
119 | - })); | |
120 | - } | |
121 | - | |
122 | - onEdgeSecretCopied($event) { | |
123 | - this.store.dispatch(new ActionNotificationShow( | |
124 | - { | |
125 | - message: this.translate.instant('edge.edge-secret-copied-message'), | |
126 | - type: 'success', | |
127 | - duration: 750, | |
128 | - verticalPosition: 'bottom', | |
129 | - horizontalPosition: 'left' | |
110 | + horizontalPosition: 'right' | |
130 | 111 | })); |
131 | 112 | } |
132 | 113 | |
... | ... | @@ -135,10 +116,23 @@ export class EdgeComponent extends EntityComponent<EdgeInfo> { |
135 | 116 | length = 1; |
136 | 117 | } |
137 | 118 | var l = length > 10 ? 10 : length; |
138 | - var str = Math.random().toString(36).substr(2, l); | |
119 | + var str = Math.random().toString(36).substr(2, l); | |
139 | 120 | if (str.length >= length) { |
140 | 121 | return str; |
141 | 122 | } |
142 | 123 | return str.concat(this.generateSecret(length - str.length)); |
143 | 124 | } |
125 | + | |
126 | + onEdgeInfoCopied(type: string) { | |
127 | + const message = type === 'key' ? 'edge.edge-key-copied-message' | |
128 | + : 'edge.edge-secret-copied-message'; | |
129 | + this.store.dispatch(new ActionNotificationShow( | |
130 | + { | |
131 | + message: this.translate.instant(message), | |
132 | + type: 'success', | |
133 | + duration: 750, | |
134 | + verticalPosition: 'bottom', | |
135 | + horizontalPosition: 'right' | |
136 | + })); | |
137 | + } | |
144 | 138 | } | ... | ... |
... | ... | @@ -57,6 +57,7 @@ import { EdgeComponent } from "@home/pages/edge/edge.component"; |
57 | 57 | import { EdgeTableHeaderComponent } from "@home/pages/edge/edge-table-header.component"; |
58 | 58 | import { EdgeId } from "@shared/models/id/edge-id"; |
59 | 59 | import { EdgeTabsComponent } from "@home/pages/edge/edge-tabs.component"; |
60 | +import { ActionNotificationShow } from "@core/notification/notification.actions"; | |
60 | 61 | |
61 | 62 | @Injectable() |
62 | 63 | export class EdgesTableConfigResolver implements Resolve<EntityTableConfig<EdgeInfo>> { |
... | ... | @@ -182,10 +183,10 @@ export class EdgesTableConfigResolver implements Resolve<EntityTableConfig<EdgeI |
182 | 183 | if (edgeScope === 'tenant') { |
183 | 184 | actions.push( |
184 | 185 | { |
185 | - name: this.translate.instant('edge.make-public'), | |
186 | - icon: 'share', | |
187 | - isEnabled: (entity) => (!entity.customerId || entity.customerId.id === NULL_UUID), | |
188 | - onAction: ($event, entity) => this.makePublic($event, entity) | |
186 | + name: this.translate.instant('edge.make-public'), | |
187 | + icon: 'share', | |
188 | + isEnabled: (entity) => (!entity.customerId || entity.customerId.id === NULL_UUID), | |
189 | + onAction: ($event, entity) => this.makePublic($event, entity) | |
189 | 190 | }, |
190 | 191 | { |
191 | 192 | name: this.translate.instant('edge.assign-to-customer'), |
... | ... | @@ -478,32 +479,53 @@ export class EdgesTableConfigResolver implements Resolve<EntityTableConfig<EdgeI |
478 | 479 | ); |
479 | 480 | } |
480 | 481 | |
482 | + syncEdge($event, edge) { | |
483 | + if ($event) { | |
484 | + $event.stopPropagation(); | |
485 | + } | |
486 | + this.edgeService.syncEdge(edge.id).subscribe( | |
487 | + () => { | |
488 | + this.store.dispatch(new ActionNotificationShow( | |
489 | + { | |
490 | + message: this.translate.instant('edge.sync-process-started-successfully'), | |
491 | + type: 'success', | |
492 | + duration: 750, | |
493 | + verticalPosition: 'bottom', | |
494 | + horizontalPosition: 'right' | |
495 | + })); | |
496 | + } | |
497 | + ); | |
498 | + } | |
499 | + | |
481 | 500 | onEdgeAction(action: EntityAction<EdgeInfo>): boolean { |
482 | - switch (action.action) { | |
483 | - case 'makePublic': | |
484 | - this.makePublic(action.event, action.entity); | |
485 | - return true; | |
486 | - case 'assignToCustomer': | |
487 | - this.assignToCustomer(action.event, [action.entity.id]); | |
488 | - return true; | |
489 | - case 'unassignFromCustomer': | |
490 | - this.unassignFromCustomer(action.event, action.entity); | |
491 | - return true; | |
492 | - case 'openEdgeAssets': | |
493 | - this.openEdgeAssets(action.event, action.entity); | |
494 | - return true; | |
495 | - case 'openEdgeDevices': | |
496 | - this.openEdgeDevices(action.event, action.entity); | |
497 | - return true; | |
498 | - case 'openEdgeEntityViews': | |
499 | - this.openEdgeEntityViews(action.event, action.entity); | |
500 | - return true; | |
501 | - case 'openEdgeDashboards': | |
502 | - this.openEdgeDashboards(action.event, action.entity); | |
503 | - return true; | |
504 | - case 'openEdgeRuleChains': | |
505 | - this.openEdgeRuleChains(action.event, action.entity); | |
506 | - return true; | |
501 | + switch (action.action) { | |
502 | + case 'makePublic': | |
503 | + this.makePublic(action.event, action.entity); | |
504 | + return true; | |
505 | + case 'assignToCustomer': | |
506 | + this.assignToCustomer(action.event, [action.entity.id]); | |
507 | + return true; | |
508 | + case 'unassignFromCustomer': | |
509 | + this.unassignFromCustomer(action.event, action.entity); | |
510 | + return true; | |
511 | + case 'openEdgeAssets': | |
512 | + this.openEdgeAssets(action.event, action.entity); | |
513 | + return true; | |
514 | + case 'openEdgeDevices': | |
515 | + this.openEdgeDevices(action.event, action.entity); | |
516 | + return true; | |
517 | + case 'openEdgeEntityViews': | |
518 | + this.openEdgeEntityViews(action.event, action.entity); | |
519 | + return true; | |
520 | + case 'openEdgeDashboards': | |
521 | + this.openEdgeDashboards(action.event, action.entity); | |
522 | + return true; | |
523 | + case 'openEdgeRuleChains': | |
524 | + this.openEdgeRuleChains(action.event, action.entity); | |
525 | + return true; | |
526 | + case 'syncEdge': | |
527 | + this.syncEdge(action.event, action.entity); | |
528 | + return true; | |
507 | 529 | } |
508 | 530 | } |
509 | 531 | ... | ... |
... | ... | @@ -1177,10 +1177,10 @@ |
1177 | 1177 | "dashboards": "Edge Dashboards", |
1178 | 1178 | "manage-edge-rulechains": "Edge rule chains", |
1179 | 1179 | "edge-key": "Edge key", |
1180 | - "copy-edge-key": "Copy edge key", | |
1180 | + "copy-edge-key": "Copy Edge key", | |
1181 | 1181 | "edge-key-copied-message": "Edge key has been copied to clipboard", |
1182 | 1182 | "edge-secret": "Edge secret", |
1183 | - "copy-edge-secret": "Copy edge secret", | |
1183 | + "copy-edge-secret": "Copy Edge secret", | |
1184 | 1184 | "edge-secret-copied-message": "Edge secret has been copied to clipboard", |
1185 | 1185 | "manage-edge-assets": "Edge assets", |
1186 | 1186 | "manage-edge-devices": "Edge devices", |
... | ... | @@ -1239,7 +1239,8 @@ |
1239 | 1239 | "edge-event-action-type-assigned-to-edge": "Assigned to Edge", |
1240 | 1240 | "edge-event-action-type-unassigned-from-edge": "Unassigned from Edge", |
1241 | 1241 | "edge-event-action-type-credentials-request": "Credentials Request", |
1242 | - "edge-event-action-type-entity-merge-request": "Entity Merge Request" | |
1242 | + "edge-event-action-type-entity-merge-request": "Entity Merge Request", | |
1243 | + "sync-process-started-successfully": "Sync process started successfully!" | |
1243 | 1244 | }, |
1244 | 1245 | "error": { |
1245 | 1246 | "unable-to-connect": "Unable to connect to the server! Please check your internet connection.", | ... | ... |