1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
|
import { Component, Input, OnInit } from '@angular/core';
import { FormControl, NgForm } from '@angular/forms';
import _ from 'lodash';
import { ConfigurationService } from '~/app/shared/api/configuration.service';
import { Icons } from '~/app/shared/enum/icons.enum';
import { CdFormGroup } from '~/app/shared/forms/cd-form-group';
import { ConfigOptionTypes } from './config-option.types';
@Component({
selector: 'cd-config-option',
templateUrl: './config-option.component.html',
styleUrls: ['./config-option.component.scss']
})
export class ConfigOptionComponent implements OnInit {
@Input()
optionNames: Array<string> = [];
@Input()
optionsForm: CdFormGroup = new CdFormGroup({});
@Input()
optionsFormDir: NgForm = new NgForm([], []);
@Input()
optionsFormGroupName = '';
@Input()
optionsFormShowReset = true;
icons = Icons;
options: Array<any> = [];
optionsFormGroup: CdFormGroup = new CdFormGroup({});
constructor(private configService: ConfigurationService) {}
private static optionNameToText(optionName: string): string {
const sections = ['mon', 'mgr', 'osd', 'mds', 'client'];
return optionName
.split('_')
.filter((c, index) => index !== 0 || !sections.includes(c))
.map((c) => c.charAt(0).toUpperCase() + c.substring(1))
.join(' ');
}
ngOnInit() {
this.createForm();
this.loadStoredData();
}
private createForm() {
this.optionsForm.addControl(this.optionsFormGroupName, this.optionsFormGroup);
this.optionNames.forEach((optionName) => {
this.optionsFormGroup.addControl(optionName, new FormControl(null));
});
}
getStep(type: string, value: any): number | undefined {
return ConfigOptionTypes.getTypeStep(type, value);
}
private loadStoredData() {
this.configService.filter(this.optionNames).subscribe((data: any) => {
this.options = data.map((configOption: any) => {
const formControl = this.optionsForm.get(configOption.name);
const typeValidators = ConfigOptionTypes.getTypeValidators(configOption);
configOption.additionalTypeInfo = ConfigOptionTypes.getType(configOption.type);
// Set general information and value
configOption.text = ConfigOptionComponent.optionNameToText(configOption.name);
configOption.value = _.find(configOption.value, (p) => {
return p.section === 'osd'; // TODO: Can handle any other section
});
if (configOption.value) {
if (configOption.additionalTypeInfo.name === 'bool') {
formControl.setValue(configOption.value.value === 'true');
} else {
formControl.setValue(configOption.value.value);
}
}
// Set type information and validators
if (typeValidators) {
configOption.patternHelpText = typeValidators.patternHelpText;
if ('max' in typeValidators && typeValidators.max !== '') {
configOption.maxValue = typeValidators.max;
}
if ('min' in typeValidators && typeValidators.min !== '') {
configOption.minValue = typeValidators.min;
}
formControl.setValidators(typeValidators.validators);
}
return configOption;
});
});
}
saveValues() {
const options = {};
this.optionNames.forEach((optionName) => {
const optionValue = this.optionsForm.getValue(optionName);
if (optionValue !== null && optionValue !== '') {
options[optionName] = {
section: 'osd', // TODO: Can handle any other section
value: optionValue
};
}
});
return this.configService.bulkCreate({ options: options });
}
resetValue(optionName: string) {
this.configService.delete(optionName, 'osd').subscribe(
// TODO: Can handle any other section
() => {
const formControl = this.optionsForm.get(optionName);
formControl.reset();
}
);
}
}
|
