fix(frontend): populate data between simple and advanced modes (#4503)

fix-4503-cannot-access-configuration-details-view-containing-binary-data
Simon Meng 2020-12-13 14:43:55 +13:00 committed by MaximeBajeux
parent 121d33538d
commit 0b74aae461
2 changed files with 30 additions and 2 deletions

View File

@ -6,10 +6,10 @@
<div class="form-group">
<div class="col-sm-12">
<p>
<a class="small interactive" ng-if="$ctrl.formValues.IsSimple" ng-click="$ctrl.formValues.IsSimple = false">
<a class="small interactive" ng-if="$ctrl.formValues.IsSimple" ng-click="$ctrl.showAdvancedMode()">
<i class="fa fa-list-ol space-right" aria-hidden="true"></i> Advanced mode
</a>
<a class="small interactive" ng-if="!$ctrl.formValues.IsSimple" ng-click="$ctrl.formValues.IsSimple = true">
<a class="small interactive" ng-if="!$ctrl.formValues.IsSimple" ng-click="$ctrl.showSimpleMode()">
<i class="fa fa-edit space-right" aria-hidden="true"></i> Simple mode
</a>
</p>

View File

@ -2,6 +2,7 @@ import angular from 'angular';
import _ from 'lodash-es';
import { KubernetesConfigurationFormValuesDataEntry } from 'Kubernetes/models/configuration/formvalues';
import KubernetesFormValidationHelper from 'Kubernetes/helpers/formValidationHelper';
import YAML from 'yaml';
class KubernetesConfigurationDataController {
/* @ngInject */
@ -12,6 +13,8 @@ class KubernetesConfigurationDataController {
this.editorUpdateAsync = this.editorUpdateAsync.bind(this);
this.onFileLoad = this.onFileLoad.bind(this);
this.onFileLoadAsync = this.onFileLoadAsync.bind(this);
this.showSimpleMode = this.showSimpleMode.bind(this);
this.showAdvancedMode = this.showAdvancedMode.bind(this);
}
onChangeKey() {
@ -57,6 +60,31 @@ class KubernetesConfigurationDataController {
}
}
showSimpleMode() {
this.formValues.IsSimple = true;
YAML.defaultOptions.customTags = ['binary'];
const data = YAML.parse(this.formValues.DataYaml);
this.formValues.Data = _.map(data, (value, key) => {
const entry = new KubernetesConfigurationFormValuesDataEntry();
entry.Key = key;
entry.Value = value;
return entry;
});
}
showAdvancedMode() {
this.formValues.IsSimple = false;
const data = _.reduce(
this.formValues.Data,
(acc, entry) => {
acc[entry.Key] = entry.Value;
return acc;
},
{}
);
this.formValues.DataYaml = YAML.stringify(data);
}
$onInit() {
this.state = {
duplicateKeys: {},