diff --git a/application/src/main/data/json/demo/dashboards/gateway_list.json b/application/src/main/data/json/demo/dashboards/gateway_list.json
index cae7d54bb9..bef5ae175e 100644
--- a/application/src/main/data/json/demo/dashboards/gateway_list.json
+++ b/application/src/main/data/json/demo/dashboards/gateway_list.json
@@ -160,12 +160,16 @@
"icon": "terminal",
"useShowWidgetActionFunction": null,
"showWidgetActionFunction": "return true;",
- "type": "customPretty",
- "customHtml": "",
- "customCss": "/*=======================================================================*/\r\n/*========== There are two examples: for edit and add entity ==========*/\r\n/*=======================================================================*/\r\n/*======================== Edit entity example ========================*/\r\n/*=======================================================================*/\r\n/*\r\n.edit-entity-form .boolean-value-input {\r\n padding-left: 5px;\r\n}\r\n\r\n.edit-entity-form .boolean-value-input .checkbox-label {\r\n margin-bottom: 8px;\r\n color: rgba(0,0,0,0.54);\r\n font-size: 12px;\r\n}\r\n\r\n.relations-list .header {\r\n padding-right: 5px;\r\n padding-bottom: 5px;\r\n padding-left: 5px;\r\n}\r\n\r\n.relations-list .header .cell {\r\n padding-right: 5px;\r\n padding-left: 5px;\r\n font-size: 12px;\r\n font-weight: 700;\r\n color: rgba(0, 0, 0, .54);\r\n white-space: nowrap;\r\n}\r\n\r\n.relations-list .mat-form-field-infix {\r\n width: auto !important;\r\n}\r\n\r\n.relations-list .body {\r\n padding-right: 5px;\r\n padding-bottom: 15px;\r\n padding-left: 5px;\r\n}\r\n\r\n.relations-list .body .row {\r\n padding-top: 5px;\r\n}\r\n\r\n.relations-list .body .cell {\r\n padding-right: 5px;\r\n padding-left: 5px;\r\n}\r\n\r\n.relations-list .body .md-button {\r\n margin: 0;\r\n}\r\n*/\r\n/*========================================================================*/\r\n/*========================= Add entity example =========================*/\r\n/*========================================================================*/\r\n/*\r\n.add-entity-form .boolean-value-input {\r\n padding-left: 5px;\r\n}\r\n\r\n.add-entity-form .boolean-value-input .checkbox-label {\r\n margin-bottom: 8px;\r\n color: rgba(0,0,0,0.54);\r\n font-size: 12px;\r\n}\r\n\r\n.relations-list .header {\r\n padding-right: 5px;\r\n padding-bottom: 5px;\r\n padding-left: 5px;\r\n}\r\n\r\n.relations-list .header .cell {\r\n padding-right: 5px;\r\n padding-left: 5px;\r\n font-size: 12px;\r\n font-weight: 700;\r\n color: rgba(0, 0, 0, .54);\r\n white-space: nowrap;\r\n}\r\n\r\n.relations-list .mat-form-field-infix {\r\n width: auto !important;\r\n}\r\n\r\n.relations-list .body {\r\n padding-right: 5px;\r\n padding-bottom: 15px;\r\n padding-left: 5px;\r\n}\r\n\r\n.relations-list .body .row {\r\n padding-top: 5px;\r\n}\r\n\r\n.relations-list .body .cell {\r\n padding-right: 5px;\r\n padding-left: 5px;\r\n}\r\n\r\n.relations-list .body .md-button {\r\n margin: 0;\r\n}\r\n*/\r\n",
- "customFunction": "let $injector = widgetContext.$scope.$injector;\r\nlet customDialog = $injector.get(widgetContext.servicesMap.get('customDialog'));\r\nlet deviceService = $injector.get(widgetContext.servicesMap.get('deviceService'));\r\nlet data = {};\r\n\r\nopenEditEntityDialog();\r\n\r\nfunction openEditEntityDialog() {\r\n deviceService.getDeviceCredentials(entityId.id).subscribe(credentials => {\r\n data.credentials = credentials;\r\n customDialog.customDialog(htmlTemplate, EditEntityDialogController).subscribe();\r\n });\r\n}\r\n\r\nfunction EditEntityDialogController(instance) {\r\n let vm = instance;\r\n vm.data = data;\r\n\r\n vm.close = function() {\r\n vm.dialogRef.close(null);\r\n };\r\n\r\n\r\n}",
- "customResources": [],
- "openInSeparateDialog": false,
+ "type": "openDashboardState",
+ "targetDashboardStateId": "launch_command",
+ "setEntityId": true,
+ "stateEntityParamName": null,
+ "openRightLayout": false,
+ "dialogTitle": "Docker commands",
+ "dialogHideDashboardToolbar": true,
+ "dialogWidth": null,
+ "dialogHeight": 40,
+ "openInSeparateDialog": true,
"openInPopover": false,
"id": "ae2e5995-505f-a241-5fb2-6cbaf08b1b55"
},
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/device-gateway-command.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/device-gateway-command.component.html
index 7a58c51852..24c06f4e67 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/device-gateway-command.component.html
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/device-gateway-command.component.html
@@ -42,32 +42,4 @@
">
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/device-gateway-command.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/device-gateway-command.component.scss
index 023744b827..1bfaf33cfe 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/device-gateway-command.component.scss
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/device-gateway-command.component.scss
@@ -18,78 +18,11 @@
height: 100%;
display: block;
- ::ng-deep.tb-markdown-view {
- .start-code {
- .code-wrapper {
- padding: 0;
-
- pre[class*=language-] {
- margin: 0;
- padding: 9px 38px 9px 16px;
- background: rgba(0, 0, 0, 0.03);
- border-radius: 6px;
- border: none;
- }
-
- code[class*="language-"], pre[class*="language-"] {
- font-family: 'Roboto';
- font-style: normal;
- font-weight: 400;
- font-size: 12px;
- line-height: 16px;
- letter-spacing: 0.25px;
- color: rgba(0, 0, 0, 0.38);
- overflow: hidden;
- white-space: break-spaces;
- word-break: break-all;
-
- & * {
- color: rgba(0, 0, 0, 0.38);
- cursor: inherit;
- background: transparent;
- }
- }
-
- button.clipboard-btn {
- right: 0;
- height: 34px;
-
- p, div {
- background: transparent;
- }
-
- p {
- margin: 0;
- padding: 7px;
- color: #305680;
- }
-
- div {
- top: 0;
- padding: 8px;
- height: 34px;
- width: 34px;
-
- img {
- display: none;
- }
-
- &:after {
- content: "";
- position: initial;
- display: block;
- width: 18px;
- height: 18px;
- background: #305680;
- -webkit-mask-image: url(/assets/copy-code-icon.svg);
- -webkit-mask-repeat: no-repeat;
- mask-image: url(/assets/copy-code-icon.svg);
- mask-repeat: no-repeat;
- }
- }
- }
- }
+ ::ng-deep .tb-markdown-view .start-code code[class*="language-"],
+ ::ng-deep .tb-markdown-view .start-code pre[class*="language-"] {
+ overflow: hidden;
+ white-space: break-spaces;
+ word-break: break-all;
}
- }
}
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/device-gateway-command.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/device-gateway-command.component.ts
index 33d6e7ef24..cd6197913f 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/device-gateway-command.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/device-gateway-command.component.ts
@@ -14,7 +14,7 @@
/// limitations under the License.
///
-import { Component, Input, OnInit } from '@angular/core';
+import { ChangeDetectorRef, Component, Input, OnInit } from '@angular/core';
import { FormControl } from '@angular/forms';
import { Router } from '@angular/router';
import { Store } from '@ngrx/store';
@@ -53,6 +53,7 @@ export class DeviceGatewayCommandComponent implements OnInit {
constructor(protected router: Router,
protected store: Store,
private translate: TranslateService,
+ private cd: ChangeDetectorRef,
private deviceService: DeviceService) {
}
@@ -63,6 +64,7 @@ export class DeviceGatewayCommandComponent implements OnInit {
this.deviceService.getDeviceCredentials(this.deviceId).subscribe(credentials => {
this.token = credentials.credentialsId;
this.createRunCode(HOST);
+ this.cd.detectChanges()
});
}
this.selectedOSCControl = new FormControl('');
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-configuration.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-configuration.component.scss
index 3460d28745..462cc64ec9 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-configuration.component.scss
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-configuration.component.scss
@@ -64,10 +64,6 @@
.security-toggle-group {
margin-bottom: 15px;
margin-right: auto;
-
- ::ng-deep span {
- padding: 0 25px;
- }
}
.logs-label {
@@ -111,6 +107,10 @@
z-index: 100;
}
+ ::ng-deep.security-toggle-group span {
+ padding: 0 25px;
+ }
+
mat-panel-title {
display: block;
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.scss
index a39a83d166..57a9d5dd34 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.scss
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.scss
@@ -54,10 +54,6 @@
//flex-shrink: 1;
}
- mat-expansion-panel {
- border: 1px solid #305680;
- }
-
mat-card {
padding-left: 10px;
background: transparent;
@@ -75,10 +71,6 @@
flex-grow: 1;
}
- .mat-accordion .mat-expansion-panel {
- border-radius: 5px;
- }
-
.action-btns {
margin: 10px 10px 0;
}