8000 fix(ui): read-only input style, some fixes (#4324) · ovh/cds@254a451 · GitHub
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

Commit 254a451

Browse files
richardltbnjjj
richardlt
authored and
bnjjj
committed
fix(ui): read-only input style, some fixes (#4324)
1 parent eb86fb7 commit 254a451

File tree

6 files changed

+58
-59
lines changed

6 files changed

+58
-59
lines changed

‎ui/src/app/shared/workflow/node/hook/details/hook.details.component.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ <h3>{{'workflow_hook_log_title' | translate}}</h3>
4646
<codemirror
4747
[ngModel]="task.webhook.request_body"
4848
[config]="codeMirrorConfig"
49-
#bodyCode>
49+
#code>
5050
</codemirror>
5151
</div>
5252
</ng-container>

‎ui/src/app/shared/workflow/node/hook/details/hook.details.component.scss

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,3 @@
1-
input:read-only {
2-
background-color: #dedede !important;
3-
}
4-
51
codemirror {
62
width: 100%;
73
}

‎ui/src/app/shared/workflow/node/hook/details/hook.details.component.ts

Lines changed: 53 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -1,48 +1,63 @@
1-
import {Component, ViewChild} from '@angular/core';
2-
import {cloneDeep} from 'lodash';
3-
import {ModalTemplate, SuiModalService, TemplateModalConfig} from 'ng2-semantic-ui';
4-
import {ActiveModal} from 'ng2-semantic-ui/dist';
5-
import {TaskExecution} from '../../../../../model/workflow.hook.model';
1+
import { Component, OnInit, ViewChild } from '@angular/core';
2+
import { TaskExecution } from 'app/model/workflow.hook.model';
3+
import { ThemeStore } from 'app/service/services.module';
4+
import { AutoUnsubscribe } from 'app/shared/decorator/autoUnsubscribe';
5+
import { cloneDeep } from 'lodash';
6+
import { ModalTemplate, SuiModalService, TemplateModalConfig } from 'ng2-semantic-ui';
7+
import { ActiveModal } from 'ng2-semantic-ui/dist';
8+
import { Subscription } from 'rxjs';
69

710
@Component({
8-
selector: 'app-workflow-node-hook-details',
9-
templateUrl: './hook.details.component.html',
10-
styleUrls: ['./hook.details.component.scss']
11+
selector: 'app-workflow-node-hook-details',
12+
templateUrl: './hook.details.component.html',
13+
styleUrls: ['./hook.details.component.scss']
1114
})
12-
export class WorkflowNodeHookDetailsComponent {
13-
codeMirrorConfig: any;
15+
@AutoUnsubscribe()
16+
export class WorkflowNodeHookDetailsComponent implements OnInit {
17+
@ViewChild('code') codemirror: any;
1418

15-
// Ng semantic modal
16-
@ViewChild('nodeHookDetailsModal')
17-
public nodeHookDetailsModal: ModalTemplate<boolean, boolean, void>;
18-
modal: ActiveModal<boolean, boolean, void>;
19-
modalConfig: TemplateModalConfig<boolean, boolean, void>;
19+
@ViewChild('nodeHookDetailsModal') nodeHookDetailsModal: ModalTemplate<boolean, boolean, void>;
20+
modal: ActiveModal<boolean, boolean, void>;
21+
modalConfig: TemplateModalConfig<boolean, boolean, void>;
2022

21-
task: TaskExecution;
23+
task: TaskExecution;
24+
codeMirrorConfig: any;
25+
themeSubscription: Subscription;
2226

23-
constructor(private _modalService: SuiModalService) {
24-
this.codeMirrorConfig = {
25-
matchBrackets: true,
26-
autoCloseBrackets: true,
27-
mode: 'application/json',
28-
lineWrapping: true,
29-
autoRefresh: true,
30-
readOnly: true
31-
};
32-
}
27+
constructor(
28+
private _modalService: SuiModalService,
29+
private _theme: ThemeStore
30+
) {
31+
this.codeMirrorConfig = {
32+
matchBrackets: true,
33+
autoCloseBrackets: true,
34+
mode: 'application/json',
35+
lineWrapping: true,
36+
autoRefresh: true,
37+
readOnly: true
38+
};
39+
}
3340

34-
show(taskExec: TaskExecution): void {
35-
this.task = cloneDeep(taskExec);
36-
if (this.task.webhook && this.task.webhook.request_body) {
37-
let body = atob(this.task.webhook.request_body);
38-
try {
39-
this.task.webhook.request_body = JSON.stringify(JSON.parse(body), null, 4);
40-
} catch (e) {
41-
this.task.webhook.request_body = body;
42-
}
41+
ngOnInit(): void {
42+
this.themeSubscription = this._theme.get().subscribe(t => {
43+
this.codeMirrorConfig.theme = t === 'night' ? 'darcula' : 'default';
44+
if (this.codemirror && this.codemirror.instance) {
45+
this.codemirror.instance.setOption('theme', this.codeMirrorConfig.theme);
46+
}
47+
});
48+
}
4349

44-
}
45-
this.modalConfig = new TemplateModalConfig<boolean, boolean, void>(this.nodeHookDetailsModal);
46-
this.modal = this._modalService.open(this.modalConfig);
50+
show(taskExec: TaskExecution): void {
51+
this.task = cloneDeep(taskExec);
52+
if (this.task.webhook && this.task.webhook.request_body) {
53+
let body = atob(this.task.webhook.request_body);
54+
try {
55+
this.task.webhook.request_body = JSON.stringify(JSON.parse(body), null, 4);
56+
} catch (e) {
57+
this.task.webhook.request_body = body;
58+
}
4759
}
60+
this.modalConfig = new TemplateModalConfig<boolean, boolean, void>(this.nodeHookDetailsModal);
61+
this.modal = this._modalService.open(this.modalConfig);
62+
}
4863
}

‎ui/src/app/shared/workflow/wizard/hook/hook.form.scss

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -13,10 +13,6 @@ codemirror {
1313
}
1414
}
1515

16-
input:read-only {
17-
background-color: #dedede !important;
18-
}
19-
2016
.mb15 {
2117
margin-bottom: 15px;
2218
}

‎ui/src/app/views/settings/workflow-template/add/workflow-template.add.html

Lines changed: 0 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -7,18 +7,6 @@
77
{{'workflow_template_help_add_from' | translate: {projectKey: projectKey, workflowName:
88
workflowName} }}
99
</div>
10-
<div *ngIf="projectKey && workflowName" class="ui green message">
11-
{{'workflow_template_help_add_from' | translate: {projectKey: projectKey, workflowName:
12-
workflowName} }}
13-
</div>
14-
<div *ngIf="projectKey && workflowName" class="ui orange message">
15-
{{'workflow_template_help_add_from' | translate: {projectKey: projectKey, workflowName:
16-
workflowName} }}
17-
</div>
18-
<div *ngIf="projectKey && workflowName" class="ui red message">
19-
{{'workflow_template_help_add_from' | translate: {projectKey: projectKey, workflowName:
20-
workflowName} }}
21-
</div>
2210
<app-workflow-template-form mode="add" [loading]="loading" [workflowTemplate]="workflowTemplate"
2311
[groups]="groups" [errors]="errors" (save)="saveWorkflowTemplate($event)"></app-workflow-template-form>
2412
</div>

‎ui/src/theme.scss

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -192,6 +192,10 @@ a.ui.card:hover,
192192
color: inherit;
193193
}
194194

195+
input:read-only {
196+
opacity: 0.45
197+
}
198+
195199
.ui.form input,
196200
.ui.form textarea,
197201
.ui.input input {

0 commit comments

Comments
 (0)
0