vesh-cli/template/Part/accordion.js

码农村nodejs版本VESH框架脚手架搭建器

(function(V, W, $) {
    V.registScript('../../part/ref/accordion.css', function(path, vm) {
        var _ = this,
            __ = {}; {
            V.inherit.apply(_, [W.Control, [path || '<ul class="p_accordion_contain"></ul>', vm || { data: { columns: {}, nodata: '没有找到任何数据', key: '', waittime: 100 } }]]);
            __.values = {};
            __.onLoad = _.onLoad;
            __.render = _.render;
            __.content = '<li data-index="{_index}"><a vid="{PID}" name="menu" id="{PID}" href="#">{Name}</a><ul></ul></li>';
            _.addDesc('事件：');
            _.addDesc('click:点击事件');
            _.addDesc('属性');
            _.addDesc('values:[{PID,Name,children:[]}]');
            _.addDesc('select:选中');
        }
        _.onLoad = function(node) {
            _.body = node;
            node.empty();
            V.forC(_.events, function(k, v) {
                switch (k.toLowerCase()) {
                    case 'hover':
                    case 'click':
                        break;
                    default:
                        _.bindEvent(_.node, k, v);
                        break;
                }
            }, function() {
                _.body.on('click', 'a,input,.click', function(e) {
                    var _this = $(this);
                    var li = $(_this.parents('li[data-index]').get(0));
                    _.call('click', { e: e, value: __.values[li.attr('data-index')], vid: _this.attr('vid') || _this.val() || _this.attr('href'), name: _this.attr('name') });
                    _.expand(_this, li);
                    V.stopProp(e);
                    return e.target.nodeName != 'A';
                });
                __.onLoad(node)
            });
        };
        _.fill = function() {
            return {
                ids: (function() {
                    var sb = [];
                    _.body.find(':checked[value]').each(function(i, v) { sb.push(v.getAttribute('value')); });
                    return sb.join(';');
                })()
            }
        };
        _.each = function(v, node, call) {
            V.each(v, function(v2) {
                v2._index = V.random();
                __.values[v2._index] = (V.merge({}, v2));
                var par = $(V.format(__.content, v2)).appendTo(node.children('ul').length > 0 ? node.children('ul') : node);
                if (v2.children && v2.children.length > 0) {
                    _.each(__.values[v2._index].children, par, null);
                    par.find('a:first').addClass('inactive');
                }
            }, call, true);
        };
        //执行展开动画
        _.expand = function(_this, li) {
            if (_this.hasClass('active') || _this.hasClass('inactive'))
                if (_this.siblings('ul').css('display') == 'none') {
                    _this.removeClass('inactive').addClass('active');
                    _this.siblings('ul').slideDown(_.vm.data.waittime);
                    if (li.siblings('li').children('ul').css('display') == 'block') {
                        li.siblings('li').find('a.active').addClass('inactive').removeClass('active');
                        li.siblings('li').children('ul').slideUp(_.vm.data.waittime);
                    }
                } else {
                    //控制自身变成+号
                    _this.removeClass('active').addClass('inactive');
                    //控制自身菜单下子菜单隐藏
                    _this.siblings('ul').slideUp(_.vm.data.waittime);
                    //控制自身子菜单变成+号
                    _this.siblings('ul').find(' a.inactive').removeClass('inactive').addClass('active');
                    //控制自身菜单下子菜单隐藏
                    _this.siblings('ul').find('ul').slideUp(_.vm.data.waittime);
                    //控制同级菜单只保持一个是展开的（-号显示）
                    _this.siblings('ul').find('a.active').removeClass('active').addClass('inactive');
                }
        }
        _.render = function(data) {
            var rebuild = false;
            V.forC(data, function(k, v) {
                switch (k.toLowerCase()) {
                    case 'values':
                        //PID,Name,children
                        if (k.toLowerCase() == 'values') __.values = {};
                        if (_.body.children('li.nodata').length > 0) { _.body.children('li.nodata').remove(); }
                        if (v.length == 0 && k.toLowerCase() == 'values' && _.get().nodata) {
                            _.body.html('<li class="nodata">' + _.get().nodata + '</li>');
                        } else {
                            _.each(v, _.body.empty(), function() {
                                _.vm.data.values = __.values;
                                _.body.find('a.inactive').css('background-position-x', _.body.width() - 25);
                                _.body.children('li:even').addClass('p_li_even');
                                _.body.children('li:odd').addClass('p_li_odd');
                                /*_.body.children('li').off('mouseenter').off('mouseover').off('mouseleave').hover(
                                    function(e) {
                                        var _this = $(this).addClass('p_list_hover');
                                        var li = _this;
                                        _this = _this.find('.click:first');
                                        _.call('hover', { e: e, hover: true, value: __.values[li.attr('data-index')], vid: _this.attr('vid') || _this.val() || _this.attr('href'), name: _this.attr('name') }, true);
                                    },
                                    function(e) {
                                        var _this = $(this).removeClass('p_list_hover');
                                        var li = _this;
                                        _this = _this.find('.click:first');
                                        _.call('hover', { e: e, hover: false, value: __.values[li.attr('data-index')], vid: _this.attr('vid') || _this.val() || _this.attr('href'), name: _this.attr('name') }, true);
                                    }
                                );*/
                                if (data.select)
                                    _.body.find('li[data-index=' + data.select + ']').addClass('active').siblings().removeClass('active');
                            });
                        }
                        break;
                    case 'select':
                        if (v._index)
                            _.body.find('li[data-index=' + v._index + ']').addClass('active').siblings().removeClass('active');
                        else {
                            var a = _.body.find('a[vid="' + v + '"]');
                            if (a) {
                                a.parent('li').addClass('active').siblings().removeClass('active');
                                _.expand(a, a.parent('li'));
                            }
                        }
                        break;
                }
            }, function() {
                data = __.render(data);
            });
        }
    });
})(VJ, VJ.view, jQuery);