{{# 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": "Search"},    lang008 = {"ch": "参数配置", "en": "Configuration"},    lang009 = {"ch": "删除设备", "en": "Delete Device"},    lang010 = {"ch": "添加设备", "en": "Add Device"},    lang011 = {"ch": "开启|关闭", "en": "On | Off"},    lang012 = {"ch": "编辑", "en": "Edit"},    lang013 = {"ch": "删除", "en": "Delete"},    lang014 = {"ch": "请选择需要操作的设备", "en": "Please select the device to operate"},    lang015 = {"ch": "确定要删除选中设备", "en": "Confirm deletion of selected devices"},    lang016 = {"ch": "设备", "en": "Device"},    lang017 = {"ch": "确定要删除吗", "en": "Are you sure you want to delete?"},    lang018 = {"ch": "在线", "en": "Online"},    lang019 = {"ch": "离线", "en": "Offline"},    lang020 = {"ch": "序号", "en": "No."},    lang021 = {"ch": "设备名称", "en": "Device Name"},    lang022 = {"ch": "优先级", "en": "Priority"},    lang023 = {"ch": "外网网卡", "en": "External NIC"},    lang024 = {"ch": "内网网卡", "en": "Internal NIC"},    lang025 = {"ch": "在线状态", "en": "Online Status"},    lang026 = {"ch": "Bypass状态", "en": "Bypass Status"},    lang027 = {"ch": "策略条数", "en": "Number of Rules"},    lang028 = {"ch": "速率", "en": "Rate (bps)"},    lang029 = {"ch": "匹配策略前/策略后", "en": "Before/After Policy Match"},    lang030 = {"ch": "操作", "en": "Action"}; }}  <style> .paui-schdev-name-box{height: 40px; line-height: 40px;} .paui-schdev-name-icon {color: auto} .paui-schdev-name-icon i{font-size: 30px; margin-top: -5px;} .paui-schdev-name-text {line-height: 40px; margin-top: -10px;} </style>  <form class="layui-form layui-form-pane paui-table-form" lay-filter="form_schdev_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_schdev_refresh" id="select_schdev_refresh">                 <option value="">{{ lang002[g_lang] || "不刷新" }}</option>                 <option value=5>{{ lang003[g_lang] || "5秒" }}</option>                 <option value=10>{{ lang004[g_lang] || "10秒" }}</option>                 <option value=20 selected>{{ lang005[g_lang] || "20秒" }}</option>                 <option value=60>{{ lang006[g_lang] || "60秒" }}</option>             </select>         </div>         <div class="layui-input-inline">             <input class="layui-input" name="keyword" type="text" autocomplete="off"             placeholder='{{ lang007[g_lang] || "关键字搜索" }}' lay-affix="clear" lay-filter="clear_schdev_search">         </div>         <div class="layui-input-inline" style="width:40px">             <button class="layui-btn layui-btn-normal layui-btn-sm" lay-submit lay-filter="submit_schdev_search" id="submit_schdev_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" schdev_event="btnevt_config">                 <i class="layui-icon layui-icon-set"></i>{{ lang008[g_lang] || "参数配置" }}             </span>             <span class="abtn" schdev_event="btnevt_delete">                 <i class="layui-icon layui-icon-delete"></i>{{ lang009[g_lang] || "删除设备" }}             </span>             <span class="abtn" schdev_event="btnevt_add">                 <i class="layui-icon layui-icon-add-1"></i>{{ lang010[g_lang] || "添加设备" }}             </span>         </div>     </div> </form>  <div class="paui-table-card">     <table id="tab_schdev_list" lay-filter="tab_schdev_list"></table> </div>  <script id="tpl_schdev_name" type="text/html">     <div class="paui-schdev-name-box" lay-event="tabevt_edit">         <div class="layui-inline paui-schdev-name-icon nbtn">             <i class='{% d.icon %}'></i>         </div>         <div class="layui-inline paui-schdev-name-text abtn">             {% d.name %}         </div>     </div> </script>  <script id="tpl_schdev_bypass_switch" type="text/html">     <div class="layui-row">         <input             type="checkbox"             name="enable"             lay-skin="switch"             lay-filter="switch_schdev_enable"             obj-name="{% d.name %}"             lay-text='{{ lang011[g_lang] || "开启|关闭" }}' {% d.enable == 0 ? 'checked' : '' %}         >     </div> </script>  <script id="tpl_schdev_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='{{ lang013[g_lang] || "删除" }}'> <i class="layui-icon layui-icon-delete"></i> </span> </script>  <script> layui.use(function(){     var $ = layui.$,     util = layui.util,     form = layui.form,     table = layui.table,     patpl = layui.patpl;      var pa_table = new Paui_table();     var pa_timer = new Paui_timer();      var api = '/cgi-bin/flowcontrol/ajax_flowsch';       var event_center = {         btnevt_config: function(){             paopen({                 title: '{{ lang008[g_lang] || "参数配置" }}',                 area: ['400px', '200px'],                 skin: "layer-paui-skin layer-paui-overflow",                 url: '/html/flowschedu/netpipe_config.html',                 btn: 'default',                 subElem: '#submit_netpipe_config',                 end: table_search             });         },          btnevt_delete: function(){ var data = []; var chk = table.checkStatus('tab_schdev_list'); if(chk.data.length == 0){ layer.msg('{{ lang014[g_lang] || "请选择需要操作的设备" }}'); return; } layui.each(chk.data, function(index, elem){ data.push(elem.name); }); pa_confirm('{{ lang015[g_lang] || "确定要删除选中设备"}}?', function(index){ pa_ajax({ url: api, data: {"action": "schdev_btnrmv", "names": data.join(' ')}, success: function(json){ if(json.code != 0) { alert_err(json.msg); } else { alert_ok(json.msg); table_search(); } } }); });         },          btnevt_add: function(){             paopen({                 title: '{{ lang010[g_lang] || "添加设备" }}',                 area: ['800px', '600px'],                 skin: "layer-paui-skin layer-paui-overflow",                 url: '/html/flowschedu/device_add.html',                 btn: 'default',                 subElem: '#submit_schdev_add'             });         },          tabevt_show_exif: function(obj){             popupInterface(obj.data.extport);         },          tabevt_show_inif: function(obj){             popupInterface(obj.data.if);         },          tabevt_acl: function(obj){             obj.data.first = 1;             paopen({                 title: '{{ lang016[g_lang] || "设备" }}->' + obj.data.name,                 area: ['1300px', '666px'],                 url: '/html/flowschedu/device_edit.html',                 data: obj.data,                 end: table_search             });         },          switch_schdev_enable: function(obj){             var name = obj.elem.getAttribute("obj-name");             var enable = obj.elem.checked ? 0 : 1;                          pa_ajax({                 url: api,                 data: {'action': 'schdev_bypass', name: name, enable: enable},                 success: function(json){                     table_search();                     if(json.code != 0)                         alert_err(json.msg);                     else                         alert_ok(json.msg);                 }             });         },          tabevt_edit: function(obj){             if(obj.data.prio == 1 || obj.data.prio == 65535){                 event_center.btnevt_config();                 return;             }             obj.data.first = 0;             paopen({                 title: '{{ lang016[g_lang] || "设备" }}->' + obj.data.name,                 area: ['1300px', '666px'],                 url: '/html/flowschedu/device_edit.html',                 data: obj.data,                 end: table_search             });         },          tabevt_rmv: function(obj){             pa_confirm('{{ lang017[g_lang] || "确定要删除吗" }}?', function(index){                 layer.close(index);                 pa_ajax({                     url: api,                     data: {'action': 'schdev_rmv', 'name': obj.data.name},                     success: function(json){                         if(json.code != 0)                             alert_err(json.msg);                         else {                             alert_ok(json.msg);                             table_search();                         }                     }                 });             });         }     };       var col_render = function(r){         switch(this.field){             case "name":                 return patpl($("#tpl_schdev_name").html()).render(r);              case "prio":                 if(r.prio == 1 || r.prio == 65535)                     return '-';                 return r.prio;              case "online":                 if (r.online == 1)                     return `<span class="paui-color-good" id="${r.name}_" style="color:#249aff;cursor:pointer;">{{ lang018[g_lang] || "在线" }}</span>`;                 else                     return `<span class="paui-color-danger" id="${r.name}_" style="color:#249aff;cursor:pointer;">{{ lang019[g_lang] || "离线" }}</span>`;              case "extport":                 if(r.prio == 65535) return '-';                 if(r.extport == 'N/A') return 'N/A';                 var html = [];                 layui.each(r.extport.split(","), function(index, elem){                     html.push('<span class="abtn" lay-event="tabevt_show_inif" if="'+ elem +'">' + elem + '</span>');                 });                 return html.join(',');              case "intport":                 if(r.prio == 1) return '-';                 if(r.intport == 'N/A') return 'N/A';                 var html = [];                 layui.each(r.intport.split(","), function(index, elem){                     html.push('<span class="abtn" lay-event="tabevt_show_inif" if="'+ elem +'">' + elem + '</span>');                 });                 return html.join(',');              case "enable":                 if(r.prio == 1 || r.prio == 65535)                     return '-';                 return patpl($("#tpl_schdev_bypass_switch").html()).render(r);              case "rulecnt":                 if(r.prio == 1 || r.prio == 65535)                     return '-';                 return '<div class="abtn" lay-event="tabevt_acl">' + (r.rulecnt || 0) + '</div>';              case "bps":                 var color = r.pktbps != r.pktbps2 ? "paui-color-danger" : "";                 var bps1  = numberformat(r.pktbps || 0);                 var bps2  = numberformat(r.pktbps2 || 0);                 return '<span class="' + color + '">' + bps1  + "/" + bps2 + '</span>';              case "action":                 if(r.prio == 1 || r.prio == 65535)                     return '-';                 return $("#tpl_schdev_action").html();         }     };       var table_search = function(){         pa_table.reload();     };       /* 页面渲染 */     form.render();      pa_table.render({         elem: '#tab_schdev_list',         height: 'full-145',         url: api,         where: {'action': 'load_canvas_data'},         parseData: function(json){             var data = [];             var group = {};             var search = form.getValue("form_schdev_search");              layui.each(json.data.group, function(index, elem){                 group[elem.name] = elem;             });             var _sysext = group['_sysext'] || {};             var _sysint = group['_sysint'] || {};             var _sysext_offline_reason="",_sysint_offline_reason="";             if(_sysext.offline_reason){                 if(_sysext.offline_reason.indexOf("bypass")!==-1) _sysext_offline_reason+='bypass，';                 if(_sysext.offline_reason.indexOf("link")!==-1) _sysext_offline_reason+='link down，';                 if(_sysext.offline_reason.indexOf("loss")!==-1) _sysext_offline_reason+='丢包率超过阈值，';                 if(_sysext.offline_reason.indexOf("icmp")!==-1) _sysext_offline_reason+='PING检测失败，';                 if(_sysext.offline_reason.indexOf("dns")!==-1) _sysext_offline_reason+='DNS检测失败，';                 if(_sysext.offline_reason.indexOf("N/A")!==-1) _sysext_offline_reason+='暂无，';                  _sysext_offline_reason=_sysext_offline_reason.replace(/，+$/g, '');             }             if(_sysint.offline_reason){                 if(_sysint.offline_reason.indexOf("bypass")!==-1) _sysint_offline_reason+='bypass，';                 if(_sysint.offline_reason.indexOf("link")!==-1) _sysint_offline_reason+='link down，';                 if(_sysint.offline_reason.indexOf("loss")!==-1) _sysint_offline_reason+='丢包率超过阈值，';                 if(_sysint.offline_reason.indexOf("icmp")!==-1) _sysint_offline_reason+='PING检测失败，';                 if(_sysint.offline_reason.indexOf("dns")!==-1) _sysint_offline_reason+='DNS检测失败，';                 if(_sysint.offline_reason.indexOf("N/A")!==-1) _sysint_offline_reason+='暂无，';                 _sysint_offline_reason=_sysint_offline_reason.replace(/，+$/g, '');                    }              data.push({                 name: '外网',                 prio: 1,                 extport: json.data.netpipe.extport,                 icon: 'pa-icon pa-internet-cloud',                 pktbps: _sysext.pktbps || 0,                 pktbps2: _sysext.pktbps2 || 0,                 rulecnt: _sysext.rulecnt || 0,                 online: _sysext.active || 0,                 offline_time:_sysext.offline_time==='N/A' ? '未离线过' : _sysext.offline_time,                 offline_reason:_sysext_offline_reason,                 enable:json.data.netpipe.enable              });              layui.each(json.data.node, function(index, elem){                 if(!pa_str_find(elem.name, search.keyword))                     return;                  elem.icon ="pa-icon " + (elem.icon || "pa-server");                  if( group[elem.name] ) {                     elem.pktbps = group[elem.name].pktbps;                     elem.pktbps2 = group[elem.name].pktbps2;                     elem.rulecnt = group[elem.name].rulecnt;                     elem.online = group[elem.name].active;                     elem.offline_time = group[elem.name].offline_time ==='N/A' ? '未离线过' : group[elem.name].offline_time;                     var group_offline_reason="";                     if(group[elem.name].offline_reason){                         if(group[elem.name].offline_reason.indexOf("bypass")!==-1) group_offline_reason+='bypass，';                         if(group[elem.name].offline_reason.indexOf("link")!==-1) group_offline_reason+='link down，';                         if(group[elem.name].offline_reason.indexOf("loss")!==-1) group_offline_reason+='丢包率超过阈值，';                         if(group[elem.name].offline_reason.indexOf("icmp")!==-1) group_offline_reason+='PING检测失败，';                         if(group[elem.name].offline_reason.indexOf("dns")!==-1) group_offline_reason+='DNS检测失败，';                         if(group[elem.name].offline_reason.indexOf("N/A")!==-1) group_offline_reason+='暂无，';                          group_offline_reason = group_offline_reason.replace(/，+$/g, '');                         elem.offline_reason = group_offline_reason;                          }                     /* elem.enable=json.data.netpipe.enable; */                 }                  data.push(elem);             });              data.push({                 name: '内网',                 prio: 65535,                 icon: 'pa-icon pa-neiwang',                 intport: json.data.netpipe.intport,                 pktbps: _sysint.pktbps || 0,                 pktbps2: _sysint.pktbps2 || 0,                 rulecnt: _sysint.rulecnt || 0,                 online: _sysint.active || 0,                 offline_time:_sysint.offline_time==='N/A' ? '未离线过' : _sysint.offline_time,                 offline_reason:_sysint_offline_reason,                 enable:json.data.netpipe.enable             });              json.data = data;             return json;         },         colHeight: 'auto',         cols: [[             {type: 'checkbox'}             ,{type: 'numbers', title: '{{ lang020[g_lang] || "序号" }}'}             ,{field: 'name', title: '{{ lang021[g_lang] || "设备名称" }}', templet: col_render}             ,{field: 'prio', title: '{{ lang022[g_lang] || "优先级" }}', templet: col_render}             ,{field: 'extport', title: '{{ lang023[g_lang] || "外网网卡" }}', templet: col_render}             ,{field: 'intport', title: '{{ lang024[g_lang] || "内网网卡" }}', templet: col_render}             ,{field: 'online', title: '{{ lang025[g_lang] || "在线状态" }}', templet: col_render}             ,{field: 'enable', title: '{{ lang026[g_lang] || "Bypass状态" }}', templet: col_render}             ,{field: 'rulecnt', title: '{{ lang027[g_lang] || "策略条数" }}', templet: col_render}             ,{                 field: 'bps',                 filter_title: '{{ lang028[g_lang] || "速率" }}',                 title: paui_tabcol_tips('{{ lang028[g_lang] || "速率" }}', '{{ lang029[g_lang] || "匹配策略前/策略后" }}'),                 minWidth: 100,                 templet: col_render             }             ,{field: 'action', title: '{{ lang030[g_lang] || "操作" }}', width: 120, align: 'right', templet: col_render}         ]],         done:function(res){             layui.each(res.data,function(index,elem){                  if(g_sys_env.tap == 1 && elem.enable == 1){                  $(`#${elem.name}_`).hover(function () {   var tips = `最近离线：${elem.offline_time}<br>离线原因：${elem.offline_reason}`; layer.tips(tips, this, { tips: [2, 'black'], time: 20000 }); }, function () { layer.closeAll('tips'); });                       }             });         }     });       /* 事件绑定 */     util.event('schdev_event', event_center);     table.on('tool(tab_schdev_list)', function(obj){         if($(this).attr("if"))             obj.data.if = $(this).attr("if");         event_center[obj.event](obj);     });      form.on('switch(switch_schdev_enable)', function(obj){         event_center['switch_schdev_enable'](obj);     });          form.on('input-affix(clear_schdev_search)', table_search);     form.on('submit(submit_schdev_search)', function(obj){         table_search();         return false;     });       /* 定时刷新 */     pa_timer.render('select_schdev_refresh', table_search, 20);  }); </script>