var 
    // 不限于<form />控件, 子控件包含有效的表单控件即可(input/select/textarea...)
    $form = $('.form'),
    // 如果启用mvvm模式, 可以通过修改数据直接控制表单控件
    mvvm = true,
    // 是否打印日志
    dev = true; 
var form = new jsu.Form($form, mvvm, dev);

// 获取数据
var formData = form.data();
// 如果开启mvvm模式该接口只需要调用一次, 后续数据获取或修改直接通过引用即可
formData.text = 'bar';
// 目前不支持复杂属性操作, formData.checkbox.push('foo'); 但可以通过手动 setter 来刷新
formData.checkbox.push('foo');
formData.checkbox = formData.checkbox;

// 回填数据  
// 自动忽略表单控件不存在的属性([name])
form.data(formData);

es = {
    success: function(res){console.log('校验成功')}, 
    failed: function(res){console.log('校验失败')}, 
    completed: function() {console.log('校验完成')} 
}

var 
    // 树容器
    $tree = $('.container .tree'),
    // 自动初始化
    autoInit = true,
    // 是否打印日志
    dev = true; 
var tree = new jsu.Tree($tree, autoInit, dev);

tree.events({
    loaded: function () {
        logger.info('>>>>>>>>>>     加载完成', arguments);
    },
    destroyed: function () {
        logger.info('>>>>>>>>>>     卸载完成', arguments);
    },
    beforeAppend: function () {
        logger.info('>>>>>>>>>>     节点追加前', arguments);
        // return false;
    },
    afterAppend: function () {
        logger.info('>>>>>>>>>>     节点追加后', arguments);
    },
    updated: function () {
        logger.info('>>>>>>>>>>     更新完成,', arguments);
    },
    beforeExpand: function () {
        logger.info('>>>>>>>>>>     子节点展开前', arguments);
        // return false;
    },
    afterExpand: function () {
        logger.info('>>>>>>>>>>     子节点展开后', arguments);
    },
    beforeClose: function () {
        logger.info('>>>>>>>>>>     子节点关闭前', arguments);
    },
    afterClose: function () {
        logger.info('>>>>>>>>>>     子节点关闭后', arguments);
    }
});

var 
    // 分页条容器
    $pager = $('.pager'),
    // 自动初始化
    autoInit = true,
    // 调试日志
    dev = true;
var pager = new jsu.Pager($pager, autoInit, dev);

pagerData = {
    // 总条数
    total: 20,
    // 当前页码
    index: 1
}

pager.events({
    loaded: function () {
        logger.info('>>> 加载完成', arguments);
    },
    before: function (index) {
        logger.info('>>> 跳转到指定页之前', arguments);
        return index;
    },
    formatter: function (resp) {
        logger.info('>>> 数据格式化', arguments);
        if (true === resp['flag'])
            return resp.data;
        logger.warn('服务器处理失败', resp);
        return {data: [], total: 0, index: 1};
    },
    after: function (data, conf) {
        logger.info('>>> 跳转到指定页之后', arguments);
    },
    destroyed: function () {
        logger.info('>>> 卸载之后', arguments);
    }
});

var 
    // 表格容器
    $table = $('.table'),
    // 自动初始化
    autoInit = true,
    // 调试日志
    dev = true;
var table = new jsu.Table($table, autoInit, dev);

table.events({
   cellReady: function () {
       logger.info('cellReady', arguments);
   },
   rowReady: function () {
       logger.info('rowReady', arguments);
   },
   updated: function () {
       logger.info('updated', arguments);
   },
   mouseEnter: function () {
       logger.info('mouseEnter', arguments);
   },
   mouseLeave: function () {
       logger.info('mouseLeave', arguments);
   },
   click: function () {
       logger.info('click', arguments);
   },
   action: function () {
       logger.log('table action', arguments);
   },
   expandOpen: function (row, $container) {
       logger.info('expandOpen', arguments);
       // return false;
   },
   expandOpened: function (row, $container) {
       logger.info('expandOpened', arguments);
   },
   expandClose: function () {
       logger.info('expandClose', arguments);
       // return false;
   },
   expandClosed: function () {
       logger.info('expandClosed', arguments);
   }
});