You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
451 lines
14 KiB
451 lines
14 KiB
1 year ago
|
<?php declare(strict_types = 0);
|
||
|
/*
|
||
|
** Zabbix
|
||
|
** Copyright (C) 2001-2023 Zabbix SIA
|
||
|
**
|
||
|
** This program is free software; you can redistribute it and/or modify
|
||
|
** it under the terms of the GNU General Public License as published by
|
||
|
** the Free Software Foundation; either version 2 of the License, or
|
||
|
** (at your option) any later version.
|
||
|
**
|
||
|
** This program is distributed in the hope that it will be useful,
|
||
|
** but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||
|
** MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||
|
** GNU General Public License for more details.
|
||
|
**
|
||
|
** You should have received a copy of the GNU General Public License
|
||
|
** along with this program; if not, write to the Free Software
|
||
|
** Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
|
||
|
**/
|
||
|
|
||
|
|
||
|
/**
|
||
|
* @var CView $this
|
||
|
*/
|
||
|
?>
|
||
|
|
||
|
window.script_edit_popup = new class {
|
||
|
|
||
|
init({script}) {
|
||
|
this.overlay = overlays_stack.getById('script-form');
|
||
|
this.dialogue = this.overlay.$dialogue[0];
|
||
|
this.form = this.overlay.$dialogue.$body[0].querySelector('form');
|
||
|
this.script = script;
|
||
|
this.scriptid = script.scriptid;
|
||
|
|
||
|
this.#loadView(script);
|
||
|
this.#initActions();
|
||
|
|
||
|
for (const parameter of script.parameters) {
|
||
|
this.#addParameter(parameter);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
#initActions() {
|
||
|
this.form.querySelector('#scope').dispatchEvent(new Event('change'));
|
||
|
this.form.querySelector('#type').dispatchEvent(new Event('change'));
|
||
|
this.form.querySelector('#enable-confirmation').dispatchEvent(new Event('change'));
|
||
|
|
||
|
this.form.querySelector('.js-parameter-add').addEventListener('click', () => {
|
||
|
const template = new Template(this.form.querySelector('#script-parameter-template').innerHTML);
|
||
|
|
||
|
this.form
|
||
|
.querySelector('#parameters-table tbody')
|
||
|
.insertAdjacentHTML('beforeend', template.evaluate({}));
|
||
|
});
|
||
|
|
||
|
this.dialogue.addEventListener('click', (e) => {
|
||
|
if (e.target.classList.contains('js-remove')) {
|
||
|
e.target.closest('tr').remove();
|
||
|
}
|
||
|
});
|
||
|
}
|
||
|
|
||
|
/**
|
||
|
* Adds a new row to the Parameters table with the given parameter data (name, value).
|
||
|
*
|
||
|
* @param {object} parameter The parameter object.
|
||
|
*/
|
||
|
#addParameter(parameter) {
|
||
|
const template = new Template(this.form.querySelector('#script-parameter-template').innerHTML);
|
||
|
|
||
|
this.form
|
||
|
.querySelector('#parameters-table tbody')
|
||
|
.insertAdjacentHTML('beforeend', template.evaluate(parameter));
|
||
|
}
|
||
|
|
||
|
/**
|
||
|
* Compiles necessary fields for popup based on scope, type, confirmation and host group type fields.
|
||
|
*
|
||
|
* @param {object} script The script object.
|
||
|
*/
|
||
|
#loadView(script) {
|
||
|
this.scope = parseInt(script.scope);
|
||
|
this.type = parseInt(script.type);
|
||
|
this.confirmation = script.enable_confirmation;
|
||
|
|
||
|
const type = this.form.querySelector('#type');
|
||
|
|
||
|
// Load scope fields.
|
||
|
this.form.querySelector('#scope').onchange = (e) => {
|
||
|
this.#hideFormFields('all');
|
||
|
this.#loadScopeFields(e);
|
||
|
type.dispatchEvent(new Event('change'));
|
||
|
};
|
||
|
|
||
|
// Load type fields.
|
||
|
type.onchange = (e) => this.#loadTypeFields(script, e);
|
||
|
|
||
|
// Update confirmation fields.
|
||
|
this.form.querySelector('#enable-confirmation').onchange = (e) => this.#loadConfirmationFields(e);
|
||
|
|
||
|
// Test confirmation button.
|
||
|
this.form.querySelector('#test-confirmation').addEventListener('click', (e) =>
|
||
|
executeScript(null, this.form.querySelector('#confirmation').value, e.target)
|
||
|
);
|
||
|
|
||
|
// Host group selection.
|
||
|
const hgstype = this.form.querySelector('#hgstype-select');
|
||
|
const hostgroup_selection = this.form.querySelector('#host-group-selection');
|
||
|
|
||
|
hgstype.onchange = () => hostgroup_selection.style.display = hgstype.value === '1' ? '' : 'none';
|
||
|
|
||
|
hgstype.dispatchEvent(new Event('change'));
|
||
|
this.form.removeAttribute('style');
|
||
|
this.overlay.recoverFocus();
|
||
|
}
|
||
|
|
||
|
clone({title, buttons}) {
|
||
|
this.scriptid = null;
|
||
|
|
||
|
this.overlay.setProperties({title, buttons});
|
||
|
this.overlay.unsetLoading();
|
||
|
this.overlay.recoverFocus();
|
||
|
}
|
||
|
|
||
|
delete() {
|
||
|
const curl = new Curl('zabbix.php');
|
||
|
|
||
|
curl.setArgument('action', 'script.delete');
|
||
|
curl.setArgument('<?= CCsrfTokenHelper::CSRF_TOKEN_NAME ?>',
|
||
|
<?= json_encode(CCsrfTokenHelper::get('script'), JSON_THROW_ON_ERROR) ?>
|
||
|
);
|
||
|
|
||
|
this.#post(curl.getUrl(), {scriptids: [this.scriptid]}, (response) => {
|
||
|
overlayDialogueDestroy(this.overlay.dialogueid);
|
||
|
|
||
|
this.dialogue.dispatchEvent(new CustomEvent('dialogue.submit', {detail: response.success}));
|
||
|
});
|
||
|
}
|
||
|
|
||
|
submit() {
|
||
|
const fields = getFormFields(this.form);
|
||
|
|
||
|
for (let key in fields) {
|
||
|
if (typeof fields[key] === 'string' && key !== 'confirmation') {
|
||
|
fields[key] = fields[key].trim();
|
||
|
}
|
||
|
}
|
||
|
|
||
|
if (typeof fields.parameters !== 'undefined') {
|
||
|
fields.parameters.name = fields.parameters.name.map(name => name.trim());
|
||
|
fields.parameters.value = fields.parameters.value.map(value => value.trim());
|
||
|
}
|
||
|
|
||
|
const curl = new Curl('zabbix.php');
|
||
|
|
||
|
curl.setArgument('action', this.scriptid === null ? 'script.create' : 'script.update');
|
||
|
|
||
|
this.#post(curl.getUrl(), fields, (response) => {
|
||
|
overlayDialogueDestroy(this.overlay.dialogueid);
|
||
|
|
||
|
this.dialogue.dispatchEvent(new CustomEvent('dialogue.submit', {detail: response.success}));
|
||
|
});
|
||
|
}
|
||
|
|
||
|
/**
|
||
|
* Sends a POST request to the specified URL with the provided data and executes the success_callback function.
|
||
|
*
|
||
|
* @param {string} url The URL to send the POST request to.
|
||
|
* @param {object} data The data to send with the POST request.
|
||
|
* @param {callback} success_callback The function to execute when a successful response is received.
|
||
|
*/
|
||
|
#post(url, data, success_callback) {
|
||
|
fetch(url, {
|
||
|
method: 'POST',
|
||
|
headers: {'Content-Type': 'application/json'},
|
||
|
body: JSON.stringify(data)
|
||
|
})
|
||
|
.then((response) => response.json())
|
||
|
.then((response) => {
|
||
|
if ('error' in response) {
|
||
|
throw {error: response.error};
|
||
|
}
|
||
|
|
||
|
return response;
|
||
|
})
|
||
|
.then(success_callback)
|
||
|
.catch((exception) => {
|
||
|
for (const element of this.form.parentNode.children) {
|
||
|
if (element.matches('.msg-good, .msg-bad, .msg-warning')) {
|
||
|
element.parentNode.removeChild(element);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
let title;
|
||
|
let messages;
|
||
|
|
||
|
if (typeof exception === 'object' && 'error' in exception) {
|
||
|
title = exception.error.title;
|
||
|
messages = exception.error.messages;
|
||
|
}
|
||
|
else {
|
||
|
messages = [<?= json_encode(_('Unexpected server error.')) ?>];
|
||
|
}
|
||
|
|
||
|
const message_box = makeMessageBox('bad', messages, title)[0];
|
||
|
|
||
|
this.form.parentNode.insertBefore(message_box, this.form);
|
||
|
})
|
||
|
.finally(() => this.overlay.unsetLoading());
|
||
|
}
|
||
|
|
||
|
/**
|
||
|
* Displays or hides fields in the popup based on the value of selected scope.
|
||
|
*
|
||
|
* @param {object} event The event object.
|
||
|
*/
|
||
|
#loadScopeFields(event) {
|
||
|
if (event.target.value) {
|
||
|
this.scope = parseInt(event.target.value);
|
||
|
}
|
||
|
|
||
|
const url_radio_button = this.form.querySelector(
|
||
|
`#type input[type="radio"][value="${<?= ZBX_SCRIPT_TYPE_URL ?>}"]`
|
||
|
);
|
||
|
|
||
|
switch (this.scope) {
|
||
|
case <?= ZBX_SCRIPT_SCOPE_HOST ?>:
|
||
|
case <?= ZBX_SCRIPT_SCOPE_EVENT ?>:
|
||
|
const show_fields = [
|
||
|
'#menu-path', '#menu-path-label', '#usergroup-label', '#usergroup', '#host-access-label',
|
||
|
'#host-access-field', '#enable-confirmation-label', '#enable-confirmation-field',
|
||
|
'#confirmation-label', '#confirmation-field'
|
||
|
];
|
||
|
|
||
|
show_fields.forEach((field) => {
|
||
|
this.form.querySelector(field).style.display = '';
|
||
|
});
|
||
|
|
||
|
url_radio_button.closest('li').style.display = '';
|
||
|
break;
|
||
|
|
||
|
case <?= ZBX_SCRIPT_SCOPE_ACTION ?>:
|
||
|
const hide_fields = ['#menu-path', '#menu-path-label'];
|
||
|
|
||
|
hide_fields.forEach((field) => {
|
||
|
this.form.querySelector(field).style.display = 'none';
|
||
|
});
|
||
|
|
||
|
url_radio_button.closest('li').style.display = 'none';
|
||
|
|
||
|
if (this.form.querySelector('input[name="type"]:checked').value == <?= ZBX_SCRIPT_TYPE_URL ?>) {
|
||
|
const webhook = this.form.querySelector(`#type [value="${<?= ZBX_SCRIPT_TYPE_WEBHOOK ?>}"]`);
|
||
|
|
||
|
webhook.checked = true;
|
||
|
this.type = parseInt(<?= ZBX_SCRIPT_TYPE_WEBHOOK ?>);
|
||
|
}
|
||
|
break;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
/**
|
||
|
* Displays or hides fields in the popup based on the value of selected type.
|
||
|
*
|
||
|
* @param {object} script The script object.
|
||
|
* @param {object} event The event object.
|
||
|
*/
|
||
|
#loadTypeFields(script, event) {
|
||
|
if (event.target.value) {
|
||
|
this.type = parseInt(event.target.value);
|
||
|
}
|
||
|
|
||
|
let show_fields = [];
|
||
|
const hide_fields = [
|
||
|
'#command-ipmi-label', '#command-ipmi', '#webhook-parameters', '#webhook-parameters-label',
|
||
|
'#js-item-script-field', '#script-label', '#timeout-label', '#timeout-field', '#auth-type-label',
|
||
|
'#auth-type', '#username-label', '#username-field', '#password-label', '#password-field',
|
||
|
'#publickey-label', '#publickey-field', '#privatekey-label', '#privatekey-field', '#passphrase-label',
|
||
|
'#passphrase-field', '#port-label', '#port-field', '#url', '#url-label', '#new-window-label', '#new-window',
|
||
|
'#execute-on-label', '#execute-on', '#commands-label', '#commands'
|
||
|
];
|
||
|
|
||
|
hide_fields.forEach((field) => {
|
||
|
this.form.querySelector(field).style.display = 'none';
|
||
|
})
|
||
|
|
||
|
const command_ipmi = this.form.querySelector('#commandipmi');
|
||
|
const command = this.form.querySelector('#command');
|
||
|
|
||
|
switch (this.type) {
|
||
|
case <?= ZBX_SCRIPT_TYPE_CUSTOM_SCRIPT ?>:
|
||
|
if (command_ipmi.value !== '') {
|
||
|
command.value = command_ipmi.value;
|
||
|
command_ipmi.value = '';
|
||
|
}
|
||
|
|
||
|
show_fields = ['#execute-on-label', '#execute-on', '#commands-label', '#commands'];
|
||
|
break;
|
||
|
|
||
|
case <?= ZBX_SCRIPT_TYPE_IPMI ?>:
|
||
|
if (command.value !== '') {
|
||
|
command_ipmi.value = command.value;
|
||
|
command.value = '';
|
||
|
}
|
||
|
|
||
|
show_fields = ['#command-ipmi-label', '#command-ipmi'];
|
||
|
break;
|
||
|
|
||
|
case <?= ZBX_SCRIPT_TYPE_SSH ?>:
|
||
|
if (command_ipmi.value !== '') {
|
||
|
command.value = command_ipmi.value;
|
||
|
command_ipmi.value = '';
|
||
|
}
|
||
|
|
||
|
show_fields = [
|
||
|
'#auth-type-label', '#auth-type', '#username-label', '#username-field', '#port-label',
|
||
|
'#port-field', '#commands-label', '#commands'
|
||
|
];
|
||
|
|
||
|
// Load authentication fields.
|
||
|
this.authtype = parseInt(script.authtype);
|
||
|
|
||
|
const authtype = this.form.querySelector('#authtype');
|
||
|
|
||
|
authtype.onchange = (e) => this.#loadAuthFields(e);
|
||
|
authtype.dispatchEvent(new Event('change'));
|
||
|
break;
|
||
|
|
||
|
case <?= ZBX_SCRIPT_TYPE_TELNET ?>:
|
||
|
if (command_ipmi.value !== '') {
|
||
|
command.value = command_ipmi.value;
|
||
|
command_ipmi.value = '';
|
||
|
}
|
||
|
|
||
|
show_fields = [
|
||
|
'#username-label', '#username-field', '#port-label', '#port-field', '#password-label',
|
||
|
'#password-field', '#commands-label', '#commands'
|
||
|
];
|
||
|
break;
|
||
|
|
||
|
case <?= ZBX_SCRIPT_TYPE_WEBHOOK ?>:
|
||
|
show_fields = [
|
||
|
'#webhook-parameters', '#webhook-parameters-label', '#js-item-script-field', '#script-label',
|
||
|
'#timeout-label', '#timeout-field'
|
||
|
];
|
||
|
|
||
|
break;
|
||
|
|
||
|
case <?= ZBX_SCRIPT_TYPE_URL ?>:
|
||
|
show_fields = ['#url', '#url-label', '#new-window-label', '#new-window'];
|
||
|
break;
|
||
|
}
|
||
|
|
||
|
show_fields.forEach((field) => this.form.querySelector(field).style.display = '');
|
||
|
}
|
||
|
|
||
|
/**
|
||
|
* Displays or hides fields in the popup based on the value of selected authentication method.
|
||
|
* This is relevant only when the script type is SSH.
|
||
|
*
|
||
|
* @param {object} event The event object.
|
||
|
*/
|
||
|
#loadAuthFields(event) {
|
||
|
this.#hideFormFields('auth');
|
||
|
|
||
|
let show_fields = [];
|
||
|
|
||
|
if (event.target.value) {
|
||
|
this.authtype = parseInt(event.target.value);
|
||
|
}
|
||
|
|
||
|
switch (this.authtype) {
|
||
|
case <?= ITEM_AUTHTYPE_PASSWORD ?>:
|
||
|
show_fields = ['#password-label', '#password-field', '#commands-label', '#commands'];
|
||
|
break;
|
||
|
|
||
|
case <?= ITEM_AUTHTYPE_PUBLICKEY ?>:
|
||
|
show_fields = [
|
||
|
'#publickey-label', '#publickey-field', '#privatekey-label', '#privatekey-field',
|
||
|
'#passphrase-label', '#passphrase-field'
|
||
|
];
|
||
|
break;
|
||
|
}
|
||
|
|
||
|
show_fields.forEach((field) => this.form.querySelector(field).style.display = '');
|
||
|
}
|
||
|
|
||
|
/**
|
||
|
* Displays or hides confirmation fields in the popup based on the value of selected scope.
|
||
|
* This is relevant only when scope value is ZBX_SCRIPT_SCOPE_HOST or ZBX_SCRIPT_SCOPE_ACTION.
|
||
|
*
|
||
|
* @param {object} event The event object.
|
||
|
*/
|
||
|
#loadConfirmationFields(event) {
|
||
|
if (event.target.value) {
|
||
|
this.confirmation = event.target.checked;
|
||
|
}
|
||
|
|
||
|
const confirmation = this.form.querySelector('#confirmation');
|
||
|
const test_confirmation = this.form.querySelector('#test-confirmation');
|
||
|
|
||
|
if (this.confirmation) {
|
||
|
confirmation.removeAttribute('disabled');
|
||
|
|
||
|
confirmation.onkeyup = () => confirmation.value !== ''
|
||
|
? test_confirmation.removeAttribute('disabled')
|
||
|
: test_confirmation.setAttribute('disabled', 'disabled');
|
||
|
|
||
|
confirmation.dispatchEvent(new Event('keyup'));
|
||
|
}
|
||
|
else {
|
||
|
confirmation.setAttribute('disabled', 'disabled');
|
||
|
test_confirmation.setAttribute('disabled', 'disabled');
|
||
|
}
|
||
|
}
|
||
|
|
||
|
/**
|
||
|
* Hides the specified fields from the form based on input parameter type.
|
||
|
*
|
||
|
* @param {string} type A string indicating the type of fields to hide.
|
||
|
*/
|
||
|
#hideFormFields(type) {
|
||
|
let fields = [];
|
||
|
|
||
|
if (type === 'auth') {
|
||
|
fields = [
|
||
|
'#privatekey-label', '#privatekey-field', '#privatekey-label', '#privatekey-field', '#passphrase-label',
|
||
|
'#passphrase-field', '#publickey-label', '#publickey-field', '#password-label', '#password-field'
|
||
|
];
|
||
|
}
|
||
|
|
||
|
if (type === 'all') {
|
||
|
this.form.querySelector(`#type input[type="radio"][value="${<?= ZBX_SCRIPT_TYPE_URL ?>}"]`)
|
||
|
.closest('li').style.display = 'none';
|
||
|
|
||
|
fields = [
|
||
|
'#menu-path', '#menu-path-label', '#url', '#url-label', '#new-window-label', '#new-window',
|
||
|
'#webhook-parameters', '#webhook-parameters-label', '#js-item-script-field', '#script-label',
|
||
|
'#timeout-label', '#timeout-field', '#commands-label', '#commands', '#command-ipmi-label',
|
||
|
'#command-ipmi', '#auth-type-label', '#auth-type', '#username-label', '#username-field',
|
||
|
'#password-label', '#password-field', '#port-label', '#port-field', '#publickey-label',
|
||
|
'#publickey-field', '#privatekey-label', '#privatekey-field', '#passphrase-label', '#passphrase-field',
|
||
|
'#usergroup-label', '#usergroup', '#host-access-label', '#host-access-field',
|
||
|
'#enable-confirmation-label', '#enable-confirmation-field', '#confirmation-label', '#confirmation-field'
|
||
|
];
|
||
|
}
|
||
|
|
||
|
fields.forEach((field) => this.form.querySelector(field).style.display = 'none');
|
||
|
}
|
||
|
}
|