{{# var lang001 = {"ch": "用户方向", "en": "User Direction"}, lang002 = {"ch": "内网用户", "en": "Internal User"}, lang003 = {"ch": "外网用户", "en": "External User"}, lang004 = {"ch": "关键字搜索", "en": "Search"}, lang005 = {"ch": "序号", "en": "No."}, lang006 = {"ch": "连接数", "en": "Sessions"}; }}  <form class="layui-row layui-form layui-form-pane" lay-filter="form_appview_flow_search">     <div class="layui-form-item" style="margin-bottom:5px">         <label class="layui-form-label">{{ lang001[g_lang] || "用户方向" }}</label>         <div class="layui-input-inline" style="width: 100px">             <select name="type" lay-filter="select_appview_flow_search">                 <option value="inner">{{ lang002[g_lang] || "内网用户" }}</option>                 <option value="outer">{{ lang003[g_lang] || "外网用户" }}</option>             </select>         </div>         <div class="layui-input-inline">             <input type="text" name="keyword" class="layui-input" autocomplete="off" placeholder='{{ lang004[g_lang] || "关键字搜索" }}'>         </div>         <div class="layui-form-mid" style="padding:0px!important">             <button class="layui-btn layui-btn-sm layui-btn-normal" lay-submit lay-filter="submit_appview_flow_search">                 <i class="layui-icon layui-icon-search"></i>             </button>         </div>     </div> </form>  <div class="layui-row paui-bg-white" style="padding:10px 10px 0px 10px;"> <table id="tab_appview_flow" lay-filter="tab_appview_flow"></table>     <div class="layui-table-page" id="page_appview_flow"></div> </div>  <script id="tpl_appview_flow" type="text/html"> <span appview_flow_event="tabevt_ip2" class="abtn" obj='{% JSON.stringify(d) %}'>{% d.ip %}</span> </script>   <script> layui.use(function(){     var $ = layui.$,     form = layui.form,     table = layui.table, dropdown = layui.dropdown;      var pa_table = new Paui_table();      var api = '/cgi-bin/proto/ajax_appview';       var reload_table = function(){         var l_timer = setInterval(function(){             if( $("#tab_appview_flow").length > 0){                 table_search();             }         }, 5000);          g_Intervaltimer.push(l_timer);     };       var table_search = function(){         pa_table.reload({             where: form.getValue("form_appview_flow_search")         });     };      var event_center = {         tabevt_ip: function(obj){             popupIPobj(obj.data.ip);         },          tabevt_ip2: function(obj){             var _this = $(this); var _obj = JSON.parse(_this.attr("obj")); if(_obj.ip.indexOf(":") == -1){ $.ajax({ url: g_sys_env.paui_vpath + "/cgi-bin/App/ntm/ajax_tunfind",                     async: false, data: {"action": "ipobj_listip", "ip": _obj.ip}, success: function(json){ var dataobj = []; if(json.data.length == 0){ var opt = {}; opt.ip = _obj.ip; opt.pop_title = "实时会话"; opt.pop_route = "monitor/ipview_session"; popupWindow(opt, 1400, 700); }else{ for(var i = 0; i < g_sys_env.linkArr.length; i++){ for(var j = 0; j < json.data.length; j++){ if(json.data[j].vid == g_sys_env.linkArr[i].id){ dataobj.push({ "title": g_sys_env.linkArr[i].name, "vpaid": g_sys_env.linkArr[i].id }); } } }                             if(dataobj.length != 0){                                 dropdown.render({                                     elem: _this                                     ,show: true                                     ,trigger: 'click'                                     ,data: dataobj                                     ,click: function(data){                                         popupIPobj(_obj.ip, 1, data.vpaid);                                     }                                     ,style: 'box-shadow: 1px 1px 20px rgb(43 110 233 / 20%); border-radius:5px;'                                     ,templet: function(d){                                         return '<div class="dropdownspan" style="width: 180px; color: #333; font-size: 12px; line-height: 24px; display: block; border-bottom: 1px #ddd solid; text-align: left; padding: 6px 8px;">' + d.title + '</div>';                                     }                                 });                             }else{                                 popupIPobj(_obj.ip, 1);                             } }  } }); }else{ popupIPobj(_obj.ip, 1); }         }     };      var col_render = function(r){         switch(this.field){             case "ip":                 if(g_sys_env.ntm == 1){                     return patpl( $("#tpl_appview_flow").html() ).render(r);                 }else{                     return ['<span class="abtn" lay-event="tabevt_ip" autoclose="false"  paui-right-click="btnevt_right_click">',                         r.ip,                     '</span>'                     ].join('');                 }         }     };       /* 页面渲染 */     form.render();      pa_table.render({         elem: '#tab_appview_flow',         url: api,         where: {'action': 'get_app_flow', 'appname': '{{d.appname}}'},         height: 'full-{{d.form != "" ? 320 : 240}}',         pageElem: 'page_appview_flow',         parseData: function(json){             json.count = json.data.total;             json.data = json.data.data;             return json;         },         cols: [[             {type: 'numbers', title: '{{ lang005[g_lang] || "序号" }}', width: 80}             ,{field: 'ip', title: 'IP', templet: col_render}             ,{field: 'flow', title: '{{ lang006[g_lang] || "连接数" }}'}         ]], done: function(json){ right_copy_evt($(".layui-table-body .layui-table-cell")); }     });       /* 事件绑定 */     /*table.on('tool(tab_appview_flow)', function(obj){         popupIPobj(obj.data.ip);     });*/ util.event('appview_flow_event', event_center);      form.on('submit(submit_appview_flow_search)', function(obj){         table_search();         return false;     });      form.on('select(select_appview_flow_search)', function(obj){         table_search();     });      reload_table(); }); </script>