111 lines
2.5 KiB
JavaScript
111 lines
2.5 KiB
JavaScript
import Ember from 'ember';
|
|
import { capitalize } from 'vault/helpers/capitalize';
|
|
import { humanize } from 'vault/helpers/humanize';
|
|
import { dasherize } from 'vault/helpers/dasherize';
|
|
const { computed } = Ember;
|
|
|
|
export default Ember.Component.extend({
|
|
'data-test-field': true,
|
|
classNames: ['field'],
|
|
|
|
/*
|
|
* @public Function
|
|
* called whenever a value on the model changes via the component
|
|
*
|
|
*/
|
|
onChange() {},
|
|
|
|
/*
|
|
* @public
|
|
* @param Object
|
|
* in the form of
|
|
* {
|
|
* name: "foo",
|
|
* options: {
|
|
* label: "Foo",
|
|
* defaultValue: "",
|
|
* editType: "ttl",
|
|
* helpText: "This will be in a tooltip"
|
|
* },
|
|
* type: "boolean"
|
|
* }
|
|
*
|
|
* this is usually derived from ember model `attributes` lookup,
|
|
* and all members of `attr.options` are optional
|
|
*
|
|
*/
|
|
attr: null,
|
|
|
|
/*
|
|
* @private
|
|
* @param string
|
|
* Computed property used in the label element next to the form element
|
|
*
|
|
*/
|
|
labelString: computed('attr.name', 'attr.options.label', function() {
|
|
const label = this.get('attr.options.label');
|
|
const name = this.get('attr.name');
|
|
if (label) {
|
|
return label;
|
|
}
|
|
if (name) {
|
|
return capitalize([humanize([dasherize([name])])]);
|
|
}
|
|
}),
|
|
|
|
// both the path to mutate on the model, and the path to read the value from
|
|
/*
|
|
* @private
|
|
* @param string
|
|
*
|
|
* Computed property used to set values on the passed model
|
|
*
|
|
*/
|
|
valuePath: computed('attr.name', 'attr.options.fieldValue', function() {
|
|
return this.get('attr.options.fieldValue') || this.get('attr.name');
|
|
}),
|
|
|
|
/*
|
|
*
|
|
* @public
|
|
* @param DS.Model
|
|
*
|
|
* the Ember Data model that `attr` is defined on
|
|
*/
|
|
model: null,
|
|
|
|
/*
|
|
* @private
|
|
* @param object
|
|
*
|
|
* Used by the pgp-file component when an attr is editType of 'file'
|
|
*/
|
|
file: { value: '' },
|
|
emptyData: '{\n}',
|
|
|
|
actions: {
|
|
setFile(_, keyFile) {
|
|
const path = this.get('valuePath');
|
|
const { value } = keyFile;
|
|
this.get('model').set(path, value);
|
|
this.get('onChange')(path, value);
|
|
this.set('file', keyFile);
|
|
},
|
|
|
|
setAndBroadcast(path, value) {
|
|
this.get('model').set(path, value);
|
|
this.get('onChange')(path, value);
|
|
},
|
|
|
|
codemirrorUpdated(path, value, codemirror) {
|
|
codemirror.performLint();
|
|
const hasErrors = codemirror.state.lint.marked.length > 0;
|
|
|
|
if (!hasErrors) {
|
|
this.get('model').set(path, JSON.parse(value));
|
|
this.get('onChange')(path, JSON.parse(value));
|
|
}
|
|
},
|
|
},
|
|
});
|