From 5fc253b75a9eb93611bdf6fcc33c41d963a522f3 Mon Sep 17 00:00:00 2001 From: yanghuanglin Date: Fri, 22 Sep 2023 16:46:06 +0800 Subject: [PATCH] serialize config sections to string; add and update with different url --- assets/static/js/index-proxy-list.js | 173 +++++++++++++++-------- assets/templates/index.html | 37 +++-- pkg/server/controller/controller.go | 203 +++++++++++++++++++-------- pkg/server/controller/utils.go | 33 ++++- pkg/server/controller/variables.go | 24 ++-- 5 files changed, 317 insertions(+), 153 deletions(-) diff --git a/assets/static/js/index-proxy-list.js b/assets/static/js/index-proxy-list.js index a92bfe1..6699b59 100644 --- a/assets/static/js/index-proxy-list.js +++ b/assets/static/js/index-proxy-list.js @@ -2,6 +2,15 @@ var loadProxyInfo = (function ($) { var i18n = {}; //param names in Basic tab var basicParamNames = ['name', 'type', 'local_ip', 'local_port', 'custom_domains', 'subdomain', 'remote_port', 'use_encryption', 'use_compression']; + //param need to convert type + var intParamNames = ['local_port', 'health_check_timeout_s', 'health_check_max_failed', 'health_check_interval_s']; + var booleanParamNames = ['use_encryption', 'use_compression']; + var stringArrayParamNames = ['custom_domains', 'locations'] + var mapParamPrefixes = [ + {name: 'metas', prefix: 'meta_'}, + {name: 'plugin_params', prefix: 'plugin_'}, + {name: 'headers', prefix: 'header_'} + ]; /** * get proxy info @@ -46,6 +55,7 @@ var loadProxyInfo = (function ($) { var $section = $('#content > section'); var cols = [ + {type: 'checkbox'}, {field: 'name', title: 'Name', sort: true}, {field: 'type', title: 'Type', sort: true}, {field: 'local_ip', title: 'Local Ip', sort: true}, @@ -92,7 +102,9 @@ var loadProxyInfo = (function ($) { switch (obj.event) { case 'add': - proxyPopup(type, null); + proxyPopup(type, { + type: type + }, false); break case 'remove': // batchRemovePopup(data); @@ -109,7 +121,8 @@ var loadProxyInfo = (function ($) { switch (obj.event) { case 'update': - proxyPopup(type, data); + data.oldName = data.name; + proxyPopup(type, data, true); break; case 'remove': // removePopup(data); @@ -119,11 +132,12 @@ var loadProxyInfo = (function ($) { } /** - * add proxy popup + * addOrUpdate proxy popup * @param type proxy type * @param data {Map} proxy data + * @param update update flag. true - update, false - add */ - function proxyPopup(type, data) { + function proxyPopup(type, data, update) { var basicData = {}; var extraData = []; if (data != null) { @@ -155,8 +169,15 @@ var loadProxyInfo = (function ($) { btn: ['Confirm', 'Cancel'], btn1: function (index) { if (layui.form.validate('#addProxyTemplate')) { - var formData = layui.form.val('addProxyTemplate'); - add(formData, index); + var formData = layui.form.val('addProxyForm'); + var $items = $('#addProxyForm .extra-param-tab-item .extra-param-item'); + $items.each(function () { + var name = $(this).find('input').first().val(); + var value = $(this).find('input').last().val(); + formData[name] = value; + }); + + addOrUpdate(type, formData, index, update); } }, btn2: function (index) { @@ -169,6 +190,43 @@ var loadProxyInfo = (function ($) { }); } + + /** + * repack form data + * @param formData + * @returns {*} + */ + function repackData(formData) { + mapParamPrefixes.forEach(function (temp) { + var name = temp.name; + var prefix = temp.prefix; + for (var key in formData) { + if (key !== name && key.startsWith(prefix)) { + formData[name] = formData[name] || {}; + var newKey = key.replace(prefix, ''); + formData[name][newKey] = formData[key]; + delete formData[key]; + } + } + }); + intParamNames.forEach(function (paramName) { + if (formData.hasOwnProperty(paramName) && formData[paramName] !== '') { + formData[paramName] = parseInt(formData[paramName]); + } + }); + booleanParamNames.forEach(function (paramName) { + if (formData.hasOwnProperty(paramName) && formData[paramName] !== '') { + formData[paramName] = formData[paramName] === 'true'; + } + }); + stringArrayParamNames.forEach(function (paramName) { + if (formData.hasOwnProperty(paramName) && formData[paramName] !== '') { + formData[paramName] = formData[paramName].split(','); + } + }); + return formData; + } + function proxyPopupSuccess(layero, index, that) { layui.form.render(null, 'addProxyForm'); layui.form.on('input-affix(addition)', function (obj) { @@ -181,15 +239,15 @@ var loadProxyInfo = (function ($) { name: name, value: value }); - $paramValue.closest('.layui-tab-item').prepend(formItem); + $paramValue.closest('.layui-tab-item').append(formItem); $paramName.val(''); $paramValue.val(''); layui.form.render(); - var tabContent = $paramValue.closest('.layui-tab-content'); - var scrollHeight = tabContent.prop("scrollHeight"); - tabContent.scrollTop(scrollHeight) + // var tabContent = $paramValue.closest('.layui-tab-content'); + // var scrollHeight = tabContent.prop("scrollHeight"); + // tabContent.scrollTop(scrollHeight) }); layui.form.on('input-affix(subtraction)', function (obj) { var $elem = $(obj.elem); @@ -198,62 +256,32 @@ var loadProxyInfo = (function ($) { } /** - * add proxy action - * @param data {{user:string, token:string, comment:string, enable:boolean, ports:[string|number], domains:[string], subdomains:[string]}} user data + * addOrUpdate proxy action + * @param type proxy type + * @param data proxy data * @param index popup index + * @param update update flag. true - update, false - add */ - function add(data, index) { + function addOrUpdate(type, data, index, update) { var loading = layui.layer.load(); + var url = ''; + if (update) { + url = '/update'; + } else { + url = '/add?type=' + type; + } $.ajax({ - url: '/add', + url: url, type: 'post', contentType: 'application/json', data: JSON.stringify(data), - success: function (result) { - // if (result.success) { - // reloadTable(); - // layui.layer.close(index); - // layui.layer.msg(i18n['OperateSuccess'], function (index) { - // layui.layer.close(index); - // }); - // } else { - // errorMsg(result); - // } - }, - complete: function () { - layui.layer.close(loading); - } - }); - } - - /** - * update proxy action - * @param before {{user:string, token:string, comment:string, enable:boolean, ports:[string|number], domains:[string], subdomains:[string]}} data before update - * @param after {{user:string, token:string, comment:string, enable:boolean, ports:[string|number], domains:[string], subdomains:[string]}} data after update - */ - function update(before, after) { - before.ports.forEach(function (port, index) { - if (/^\d+$/.test(String(port))) { - before.ports[index] = parseInt(String(port)); - } - }); - after.ports.forEach(function (port, index) { - if (/^\d+$/.test(String(port)) && typeof port === "string") { - after.ports[index] = parseInt(String(port)); - } - }); - var loading = layui.layer.load(); - $.ajax({ - url: '/update', - type: 'post', - contentType: 'application/json', - data: JSON.stringify({ - before: before, - after: after, - }), success: function (result) { if (result.success) { - layui.layer.msg(i18n['OperateSuccess']); + reloadTable(); + layui.layer.close(index); + layui.layer.msg('OperateSuccess', function (index) { + layui.layer.close(index); + }); } else { errorMsg(result); } @@ -281,5 +309,36 @@ var loadProxyInfo = (function ($) { }); } + /** + * reload user table + */ + function reloadTable() { + // var searchData = layui.form.val('searchForm'); + var searchData = {}; + layui.table.reloadData('tokenTable', { + where: searchData + }, true) + } + + /** + * show error message popup + * @param result + */ + function errorMsg(result) { + layui.layer.msg(result.message); + // var reason = i18n['OtherError']; + // if (result.code === 1) + // reason = i18n['ParamError']; + // else if (result.code === 2) + // reason = i18n['SaveError']; + // else if (result.code === 3) + // reason = i18n['FrpServerError']; + // else if (result.code === 4) + // reason = i18n['ProxyExist']; + // else if (result.code === 5) + // reason = i18n['ProxyNotExist']; + // layui.layer.msg(i18n['OperateFailed'] + ',' + reason) + } + return loadProxyInfo; })(layui.$); \ No newline at end of file diff --git a/assets/templates/index.html b/assets/templates/index.html index 278fd0e..218249d 100644 --- a/assets/templates/index.html +++ b/assets/templates/index.html @@ -163,8 +163,7 @@
- +
@@ -192,7 +191,7 @@
-
@@ -226,29 +225,29 @@
- {{# layui.each(d.extraData, function(index, extra){ }}
- +
+
=
+
+ +
+
+ {{# layui.each(d.extraData, function(index, extra){ }} +
+
+
=
-
{{# }); }} -
-
- -
-
=
-
- -
-
@@ -256,13 +255,13 @@