{{# var lang001 = {"ch":"自动刷新", "en": "Refresh"}, lang002 = {"ch": "不刷新", "en": "No Refresh"}, lang003 = {"ch": "5秒", "en": "5s"}, lang004 = {"ch": "10秒", "en": "10s"}, lang005 = {"ch": "20秒", "en": "20s"}, lang006 = {"ch": "60秒", "en": "60s"}, lang007 = {"ch": "服务器组", "en": "Server Group"}, lang008 = {"ch": "所有组", "en": "All Groups"}, lang009 = {"ch": "关键字搜索", "en": "Search"}, lang010 = {"ch": "删除", "en": "Delete"}, lang011 = {"ch": "添加", "en": "Add"}, lang012 = {"ch": "编辑", "en": "Edit"}, lang013 = {"ch": "复制", "en": "Copy"}, lang014 = {"ch": "趋势", "en": "Trend"}, lang015 = {"ch": "请选择需要操作的服务器", "en": "Please select the server(s) to operate on first"}, lang016 = {"ch": "确定要删除选中的服务器吗", "en": "Confirm to delete the selected server(s)?"}, lang017 = {"ch": "添加服务器", "en": "Add Server"}, lang018 = {"ch": "编辑服务器", "en": "Edit Server"}, lang019 = {"ch": "确定要删除吗", "en": "Confirm deletion?"}, lang020 = {"ch": "复制服务器", "en": "Copy Server"}, lang021 = {"ch": "序号", "en": "No."}, lang022 = {"ch": "名称", "en": "Name"}, lang023 = {"ch": "服务器组", "en": "Server Group"}, lang024 = {"ch": "权重", "en": "Weight"}, lang025 = {"ch": "服务器IP", "en": "Server IP"}, lang026 = {"ch": "端口", "en": "Port"}, lang027 = {"ch": "下一跳", "en": "Next-Hop"}, lang028 = {"ch": "相邻接口", "en": "Next-Hop Interface"}, lang029 = {"ch": "连接数", "en": "Connections"}, lang030 = {"ch": "流入bps", "en": "Bps (In)"}, lang031 = {"ch": "流出bps", "en": "Bps (Out)"}, lang032 = {"ch": "已处理请求", "en": "Processed Requests"}, lang033 = {"ch": "操作", "en": "Action"}, lang034 = {"ch": "不检测", "en": "Do Not Check"}, lang035 = {"ch": "健康检测", "en": "Health Check"}, lang036 = {"ch": "重试次数", "en": "Retry Attempts"}, lang037 = { "ch": "格式：剩余次数/重试次数<br>若剩余次数小于等于0，则判断服务器异常", "en": "Format: Remaining Attempts / Total Attempts<br>If Remaining Attempts is less than or equal to 0, the server is considered abnormal" }, lang038 = {"ch": "健康状态", "en": "Health Status"}, lang039 = {"ch": "所有", "en": "All"}, lang040 = {"ch": "异常", "en": "Abnormal"}, lang041 = {"ch": "正常", "en": "Normal"}, lang042 = {"ch": "服务器", "en": "Server"}; }}  <div class="layui-tab layui-tab-brief"> <ul class="layui-tab-title"> <li class="layui-this">{{ lang042[g_lang] || "服务器" }}</li> </ul> <div class="layui-tab-content"> <div class="layui-tab-item layui-show"> <form class="layui-row layui-form layui-form-pane paui-table-form" lay-filter="form_server_search"> <div class="layui-form-item paui-table-form-left"> <label class="layui-form-label">{{ lang001[g_lang] || "自动刷新" }}</label> <div class="layui-input-inline" style="width:80px"> <select name="refresh" lay-filter="select_portmap_refresh" id="select_server_refresh"> <option value="">{{ lang002[g_lang] || "不刷新" }}</option> <option value=5>{{ lang003[g_lang] || "5秒" }}</option> <option value=10 selected>{{ lang004[g_lang] || "10秒" }}</option> <option value=20>{{ lang005[g_lang] || "20秒" }}</option> <option value=60>{{ lang006[g_lang] || "60秒" }}</option> </select> </div> <label class="layui-form-label" style="width: 100px;">{{ lang007[g_lang] || "服务器组" }}</label> <div class="layui-input-inline" style="width: 100px"> <select name="group" id="select_svr_group" lay-filter="select_svr_group"> <option value="">{{ lang008[g_lang] || "所有组" }}</option> </select> </div> <label class="layui-form-label" style="width: 100px;">{{ lang038[g_lang] || "健康状态" }}</label> <div class="layui-input-inline" style="width: 100px"> <select name="hcttl" lay-filter="select_svr_group"> <option value="">{{ lang039[g_lang] || "所有" }}</option> <option value="0">{{ lang040[g_lang] || "异常" }}</option> <option value="1">{{ lang041[g_lang] || "正常" }}</option> </select> </div> <div class="layui-input-inline"> <input type="text" name="keyword" placeholder='{{ lang009[g_lang] || "关键字搜索" }}' autocomplete="off" class="layui-input" lay-affix="clear" lay-filter="clear_server_search"> </div> <div class="layui-form-mid" style="padding:0px!important"> <button class="layui-btn layui-btn-sm layui-btn-normal" lay-submit id="submit_server_search" lay-filter="submit_server_search"> <i class="layui-icon layui-icon-search"></i> </button> </div> </div> <div class="layui-form-item paui-table-form-right"> <div class="layui-form-mid"> <span class="abtn" server_event="btnevt_remove"> <i class="layui-icon layui-icon-delete"></i>&nbsp;{{ lang010[g_lang] || "删除" }} </span> <span class="abtn" server_event="btnevt_add"> <i class="layui-icon layui-icon-add-1"></i>{{ lang011[g_lang] || "添加" }} </span> <span class="abtn paui-server-table-filter"> <i class="pa-icon pa-filter"></i> </span> </div> </div> </form> <div class="layui-row paui-table-card"> <table id="tab_map_server" lay-filter="tab_map_server"></table> <div class="layui-table-page" id="page_map_server"></div> </div> </div> </div> </div>  <script id="tpl_server_action" type="text/html"> <span class="abtn" lay-event="tabevt_edit" title='{{ lang012[g_lang] || "编辑" }}'> <i class="layui-icon layui-icon-edit"></i> </span> <span class="abtn" lay-event="tabevt_rmv" title='{{ lang010[g_lang] || "删除" }}'> <i class="layui-icon layui-icon-delete"></i> </span> <span class="abtn" lay-event="tabevt_copy" title='{{ lang013[g_lang] || "复制" }}'> <i class="layui-icon layui-icon-templeate-1"></i> </span> <span class="abtn" lay-event="tabevt_chart" title='{{ lang014[g_lang] || "趋势" }}'> <i class="layui-icon layui-icon-chart"></i> </span> </script>  <script> layui.use(function(){ var $ = layui.$, util = layui.util, form = layui.form, patpl = layui.patpl, table = layui.table;  var pa_table = new Paui_table(); var pa_timer = new Paui_timer();  var api = '/cgi-bin/network/ajax_server'; var hctype_desc = { 'null': '{{ lang034[g_lang] || "不检测" }}', 'icmp': 'ICMP', 'tcpsyn': 'TCP' };  var event_center = { btnevt_remove: function(){ var data = ""; var chk = table.checkStatus('tab_map_server'); if(chk.data.length == 0){ layer.msg('{{ lang015[g_lang] || "请选择需要操作的服务器" }}'); return; } layui.each(chk.data, function(index, elem){ data = data + ";" + elem.id; }); pa_confirm('{{ lang016[g_lang] || "确定要删除选中的服务器吗" }}？', function(index){ pa_ajax({ url: api, data: {"action": "btnremove_server", "items": data}, success: function(json){ if(json.code != 0) { alert_err(json.msg); } else { alert_ok(json.msg); table_search(); } } }); }); },  btnevt_add: function(){ paopen({ title: '{{ lang017[g_lang] || "添加服务器" }}', area: ['500px', '500px'], url: '/html/route/server_add.html', data: {'action': 'add_server'}, btn: 'default', subElem: '#submit_add_server', }); },  tabevt_edit: function(obj){ obj.data.action = 'edit_server'; paopen({ title: '{{ lang018[g_lang] || "编辑服务器" }}', area: ['500px', '500px'], url: '/html/route/server_add.html', data: obj.data, btn: 'default', subElem: '#submit_add_server', }); },  tabevt_ip: function(obj){ popupIPobj(obj.data.ip); },  tabevt_rmv: function(obj){ pa_confirm('{{ lang019[g_lang] || "确定要删除吗" }}?', function(index){ layer.close(index); pa_ajax({ url: api, data: {'action': 'rmv_server', 'id': obj.data.id}, success: function(json){ if(json.code != 0) alert_err(json.msg); else { table_search(); alert_ok(json.msg); } } }); }); },  tabevt_copy: function(obj){ obj.data.action = 'add_server'; paopen({ title: '{{ lang020[g_lang] || "复制服务器" }}', area: ['500px', '480px'], url: '/html/route/server_add.html', data: obj.data, btn: 'default', subElem: '#submit_add_server', }); },  tabevt_chart: function(obj){ popupWindow({ name: obj.data.name, tag: 'svr_' + obj.data.id, pop_title: '{{ lang014[g_lang] || "趋势" }}->' + obj.data.name, pop_route: 'route/server_chart' }, 620, 700); } };   var col_render = function(r){ switch(this.field){ case "name": return '<span class="abtn" lay-event="tabevt_edit">' + r.name + '</span>';  case "ip": return '<span class="abtn" lay-event="tabevt_ip">' + r.ip + '</span>';  case "group": return r.group == "NULL" ? "-" : r.group;  case "rtif": return r.rtif == "NULL" ? "-" : r.rtif;  case "bpsin": return numberformat(r.bpsin);  case "bpsout": return numberformat(r.bpsout);  case "hctype": return hctype_desc[r.hctype] || r.hctype;  case "hcttl": if(r.curttl <= 0){ return [ '<span class="paui-color-danger">', r.curttl, " / ", r.hcttl, '</span>' ].join(''); } else { return r.curttl + "/" + r.hcttl; } } };   var table_search = function(){ var search = form.getValue("form_server_search"); pa_table.reload({ where: search }); };   /* 基本渲染 */     form.render();  pa_ajax({ url: api, data: {"action": "list_svrgroup"}, success: function(json){ layui.each(json.data, function(index, elem){ var opt = '<option value="' + elem.id + '">'+ elem.name +'</option>'; $("#select_svr_group").append(opt); }); form.render(); } });   pa_table.render({ elem: '#tab_map_server', url: api, height: 'full-190', page: true, pageElem: 'page_map_server', pageType: 'web', where: {"action": "list_server"}, dbkey: "tab_servers_col", filterElem: '.paui-server-table-filter', parseData: function(json){ var data = []; var search = form.getValue("form_server_search"); layui.each(json.data, function(index, elem){ if(search.hcttl != ""){ if(search.hcttl == 0 && elem.curttl > 0) return; if(search.hcttl == 1 && elem.curttl != elem.hcttl) return; }; if(!pa_str_find(JSON.stringify(elem), search.keyword)) return; data.push(elem); }); json.data = data; return json; }, cols: [[ {type: 'checkbox'} ,{field: 'id', title: '{{ lang021[g_lang] || "序号" }}', width: 40} ,{field: 'name', title: '{{ lang022[g_lang] || "名称" }}', templet: col_render} ,{field: 'group', title: '{{ lang023[g_lang] || "服务器组" }}', templet: col_render} ,{field: 'weight', title: '{{ lang024[g_lang] || "权重" }}'} ,{field: 'ip', title: '{{ lang025[g_lang] || "服务器IP" }}', minWidth: 120, templet: col_render} ,{field: 'port', title: '{{ lang026[g_lang] || "端口" }}'} ,{field: 'nexthop', title: '{{ lang027[g_lang] || "下一跳" }}'} ,{field: 'mac', title: 'MAC', minWidth: 140} ,{field: 'rtif', title: '{{ lang028[g_lang] || "相邻接口" }}', templet: col_render} ,{field: 'hctype', title: '{{ lang035[g_lang] || "健康检测" }}', templet: col_render} ,{ field: 'hcttl', minWidth: 80, templet: col_render, filter_title: '{{ lang036[g_lang] || "重试次数" }}', title: paui_tabcol_tips('{{ lang036[g_lang] || "重试次数" }}', '{{ lang037[g_lang] || "格式：当前TTL/设置TTL<br>若当前TTL为0，则判断服务器异常" }}') } ,{field: 'flowcnt', title: '{{ lang029[g_lang] || "连接数" }}'} ,{field: 'bpsin', title: '{{ lang030[g_lang] || "流入bps" }}', templet: col_render} ,{field: 'bpsout', title: '{{ lang031[g_lang] || "流出bps" }}', templet: col_render} ,{field: 'hits', title: '{{ lang032[g_lang] || "已处理请求" }}'} ,{field: 'act', title: '{{ lang033[g_lang] || "操作" }}', minWidth: 100, align: 'right', templet: '#tpl_server_action'} ]], done: function(json){ var obj = $("#tab_map_server").next(); layui.each(json.data, function(index, elem){ if(elem.mac == "00-00-00-00-00-00" && elem.rtif == "NULL") obj.find('tr[data-index="' + index + '"]').addClass("layui-word-aux"); }); } });   /* 事件绑定 */ util.event("server_event", event_center); table.on('tool(tab_map_server)', function(obj){ event_center[obj.event](obj); });  table.on('checkbox(tab_map_server)', function(obj){ $("#select_server_refresh").val(""); form.render(); pa_timer.stop(); });  form.on('input-affix(clear_server_search)', table_search); form.on('select(select_svr_group)', table_search); form.on('submit(submit_server_search)', function(obj){ table_search(); return false; });  pa_timer.render('select_server_refresh', table_search, 10); }) </script>