skyeye项目-showGrid插件的使用

showGrid是作者自己封装的一款非表格展示插件，支持分页展示，数据回显，列表展示等。

项目地址：https://gitee.com/doc_wei01_admin/skyeye
插件使用方法：

showGrid({
    id: "showForm",//id 加载模块展示的位置
    url: reqBasePath   "icon001",//请求url
    params: {},//参数
    pagination: true,//是否分页，默认不分页
    pagesize: 10,//页显示，默认10
    pageindex: 1,//第几页，默认1
    pageClickBefore: function(index){},//点击分页之前的回调函数
    pageClickAfter: function(index){},//点击分页之后的回调函数
    ajaxSendBefore:function(json){},//ajax请求之前的回调函数
    template: getFileContent('tpl/syseveicon/icon-item.tpl'),//模板
    ajaxSendLoadBefore: function(hdb){},//ajax请求之后的加载数据之前的回调函数
    options: {'click .del':function(index, row){}},//按钮监听事件
    ajaxSendAfter:function(json){}//ajax请求之后的回调函数
});

该模板插件依赖于 Handlebars.

下拉框使用案例：

模板文件（名称：select-option.tpl）

<option value="">全部</option>
{{#each rows}}
    <option value="{{id}}">{{name}}</option>
{{/each}}

js内容

showGrid({
    id: "sysFirstType",
    url: reqBasePath   "sysevewintype012",
    params: {},
    pagination: false,
    template: getFileContent('tpl/template/select-option.tpl'),
    ajaxSendLoadBefore: function(hdb){
    },
    ajaxSendAfter:function(json){
        form.render('select');
    }
});

案例效果图：

下拉菜单的使用：

系统图标展示的使用：

应用商店的使用：

系统背景设置的使用：

插件的好处：摆脱了大量繁重的代码，使开发更具效率，更加容易维护。

 项目交流：

QQ群	公众号