码迷,mamicode.com
首页 > Web开发 > 详细

js基于Layui模块化封装

时间:2018-10-16 20:20:17      阅读:994      评论:0      收藏:0      [点我收藏+]

标签:actionbar   cal   layer   配置   ret   bind   ext   code   动态   

//设置body高度
$(function () {
    var topHei = 0;
    var CH = window.innerHeight || document.documentElement.clientHeight;
    document.getElementsByTagName("body")[0].style.height = CH - topHei + ‘px‘;
    return CH - topHei;
});

//-------------对UI中表格进行模块化封装处理-----------------------------------
var laytable;
//基础参数配置
var baseCfg = {
    datatype: ‘table‘,
    page: { //支持传入 laypage 组件的所有参数(某些参数除外,如:jump/elem) - 详见文档
        layout: [‘limit‘, ‘count‘, ‘prev‘, ‘page‘, ‘next‘, ‘skip‘] //自定义分页布局
                , groups: 3 //只显示 1 个连续页码
                , first: false //不显示首页
                , last: false //不显示尾页
                , limit: 5
                , curr: location.hash.replace(‘#!fenye=‘, ‘‘) //获取起始页
  , hash: ‘fenye‘ //自定义hash值
    }
  , height: 415
  , id: ‘TableDataReload‘
  , method: "post"
};

var le= le|| {};
(function () {
    var commerical = function (cusCfg) {
        this.config = {};
        $.extend(this.config, baseCfg);
        $.extend(this.config, cusCfg);
        this.__init(this.config);
        this.__bindEvent();
    };
    commerical.prototype = {
        __init: function (cfg) {
            layui.use([‘table‘], function () {
                laytable = layui.table;
                laytable.render(cfg);
                if (cfg.actionBar) {
                    laytable.on(‘tool(‘ + cfg.actionBarFilter + ‘)‘, function (obj) {
                        var data = obj.data;
                        var type = obj.event;
                        active[type] ? active[type].call(this, data) : ‘‘;
                    });
                }
            });
        },
        __bindEvent: function () {
            //动态绑定全局.layui-btn按钮事件
            $(‘.layui-btn‘).on(‘click‘, function () {
                var type = $(this).data(‘type‘);
                active[type] ? active[type].call(this) : ‘‘;
            });
        }
    };
    le.sy = function () {
        return {
            init: function (config) {
                try {
                    if (config == undefined || config == null) {
                        throw ‘config is empty!‘;
                    } else {
                        return new commerical(config);
                    }
                } catch (e) {
                    return e;
                }
            },
            reload: function (obj) {
                laytable.reload(‘TableDataReload‘, {
                    where: obj
                });
            },
            layerOpen: function (domId,title) {
                layer.open({
                    type: 1,
                    shade: 0.8,
                    btnAlign: ‘c‘,
                    resize: false,
                    title: title||"编辑",
                    area: [‘440px‘, ‘410px‘],
                    offset: [‘100px‘, ‘200px‘],
                    content: $(‘#‘ + domId)
                });
            },
            layerClose: function () {

            },
            msg: function (msg) {
                layer.msg(msg);
            }
        }
    }();
})();

 

js基于Layui模块化封装

标签:actionbar   cal   layer   配置   ret   bind   ext   code   动态   

原文地址:https://www.cnblogs.com/micnote/p/9800306.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!