mirror of
https://github.com/ansible/awx.git
synced 2026-01-15 03:40:42 -03:30
Work on getting extra vars popout working on inv form
This commit is contained in:
parent
43ef4183df
commit
bed63b3690
@ -1,58 +1,57 @@
|
||||
const templateUrl = require('~components/code-mirror/code-mirror.partial.html');
|
||||
|
||||
const CodeMirrorModalID = '#CodeMirror-modal';
|
||||
const ParseVariable = 'parseType';
|
||||
const ParseType = 'yaml';
|
||||
|
||||
function atCodeMirrorController (
|
||||
$scope,
|
||||
strings,
|
||||
ParseTypeChange,
|
||||
ParseVariableString
|
||||
ParseTypeChange
|
||||
) {
|
||||
const vm = this;
|
||||
const variablesName = `${$scope.name}_variables`;
|
||||
function init (vars, name) {
|
||||
console.log('init', $scope, vars);
|
||||
function init () {
|
||||
if ($scope.disabled === 'true') {
|
||||
$scope.disabled = true;
|
||||
} else if ($scope.disabled === 'false') {
|
||||
$scope.disabled = false;
|
||||
}
|
||||
$scope.variablesName = variablesName;
|
||||
// $scope[variablesName] = ParseVariableString(_.cloneDeep(vars));
|
||||
$scope.variables = {
|
||||
value: ParseVariableString(_.cloneDeep(vars)),
|
||||
};
|
||||
$scope.value = $scope.variables.value;
|
||||
$scope.parseType = ParseType;
|
||||
const options = {
|
||||
|
||||
ParseTypeChange({
|
||||
scope: $scope,
|
||||
variable: 'value', // variablesName,
|
||||
parse_variable: ParseVariable,
|
||||
field_id: name,
|
||||
readOnly: $scope.disabled,
|
||||
onChange: (value) => {
|
||||
console.log('change', value);
|
||||
},
|
||||
};
|
||||
ParseTypeChange(options);
|
||||
variable: 'variables',
|
||||
parse_variable: 'parseType',
|
||||
field_id: `${$scope.name}_variables`,
|
||||
readOnly: $scope.disabled
|
||||
});
|
||||
}
|
||||
|
||||
function expand () {
|
||||
vm.expanded = true;
|
||||
}
|
||||
|
||||
function close () {
|
||||
function close (varsFromModal) {
|
||||
// TODO: make sure that the variables format matches
|
||||
// parseType before re-initializing CodeMirror. Ex)
|
||||
// user changes the format from yaml to json in the
|
||||
// modal but CM in the form is set to YAML
|
||||
$scope.variables = varsFromModal;
|
||||
// New set of variables from the modal, reinit codemirror
|
||||
ParseTypeChange({
|
||||
scope: $scope,
|
||||
variable: 'variables',
|
||||
parse_variable: 'parseType',
|
||||
field_id: `${$scope.name}_variables`,
|
||||
readOnly: $scope.disabled
|
||||
});
|
||||
$(CodeMirrorModalID).off('hidden.bs.modal');
|
||||
$(CodeMirrorModalID).modal('hide');
|
||||
$('.popover').popover('hide');
|
||||
vm.expanded = false;
|
||||
}
|
||||
|
||||
// vm.variablesName = variablesName;
|
||||
vm.name = $scope.name;
|
||||
vm.modalName = `${vm.name}_modal`;
|
||||
vm.strings = strings;
|
||||
vm.expanded = false;
|
||||
vm.close = close;
|
||||
@ -68,8 +67,7 @@ function atCodeMirrorController (
|
||||
atCodeMirrorController.$inject = [
|
||||
'$scope',
|
||||
'CodeMirrorStrings',
|
||||
'ParseTypeChange',
|
||||
'ParseVariableString'
|
||||
'ParseTypeChange'
|
||||
];
|
||||
|
||||
function atCodeMirrorTextarea () {
|
||||
@ -86,7 +84,7 @@ function atCodeMirrorTextarea () {
|
||||
labelClass: '@',
|
||||
tooltip: '@',
|
||||
tooltipPlacement: '@',
|
||||
variables: '@',
|
||||
variables: '=',
|
||||
name: '@',
|
||||
init: '='
|
||||
}
|
||||
|
||||
@ -23,7 +23,7 @@
|
||||
type="radio"
|
||||
value="yaml"
|
||||
ng-model="parseType"
|
||||
ng-change="parseTypeChange('parseType', vm.variables)"
|
||||
ng-change="parseTypeChange('parseType', 'variables')"
|
||||
class="ng-pristine ng-untouched ng-valid ng-not-empty">
|
||||
{{ vm.strings.get('label.YAML')}}
|
||||
</label>
|
||||
@ -32,7 +32,7 @@
|
||||
type="radio"
|
||||
value="json"
|
||||
ng-model="parseType"
|
||||
ng-change="parseTypeChange('parseType', vm.variables)"
|
||||
ng-change="parseTypeChange('parseType', 'variables')"
|
||||
class="ng-pristine ng-untouched ng-valid ng-not-empty">
|
||||
{{ vm.strings.get('label.JSON')}}
|
||||
</label>
|
||||
@ -44,18 +44,18 @@
|
||||
<textarea
|
||||
ng-disabled="disabled"
|
||||
rows="6"
|
||||
ng-model="variables.value"
|
||||
name="variablesName"
|
||||
ng-model="variables"
|
||||
name="{{ vm.name }}_variables"
|
||||
class="form-control Form-textArea"
|
||||
id="{{ vm.name }}">
|
||||
id="{{ vm.name }}_variables">
|
||||
</textarea>
|
||||
<at-code-mirror-modal
|
||||
name="{{ vm.modalName }}"
|
||||
name="{{ vm.name }}"
|
||||
ng-if="vm.expanded"
|
||||
variables="variables"
|
||||
modal-vars="variables"
|
||||
tooltip="{{ tooltip || vm.strings.get('code_mirror.tooltip.TOOLTIP') }}"
|
||||
label="{{ label || vm.strings.get('code_mirror.label.VARIABLES') }}"
|
||||
disabled="{{ disabled || false }}"
|
||||
close-fn="vm.close()">
|
||||
close-fn="vm.close">
|
||||
</at-code-mirror-modal>
|
||||
</div>
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
const templateUrl = require('~components/code-mirror/modal/code-mirror-modal.partial.html');
|
||||
|
||||
const CodeMirrorModalID = '#CodeMirror-modal';
|
||||
const ParseVariable = 'parseType';
|
||||
// const ParseVariable = 'parseType';
|
||||
const ParseType = 'yaml';
|
||||
const ModalHeight = '#CodeMirror-modal .modal-dialog';
|
||||
const ModalHeader = '.atCodeMirror-label';
|
||||
@ -10,8 +10,7 @@ const ModalFooter = '.CodeMirror-modalControls';
|
||||
function atCodeMirrorModalController (
|
||||
$scope,
|
||||
strings,
|
||||
ParseTypeChange,
|
||||
// ParseVariableString
|
||||
ParseTypeChange
|
||||
) {
|
||||
const vm = this;
|
||||
const variablesName = `${$scope.name}_variables`;
|
||||
@ -28,28 +27,25 @@ function atCodeMirrorModalController (
|
||||
}
|
||||
|
||||
function toggle () {
|
||||
$scope.parseTypeChange('parseType', variablesName);
|
||||
$scope.parseTypeChange('parseType', 'modalVars');
|
||||
setTimeout(resize, 0);
|
||||
}
|
||||
|
||||
function init (vars, name) {
|
||||
function init () {
|
||||
if ($scope.disabled === 'true') {
|
||||
$scope.disabled = true;
|
||||
} else if ($scope.disabled === 'false') {
|
||||
$scope.disabled = false;
|
||||
}
|
||||
$(CodeMirrorModalID).modal('show');
|
||||
// $scope[variablesName] = ParseVariableString(_.cloneDeep(vars));
|
||||
$scope.parseType = ParseType;
|
||||
$scope.value = $scope.variables.value;
|
||||
const options = {
|
||||
ParseTypeChange({
|
||||
scope: $scope,
|
||||
variable: 'value', // variablesName,
|
||||
parse_variable: ParseVariable,
|
||||
field_id: name,
|
||||
variable: 'modalVars',
|
||||
parse_variable: 'parseType',
|
||||
field_id: 'variables_modal',
|
||||
readOnly: $scope.disabled
|
||||
};
|
||||
ParseTypeChange(options);
|
||||
});
|
||||
resize();
|
||||
$(CodeMirrorModalID).on('hidden.bs.modal', $scope.closeFn);
|
||||
$(`${CodeMirrorModalID} .modal-dialog`).resizable({
|
||||
@ -57,15 +53,14 @@ function atCodeMirrorModalController (
|
||||
minWidth: 600
|
||||
});
|
||||
$(`${CodeMirrorModalID} .modal-dialog`).on('resize', resize);
|
||||
|
||||
$scope.foovars = 'testing';
|
||||
}
|
||||
|
||||
vm.variablesName = variablesName;
|
||||
vm.name = $scope.name;
|
||||
vm.strings = strings;
|
||||
vm.toggle = toggle;
|
||||
$scope.close = () => {
|
||||
$scope.variables.value = $scope.value;
|
||||
$scope.closeFn();
|
||||
$scope.closeFn()($scope.modalVars);
|
||||
};
|
||||
if ($scope.init) {
|
||||
$scope.init = init;
|
||||
@ -79,7 +74,6 @@ atCodeMirrorModalController.$inject = [
|
||||
'$scope',
|
||||
'CodeMirrorStrings',
|
||||
'ParseTypeChange',
|
||||
'ParseVariableString',
|
||||
];
|
||||
|
||||
function atCodeMirrorModal () {
|
||||
@ -95,7 +89,7 @@ function atCodeMirrorModal () {
|
||||
label: '@',
|
||||
labelClass: '@',
|
||||
tooltip: '@',
|
||||
variables: '=',
|
||||
modalVars: '=',
|
||||
name: '@',
|
||||
closeFn: '&'
|
||||
}
|
||||
|
||||
@ -53,15 +53,12 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
{{extra_variables}}
|
||||
:
|
||||
{{variables.value}}
|
||||
<textarea
|
||||
ng-disabled="disabled"
|
||||
ng-model="extra_variables"
|
||||
ng-model="modalVars"
|
||||
name="extra_variables"
|
||||
class="form-control Form-textArea"
|
||||
id="{{ vm.name }}">
|
||||
id="variables_modal">
|
||||
</textarea>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
|
||||
@ -81,6 +81,7 @@ function(i18n) {
|
||||
// },
|
||||
inventory_variables: {
|
||||
realName: 'variables',
|
||||
root: 'inventory',
|
||||
label: i18n._('Variables'),
|
||||
type: 'code_mirror',
|
||||
class: 'Form-formGroup--fullWidth',
|
||||
|
||||
@ -1370,8 +1370,8 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
|
||||
html += `class="${field.class}" `;
|
||||
html += `label="${field.label}" `;
|
||||
html += `tooltip="${field.awPopOver}" `;
|
||||
html += `name="${field.realName}" `;
|
||||
html += `variables="{{ ${field.variables} }}" `;
|
||||
html += `name="${field.root}" `;
|
||||
html += `variables="${field.variables}" `;
|
||||
html += '></at-code-mirror>';
|
||||
}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user