{{# var lang001 = {"ch": "合计", "en": "Total"}, lang002 = {"ch": "驱动", "en": "Driver"}, lang003 = {"ch": "增强型", "en": "Enhanced"}, lang004 = {"ch": "型号", "en": "Model"}, lang005 = {"ch": "编辑", "en": "Edit"}, lang006 = {"ch": "查看", "en": "View"}, lang007 = {"ch": "数据加载中", "en": "Loading Data"}, lang008 = {"ch": "名称", "en": "Name"}, lang009 = {"ch": "状态", "en": "Status"}, lang010 = {"ch": "工作模式", "en": "Working Mode"}, lang011 = {"ch": "接入模式", "en": "Access Mode"}, lang012 = {"ch": "方向", "en": "Direction"}, lang013 = {"ch": "对端接口", "en": "Peer Interface"}, lang014 = {"ch": "链路捆绑", "en": "Link Aggregation"}, lang015 = {"ch": "流入速率", "en": "In(bps)"}, lang016 = {"ch": "流出速率", "en": "Out(bps)"}, lang017 = {"ch": "流入PPS", "en": "In(PPS)"}, lang018 = {"ch": "流出PPS", "en": "Out(PPS)"}, lang019 = {"ch": "硬件信息", "en": "Hardware Information"}, lang020 = {"ch": "备注", "en": "Notes"}, lang021 = {"ch": "操作", "en": "Action"}, lang022 = {"ch": "网卡高级设置", "en": "NIC Advanced Settings"}, lang023 = {"ch": "动态限速", "en": "Dynamic Rate Limit"}, lang024 = {"ch": "链路组状态", "en": "Link Group Status"}, lang025 = {"ch": "编辑", "en": "Edit"}, lang026 = {"ch": "监控模式", "en": "Monitoring Mode (Gateway/TAP)"}, lang027 = {"ch": "接内", "en": "Internal"}, lang028 = {"ch": "接外", "en": "External"}, lang029 = {"ch": "静态组", "en": "Static Group"}, lang030 = {"ch": "LACP组", "en": "LACP Group"}; }}  <style> .paui-switch-interface-table .layui-table-header{display: none;} .paui-switch-interface-table *, .paui-switch-interface-table .layui-table[lay-even] tbody tr:nth-child(even) {background-color: rgba(0,0,0,0)!important;}  .paui-switch-interface-td{padding: 0px; border-top: 1px solid #ccc!important; border-left: 1px solid #ccc!important;} .paui-app-theme-dark .paui-switch-interface-td{border-color: #55677d!important;} </style>  <div class="layui-row paui-table-card">     <table id="tab_int_list" lay-filter="tab_int_list"></table> </div> <div class="layui-hide">     <span id="paui-reload-interface" interface_event="btnevt_reload"></span> </div>  <script id="tpl_interface_list_name" type="text/html">     {%# if (d.name == "summary") { %}         <div style="height: 40px; line-height: 40px;">             {{ lang001[g_lang] || "合计" }}         </div>     {%# } else { %}         <span class="abtn" lay-event="tabevt_status">{% d.name %}</span>     {%# } %} </script>  <script id="tpl_interface_devino" type="text/html">     <div class="layui-row">         <div class="layui-inline paui-color-disable paui-interface-info-title">{{ lang002[g_lang] || "驱动" }}</div>         {%# if(d.driver == "PANAOS") { %}             <div class="layui-inline">{{ lang003[g_lang] || "增强型" }}</div>         {%# } else { %}             <div class="layui-inline">{% d.driver %}</div>         {%# } %}     </div>     <div class="layui-row">         <div class="layui-inline paui-color-disable paui-interface-info-title">{{ lang004[g_lang] || "型号" }}</div>         <div class="layui-inline">{% d.type %}</div>     </div>     <div class="layui-row">         <div class="layui-inline paui-color-disable paui-interface-info-title">MAC</div>         <div class="layui-inline">{% d.mac %}</div>     </div> </script>  <script id="tpl_if_action" type="text/html">     <span class="abtn" lay-event="tabevt_edit" title="{{ lang005[g_lang] || '编辑' }}">         <i class="layui-icon layui-icon-edit"></i>     </span>     <span class="abtn" lay-event="tabevt_status" title="{{ lang006[g_lang] || '查看' }}">         <i class="layui-icon layui-icon-chart"></i>     </span> </script>  <script> layui.use(function(){ var $ = layui.$, util = layui.util, form = layui.form, table = layui.table,     patpl = layui.patpl, element = layui.element;      var api = '/cgi-bin/network/ajax_interface';     var pa_table = new Paui_table();          var l_init = 0;     var l_timer = "";     var l_lg_info = [];       var event_center = {         btnevt_append: function(){             popupWindow({                 pop_title: '{{ lang022[g_lang] || "网卡高级设置" }}',                 pop_route: 'system/sys_setting_netif',             }, 1200, 600);         },          btnevt_reload: function(){             pa_table.reload();         },          tabevt_status: function(obj){             popupInterface(obj.data.name);         },          tabevt_bridge: function(obj){             popupWindow({                 id: obj.data.mode,                 name: obj.data.bgname,                 pop_title: '{{ lang023[g_lang] || "动态限速" }}',                 pop_route: 'flowcontrol/policy_link_set'             }, 1040, 700);         },          btnevt_lacp: function(obj){             var lacp = l_lg_info[Number(obj.data.ifgrp) - 1];             lacp.id = obj.data.ifgrp;             lacp.if = obj.data.name;             lacp.pop_title = '{{ lang024[g_lang] || "链路组状态" }}',             lacp.pop_route = "monitor/interface_lacp";             popupWindow(lacp, 600, 200);         },          tabevt_edit: function(obj){             paopen({                 title: '{{ lang025[g_lang] || "编辑" }}->' + obj.data.name,                 url: '/html/monitor/interface_set.html',                 data: obj.data,                 area: ['550px', '550px'],                 btn: 'default',                 subElem: '#submit_set_interface'             });         }     };       var col_render = function(r){         switch(this.field){             case "name":                 return patpl($("#tpl_interface_list_name").html()).render(r);                          case "state":                 if(r.name == "summary") return ""; if(r.state == "up") var ret = '<i class="layui-icon layui-icon-ok-circle"></i>'; else var ret = '<i class="layui-icon layui-icon-close-fill"></i>';                 return '<span id="paui-interface-status-state-'+ r.name +'">' + ret + '</span>';              case "speed":                 var ret = (r.speed == "NONE" || r.state != "up") ? "-" : r.speed;                 return '<span id="paui-interface-status-speed-'+ r.name +'">' + ret + '</span>';              case "mode":                 if(r.name == "summary") return "";                 if(r.mode == 0) return '{{ lang026[g_lang] || "监控模式" }}';                 var name = (g_lang == "ch" ? r.bgname : r.bgname.replace("网桥", "Bridge"));                 return "<span class='abtn' lay-event='tabevt_bridge'>" + name + '</span>';              case "zone":                 if(r.name == "summary") return "";                 return r.zone == "inside" ? '{{ lang027[g_lang] || "接内" }}': '{{ lang028[g_lang] || "接外" }}';              case "peer":                 if(r.name == "summary") return "";                 return r.peer == "NULL" ? "-" : r.peer;              case "ifgrp":                 if(r.name == "summary") return "";                 if(r.ifgrp == 0) return "-";                  var lacp = l_lg_info[Number(r.ifgrp) - 1];                 if(lacp.lg_enable == "0")                     return '{{ lang029[g_lang] || "静态组" }}' + r.ifgrp;                 else                     return '<span class="abtn" lay-event="btnevt_lacp">{{ lang030[g_lang] || "LACP组" }}'+  + r.ifgrp +'</span>';              case "swgrp":                 if(r.name == "summary") return "";                 if(r.swgrp == 0) return "-";                 return 'swgrp' + r.swgrp;              case "devinfo":                 if(r.name == "summary") return "";                 return patpl($("#tpl_interface_devino").html()).render(r);              case "note":                 return r.name == "summary" ? "" : (r.note || "");              case "inbps":                 return '<span id="paui-interface-status-inbps-'+ r.name +'">' + r.inbps + '</span>';              case "outbps":                 return '<span id="paui-interface-status-outbps-'+ r.name +'">' + r.outbps + '</span>';              case "inpps":                 return '<span id="paui-interface-status-inpps-'+ r.name +'">' + r.inpps + '</span>';              case "outpps":                 return '<span id="paui-interface-status-outpps-'+ r.name +'">' + r.outpps + '</span>';              case "action":                 if(r.name == "summary") return "";                 return patpl($("#tpl_if_action").html()).render(r);         }     };       var table_search = function(){         pa_ajax({             url: api,             data: {'action': 'load_if_list', 'reload': 1},             success: function(json){                 layui.each(json.data.list, function(index, elem){                     if(elem.state == "up")                         var state = '<i class="layui-icon layui-icon-ok-circle"></i>';                     else                         var state = '<i class="layui-icon layui-icon-close-fill"></i>';                      var speed = elem.speed == "NONE" || elem.state != "up" ? "-" : elem.speed;                      elem.name = elem.name.replace('/', '\\/');                     $("#paui-interface-status-state-" + elem.name).html(state);                     $("#paui-interface-status-speed-" + elem.name).html(speed);                     $("#paui-interface-status-inbps-" + elem.name).html(elem.inbps);                     $("#paui-interface-status-outbps-" + elem.name).html(elem.outbps);                     $("#paui-interface-status-inpps-" + elem.name).html(elem.inpps);                     $("#paui-interface-status-outpps-" + elem.name).html(elem.outpps);                 });             }         });     };       /* 页面渲染 */     pa_table.render({         elem: '#tab_int_list'         ,height: 'full-110'         ,even: true         ,url: api         ,where: {'action': 'load_if_list'}         ,parseData: function(json){             var data = [];             l_lg_info = json.data.iflacp;             layui.each(json.data.list, function(index, elem){                 if(pa_str_find(elem.name, "swgrp"))                     return;                  if(json.data.note[elem.name])                     elem.note = json.data.note[elem.name];                  data.push(elem);             });             json.data = data;             return json;         }         ,className: 'paui-policy-table'         ,cols: [[             {field: 'name', title: '{{ lang008[g_lang] || "名称" }}', width: 60, templet: col_render}             ,{field: 'state', title: '{{ lang009[g_lang] || "状态" }}', width:40, templet: col_render}             ,{field: 'speed', title: '{{ lang010[g_lang] || "工作模式" }}', width: 80, templet: col_render}             ,{field: 'mode', title: '{{ lang011[g_lang] || "接入模式" }}', templet: col_render}             ,{field: 'zone', title: '{{ lang012[g_lang] || "方向" }}', width: 60, templet: col_render}             ,{field: 'peer', title: '{{ lang013[g_lang] || "对端接口" }}', templet: col_render}             ,{field: 'ifgrp', title: '{{ lang014[g_lang] || "链路捆绑" }}', templet: col_render}             ,{field: 'swgrp', title: 'SWGRP', templet: col_render}             ,{field: 'inbps', title: '{{ lang015[g_lang] || "流入速率" }}', minWidth: 120, templet: col_render}             ,{field: 'outbps', title: '{{ lang016[g_lang] || "流出速率" }}', minWidth: 120, templet: col_render}             ,{field: 'inpps', title: '{{ lang017[g_lang] || "流入PPS" }}', minWidth: 120, templet: col_render}             ,{field: 'outpps', title: '{{ lang018[g_lang] || "流出PPS" }}', minWidth: 120, templet: col_render}             ,{field: 'devinfo', title: '{{ lang019[g_lang] || "硬件信息" }}', minWidth: 160, templet: col_render}             ,{field: 'note', title: '{{ lang020[g_lang] || "备注" }}', style: "overflow:unset; word-wrap:break-word; word-break:break-all; ", align: 'right', templet: col_render}             ,{field: 'action', title: '{{ lang021[g_lang] || "操作" }}', width: 60, align: 'right', templet: col_render}         ]]     });       /* 事件绑定 */     util.event('interface_event', event_center);      table.on('tool(tab_int_list)', function(obj){         event_center[obj.event](obj, this);     });      /* 定时刷新 */ l_timer = setInterval(table_search, 5000);  g_Intervaltimer.push(l_timer);  }); </script>