{{# var lang001 = {"ch": "模板管理", "en": "Template Management"}, lang002 = {"ch": "关键字搜索", "en": "Search"}, lang003 = {"ch": "添加模板", "en": "Add Template"}, lang004 = {"ch": "AP组", "en": "AP Group"}, lang005 = {"ch": "说明", "en": "Note"}, lang006 = {"ch": "以下三种情况，会触发模板下发配置", "en": "Config download is triggered in the following 3 cases"}, lang007 = {"ch": "当新设备上线时", "en": "When a new AP goes online"}, lang008 = {"ch": "当设备更换组时", "en": "When an AP changes group"}, lang009 = {"ch": "当修改模板配置时", "en": "When the template is modified"}, lang010 = {"ch": "添加模板", "en": "Add Template"}, lang011 = {"ch": "AP组管理", "en": "AP Group Management"}, lang012 = {"ch": "说明", "en": "Note"}, lang013 = {"ch": "了解", "en": "Got It"}, lang014 = {"ch": "编辑模板", "en": "Edit Template"}, lang015 = {"ch": "关联组", "en": "Bind Group"}, lang016 = {"ch": "模板当前关联了AP组，无法删除", "en": "Cannot delete: Template is currently bound to an AP Group"}, lang017 = {"ch": "确定要删除模板", "en": "Confirm Delete Template?"}, lang018 = {"ch": "当前未关联任何组", "en": "Not Bound to Any Group"}, lang019 = {"ch": "模板名称", "en": "Template Name"}, lang020 = {"ch": "最后编辑时间", "en": "Last Edit Time"}, lang021 = {"ch": "关联组", "en": "Bound Groups"}, lang022 = {"ch": "操作", "en": "Action"}; }}  <div class="layui-tab layui-tab-brief">     <ul class="layui-tab-title">         <li class="layui-this">{{ lang001[g_lang] || "模板管理" }}</li>     </ul>     <div class="layui-tab-content"> <div class="layui-tab-item layui-show" style="padding-bottom: 10px;"> <form class="layui-form layui-form-pane paui-table-form" lay-filter="form_tmpl_search"> <div class="layui-form-item paui-table-form-left"> <div class="layui-input-inline"> <input type="text" name="keyword" class="layui-input" autocomplete="off"                         placeholder='{{ lang002[g_lang] || "关键字搜索" }}' lay-affix="clear" lay-filter="clear_tmpl_search"> </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_tmpl_search" id="submit_tmpl_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 paui-sac-btn">                         <span class="abtn" sac_tmpl_event="btnevt_tmpl_add">                             <i class="layui-icon layui-icon-add-1"></i>&nbsp;{{ lang003[g_lang] || "添加模板" }}                         </span>                         <span class="abtn" sac_tmpl_event="btnevt_group_mgd">                             <i class="layui-icon layui-icon-set-fill"></i>&nbsp;{{ lang004[g_lang] || "AP组" }}                         </span>                         <span class="abtn" sac_tmpl_event="btnevt_tmpl_desc">                             <i class="layui-icon layui-icon-about"></i>&nbsp;{{ lang005[g_lang] || "说明" }}                         </span>                     </div>                 </div> </form>             <div class="paui-table-card">                 <table id="tab_sac_tmpl_list" lay-filter="tab_sac_tmpl_list"></table>             </div>         </div>     </div> </div>  <script id="tpl_sac_tmpldesc" type="text/html"> <div class="layui-card-body" style="margin: 20px"> <div class="layui-row">{{ lang006[g_lang] || "以下三种情况，会触发模板下发配置" }}：</div> <div class="layui-row" style="margin-top:10px">1. {{ lang007[g_lang] || "当新设备上线时" }}</div> <div class="layui-row" style="margin-top:10px">2. {{ lang008[g_lang] || "当设备更换组时" }}</div> <div class="layui-row" style="margin-top:10px">3. {{ lang009[g_lang] || "当修改模板配置时" }}</div> </div> </script>  <script id="tpl_tmpl_bind_group" type="text/html">     {%# layui.each(d.grp, function(index, elem){ %}         <div class="paui-label paui-color-normal">{% elem.grpname %}</div>     {%# }); %} </script>  <script id="tpl_td_action" type="text/html"> <span class="abtn" lay-event="tabevt_edit">         <i class="layui-icon layui-icon-edit"></i>     </span>     &nbsp; <span class="abtn" lay-event="tabevt_bind">         <i class="layui-icon layui-icon-transfer"></i>     </span>     &nbsp; <span class="abtn" lay-event="tabevt_del">         <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 api = '/cgi-bin/sac/ajax_sac_tmpl';       var event_center = {         btnevt_tmpl_add: function(){ paopen({ title: '{{ lang010[g_lang] || "添加模板" }}' ,url: '/html/sac/tmpl_add.html' ,data: {"action": "add"} ,area: ['1200px', '720px'] ,btn: 'default'                 ,subElem: "#submit_addtmpl" });         },          btnevt_group_mgd: function(){             popupWindow({                 pop_title: '{{ lang011[g_lang] || "AP组管理" }}',                 pop_route: 'sac/ap_group_list'             }, 1000, 500);         },          btnevt_tmpl_desc: function(){ paopen({ title: '{{ lang012[g_lang] || "说明" }}' ,area: ['360px', '280px'] ,content: $("#tpl_sac_tmpldesc").html() ,btn: ['{{ lang013[g_lang] || "了解" }}'] });         },          tabevt_edit: function(obj){ obj.data.action = "edit_sac_tmpl"; paopen({ title: '{{ lang014[g_lang] || "编辑模板" }}->' + obj.data.tmplname ,url: '/html/sac/tmpl_add.html' ,data: obj.data ,area: ['1200px', '720px'] ,btn: 'default'                 ,subElem: "#submit_addtmpl" });         },          tabevt_bind: function(obj){ paopen({ title: '{{ lang015[g_lang] || "关联组" }}' ,area: ['400px', '480px'] ,url: '/html/sac/tmpl_bind.html' ,data: obj.data ,btn: "default"                 ,subElem: '#btn_group_link' });         },          tabevt_del: function(obj){             if(obj.data.grp.length != 0){                 alert_tips('{{ lang016[g_lang] || "模板当前关联了AP组，无法删除" }}');                 return false;             }; pa_confirm('{{ lang017[g_lang] || "确定要删除模板" }}：<b class="paui-color-danger">'+ obj.data.tmplname +'</b>', function(index){ layer.close(index);                 obj.data.action = "del_sac_tmpl";                 delete obj.data.tmplcmd; pa_ajax({                     url: api,                      data: obj.data,                     success: function(json){                         if(json.code != 0) {                             alert_err(json.msg);                         } else {                             table_search();                             alert_ok(json.msg);                         }                     } }); });         }     };       var col_render = function (r) { switch(this.field) { case "birth": return util.toDateString(r.birth * 1000);  case "group": if(r.grp.length == 0) return '<span class="paui-color-disable">{{ lang018[g_lang] || "当前未关联任何组" }}</span>';                 return patpl($("#tpl_tmpl_bind_group").html()).render(r); } };           var table_search = function(){         var search = form.getValue("form_tmpl_search");         pa_table.reload({             where: search         });     };   pa_table.render({ elem: '#tab_sac_tmpl_list' ,height: 'full-145' ,url: api ,method: 'post' ,where: {"action": "load_tmpl_list"}         ,parseData: function(json){             var data = [];             layui.each(json.data.tmpl, function(index, elem){                 var grp = json.data.dict["tmpl_"+elem.tmplid].split(",");                 elem.grp = [];                 for(var i = 0; i < grp.length; i++){                     if(grp[i] == "") continue;                     var grpname = "";                     layui.each(json.data.group, function(_, e){                         if(grp[i] == e.grpid)                             grpname = e.grpname;                     });                     elem.grp.push({                         'grpid': grp[i],                         'grpname': grpname                     });                 }                 data.push(elem);             });             json.data = data;             return json;         }         ,colHeight: 'auto' ,cols: [[ {field:'tmplid', title:'ID', width: 60} ,{field: 'tmplname', title: '{{ lang019[g_lang] || "模板名称" }}', width: 120} ,{field: 'birth', title: '{{ lang020[g_lang] || "最后编辑时间" }}', width: 160, templet: col_render} ,{field: 'group', title: '{{ lang021[g_lang] || "关联组" }}', templet: col_render} ,{field: 'act', title: '{{ lang022[g_lang] || "操作" }}', align: 'right', width: 120, templet: '#tpl_td_action' } ]] });       /* 事件绑定 */     util.event('sac_tmpl_event', event_center);      table.on('tool(tab_sac_tmpl_list)', function(obj){         event_center[obj.event](obj);     });      form.on('input-affix(clear_tmpl_search)', table_search);     form.on('submit(submit_tmpl_search)', function(obj){ table_search(); return false; }); }); </script>