diff --git a/frontend/js/app/nginx/proxy/main.ejs b/frontend/js/app/nginx/proxy/main.ejs index a5114de6..42f43752 100644 --- a/frontend/js/app/nginx/proxy/main.ejs +++ b/frontend/js/app/nginx/proxy/main.ejs @@ -3,6 +3,14 @@

<%- i18n('proxy-hosts', 'title') %>

+ <% if (showAddButton) { %> <%- i18n('proxy-hosts', 'add') %> diff --git a/frontend/js/app/nginx/proxy/main.js b/frontend/js/app/nginx/proxy/main.js index 83cedfba..66f2ba6a 100644 --- a/frontend/js/app/nginx/proxy/main.js +++ b/frontend/js/app/nginx/proxy/main.js @@ -14,7 +14,44 @@ module.exports = Mn.View.extend({ list_region: '.list-region', add: '.add-item', help: '.help', - dimmer: '.dimmer' + dimmer: '.dimmer', + search: '.search-form', + query: 'input[name="source-query"]' + }, + + fetch: App.Api.Nginx.ProxyHosts.getAll, + + showData: function(response) { + this.showChildView('list_region', new ListView({ + collection: new ProxyHostModel.Collection(response) + })); + }, + + showError: function(err) { + this.showChildView('list_region', new ErrorView({ + code: err.code, + message: err.message, + retry: function () { + App.Controller.showNginxProxy(); + } + })); + + console.error(err); + }, + + showEmpty: function() { + let manage = App.Cache.User.canManage('proxy_hosts'); + + this.showChildView('list_region', new EmptyView({ + title: App.i18n('proxy-hosts', 'empty'), + subtitle: App.i18n('all-hosts', 'empty-subtitle', {manage: manage}), + link: manage ? App.i18n('proxy-hosts', 'add') : null, + btn_color: 'success', + permission: 'proxy_hosts', + action: function () { + App.Controller.showNginxProxyForm(); + } + })); }, regions: { @@ -30,6 +67,17 @@ module.exports = Mn.View.extend({ 'click @ui.help': function (e) { e.preventDefault(); App.Controller.showHelp(App.i18n('proxy-hosts', 'help-title'), App.i18n('proxy-hosts', 'help-content')); + }, + + 'submit @ui.search': function (e) { + e.preventDefault(); + let query = this.ui.query.val(); + + this.fetch(['owner', 'certificate'], query) + .then(response => this.showData(response)) + .catch(err => { + this.showError(err); + }); } }, @@ -40,39 +88,18 @@ module.exports = Mn.View.extend({ onRender: function () { let view = this; - App.Api.Nginx.ProxyHosts.getAll(['owner', 'access_list', 'certificate']) + view.fetch(['owner', 'access_list', 'certificate']) .then(response => { if (!view.isDestroyed()) { if (response && response.length) { - view.showChildView('list_region', new ListView({ - collection: new ProxyHostModel.Collection(response) - })); + view.showData(response); } else { - let manage = App.Cache.User.canManage('proxy_hosts'); - - view.showChildView('list_region', new EmptyView({ - title: App.i18n('proxy-hosts', 'empty'), - subtitle: App.i18n('all-hosts', 'empty-subtitle', {manage: manage}), - link: manage ? App.i18n('proxy-hosts', 'add') : null, - btn_color: 'success', - permission: 'proxy_hosts', - action: function () { - App.Controller.showNginxProxyForm(); - } - })); + view.showEmpty(); } } }) .catch(err => { - view.showChildView('list_region', new ErrorView({ - code: err.code, - message: err.message, - retry: function () { - App.Controller.showNginxProxy(); - } - })); - - console.error(err); + view.showError(err); }) .then(() => { view.ui.dimmer.removeClass('active');