i11th/ruantiblock_openwrt
1
0
Fork 0
mirror of https://github.com/gSpotx2f/ruantiblock_openwrt.git synced 2026-05-13 22:20:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

luci-app: updated log.

Browse Source
This commit is contained in:
gSpot
2023-11-21 18:16:55 +03:00
parent f71d228b8b
commit 6cfbf6b8ec
5 changed files with 252 additions and 161 deletions
Download Patch File Download Diff File Expand all files Collapse all files
luci-app-ruantiblock/Makefile
+1 -1
View File
@@ -4,7 +4,7 @@
include $(TOPDIR)/rules.mk
PKG_VERSION:=1.3-2
PKG_VERSION:=1.3-3
LUCI_TITLE:=LuCI support for ruantiblock
LUCI_DEPENDS:=+ruantiblock
LUCI_PKGARCH:=all
luci-app-ruantiblock/htdocs/luci-static/resources/view/ruantiblock/log-base.js
+226 -159
View File
@@ -132,17 +132,18 @@ log-emerg td {
}
.log-facility-dropdown-item {
}
.log-scroll-block {
.log-side-block {
position: fixed;
z-index: 1 !important;
opacity: 0.7;
}
.log-scroll-btn {
.log-side-btn {
position: relative;
display: block;
margin: 0 !important;
left: 1px;
top: 1px;
margin: 0 !important;
min-width: 3.2em;
}
`));
@@ -198,6 +199,10 @@ return baseclass.extend({
tailValue : 25,
fastTailIncrement : 50,
fastTailValue : null,
logSortingValue : 'asc',
isHosts : false,
@@ -369,7 +374,7 @@ return baseclass.extend({
},
setDateFilter(entriesArray) {
let fPattern = document.getElementById('timeFilter').value;
let fPattern = this.timeFilter.value;
if(!fPattern) {
return entriesArray;
};
@@ -414,7 +419,7 @@ return baseclass.extend({
},
setMsgFilter(entriesArray) {
let fPattern = document.getElementById('msgFilter').value;
let fPattern = this.msgFilter.value;
if(!fPattern) {
return entriesArray;
};
@@ -434,7 +439,7 @@ return baseclass.extend({
},
downloadLog(ev) {
let formElems = Array.from(document.forms.logForm.elements);
let formElems = Array.from(this.logForm.elements);
formElems.forEach(e => e.disabled = true);
return this.getLogData(0).then(logdata => {
@@ -454,8 +459,7 @@ return baseclass.extend({
});
},
load() {
// Restoring settings from localStorage
restoreSettings() {
let tailValueLocal = localStorage.getItem(`luci-app-${this.viewName}-tailValue`);
if(tailValueLocal) {
this.tailValue = Number(tailValueLocal);
@@ -464,16 +468,142 @@ return baseclass.extend({
if(logSortingLocal) {
this.logSortingValue = logSortingLocal;
};
},
saveSettings(tailValue, logSortingValue) {
if(this.tailValue != tailValue) {
this.tailValue = (/^[0-9]+$/.test(tailValue)) ? tailValue : 0;
localStorage.setItem(
`luci-app-${this.viewName}-tailValue`, String(this.tailValue));
};
if(this.logSortingValue != logSortingValue) {
this.logSortingValue = logSortingValue;
localStorage.setItem(
`luci-app-${this.viewName}-logSorting`, this.logSortingValue);
};
},
onSubmitForm(tail) {
let formElems = Array.from(this.logForm.elements);
formElems.forEach(e => e.disabled = true);
this.logDownloadBtn.disabled = true;
tail = (tail && tail > 0) ? tail : 0;
this.logSortingValue = this.logSorting.value;
return this.getLogData(tail).then(logdata => {
logdata = logdata || '';
this.logWrapper.innerHTML = '';
this.logWrapper.append(
this.makeLogArea(
this.setMsgFilter(
this.setFacilityFilter(
this.setLevelFilter(
this.setHostFilter(
this.setDateFilter(
this.parseLogData(logdata, tail)
)
)
)
)
)
)
);
if(logdata && logdata !== '') {
if(this.isFacilities && !this.logFacilitiesDropdown) {
this.logFacilitiesDropdownElem = this.makeLogFacilitiesDropdownSection();
};
if(this.isLevels && !this.logLevelsDropdown) {
this.logLevelsDropdownElem = this.makeLogLevelsDropdownSection();
};
if(this.isHosts && !this.logHostsDropdown) {
this.logHostsDropdownElem = this.makeLogHostsDropdownSection();
};
};
}).finally(() => {
formElems.forEach(e => e.disabled = false);
this.logDownloadBtn.disabled = false;
this.fastTailValue = this.totalLogLines;
ui.hideModal();
});
},
filterSettingsModal() {
return ui.showModal(_('Filter settings'), [
E('div', { 'class': 'cbi-map' }, [
E('div', { 'class': 'cbi-section' }, [
E('div', { 'class': 'cbi-section-node' }, [
E('div', { 'class': 'cbi-value' }, [
E('label', {
'class': 'cbi-value-title',
'for' : 'tailInput',
}, _('Last entries')),
E('div', { 'class': 'cbi-value-field' },
this.tailInput
),
]),
E('div', { 'class': 'cbi-value' }, [
E('label', {
'class': 'cbi-value-title',
'for' : 'timeFilter',
}, _('Timestamp filter')),
E('div', { 'class': 'cbi-value-field' }, this.timeFilter),
]),
this.logHostsDropdownElem,
this.logFacilitiesDropdownElem,
this.logLevelsDropdownElem,
E('div', { 'class': 'cbi-value' }, [
E('label', {
'class': 'cbi-value-title',
'for' : 'msgFilter',
}, _('Message filter')),
E('div', { 'class': 'cbi-value-field' }, this.msgFilter),
]),
E('div', { 'class': 'cbi-value' }, [
E('label', {
'class': 'cbi-value-title',
'for' : 'logSorting',
}, _('Sorting entries')),
E('div', { 'class': 'cbi-value-field' }, this.logSorting),
]),
]),
]),
]),
E('div', { 'class': 'right' }, [
this.logForm,
E('input', {
'type' : 'submit',
'form' : 'logForm',
'class': 'btn cbi-button-positive important',
'value': _('Apply'),
}),
' ',
E('button', {
'class': 'btn',
'click': ui.hideModal,
}, _('Close')),
]),
], 'cbi-modal');
},
load() {
// Restoring settings from localStorage
this.restoreSettings();
return this.getLogData(this.tailValue);
},
render(logdata) {
let logWrapper = E('div', {
this.logWrapper = E('div', {
'id' : 'logWrapper',
'style': 'width:100%; min-height:20em'
}, this.makeLogArea(this.parseLogData(logdata, this.tailValue)));
let tailInput = E('input', {
this.fastTailValue = this.totalLogLines;
this.tailInput = E('input', {
'id' : 'tailInput',
'name' : 'tailInput',
'type' : 'text',
@@ -482,36 +612,23 @@ return baseclass.extend({
'style' : 'width:4em !important; min-width:4em !important',
'maxlength': 5,
});
tailInput.value = (this.tailValue === 0) ? null : this.tailValue;
ui.addValidator(tailInput, 'uinteger', true);
this.tailInput.value = (this.tailValue === 0) ? null : this.tailValue;
ui.addValidator(this.tailInput, 'uinteger', true);
let tailReset = E('input', {
'type' : 'button',
'form' : 'logForm',
'class': 'cbi-button btn',
'value': '×',
'click': ev => {
tailInput.value = null;
logFormSubmitBtn.click();
ev.target.blur();
},
'style': 'max-width:4em !important',
});
let logHostsDropdownElem = '';
let logFacilitiesDropdownElem = '';
let logLevelsDropdownElem = '';
this.logHostsDropdownElem = '';
this.logFacilitiesDropdownElem = '';
this.logLevelsDropdownElem = '';
if(this.isLevels) {
logLevelsDropdownElem = this.makeLogLevelsDropdownSection();
this.logLevelsDropdownElem = this.makeLogLevelsDropdownSection();
};
if(this.isFacilities) {
logFacilitiesDropdownElem = this.makeLogFacilitiesDropdownSection();
this.logFacilitiesDropdownElem = this.makeLogFacilitiesDropdownSection();
};
if(this.isHosts) {
logHostsDropdownElem = this.makeLogHostsDropdownSection();
this.logHostsDropdownElem = this.makeLogHostsDropdownSection();
};
let timeFilter = E('input', {
this.timeFilter = E('input', {
'id' : 'timeFilter',
'name' : 'timeFilter',
'type' : 'text',
@@ -520,7 +637,7 @@ return baseclass.extend({
'placeholder': _('Type an expression...'),
});
let msgFilter = E('input', {
this.msgFilter = E('input', {
'id' : 'msgFilter',
'name' : 'msgFilter',
'type' : 'text',
@@ -529,16 +646,7 @@ return baseclass.extend({
'placeholder': _('Type an expression...'),
});
let logFormSubmitBtn = E('input', {
'type' : 'submit',
'form' : 'logForm',
'class': 'cbi-button btn cbi-button-action',
'value': _('Apply'),
'click': ev => ev.target.blur(),
'style': 'margin-right: 1em',
});
let logSorting = E('select', {
this.logSorting = E('select', {
'id' : 'logSorting',
'name' : 'logSorting',
'form' : 'logForm',
@@ -547,87 +655,87 @@ return baseclass.extend({
E('option', { 'value': 'asc' }, _('ascending')),
E('option', { 'value': 'desc' }, _('descending')),
]);
logSorting.value = this.logSortingValue;
this.logSorting.value = this.logSortingValue;
let logDownloadBtn = E('button', {
this.logDownloadBtn = E('button', {
'id' : 'logDownloadBtn',
'name' : 'logDownloadBtn',
'class': 'cbi-button btn',
'click': ui.createHandlerFn(this, this.downloadLog),
}, _('Download log'));
let onSubmitForm = () => {
let formElems = Array.from(document.forms.logForm.elements);
formElems.forEach(e => e.disabled = true);
logDownloadBtn.disabled = true;
// Saving settings to localStorage
if(this.tailValue != tailInput.value) {
this.tailValue = (/^[0-9]+$/.test(tailInput.value)) ? tailInput.value : 0;
localStorage.setItem(
`luci-app-${this.viewName}-tailValue`, String(this.tailValue));
};
if(this.logSortingValue != logSorting.value) {
this.logSortingValue = logSorting.value;
localStorage.setItem(
`luci-app-${this.viewName}-logSorting`, this.logSortingValue);
};
let tail = (tailInput.value && tailInput.value > 0) ? tailInput.value : 0
return this.getLogData(tail).then(logdata => {
logdata = logdata || '';
logWrapper.innerHTML = '';
logWrapper.append(
this.makeLogArea(
this.setMsgFilter(
this.setFacilityFilter(
this.setLevelFilter(
this.setHostFilter(
this.setDateFilter(
this.parseLogData(logdata, tail)
)
)
)
)
)
)
);
if(logdata) {
let timeFilterSection = document.getElementById('timeFilterSection');
if(this.isFacilities && !this.logFacilitiesDropdown) {
timeFilterSection.after(this.makeLogFacilitiesDropdownSection());
};
if(this.isLevels && !this.logLevelsDropdown) {
timeFilterSection.after(this.makeLogLevelsDropdownSection());
};
if(this.isHosts && !this.logHostsDropdown) {
timeFilterSection.after(this.makeLogHostsDropdownSection());
};
};
}).finally(() => {
formElems.forEach(e => e.disabled = false);
logDownloadBtn.disabled = false;
});
};
this.logForm = E('form', {
'id' : 'logForm',
'name' : 'logForm',
'style' : 'display:inline-block; margin-top:0.5em',
'submit': ui.createHandlerFn(this, function(ev) {
ev.preventDefault();
// Saving settings to localStorage
this.saveSettings(this.tailInput.value, this.logSorting.value);
return this.onSubmitForm(Number(this.tailInput.value));
}),
}, E('span', {}, ' '));
document.body.append(
E('div', {
'class': 'log-scroll-block',
'style': 'right:1px; top:' + (window.innerHeight / 4 * 3) + 'px',
'align': 'right',
'class': 'log-side-block',
'style': `right:1px; top:${window.innerHeight / 2 - 60}px`,
}, [
E('button', {
'class': 'btn log-scroll-btn',
'title': _('Refresh log'),
'class': 'btn log-side-btn',
'click': ui.createHandlerFn(this, function(ev) {
ev.target.blur();
return this.onSubmitForm(
Math.max(Number(this.tailValue), this.fastTailValue));
}),
}, '🗘'),
E('button', {
'title': _('Get more entries'),
'class': 'btn log-side-btn',
'style': 'margin-top:1px !important',
'click': ui.createHandlerFn(this, function(ev) {
ev.target.blur();
if(this.fastTailValue === null) {
this.fastTailValue = Number(this.tailValue);
};
this.fastTailValue += this.fastTailIncrement;
return this.onSubmitForm(this.fastTailValue);
}),
}, `+${this.fastTailIncrement}`),
E('button', {
'title': _('Get all entries'),
'class': 'btn log-side-btn',
'style': 'margin-top:1px !important',
'click': ui.createHandlerFn(this, function(ev) {
ev.target.blur();
return this.onSubmitForm(0);
}),
}, '𝍤'),
E('button', {
'title': _('Filter settings'),
'class': 'btn log-side-btn',
'style': 'margin-top:10px !important',
'click': ev => {
ev.target.blur();
this.filterSettingsModal();
},
}, '🗔'),
E('button', {
'class': 'btn log-side-btn',
'style': 'margin-top:10px !important',
'click': ev => {
document.getElementById('logTitle').scrollIntoView(true);
ev.target.blur();
},
}, '↑'),
E('button', {
'class': 'btn log-scroll-btn',
'class': 'btn log-side-btn',
'style': 'margin-top:1px !important',
'click': ev => {
logWrapper.scrollIntoView(false);
this.logWrapper.scrollIntoView(false);
ev.target.blur();
},
}, '↓'),
@@ -639,79 +747,38 @@ return baseclass.extend({
E('div', { 'class': 'cbi-section-descr fade-in' }),
E('div', { 'class': 'cbi-section fade-in' },
E('div', { 'class': 'cbi-section-node' }, [
E('div', { 'class': 'cbi-value' }, [
E('label', {
'class': 'cbi-value-title',
'for' : 'tailInput',
}, _('Last entries')),
'for' : 'filterSettings',
}, _('Filter settings')),
E('div', { 'class': 'cbi-value-field' }, [
tailInput,
tailReset,
]),
]),
E('div', { 'id': 'timeFilterSection', 'class': 'cbi-value' }, [
E('label', {
'class': 'cbi-value-title',
'for' : 'timeFilter',
}, _('Timestamp filter')),
E('div', { 'class': 'cbi-value-field' }, timeFilter),
]),
logHostsDropdownElem,
logFacilitiesDropdownElem,
logLevelsDropdownElem,
E('div', { 'class': 'cbi-value' }, [
E('label', {
'class': 'cbi-value-title',
'for' : 'msgFilter',
}, _('Message filter')),
E('div', { 'class': 'cbi-value-field' }, msgFilter),
]),
E('div', { 'class': 'cbi-value' }, [
E('label', {
'class': 'cbi-value-title',
'for' : 'logSorting',
}, _('Sorting entries')),
E('div', { 'class': 'cbi-value-field' }, logSorting,),
]),
E('div', { 'class': 'cbi-value' }, [
E('label', {
'class': 'cbi-value-title',
'for' : 'logFormSubmitBtn',
}, _('Refresh log')),
E('div', { 'class': 'cbi-value-field' }, [
logFormSubmitBtn,
E('div', {},
E('button', {
'class': 'cbi-button btn cbi-button-action',
'click': L.bind(this.filterSettingsModal, this),
}, _('Edit'))
),
E('input', {
'id' : 'logFormSubmitBtn',
'id' : 'filterSettings',
'type': 'hidden',
}),
E('form', {
'id' : 'logForm',
'name' : 'logForm',
'style' : 'display:inline-block; margin-top:0.5em',
'submit': ui.createHandlerFn(this, function(ev) {
ev.preventDefault();
return onSubmitForm();
}),
}, E('span', {}, ' ')),
]),
]),
])
),
E('div', { 'class': 'cbi-section fade-in' },
E('div', { 'class': 'cbi-section-node' },
logWrapper
this.logWrapper
)
),
E('div', { 'class': 'cbi-section fade-in' },
E('div', { 'class': 'cbi-section-node' },
E('div', { 'class': 'cbi-value' },
E('div', { 'style': 'width:100%; text-align:right !important' }, logDownloadBtn)
E('div', {
'align': 'left',
'style': 'width:100%',
}, this.logDownloadBtn)
),
)
),
luci-app-ruantiblock/po/ru/ruantiblock.po
+12
View File
@@ -70,6 +70,9 @@ msgstr "Изменения сохранены."
msgid "Clean up nftsets before updating blacklist"
msgstr "Очищать nft-сеты перед обновлением блэклиста"
msgid "Close"
msgstr "Закрыть"
msgid "Command failed"
msgstr "Команда не выполнена"
@@ -170,6 +173,15 @@ msgstr "Категории"
msgid "Failed to get %s init status: %s"
msgstr "Не удалось получить статус инициализации %s: %s"
msgid "Filter settings"
msgstr "Настройки фильтра"
msgid "Get all entries"
msgstr "Все записи"
msgid "Get more entries"
msgstr "Больше записей"
msgid "HTML/XML error"
msgstr "Ошибка HTML/XML"
luci-app-ruantiblock/po/templates/ruantiblock.pot
+12
View File
@@ -55,6 +55,9 @@ msgstr ""
msgid "Clean up nftsets before updating blacklist"
msgstr ""
msgid "Close"
msgstr ""
msgid "Command failed"
msgstr ""
@@ -154,6 +157,15 @@ msgstr ""
msgid "Failed to get %s init status: %s"
msgstr ""
msgid "Filter settings"
msgstr ""
msgid "Get all entries"
msgstr ""
msgid "Get more entries"
msgstr ""
msgid "HTML/XML error"
msgstr ""