forked from platypush/platypush
216 lines
6.6 KiB
JavaScript
216 lines
6.6 KiB
JavaScript
Vue.component('execute', {
|
|
template: '#tmpl-execute',
|
|
props: ['config'],
|
|
data: function() {
|
|
return {
|
|
loading: false,
|
|
running: false,
|
|
structuredInput: true,
|
|
actionChanged: false,
|
|
selectedDoc: undefined,
|
|
selectedProcedure: {
|
|
name: undefined,
|
|
args: {},
|
|
},
|
|
|
|
response: undefined,
|
|
error: undefined,
|
|
htmlDoc: false,
|
|
rawRequest: undefined,
|
|
actions: {},
|
|
plugins: {},
|
|
procedures: {},
|
|
action: {
|
|
name: undefined,
|
|
args: {},
|
|
extraArgs: [],
|
|
supportsExtraArgs: false,
|
|
},
|
|
};
|
|
},
|
|
|
|
methods: {
|
|
refresh: async function() {
|
|
this.loading = true;
|
|
this.procedures = JSON.parse(this.config);
|
|
this.plugins = await request('inspect.get_all_plugins', {html_doc: true});
|
|
|
|
for (const plugin of Object.values(this.plugins)) {
|
|
if (plugin.html_doc)
|
|
this.htmlDoc = true;
|
|
|
|
for (const action of Object.values(plugin.actions)) {
|
|
action.name = plugin.name + '.' + action.name;
|
|
action.supportsExtraArgs = !!action.has_kwargs;
|
|
delete action.has_kwargs;
|
|
this.actions[action.name] = action;
|
|
}
|
|
}
|
|
|
|
const self = this;
|
|
autocomplete(this.$refs.actionName, Object.keys(this.actions).sort(), (evt, value) => {
|
|
this.action.name = value;
|
|
self.updateAction();
|
|
});
|
|
|
|
this.loading = false;
|
|
},
|
|
|
|
updateAction: function() {
|
|
if (!this.actionChanged || !(this.action.name in this.actions))
|
|
return;
|
|
|
|
this.loading = true;
|
|
this.action = {
|
|
...this.actions[this.action.name],
|
|
args: Object.entries(this.actions[this.action.name].args).reduce((args, entry) => {
|
|
args[entry[0]] = {
|
|
...entry[1],
|
|
value: entry[1].default,
|
|
};
|
|
|
|
return args;
|
|
}, {}),
|
|
extraArgs: [],
|
|
};
|
|
|
|
this.selectedDoc = this.action.doc;
|
|
this.actionChanged = false;
|
|
this.response = undefined;
|
|
this.error = undefined;
|
|
this.loading = false;
|
|
},
|
|
|
|
updateProcedure: function(name) {
|
|
if (event.target.getAttribute('type') === 'submit') {
|
|
return;
|
|
}
|
|
|
|
if (this.selectedProcedure.name === name) {
|
|
this.selectedProcedure = {
|
|
name: undefined,
|
|
args: {},
|
|
};
|
|
|
|
return;
|
|
}
|
|
|
|
if (!(name in this.procedures)) {
|
|
console.warn('Procedure not found: ' + name);
|
|
return;
|
|
}
|
|
|
|
this.selectedProcedure = {
|
|
name: name,
|
|
args: this.procedures[name].args.reduce((args, arg) => {
|
|
args[arg] = undefined;
|
|
return args;
|
|
}, {}),
|
|
};
|
|
},
|
|
|
|
addParameter: function() {
|
|
this.action.extraArgs.push({
|
|
name: undefined,
|
|
value: undefined,
|
|
})
|
|
},
|
|
|
|
removeParameter: function(i) {
|
|
this.action.extraArgs.pop(i);
|
|
},
|
|
|
|
selectAttrDoc: function(name) {
|
|
this.response = undefined;
|
|
this.error = undefined;
|
|
this.selectedDoc = this.action.args[name].doc;
|
|
},
|
|
|
|
resetDoc: function() {
|
|
this.response = undefined;
|
|
this.error = undefined;
|
|
this.selectedDoc = this.action.doc;
|
|
},
|
|
|
|
onInputTypeChange: function(structuredInput) {
|
|
this.structuredInput = structuredInput;
|
|
this.response = undefined;
|
|
this.error = undefined;
|
|
},
|
|
|
|
onResponse: function(response) {
|
|
this.response = '<pre>' + JSON.stringify(response, null, 2) + '</pre>';
|
|
this.error = undefined;
|
|
},
|
|
|
|
onError: function(error) {
|
|
this.response = undefined;
|
|
this.error = '<pre>' + error + '</pre>';
|
|
},
|
|
|
|
onDone: function() {
|
|
this.running = false;
|
|
},
|
|
|
|
executeAction: function() {
|
|
if (!this.action.name && !this.rawRequest || this.running)
|
|
return;
|
|
|
|
this.running = true;
|
|
if (this.structuredInput) {
|
|
const args = {
|
|
...Object.entries(this.action.args).reduce((args, param) => {
|
|
if (param[1].value != null) {
|
|
let value = param[1].value;
|
|
try {value = JSON.parse(value);}
|
|
catch (e) {}
|
|
args[param[0]] = value;
|
|
}
|
|
return args;
|
|
}, {}),
|
|
|
|
...this.action.extraArgs.reduce((args, param) => {
|
|
let value = args[param.value];
|
|
try {value = JSON.parse(value);}
|
|
catch (e) {}
|
|
|
|
args[param.name] = value;
|
|
return args;
|
|
}, {})
|
|
};
|
|
|
|
request(this.action.name, args).then(this.onResponse).catch(this.onError).finally(this.onDone);
|
|
} else {
|
|
execute(JSON.parse(this.rawRequest)).then(this.onResponse).catch(this.onError).finally(this.onDone);
|
|
}
|
|
},
|
|
|
|
executeProcedure: function(event) {
|
|
if (!this.selectedProcedure.name || this.running)
|
|
return;
|
|
|
|
event.stopPropagation();
|
|
this.running = true;
|
|
const args = {
|
|
...Object.entries(this.selectedProcedure.args).reduce((args, param) => {
|
|
if (param[1] != null) {
|
|
let value = param[1];
|
|
try {value = JSON.parse(value);}
|
|
catch (e) {}
|
|
args[param[0]] = value;
|
|
}
|
|
return args;
|
|
}, {}),
|
|
};
|
|
|
|
request('procedure.' + this.selectedProcedure.name, args)
|
|
.then(this.onResponse).catch(this.onError).finally(this.onDone);
|
|
},
|
|
},
|
|
|
|
created: function() {
|
|
this.refresh();
|
|
},
|
|
});
|
|
|